/* =====================================================================
   Accent pass (Oct 20 2026). Two cumulative levels behind a class on <html> (base.html):
     acc1 = light touch: cyan labels + active states, gradient top edge on key cards, gradient dividers, cyan links
     acc2 = medium (acc1 + this): gradient-filled active chips/tabs, ramp chart lines + areas, soft cyan-tinted
            featured cards, seafoam back on live tags / step numbers / follow states, gradient bottom-nav indicator
   Switch with one line in base.html: class="... acc1" (light) or "... acc1 acc2" (medium, default).
   Text cyan: #3EC8C9 on dark, #1A9FA0 on light (3.2:1 on white, large/bold text and labels only).
   Gains green / losses red are data and never change here. Loaded after gradients.css.
   ===================================================================== */
html.acc1 body.ct{--acc:#1A9FA0;--acc-tint:rgba(26,159,160,.07);--acc-tint-2:rgba(43,127,211,.05);--acc-edge:rgba(26,159,160,.45)}
html.acc1[data-theme=dark] body.ct{--acc:#3EC8C9;--acc-tint:rgba(62,200,201,.08);--acc-tint-2:rgba(43,127,211,.07);--acc-edge:rgba(62,200,201,.45)}

/* ---------- ACC1: light touch ---------- */
/* section labels / eyebrows */
html.acc1[data-theme] body.ct .hx .hx-eye{color:#3EC8C9!important}
html.acc1[data-theme] body.ct h2.xg-h,html.acc1[data-theme] body.ct .eyebrow,html.acc1[data-theme] body.ct .cx-eyebrow{color:var(--acc)!important}
html.acc1[data-theme] body.ct .mcard .stat .k{color:var(--acc)!important}
/* active states */
html.acc1[data-theme] body.ct .hx-tabs button[aria-selected=true]{color:var(--acc)!important;border-color:var(--acc-edge)!important;background:var(--acc-tint)!important}
html.acc1[data-theme] body.ct .cx-seg a.on,html.acc1[data-theme] body.ct .segc a.on,html.acc1[data-theme] body.ct .tabs a.on{color:var(--acc)!important;box-shadow:inset 0 -2px 0 var(--acc),0 1px 2px rgba(0,0,0,.08)!important}
html.acc1[data-theme] body.ct .fchip.on{background:var(--ink)!important;color:var(--bg)!important;border-color:var(--ink)!important;box-shadow:inset 0 -2px 0 #3EC8C9!important}
html.acc1[data-theme] body.ct .mvseg button[aria-pressed=true]{color:var(--acc)!important}
html.acc1[data-theme] body.ct nav.bottom.cx a.on{color:#F2F4F5!important}
html.acc1[data-theme] body.ct nav.bottom.cx a.on svg{color:#3EC8C9!important}
/* gradient top edge on key cards (hero chart card already has one) */
html.acc1[data-theme] body.ct .mcard,
html.acc1[data-theme] body.ct .card:has(>.chartwrap),html.acc1[data-theme] body.ct .card:has(>.chart),
html.acc1[data-theme] body.ct .card:has(>.tc-h),html.acc1[data-theme] body.ct .shero.card{background:var(--grad-edge) top/100% 2px no-repeat,var(--surface)!important}
/* gradient dividers: section heads (g3 bar, longer), page heads, footer rule */
html.acc1[data-theme] body.ct .sech::before,html.acc1[data-theme] body.ct .mvsec .mvtop::before{width:72px!important;background:var(--grad-navfade,var(--grad-brand))!important}
html.acc1[data-theme] body.ct .pghead{position:relative;padding-bottom:14px}
html.acc1[data-theme] body.ct .pghead::after{content:"";position:absolute;left:0;bottom:0;width:72px;height:2px;border-radius:2px;background:var(--grad-brand)}
html.acc1[data-theme] body.ct .cx-foot{border-top:0!important;position:relative}
html.acc1[data-theme] body.ct .cx-foot::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--grad-navfade,var(--grad-brand));opacity:.8}
/* links: cyan "more" links, cyan hover everywhere in content */
html.acc1[data-theme] body.ct .hx-more,html.acc1[data-theme] body.ct .sech>a,html.acc1[data-theme] body.ct .mvtop a,html.acc1[data-theme] body.ct .hiw-steps a,html.acc1[data-theme] body.ct .more>a,html.acc1[data-theme] body.ct a.more{color:var(--acc)!important}
html.acc1[data-theme] body.ct main a:not(.btn):not(.fchip):hover{color:var(--acc)!important;text-decoration-color:var(--acc)!important}
html.acc1[data-theme] body.ct main a.row:hover .t,html.acc1[data-theme] body.ct main a.mcard:hover h3,html.acc1[data-theme] body.ct main .trow:hover .tt{color:var(--acc)!important}
/* rank ("#1 of 360") cyan in both themes; step numbers cyan */
html.acc1[data-theme] body.ct .wr,html.acc1[data-theme] body.ct .brank{color:var(--acc)!important}
html.acc1[data-theme] body.ct .hiw-n{color:var(--acc)!important;border-color:var(--acc-edge)!important}
/* explore icons pick up the accent */
html.acc1[data-theme] body.ct .trow .ic{color:var(--acc)!important}
/* focus + native controls */
html.acc1[data-theme] body.ct{accent-color:#3EC8C9}
html.acc1[data-theme] body.ct input:focus,html.acc1[data-theme] body.ct select:focus,html.acc1[data-theme] body.ct textarea:focus{border-color:var(--acc)!important;box-shadow:0 0 0 1px var(--acc)!important;outline:none}

/* ---------- ACC2: medium ---------- */
/* gradient-filled active chips / tabs (dark text on the action gradient >= 6.2:1) */
html.acc2[data-theme] body.ct .fchip.on,html.acc2[data-theme] body.ct .ct-pchip.on{background:var(--grad-action)!important;color:#0B1A1B!important;border-color:transparent!important;box-shadow:none!important}
html.acc2[data-theme] body.ct .hx-tabs button[aria-selected=true]{background:var(--grad-action)!important;color:#0B1A1B!important;border-color:transparent!important}
html.acc2[data-theme] body.ct .cx-seg a.on,html.acc2[data-theme] body.ct .segc a.on,html.acc2[data-theme] body.ct .tabs a.on,html.acc2[data-theme] body.ct .ct-seg button.on,html.acc2[data-theme] body.ct .ct-seg button[aria-pressed=true]{background:var(--grad-action)!important;color:#0B1A1B!important;box-shadow:none!important}
html.acc2[data-theme] body.ct .mvseg button[aria-pressed=true]{background:var(--acc-tint)!important;color:var(--acc)!important}
/* sector / category labels in cyan */
html.acc2[data-theme] body.ct .cat,html.acc2[data-theme] body.ct .tmeta .cat,html.acc2[data-theme] body.ct .shero .sx{color:var(--acc)!important}
/* ramp chart lines + areas: stock page chart and price charts that weren't caught by gradients.js */
html.acc2[data-theme] body.ct .hx-svg .hx-mod{stroke-width:2.5!important}
html.acc2[data-theme] body.ct .legend i[style*="3EC8C9"],html.acc2[data-theme] body.ct .legend i[style*="accent"]{background:var(--grad-action)!important}
html.acc2[data-theme] body.ct .bar i{background:linear-gradient(0deg,#2B7FD3,#3EC8C9)!important}
html.acc2[data-theme] body.ct .cmpbar i,html.acc2[data-theme] body.ct .rangebar .rg{background:var(--grad-action)!important}
/* soft cyan-tinted featured cards: first (featured) model card, model page key stats, hero chart card */
html.acc2[data-theme] body.ct .mcard:first-of-type{background:var(--grad-edge) top/100% 2px no-repeat,linear-gradient(135deg,var(--acc-tint) 0%,var(--acc-tint-2) 100%),var(--surface)!important;border-color:var(--acc-edge)!important}
html.acc2[data-theme] body.ct .ct-mstats .stat,html.acc2[data-theme] body.ct .mcard .stat{background:linear-gradient(135deg,var(--acc-tint),transparent 70%),var(--surface)!important}
/* seafoam back where it was: live tags, step numbers, follow-on, health chips */
html.acc2[data-theme] body.ct .chip.live,html.acc2[data-theme] body.ct .mtag.solid{background:var(--new)!important;border-color:var(--new-edge)!important;color:var(--acc)!important}
html.acc2[data-theme] body.ct .hiw-n{background:var(--new)!important;border-color:var(--new-edge)!important}
html.acc2[data-theme] body.ct .ffol.on,html.acc2[data-theme] body.ct .hchip.ok{background:var(--new)!important;border-color:var(--new-edge)!important;color:var(--acc)!important}
html.acc2[data-theme] body.ct .trow .ic{background:var(--new)!important;border-color:var(--new-edge)!important}
/* gradient bottom-nav indicator + cyan label; desktop header underline uses the nav fade */
html.acc2[data-theme] body.ct nav.bottom.cx a.on{color:#3EC8C9!important}
html.acc2[data-theme] body.ct nav.bottom.cx a.on::before{width:28px!important;height:3px!important;margin-left:-14px!important;top:0!important;border-radius:0 0 3px 3px!important;background:var(--grad-action)!important;box-shadow:0 2px 10px rgba(62,200,201,.45)}
html.acc2[data-theme] body.ct header .dnav a.on::after{width:28px!important;margin-left:-14px!important;background:var(--grad-action)!important;box-shadow:0 0 8px rgba(62,200,201,.45)}

/* compact home modules (design.css): gradient top edge (acc1); gradient-filled Gainers/Losers switch (acc2) */
html.acc1[data-theme] body.ct.pg-home .hm-mod{background:var(--grad-edge) top/100% 2px no-repeat,var(--surface)!important}
html.acc1[data-theme] body.ct.pg-home .hm-mod>.sech h2{color:var(--ink)!important}
html.acc1[data-theme] body.ct.pg-home .hm-gl button.on{color:var(--acc)!important}
html.acc2[data-theme] body.ct.pg-home .hm-gl button.on{background:var(--grad-action)!important;color:#0B1A1B!important;box-shadow:none!important}
