/* Jefferson Academy Secondary — AI Guide theme
   School colors: black + #d7cd89. Loaded after Tailwind; overrides its palette. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --ja-bg:        #0a0a0b;
  --ja-surface:   #151517;
  --ja-surface-2: #1d1d20;
  --ja-line:      #2f2f33;
  --ja-line-soft: #232326;

  --ja-gold:      #d7cd89;
  --ja-gold-text: #e4ddab;
  --ja-gold-dim:  #8f8850;
  --ja-gold-tint: #221f13;
  --ja-gold-tint-2: #2c2817;

  --ja-caution:      #c98570;
  --ja-caution-text: #e0a692;
  --ja-caution-dim:  #7d4f40;
  --ja-caution-tint: #26170f;

  --ja-text:   #ececea;
  --ja-muted:  #a5a5a0;
  --ja-faint:  #7a7a76;

  --ja-radius: 8px;
  --ja-shadow-sm: 0 1px 2px rgba(0,0,0,.6);
  --ja-shadow-md: 0 4px 14px rgba(0,0,0,.55);
  --ja-shadow-lg: 0 12px 32px rgba(0,0,0,.6);
}

html { background: var(--ja-bg); }
body {
  background: var(--ja-bg) !important;
  color: var(--ja-text) !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
h1, h2, h3, h4, h5 { font-family: 'Inter', system-ui, sans-serif; font-weight: 600; letter-spacing: -0.01em; }
::selection { background: rgba(215,205,137,.28); color: var(--ja-text); }
a { color: var(--ja-gold-text) !important; }
a:hover { color: var(--ja-gold) !important; }
.nav-dropdown-content a, .mobile-menu a, nav a { color: var(--ja-text) !important; }
:focus-visible { outline: 2px solid var(--ja-gold); outline-offset: 2px; }

/* ---------- surfaces ---------- */
.bg-white, .bg-gray-50, .bg-gray-100 { background-color: var(--ja-surface) !important; }
.bg-gray-50, .bg-gray-100 { background-color: var(--ja-surface-2) !important; }
body.bg-gray-50, body.bg-gray-100, body.bg-white { background-color: var(--ja-bg) !important; }

/* brand-family tints (indigo/purple/blue/cyan/teal/green/amber/yellow) -> gold */
.bg-indigo-50,.bg-indigo-100,.bg-purple-50,.bg-purple-100,.bg-purple-200,
.bg-blue-50,.bg-blue-100,.bg-cyan-50,.bg-cyan-100,.bg-teal-50,.bg-teal-100,
.bg-green-50,.bg-green-100,.bg-amber-50,.bg-amber-100,.bg-yellow-50,.bg-yellow-100 {
  background-color: var(--ja-gold-tint) !important;
}
.bg-indigo-100,.bg-purple-100,.bg-purple-200,.bg-blue-100,.bg-cyan-100,
.bg-teal-100,.bg-green-100,.bg-amber-100,.bg-yellow-100 { background-color: var(--ja-gold-tint-2) !important; }

