/* =============================================================================
   ODIN REDESIGN 2026 — Complete Design System
   Data Intelligence Platform for Investigators
   Loaded last — overrides odin.css + odin-light.css

   Palette:  Indigo primary · Sky accent · Slate neutrals · JetBrains Mono data
   Strategy: taste-skill (no slop) + ui-ux-pro-max (data-dense dashboard)
   ============================================================================= */

/* ── 1. DESIGN TOKENS ─────────────────────────────────────────────────────── */
body.light {
  /* Brand */
  --re-primary:        #4338ca;   /* indigo-700 */
  --re-primary-mid:    #6366f1;   /* indigo-500 */
  --re-primary-soft:   #eef2ff;   /* indigo-50 */
  --re-primary-border: #c7d2fe;   /* indigo-200 */
  --re-accent:         #0284c7;   /* sky-600 */
  --re-accent-soft:    #e0f2fe;   /* sky-50 */

  /* Status */
  --re-success:        #059669;
  --re-success-soft:   #d1fae5;
  --re-warning:        #d97706;
  --re-warning-soft:   #fef3c7;
  --re-danger:         #dc2626;
  --re-danger-soft:    #fee2e2;

  /* Neutrals */
  --re-bg:             #f6f7fb;
  --re-surface:        #ffffff;
  --re-surface-2:      #f1f5f9;
  --re-surface-hover:  #f8faff;
  --re-text:           #111827;
  --re-text-2:         #374151;
  --re-text-3:         #6b7280;
  --re-text-4:         #9ca3af;
  --re-border:         #e5e7eb;
  --re-border-2:       #d1d5db;

  /* Shadows (tinted to bg hue — taste-skill rule) */
  --re-shadow-xs:      0 1px 2px rgba(67,56,202,.06);
  --re-shadow-sm:      0 2px 8px rgba(67,56,202,.08), 0 1px 2px rgba(0,0,0,.04);
  --re-shadow-md:      0 4px 16px rgba(67,56,202,.10), 0 1px 4px rgba(0,0,0,.06);
  --re-shadow-lg:      0 8px 32px rgba(67,56,202,.13), 0 2px 8px rgba(0,0,0,.06);

  /* Radius */
  --re-r-sm:  6px;
  --re-r-md:  10px;
  --re-r-lg:  14px;
  --re-r-xl:  20px;

  /* Typography */
  --re-font-body: 'Geist', system-ui, sans-serif;
  --re-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* Transitions — taste-skill cubic spring */
  --re-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --re-t-fast: 0.18s;
  --re-t-mid:  0.30s;
  --re-t-slow: 0.45s;

  /* Override legacy vars so inline styles cascade correctly */
  --primary:        var(--re-primary);
  --primary-light:  var(--re-primary-soft);
  --accent:         var(--re-accent);
  --bg:             var(--re-bg);
  --bg-app:         var(--re-bg);
  --surface:        var(--re-surface);
  --bg-card:        var(--re-surface);
  --text:           var(--re-text);
  --text-main:      var(--re-text);
  --muted:          var(--re-text-3);
  --text-muted:     var(--re-text-3);
  --border:         var(--re-border);
  --border-c:       var(--re-border);
  --shadow-card:    var(--re-shadow-sm);
  --shadow-hover:   var(--re-shadow-md);
  --radius-card:    var(--re-r-lg);
  --radius:         var(--re-r-lg);
  --mov-primary:    var(--re-primary);
  --cyan-accent:    var(--re-accent);
  --accent-cyan:    var(--re-accent);
  --mov-light:      var(--re-primary-soft);
  --shadow-xs:      var(--re-shadow-xs);
  --shadow-sm:      var(--re-shadow-sm);
}

/* ── Dark mode tokens ─────────────────────────────────────────────────────── */
body:not(.light) {
  --re-primary:        #818cf8;
  --re-primary-soft:   rgba(99,102,241,.15);
  --re-primary-border: rgba(99,102,241,.35);
  --re-accent:         #38bdf8;
  --re-accent-soft:    rgba(56,189,248,.12);
  --re-success:        #34d399;
  --re-warning:        #fbbf24;
  --re-danger:         #f87171;
  --re-bg:             #0b1120;
  --re-surface:        #141e30;
  --re-surface-2:      #1a2640;
  --re-surface-hover:  #1f2d48;
  --re-text:           #f1f5f9;
  --re-text-2:         #cbd5e1;
  --re-text-3:         #94a3b8;
  --re-text-4:         #64748b;
  --re-border:         #1e2a3d;
  --re-border-2:       #263347;
  --re-shadow-xs:      0 1px 2px rgba(0,0,0,.4);
  --re-shadow-sm:      0 2px 8px rgba(0,0,0,.4);
  --re-shadow-md:      0 4px 16px rgba(0,0,0,.5);
  --re-shadow-lg:      0 8px 32px rgba(0,0,0,.6);

  /* Override legacy vars */
  --primary:        var(--re-primary);
  --bg:             var(--re-bg);
  --surface:        var(--re-surface);
  --text:           var(--re-text);
  --muted:          var(--re-text-3);
  --border:         var(--re-border);
  --shadow-card:    var(--re-shadow-sm);
}

/* ── 2. BASE ──────────────────────────────────────────────────────────────── */
body.light {
  background: var(--re-bg);
  font-family: var(--re-font-body);
  color: var(--re-text);
}

