/* BioStudio AI — Windows colorway packs (theme-windows).
   The five wallpaper themes share Windows chrome (taskbar, Start, titlebars)
   but each owns a full token pack so windows, menus, apps, and nested
   studios follow that colorway. Scoped under .theme-windows so macOS /
   BioStudio 1–2 / Mono / Air never pick these up. macos shares wp-biostudio
   as wallpaper, so every rule here also requires .theme-windows. */

/* Shared aliases for the Windows shell; each wp-* block overrides palette. */
html #os.theme-windows,
html body.theme-windows,
#os.theme-windows,
body.theme-windows {
  --accent-ink: #ffffff;
  --on-primary: #ffffff;
  --primary: var(--accent);
  --primary-soft: var(--accent-soft);
  --app-bg: var(--win-body-bg);
  --app-bar: var(--titlebar-bg);
  --app-line: var(--win-border);
  --app-btn: var(--win-bg);
  --app-btn-hover: var(--tb-hover);
  --app-input: var(--input-bg);
  --menu-bg: var(--flyout-bg);
  --menu-border: var(--flyout-border);
  --menu-hover: var(--tb-hover);
  --surface: var(--win-body-bg);
  --text: var(--ink);
  --muted: var(--ink-soft);
  --border: var(--win-border);

  /* Stable copies the per-window White picker cannot overwrite, so nested
     File Explorer / menus / studios keep this colorway's identity. */
  --os-accent: var(--accent);
  --os-accent-soft: var(--accent-soft);
  --os-accent-ink: var(--accent-ink);
  --os-win-bg: var(--win-bg);
  --os-win-body: var(--win-body-bg);
  --os-titlebar: var(--titlebar-bg);
  --os-flyout: var(--flyout-bg);
  --os-ink: var(--ink);
  --os-ink-soft: var(--ink-soft);
  --os-border: var(--win-border);
  --os-input: var(--input-bg);
  --os-hover: var(--tb-hover);
  --mono-bg: var(--os-win-body);
  --mono-surface: var(--os-win-bg);
  --mono-surface-2: var(--os-titlebar);
  --mono-surface-3: var(--tile-bg);
  --mono-ink: var(--os-ink);
  --mono-ink-soft: var(--os-ink-soft);
  --mono-faint: var(--os-ink-soft);
  --mono-line: var(--os-border);
  --mono-win-border: var(--os-border);
  --mono-hover: var(--os-hover);
  --mono-primary: var(--os-accent);
  --mono-primary-strong: var(--os-accent);
  --mono-primary-soft: var(--os-accent-soft);
  --mono-accent: var(--os-accent);
  --mono-accent-soft: var(--os-accent-soft);
  --mono-accent-ink: var(--os-accent-ink);
  --mono-glass: var(--os-flyout);
  --mono-control-bg: var(--os-input);
  --mono-control-line: var(--os-border);
  --mono-tech: var(--os-accent);
  --mono-tech-2: var(--os-accent);
}

/* ---- BioStudio AI (navy #00376e, the default) ------------------------ */
html #os.theme-windows.wp-biostudio,
html body.theme-windows.wp-biostudio,
#os.theme-windows.wp-biostudio,
body.theme-windows.wp-biostudio {
  --accent: #00376e;
  --accent-soft: rgba(0, 55, 110, 0.12);
  --ink: #111c2a;
  --ink-soft: #5a6878;
  --win-bg: rgba(246, 248, 251, 0.96);
  --win-body-bg: #f5f7fa;
  --win-border: rgba(0, 55, 110, 0.14);
  --win-border-focus: #00376e;
  --titlebar-bg: #ebeff4;
  --flyout-bg: rgba(248, 249, 251, 0.96);
  --flyout-border: rgba(0, 55, 110, 0.12);
  --tile-bg: rgba(0, 55, 110, 0.06);
  --tile-hover: rgba(0, 55, 110, 0.1);
  --input-bg: #ffffff;
  --input-border: rgba(0, 55, 110, 0.2);
  --taskbar-bg: rgba(236, 240, 245, 0.92);
  --taskbar-border: rgba(0, 55, 110, 0.16);
  --tb-hover: rgba(0, 55, 110, 0.1);
  --tb-active: rgba(0, 55, 110, 0.07);
  --scrollbar-thumb: rgba(0, 55, 110, 0.35);
  --scrollbar-thumb-hover: rgba(0, 55, 110, 0.5);
  --win-shadow-focus: 0 18px 50px rgba(0, 28, 56, 0.22), 0 0 0 1px rgba(0, 55, 110, 0.3);
}
html #os.theme-windows.wp-biostudio.dark,
html body.theme-windows.wp-biostudio.dark,
#os.theme-windows.wp-biostudio.dark,
body.theme-windows.wp-biostudio.dark {
  --ink: #e6edf5;
  --ink-soft: #93a4b8;
  --win-bg: #121a24;
  --win-body-bg: #0c131c;
  --win-border: rgba(58, 118, 194, 0.18);
  --titlebar-bg: #15202c;
  --flyout-bg: #15202c;
  --flyout-border: rgba(58, 118, 194, 0.2);
  --tile-bg: rgba(58, 118, 194, 0.1);
  --input-bg: #0b121b;
  --input-border: rgba(58, 118, 194, 0.26);
  --taskbar-bg: rgba(11, 18, 27, 0.94);
  --taskbar-border: rgba(58, 118, 194, 0.16);
  --tb-hover: rgba(58, 118, 194, 0.14);
}
/* Navy vanishes on dark surfaces, so dark mode lifts the same blue. It must
   be !important to beat the inline --accent that applyTheme (os.js) sets;
   Ocean and Orchid bring their own accent. */
