/**
 * CRS NAV BUTTON REFINEMENT
 * Purpose: Remove Fisher-Price energy; add broadcast console authority
 * Target: Header nav buttons (Studio, Workshop Café, AV)
 * NOT applied to: BOOK NOW (different class, keeps pulse)
 * 
 * Key Changes:
 * - Height: 44-48px → 30-34px
 * - Padding: 14-18px vertical → 6-8px vertical
 * - Border: Thick glow → 1px idle / intensify on hover
 * - Font: Over-scaled → compressed with letter-spacing
 * - Color: Full neon → muted idle / bright active
 */

/* === CORE NAV BUTTON REFINEMENT === */

.nav-button {
  /* Size compression (critical fix) */
  font-size: 0.72rem !important;       /* ~11.5px — authority, not loudness */
  letter-spacing: 0.12em !important;   /* spacing does the work, not size */
  padding: 6px 14px !important;        /* tight vertical, balanced horizontal */
  height: 32px !important;             /* compress from ~44-48px */
  
  /* Border discipline */
  border: 1px solid currentColor !important;  /* thin idle border */
  border-radius: 3px !important;              /* subtle, not chunky */
  background: transparent !important;
  
  /* Typography authority */
  text-transform: uppercase !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  
  /* Clean transitions */
  transition: 
    color 0.2s ease,
    background-color 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease !important;
  
  /* Subtle depth (barely perceptible) */
  text-shadow: 0 0 2px rgba(0,0,0,0.6) !important;
}

/* === COLOR STATES: IDLE (MUTED) === */

/* Studio - VU Green (idle: darker) */
.nav-button.nav-studio {
  color: #2d8a1f !important;           /* darker green, "armed but idle" */
  border-color: #2d8a1f !important;
}

/* Workshop Café - Warm Amber (idle: brass) */
.nav-button.nav-cafe {
  color: #b8860b !important;           /* brass/dark gold, "idle" */
  border-color: #b8860b !important;
}

/* AV - Red (idle: deep oxide) */
.nav-button.nav-av {
  color: #8b1a1a !important;           /* deep oxide red, "idle" */
  border-color: #8b1a1a !important;
}

/* === COLOR STATES: HOVER (ARMED/ACTIVE) === */

/* Studio - VU Green (active: bright) */
.nav-button.nav-studio:hover {
  color: #0b0b0b !important;           /* black text on bright background */
  background-color: #39FF14 !important; /* bright VU green */
  border-color: #39FF14 !important;
  box-shadow: 0 0 6px rgba(57, 255, 20, 0.4) !important;
}

/* Workshop Café - Warm Amber (active: gold) */
.nav-button.nav-cafe:hover {
  color: #0b0b0b !important;
  background-color: #D4A017 !important; /* bright mustard gold */
  border-color: #D4A017 !important;
  box-shadow: 0 0 6px rgba(212, 160, 23, 0.4) !important;
}

/* AV - Red (active: signal red) */
.nav-button.nav-av:hover {
  color: #fff !important;               /* white text on bright red */
  background-color: #C41E3A !important; /* bright signal red */
  border-color: #C41E3A !important;
  box-shadow: 0 0 6px rgba(196, 30, 58, 0.4) !important;
}

/* === RESPONSIVE: MAINTAIN COMPRESSION === */

/* Tablet: keep tight proportions */
@media (max-width: 768px) {
  .nav-button {
    font-size: 0.70rem !important;
    padding: 5px 12px !important;
    height: 30px !important;
  }
}

/* Mobile: hide Workshop Café, keep tight on remaining buttons */
@media (max-width: 640px) {
  .nav-button {
    font-size: 0.68rem !important;
    padding: 5px 10px !important;
    height: 28px !important;
  }
}

/* === 55" TERMINAL: MAINTAIN AUTHORITY AT SCALE === */

@media (min-width: 1920px) {
  .nav-button {
    font-size: 0.75rem !important;     /* slightly larger but still compressed */
    padding: 7px 16px !important;
    height: 34px !important;
  }
}

/* === ENSURE BOOK NOW STAYS SEPARATE === */

/* Book Now button should NOT inherit these styles */
/* It has its own pulse animation and treatment */
.book-now,
.nav-book-now,
button[class*="book"] {
  /* Explicitly exclude from nav-button refinement */
  /* Book Now keeps its own CSS from crs-industrial-pulse.css */
}

/* === FOOTER CONTACT LINK (IF PRESENT) === */

/* If Contact appears in footer, it should NOT get nav-button treatment */
footer .nav-button {
  all: revert !important;
}