/* ── 3. NAVBAR ────────────────────────────────────────────────────────────── */
body.light .navbar {
  background: linear-gradient(135deg, #1e1b4b 0%, #0e1628 100%) !important;
  border-bottom: none !important;
  box-shadow: 0 2px 16px rgba(14,22,40,.4) !important;
  height: 56px;
}
body.light .navbar-brand {
  font-weight: 800 !important;
  font-size: 1.1rem !important;
  color: #fff !important;
  letter-spacing: -.025em !important;
  gap: 8px !important;
}
body.light .navbar-brand i { color: #93c5fd !important; }

/* Auth buttons */
body.light .btn-cyan,
body.light .navbar .btn-cyan {
  background: var(--re-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--re-r-md) !important;
  font-weight: 700 !important;
  padding: 7px 16px !important;
  font-size: .85rem !important;
  transition: background var(--re-t-fast) var(--re-ease),
              transform var(--re-t-fast) var(--re-ease),
              box-shadow var(--re-t-fast) var(--re-ease) !important;
  box-shadow: 0 1px 4px rgba(67,56,202,.25) !important;
}
body.light .btn-cyan:hover,
body.light .navbar .btn-cyan:hover {
  background: #3730a3 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(67,56,202,.3) !important;
}
body.light .btn-cyan:active { transform: scale(0.97) !important; }

body.light .nav-mode-btn {
  color: var(--re-text-2) !important;
  background: transparent !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-sm) !important;
  transition: all var(--re-t-fast) ease !important;
}
body.light .nav-mode-btn:hover {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  border-color: var(--re-primary-border) !important;
}
body.light .nav-mode-btn.active {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  border-color: var(--re-primary-border) !important;
  font-weight: 700 !important;
}

/* ── 4. SIDEBAR ───────────────────────────────────────────────────────────── */
body.light .sidebar {
  background: var(--re-surface) !important;
  border-right: 1px solid var(--re-border) !important;
  box-shadow: none !important;
}
body.light .sidebar-brand {
  border-bottom: 1px solid var(--re-border) !important;
  padding: 14px 18px !important;
}
body.light .sidebar-brand span {
  font-weight: 800 !important;
  color: var(--re-text) !important;
  letter-spacing: -.02em !important;
}
body.light .sidebar-company {
  border-bottom: 1px solid var(--re-border) !important;
  padding: 10px 14px !important;
  background: var(--re-primary-soft) !important;
}
body.light .sidebar-company-name {
  color: var(--re-primary) !important;
  font-weight: 700 !important;
  font-size: .875rem !important;
}
body.light .sidebar-company-cui {
  color: var(--re-text-3) !important;
  font-size: .72rem !important;
  font-family: var(--re-font-mono) !important;
}
body.light .nav-group {
  color: var(--re-text-4) !important;
  font-size: .65rem !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  padding: 16px 18px 5px !important;
}
body.light .sidebar-nav a {
  color: var(--re-text-2) !important;
  font-size: .85rem !important;
  font-weight: 500 !important;
  padding: 8px 14px !important;
  margin: 1px 8px !important;
  border-radius: var(--re-r-sm) !important;
  transition: background var(--re-t-fast) ease,
              color var(--re-t-fast) ease !important;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
}
body.light .sidebar-nav a:hover {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
}
body.light .sidebar-nav a.active,
body.light .sidebar-nav a[aria-current="page"] {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  font-weight: 700 !important;
  position: relative !important;
}
body.light .sidebar-nav a.active::before,
body.light .sidebar-nav a[aria-current="page"]::before {
  content: '';
  position: absolute;
  left: -8px;
  top: 6px;
  bottom: 6px;
  width: 3px;
  background: var(--re-primary);
  border-radius: 0 3px 3px 0;
}
body.light .sidebar-nav a i {
  font-size: 1rem !important;
  width: 18px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
  opacity: .75 !important;
}
body.light .sidebar-nav a.active i,
body.light .sidebar-nav a:hover i { opacity: 1 !important; }

/* ── 5. CARDS ─────────────────────────────────────────────────────────────── */
body.light .card {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-lg) !important;
  box-shadow: var(--re-shadow-xs) !important;
  transition: box-shadow var(--re-t-fast) ease !important;
}
body.light .card:hover { box-shadow: var(--re-shadow-sm) !important; }
body.light .card-header {
  background: transparent !important;
  border-bottom: 1px solid var(--re-border) !important;
  padding: 14px 20px !important;
  font-size: .9rem !important;
  font-weight: 700 !important;
  color: var(--re-text) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
body.light .card-header i {
  color: var(--re-primary) !important;
  font-size: 1rem !important;
}

/* ── 6. TABLES ────────────────────────────────────────────────────────────── */
body.light table th,
body.light .t th,
body.light #lf-table th,
body.light #parl-table th {
  background: var(--re-surface-2) !important;
  color: var(--re-text-3) !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--re-border) !important;
  border-top: none !important;
  white-space: nowrap !important;
}
body.light table td,
body.light .t td,
body.light #lf-table td,
body.light #parl-table td {
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--re-border) !important;
  color: var(--re-text) !important;
  font-size: .875rem !important;
  vertical-align: middle !important;
}
body.light table tr:last-child td { border-bottom: none !important; }
body.light table tbody tr:hover td {
  background: var(--re-surface-2) !important;
}
body.light table th { cursor: default; }
body.light table th[onclick],
body.light table th[data-sort] { cursor: pointer; }
body.light table th[onclick]:hover,
body.light table th[data-sort]:hover {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
}

/* Remove the old dark table header used in parlamentari etc */
body.light table th[style*="background:#1a"],
body.light table th[style*="background: #1a"],
body.light #parl-table thead th {
  background: var(--re-surface-2) !important;
  color: var(--re-text-3) !important;
}