html #os.theme-windows.wp-biostudio.dark:not([data-color-theme="ocean"], [data-color-theme="orchid"]),
html body.theme-windows.wp-biostudio.dark:not([data-color-theme="ocean"], [data-color-theme="orchid"]) {
  --accent: #3a76c2 !important;
  --accent-soft: rgba(58, 118, 194, 0.2);
  --win-border-focus: #3a76c2;
}

/* ---- Aurora (electric blue bloom) ------------------------------------ */
html #os.theme-windows.wp-aurora,
html body.theme-windows.wp-aurora,
#os.theme-windows.wp-aurora,
body.theme-windows.wp-aurora {
  --accent: #2f6bff;
  --accent-soft: rgba(47, 107, 255, 0.18);
  --ink: #152238;
  --ink-soft: #5b6b80;
  --win-bg: rgba(244, 247, 255, 0.96);
  --win-body-bg: #f5f7fc;
  --win-border: rgba(32, 60, 140, 0.14);
  --win-border-focus: #2f6bff;
  --titlebar-bg: #eef2fb;
  --flyout-bg: rgba(247, 249, 255, 0.96);
  --flyout-border: rgba(32, 60, 140, 0.12);
  --tile-bg: rgba(47, 107, 255, 0.08);
  --tile-hover: rgba(47, 107, 255, 0.16);
  --input-bg: #ffffff;
  --input-border: rgba(32, 60, 140, 0.2);
  --taskbar-bg: rgba(236, 241, 252, 0.92);
  --taskbar-border: rgba(47, 107, 255, 0.2);
  --tb-hover: rgba(47, 107, 255, 0.12);
  --tb-active: rgba(47, 107, 255, 0.08);
  --scrollbar-thumb: rgba(47, 107, 255, 0.4);
  --scrollbar-thumb-hover: rgba(47, 107, 255, 0.6);
  --win-shadow-focus: 0 18px 50px rgba(20, 40, 110, 0.22), 0 0 0 1px rgba(47, 107, 255, 0.35);
}
html #os.theme-windows.wp-aurora.dark,
html body.theme-windows.wp-aurora.dark,
#os.theme-windows.wp-aurora.dark,
body.theme-windows.wp-aurora.dark {
  --ink: #e8eefc;
  --ink-soft: #9aa8c4;
  --win-bg: #161b2c;
  --win-body-bg: #111624;
  --win-border: rgba(120, 160, 255, 0.16);
  --titlebar-bg: #1a2136;
  --flyout-bg: #1a2136;
  --input-bg: #101522;
  --taskbar-bg: rgba(14, 18, 32, 0.94);
}

