/* ============================================================
   Chesapeake Pallets — INK + CHAMPAGNE rebrand (definitive)
   cockpit.css loads AFTER styles.css and has no other :root,
   so this :root wins. RULES: --accent/--accent-2 are DARK ink
   (white button text stays AA). Champagne #FAD9A9 = tints/glows/
   logo/numerals ONLY, never a fill behind white text. Champagne-
   as-TEXT uses the deepened --gold-ink. Status pills re-deepened
   so 11px white pill text clears WCAG AA (4.5:1).
   ============================================================ */
:root{
  /* PRIMARY = ink. Fills .btn.primary/.chip.on/.brand .mark/
     .side-foot .av/.cap-bar i/dropzone/login+auth marks.
     white on #141414 = 18.4:1 ; on #2b2b2b = 14.2:1. */
  --accent:#141414;        /* solid fills under white text */
  --accent-2:#2b2b2b;      /* hover + accent TEXT on light (but see --gold-ink) */

  /* champagne signature (pale fills + glows only) */
  --accent-soft:#f3ddbb;   /* ::selection + .tl.cur glow (champagne, soft) */
  --accent-tint:#fdf3e3;   /* active-nav/seg-on/skilltile/grade-chip/modal-icon fills */

  /* champagne working tokens (used by component overrides below) */
  --champagne:#FAD9A9;     /* logo mark, active-nav left-rail, KPI rule, numerals bg */
  --champagne-line:#ecc789;/* champagne hairline / focus border, a touch deeper */
  --gold-ink:#7a4f18;      /* champagne-derived TEXT: 7.10:1 on white, 6.46:1 on tint */
  --champagne-ico:#e8c58a; /* champagne icon/glyph on the DARK sidebar (11.2:1 on #141414) */

  /* sidebar: brand near-black, not navy */
  --navy:#141414; --navy-2:#1d1d1d; --navy-line:#000000; --side:#141414;

  /* surfaces: warm off-white so champagne tints read warm, not grey */
  --bg:#f6f4f0; --card:#ffffff; --card-2:#faf8f4; --hover:#f1ede6;

  /* ink ramp (warm-neutral, all AA) */
  --ink:#141414; --ink-2:#4b4742; --ink-3:#7c766d; --ink-4:#a8a299;

  /* warm hairlines */
  --line:#ece8e1; --line-2:#e0dbd2; --line-3:#cfc9be;

  /* STATUS — re-deepened so 11px WHITE .spill text clears AA 4.5:1.
     (stock green/teal/orange were 2.6-3.0:1 — a real failure.)
     --amber stays vivid: it is never a white-text pill fill. */
  --green:#0f7d4d;  /* white 5.17:1 */   --teal:#0c7b7a;   /* white 5.08:1 */
  --blue:#2a66d6;   /* white 5.29:1 */   --purple:#7848d6; /* white 5.68:1 */
  --orange:#bf5018; /* white 4.80:1 */   --red:#d23636;    /* white 4.86:1 */
  --gray:#666d78;   /* white 5.22:1 */   --slate:#666d78;
  --violet:#7848d6; --amber:#f5a623;     /* amber = dark-text contexts only */
  /* warm-tinted soft-badge backgrounds (dark text already AA on these) */
  --green-bg:#e4f3ea; --blue-bg:#e7effb; --purple-bg:#eee7fb; --teal-bg:#def1f0;
  --amber-bg:#f8ead0; --red-bg:#f8e4e2; --violet-bg:#eee7fb; --slate-bg:#eef0f3;

  /* focus ring: champagne glow (was terracotta) */
  --ring:0 0 0 3px rgba(250,217,169,.45);

  /* warm-tinted shadow so it doesn't go cold-grey on warm bg */
  --sh-lg:0 24px 56px -16px rgba(35,25,15,.30);
}

/* ============================================================
   Outreach Command — additions on top of the shared
   Load Command design system (styles.css). New components only.
   ============================================================ */