/* Monospace for numbers in tables */
body.light table td .font-mono,
body.light table td[data-type="number"],
body.light table td:has(.badge),
body.light .kpi-val,
body.light .stat-val,
body.light .ls-val {
  font-family: var(--re-font-mono) !important;
}

/* ── 7. BUTTONS ───────────────────────────────────────────────────────────── */
body.light .btn-go,
body.light .btn-primary {
  background: var(--re-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--re-r-md) !important;
  font-weight: 700 !important;
  padding: 8px 18px !important;
  font-size: .875rem !important;
  cursor: pointer !important;
  transition: background var(--re-t-fast) var(--re-ease),
              transform var(--re-t-fast) var(--re-ease),
              box-shadow var(--re-t-fast) var(--re-ease) !important;
  box-shadow: 0 1px 3px rgba(67,56,202,.2) !important;
}
body.light .btn-go:hover,
body.light .btn-primary:hover {
  background: #3730a3 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(67,56,202,.25) !important;
}
body.light .btn-go:active,
body.light .btn-primary:active { transform: scale(0.97) !important; }

body.light .btn-sm {
  padding: 5px 12px !important;
  font-size: .8rem !important;
  border-radius: var(--re-r-sm) !important;
  border: 1px solid var(--re-border) !important;
  background: var(--re-surface) !important;
  color: var(--re-text-2) !important;
  cursor: pointer !important;
  transition: all var(--re-t-fast) ease !important;
}
body.light .btn-sm:hover {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  border-color: var(--re-primary-border) !important;
}
body.light .btn-sm:active { transform: scale(0.97) !important; }

/* ── 8. FORMS & INPUTS ────────────────────────────────────────────────────── */
body.light input[type="text"],
body.light input[type="number"],
body.light input[type="email"],
body.light input[type="password"],
body.light input[type="search"],
body.light input[type="date"],
body.light textarea,
body.light select {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border-2) !important;
  color: var(--re-text) !important;
  border-radius: var(--re-r-sm) !important;
  font-family: var(--re-font-body) !important;
  font-size: .875rem !important;
  padding: 8px 12px !important;
  transition: border-color var(--re-t-fast) ease,
              box-shadow var(--re-t-fast) ease !important;
  outline: none !important;
}
body.light input:focus,
body.light textarea:focus,
body.light select:focus {
  border-color: var(--re-primary) !important;
  box-shadow: 0 0 0 3px rgba(67,56,202,.12) !important;
}
body.light input::placeholder,
body.light textarea::placeholder {
  color: var(--re-text-4) !important;
  font-weight: 400 !important;
}
body.light label {
  font-size: .8rem !important;
  font-weight: 600 !important;
  color: var(--re-text-2) !important;
  margin-bottom: 4px !important;
  display: block !important;
}

/* ── 9. BADGES ────────────────────────────────────────────────────────────── */
body.light .badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 100px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  white-space: nowrap !important;
}
body.light .badge-green, body.light .s-badge-activ {
  background: var(--re-success-soft) !important;
  color: #065f46 !important;
  border: 1px solid #a7f3d0 !important;
}
body.light .badge-red, body.light .s-badge-radiat,
body.light .s-badge-inactiv {
  background: var(--re-danger-soft) !important;
  color: #991b1b !important;
  border: 1px solid #fca5a5 !important;
}
body.light .badge-yellow, body.light .badge-orange {
  background: var(--re-warning-soft) !important;
  color: #92400e !important;
  border: 1px solid #fcd34d !important;
}
body.light .badge-blue, body.light .s-badge-tva {
  background: var(--re-accent-soft) !important;
  color: #075985 !important;
  border: 1px solid #bae6fd !important;
}
body.light .badge-purple {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  border: 1px solid var(--re-primary-border) !important;
}
body.light .badge-gray, body.light .badge-dark-gray {
  background: #f3f4f6 !important;
  color: #4b5563 !important;
  border: 1px solid #e5e7eb !important;
}

/* ── 10. HERO LANDING ─────────────────────────────────────────────────────── */
body.light .landing-hero-wrap {
  background:
    radial-gradient(ellipse 100% 60% at 50% -5%, rgba(67,56,202,.09) 0%, transparent 60%),
    var(--re-surface) !important;
  border-bottom: 1px solid var(--re-border) !important;
  padding: clamp(48px,8vw,96px) 24px clamp(40px,6vw,72px) !important;
  position: relative !important;
}
body.light .landing-hero-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(67,56,202,.04) 1px, transparent 0);
  background-size: 32px 32px;
  pointer-events: none;
}

body.light .landing-title,
body.light .landing-hero-title-redesign {
  font-size: clamp(2.8rem, 6vw, 4.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -.04em !important;
  color: var(--re-text) !important;
  background: none !important;
  -webkit-text-fill-color: var(--re-text) !important;
  text-shadow: none !important;
  animation: none !important;
  line-height: 1 !important;
  margin-bottom: 16px !important;
}
body.light .landing-subtitle {
  color: var(--re-text-3) !important;
  font-size: clamp(.95rem, 1.4vw + .4rem, 1.2rem) !important;
  max-width: 54ch !important;
  margin: 0 auto 32px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
}

/* Hero CTA button — taste-skill spring + no neon glow */
body.light .landing-hero-content .btn-cyan,
body.light .landing-hero-wrap .btn-cyan {
  background: var(--re-primary) !important;
  color: #fff !important;
  border: none !important;
  padding: 14px 36px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  border-radius: var(--re-r-md) !important;
  box-shadow: 0 2px 12px rgba(67,56,202,.25), 0 1px 3px rgba(0,0,0,.08) !important;
  transition: transform var(--re-t-mid) var(--re-ease),
              box-shadow var(--re-t-mid) var(--re-ease) !important;
}
body.light .landing-hero-content .btn-cyan:hover,
body.light .landing-hero-wrap .btn-cyan:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 24px rgba(67,56,202,.32), 0 2px 6px rgba(0,0,0,.08) !important;
}
body.light .landing-hero-content .btn-cyan:active,
body.light .landing-hero-wrap .btn-cyan:active {
  transform: scale(0.97) !important;
}

