/* Dawg Walk — the approved app look (Sahil, 2026-09-25: "this is perfect"). Source: design/color-schemes-uga.html#final=light|dark (README "43 Final — Dawg Walk").
   Scoped to :root[data-skin="dawgwalk"]; data-skin="classic" (Settings → App look, or this browser's override) = the previous look, untouched.
   Loaded LAST. Colours only (Q33, Sahil: "keep what we have going … just change color scheme"): layout, spacing and structure stay as Classic; the one exception is the 3 px red rule under the top bar. Light = iron-black sidebar + black top bar around a warm white page; dark = white sidebar + white top bar around charcoal.
   Bulldog Red #BA0C2F is identity only: the solid selected nav pill, the PCC mark and the 3 px rule under the top bar. Buttons stay neutral
   (--indigo = ink in light, steel in dark). Scarlet (--red) is the blocked / danger colour, the only red in the work area. */

/* ── light ─────────────────────────────────────────────────────────────── */
:root[data-skin="dawgwalk"]{
  color-scheme:light;
  --ink:#121212; --ink2:#5D5A56; --ink3:#6E6A65; --rule:#E7E3DD; --rule2:#EFECE7; --paper:#FFFFFF; --paper2:#FAF8F5; --bg:#F7F5F2; --bg2:#EFECE7; --hover:#F4F1EC; --field:#FFFFFF;
  --topbar:#090909; --topbar-ink:#F2F0ED;
  /* accent family = neutral chrome (primary buttons, links, focus, selection); red is not an accent */
  --indigo:#121212; --indigo-d:#2E2E2E; --indigo-l:#ECE9E4; --indigo-xl:#F4F2EE; --indigo-bd:#DDD8D1; --on-accent:#FFFFFF;
  /* semantic anchors: positive · attention · blocked (+ tints, borders, text-on-tint) */
  --green:#286E3C; --green-l:#E4EEE6; --green-bd:#BFD6C4; --green-t:#1F5A30; --green-ink:#FFFFFF;
  --amber:#D9AD58; --amber-l:#F8EEDA; --amber-bd:#EBD3A2; --amber-t:#7A5518; --amber-ink:#1C1A19;
  --red:#E42313; --red-l:#FCE5E2; --red-bd:#F4BDB6; --red-t:#B31B0D; --red-ink:#FFFFFF;
  --purple:#857FAD; --purple-l:#ECEAF4; --purple-t:#5A5486; --blue:#548A95; --blue-l:#E3EEF0; --blue-t:#35626F; --teal:#3E8888;
  --grey:#E2E1DF; --grey-l:#F0EEEB; --grey-ink:#2A2826; --dark:#1C1A19; --pill-ink:#FFFFFF;
  --ot:#BB7D3D; --ot-l:rgba(187,125,61,.14);
  /* work areas: Dawg Walk families, mid step */
  --smt:#6E79B5; --tht:#A8653F; --insp:#6E8353; --test:#8E6897; --back:#3E8888; --asm:#4D81AD; --mat:#737D88; --ship:#9A687B; --out:#9A9085; --other:#BDBAB5;
  --rule-hi:#CFC9C1; --btn-hover:#F7F5F2; --scrim:rgba(9,9,9,.45); --toast-ink:#FFFFFF; --link:#121212; --focus:#121212; --ring:rgba(18,18,18,.14);
  --sh:0 1px 2px rgba(18,18,18,.05),0 4px 14px rgba(18,18,18,.04);
  /* frame */
  --brand:#BA0C2F; --brand-ink:#FFFFFF;
  --side:232px; --frame-scheme:dark; --side-bg:#090909; --side-ink:#F2F0ED; --side-muted:#9C9893; --side-hover:rgba(255,255,255,.07); --side-rule:#232323;
  --side-chip:#2A2A2A; --side-chip-ink:#F2F0ED; --side-hot:#E42313; --side-ok:#3CC57A;
  --tb-sub:#A8A49F; --tb-btn-bg:transparent; --tb-btn-bd:#6A6A6A; --tb-btn-ink:#F2F0ED; --tb-btn-hover:rgba(255,255,255,.08); --tb-btn-hover-bd:#8E8E8E;
  --tb-field:#1E1E1E; --tb-field-bd:#3A3A3A; --tb-field-ink:#F2F0ED; --tb-field-ph:#A8A49F; --tb-field-focus:#6A6A6A;
  --tb-primary:#F2F0ED; --tb-primary-ink:#121212; --tb-primary-hover:#FFFFFF; --tb-bell-n:#2E2E2E; --tb-bell-n-ink:#F2F0ED;
}

