/* azref.com "Kit Bag" look for the ROC public forms (request, eval, fitness, red cards, expense).
   Loaded LAST on every page, after the page's own styles. It only restyles: same markup, same fields, same scripts.
   Matches www.azref.com: Barlow + Barlow Semi Condensed, ink #121417, white header with the 4-color kit stripe,
   3px ink card border, 2px ink fields, ink buttons (navy on hover), yellow pills. Light only, like the site. */
:root{ color-scheme:light;
  --navy:#121417; --navy-2:#1d2a5b; --gold:#f6c915; --red:#ef5a3c; --bg:#ffffff; --surface:#ffffff; --ink:#121417; --muted:#3b3f45; --line:#dcdfe2;
  --field:#ffffff; --bad:#9d2710; --bad-wash:#fff3f0; --good:#2f6a12; --good-wash:#e2f5d4; --note:#fff6d6; --chip:#f2f3f1;
  --sel-bg:#121417; --sel-ink:#ffffff;
  --head:"Barlow Semi Condensed",Barlow,system-ui,sans-serif; --body:Barlow,system-ui,-apple-system,"Segoe UI",sans-serif;
  --kit:linear-gradient(90deg,#f6c915 0 25%,#8bc26a 25% 50%,#35a4e4 50% 75%,#ef5a3c 75% 100%); }
@media (prefers-color-scheme: dark){ :root{ color-scheme:light;
  --bg:#ffffff; --surface:#ffffff; --ink:#121417; --muted:#3b3f45; --line:#dcdfe2; --field:#ffffff;
  --bad:#9d2710; --bad-wash:#fff3f0; --good:#2f6a12; --good-wash:#e2f5d4; --note:#fff6d6; --chip:#f2f3f1; --sel-bg:#121417; --sel-ink:#ffffff; }
  .chip:has(input:checked){ background:#121417; border-color:#121417; color:#fff; } }

body{ background:#fff; color:var(--ink); font-family:var(--body); font-size:16px; }
h1, h2, h3, legend, .oswald{ font-family:var(--head); }
a{ color:var(--ink); }

/* card + header */
.card{ border:3px solid var(--ink); border-radius:6px; box-shadow:none; background:#fff; }
.top{ position:relative; background:#fff; color:var(--ink); padding-bottom:28px; border-bottom:0; }
.top::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:6px; background:var(--kit); }
.top a{ color:var(--ink); }
.top .eyebrow, .eyebrow{ color:var(--muted); letter-spacing:.12em; }
.top h1, h1{ font-family:var(--head); font-weight:700; color:var(--ink); letter-spacing:0; }
.top h1{ font-size:28px; line-height:1.1; }
.tag, .price{ background:var(--gold); color:var(--ink); border-radius:999px; }

/* text bits */
.lead, .hint{ color:var(--muted); }
legend{ color:var(--ink); }
legend .n{ background:var(--ink); color:#fff; }
.sect{ border-top:2px solid var(--line); }

/* fields */
label{ font-weight:700; }
input, select, textarea{ border:2px solid var(--ink); border-radius:4px; background:#fff; color:var(--ink); font-family:var(--body); }
input:focus, select:focus, textarea:focus{ outline:3px solid #35a4e4; outline-offset:1px; border-color:var(--ink); }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"], [aria-invalid="true"]{ border-color:#ef5a3c !important; background:#fff3f0; }
.check input, input[type=checkbox], input[type=radio]{ accent-color:#121417; }

/* chips (pick one / pick many) */
.chip{ border:2px solid var(--ink); border-radius:4px; background:#fff; color:var(--ink); }
.chip:has(input:checked), .chip[aria-pressed="true"]{ background:#121417; border-color:#121417; color:#fff; }
.chip:has(input:focus-visible), .chip:focus-visible, .tile:focus-visible, .game:focus-visible, .btn:focus-visible, button:focus-visible{ outline:3px solid #35a4e4; outline-offset:2px; }
.chips.col .chip{ border-radius:4px; }

/* buttons: ink primary like the site, outline secondary */
button, .btn{ border-radius:4px; background:#121417; color:#fff; font-family:var(--head); font-weight:700; font-size:18px; letter-spacing:0; }
button:not([class]):hover, button[type=submit]:not(.chip):not(.tile):not(.game):hover, .btn:not(.alt):not(.link):not(.practice):not(.red):hover{ background:#1d2a5b; }
button.ghost, .btn.alt, .btn.practice{ background:#fff; color:var(--ink); border:2px solid var(--ink); font-family:var(--body); font-size:15px; }
button.ghost:hover, .btn.alt:hover, .btn.practice:hover{ background:#f2f3f1; }
.btn.link{ background:none; color:var(--ink); font-family:var(--body); font-size:14.5px; text-decoration:underline; }
.btn.link:hover{ background:none; }
.btn.red{ background:#ef5a3c; color:#121417; }
.btn.red:hover{ background:#d94a2d; }
.rowcard .rm{ background:#fff; color:var(--ink); border:2px solid var(--ink); font-family:var(--body); font-size:13px; }

/* boxes, tiles, messages */
.box, .rowcard, .fact, .game{ border:2px solid var(--ink); border-radius:6px; }
.tile{ border:2px solid var(--ink); border-radius:6px; background:#fff; }
a.tile:hover, a.tile:focus-visible, button.tile:hover{ border-color:var(--ink); box-shadow:inset 0 0 0 2px var(--ink), 0 0 0 3px var(--gold); background:#fff; }
.tile[aria-pressed="true"]{ border-color:#121417; box-shadow:inset 0 0 0 2px #121417; background:#f2f3f1; }
.tile .ic{ background:#f2f3f1; border-radius:4px; }
.tile .go{ color:var(--ink); }
.msg{ border-radius:4px; border-left:6px solid #35a4e4; background:#f2f3f1; color:var(--ink); }
.msg.bad{ border-left-color:#ef5a3c; background:#fff3f0; color:#9d2710; }
.msg.good{ border-left-color:#8bc26a; background:#e2f5d4; color:#1f4a0b; }
.msg.note, .note, .bday{ border-left:6px solid #f6c915; background:#fff6d6; color:var(--ink); border-radius:4px; }
.pill{ border-radius:999px; }
.pill.gold{ background:#f6c915; color:#121417; }
.done .ref{ background:#f6c915; color:#121417; border-radius:4px; }
.back{ color:var(--ink); font-weight:700; }
.foot{ color:var(--muted); }
.testbar{ border:2px dashed var(--ink); border-radius:4px; background:#fff6d6; }

/* red card report: step label + progress dashes sit on the white header now */
.stepname{ color:var(--muted); }
.top .progress i{ background:#dcdfe2; }
.top .progress i.on{ background:#121417; }

/* Oct 1 (Joel): lighter lines and lighter type */
.card{ border:1px solid #c9cdd2; box-shadow:0 12px 32px -20px rgba(18,20,23,.35); }
input, select, textarea{ border:1px solid #8f959c; }
input:focus, select:focus, textarea:focus{ outline:2px solid #35a4e4; border-color:#35a4e4; }
.chip, .tile, .box, .rowcard, .fact, .game{ border:1px solid #c9cdd2; }
.chip:has(input:checked), .chip[aria-pressed="true"]{ border-color:#121417; }
.tile[aria-pressed="true"]{ box-shadow:inset 0 0 0 1px #121417; }
a.tile:hover, a.tile:focus-visible, button.tile:hover{ box-shadow:0 0 0 3px rgba(246,201,21,.55); border-color:#8f959c; }
button.ghost, .btn.alt, .btn.practice, .rowcard .rm{ border:1px solid #8f959c; }
.sect{ border-top:1px solid #dcdfe2; }
.msg, .msg.note, .note, .bday{ border-left-width:4px; }
.top::after{ height:5px; }
label, .q, .qlabel, .check, .chip, .tile b, .fact b, .game .teams, .rowhead, .back{ font-weight:500; }
legend, .eyebrow, .tag, .price, .pill, .done .ref, .tile .go, .tile .code, .game .when, legend .n{ font-weight:600; }
button, .btn{ font-weight:600; }
.top h1, h1, h2{ font-weight:600; }
b, strong{ font-weight:600; }