/* ── 11. STATS COUNTER ────────────────────────────────────────────────────── */
body.light .landing-stats-counter {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-lg) !important;
  box-shadow: var(--re-shadow-sm) !important;
  max-width: 700px !important;
  margin: 32px auto 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  border-top: none !important;
  color: var(--re-text) !important;
  font-size: .78rem !important;
}
body.light .landing-stats-counter span {
  flex: 1 1 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 2px !important;
  padding: 16px 10px !important;
  border-right: 1px solid var(--re-border) !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: center !important;
  transition: background var(--re-t-fast) ease !important;
  color: var(--re-text-3) !important;
}
body.light .landing-stats-counter span:last-child { border-right: none !important; }
body.light .landing-stats-counter span:hover { background: var(--re-primary-soft) !important; }
body.light .landing-stats-counter i {
  font-size: .95rem !important;
  color: var(--re-primary) !important;
  margin-bottom: 4px !important;
  order: -1 !important;
}
body.light .landing-stats-counter strong {
  display: block !important;
  font-family: var(--re-font-mono) !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: var(--re-text) !important;
  line-height: 1.1 !important;
  letter-spacing: -.02em !important;
}

/* ── 12. TOOL TILES ───────────────────────────────────────────────────────── */
body.light .tool-tile {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-lg) !important;
  padding: 22px 20px 18px !important;
  box-shadow: var(--re-shadow-xs) !important;
  transition: transform var(--re-t-slow) var(--re-ease),
              box-shadow var(--re-t-slow) var(--re-ease),
              background var(--re-t-fast) ease !important;
  cursor: pointer !important;
  position: relative !important;
  overflow: hidden !important;
}
body.light .tool-tile:hover {
  transform: translateY(-3px) scale(1.006) !important;
  box-shadow: var(--re-shadow-md) !important;
  background: var(--re-surface-hover) !important;
  border-color: var(--re-primary-border) !important;
}
body.light .tool-tile:active { transform: scale(0.97) !important; }

