/* BRAMHA portal theme — TrendTrack (slate + indigo) design system. Layered over Gxon.
   This is the single central theme file: every portal page renders through these tokens,
   so editing it re-skins the whole portal at once. Supersedes the old gold-on-navy skin. */

@font-face{
  font-family:"Inter"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url("vendor/inter/inter-latin-wght-normal.woff2") format("woff2");
}

:root{
  /* ---- TrendTrack design tokens ---- */
  --tt-bg:#0b1120; --tt-bg-2:#0f172a; --tt-surface:#1e293b; --tt-surface-2:#172033;
  --tt-elevated:#232f45; --tt-border:#334155; --tt-border-soft:rgba(51,65,85,.55);
  --tt-text:#f1f5f9; --tt-muted:#94a3b8; --tt-dim:#64748b;
  --tt-primary:#6366f1; --tt-primary-2:#3b82f6; --tt-grad:linear-gradient(135deg,#6366f1,#3b82f6);
  --tt-radius:18px;
  /* keep legacy --kv-* names mapped to the new palette so older references stay valid */
  --kv-gold:#6366f1; --kv-gold-lt:#a5b4fc; --kv-gold-dk:#818cf8;
  --kv-grad:linear-gradient(135deg,#6366f1,#3b82f6); --kv-ink-dark:#0b1120;
  --kv-navy:#0f172a; --kv-navy-2:#0b1120;
}
:root,[data-bs-theme="light"],[data-bs-theme="dark"]{
  --bs-primary:#6366f1; --bs-primary-rgb:99,102,241;
  --bs-link-color:#60a5fa; --bs-link-color-rgb:96,165,250; --bs-link-hover-color:#93c5fd;
  --bs-border-color:#334155;
}
[data-bs-theme="dark"]{ --bs-link-color:#93b4fb; --bs-link-hover-color:#bfdbfe; }

/* ---- Base ---- */
html,body{ font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; letter-spacing:.1px; }
[data-bs-theme="dark"] body,
[data-bs-theme="dark"] .page-layout{
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(99,102,241,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 10%, rgba(168,85,247,.08), transparent 55%),
    #0b1120 !important;
  background-attachment:fixed; color:#e8edf9;
}
[data-bs-theme="dark"] body{ color:#e8edf9; }
[data-bs-theme="dark"] .text-muted,[data-bs-theme="dark"] .text-body-secondary{ color:#94a3b8 !important; }
*{ scrollbar-width:thin; scrollbar-color:#334155 transparent; }
*::-webkit-scrollbar{ width:8px; height:8px; }
*::-webkit-scrollbar-thumb{ background:#334155; border-radius:8px; }
*::-webkit-scrollbar-track{ background:transparent; }

/* ---- Links / primary accents (indigo replaces gold) ---- */
.link-primary,a.text-primary{ color:#93b4fb !important; }
.text-primary,[data-bs-theme="dark"] .text-primary{ color:#a5b4fc !important; }
.bg-primary{ background:#6366f1 !important; }
.bg-primary-subtle{ background:rgba(99,102,241,.16) !important; }
.form-control:focus,.form-select:focus{ border-color:#6366f1 !important; box-shadow:0 0 0 .2rem rgba(99,102,241,.25) !important; }
.btn-outline-primary{ color:#a5b4fc; border-color:#6366f1; }
.btn-outline-primary:hover{ background:#6366f1; color:#fff; }
.btn-primary,[data-bs-theme="dark"] .btn-primary{
  background-image:var(--tt-grad) !important; background-color:#6366f1 !important;
  border:0 !important; color:#fff !important; box-shadow:0 8px 20px -8px rgba(79,86,232,.6); }
.btn-primary:hover{ filter:brightness(1.07); color:#fff !important; }

/* ---- Shell: sidebar + topbar ---- */
[data-bs-theme="dark"] .app-menubar{
  background:linear-gradient(180deg,#0d1525 0%,#0b1120 100%) !important; border-color:var(--tt-border-soft) !important; }
.app-navbar-brand{ padding:10px 10px !important; }
[data-bs-theme="dark"] .app-header{
  background:rgba(11,17,32,.82) !important; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-color:var(--tt-border-soft) !important; }

/* sidebar nav items — rounded, indigo active/hover */
.app-navbar .menu-link{ border-radius:12px; transition:background .15s,color .15s; }
.app-navbar .menu-link:hover{ background:rgba(148,163,184,.08); color:#e8edf9 !important; }
.menu-item.active>.menu-link{ background:rgba(99,102,241,.16) !important; color:#c7d2fe !important; }
.menu-item.active>.menu-link i{ color:#a5b4fc !important; }
.menu-title>span,.menu-title{ color:#7c8aa3 !important; letter-spacing:.12em; text-transform:uppercase; font-size:.68rem; font-weight:700; }

/* ---- Surfaces: cards, dropdowns, inputs ---- */
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .app-wrapper .card{
  background:#1e293b !important; border:1px solid var(--tt-border-soft) !important; border-radius:var(--tt-radius) !important; }
[data-bs-theme="dark"] .dropdown-menu{ background:#1e293b; border:1px solid var(--tt-border-soft); border-radius:14px; }
.dropdown-item{ color:#e8edf9; } .dropdown-item:hover{ background:rgba(99,102,241,.16); color:#fff; }
[data-bs-theme="dark"] .form-control,[data-bs-theme="dark"] .form-select{
  background:#0f172a; border-color:#334155; color:#e8edf9; }
.form-control::placeholder{ color:#64748b; }
.badge.bg-primary-subtle{ background:rgba(99,102,241,.18) !important; }
.badge.text-primary{ color:#a5b4fc !important; }
.list-group-item{ background:transparent; }
hr,.dropdown-divider{ border-color:var(--tt-border-soft); }

/* ---- Credit pill ---- */
.kv-credit-pill{ padding:.4rem .85rem; border-radius:999px; font-weight:600; font-size:.85rem;
  color:#c7d2fe; background:rgba(99,102,241,.16); text-decoration:none; }
.kv-credit-pill:hover{ background:rgba(99,102,241,.28); }

/* ---- Avatar fallback ---- */
.kv-avatar-fallback{ width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  background:var(--tt-grad); color:#fff; font-weight:700; border-radius:50%; }

/* ---- Gradient text + CTA ---- */
.kv-grad-text{ background:var(--tt-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.kv-btn-grad{ background:var(--tt-grad); color:#fff; border:0; padding:.8rem 1.6rem; border-radius:999px;
  font-weight:600; box-shadow:0 12px 30px -8px rgba(79,86,232,.5); transition:transform .15s,box-shadow .15s; text-decoration:none; display:inline-block; }
.kv-btn-grad:hover{ transform:translateY(-2px); color:#fff; }

/* ---- Legacy tool card (older pages still using it) ---- */
.kv-tool-card{ display:block; height:100%; padding:1.25rem; border-radius:var(--tt-radius); text-decoration:none;
  border:1px solid var(--tt-border-soft); background:#1e293b; color:inherit; transition:transform .18s,box-shadow .25s,border-color .2s; }
.kv-tool-card:hover{ transform:translateY(-3px); box-shadow:0 18px 40px -18px rgba(0,0,0,.6); border-color:#6366f1; }
.kv-tool-ico{ width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; color:#fff; background:var(--tt-grad); margin-bottom:.85rem; }
.kv-tool-card h3{ font-size:1.02rem; font-weight:600; margin:0 0 .25rem; color:var(--bs-body-color); }
.kv-tool-card p{ font-size:.9rem; color:var(--bs-secondary-color); margin:0; }

/* ---- Guest landing (index/home) — slate + indigo ---- */
body.kv-landing{ background:#0b1120; color:#e8edf9; }
/* always keep landing content off the screen edges (esp. mobile) */
.kv-landing .container-xl{ padding-left:20px; padding-right:20px; }
@media(max-width:576px){ .kv-landing .container-xl{ padding-left:18px; padding-right:18px; } .kv-hero{ padding:2.4rem 0 2rem; } }
.kv-landing a{ color:#a5b4fc; }
.kv-landing header .text-body{ color:#cdd6e8 !important; }
.kv-hero{ position:relative; overflow:hidden; padding:4.5rem 0 3rem; text-align:center; }
.kv-hero>*{ position:relative; z-index:1; }
.kv-hero::before{ content:""; position:absolute; inset:-30% -10% auto -10%; height:520px; z-index:0; background:radial-gradient(60% 60% at 50% 0%, rgba(99,102,241,.22), rgba(99,102,241,.05) 55%, transparent 75%); }
/* Premium rotating light-sweep over the hero bg (CSS only — GPU transform, lightweight, reduced-motion safe).
   Three soft beams (gold · indigo · white) slowly rotate like a spotlight/star focus. Sits behind the text. */
.kv-hero::after{ content:""; position:absolute; z-index:0; pointer-events:none; top:50%; left:50%;
  width:175%; height:330%; transform:translate(-50%,-50%) rotate(0deg);
  background:conic-gradient(from 0deg,
    transparent 0deg, rgba(243,215,132,.17) 12deg, rgba(243,215,132,.05) 26deg, transparent 46deg,
    transparent 150deg, rgba(99,102,241,.15) 174deg, rgba(99,102,241,.05) 190deg, transparent 214deg,
    transparent 298deg, rgba(255,255,255,.07) 318deg, transparent 334deg, transparent 360deg);
  filter:blur(46px); mix-blend-mode:screen; opacity:.78; will-change:transform;
  animation:kvLightSweep 22s linear infinite; }
@keyframes kvLightSweep{ to{ transform:translate(-50%,-50%) rotate(360deg); } }
@media(prefers-reduced-motion:reduce){ .kv-hero::after{ animation:none; opacity:.42; } }
@media(max-width:576px){ .kv-hero::after{ filter:blur(34px); width:200%; } }

.kv-hero-logo{ width:min(330px,64vw); height:auto; filter:drop-shadow(0 0 28px rgba(243,215,132,.42)) drop-shadow(0 0 64px rgba(99,102,241,.22)); }
.kv-landing .kv-hero h1{ color:#f1f5f9; font-weight:700; line-height:1.15; margin:1.1rem 0 .7rem; letter-spacing:-.02em; }
.kv-landing .lead{ color:#b9c4da; max-width:720px; margin:0 auto 1.6rem; font-size:1.12rem; line-height:1.7; }
.kv-cta-row{ display:flex; gap:.75rem; justify-content:center; flex-wrap:wrap; }
.kv-stat{ text-align:center; } .kv-stat b{ display:block; font-size:1.8rem; font-weight:700; color:#a5b4fc; } .kv-stat span{ font-size:.85rem; color:#94a3b8; }
.kv-feature{ text-align:center; padding:1rem; } .kv-feature h4{ font-size:1rem; font-weight:600; margin:0 0 .25rem; }
.kv-feature .kv-fic{ width:56px; height:56px; border-radius:50%; margin:0 auto .7rem; display:flex; align-items:center; justify-content:center; font-size:1.4rem; background:rgba(99,102,241,.14); color:#a5b4fc; border:1px solid rgba(99,102,241,.4); }
.kv-feature h4,.kv-landing section h2,.kv-landing .kv-tool-card h3{ color:#f1f5f9; }
.kv-landing .kv-tool-card{ background:#1e293b; border-color:var(--tt-border-soft); }
.kv-band{ background:linear-gradient(90deg,#0f172a,#131c30,#0b1120); color:#f1f5f9; text-align:center;
  padding:clamp(1.6rem,4vw,3rem) 1rem; margin-top:1.5rem; font-weight:700; letter-spacing:-.01em;
  font-size:clamp(1.5rem,3.6vw,2.6rem); line-height:1.25;
  border-top:1px solid rgba(99,102,241,.35); border-bottom:1px solid rgba(99,102,241,.35); }
.kv-band b{ font-weight:800; }
.kv-band b{ color:#a5b4fc; }
.kv-landing footer{ border-color:var(--tt-border-soft) !important; }

/* reveal helper — visible by default */
.kv-reveal{ opacity:1; }

/* ── sidebar rhythm — consistent, tighter spacing (was too airy / inconsistent) ── */
.app-navbar .menubar{ padding:6px 8px; display:flex; flex-direction:column; gap:1px; }
.app-navbar .menu-item{ margin:0; }
.app-navbar .menu-link{ display:flex; align-items:center; gap:12px; padding:9px 12px !important; font-size:.92rem; line-height:1.1; }
.app-navbar .menu-link i{ font-size:1.05rem; width:20px; text-align:center; flex:0 0 20px; }
.app-navbar .menu-link .menu-label{ flex:1; }
/* section labels (pinned "CORE" and accordion headers) share one baseline */
.app-navbar .menu-title{ margin:12px 0 2px !important; padding:6px 12px !important; }
.app-navbar .menu-title:first-child{ margin-top:2px !important; }

/* ── collapsible accordion groups (pinned always open; rest one-at-a-time) ── */
.menu-collapse{ display:flex; align-items:center; gap:8px; cursor:pointer; user-select:none;
  border-radius:10px; transition:background .15s,color .15s; }
.menu-collapse>span{ flex:1; }
.menu-collapse:hover{ background:rgba(148,163,184,.08); }
.menu-collapse:hover>span{ color:#c7d2fe !important; }
.menu-collapse .menu-caret{ font-size:1rem; color:#7c8aa3; margin-left:auto; transition:transform .2s; }
.menu-collapse.open .menu-caret{ transform:rotate(180deg); color:#a5b4fc; }
.menu-collapse.open>span{ color:#c7d2fe !important; }
.menu-acc{ overflow:hidden; max-height:0; opacity:0; transition:max-height .25s ease, opacity .2s ease; }
.menu-acc.open{ max-height:640px; opacity:1; }
.menu-acc .menubar-sub{ list-style:none; margin:0; padding:2px 0 4px; display:flex; flex-direction:column; gap:1px; }