/* ---- Mint Lab -------------------------------------------------------- */
html #os.theme-windows.wp-mint,
html body.theme-windows.wp-mint,
#os.theme-windows.wp-mint,
body.theme-windows.wp-mint {
  --accent: #0f9d76;
  --accent-soft: rgba(15, 157, 118, 0.16);
  --ink: #12352c;
  --ink-soft: #54756c;
  --win-bg: rgba(244, 252, 249, 0.96);
  --win-body-bg: #f3fbf7;
  --win-border: rgba(15, 100, 80, 0.14);
  --win-border-focus: #0f9d76;
  --titlebar-bg: #e8f6f1;
  --flyout-bg: rgba(247, 253, 250, 0.96);
  --flyout-border: rgba(15, 100, 80, 0.12);
  --tile-bg: rgba(15, 157, 118, 0.08);
  --tile-hover: rgba(15, 157, 118, 0.16);
  --input-bg: #ffffff;
  --input-border: rgba(15, 100, 80, 0.2);
  --taskbar-bg: rgba(230, 247, 240, 0.92);
  --taskbar-border: rgba(15, 157, 118, 0.2);
  --tb-hover: rgba(15, 157, 118, 0.12);
  --tb-active: rgba(15, 157, 118, 0.08);
  --scrollbar-thumb: rgba(15, 157, 118, 0.4);
  --scrollbar-thumb-hover: rgba(15, 157, 118, 0.6);
  --win-shadow-focus: 0 18px 50px rgba(8, 70, 54, 0.2), 0 0 0 1px rgba(15, 157, 118, 0.35);
}
html #os.theme-windows.wp-mint.dark,
html body.theme-windows.wp-mint.dark,
#os.theme-windows.wp-mint.dark,
body.theme-windows.wp-mint.dark {
  --ink: #e4f6ef;
  --ink-soft: #8ab5a8;
  --win-bg: #12201c;
  --win-body-bg: #0e1a17;
  --win-border: rgba(67, 214, 166, 0.16);
  --titlebar-bg: #162621;
  --flyout-bg: #162621;
  --input-bg: #0c1613;
  --taskbar-bg: rgba(10, 20, 17, 0.94);
}

/* ---- Sunset ---------------------------------------------------------- */
html #os.theme-windows.wp-sunset,
html body.theme-windows.wp-sunset,
#os.theme-windows.wp-sunset,
body.theme-windows.wp-sunset {
  --accent: #ff6a3d;
  --accent-soft: rgba(255, 106, 61, 0.16);
  --ink: #3a1a22;
  --ink-soft: #8a5a62;
  --win-bg: rgba(255, 248, 244, 0.96);
  --win-body-bg: #fff7f3;
  --win-border: rgba(180, 70, 50, 0.14);
  --win-border-focus: #ff6a3d;
  --titlebar-bg: #ffefe8;
  --flyout-bg: rgba(255, 250, 247, 0.96);
  --flyout-border: rgba(180, 70, 50, 0.12);
  --tile-bg: rgba(255, 106, 61, 0.08);
  --tile-hover: rgba(255, 106, 61, 0.16);
  --input-bg: #ffffff;
  --input-border: rgba(180, 70, 50, 0.2);
  --taskbar-bg: rgba(255, 236, 228, 0.92);
  --taskbar-border: rgba(255, 106, 61, 0.22);
  --tb-hover: rgba(255, 106, 61, 0.12);
  --tb-active: rgba(255, 106, 61, 0.08);
  --scrollbar-thumb: rgba(255, 106, 61, 0.42);
  --scrollbar-thumb-hover: rgba(255, 106, 61, 0.62);
  --win-shadow-focus: 0 18px 50px rgba(120, 40, 30, 0.2), 0 0 0 1px rgba(255, 106, 61, 0.35);
}
html #os.theme-windows.wp-sunset.dark,
html body.theme-windows.wp-sunset.dark,
#os.theme-windows.wp-sunset.dark,
body.theme-windows.wp-sunset.dark {
  --ink: #fde8e2;
  --ink-soft: #c49a92;
  --win-bg: #241416;
  --win-body-bg: #1b0f12;
  --win-border: rgba(255, 106, 61, 0.18);
  --titlebar-bg: #2a181b;
  --flyout-bg: #2a181b;
  --input-bg: #160c0e;
  --taskbar-bg: rgba(20, 10, 12, 0.94);
}

/* ---- Midnight (twilight indigo, dark-first chrome) ------------------- */
html #os.theme-windows.wp-midnight,
html body.theme-windows.wp-midnight,
#os.theme-windows.wp-midnight,
body.theme-windows.wp-midnight {
  --accent: #7c5cff;
  --accent-soft: rgba(124, 92, 255, 0.18);
  --ink: #e8e6f4;
  --ink-soft: #9b97b8;
  --win-bg: #161428;
  --win-body-bg: #121022;
  --win-border: rgba(124, 92, 255, 0.2);
  --win-border-focus: #7c5cff;
  --titlebar-bg: #1a1730;
  --flyout-bg: #1a1730;
  --flyout-border: rgba(124, 92, 255, 0.22);
  --tile-bg: rgba(124, 92, 255, 0.1);
  --tile-hover: rgba(124, 92, 255, 0.2);
  --input-bg: #100e1c;
  --input-border: rgba(124, 92, 255, 0.28);
  --taskbar-bg: rgba(12, 10, 24, 0.94);
  --taskbar-border: rgba(124, 92, 255, 0.2);
  --tb-hover: rgba(124, 92, 255, 0.14);
  --tb-active: rgba(124, 92, 255, 0.1);
  --scrollbar-thumb: rgba(124, 92, 255, 0.45);
  --scrollbar-thumb-hover: rgba(124, 92, 255, 0.65);
  --win-shadow-focus: 0 18px 50px rgba(8, 6, 24, 0.55), 0 0 0 1px rgba(124, 92, 255, 0.4);
  color-scheme: dark;
}

