/* clinical.css — CLINICAL skin = LIGHT default (Sum 2026-07-10). the NAKED look: "what tauri + react make by
   default, before anyone styled it." no png top bars, no bevels, no textures, nothing fun. png ICONS stay.
   clinical = the LIGHT one · corporate = the DARK one. the shared strip lives here under [data-tier="clean"]
   (both clean skins carry that tier), so it dresses BOTH; each file only owns its color vars + relights. */

[data-skin="clinical"] {
  --bg:          #eceff2;   /* the light desk */
  --surface:     #ffffff;   /* a white card on it */
  --surface-1: #ffffff;   /* = --surface — settings sheets sit FULLY OPAQUE (the token was undefined and the sheet went glass, Sum 2026-07-23) */
  --surface-2:   #f2f4f7;   /* raised inside a card */
  --line:        #d3d8de;   /* the plain hairline seam (the ONLY border a default scaffold has) */

  --text:        #16191d;   /* near-black ink — solid, readable */
  --text-dim:    #47505a;   /* quieter, still solid (no faded text) */

  --accent:      #ab1420;   /* one flat accent — the nurse's cross */
  --accent-deep: #9e1420;

  --topbar-bg:   #e4e7ea;
  --btn:         #ffffff;
  --btn-sh:      #cbd1d8;

  --bevel-light: transparent;   /* (Sum 2026-07-10) NO bevel — naked default */
  --bevel-dark:  transparent;

  --head-toto:   #f2f4f7; --head-toto-ink:   #16191d;
  --head-coder:  #f2f4f7; --head-coder-ink:  #16191d;
  --head-writer: #f2f4f7; --head-writer-ink: #16191d;
  --head-tutor:  #f2f4f7; --head-tutor-ink:  #16191d;

  --nurse-paper: #ffffff;
  --cj-off:      #d2d7dd;
}

