/* BioStudio AI — BioStudioAI Carbon theme (theme-bs4).
   Minimal dark graphite engineering surface: flat near-black panels, one
   lime accent, monospaced micro-labels, dense flat tiles, no blur/glow.
   Structure comes from css/bsx-shell.css; this file sets the Carbon tokens
   and the engineering flourishes. Dashboard: js/core/bsx-dashboard.js with
   layout="grid". Always dark. */

body.theme-bs4,
#os.theme-bs4 {
  /* Carbon tokens */
  --bsx-bg: #0f1013;
  --bsx-surface: #16181d;
  --bsx-surface-2: #1c1f25;
  --bsx-border: #262931;
  --bsx-accent: #a3e635;
  --bsx-accent-strong: #bef264;
  --bsx-accent-ink: #131503;
  --bsx-accent-soft: rgba(163, 230, 53, 0.09);
  --bsx-radius: 10px;
  --bsx-radius-lg: 14px;
  --bsx-shadow: none;
  --bsx-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.55);
  --bsx-blur: none;
  --bsx-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  /* system tokens */
  --ink: #e8eaee;
  --ink-soft: #878b95;
  --radius: 10px;
  --taskbar-h: 70px;
  --accent: #a3e635;

  --win-bg: #16181d;
  --win-body-bg: #121418;
  --win-border: var(--bsx-border);
  --win-border-focus: #a3e635;
  --titlebar-bg: #14161b;
  --flyout-bg: #16181d;
  --flyout-border: var(--bsx-border);
  --tile-bg: #1c1f25;
  --tile-hover: rgba(163, 230, 53, 0.12);
  --input-bg: #101216;
  --input-border: #2c303a;

  --taskbar-bg: rgba(18, 20, 24, 0.96);
  --taskbar-border: var(--bsx-border);
  --tb-hover: rgba(163, 230, 53, 0.1);
  --tb-active: rgba(163, 230, 53, 0.08);
  --app-btn-hover: rgba(255, 255, 255, 0.07);

  --accent-ink: #131503;
  --on-primary: #131503;
  --app-bg: var(--win-body-bg);
  --app-bar: var(--titlebar-bg);
  --app-line: var(--bsx-border);
  --app-btn: var(--bsx-surface-2);
  --app-input: var(--input-bg);
  --menu-bg: var(--flyout-bg);
  --menu-border: var(--bsx-border);
  --menu-hover: var(--bsx-accent-soft);
  --primary: var(--bsx-accent);
  --primary-soft: var(--bsx-accent-soft);
  --scrollbar-thumb: rgba(163, 230, 53, 0.35);
  --scrollbar-thumb-hover: rgba(163, 230, 53, 0.55);

  --os-accent: #a3e635;
  --os-accent-soft: rgba(163, 230, 53, 0.09);
  --os-accent-ink: #131503;
  --os-win-bg: #16181d;
  --os-win-body: #121418;
  --os-titlebar: #14161b;
  --os-flyout: #16181d;
  --os-ink: #e8eaee;
  --os-ink-soft: #878b95;
  --os-border: #262931;
  --os-input: #101216;
  --os-hover: rgba(163, 230, 53, 0.1);
  --mono-bg: var(--os-win-body);
  --mono-surface: var(--os-win-bg);
  --mono-surface-2: var(--os-titlebar);
  --mono-surface-3: #1c1f25;
  --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: #bef264;
  --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: #2c303a;
  --mono-tech: var(--os-accent);

  color: var(--ink);
}

/* wallpaper — flat graphite with a faint grid, engineering-bench vibe */
#os.wp-bs4,
#os.wp-bs4.dark {
  background:
    linear-gradient(rgba(163, 230, 53, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(163, 230, 53, 0.025) 1px, transparent 1px),
    linear-gradient(180deg, #101114 0%, #0d0e11 100%);
  background-size: 44px 44px, 44px 44px, 100% 100%;
}

/* ---- Engineering flourishes -------------------------------------------- */
.bs4-home .bsx-greeting h1 { font-weight: 550; letter-spacing: -0.03em; }
.bs4-home .bsx-greeting p,
.bs4-home .bsx-sec-title,
.bs4-home .bsx-nav-link,
.bs4-home .bsw-widget-title,
.bs4-home .bsw-stat-label,
.bs4-home .bsw-add-title,
.bs4-home .bsc-keys kbd {
  font-family: var(--bsx-mono);
}
.bs4-home .bsx-nav-link { font-size: 12px; text-transform: lowercase; }
.bs4-home .bsx-nav-link::before { content: "/"; margin-right: 5px; color: var(--bsx-accent); opacity: 0.7; }
.bs4-home .bsx-nav-link.active { color: var(--bsx-accent); background: var(--bsx-accent-soft); }
.bs4-home .bsx-app { position: relative; overflow: hidden; }
.bs4-home .bsx-app::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 2px;
  background: var(--bsx-accent);
  opacity: 0;
  transition: opacity 0.14s ease;
}
.bs4-home .bsx-app:hover { transform: none; background: var(--bsx-surface-2); }
.bs4-home .bsx-app:hover::after { opacity: 1; }
.bs4-home .bsx-app-sub { font-family: var(--bsx-mono); font-size: 10px; }
.bs4-home .bsx-brand-dot { border-radius: 2px; }
/* flat tiles with a status line that lights up lime on hover */
.bs4-home[data-layout="grid"] .bsx-proj { position: relative; overflow: hidden; }
.bs4-home[data-layout="grid"] .bsx-proj::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 2px;
  background: var(--bsx-accent);
  opacity: 0;
  transition: opacity 0.14s ease;
}
.bs4-home[data-layout="grid"] .bsx-proj:hover { background: var(--bsx-surface-2); }
.bs4-home[data-layout="grid"] .bsx-proj:hover::after { opacity: 1; }
.bs4-home .bsx-proj-mark { border-radius: 2px; }
.bs4-home .bsx-proj-sub { font-family: var(--bsx-mono); font-size: 10.5px; }
.bs4-home .bsw-clock-time { font-family: var(--bsx-mono); font-weight: 500; }
.bs4-home .bsw-stat-value { font-family: var(--bsx-mono); }