/* ---- Windows chrome flourishes --------------------------------------- */
#os.theme-windows .window.focused { border-color: var(--win-border-focus); }
#os.theme-windows .win-btn:hover { background: var(--tb-hover); }
#os.theme-windows .win-btn.close:hover { background: #e81123; color: #fff; }
#os.theme-windows .qs-tile.on,
#os.theme-windows .cal-cell.today { background: var(--accent); color: var(--accent-ink); }
#os.theme-windows .start-searchbar:focus-within { border-color: var(--accent); }
#os.theme-windows .start-tile:hover,
#os.theme-windows .start-all-row:hover,
#os.theme-windows .start-rec:hover { background: var(--tile-hover); }
#os.theme-windows .desktop-icon.selected {
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 34%, transparent), color-mix(in srgb, var(--accent) 22%, transparent));
  border-color: color-mix(in srgb, var(--accent) 55%, #fff);
}
#os.theme-windows .toast {
  background: var(--flyout-bg);
  border-color: var(--flyout-border);
  color: var(--ink);
}
#os.theme-windows .theme-card.active {
  border-color: var(--accent);
  background: var(--accent-soft);
}

body.theme-windows .ctx-menu,
body.theme-windows .tb-preview-popover,
body.theme-windows .snap-flyout {
  --menu-bg: var(--flyout-bg);
  --menu-border: var(--flyout-border);
  --menu-hover: var(--tile-hover);
  color: var(--ink);
}
body.theme-windows .platform-dialog {
  background: var(--flyout-bg);
  color: var(--ink);
  border-color: var(--flyout-border);
}
body.theme-windows .bs-search-box {
  background: var(--flyout-bg);
  color: var(--ink);
  border-color: var(--flyout-border);
}
body.theme-windows .bs-search-row.active { background: var(--tile-hover); }

#os.theme-windows :focus-visible,
body.theme-windows :focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Nested GraphPad-style studios + ELN / plasmid / clipboard / office */
#os.theme-windows .graph-studio-app,
#os.theme-windows .pathology-studio-root,
#os.theme-windows .pathology-studio-app,
#os.theme-windows .las-root,
#os.theme-windows .design-studio-root,
#os.theme-windows .lims-studio-app,
#os.theme-windows .spatial-studio-root,
#os.theme-windows .seahorse-studio-root,
#os.theme-windows .ms-studio-app,
#os.theme-windows .tox-studio-app,
#os.theme-windows .qms-lite-root,
#os.theme-windows .ss-studio-root,
#os.theme-windows .pkpd-studio-root,
#os.theme-windows .pcr-studio-app,
#os.theme-windows .method-validation-root,
#os.theme-windows .omics-studio-app,
#os.theme-windows .molecular-design-root {
  --pr-blue: var(--os-accent, var(--accent));
  --pr-blue-dk: color-mix(in srgb, var(--os-accent, var(--accent)) 72%, #12203a);
  --pr-teal: var(--os-accent, var(--accent));
  --pr-bg: var(--win-body-bg);
  --pr-surface: var(--win-bg);
  --pr-nav-bg: var(--titlebar-bg);
  --pr-line: var(--win-border);
  --pr-ink: var(--ink);
  --pr-ink-soft: var(--ink-soft);
  --pr-hover: var(--tb-hover);
  --pr-active: var(--tile-hover);
}
#os.theme-windows .studio {
  --st-accent: var(--os-accent, var(--accent));
  --st-bg: var(--os-win-body, var(--win-body-bg));
  --st-panel: var(--os-win-bg, var(--win-bg));
  --st-line: var(--os-border, var(--win-border));
  --st-ink: var(--os-ink, var(--ink));
  --st-ink-soft: var(--os-ink-soft, var(--ink-soft));
}
#os.theme-windows .eln-studio-root {
  --eln-canvas: var(--win-body-bg);
  --eln-surface: var(--win-bg);
  --eln-surface-subtle: var(--titlebar-bg);
  --eln-line: var(--win-border);
  --eln-text: var(--ink);
  --eln-muted: var(--ink-soft);
  --eln-blue: var(--os-accent, var(--accent));
  --eln-blue-soft: var(--os-accent-soft, var(--accent-soft));
  --st-accent: var(--os-accent, var(--accent));
}
#os.theme-windows .plasmid-studio-root,
#os.theme-windows .ps-app {
  --ps-ink: var(--ink);
  --ps-muted: var(--ink-soft);
  --ps-line: var(--win-border);
  --ps-panel: var(--win-bg);
  --ps-soft: var(--win-body-bg);
  --ps-blue: var(--os-accent, var(--accent));
  --ps-teal: var(--os-accent, var(--accent));
}
#os.theme-windows .clib {
  --cl-accent: var(--os-accent, var(--accent));
  --cl-bg: var(--win-body-bg);
  --cl-panel: var(--win-bg);
  --cl-ink: var(--ink);
  --cl-soft: var(--ink-soft);
  --cl-line: var(--win-border);
}
#os.theme-windows .tox-ribbon-app {
  --tox-blue: var(--os-accent, var(--accent));
  --tox-blue-deep: color-mix(in srgb, var(--os-accent, var(--accent)) 78%, #0a1628);
}
#os.theme-windows .tox-ribbon-app .ss-titlebar {
  background: linear-gradient(105deg, var(--os-accent, var(--accent)), color-mix(in srgb, var(--os-accent, var(--accent)) 70%, #fff));
}
#os.theme-windows .word-app .office-titlebar { background: var(--os-accent, var(--accent)); }
#os.theme-windows .excel-app .office-titlebar {
  background: color-mix(in srgb, var(--os-accent, var(--accent)) 70%, #107c41);
}
#os.theme-windows .office-ribbon,
#os.theme-windows .excel-ribbon {
  background: var(--os-titlebar, var(--titlebar-bg));
  border-color: var(--os-border, var(--win-border));
}