/* caution family */
.bg-red-50,.bg-rose-50 { background-color: var(--ja-caution-tint) !important; }
.bg-red-100,.bg-rose-100 { background-color: #301c14 !important; }

/* solid marks: dots, icon chips, rules */
.bg-indigo-500,.bg-purple-500,.bg-blue-500,.bg-blue-600,.bg-teal-500,
.bg-green-500,.bg-green-600,.bg-amber-500,.bg-amber-600 { background-color: var(--ja-gold) !important; }
.bg-indigo-900,.bg-purple-900,.bg-blue-900,.bg-teal-900,.bg-green-900,
.bg-amber-900,.bg-yellow-900 { background-color: var(--ja-gold-tint-2) !important; }
.bg-red-900,.bg-rose-900 { background-color: #301c14 !important; }
.bg-red-500,.bg-red-600 { background-color: var(--ja-caution) !important; }

/* ---------- text ---------- */
.text-gray-900,.text-gray-800 { color: var(--ja-text) !important; }
.text-gray-700 { color: #d3d3cf !important; }
.text-gray-600,.text-gray-500 { color: var(--ja-muted) !important; }
.text-gray-400,.text-gray-300,.text-gray-200 { color: var(--ja-faint) !important; }
.text-white { color: var(--ja-text) !important; }
.text-blue-100 { color: var(--ja-muted) !important; }

.text-indigo-600,.text-indigo-700,.text-indigo-800,
.text-purple-600,.text-purple-700,.text-purple-800,
.text-blue-600,.text-blue-700,.text-blue-800,
.text-cyan-600,.text-teal-600,.text-teal-800,
.text-green-600,.text-green-700,.text-green-800,
.text-amber-600,.text-amber-700,.text-amber-800,
.text-yellow-400,.text-yellow-600,.text-yellow-800,
.text-indigo-900,.text-purple-900,.text-blue-900,.text-cyan-900,.text-teal-900,
.text-green-900,.text-amber-900,.text-yellow-900 { color: var(--ja-gold-text) !important; }

.text-red-600,.text-red-700,.text-red-800,
.text-red-900,.text-rose-900 { color: var(--ja-caution-text) !important; }

/* ---------- borders ---------- */
.border-gray-200,.border-gray-300,.border-gray-500 { border-color: var(--ja-line) !important; }
.border-white { border-color: var(--ja-line) !important; }
.border-indigo-200,.border-purple-200,.border-blue-200,.border-cyan-200,
.border-teal-200,.border-green-200,.border-amber-200,.border-yellow-200,
.border-green-300,.border-amber-300,.border-blue-300,.border-teal-400,
.border-purple-400,.border-yellow-400 { border-color: rgba(215,205,137,.28) !important; }
.border-indigo-500,.border-purple-500,.border-purple-600,.border-blue-500,
.border-cyan-500,.border-teal-500,.border-green-500,.border-amber-500,
.border-yellow-500 { border-color: var(--ja-gold) !important; }
.border-red-200,.border-red-300,.border-red-400 { border-color: rgba(201,133,112,.32) !important; }
.border-red-500,.border-rose-500 { border-color: var(--ja-caution) !important; }

/* ---------- hovers ---------- */
.hover\:bg-gray-50:hover { background-color: var(--ja-surface-2) !important; }
.hover\:bg-green-50:hover,.hover\:bg-amber-50:hover,.hover\:bg-indigo-200:hover { background-color: var(--ja-gold-tint-2) !important; }
.hover\:bg-red-50:hover { background-color: #301c14 !important; }
.hover\:border-green-500:hover,.hover\:border-amber-500:hover,
.hover\:border-blue-500:hover,.hover\:border-indigo-400:hover { border-color: var(--ja-gold) !important; }
.hover\:text-indigo-800:hover { color: var(--ja-gold) !important; }

/* ---------- gradients: flattened to black ---------- */
[class*="bg-gradient-to"] {
  background-image: none !important;
  background-color: transparent !important;
}
header[class*="bg-gradient-to"] {
  background-color: #000 !important;
  border-bottom: 1px solid var(--ja-line);
  box-shadow: none !important;
}
header[class*="bg-gradient-to"] h1 { color: var(--ja-gold) !important; font-weight: 600; }
header[class*="bg-gradient-to"] p { color: var(--ja-muted) !important; }
footer[class*="bg-gradient-to"] {
  background-color: #000 !important;
  border-top: 1px solid var(--ja-line);
  color: var(--ja-faint) !important;
}
footer[class*="bg-gradient-to"] p { color: var(--ja-faint) !important; }

/* ---------- elevation ---------- */
.shadow, .shadow-md, .shadow-lg, .shadow-xl, .shadow-2xl {
  box-shadow: var(--ja-shadow-md) !important;
  border: 1px solid var(--ja-line-soft);
}
.shadow-sm { box-shadow: var(--ja-shadow-sm) !important; }

/* ---------- navigation (page-level inline styles use indigo) ---------- */
nav.bg-white, nav.shadow { background-color: #000 !important; border: none !important;
  border-bottom: 1px solid var(--ja-line) !important; box-shadow: none !important; }

.nav-btn {
  background-color: transparent !important;
  color: var(--ja-gold) !important;
  border: 1px solid rgba(215,205,137,.45) !important;
  border-radius: var(--ja-radius) !important;
  box-shadow: none !important;
  font-weight: 500 !important;
}
.nav-btn:hover { background-color: rgba(215,205,137,.10) !important; border-color: var(--ja-gold) !important; transform: none !important; }
.nav-btn:active { background-color: rgba(215,205,137,.18) !important; }

.nav-dropdown-content {
  background-color: var(--ja-surface) !important;
  border: 1px solid var(--ja-line) !important;
  border-radius: var(--ja-radius) !important;
  box-shadow: var(--ja-shadow-lg) !important;
}
/* no caret; the panel meets the button so the pointer never crosses a gap */
.nav-dropdown-content { margin-top: 0 !important; }
.nav-dropdown-content::before {
  content: '' !important;
  border: none !important;
  top: -10px !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: 10px !important;
  transform: none !important;
  background: transparent !important;
}
.nav-dropdown-content a { color: var(--ja-text) !important; }
.nav-dropdown-content a:hover { background-color: rgba(215,205,137,.10) !important; color: var(--ja-gold) !important; }

.mobile-menu { background: var(--ja-surface) !important; border: 1px solid var(--ja-line); }
.mobile-menu a { color: var(--ja-text) !important; }
.mobile-menu a:hover { background-color: rgba(215,205,137,.10) !important; color: var(--ja-gold) !important; }
.mobile-menu .menu-section { border-bottom-color: var(--ja-line) !important; }
.mobile-menu .menu-label { color: var(--ja-gold-dim) !important; }

/* ---------- password gate ---------- */
.password-overlay { background: #000 !important; }
.password-modal {
  background: var(--ja-surface) !important;
  border: 1px solid var(--ja-line);
  border-radius: var(--ja-radius) !important;
  box-shadow: var(--ja-shadow-lg) !important;
}
.password-modal h2 { color: var(--ja-gold) !important; }
.password-modal p { color: var(--ja-muted) !important; }
.password-input {
  background: var(--ja-bg) !important;
  color: var(--ja-text) !important;
  border: 1px solid var(--ja-line) !important;
  border-radius: var(--ja-radius) !important;
}
.password-input:focus { border-color: var(--ja-gold) !important; }
.password-input.error { border-color: var(--ja-caution) !important; }
.password-btn {
  background: transparent !important;
  color: var(--ja-gold) !important;
  border: 1px solid var(--ja-gold) !important;
  border-radius: var(--ja-radius) !important;
}
.password-btn:hover { background: rgba(215,205,137,.12) !important; transform: none !important; box-shadow: none !important; }
.password-error { color: var(--ja-caution-text) !important; }
.password-logo { background: rgba(215,205,137,.12) !important; border: 1px solid rgba(215,205,137,.35); border-radius: var(--ja-radius) !important; }
.password-logo svg { color: var(--ja-gold) !important; }

/* ---------- misc component polish ---------- */
.rounded-2xl, .rounded-xl, .rounded-lg { border-radius: var(--ja-radius) !important; }
.section-card, .card { background-color: var(--ja-surface) !important; }
hr { border-color: var(--ja-line) !important; }
table th { color: var(--ja-gold-text) !important; }
input, textarea, select { background: var(--ja-bg); color: var(--ja-text); border-color: var(--ja-line); }
button:focus-visible, a:focus-visible { outline: 2px solid var(--ja-gold); outline-offset: 2px; }

/* ---------- page-local components (prompt boxes, hero cards) ---------- */
.prompt-box {
  background: var(--ja-gold-tint) !important;
  background-image: none !important;
  color: var(--ja-text) !important;
  border: 1px solid rgba(215,205,137,.28);
  border-radius: var(--ja-radius) !important;
}
.prompt-box strong, .prompt-box b { color: var(--ja-gold-text) !important; }
.technique-card, .section-card { background-color: var(--ja-surface) !important; }

/* ---------- traffic-light assignment labels (vibrant, opt out of the mono ramp) ---------- */
.ja-signal { border: 2px solid; }
.ja-signal p { color: inherit !important; }
.ja-signal p.font-bold { font-size: 1.05rem; }
.ja-signal-green  { background: rgba(34,197,94,.12)  !important; border-color: #34d399 !important; color: #6ee7a8 !important; }
.ja-signal-yellow { background: rgba(245,190,60,.12) !important; border-color: #f5c451 !important; color: #f7d383 !important; }
.ja-signal-red    { background: rgba(239,68,68,.12)  !important; border-color: #f4726b !important; color: #f79b96 !important; }