/* window chrome — flat, sharp, lime focus line */
#os.theme-bs4 .window-titlebar { border-bottom: 1px solid var(--bsx-border); }
#os.theme-bs4 .window.focused .window-titlebar { box-shadow: inset 0 2px 0 var(--bsx-accent); }
#os.theme-bs4 .window-title-text { font-family: var(--bsx-mono); font-size: 12px; }

/* taskbar dock — flat graphite slab */
#os.theme-bs4 .taskbar.bs-dock { border-radius: 12px; }
#os.theme-bs4 .tray-clock { font-family: var(--bsx-mono); }

/* start menu / tables tuned for the dark flat surface */
#os.theme-bs4 .start-section-title { font-family: var(--bsx-mono); text-transform: lowercase; }
#os.theme-bs4 th { background: #14161b; color: var(--ink-soft); border-color: var(--bsx-border); }
#os.theme-bs4 td { border-color: #202329; }
#os.theme-bs4 tbody tr:hover td { background: rgba(163, 230, 53, 0.05); }

#os.theme-bs4 input, #os.theme-bs4 textarea, #os.theme-bs4 select { color-scheme: dark; }
#os.theme-bs4 .field, #os.theme-bs4 input[type="text"], #os.theme-bs4 input[type="search"],
#os.theme-bs4 textarea, #os.theme-bs4 select {
  background: var(--input-bg);
  border-color: var(--input-border);
  color: var(--ink);
}

body.theme-bs4 .platform-dialog-overlay { background: rgba(5, 6, 8, 0.6); }

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

/* toasts, toolbars, tables */
#os.theme-bs4 .toast {
  background: var(--flyout-bg);
  border: 1px solid var(--bsx-border);
  border-radius: var(--bsx-radius);
  color: var(--ink);
  font-family: var(--bsx-mono);
}
#os.theme-bs4 .app-toolbar,
#os.theme-bs4 .files-toolbar {
  background: var(--titlebar-bg);
  border-bottom-color: var(--bsx-border);
}
#os.theme-bs4 .app-statusbar {
  background: var(--bsx-surface-2);
  border-top-color: var(--bsx-border);
  font-family: var(--bsx-mono);
  font-size: 11px;
}