/* Color-coded via icon + subtle tinted hover — no side stripes */
body.light .tool-tile:has(.card-icon.purple):hover { background: #f5f3ff !important; border-color: var(--re-primary-border) !important; }
body.light .tool-tile:has(.card-icon.cyan):hover   { background: #f0f9ff !important; border-color: #bae6fd !important; }
body.light .tool-tile:has(.card-icon.green):hover  { background: #f0fdf4 !important; border-color: #bbf7d0 !important; }
body.light .tool-tile:has(.card-icon.orange):hover { background: #fff7ed !important; border-color: #fed7aa !important; }
body.light .tool-tile:has(.card-icon.red):hover    { background: #fff1f2 !important; border-color: #fecdd3 !important; }

body.light .card-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: var(--re-r-md) !important;
  font-size: 1.5rem !important;
  margin-bottom: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
body.light .card-icon.purple { background: var(--re-primary-soft) !important; color: var(--re-primary) !important; }
body.light .card-icon.cyan   { background: var(--re-accent-soft) !important;  color: var(--re-accent) !important; }
body.light .card-icon.green  { background: var(--re-success-soft) !important; color: var(--re-success) !important; }
body.light .card-icon.orange { background: var(--re-warning-soft) !important; color: var(--re-warning) !important; }
body.light .card-icon.red    { background: var(--re-danger-soft) !important;  color: var(--re-danger) !important; }

body.light .tool-tile strong {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--re-text) !important;
  line-height: 1.2 !important;
  display: block !important;
  margin-bottom: 5px !important;
}
body.light .tool-tile span {
  font-size: .8rem !important;
  color: var(--re-text-3) !important;
  line-height: 1.45 !important;
}

/* Spotlight border hover — taste-skill */
body.light .tool-tile::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  background: radial-gradient(circle 110px at var(--spot-x,-200px) var(--spot-y,-200px),
    rgba(67,56,202,.1), transparent 70%) !important;
  pointer-events: none !important;
}

/* ── 13. SECTION TITLES ───────────────────────────────────────────────────── */
body.light .landing-section-title h2 {
  font-size: 1.75rem !important;
  font-weight: 800 !important;
  color: var(--re-text) !important;
  letter-spacing: -.03em !important;
  background: none !important;
  -webkit-text-fill-color: var(--re-text) !important;
  margin-bottom: 6px !important;
}
body.light .landing-section-title p {
  color: var(--re-text-3) !important;
  font-size: .9rem !important;
}

/* ── 14. LANDING SECTIONS (Features, How, Sources, CTA) ──────────────────── */
body.light .landing-features {
  background: var(--re-bg) !important;
  color: var(--re-text) !important;
}
body.light .feature-card {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-xl) !important;
  box-shadow: var(--re-shadow-xs) !important;
  transition: transform var(--re-t-mid) var(--re-ease),
              box-shadow var(--re-t-mid) var(--re-ease),
              border-color var(--re-t-fast) ease !important;
}
body.light .feature-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: var(--re-shadow-lg) !important;
  border-color: var(--re-primary-border) !important;
}
body.light .feature-card h3 { color: var(--re-text) !important; }
body.light .feature-card p  { color: var(--re-text-3) !important; }

body.light .landing-how {
  background: linear-gradient(160deg, #f8faff 0%, #eef2ff 100%) !important;
  color: var(--re-text) !important;
}
body.light .how-step h4 { color: var(--re-text) !important; }
body.light .how-step p  { color: var(--re-text-3) !important; }
body.light .how-step .hs-num {
  background: var(--re-primary-soft) !important;
  border-color: var(--re-primary) !important;
  color: var(--re-primary) !important;
}
body.light .landing-cta {
  background: linear-gradient(135deg, #312e81 0%, #4338ca 40%, #0284c7 100%) !important;
}
body.light .landing-cta h2, body.light .landing-cta p { color: #fff !important; }

body.light .landing-sources {
  background: var(--re-bg) !important;
}
body.light .landing-sources .landing-section-title h2 { color: var(--re-text) !important; }
body.light .landing-sources .landing-section-title p  { color: var(--re-text-3) !important; }
body.light .landing-sources .ds-card {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  color: var(--re-text) !important;
  box-shadow: var(--re-shadow-xs) !important;
  border-radius: var(--re-r-md) !important;
  transition: all var(--re-t-fast) ease !important;
}
body.light .landing-sources .ds-card:hover {
  border-color: var(--re-primary-border) !important;
  box-shadow: var(--re-shadow-sm) !important;
}
body.light .landing-sources .ds-card strong { color: var(--re-text) !important; }
body.light .landing-sources .ds-card span   { color: var(--re-text-3) !important; }

/* ── 15. SEARCH CARDS (tool entry forms) ─────────────────────────────────── */
body.light .search-card {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-lg) !important;
  box-shadow: var(--re-shadow-xs) !important;
  padding: 20px !important;
}

/* Tool page hero banners — flat per user feedback 2026-05-07
   (no soft-coloured backplate, no border, no icon square box). */
body.light .seap-hero,
body.light .ong-hero,
body.light [class*="-hero"]:not(.landing-hero-wrap):not(.landing-hero-content):not(.landing-hero-title-redesign):not(.landing-valknut-logo) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 8px 0 12px !important;
}
body.light .landing-hero-content,
body.light .landing-hero-title-redesign,
body.light .landing-valknut-logo {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
}
body.light .seap-hero-icon,
body.light .ong-hero-icon,
body.light [class*="-hero"] [class*="-hero-icon"] {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* ── 16. PAGE BACK BUTTON & TITLES ────────────────────────────────────────── */
body.light #back-btn,
body.light .back-btn {
  color: var(--re-text-3) !important;
  background: transparent !important;
  border: none !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 0 !important;
  transition: color var(--re-t-fast) ease !important;
}
body.light #back-btn:hover,
body.light .back-btn:hover { color: var(--re-primary) !important; }

/* Tool page title row */
body.light .tool-page-title,
body.light h2.tool-title {
  font-size: 1.3rem !important;
  font-weight: 800 !important;
  color: var(--re-text) !important;
  letter-spacing: -.025em !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* ── 17. COMPANY PROFILE ──────────────────────────────────────────────────── */
body.light .company-header {
  background: linear-gradient(135deg, #312e81 0%, #4338ca 50%, #1d4ed8 100%) !important;
  padding: 24px 28px !important;
  border-radius: 0 !important;
}
/* Targeted text-color rules — replaces dangerous universal `* { color:#fff }`
   which forced white on KPI cards' light backgrounds (bug #548).
   ONLY name + chips + cui get white text. KPI cards are white-bg with their own dark text. */
body.light .company-header,
body.light .company-header .ch-name,
body.light .company-header .ch-cui,
body.light .company-header .ch-chips,
body.light .company-header .ch-chips > *,
body.light .company-header #c-meta-row,
body.light .company-header #c-meta-row *,
body.light .company-header h1,
body.light .company-header h2,
body.light .company-header h3 {
  color: #fff;
}
body.light .company-header .kpi-row {
  display: flex !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  margin-top: 12px !important;
}
/* Use specific class names instead of [class*="chip"] which matched .ch-chips
   container itself (substring 'chip' in 'ch-chips'). */
body.light .company-header .ch-chip,
body.light .company-header .kpi-chip {
  background: rgba(255,255,255,.28) !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  border-radius: 100px !important;
  padding: 3px 10px !important;
  font-size: .75rem !important;
  font-weight: 600 !important;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.3) !important;
  backdrop-filter: blur(4px) !important;
}

/* Company tabs */
body.light .company-tabs .nav-tab,
body.light [id*="tabs"] .nav-tab,
body.light .nav-tab {
  font-size: .82rem !important;
  font-weight: 600 !important;
  color: var(--re-text-3) !important;
  padding: 8px 14px !important;
  border-radius: var(--re-r-sm) !important;
  border: none !important;
  background: transparent !important;
  cursor: pointer !important;
  transition: all var(--re-t-fast) ease !important;
  white-space: nowrap !important;
}
body.light .nav-tab:hover {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
}
body.light .nav-tab.active {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  font-weight: 700 !important;
}

/* ── 18. LISTA FIRME PAGE ─────────────────────────────────────────────────── */
body.light #lf-sidebar {
  background: var(--re-surface) !important;
  border-right: 1px solid var(--re-border) !important;
}
body.light #lf-sidebar .nav-group {
  color: var(--re-text-4) !important;
  font-size: .65rem !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  padding: 14px 14px 4px !important;
}
body.light #lf-sidebar label {
  font-size: .78rem !important;
  font-weight: 600 !important;
  color: var(--re-text-2) !important;
  margin-bottom: 3px !important;
}

/* ── 19. STARE BADGES (firma status) ──────────────────────────────────────── */
body.light .s-badge-activ  { background: var(--re-success-soft) !important; color: #065f46 !important; border: 1px solid #a7f3d0 !important; font-family: var(--re-font-mono) !important; }
body.light .s-badge-inactiv{ background: var(--re-warning-soft) !important; color: #92400e !important; border: 1px solid #fcd34d !important; font-family: var(--re-font-mono) !important; }
body.light .s-badge-radiat { background: var(--re-danger-soft) !important;  color: #991b1b !important; border: 1px solid #fca5a5 !important; font-family: var(--re-font-mono) !important; }
body.light .s-badge-tva    { background: var(--re-accent-soft) !important;  color: #075985 !important; border: 1px solid #bae6fd !important; font-family: var(--re-font-mono) !important; }

/* ── 20. GRAPH / GRAF ─────────────────────────────────────────────────────── */
/* Light mode graph container */
body.light #graf-container {
  background: #f8fafc !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-lg) !important;
}
body.light #graf-container .react-flow__background {
  background-color: #f8fafc !important;
}
body.light #graf-container .react-flow__controls {
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-md) !important;
  box-shadow: var(--re-shadow-sm) !important;
  overflow: hidden !important;
}
body.light #graf-container .react-flow__controls-button {
  background: var(--re-surface) !important;
  border-bottom: 1px solid var(--re-border) !important;
  color: var(--re-text-2) !important;
}
body.light #graf-container .react-flow__controls-button:hover {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
}

