/* Design tokens + base reset shared by the public calendar (integrated-marketing-calendar.html)
   and the admin page (admin.html), so both stay visually consistent and pick up theme
   changes together. Brand --c-* values here are defaults/fallback; the pages override
   them at runtime from /api/config once that loads, so an admin color change takes effect
   without editing this file. */
:root{
  --surface: #F5F6F8;
  --surface-raised: #FFFFFF;
  --surface-sunken: #ECEEF1;
  --border: #E1E4E9;
  --border-strong: #CBD0D8;
  --ink: #14161A;
  --ink-secondary: #52565E;
  --ink-muted: #666A73; /* darkened from #82868F for WCAG AA contrast (4.5:1) on surface-raised/surface-sunken */
  --accent: #C33526;
  --accent-ink: #FFFFFF;
  --focus: #2563A8;

  --status-planning-bg: #EDEEF1; --status-planning-fg: #52565E;
  --status-production-bg: #FCEACB; --status-production-fg: #7A5416;
  --status-live-bg: #DDF0E4; --status-live-fg: #1E7A45;
  --status-wrapped-bg: #E4EAF3; --status-wrapped-fg: #3A5580;

  --c-flames: #9E072F;
  --c-hitmen: #069392;
  --c-roughnecks: #96963C;
  --c-wranglers: #1B0AEC;
  --c-clubred: #C35B6A;
  --c-stampeders: #1688F5;
  --c-venue: #47609D;
  --c-livee: #E030CC;
  --c-foundation: #875E12;
  --c-csec: #7F0F8A;

  --month-cell-h: 148px;
  --week-cell-h: 340px;

  --chevron: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%226%22%20viewBox%3D%220%200%2010%206%22%3E%3Cpath%20d%3D%22M1%201l4%204%204-4%22%20stroke%3D%22%23666A73%22%20stroke-width%3D%221.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --surface: #16181C;
    --surface-raised: #1E2126;
    --surface-sunken: #101215;
    --border: #2C3038;
    --border-strong: #3A3F49;
    --ink: #EDEEF0;
    --ink-secondary: #B4B8C0;
    --ink-muted: #868B94; /* lightened from #7C818A for WCAG AA contrast (4.5:1) on surface-raised */
    --accent: #E35C4F;
    --accent-ink: #16181C;
    --focus: #5B8FD1;

    --status-planning-bg: #2A2D33; --status-planning-fg: #B4B8C0;
    --status-production-bg: #3C3120; --status-production-fg: #E3B564;
    --status-live-bg: #1E3128; --status-live-fg: #6FCB99;
    --status-wrapped-bg: #232C3D; --status-wrapped-fg: #8FB0DE;

    --c-flames: #9F4B59;
    --c-hitmen: #1A9BA3;
    --c-roughnecks: #5C7A1E;
    --c-wranglers: #623BF7;
    --c-clubred: #F1417A;
    --c-stampeders: #0F88EE;
    --c-venue: #4C5F9E;
    --c-livee: #CC08B2;
    --c-foundation: #E8590D;
    --c-csec: #9A2CC7;

    --chevron: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%226%22%20viewBox%3D%220%200%2010%206%22%3E%3Cpath%20d%3D%22M1%201l4%204%204-4%22%20stroke%3D%22%23868B94%22%20stroke-width%3D%221.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  }
}
:root[data-theme="dark"]{
  --surface: #16181C;
  --surface-raised: #1E2126;
  --surface-sunken: #101215;
  --border: #2C3038;
  --border-strong: #3A3F49;
  --ink: #EDEEF0;
  --ink-secondary: #B4B8C0;
  --ink-muted: #868B94; /* lightened from #7C818A for WCAG AA contrast (4.5:1) on surface-raised */
  --accent: #E35C4F;
  --accent-ink: #16181C;
  --focus: #5B8FD1;

  --status-planning-bg: #2A2D33; --status-planning-fg: #B4B8C0;
  --status-production-bg: #3C3120; --status-production-fg: #E3B564;
  --status-live-bg: #1E3128; --status-live-fg: #6FCB99;
  --status-wrapped-bg: #232C3D; --status-wrapped-fg: #8FB0DE;

  --c-flames: #9F4B59;
  --c-hitmen: #1A9BA3;
  --c-roughnecks: #5C7A1E;
  --c-wranglers: #623BF7;
  --c-clubred: #F1417A;
  --c-stampeders: #0F88EE;
  --c-venue: #4C5F9E;
  --c-livee: #CC08B2;
  --c-foundation: #E8590D;
  --c-csec: #9A2CC7;

  --chevron: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%226%22%20viewBox%3D%220%200%2010%206%22%3E%3Cpath%20d%3D%22M1%201l4%204%204-4%22%20stroke%3D%22%23868B94%22%20stroke-width%3D%221.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--surface);
  color:var(--ink);
  font-family:"Public Sans",-apple-system,Segoe UI,sans-serif;
  font-variant-numeric: tabular-nums;
}
h1,h2,h3{font-family:"Oswald",Impact,sans-serif; text-transform:uppercase; letter-spacing:.02em; text-wrap:balance; margin:0;}
button{font-family:inherit;}
:focus-visible{outline:2px solid var(--focus); outline-offset:2px;}
.truncate{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
/* Without !important, an element's own class (e.g. .btn{display:inline-block})
   can outrank the UA stylesheet's default [hidden]{display:none}, since both
   are equal-specificity but author styles beat UA styles - so a hidden button
   can render anyway. This keeps [hidden] authoritative everywhere. */
[hidden]{display:none!important;}

/* Small pill-style nav link used in each page's topbar (e.g. "Back to calendar") */
.back-link{
  font-size:12.5px; font-weight:600; color:var(--ink-secondary); text-decoration:none;
  border:1px solid var(--border-strong); border-radius:8px; padding:8px 12px; white-space:nowrap;
}
.back-link:hover{background:var(--surface-sunken);}

/* Pill-style tab switcher, used for Month/Week/Day on the calendar and section
   tabs on the admin page */
.viewtabs{
  display:inline-flex; border:1px solid var(--border-strong); border-radius:9px; overflow:hidden;
  background:var(--surface-raised);
}
.viewtab{
  border:none; background:none; color:var(--ink-secondary); font-size:12.5px; font-weight:700;
  letter-spacing:.03em; text-transform:uppercase; padding:8px 14px; cursor:pointer;
  border-right:1px solid var(--border-strong);
}
.viewtab:last-child{border-right:none;}
.viewtab[aria-pressed="true"]{background:var(--accent); color:var(--accent-ink);}

/* Prev/Today-or-This-Week/Next date navigation, used by the calendar and the weekly report */
.datenav{display:flex; align-items:center; gap:8px;}
.datenav button{
  height:32px; border-radius:8px; border:1px solid var(--border-strong);
  background:var(--surface-raised); color:var(--ink); cursor:pointer; font-size:15px; line-height:1;
}
.datenav .arrow{width:32px;}
.datenav .today-btn{padding:0 12px; font-size:12.5px; font-weight:700; white-space:nowrap;}
.datenav button:hover{background:var(--surface-sunken);}
.date-label{font-family:"Oswald"; font-weight:600; font-size:15px; letter-spacing:.03em; min-width:170px; text-align:center;}
.jump-date{
  height:32px; border-radius:8px; border:1px solid var(--border-strong);
  background:var(--surface-raised); color:var(--ink); font-size:12.5px; padding:0 10px; cursor:pointer;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.jump-date:hover{border-color:var(--ink-muted);}
.jump-date:focus-visible{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px color-mix(in srgb, var(--focus) 20%, transparent);}
.jump-date::-webkit-calendar-picker-indicator{
  cursor:pointer; opacity:.6; transition:opacity .15s ease; border-radius:4px;
}
.jump-date::-webkit-calendar-picker-indicator:hover{opacity:1;}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .jump-date::-webkit-calendar-picker-indicator{filter:invert(1);}
}
:root[data-theme="dark"] .jump-date::-webkit-calendar-picker-indicator{filter:invert(1);}

/* Dismissable-looking status strip - shown when live data can't be reached */
.banner{
  font-size:12.5px; font-weight:600; color:var(--status-production-fg); background:var(--status-production-bg);
  border-radius:9px; padding:10px 14px; margin-bottom:16px;
}