/* Nested GraphPad-style studios + ELN / plasmid / clipboard / office */
#os.theme-bs4 .graph-studio-app,
#os.theme-bs4 .pathology-studio-root,
#os.theme-bs4 .pathology-studio-app,
#os.theme-bs4 .las-root,
#os.theme-bs4 .design-studio-root,
#os.theme-bs4 .lims-studio-app,
#os.theme-bs4 .spatial-studio-root,
#os.theme-bs4 .seahorse-studio-root,
#os.theme-bs4 .ms-studio-app,
#os.theme-bs4 .tox-studio-app,
#os.theme-bs4 .qms-lite-root,
#os.theme-bs4 .ss-studio-root,
#os.theme-bs4 .pkpd-studio-root,
#os.theme-bs4 .pcr-studio-app,
#os.theme-bs4 .method-validation-root,
#os.theme-bs4 .omics-studio-app,
#os.theme-bs4 .molecular-design-root {
  --pr-blue: var(--bsx-accent);
  --pr-blue-dk: var(--bsx-accent-strong);
  --pr-teal: var(--bsx-accent);
  --pr-bg: var(--win-body-bg);
  --pr-surface: var(--bsx-surface);
  --pr-nav-bg: var(--titlebar-bg);
  --pr-line: var(--bsx-border);
  --pr-ink: var(--ink);
  --pr-ink-soft: var(--ink-soft);
  --pr-hover: var(--bsx-accent-soft);
  --pr-active: var(--bsx-accent-soft);
}
#os.theme-bs4 .eln-studio-root {
  --eln-canvas: var(--win-body-bg);
  --eln-surface: var(--bsx-surface);
  --eln-surface-subtle: var(--titlebar-bg);
  --eln-line: var(--bsx-border);
  --eln-text: var(--ink);
  --eln-muted: var(--ink-soft);
  --eln-blue: var(--bsx-accent);
  --eln-blue-dark: var(--bsx-accent-strong);
  --eln-blue-soft: var(--bsx-accent-soft);
  --st-accent: var(--bsx-accent);
}
#os.theme-bs4 .plasmid-studio-root,
#os.theme-bs4 .ps-app {
  --ps-ink: var(--ink);
  --ps-muted: var(--ink-soft);
  --ps-line: var(--bsx-border);
  --ps-panel: var(--bsx-surface);
  --ps-soft: var(--win-body-bg);
  --ps-blue: var(--bsx-accent);
  --ps-teal: var(--bsx-accent-strong);
}
#os.theme-bs4 .clib {
  --cl-accent: var(--bsx-accent);
  --cl-bg: var(--win-body-bg);
  --cl-panel: var(--bsx-surface);
  --cl-ink: var(--ink);
  --cl-soft: var(--ink-soft);
  --cl-line: var(--bsx-border);
}
#os.theme-bs4 .tox-ribbon-app {
  --tox-blue: var(--bsx-accent);
  --tox-blue-deep: var(--bsx-accent-strong);
}
#os.theme-bs4 .tox-ribbon-app .ss-titlebar {
  background: var(--bsx-accent);
  color: var(--bsx-accent-ink);
}
#os.theme-bs4 .office-app { background: var(--win-body-bg); }
#os.theme-bs4 .word-app .office-titlebar,
#os.theme-bs4 .excel-app .office-titlebar { background: var(--bsx-accent); color: var(--bsx-accent-ink); }
#os.theme-bs4 .office-ribbon,
#os.theme-bs4 .excel-ribbon {
  background: var(--titlebar-bg);
  border-color: var(--bsx-border);
}
#os.theme-bs4 .pathology-studio-root,
#os.theme-bs4 .pathology-studio-app { --path-purple: var(--bsx-accent); }

#os.theme-bs4 .studio-ai-fab {
  background: var(--bsx-accent);
  color: var(--bsx-accent-ink);
  border-radius: 8px;
  box-shadow: none;
}
#os.theme-bs4 .studio-ai-panel {
  background: var(--flyout-bg);
  border-color: var(--bsx-border);
  color: var(--ink);
  border-radius: var(--bsx-radius-lg);
}
#os.theme-bs4 .studio-ai-head { font-family: var(--bsx-mono); }
#os.theme-bs4 .studio-ai-msg.user { background: var(--bsx-accent-soft); }
#os.theme-bs4 .studio-ai-msg.ai { background: var(--bsx-surface-2); }
#os.theme-bs4 .studio-ai-send {
  background: var(--bsx-accent);
  color: var(--bsx-accent-ink);
  border-radius: 6px;
}
body.theme-bs4 .os-ai-fab { background: var(--bsx-accent); color: var(--bsx-accent-ink); border-radius: 8px; }
body.theme-bs4 .os-ai-input:focus { border-color: var(--bsx-accent); }
body.theme-bs4 .os-ai-send,
body.theme-bs4 .os-ai-open { background: var(--bsx-accent); color: var(--bsx-accent-ink); }
body.theme-bs4 .os-ai-field.needed .os-ai-field-label { color: var(--bsx-accent); }

body.theme-bs4 .ctx-menu,
body.theme-bs4 .tb-preview-popover,
body.theme-bs4 .snap-flyout {
  --menu-bg: var(--os-flyout, var(--flyout-bg));
  --menu-border: var(--os-border, var(--bsx-border));
  --menu-hover: var(--os-accent-soft, var(--bsx-accent-soft));
  color: var(--os-ink, var(--ink));
  border-radius: var(--bsx-radius);
  font-family: var(--bsx-mono);
  font-size: 12.5px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

#os.theme-bs4 .fe-explorer-root {
  --fe-accent: var(--os-accent, var(--bsx-accent));
  --fe-accent-hover: var(--bsx-accent-strong);
  --fe-accent-soft: var(--os-accent-soft, var(--bsx-accent-soft));
  --fe-accent-strong: rgba(163, 230, 53, 0.22);
  --fe-surface: var(--os-win-body);
  --fe-elevated: var(--os-win-bg);
  --fe-sidebar: var(--os-titlebar);
  --fe-line: var(--os-border);
  --fe-line-strong: var(--input-border);
  --fe-ink: var(--os-ink);
  --fe-ink-soft: var(--os-ink-soft);
}
#os.theme-bs4 .fe-explorer-root .fe-command-bar {
  background: var(--os-titlebar);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#os.theme-bs4 .window,
#os.theme-bs4 .flyout,
#os.theme-bs4 .start-menu,
#os.theme-bs4 .taskbar {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