/* ── dark ──────────────────────────────────────────────────────────────── */
:root[data-skin="dawgwalk"][data-theme="dark"]{
  color-scheme:dark;
  --ink:#F2F0ED; --ink2:#A8A49F; --ink3:#908B86; --rule:#2A2A2A; --rule2:#212121; --paper:#161616; --paper2:#1D1D1D; --bg:#0C0C0C; --bg2:#121212; --hover:#202020; --field:#111111;
  --topbar:#FFFFFF; --topbar-ink:#121212;
  --indigo:#6B7786; --indigo-d:#5A6574; --indigo-l:#262A30; --indigo-xl:#1B1E22; --indigo-bd:#33373D; --on-accent:#FFFFFF;
  --green:#6DA177; --green-l:#17271B; --green-bd:#2E4A34; --green-t:#8FC298; --green-ink:#121212;
  --amber:#E6C278; --amber-l:#2E2616; --amber-bd:#56462A; --amber-t:#E6C278; --amber-ink:#121212;
  --red:#FF4A3D; --red-l:#3A1512; --red-bd:#6B2620; --red-t:#FF6F64; --red-ink:#121212;
  --purple:#A39FC7; --purple-l:#25233A; --purple-t:#BDB9DE; --blue:#7AA7B1; --blue-l:#172629; --blue-t:#A6C8CD; --teal:#72AAAA;
  --grey:#C5C4C2; --grey-l:#242424; --grey-ink:#121212; --dark:#444240; --pill-ink:#121212;
  --ot:#D19B64; --ot-l:rgba(209,155,100,.16);
  --smt:#919BCD; --tht:#C89071; --insp:#94A67F; --test:#B191B8; --back:#72AAAA; --asm:#7AA3C8; --mat:#979FA8; --ship:#BB91A0; --out:#A69D93; --other:#6E6A66;
  --rule-hi:#3D3D3D; --btn-hover:#1F1F1F; --scrim:rgba(0,0,0,.6); --toast-ink:#121212; --link:#D6D3CE; --focus:#F2F0ED; --ring:rgba(242,240,237,.18);
  --sh:none;
  --frame-scheme:light; --side-bg:#FFFFFF; --side-ink:#121212; --side-muted:#66625D; --side-hover:#F2F0ED; --side-rule:#E7E3DD;
  --side-chip:#ECE9E5; --side-chip-ink:#121212; --side-hot:#E42313; --side-ok:#1F9D55;
  --tb-sub:#5D5A56; --tb-btn-bg:transparent; --tb-btn-bd:#8A8680; --tb-btn-ink:#121212; --tb-btn-hover:#F2F0ED; --tb-btn-hover-bd:#5D5A56;
  --tb-field:#F4F2EF; --tb-field-bd:#D6D2CC; --tb-field-ink:#121212; --tb-field-ph:#6B6762; --tb-field-focus:#8A8680;
  --tb-primary:#121212; --tb-primary-ink:#FFFFFF; --tb-primary-hover:#2E2E2E; --tb-bell-n:#ECE9E5; --tb-bell-n-ink:#121212;
}