/* Graph toolbar */
body.light #graf-viewport > div:first-child {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-lg) !important;
  box-shadow: var(--re-shadow-sm) !important;
}

/* Graph node search */
body.light #graf-search-input {
  background: var(--re-bg) !important;
  border: 1px solid var(--re-border-2) !important;
  color: var(--re-text) !important;
  border-radius: var(--re-r-sm) !important;
  font-size: .78rem !important;
  transition: border-color var(--re-t-fast) ease !important;
}
body.light #graf-search-input:focus {
  border-color: var(--re-primary) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(67,56,202,.1) !important;
}
body.light #graf-search-results {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-md) !important;
  box-shadow: var(--re-shadow-lg) !important;
}

/* Graph sidebar */
body.light #graf-sidebar {
  background: var(--re-surface) !important;
  border-left: 1px solid var(--re-border) !important;
  border-radius: 0 var(--re-r-lg) var(--re-r-lg) 0 !important;
}

/* Graph filter pills */
body.light #graf-filters .filter-pill,
body.light .graf-filter-btn {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border-2) !important;
  color: var(--re-text-2) !important;
  border-radius: 100px !important;
  padding: 4px 12px !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all var(--re-t-fast) ease !important;
}
body.light #graf-filters .filter-pill:hover,
body.light .graf-filter-btn:hover {
  background: var(--re-primary-soft) !important;
  border-color: var(--re-primary-border) !important;
  color: var(--re-primary) !important;
}
body.light #graf-filters .filter-pill.active,
body.light .graf-filter-btn.active {
  background: var(--re-primary) !important;
  border-color: var(--re-primary) !important;
  color: #fff !important;
}

/* ── 21. RISK FLAGS — full border, tinted bg (no side-stripe) ────────────── */
body.light .flag-critical,
body.light .flag-high,
body.light .flag-medium,
body.light .flag-low {
  border-left: 1px solid !important;
  border-right: 1px solid !important;
  border-top: 1px solid !important;
  border-bottom: 1px solid !important;
  border-radius: var(--re-r-md) !important;
}
body.light .flag-critical { border-color: #fca5a5 !important; background: var(--re-danger-soft) !important; }
body.light .flag-high     { border-color: #fcd34d !important; background: var(--re-warning-soft) !important; }
body.light .flag-medium   { border-color: #fde68a !important; background: #fffbeb !important; }
body.light .flag-low      { border-color: #6ee7b7 !important; background: var(--re-success-soft) !important; }

/* ── 22. KPI STAT BOXES ───────────────────────────────────────────────────── */
body.light .stat-box,
body.light .kpi-item {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-md) !important;
  padding: 14px 16px !important;
  box-shadow: var(--re-shadow-xs) !important;
}
body.light .stat-box .stat-val,
body.light .kpi-item .kpi-val,
body.light .kpi-item strong {
  font-family: var(--re-font-mono) !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: var(--re-text) !important;
  letter-spacing: -.02em !important;
}
body.light .stat-box .stat-lbl,
body.light .kpi-item small,
body.light .kpi-item span:not(strong) {
  font-size: .72rem !important;
  color: var(--re-text-3) !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  font-weight: 600 !important;
}

/* ── 23. ADMIN PANEL ──────────────────────────────────────────────────────── */
body.light #admin-panel {
  font-family: var(--re-font-body) !important;
}
body.light #admin-panel .admin-sidebar {
  background: var(--re-surface) !important;
  border-right: 1px solid var(--re-border) !important;
}
body.light #admin-panel .admin-tab {
  font-size: .85rem !important;
  color: var(--re-text-3) !important;
  border-radius: var(--re-r-sm) !important;
  margin: 2px 8px !important;
  transition: all var(--re-t-fast) ease !important;
}
body.light #admin-panel .admin-tab:hover {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
}
body.light #admin-panel .admin-tab.active {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  font-weight: 700 !important;
  border-left-color: var(--re-primary) !important;
}
body.light #admin-panel .admin-shell,
body.light #admin-panel .admin-content {
  background: var(--re-bg) !important;
}

