/* Bylaw Ledger Sky theme. Loaded after the component and page styles. */
:root {
  --sky: #A7BDD3;
  --sky-deep: #8FA7C0;
  --sky-text: #2f3947;
  --signal: #FFCF24;
  --signal-tint: #FFF3C4;
  --signal-line: #E8D27A;
  --canvas: #F4F6F9;
  --section: #FFFFFF;
  --surface: #FFFFFF;
  --surface-raised: #EEF1F5;
  --line: #D5DEE8;
  --line-strong: #A7BDD3;
  --ink: #1F1E23;
  --navy: #1F1E23;
  --blue: #50709A;
  --slate: #4A5566;
  --tag: #EEF1F5;
  --info: #E4ECF4;
  --info-line: #A7BDD3;
  --pill-app: #E4ECF4;
  --off: #D5DEE8;
  --on-dark-muted: #A7BDD3;
  --focus: #50709A;
  --border-muted: #A7BDD3;
  --seg-surface: #EEF1F5;
  --hairline-warm: #EEF1F5;
  --white: #FFFFFF;
  --shadow-card: 0 6px 18px rgba(31,30,35,.07);
  --shadow-float: 0 14px 44px rgba(31,30,35,.12);
}

body { background: var(--canvas); color: var(--ink); }
a { color: inherit; }

/* The shared header is the permanent Sky band. */
.bl-header { background: var(--sky); border-bottom-color: var(--sky-deep); }
.bl-header .bl-nav a { color: var(--ink); }
.bl-header .bl-nav a:hover { background: rgba(255,255,255,.35); }
.bl-header .bl-nav a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--ink); }
.bl-brand { flex: 0 0 auto; gap: 0; }
.bl-brand__logo { display: block; width: auto; height: 32px; max-width: min(220px, 45vw); object-fit: contain; object-position: left center; }
.bl-footer .bl-brand__logo { height: 32px; }

/* Each page's initial content band carries the Sky lead treatment. */
main > section:first-child,
main > .bl-section:first-child { background: var(--sky); border-color: var(--sky-deep); }
main > section:first-child .bl-lede,
main > .bl-section:first-child .bl-lede,
main > section:first-child .bl-body,
main > .bl-section:first-child .bl-body,
main > section:first-child > .container > p,
main > .bl-section:first-child > .container > p { color: var(--sky-text); }
main > section:first-child .bl-eyebrow,
main > .bl-section:first-child .bl-eyebrow { color: var(--ink); }

.bl-btn--primary,
.button-primary { background: var(--signal); color: var(--ink); border: 1.5px solid var(--ink); }
.bl-btn--primary:hover,
.button-primary:hover { background: #FFD94D; color: var(--ink); border-color: var(--ink); }
.bl-btn--secondary { background: transparent; color: var(--ink); border: 1.5px solid var(--ink); }
.bl-btn--secondary:hover { background: rgba(31,30,35,.06); border-color: var(--ink); }
.bl-btn--on-dark { background: var(--signal); color: var(--ink); border-color: var(--signal); }
.bl-link { color: var(--ink); }
.bl-link::after { color: var(--blue); }

.bl-section--alt,
.section-alt { background: var(--section); border-color: var(--line); }
.bl-section--dark,
.bl-next,
.bl-footer { background: var(--ink); }
.bl-next__go { background: var(--signal); color: var(--ink); }
.bl-icon-tile { background: var(--info); color: var(--ink); }
.bl-icon-tile--dark,
.bl-icon-tile--round { background: var(--ink); color: var(--signal); }
.bl-tabs [role="tablist"] { background: var(--surface); border-color: var(--line); }
.bl-tabs [role="tab"] { color: var(--ink); }
.bl-tabs [role="tab"][aria-selected="true"] { background: var(--ink); color: var(--white); }
.bl-tabs [role="tab"] .bl-count { background: var(--info); color: var(--ink); }
.bl-tabs [role="tab"][aria-selected="true"] .bl-count { background: var(--signal); color: var(--ink); }
.bl-seg > [aria-selected="true"],
.bl-seg > [aria-pressed="true"] { background: var(--ink); color: var(--signal); }
.bl-pill--core { background: var(--info); border-color: var(--info-line); color: #3C4F68; }
.bl-pill--planned { background: var(--signal-tint); border-color: var(--signal-line); color: var(--ink); }
.bl-pill--future,
.bl-card--future { border-color: var(--sky-deep); }
.bl-steps__n b,
.bl-flow-list__rail b,
.bl-flow__num { background: var(--ink); color: var(--signal); }
.bl-rail__dot::before { background: var(--signal); border-color: var(--ink); }
.bl-rail__dot::after { background: var(--line-strong); }
.bl-limit { background: var(--surface-raised); border-color: var(--line-strong); }
.bl-waffle span { background: var(--info); }
.bl-waffle span.is-on { background: var(--blue); }
.bl-choice-tiles label:has(input:checked) { border-color: var(--ink); background: var(--info); }
.bl-input { border-width: 1.5px; }

/* Legacy page primitives inherit the system without changing page content. */
.button-secondary,
.button-quiet,
.text-link,
.case-actions a { background: var(--surface); color: var(--ink); border-color: var(--line); }
.button-secondary:hover,
.button-quiet:hover,
.text-link:hover,
.case-actions a:hover { background: var(--surface-raised); border-color: var(--blue); }
.status.demonstrated,
.status.case-status.demonstrated { background: var(--info); border-color: var(--info-line); color: var(--ink); }
.status.planned,
.status.case-status.planned { background: var(--signal-tint); border-color: var(--signal-line); color: var(--ink); }
.panel-label::before { background: var(--signal); border: 1px solid var(--ink); }
.step-no,
.waitlist-paths span { background: var(--ink); color: var(--signal); }
.callout .button { background: var(--signal); color: var(--ink); border-color: var(--signal); }
input[type="checkbox"] { accent-color: var(--blue); }

@media (max-width: 719px) {
  .bl-brand__logo,
  .bl-footer .bl-brand__logo { height: 28px; }
}

@media (max-width: 479px) {
  .bl-header .bl-btn--primary { display: none; }
}