/* JobBridge — "Bright" theme (purple / cream / gold redesign)
   Loads AFTER style.css and overrides tokens + key components.
   Switch from Admin > Settings > Look & Theme. */
:root{
  --navy-900:#2B1A78; --navy-700:#4A2AD8; --navy-100:#EFEAFF;
  --gold-500:#E3A93B; --gold-100:#FFF6E2;
  --paper:#F4F1EA; --ink-900:#14183A; --ink-500:#6B7096; --line:rgba(20,24,58,.09);
  --success:#1B8F67; --warning:#9A6F14; --danger:#FF6A5B;
  --purple:#6C4DF6; --purple-soft:#8A6BFF; --cream-gold:#FFD98A; --mint:#24C08A;
  --shadow:0 1px 0 rgba(20,24,58,.04),0 26px 50px -40px rgba(20,24,58,.5);
  --r:16px; --r-lg:24px;
}
body{background:radial-gradient(1100px 620px at 88% -10%,#E7E0FF 0%,rgba(244,241,234,0) 62%),radial-gradient(700px 500px at 4% 8%,#FFF3D9 0%,rgba(244,241,234,0) 60%),var(--paper);
  color:var(--ink-900);font-family:"Plus Jakarta Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3.serif,.serif,.wordmark,.statcard .num,.iv-q,.iv-hr-face{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:800;letter-spacing:-.02em}
h1{font-size:38px;line-height:1.05;letter-spacing:-.03em} h2{font-size:26px;font-weight:700} h3{font-weight:700}
a:hover{color:var(--purple)}
.label{font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;letter-spacing:.13em;color:var(--ink-500)}
.gold{color:var(--purple)}

/* nav */
.topnav{height:68px;background:rgba(244,241,234,.82);backdrop-filter:blur(14px);border-bottom:1px solid rgba(20,24,58,.08)}
.wordmark{font-size:21px;color:var(--ink-900);display:flex;align-items:center;gap:10px}
.wordmark::before{content:"";width:32px;height:32px;border-radius:10px;background:linear-gradient(150deg,#8A6BFF,#4A2AD8 62%,#2B1A78);box-shadow:0 8px 18px -8px rgba(76,42,216,.8);flex:none;
  background-image:linear-gradient(#FFD98A,#FFD98A),linear-gradient(150deg,#8A6BFF,#4A2AD8 62%,#2B1A78);background-size:16px 12px,100% 100%;background-position:center 9px,0 0;background-repeat:no-repeat}
.topnav nav{gap:4px;padding:4px;background:rgba(255,255,255,.7);border:1px solid rgba(20,24,58,.07);border-radius:999px}
.topnav nav a,.topnav nav span{font-size:13px;font-weight:600;padding:8px 14px;border-radius:999px;color:#54617A;transition:.18s}
.topnav nav a:hover{background:var(--navy-100);color:var(--navy-900)}
.topnav nav a.nav-user{color:var(--ink-500)}
.topnav nav a.nav-cta{background:var(--ink-900);color:#fff}
.topnav nav a.nav-cta:hover{background:var(--purple);color:#fff}
.footer{border-top:1px solid rgba(20,24,58,.08);color:var(--ink-500)}

/* buttons */
.btn{border-radius:14px;font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;padding:13px 22px;transition:.18s}
.btn-primary{background:var(--purple);color:#fff;box-shadow:0 16px 30px -18px rgba(108,77,246,.9)}
.btn-primary:hover{background:var(--purple-soft);transform:translateY(-1px)}
.btn-gold{background:var(--cream-gold);color:var(--navy-900);box-shadow:0 16px 30px -16px rgba(255,217,138,.9)}
.btn-gold:hover{filter:none;transform:translateY(-2px);box-shadow:0 22px 38px -16px rgba(255,217,138,1)}
.btn-secondary{border-color:rgba(20,24,58,.18);color:var(--ink-900);background:#fff}
.btn-secondary:hover{background:var(--navy-100);border-color:var(--purple);color:var(--navy-900)}
.btn-ghost-white{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.12)}
.btn-ghost-white:hover{background:rgba(255,255,255,.2)}

/* cards */
.card{background:#fff;border:0;border-radius:var(--r-lg);box-shadow:var(--shadow);padding:26px}
.statcard{border:0;border-radius:22px;box-shadow:0 20px 40px -36px rgba(20,24,58,.6);padding:22px}
.statcard .num{font-size:38px;color:var(--ink-900)}
.statcard.accent{border-left:0;background:linear-gradient(160deg,#FFF6E2,#FFE9B8);border:1px solid rgba(227,169,59,.4)}
.statcard.accent .num{color:#5C4207} .statcard.accent .label{color:#9A6F14}
.badge{border-radius:999px;padding:5px 10px;font-family:"Plus Jakarta Sans",sans-serif;font-weight:700}
.badge-gold{background:#FFF6E2;color:#9A6F14}
.badge-muted{background:#EDE9F7;color:var(--ink-500)}
.badge-success{background:#E4F7EE;color:var(--success)}
.pill{border-radius:999px;border-color:rgba(20,24,58,.1);font-family:"Plus Jakarta Sans",sans-serif;font-weight:600}
.pill.active{background:var(--ink-900);border-color:var(--ink-900)}

/* forms */
.field label{font-family:"Plus Jakarta Sans",sans-serif;font-weight:700}
.field input,.field select,.field textarea{border-radius:14px;border-color:rgba(20,24,58,.12);font-family:"Plus Jakarta Sans",sans-serif;padding:13px 16px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--purple);box-shadow:0 0 0 4px rgba(108,77,246,.14)}
.prefix-wrap span{border-radius:14px 0 0 14px;border-color:rgba(20,24,58,.12);background:var(--navy-100)}
.prefix-wrap input{border-radius:0 14px 14px 0}
.alert{border-radius:14px}
.alert-danger{background:#FFF0EE;color:#B3382A;border-color:#FFD3CD}
.alert-success{background:#E4F7EE;border-color:#BFEBD6}

/* hero */
.hero{background:linear-gradient(125deg,#2B1A78 0%,#4A2AD8 48%,#6C4DF6 100%);border-radius:0 0 32px 32px;box-shadow:0 40px 80px -50px rgba(43,26,120,.9)}
.hero::before{background:radial-gradient(circle at 85% 10%,rgba(255,217,138,.45),rgba(255,217,138,0) 40%),radial-gradient(circle at 40% 120%,rgba(36,192,138,.35),rgba(36,192,138,0) 40%)}
.hero h1{font-weight:800;letter-spacing:-.03em}
.hero p{opacity:.85}
.hero .rule{border-top-color:var(--cream-gold)}

/* chat */
.msg{border-radius:18px;padding:14px 18px}
.msg-ai{background:#fff;border:0;box-shadow:0 12px 30px -24px rgba(20,24,58,.5);border-bottom-left-radius:6px}
.msg-me{background:var(--ink-900);color:#fff;border-bottom-right-radius:6px}
.avatar-jb{background:linear-gradient(150deg,#8A6BFF,#4A2AD8);font-family:"Plus Jakarta Sans",sans-serif;font-weight:700}
.chatbar{background:rgba(244,241,234,.9);backdrop-filter:blur(12px);border-top:1px solid rgba(20,24,58,.08)}
.chatbar input{border-radius:999px;border-color:rgba(20,24,58,.12);background:#fff}
.chip{border-radius:999px;border-color:rgba(20,24,58,.1);font-weight:600}
.chip:hover{border-color:var(--purple);background:var(--navy-100);color:var(--navy-900)}
.progressbar{height:7px;border-radius:99px;background:#DED3FF}
.progressbar i{background:linear-gradient(90deg,#6C4DF6,#8A6BFF)}

/* interview room */
.iv-room{background:var(--ink-900)}
.iv-panel{border-radius:24px;background:linear-gradient(135deg,#2B1A78,#14183A)}
.iv-panel.speaking{border-color:var(--cream-gold)}
@keyframes pulseBorder{50%{box-shadow:0 0 30px rgba(255,217,138,.35)}}
.iv-hr-face{background:linear-gradient(150deg,#FFE9B8,#E3A93B);color:var(--navy-900)}
.wave i{background:var(--cream-gold)}
.micbtn{background:var(--cream-gold);color:var(--navy-900);box-shadow:0 16px 30px -16px rgba(255,217,138,.9)}
.micbtn.rec::after{border-color:var(--cream-gold)}
.iv-answer textarea{border-radius:16px;font-family:"Plus Jakarta Sans",sans-serif}
.iv-answer textarea:focus{border-color:var(--cream-gold)}
.rdot.done i{background:var(--mint);border-color:var(--mint);color:#fff}
.rdot.current i{border-color:var(--cream-gold);color:var(--cream-gold)}

/* score bars + tables */
.scorebar .track{border-radius:99px;background:#EDE9F7}
.scorebar .fill{background:linear-gradient(90deg,#6C4DF6,#8A6BFF);border-radius:99px}
.tbl{border:0;border-radius:20px;box-shadow:var(--shadow)}
.tbl th{font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;color:var(--ink-500);background:#FBFAF7;border-bottom-color:rgba(20,24,58,.08)}
.tbl td{border-bottom-color:rgba(20,24,58,.06)}
.tbl tr:hover td{background:#F8F5FF}
.tbl tr.top10 td{background:#FFFCF4}
.tbl-scroll{border-radius:20px}

/* misc */
.navy-band,.insight{background:var(--ink-900);border-radius:26px;position:relative;overflow:hidden}
.navy-band::after,.insight::after{content:"";position:absolute;right:-40px;bottom:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(108,77,246,.55),transparent 65%);pointer-events:none}
.navy-band>*,.insight>*{position:relative;z-index:1}
.split-left{background:linear-gradient(160deg,#2B1A78,#4A2AD8 70%,#6C4DF6)}
.steps-v .st.on{color:var(--cream-gold)}
.tpl-card{border-radius:14px} .tpl-card.sel{border-color:var(--purple);box-shadow:0 0 0 3px rgba(108,77,246,.18)}
.accent-sw.sel{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--purple)}
@keyframes flashbg{0%{background:#EFEAFF}100%{background:transparent}}


/* ===== v2 component tokens for Bright ===== */
:root{
  --r:16px; --r-lg:26px;
  --accent:#6C4DF6; --accent-2:#8A6BFF; --accent-soft:#EFEAFF; --accent-deep:#14183A;
  --cta:#FFD98A; --cta-ink:#2B1A78;
  --mint:#24C08A; --mint-soft:#F0FBF6; --mint-ink:#1B8F67;
  --soft-shadow:0 1px 0 rgba(20,24,58,.04),0 26px 50px -40px rgba(20,24,58,.5);
}
.display,.panel-head h3,.tile .big,.ring>*,.dark h3,.orbit .tag .v,.orbit .face,.pod .blk,.brow .rk,.brow .pts,.rcard .n,.rcard .sc b,.rowc .logo,.auth-art .facts b{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:800}
.panel-head h3,.dark h3{font-weight:700}
.eyebrow.on{color:var(--accent)}
.jb-hero{background:linear-gradient(125deg,#2B1A78 0%,#4A2AD8 48%,#6C4DF6 100%);box-shadow:0 40px 80px -50px rgba(43,26,120,.9)}
.jb-hero h1{font-weight:800;letter-spacing:-.03em}
.orbit .face small{font-family:"Plus Jakarta Sans",sans-serif}
.panel,.tile,.board{border:0}
.panel-head .link{color:var(--accent)}
.stage.cur{background:linear-gradient(160deg,#EFEAFF,#F8F5FF);box-shadow:0 18px 34px -26px rgba(108,77,246,.9)}
.stage .bar{background:#DED3FF} .stage .bar i{background:linear-gradient(90deg,#6C4DF6,#8A6BFF)}
.stage.lock{background:#F7F6F2;border-color:rgba(20,24,58,.18)}
.tile .big small,.ring.lg .of,.tile .k{font-family:"Plus Jakarta Sans",sans-serif}
.seg i{background:#E5E2F5}
.ring{background:conic-gradient(var(--accent) 0turn var(--p),#EDE9F7 var(--p) 1turn)}
.dark::after{background:radial-gradient(circle,rgba(108,77,246,.55),transparent 65%)}
.dark.grad{background:linear-gradient(120deg,#14183A,#2B1A78 70%)}
.dark .btn-acc,.drill .btn-acc{background:var(--accent);color:#fff}
.btn-acc:hover{background:#8A6BFF;filter:none}
.lg1{background:linear-gradient(150deg,#8A6BFF,#4A2AD8)}
.rowc{background:#F7F6F2;border:0}
a.rowc:hover{background:#F3EFFF}
.brow{background:#FBFAF7}
.brow.me{background:linear-gradient(120deg,#2B1A78,#4A2AD8)}
.brow .prog i{background:#EDE9F7}
.bar-tile{background:#FBFAF7;border-color:rgba(20,24,58,.07)} .bar-tile .tr{background:#EDE9F7}
.trend i{background:#DED3FF} .trend>div:nth-last-child(2) i{background:#C4B2FF}
.rcard{background:#F7F6F2;border-color:transparent} .rcard.done{background:#fff} .rcard.next{background:linear-gradient(160deg,#EFEAFF,#F8F5FF);border-color:#6C4DF6}
.rcard .acts a{border-color:rgba(20,24,58,.14)}
.auth-art{background:linear-gradient(150deg,#2B1A78,#4A2AD8 55%,#6C4DF6);border-radius:30px}
.auth-art h1{font-weight:800;letter-spacing:-.03em}
.auth-form{border:0;border-radius:30px}
.rowc-logo{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:800}
.ccard,.secrow{border:0} .secrow{background:#FBFAF7;border:1px solid rgba(20,24,58,.06)}
.hrbox{background:#FBFAF7;border-color:rgba(20,24,58,.07)}
.cbtn.ghost{border-color:rgba(20,24,58,.14)}