/* ── 24. STAGGER ANIMATION (taste-skill) ─────────────────────────────────── */
@keyframes re-tileIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
body.light .tile-stagger-ready { opacity: 0; }
body.light .tile-stagger-go {
  animation: re-tileIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) both;
  animation-delay: calc(var(--tile-i, 0) * 0.05s);
}

/* ── 25. FOOTER ───────────────────────────────────────────────────────────── */
body.light .portal-footer {
  background: #111827 !important;
  color: #9ca3af !important;
  border-top: none !important;
}
body.light .portal-footer a { color: #d1d5db !important; }
body.light .portal-footer a:hover { color: #fff !important; }

/* ── 26. NAVBAR SEARCH ────────────────────────────────────────────────────── */
body.light .navbar-search input {
  background: var(--re-bg) !important;
  border: 1px solid var(--re-border) !important;
  color: var(--re-text) !important;
  border-radius: 20px !important;
  padding: 6px 14px !important;
  font-size: .85rem !important;
}
body.light .navbar-search input:focus {
  border-color: var(--re-primary) !important;
  box-shadow: 0 0 0 3px rgba(67,56,202,.12) !important;
}

/* ── 27. COOKIE BANNER (#479: #odin-cc — avoids ad-blocker filter lists) ──── */
body.light #odin-cc > div {
  background: #1e293b !important;
  border-top: 2px solid #0284c7 !important;
}

/* ── 28. MOBILE ───────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  body.light .tool-tile {
    border-radius: 12px !important;
    padding: 14px 14px !important;
  }
  body.light .landing-stats-counter {
    flex-wrap: wrap !important;
    max-width: 100% !important;
    margin-left: 16px !important;
    margin-right: 16px !important;
  }
  body.light .landing-stats-counter span {
    flex: 1 1 40% !important;
    border-bottom: 1px solid var(--re-border) !important;
  }
  body.light .navbar-right #user-menu,
  body.light .navbar-right #auth-buttons {
    background: #0e1628 !important;
    box-shadow: -10px 0 12px -6px rgba(0,0,0,.5) !important;
  }
}
@media (max-width: 480px) {
  body.light .landing-stats-counter span { flex: 1 1 100% !important; border-right: none !important; }
  body.light .landing-title,
  body.light .landing-hero-title-redesign {
    font-size: clamp(2.4rem, 12vw, 3.5rem) !important;
  }
}

/* ── 29. DARK MODE DARK MODE OVERRIDES ────────────────────────────────────── */
body:not(.light) .tool-tile {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: 16px !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
body:not(.light) .tool-tile:hover {
  transform: translateY(-4px) scale(1.008) !important;
  border-color: rgba(99,102,241,.4) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.5), 0 0 0 1px rgba(99,102,241,.2) !important;
}
body:not(.light) .card {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: 14px !important;
}
body:not(.light) .landing-stats-counter span {
  transition: background 0.18s ease !important;
}
body:not(.light) .landing-stats-counter span:hover {
  background: rgba(99,102,241,.12) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   30. ENTITY PROFILE IMPROVEMENTS — Competitor-Informed (NorthData/OpenSanctions)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Monospace for all technical identifiers */
body.light code,
body.light .mono,
body.light [data-mono],
body.light .cui-code {
  font-family: var(--re-font-mono) !important;
  font-size: .82em !important;
  background: var(--re-surface-2) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: 4px !important;
  padding: 1px 5px !important;
  color: var(--re-text-2) !important;
  letter-spacing: .02em !important;
}

/* Entity profile header improvements */
/* NOTE: body.light .company-header intentionally excluded — purple gradient defined in section 17 above */
body.light #company-header-bar {
  background: var(--re-surface) !important;
  border-bottom: 1px solid var(--re-border) !important;
  padding: 20px 24px 16px !important;
}

/* Section anchors — NorthData pattern: small ALL-CAPS label above section */
body.light .section-anchor {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: .65rem !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--re-text-3) !important;
  margin-bottom: 10px !important;
}

/* Card headers — reduced weight, tinted */
body.light .card-header {
  font-size: .72rem !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: var(--re-text-3) !important;
  border-bottom: 1px solid var(--re-border) !important;
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}
body.light .card-header i { color: var(--re-primary) !important; font-size: .9rem !important; }

/* Semantic badge system — OpenSanctions-inspired */
body.light .badge-sanctioned {
  background: #dc2626 !important; color: #fff !important;
  border: 1px solid #b91c1c !important;
  border-radius: 100px !important; padding: 2px 9px !important;
  font-size: .68rem !important; font-weight: 700 !important;
}
body.light .badge-pep {
  background: #d97706 !important; color: #fff !important;
  border: 1px solid #b45309 !important;
  border-radius: 100px !important; padding: 2px 9px !important;
  font-size: .68rem !important; font-weight: 700 !important;
}
body.light .badge-insolvent {
  background: #7c3aed !important; color: #fff !important;
  border-radius: 100px !important; padding: 2px 9px !important;
  font-size: .68rem !important; font-weight: 700 !important;
}
body.light .badge-inactive {
  background: var(--re-surface-2) !important; color: var(--re-text-3) !important;
  border: 1px solid var(--re-border-2) !important;
  border-radius: 100px !important; padding: 2px 9px !important;
  font-size: .68rem !important; font-weight: 600 !important;
}

