/* Site-wide theme switch. Yellow = default (no class). Blue = html.theme-blue, Big Box light blue #5B8BE6. */
html.theme-blue{--y:#0E4BB3;--on-y:#fff;--y2:#E3EBFA;--bb-y:#5B8BE6;--line:#D9DEEA;--acc-ink:#0E4BB3}
html.theme-blue img[src*="/brand/logo"],html.theme-blue img[srcset*="/brand/logo"]{content:url(/brand/logo-blue.webp)}
/* light blue is for black/dark surfaces; on grey/white use the darker Big Box blue (AA 6.1:1 on #d9dbda) */
html.theme-blue body.bb h2:after{background:var(--acc-ink)}
html.theme-blue body.bb .co h2:after{background:#5B8BE6}
html.theme-blue body.bb .tm-badge{background:#111;color:#5B8BE6}
html.theme-blue body.bb main a:not(.btn){color:var(--acc-ink)}
html.theme-blue body.bb .co a:not(.btn){color:#5B8BE6}
/* toggle */
.hm-theme-sw{display:inline-flex;gap:6px;align-items:center;vertical-align:middle;margin:0 8px}
.hm-theme-sw{gap:0}.hm-theme-sw button{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0;background:transparent;cursor:pointer;display:inline-grid;place-items:center;box-shadow:none;border-radius:50%}
.hm-theme-sw button::before{content:"";width:20px;height:20px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #111;box-sizing:border-box}
.hm-theme-sw button[data-t=yellow]::before{background:#FFD84D}.hm-theme-sw button[data-t=blue]::before{background:#0E4BB3}
.hm-theme-sw button[aria-pressed=true]::before{outline:3px solid #888;outline-offset:2px}
.hm-theme-sw button:focus-visible{outline:3px solid #111;outline-offset:-4px}
.hm-theme-sw.fixed{position:fixed;left:12px;bottom:12px;z-index:50;background:#111;padding:6px 8px;border-radius:20px;margin:0}

html.theme-blue{--cr:#F6F8FE;--cr2:#EBEFF8}
html.theme-blue body:not(.bb){background-color:var(--cr)}
html.theme-blue .hp-fab img,html.theme-blue .hp-av img,html.theme-blue .hp-face{filter:hue-rotate(177deg) saturate(.4) brightness(1.08)}
html.theme-blue .hp-fab{background:var(--y)}

/* language button: always dark text on its white pill */
.hm-top .lang-btn,body.bb .hm-top .lang-btn{background:#fff;color:#1a1a1a}
html.theme-blue{--off:#B4BCCF;--off2:#8790A6}
html.theme-blue body.mf-quote footer,html.theme-blue footer.wrap{background:var(--cr)}

/* #0E4BB3 fills carry white text (7.9:1); on black, text/borders use the lighter #5B8BE6 (5.6:1) */
html.theme-blue body.bb .btn-y{background:#0E4BB3;border-color:#5B8BE6;color:#fff}
html.theme-blue body.bb .btn-o{border-color:#5B8BE6}
html.theme-blue body.bb .btn-o:hover{background:#0E4BB3;color:#fff}
html.theme-blue body.bb .tm-badge{background:#111;color:#5B8BE6}
html.theme-blue .clock .sel,html.theme-blue .clock-ic svg [fill^="var(--y"]{stroke:#1a1a1a}
html.theme-blue .hp-fab{color:#fff}
html.theme-blue .hp-fav svg,html.theme-blue .hp-av svg{filter:hue-rotate(177deg) saturate(.9) brightness(.8)}
html.theme-blue .tm-chip.y,html.theme-blue .tm-badge b{color:#fff}
html.theme-blue .hp-fab{background:var(--y)!important}
html.theme-blue .hp-fav svg,html.theme-blue .hp-av svg{filter:none}

/* header: consistent 8px gaps between top-right controls; no overlap on small screens */
.hm-top .navr,.hm-top .topr{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;min-width:0}
.hm-top .navr>*,.hm-top .topr>*{margin:0;flex:none}
.hm-top .hm-theme-sw{margin:0}

/* chat widget keeps its own --y; follow the theme in blue mode */
html.theme-blue .hp{--y:#0E4BB3;--y2:#E3EBFA;--on-y:#fff}
html.theme-blue .hp-fab{background:#0E4BB3!important}
html.theme-blue .hpa .y{stroke:#5B8BE6}

/* step labels on white sections: no black pill; theme-coloured number square, readable label */
body.bb .tm-badge,html.theme-blue body.bb .tm-badge{background:none;color:#111;padding:0}
body.bb .tm-badge b{background:var(--y);color:var(--on-y,#111);border:2px solid #111}
html.theme-blue body.bb .tm-badge{color:#0E4BB3}
html.theme-blue body.bb .tm-badge b{color:#fff}

/* single theme toggle: 44px target, 22px dot in the CURRENT theme colour */
.hm-theme-btn{width:44px;height:44px;min-width:44px;padding:0;border:0;background:transparent;border-radius:50%;cursor:pointer;display:inline-grid;place-items:center}
.hm-theme-btn::before{content:"";width:22px;height:22px;border-radius:50%;box-sizing:border-box;border:2px solid #fff;box-shadow:0 0 0 1.5px #111;background:#FFD84D}
.hm-theme-btn[data-t=blue]::before{background:#0E4BB3}
.hm-theme-btn:focus-visible{outline:3px solid #5B8BE6;outline-offset:-3px}
@media(max-width:400px){.hm-top .navr,.hm-top .topr{gap:4px}}

/* theme toggle floats directly below the Happy chat bubble (same right edge column, 8px gap) */
.hm-theme-sw.float{position:fixed;z-index:61;margin:0;display:block;right:34px;bottom:22px}
.hm-theme-sw.float .hm-theme-btn{background:#111;box-shadow:2px 2px 0 rgba(0,0,0,.35)}
body .hp-fab{bottom:74px!important}
@media(max-width:519px){.hm-theme-sw.float{right:20px;bottom:calc(14px + env(safe-area-inset-bottom))}
 body .hp-fab{bottom:calc(66px + env(safe-area-inset-bottom))!important}}
body.mf-quote .hm-theme-sw.float{right:16px}
@media(min-width:520px){body.mf-quote .hm-theme-sw.float{right:34px}}
body.mf-nofab .hm-theme-sw.float{opacity:0;pointer-events:none}
.hm-theme-sw.float{transition:opacity .2s}