/* relight the cards that run dark by default (they read their own --*-vars) → flat light */
[data-skin="clinical"] .p-monaco { --mc-bg: #f6f7f9; --mc-border: #d3d8de; --mc-amber: #1f4f8b; --mc-screen: #e9edf1; --mc-green-lit: #16a34a; }
[data-skin="clinical"] .p-webview { --wv-bg: #ffffff; }

/* ═══════════════════════════════════════════════════════════════════════════════════════════════════════
   [data-tier="clean"] — THE NAKED STRIP (clinical + corporate). Sum 2026-07-10: strip 0z down to a default
   Tauri/React scaffold. same OS, same nav, same PNG icons — but no top-bar art, no bevels, no glass, no
   ghost-font, no textures. it should feel like nobody styled it. png ICONS are never touched.
   ═══════════════════════════════════════════════════════════════════════════════════════════════════════ */

/* 1 · every head / chrome surface → flat solid, one plain hairline, no texture/shadow/bevel */
[data-tier="clean"] .card-head,
[data-tier="clean"] .ab-head,
[data-tier="clean"] .convo-head,
[data-tier="clean"] .card-subbar,
[data-tier="clean"] .p-monaco .card-head {
  background-image: none !important;
  background: var(--surface-2) !important;
  box-shadow: none !important;
  border-bottom: 1px solid var(--line) !important;
  text-shadow: none !important;
}
[data-tier="clean"] .ab-head *,
[data-tier="clean"] .card-head *,
[data-tier="clean"] .convo-head * { text-shadow: none !important; }
[data-tier="clean"] .ab-name,
[data-tier="clean"] .card-title { color: var(--text) !important; }

/* 2 · no bevels, no glass, no decorative shadow — a card is a plain box with a hairline */
[data-tier="clean"] .card,
[data-tier="clean"] .bevel,
[data-tier="clean"] .agent-bar {
  box-shadow: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
[data-tier="clean"] .card { border: 1px solid var(--line) !important; }

/* 3 · the PNG ICONS stay crisp — never tint/filter them (Sum: "use png for icons in clin and corp") */
[data-tier="clean"] .ab-icon,
[data-tier="clean"] .card-icon-img,
[data-tier="clean"] .card-icon { filter: none !important; }

/* 4 · the chat log → flat surface, solid ink (kills the coder's green-CRT screen etc.) */
[data-tier="clean"] .convo { background-image: none !important; background: var(--surface) !important; color: var(--text) !important; }

/* 5 · MONACO — strip every track texture (race-track head is #1 above · pit lane · tab bar · tabs · slider) */
[data-tier="clean"] .mc-pit,
[data-tier="clean"] .mc-tabdock,
[data-tier="clean"] .mc-namebar,
[data-tier="clean"] .card-bottom {
  background-image: none !important; background: var(--surface-2) !important; box-shadow: none !important;
}
[data-tier="clean"] .mc-tab,
[data-tier="clean"] .mc-chip {
  background-image: none !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; box-shadow: none !important;
  color: var(--text) !important; text-shadow: none !important;
}
[data-tier="clean"] .mc-tab .mc-tab-name,
[data-tier="clean"] .mc-tab-ver,
[data-tier="clean"] .mc-pit-btn { color: var(--text) !important; }
[data-tier="clean"] .mc-pit-btn { background: var(--surface) !important; border: 1px solid var(--line) !important; box-shadow: none !important; }

/* ── MONACO'S TOOL CHROME ON LIGHT PAPER (Sum 2026-07-14: "squiggy · teach · fix contrast pass") ──
   the card was born on dark skins — ~163 rules carry white text / white-tint chips that ghost on
   clinical. this remap RE-INKS THE CHROME at the skin layer (tokens are law): dark ink, white chips,
   real borders. the EDITOR is untouched (Monaco themes itself via mcTheme). corporate = dark, native. */

/* the tool surfaces read as ink-on-paper */
[data-skin="clinical"] .mc-sqbox, [data-skin="clinical"] .mc-fix, [data-skin="clinical"] .mc-toolbox,
[data-skin="clinical"] .mc-console, [data-skin="clinical"] .mc-stream, [data-skin="clinical"] .mc-find,
[data-skin="clinical"] .mc-namebar, [data-skin="clinical"] .mc-teach-win { color: var(--text); }

/* every chip · button · input · select in the tool chrome: white chip, inked border, dark text */
[data-skin="clinical"] .mc-body-wrap button,
[data-skin="clinical"] .mc-body-wrap select,
[data-skin="clinical"] .mc-body-wrap input,
[data-skin="clinical"] .mc-body-wrap textarea {
  color: var(--text);
  background: #ffffff;
  border: 1px solid #b8c0c8;
}
[data-skin="clinical"] .mc-body-wrap input::placeholder,
[data-skin="clinical"] .mc-body-wrap textarea::placeholder { color: var(--text-dim); }

/* ON/lit states — a picked chip is visibly DARKER + accent-edged (never color-alone) */
[data-skin="clinical"] .mc-body-wrap button.on, [data-skin="clinical"] .mc-body-wrap .mc-ctab.on,
[data-skin="clinical"] .mc-body-wrap .mc-tw-tab.on, [data-skin="clinical"] .mc-body-wrap .mc-sq-gran.on,
[data-skin="clinical"] .mc-body-wrap .mc-sq-lv.on {
  background: #e2e6ea;
  border-color: var(--accent, #ab1420);
  box-shadow: inset 0 -2px 0 var(--accent, #ab1420);
}

/* the INTENTIONAL colored controls keep their color (physical-object law): run/apply/add = green family */
[data-skin="clinical"] .mc-fix-apply, [data-skin="clinical"] .mc-sq-add,
[data-skin="clinical"] .mc-fix-check, [data-skin="clinical"] .mc-stream-add {
  background: #1d7a3e; color: #ffffff; border-color: #14582c;
}

/* logs · consoles · chat scrolls: white paper, dark ink */
[data-skin="clinical"] .mc-console-body, [data-skin="clinical"] .mc-cli-out,
[data-skin="clinical"] .mc-fix-log, [data-skin="clinical"] .mc-tool-log,
[data-skin="clinical"] .mc-sq-chat-log, [data-skin="clinical"] .mc-stream-body,
[data-skin="clinical"] .mc-preview-out, [data-skin="clinical"] .mc-cproblems {
  background: #ffffff; color: var(--text);
}

/* the GOFAI suggestion chips + option boxes (the pale-pill row) — inked */
[data-skin="clinical"] .mc-sq-opt, [data-skin="clinical"] .mc-sq-sect,
[data-skin="clinical"] .mc-sq-lints, [data-skin="clinical"] .mc-sq-main {
  color: var(--text);
}
[data-skin="clinical"] .mc-sq-opt { background: #ffffff; border: 1px solid #b8c0c8; }

/* convo bubbles: readable turns — bot on paper-grey, human on white, both dark ink */
[data-skin="clinical"] .mc-tool-msg, [data-skin="clinical"] .mc-fix-log > div,
[data-skin="clinical"] .mc-sq-chat-log > div { color: var(--text); }
[data-skin="clinical"] .mc-tool-msg.assistant { background: #eef1f4; }
[data-skin="clinical"] .mc-tool-msg.user { background: #ffffff; border: 1px solid #d4dae0; }

/* code-fold bars + fold bodies stay code-dark (a code block is a window into the editor, not chrome) */
[data-skin="clinical"] .mc-cfold-bar { background: #eef1f4; color: var(--text); border-color: #b8c0c8; }

/* wing grips + splits: visible on light — deeper teal, solid border */
[data-skin="clinical"] .mc-wing-grip, [data-skin="clinical"] .mc-split {
  background: rgba(13, 115, 100, .18); border-color: #0d7364; color: #0a5c50;
}