/* ================================
   Admin Section Icons in Header
   ================================ */

.admin-header-sections {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0 auto;
}

.admin-header-section-item {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 1rem;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--terminal-text-muted);
  text-decoration: none;
  border-radius: 0.25rem;
  transition: color 0.2s ease, background 0.2s ease;
  white-space: nowrap;
}

.admin-header-section-item:hover {
  color: var(--terminal-text-light);
  background: rgba(34, 211, 238, 0.08);
}

.admin-header-section-active {
  color: var(--terminal-primary);
  background: rgba(34, 211, 238, 0.12);
}

.admin-header-section-item svg {
  flex-shrink: 0;
}

.admin-header-section-label {
  /* Visible by default, hidden on mobile */
}

/* ================================
   Admin Tab Bar
   ================================ */

.admin-tab-bar {
  position: fixed;
  top: 4rem; /* Directly below header (no section bar anymore) */
  left: 16rem;
  right: 0;
  background: rgba(2, 6, 23, 0.90);
  border-bottom: 1px solid var(--terminal-dim);
  z-index: calc(var(--z-nav) - 1);
  backdrop-filter: blur(10px);
}

.admin-tab-bar-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0 0.75rem;
  gap: 0;
}

.admin-tab {
  padding: 0.625rem 0.75rem;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.03em;
  color: var(--terminal-text-muted);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
  white-space: nowrap;
}

.admin-tab:hover {
  color: var(--terminal-text-light);
}

.admin-tab-active {
  color: var(--terminal-primary);
  border-bottom-color: var(--terminal-primary);
}

/* Group separators within tab bar */
.admin-tab-separator {
  display: inline-flex;
  align-self: center;
  width: 1px;
  height: 1rem;
  background: var(--terminal-border);
  margin: 0 0.25rem;
}

/* ================================
   Admin Main Content Offset
   ================================ */

.admin-main {
  margin-left: 16rem;
  min-height: calc(100vh - 4rem);
  padding: 2rem;
  position: relative;
  z-index: var(--z-content);
}

/* ================================
   Medium Screens (1025-1280px)
   Sidebar collapses to 4.5rem
   ================================ */

@media (min-width: 1025px) and (max-width: 1280px) {
  .admin-tab-bar {
    left: 4.5rem;
  }

  .admin-main {
    margin-left: 4.5rem;
  }

  .admin-header-section-label {
    display: none;
  }
}

/* ================================
   Mobile (<1024px)
   No sidebar, full width
   ================================ */

@media (max-width: 1024px) {
  .admin-header-sections {
    display: none;
  }

  .admin-tab-bar {
    left: 0;
  }

  .admin-main {
    margin-left: 0;
    padding: 1rem;
  }

  .admin-tab {
    font-size: var(--fs-micro, 0.625rem);
    padding: 0.375rem 0.5rem;
  }
}

/* ================================
   Sticky Table Headers — offset for tab bar
   ================================ */

.admin-main .terminal-table-sticky th {
  top: calc(6.75rem - 7px); /* 4rem header + ~2.75rem tab bar, nudged up to cover scroll bleed */
}

/* ================================
   Print
   ================================ */

@media print {
  .admin-header-sections,
  .admin-tab-bar {
    display: none !important;
  }
}