/* ============================================
   AKME DESIGN SYSTEM 2026 V2 - SMART NAVIGATOR
   Layer 2b: Extensao aviacao (cockpit)
   Herda: foundation.css (OBRIGATORIO)
   Uso: Smart Navigator EFB, PFD, Maps,
        FlightPlan, Weather, Nearest, Tools
   ============================================

   IMPORT ORDER:
   1. foundation.css
   2. cockpit-tokens.css  <-- este arquivo

   MUDANCA V1 -> V2:
   - Fonte migrada de Roboto para Inter (foundation)
   - Roboto Mono -> JetBrains Mono (foundation fallback)
   - Tokens renomeados de --cockpit-* para --sn-*
   - Prefixo --sn = Smart Navigator
   - Cores ICAO/FAA preservadas integralmente
   ============================================ */

:root {
  /* === SMART NAVIGATOR PRIMARY (sky/cyan) === */
  --sn-primary-300:  #7dd3fc;   /* sky-300 */
  --sn-primary-400:  #38bdf8;   /* sky-400 - SN brand */
  --sn-primary-500:  #0ea5e9;   /* sky-500 */
  --sn-primary-600:  #0284c7;   /* sky-600 */

  --sn-primary:      var(--sn-primary-400);
  --sn-primary-hover:var(--sn-primary-500);
  --sn-primary-soft: rgba(56, 189, 248, 0.1);
  --sn-primary-text: var(--sn-primary-400);

  /* === SN ACCENT (purple - branding) === */
  --sn-accent:       #a855f7;   /* purple-500 */
  --sn-accent-hover: #9333ea;   /* purple-600 */
  --sn-accent-soft:  rgba(168, 85, 247, 0.1);

  /* === ICAO/FAA SEMANTIC COLORS ===
     Cores de aviacao padrao internacional.
     NAO ALTERAR - sao normatizadas. */

  /* Active/OK - Verde brilhante (GPS lock, on track) */
  --sn-active:       #00ff00;
  --sn-active-dim:   #00cc00;
  --sn-active-soft:  rgba(0, 255, 0, 0.1);

  /* Info/Data - Sky (SN Primary) */
  --sn-info:         #38bdf8;   /* = sn-primary */
  --sn-info-dim:     #0ea5e9;
  --sn-info-soft:    rgba(56, 189, 248, 0.1);

  /* Standby/Pending - Amarelo (verificar) */
  --sn-standby:      #ffcc00;
  --sn-standby-dim:  #cc9900;
  --sn-standby-soft: rgba(255, 204, 0, 0.1);

  /* Caution/Warning - Ambar (atencao) */
  --sn-caution:      #ff9900;
  --sn-caution-dim:  #cc7700;
  --sn-caution-soft: rgba(255, 153, 0, 0.15);

  /* Critical/Danger - Vermelho (acao imediata) */
  --sn-critical:     #ff0000;
  --sn-critical-dim: #cc0000;
  --sn-critical-soft:rgba(255, 0, 0, 0.15);

  /* Extreme - Magenta (TAWS extreme, weather extreme) */
  --sn-extreme:      #ff00ff;
  --sn-extreme-dim:  #cc00cc;
  --sn-extreme-soft: rgba(255, 0, 255, 0.15);

  /* === NAVIGATION COLORS (Garmin Standard) === */
  --sn-route-active: #ff00ff;   /* Magenta - rota ativa */
  --sn-waypoint:     #00ffff;   /* Cyan - waypoint */
  --sn-airport:      #00d4ff;   /* Light Cyan - aeroporto */
  --sn-navaid:       #00ff00;   /* Green - VOR/NDB */

  /* === TRAFFIC COLORS (TCAS Standard) === */
  --sn-traffic-other:      #00ffff;  /* Cyan - Non-threat */
  --sn-traffic-proximity:  #00ffff;  /* Cyan - Proximity */
  --sn-traffic-advisory:   #ffcc00;  /* Yellow - Traffic Advisory */
  --sn-traffic-resolution: #ff0000;  /* Red - Resolution Advisory */

  /* === TERRAIN COLORS (TAWS Standard) === */
  --sn-terrain-safe:    #000000;  /* Black - Safe */
  --sn-terrain-caution: #ffcc00;  /* Yellow - Caution */
  --sn-terrain-warning: #ff0000;  /* Red - Warning */

  /* === WEATHER COLORS (Radar Returns) === */
  --sn-weather-light:    #00ff00;  /* Green - Light precip */
  --sn-weather-moderate: #ffff00;  /* Yellow - Moderate */
  --sn-weather-heavy:    #ff0000;  /* Red - Heavy */
  --sn-weather-extreme:  #ff00ff;  /* Magenta - Extreme */

  /* === BUTTON VARIANTS (cockpit style) === */
  --sn-btn-primary-bg:    linear-gradient(180deg, #2a2a2a 0%, #1a1a1a 100%);
  --sn-btn-primary-border:#444444;
  --sn-btn-primary-text:  var(--sn-info);

  --sn-btn-secondary-bg:    linear-gradient(180deg, #1f1f1f 0%, #0f0f0f 100%);
  --sn-btn-secondary-border:#333333;
  --sn-btn-secondary-text:  var(--f-text);

  --sn-btn-danger-bg:     linear-gradient(180deg, #3a1a1a 0%, #2a0a0a 100%);
  --sn-btn-danger-border:  var(--sn-critical);
  --sn-btn-danger-text:    var(--sn-critical);

  --sn-btn-success-bg:    linear-gradient(180deg, #1a3a1a 0%, #0a2a0a 100%);
  --sn-btn-success-border: var(--sn-active);
  --sn-btn-success-text:   var(--sn-active);

  --sn-btn-route-bg:      linear-gradient(180deg, #2a1a2a 0%, #1a0a1a 100%);
  --sn-btn-route-border:   var(--sn-route-active);
  --sn-btn-route-text:     var(--sn-route-active);

  /* === DATA DISPLAY (cockpit instruments) === */
  --sn-data-label:       var(--f-text-muted);
  --sn-data-value:       var(--f-text);
  --sn-data-unit:        var(--sn-info);
  --sn-data-value-large: 2rem;
  --sn-data-value-medium:1.5rem;
  --sn-data-value-small: 1rem;

  /* === GLOW EFFECTS (cockpit instrument glow) === */
  --sn-glow-active:   0 0 8px rgba(0, 255, 0, 0.3);
  --sn-glow-info:     0 0 8px rgba(56, 189, 248, 0.3);
  --sn-glow-caution:  0 0 8px rgba(255, 153, 0, 0.3);
  --sn-glow-critical: 0 0 8px rgba(255, 0, 0, 0.5);
  --sn-glow-route:    0 0 8px rgba(255, 0, 255, 0.3);
}

/* === DAY MODE (maior contraste para luz solar direta) === */
.sn-day {
  --f-bg:             #1e293b;   /* slate-800 */
  --f-surface:        #334155;   /* slate-700 */
  --f-surface-raised: #475569;   /* slate-600 */
  --f-surface-hover:  #64748b;   /* slate-500 */
  --f-border:         #64748b;   /* slate-500 */
  --f-border-subtle:  #475569;   /* slate-600 */
  --f-border-strong:  #94a3b8;   /* slate-400 */
  --f-text-secondary: #e2e8f0;   /* slate-200 */
  --f-text-muted:     #cbd5e1;   /* slate-300 */
}

/* === COCKPIT COMPONENT STYLES === */

/* SN Button (cockpit style - gradient + border) */
.sn-btn {
  background: var(--sn-btn-primary-bg);
  color: var(--sn-btn-primary-text);
  border: 1px solid var(--sn-btn-primary-border);
  padding: var(--f-space-2) var(--f-space-4);
  border-radius: var(--f-radius-md);
  font-weight: var(--f-weight-semi);
  font-size: var(--f-text-sm);
  text-transform: uppercase;
  letter-spacing: var(--f-tracking-wide);
  cursor: pointer;
  transition: all var(--f-transition-fast);
  min-height: var(--f-touch-comfortable);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--f-space-2);
}

.sn-btn:hover {
  box-shadow: var(--sn-glow-info);
}

.sn-btn-success {
  background: var(--sn-btn-success-bg);
  color: var(--sn-btn-success-text);
  border-color: var(--sn-btn-success-border);
}
.sn-btn-success:hover { box-shadow: var(--sn-glow-active); }

.sn-btn-danger {
  background: var(--sn-btn-danger-bg);
  color: var(--sn-btn-danger-text);
  border-color: var(--sn-btn-danger-border);
}
.sn-btn-danger:hover { box-shadow: var(--sn-glow-critical); }

.sn-btn-route {
  background: var(--sn-btn-route-bg);
  color: var(--sn-btn-route-text);
  border-color: var(--sn-btn-route-border);
}
.sn-btn-route:hover { box-shadow: var(--sn-glow-route); }

/* Telemetry Display (label + value + unit) */
.sn-telemetry {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--f-space-0-5);
  padding: var(--f-space-2) var(--f-space-3);
}

.sn-telemetry-label {
  font-size: var(--f-text-xs);
  font-weight: var(--f-weight-medium);
  color: var(--f-text-muted);
  text-transform: uppercase;
  letter-spacing: var(--f-tracking-widest);
}

.sn-telemetry-value {
  font-family: var(--f-font-mono);
  font-size: var(--sn-data-value-large);
  font-weight: var(--f-weight-bold);
  color: var(--f-text);
  line-height: var(--f-leading-none);
}

.sn-telemetry-unit {
  font-size: var(--f-text-xs);
  color: var(--sn-data-unit);
}

/* Alert banners */
.sn-alert {
  display: flex;
  align-items: center;
  gap: var(--f-space-3);
  padding: var(--f-space-3) var(--f-space-4);
  border-radius: var(--f-radius-md);
  font-size: var(--f-text-sm);
  font-weight: var(--f-weight-medium);
}

.sn-alert-info {
  background: var(--sn-info-soft);
  color: var(--sn-info);
  border: 1px solid rgba(56, 189, 248, 0.2);
}

.sn-alert-caution {
  background: var(--sn-caution-soft);
  color: var(--sn-caution);
  border: 1px solid rgba(255, 153, 0, 0.2);
}

.sn-alert-critical {
  background: var(--sn-critical-soft);
  color: var(--sn-critical);
  border: 1px solid rgba(255, 0, 0, 0.2);
}

.sn-alert-active {
  background: var(--sn-active-soft);
  color: var(--sn-active);
  border: 1px solid rgba(0, 255, 0, 0.2);
}

/* Panel (cockpit card) */
.sn-panel {
  background: var(--f-surface);
  border: 1px solid var(--f-border-subtle);
  border-radius: var(--f-radius-lg);
  overflow: hidden;
}

.sn-panel-header {
  padding: var(--f-space-3) var(--f-space-4);
  border-bottom: 1px solid var(--f-border-subtle);
  font-size: var(--f-text-xs);
  font-weight: var(--f-weight-semi);
  color: var(--f-text-muted);
  text-transform: uppercase;
  letter-spacing: var(--f-tracking-widest);
}

.sn-panel-body {
  padding: var(--f-space-4);
}

/* Data Strip (horizontal telemetry bar) */
.sn-data-strip {
  display: flex;
  align-items: center;
  background: var(--f-surface);
  border: 1px solid var(--f-border-subtle);
  border-radius: var(--f-radius-md);
  overflow: hidden;
}

.sn-data-strip-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--f-space-2) var(--f-space-3);
  flex: 1;
  border-right: 1px solid var(--f-border-subtle);
}

.sn-data-strip-item:last-child {
  border-right: none;
}

/* Semantic color utilities */
.sn-text-active   { color: var(--sn-active); }
.sn-text-info     { color: var(--sn-info); }
.sn-text-standby  { color: var(--sn-standby); }
.sn-text-caution  { color: var(--sn-caution); }
.sn-text-critical { color: var(--sn-critical); }
.sn-text-extreme  { color: var(--sn-extreme); }
.sn-text-route    { color: var(--sn-route-active); }
.sn-text-waypoint { color: var(--sn-waypoint); }