#os.theme-windows .st-nav-item.active {
  background: var(--os-accent-soft, var(--accent-soft));
  color: var(--os-accent, var(--accent));
}
#os.theme-windows .pathology-studio-root,
#os.theme-windows .pathology-studio-app { --path-purple: var(--os-accent, var(--accent)); }

/* File Explorer — Fluent hardcoded blues/grays must follow the colorway. */
#os.theme-windows .fe-explorer-root {
  --fe-accent: var(--os-accent, var(--accent));
  --fe-accent-hover: color-mix(in srgb, var(--os-accent, var(--accent)) 78%, #000);
  --fe-accent-soft: var(--os-accent-soft, var(--accent-soft));
  --fe-accent-strong: color-mix(in srgb, var(--os-accent, var(--accent)) 22%, transparent);
  --fe-surface: var(--os-win-body, var(--win-body-bg));
  --fe-elevated: var(--os-win-bg, var(--win-bg));
  --fe-sidebar: var(--os-titlebar, var(--titlebar-bg));
  --fe-line: var(--os-border, var(--win-border));
  --fe-line-strong: var(--input-border);
  --fe-ink: var(--os-ink, var(--ink));
  --fe-ink-soft: var(--os-ink-soft, var(--ink-soft));
}

/* Midnight is dark-first even without .dark — Start mica + explorer chrome. */
#os.theme-windows.wp-midnight .start-menu,
#os.theme-windows.wp-midnight.dark .start-menu {
  --start-mica: linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.09) 0%,
    rgba(124, 92, 255, 0.08) 48%,
    rgba(255, 255, 255, 0.03) 100%
  );
  --start-search-bg: rgba(255, 255, 255, 0.08);
  --start-search-border: rgba(124, 92, 255, 0.28);
  --start-footer-bg: rgba(255, 255, 255, 0.05);
  --start-chip-bg: rgba(124, 92, 255, 0.14);
  --start-chip-border: rgba(124, 92, 255, 0.22);
  --start-hover: rgba(124, 92, 255, 0.16);
  --start-press: rgba(124, 92, 255, 0.22);
  --start-plate: rgba(255, 255, 255, 0.06);
  --start-card: rgba(255, 255, 255, 0.04);
  color-scheme: dark;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 0 1px rgba(0, 0, 0, 0.4),
    0 10px 28px rgba(0, 0, 0, 0.32),
    0 36px 80px rgba(0, 0, 0, 0.5);
}
#os.theme-windows.wp-midnight .fe-explorer-root .fe-command-bar,
#os.theme-windows.wp-midnight.dark .fe-explorer-root .fe-command-bar {
  background: var(--os-titlebar, var(--titlebar-bg));
}
#os.theme-windows.wp-midnight .qs-tile.on { color: #fff; }