/* Profile info table — definition list style */
body.light .profile-table {
  display: grid !important;
  grid-template-columns: minmax(130px, auto) 1fr !important;
  gap: 0 !important;
  font-size: .83rem !important;
}
body.light .profile-table dt {
  color: var(--re-text-3) !important;
  font-weight: 600 !important;
  padding: 8px 12px 8px 0 !important;
  border-bottom: 1px solid var(--re-border) !important;
  white-space: nowrap !important;
}
body.light .profile-table dd {
  color: var(--re-text) !important;
  padding: 8px 0 !important;
  border-bottom: 1px solid var(--re-border) !important;
  margin: 0 !important;
  font-weight: 500 !important;
}
body.light .profile-table dt:last-of-type,
body.light .profile-table dd:last-of-type { border-bottom: none !important; }

/* Source attribution — OpenSanctions pattern */
body.light .data-source {
  font-size: .68rem !important;
  color: var(--re-accent) !important;
  text-decoration: none !important;
  margin-left: 6px !important;
  font-weight: 600 !important;
}
body.light .data-source:hover { text-decoration: underline !important; }

/* Sidebar nav items — no side stripe, use bg + icon color */
body.light .sidebar-nav a.active,
body.light .sidebar-nav a[data-active="true"] {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  border-radius: var(--re-r-md) !important;
  border: 1px solid var(--re-primary-border) !important;
  font-weight: 600 !important;
}
body.light .sidebar-nav a.active i,
body.light .sidebar-nav a[data-active="true"] i {
  color: var(--re-primary) !important;
}

/* Graph chrome — better integration with light UI */
body.light #graf-container {
  background: #0d1117 !important;
  border: 2px solid var(--re-border) !important;
  border-radius: var(--re-r-lg) !important;
  box-shadow: var(--re-shadow-md) !important;
}

/* Stats row improvements in entity overview */
body.light .ov-kpi-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}
body.light .ov-kpi {
  background: var(--re-surface) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: var(--re-r-md) !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
body.light .ov-kpi-label {
  font-size: .68rem !important;
  font-weight: 700 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  color: var(--re-text-3) !important;
}
body.light .ov-kpi-value {
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  color: var(--re-text) !important;
  font-family: var(--re-font-mono) !important;
  letter-spacing: -.01em !important;
  line-height: 1.1 !important;
}
body.light .ov-kpi-change {
  font-size: .72rem !important;
  font-weight: 600 !important;
}
body.light .ov-kpi-change.up   { color: var(--re-success) !important; }
body.light .ov-kpi-change.down { color: var(--re-danger) !important; }

/* Monospace identifier codes — NorthData pattern */
body.light .profile-table code,
body.light .card-body code,
body.light .table-wrap code,
body.light .ov-contact-row code {
  font-family: var(--re-font-mono) !important;
  background: var(--re-surface-2) !important;
  border: 1px solid var(--re-border) !important;
  border-radius: 4px !important;
  padding: 1px 6px !important;
  font-size: .82em !important;
  color: var(--re-text-2) !important;
  letter-spacing: .01em !important;
}

/* ── BUG #505/#506: feature card text must never clip ──────────────────── */
body.light .feature-card {
  overflow: visible !important;
  height: auto !important;
}

/* ── BUG #507: uniform tool icon color — primary blue-indigo ──────────── */
body.light .tool-tile .card-icon,
body.light .tool-tile .card-icon.purple,
body.light .tool-tile .card-icon.cyan,
body.light .tool-tile .card-icon.green,
body.light .tool-tile .card-icon.orange,
body.light .tool-tile .card-icon.red {
  background: var(--re-primary-soft) !important;
  color: var(--re-primary) !important;
  box-shadow: none !important;
}

/* ── BUG #509: data source content font — use body font ──────────────── */
body.light .feature-card p,
body.light .feature-card span,
body.light .landing-features p {
  font-family: var(--re-font-body) !important;
  font-size: .85rem !important;
  line-height: 1.6 !important;
}

body.light .navbar-brand svg path { stroke: url(#odin-g) !important; }
body.light .navbar .nav-mode-btn {
  color: rgba(255,255,255,.8) !important;
  border-color: rgba(255,255,255,.15) !important;
  background: rgba(255,255,255,.06) !important;
}
body.light .navbar .nav-mode-btn:hover {
  color: #fff !important;
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.25) !important;
}
body.light .navbar .lang-toggle button {
  color: rgba(255,255,255,.6) !important;
  background: transparent !important;
}
body.light .navbar .lang-toggle button.active {
  color: #fff !important;
  background: rgba(255,255,255,.15) !important;
}
/* Footer accent — keep dark but add brand gradient top border */
body.light .portal-footer {
  background: #0e1628 !important;
  border-top: 3px solid transparent !important;
  border-image: linear-gradient(90deg, #0284c7, #4338ca) 1 !important;
}

/* Data source label as inline span (not just link) */
body.light span.data-source {
  font-size: .6rem !important;
  color: var(--re-accent) !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  margin-left: 5px !important;
  opacity: .8 !important;
}

/* KPI clickable hover state */
body.light .ov-kpi[onclick],
body.light .ov-kpi[style*="cursor:pointer"] {
  transition: transform var(--re-t-slow) var(--re-ease), box-shadow var(--re-t-slow) var(--re-ease) !important;
}
body.light .ov-kpi[onclick]:hover,
body.light .ov-kpi[style*="cursor:pointer"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--re-shadow-md) !important;
  border-color: var(--re-primary-border) !important;
}
body.light .ov-kpi[onclick]:active,
body.light .ov-kpi[style*="cursor:pointer"]:active {
  transform: scale(0.98) !important;
}