/* status light + health badge */
.hlight{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:12px}
.hlight .dot{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-bg)}
.hlight.warn .dot{background:var(--amber);box-shadow:0 0 0 3px var(--amber-bg)}
.hlight.fail .dot{background:var(--red);box-shadow:0 0 0 3px var(--red-bg)}
.hbadge{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:8px;font-weight:700;font-size:12.5px;letter-spacing:-.1px}
.hbadge.pass{background:var(--green-bg);color:#177e4e}
.hbadge.warn{background:var(--amber-bg);color:#9a6914}
.hbadge.fail{background:var(--red-bg);color:#b4322a}
.hbadge svg{width:13px;height:13px;flex-shrink:0}

/* send-mode chip in the top bar */
.mode-chip{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;padding:5px 11px;border-radius:20px;border:1px solid var(--line-2);background:var(--card)}
.mode-chip .dot{width:7px;height:7px;border-radius:50%}
.mode-chip.armed{color:#b4322a;border-color:#f1c4c4;background:var(--red-bg)} .mode-chip.armed .dot{background:var(--red)}
.mode-chip.draft{color:var(--ink-3)} .mode-chip.draft .dot{background:var(--ink-4)}

/* CSV dropzone */
.dropzone{border:2px dashed var(--line-3);border-radius:var(--r);padding:32px 20px;text-align:center;color:var(--ink-3);background:var(--card-2);transition:.15s;cursor:pointer}
.dropzone:hover,.dropzone.drag{border-color:var(--accent);background:var(--accent-tint);color:var(--accent-2)}
.dropzone .dz-ic{width:42px;height:42px;border-radius:11px;background:var(--card);border:1px solid var(--line-2);display:grid;place-items:center;margin:0 auto 12px;color:var(--accent)}
.dz-ic svg{width:21px;height:21px}
.dropzone b{color:var(--ink);font-size:14px;display:block;margin-bottom:3px}

/* toggle switch (Draft ⇄ Live) */
.switch{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer;user-select:none}
.switch .track{width:38px;height:22px;border-radius:20px;background:var(--line-3);position:relative;transition:.15s;flex-shrink:0}
.switch .track:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:var(--sh-sm);transition:.15s}
.switch.on .track{background:var(--red)}
.switch.on .track:after{transform:translateX(16px)}

/* auth-check rows */
.auth-row{display:flex;align-items:flex-start;gap:12px;padding:13px 15px;border:1px solid var(--line);border-radius:10px;margin-bottom:9px;background:var(--card)}
.auth-row .ar-mark{width:24px;height:24px;border-radius:6px;display:grid;place-items:center;flex-shrink:0;font-size:9px;font-weight:700;color:#fff;margin-top:1px;letter-spacing:.2px}
.auth-row .ar-mark.pass{background:var(--green)} .auth-row .ar-mark.warn{background:var(--amber);color:#141414} .auth-row .ar-mark.fail{background:var(--red)}
.auth-row .ar-b{flex:1;min-width:0}
.auth-row .ar-b b{font-size:13px;font-weight:700}
.auth-row .ar-detail{font-size:12px;color:var(--ink-2);margin-top:2px}
.auth-row .ar-val{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);margin-top:6px;word-break:break-all;background:var(--card-2);border:1px solid var(--line);border-radius:6px;padding:5px 8px}
.auth-row .ar-fix{font-size:11.5px;color:var(--accent-2);margin-top:6px;font-weight:600}
.auth-row .ar-fix svg{width:13px;height:13px;vertical-align:-2px}

/* daily-cap bar + key/value rows */
.cap-bar{height:7px;border-radius:6px;background:var(--line-2);overflow:hidden;width:170px}
.cap-bar i{display:block;height:100%;background:var(--accent);transition:width .3s}
.cap-bar i.hot{background:var(--amber)}
.kv{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--ink-2)}
.kv:last-child{border:0}
.kv b{font-variant-numeric:tabular-nums;color:var(--ink);font-weight:600}
.mini-empty{padding:30px;text-align:center;color:var(--ink-3);font-size:12.5px}
.mini-empty svg{width:14px;height:14px;vertical-align:-2px;opacity:.6}

/* login / first-run setup gate */
.authgate{position:fixed;inset:0;z-index:300;display:none;place-items:center;background:var(--bg)}
.authgate.show{display:grid}
.authcard{width:min(390px,92vw);background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-lg);padding:30px 30px 26px}
.authcard .brandrow{display:flex;align-items:center;gap:11px;margin-bottom:20px}
.authcard .brandrow .mark{width:34px;height:34px;border-radius:8px;background:var(--accent);display:grid;place-items:center;flex-shrink:0}
.authcard .brandrow .mark svg{width:20px;height:20px}
.authcard h1{font-size:19px;font-weight:700;margin:0;letter-spacing:-.3px}
.authcard .sub{color:var(--ink-3);font-size:12.5px;margin-top:2px}
.authcard .err{color:var(--red);font-size:12px;margin-top:10px;min-height:15px}
.side-foot .gear{cursor:pointer}

/* ============================================================
   Ink + Champagne brand overrides — component level (reaches the
   hardcoded values the :root block can't). Champagne is signature,
   never a fill behind white text; status fills cleared to WCAG AA.
   ============================================================ */
/* sidebar text: warm on near-black (was navy-era cool) */
.nav a{color:#c2bbb0}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.nav .lbl{color:#8a8276}
/* active nav: champagne rail + tint + gold icon (replaces hardcoded blues) */
.nav a.active{background:rgba(250,217,169,.16);color:#fff;font-weight:600}
.nav a.active:before{background:var(--champagne)}
.nav a.active svg{color:var(--champagne-ico);opacity:1}
.nav a .badge.amber,.nav a.active .badge{background:var(--champagne);color:#141414}
/* brand mark = gold tile + ink glyph; side-foot avatar = dark tile, gold monogram */
.brand .mark{background:var(--champagne)}
.side-foot .av{background:#262626;color:var(--champagne-ico)}
/* KPI signature: champagne cap on the hero card + gold hero numeral */
.kpi{border-top:2px solid transparent}
.kpis .kpi:first-child{border-top-color:var(--champagne)}
.kpis .kpi:first-child .val{color:var(--gold-ink)}
/* gold text affordances (champagne-derived, AA via --gold-ink) */
.seg button.on{color:var(--gold-ink)}
.mc-name b,.cc-logo,.mc .gradechip,.tag.grade{color:var(--gold-ink)}
.dtab.on{color:var(--gold-ink);border-bottom-color:var(--champagne-line)}
.tbl tbody tr.row-click:hover{box-shadow:inset 3px 0 0 var(--champagne)}
/* email-preview modal: gold accents + warm scrim */
.modal-h .mi{color:var(--gold-ink)}
.att-pill svg{color:var(--gold-ink)}
.email-preview{border-top:2px solid var(--champagne)}
.modal-scrim{background:rgba(35,25,15,.5)}
.scrim{background:rgba(35,25,15,.4)}
/* champagne focus edges */
.search:focus-within,.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--champagne-line)}
/* status pills: deepen the one hardcoded fail + owner avatars (AA white text) */
.sp-outreach{background:#3a68cf}
.oav-d{background:#2a66d6} .oav-g{background:#7848d6}
/* capacity meter gold */
.cap-bar i{background:var(--champagne-line)}
.cap-bar i.hot{background:var(--amber)}
/* login / auth card marks: gold tile + ink glyph; gold links */
.login-brand .mark,.authcard .brandrow .mark{background:var(--champagne)}
.login-form .eyebrow,.login-form .row a{color:var(--gold-ink)}
.stack{display:flex;flex-direction:column;gap:16px}
.row-actions{display:flex;gap:6px;justify-content:flex-end}