/*
 * BehavioralCompute — Global Light Theme Polish
 * Loaded last on every page to ensure overrides take effect.
 */

/* ── Base typography & layout ─────────────────────────────────────────────── */

body {
  font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── Header ───────────────────────────────────────────────────────────────── */

header {
  background: #ffffff !important;
  border-bottom: 1px solid #d0d7de !important;
  box-shadow: 0 1px 3px rgba(31,35,40,.06) !important;
}

header h1,
.logo-text h1 {
  color: #1f2328 !important;
}

.logo-text p {
  color: #57606a !important;
}

/* ── Cards & Panels ───────────────────────────────────────────────────────── */

.panel,
.product-card,
.page-link,
.stat,
.api-panel,
.trace-card,
.engine-card,
.hero,
.q-card,
.ai-panel,
.conv-chat-panel,
.conv-signals-panel {
  box-shadow: 0 1px 4px rgba(31,35,40,.08), 0 0 0 1px rgba(31,35,40,.04);
}

.panel:hover,
.product-card:hover,
.page-link:hover,
.engine-card:hover:not(.disabled) {
  box-shadow: 0 3px 10px rgba(31,35,40,.12), 0 0 0 1px rgba(31,35,40,.06);
  transform: translateY(-1px);
  transition: box-shadow .18s ease, transform .18s ease;
}

.product-card,
.page-link,
.engine-card {
  transition: box-shadow .18s ease, transform .18s ease, border-color .15s;
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */

/* Primary button — white text on blue, hover darkens */
.btn.primary,
.btn-primary {
  background: #0969da !important;
  border-color: #0969da !important;
  color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(9,105,218,.3) !important;
}
.btn.primary:hover:not(:disabled),
.btn-primary:hover:not(:disabled) {
  background: #0757ba !important;
  border-color: #0757ba !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(9,105,218,.35) !important;
}

/* Green / success buttons */
.btn.green,
.btn-success {
  border-color: #1a7f37 !important;
  color: #1a7f37 !important;
}
.btn-success {
  background: #1a7f37 !important;
  color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(26,127,55,.3) !important;
}
.btn-success:hover:not(:disabled) {
  background: #116329 !important;
  border-color: #116329 !important;
  box-shadow: 0 2px 6px rgba(26,127,55,.35) !important;
}

/* Base button subtle shadow */
.btn {
  box-shadow: 0 1px 2px rgba(31,35,40,.08) !important;
  transition: all .15s ease !important;
}
.btn:hover:not(:disabled) {
  box-shadow: 0 2px 5px rgba(31,35,40,.12) !important;
}

/* Login button */
.btn-login {
  background: #0969da !important;
  color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(9,105,218,.3) !important;
}
.btn-login:hover:not(:disabled) {
  background: #0757ba !important;
}

/* Send button in conversation */
.conv-send {
  background: #0969da !important;
  color: #ffffff !important;
}
.conv-send:hover:not(:disabled) {
  background: #0757ba !important;
}

/* ── Navigation tabs ──────────────────────────────────────────────────────── */

.ai-tab.active {
  background: #ffffff !important;
  color: #0969da !important;
  box-shadow: inset 0 -2px 0 #0969da !important;
  font-weight: 700;
}

.ai-tab:not(.active) {
  background: #f0f3f7 !important;
  color: #57606a !important;
}

.ai-tab:hover:not(.active) {
  color: #0969da !important;
  background: #f6f8fa !important;
}

/* ── Step indicator ───────────────────────────────────────────────────────── */

.step.active {
  background: #f0f6ff !important;
  border-color: #0969da !important;
  color: #0969da !important;
}
.step.active .step-num {
  background: #0969da !important;
  border-color: #0969da !important;
  color: #ffffff !important;
}
.step.done .step-num {
  background: #1a7f37 !important;
  border-color: #1a7f37 !important;
  color: #ffffff !important;
}

/* ── Badges ───────────────────────────────────────────────────────────────── */

.badge.green { border-color: #1a7f37 !important; color: #1a7f37 !important; }
.badge.blue  { border-color: #0969da !important; color: #0969da !important; }
.badge.purple{ border-color: #8250df !important; color: #8250df !important; }
.badge.warn  { border-color: #9a6700 !important; color: #9a6700 !important; }

/* ── Hero section ─────────────────────────────────────────────────────────── */

.hero {
  background: linear-gradient(135deg, #f0f6ff 0%, #ffffff 100%) !important;
  border-color: #c8d8f0 !important;
}

.hero h2 {
  color: #1f2328 !important;
  font-size: 30px !important;
}

.hero p {
  color: #57606a !important;
  font-size: 15px !important;
}

/* ── Governance banner ────────────────────────────────────────────────────── */

.governance-banner {
  background: #f0fff4 !important;
  border-color: #bbf7d0 !important;
}
.governance-banner strong { color: #1a7f37 !important; }
.governance-banner p      { color: #1f2328 !important; }

/* ── Review / warning banners ─────────────────────────────────────────────── */

.review-banner {
  background: rgba(207,34,46,.07) !important;
  border-color: #cf222e !important;
  color: #82071e !important;
  font-weight: 500;
}

.gov-preamble {
  background: rgba(9,105,218,.05) !important;
  border-color: rgba(9,105,218,.2) !important;
  color: #1f2328 !important;
}

/* ── Events panel ─────────────────────────────────────────────────────────── */

.events-panel {
  background: rgba(154,103,0,.05) !important;
  border-color: rgba(154,103,0,.25) !important;
}

.event-chip {
  background: rgba(154,103,0,.1) !important;
  border-color: #9a6700 !important;
  color: #7a5200 !important;
}

/* ── Score & confidence fills ─────────────────────────────────────────────── */

.score-track, .conf-track, .sig-track, .csig-bar, .progress-track {
  background: #e6eaf0 !important;
}

/* ── Engine cards ─────────────────────────────────────────────────────────── */

.engine-card.selected {
  background: #f0f6ff !important;
  border-color: #0969da !important;
}
.engine-card.selected .check-box {
  background: #0969da !important;
  border-color: #0969da !important;
  color: #ffffff !important;
}

/* ── Filter buttons ───────────────────────────────────────────────────────── */

.filter-btn.active {
  border-color: #0969da !important;
  color: #0969da !important;
  background: rgba(9,105,218,.07) !important;
}

/* ── API rows ─────────────────────────────────────────────────────────────── */

.api-row {
  background: #f6f8fa !important;
  border: 1px solid #e6eaf0 !important;
}

/* ── Inputs / textareas / selects ─────────────────────────────────────────── */

input, textarea, select, .conv-input, .ai-textarea {
  background: #ffffff !important;
  border-color: #d0d7de !important;
  color: #1f2328 !important;
}
input::placeholder, textarea::placeholder, .conv-input::placeholder, .ai-textarea::placeholder {
  color: #8c959f !important;
}
input:focus, textarea:focus, select:focus, .conv-input:focus, .ai-textarea:focus {
  border-color: #0969da !important;
  box-shadow: 0 0 0 3px rgba(9,105,218,.12) !important;
  outline: none !important;
}

/* ── Chat bubbles ─────────────────────────────────────────────────────────── */

.conv-msg.user .conv-bubble {
  background: #0969da !important;
  color: #ffffff !important;
}
.conv-msg.assistant .conv-bubble {
  background: #f6f8fa !important;
  border-color: #d0d7de !important;
  color: #1f2328 !important;
}

/* ── Result metadata ──────────────────────────────────────────────────────── */

.meta-val {
  color: #1f2328 !important;
}

/* ── Login card ───────────────────────────────────────────────────────────── */

.logo-area h1 { color: #1f2328 !important; }
.logo-area p  { color: #57606a !important; }
.card h2      { color: #1f2328 !important; }

/* ── Footer ───────────────────────────────────────────────────────────────── */

footer {
  background: #f6f8fa !important;
  border-top: 1px solid #d0d7de !important;
}

/* ── Section labels ───────────────────────────────────────────────────────── */

.section-label {
  color: #57606a !important;
  letter-spacing: .06em;
}

/* ── Recommendation block ─────────────────────────────────────────────────── */

.recommendation {
  background: #f0f6ff !important;
  border-left-color: #0969da !important;
  color: #1f2328 !important;
}

.blocked-msg {
  background: rgba(207,34,46,.06) !important;
}

/* ── Hint blocks ──────────────────────────────────────────────────────────── */

.q-hint, .ai-hint {
  background: #f6f8fa !important;
  border-left-color: #d0d7de !important;
  color: #57606a !important;
}

/* ── Stat cards ───────────────────────────────────────────────────────────── */

.stat {
  background: #ffffff !important;
}

/* ── AI summary panel ─────────────────────────────────────────────────────── */

#ai-summary-box {
  background: rgba(130,80,223,.05) !important;
  border-color: rgba(130,80,223,.2) !important;
}

/* ── Progress fill colour ─────────────────────────────────────────────────── */

.progress-fill {
  background: #0969da !important;
}

/* ── Scrollbar (Webkit) ───────────────────────────────────────────────────── */

::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: #f0f3f7; }
::-webkit-scrollbar-thumb { background: #c8d0d8; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #a8b2bc; }