/* ── sidebar ───────────────────────────────────────────────────────────── */
:root[data-skin="dawgwalk"] aside.side,:root[data-skin="dawgwalk"] header.top{color-scheme:var(--frame-scheme)}
:root[data-skin="dawgwalk"] aside.side{background:var(--side-bg);border-right:1px solid var(--side-rule);color:var(--side-ink)}
:root[data-skin="dawgwalk"] .brand .mark{background:var(--brand);color:var(--brand-ink)}
:root[data-skin="dawgwalk"] .brand .nm{color:var(--side-ink)}
:root[data-skin="dawgwalk"] .brand .nm small,:root[data-skin="dawgwalk"] nav.nav .grp{color:var(--side-muted)}
:root[data-skin="dawgwalk"] nav.nav [data-tab]{color:color-mix(in srgb,var(--side-ink) 80%,transparent)}
:root[data-skin="dawgwalk"] nav.nav [data-tab]:hover{background:var(--side-hover);color:var(--side-ink)}
:root[data-skin="dawgwalk"] nav.nav [data-tab].active,:root[data-skin="dawgwalk"] nav.nav [data-tab].active:hover{background:var(--brand);color:var(--brand-ink)}
:root[data-skin="dawgwalk"] nav.nav [data-tab]:focus-visible{outline:2px solid var(--side-ink);outline-offset:-2px}
:root[data-skin="dawgwalk"] nav.nav [data-tab].active:focus-visible{outline-color:var(--brand-ink);outline-offset:-4px}
:root[data-skin="dawgwalk"] nav.nav [data-tab] .n{background:var(--side-chip);color:var(--side-chip-ink)}
:root[data-skin="dawgwalk"] nav.nav [data-tab].active .n{background:rgba(255,255,255,.22);color:var(--brand-ink)}
:root[data-skin="dawgwalk"] nav.nav [data-tab] .n.hot{background:var(--side-hot);color:#fff}
:root[data-skin="dawgwalk"] .side-foot{border-top-color:var(--side-rule);color:var(--side-muted)}
:root[data-skin="dawgwalk"] .side-foot .lock{color:var(--side-ink)} :root[data-skin="dawgwalk"] .side-foot .lock.on{color:var(--side-ok)}

/* ── top bar: black (light) / white (dark), 3 px Bulldog Red rule underneath ── */
:root[data-skin="dawgwalk"] header.top{background:var(--topbar);color:var(--topbar-ink);border-bottom:3px solid var(--brand)}
:root[data-skin="dawgwalk"] header.top h1{color:var(--topbar-ink)}
:root[data-skin="dawgwalk"] header.top .sub{color:var(--tb-sub)}
:root[data-skin="dawgwalk"] header.top .btn,:root[data-skin="dawgwalk"] header.top #bell{background:var(--tb-btn-bg);border:1px solid var(--tb-btn-bd);color:var(--tb-btn-ink);box-shadow:none}
:root[data-skin="dawgwalk"] header.top .btn:hover,:root[data-skin="dawgwalk"] header.top #bell:hover{background:var(--tb-btn-hover);border-color:var(--tb-btn-hover-bd)}
:root[data-skin="dawgwalk"] header.top .btn.primary{background:var(--tb-primary);border-color:var(--tb-primary);color:var(--tb-primary-ink)}
:root[data-skin="dawgwalk"] header.top .btn.primary:hover{background:var(--tb-primary-hover);border-color:var(--tb-primary-hover)}
:root[data-skin="dawgwalk"] header.top #btnBack:disabled{background:var(--tb-btn-bg);border-color:var(--tb-btn-bd);opacity:.35}
:root[data-skin="dawgwalk"] header.top input{background:var(--tb-field);border-color:var(--tb-field-bd);color:var(--tb-field-ink)}
:root[data-skin="dawgwalk"] header.top input::placeholder{color:var(--tb-field-ph);opacity:1}
:root[data-skin="dawgwalk"] header.top input:focus{background:var(--tb-field);border-color:var(--tb-field-focus);box-shadow:0 0 0 3px var(--tb-btn-hover)}
:root[data-skin="dawgwalk"] header.top #bell .n{background:var(--tb-bell-n);color:var(--tb-bell-n-ink)}
:root[data-skin="dawgwalk"] header.top #bell.hot .n{background:var(--side-hot);color:#fff}
:root[data-skin="dawgwalk"] header.top .btn:focus-visible,:root[data-skin="dawgwalk"] header.top #bell:focus-visible{outline:2px solid var(--topbar-ink);outline-offset:2px}
/* "Who am I?" before anyone is picked: neutral like its neighbours, the amber edge is the hint */
:root[data-skin="dawgwalk"] header.top #whoBtn,:root[data-skin="dawgwalk"] header.top #whoBtn.acc-pick{background:var(--tb-btn-bg);color:var(--tb-btn-ink);border-color:var(--tb-btn-bd)}
:root[data-skin="dawgwalk"] header.top #whoBtn.acc-pick,:root[data-skin="dawgwalk"] header.top .acc-chip.warn{border-color:var(--amber)}
:root[data-skin="dawgwalk"] header.top #whoBtn:hover{background:var(--tb-btn-hover)}

/* ── work area: neutral controls, focus rings ─────────────────────────── */
/* links follow --link (app.css a / a.joblink:hover); a.btn.primary keeps its button text */
:root[data-skin="dawgwalk"] a.btn.primary,:root[data-skin="dawgwalk"] a.btn.primary:hover{color:var(--on-accent)}
:root[data-skin="dawgwalk"] .btn.ghost,:root[data-skin="dawgwalk"] .seg button.on,:root[data-skin="dawgwalk"] .tabs2 button.on,:root[data-skin="dawgwalk"] table.mt th.sorted,
:root[data-skin="dawgwalk"] .pill.soft.indigo{color:var(--ink)}
:root[data-skin="dawgwalk"] .tabs2 button.on{border-bottom-color:var(--ink)}
:root[data-skin="dawgwalk"] .btn.ghost:hover{background:var(--indigo-l)}
:root[data-skin="dawgwalk"] .btn:focus-visible,:root[data-skin="dawgwalk"] .seg button:focus-visible,:root[data-skin="dawgwalk"] .tabs2 button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:root[data-skin="dawgwalk"] input:focus,:root[data-skin="dawgwalk"] select:focus,:root[data-skin="dawgwalk"] textarea:focus{border-color:var(--focus);box-shadow:0 0 0 3px var(--ring)}
:root[data-skin="dawgwalk"] a.joblink:focus-visible,:root[data-skin="dawgwalk"] .mst.mst-ed:focus-visible{outline-color:var(--focus)}
:root[data-skin="dawgwalk"] input[type=checkbox],:root[data-skin="dawgwalk"] input[type=radio]{accent-color:var(--ink)}
:root[data-skin="dawgwalk"] .gantt .today{background:var(--ink)}
/* dark: hold / steel pills keep white text; lighter anchors carry near-black (--pill-ink) */
:root[data-skin="dawgwalk"][data-theme="dark"] .pill.dark,:root[data-skin="dawgwalk"][data-theme="dark"] .pill.indigo{color:#fff}
/* dark: text on the lighter positive green is near-black (.btn.green already takes --green-ink from app.css; these two module fills hard-code white) */
:root[data-skin="dawgwalk"][data-theme="dark"] .dy-st.done,:root[data-skin="dawgwalk"][data-theme="dark"] .mw-seg button.done.on{color:var(--green-ink)}
/* KPI colour variants win over the neutral ink bar that css/views.css (:root[data-skin=dawgwalk] .vw-kpis .kpi:before) gives every tile; ink stays for the plain tile */
:root[data-skin="dawgwalk"] .kpi.ok:before,:root[data-skin="dawgwalk"] .vw-kpis .kpi.ok:before{background:var(--green)}
:root[data-skin="dawgwalk"] .kpi.warn:before,:root[data-skin="dawgwalk"] .vw-kpis .kpi.warn:before{background:var(--amber)}
:root[data-skin="dawgwalk"] .kpi.bad:before,:root[data-skin="dawgwalk"] .vw-kpis .kpi.bad:before{background:var(--red)}
:root[data-skin="dawgwalk"] .kpi.mute:before,:root[data-skin="dawgwalk"] .vw-kpis .kpi.mute:before{background:var(--grey)}

/* R11 (Sahil 2026-09-30): "the top part must be dark in dark mode so it is easy to read". Dark mode keeps a dark top bar (and everything drawn
   with the top-bar tokens: Home hero, alarm strip, New order and Team setup headers, the More menu); the white sidebar and the red rule stay. */
:root[data-skin="dawgwalk"][data-theme="dark"]{
  --topbar:#1C1C1C; --topbar-ink:#F2F0ED;
  --tb-sub:#A8A49F; --tb-btn-bg:transparent; --tb-btn-bd:#5E5E5E; --tb-btn-ink:#F2F0ED; --tb-btn-hover:rgba(255,255,255,.08); --tb-btn-hover-bd:#8E8E8E;
  --tb-field:#262626; --tb-field-bd:#3E3E3E; --tb-field-ink:#F2F0ED; --tb-field-ph:#A8A49F; --tb-field-focus:#7A7A7A;
  --tb-primary:#F2F0ED; --tb-primary-ink:#121212; --tb-primary-hover:#FFFFFF; --tb-bell-n:#333333; --tb-bell-n-ink:#F2F0ED;
}
:root[data-skin="dawgwalk"][data-theme="dark"] header.top{color-scheme:dark;border-bottom-color:var(--brand)}