/* Brand Store — light theme variants Applied via — selectors use the html+attribute combination so they reliably override any page's own inline :root block, regardless of which loads first. */ html[data-theme="offwhite"] { --navy: #f7f5f1; --navy2: #ffffff; --text: #17140f; --muted: #443f36; --border: rgba(42,38,32,.12); --card: #ffffff; } html[data-theme="green"] { --navy: #eef6ef; --navy2: #ffffff; --text: #0f1d15; --muted: #3d5245; --border: rgba(31,51,38,.14); --card: #ffffff; } html[data-theme="orange"] { --navy: #fdf2ea; --navy2: #ffffff; --text: #23140b; --muted: #5c4433; --border: rgba(58,36,24,.14); --card: #ffffff; } /* Theme switcher widget */ .theme-switcher { display:flex; align-items:center; gap:6px; } .theme-switcher a { display:inline-block; width:22px; height:22px; border-radius:50%; border:2px solid rgba(0,0,0,.15); cursor:pointer; padding:0; transition:transform .2s, border-color .2s; text-decoration:none; } .theme-switcher a:hover { transform:scale(1.12); text-decoration:none; } .theme-switcher a.active { border-color:#1e2a5e; box-shadow:0 0 0 2px rgba(30,42,94,.25); } .theme-switcher a[data-swatch="offwhite"] { background:#f7f5f1; } .theme-switcher a[data-swatch="green"] { background:#eef6ef; } .theme-switcher a[data-swatch="orange"] { background:#fdf2ea; }