/* PeachCut skin for the cookie-consent library (ADR-088).
   Only --cc-* tokens plus one rule: on the banner Accept and Reject look identical
   (ADR-084 — the two answers weigh the same). Loaded after vendor/cookie-consent.css.
   Dark by default (the app is dark); the landing's light theme switches it to light. */

.cc[data-cc-scheme],
.cc__placeholder[data-cc-scheme] {
    --cc-font-family: inherit;
    --cc-title-weight: 600;
    --cc-color-bg: #201D1D;
    --cc-color-fg: #F4F4F4;
    --cc-color-muted: #B8B8B8;
    --cc-color-border: #393636;
    --cc-color-divider: #312E2E;
    --cc-color-surface: #2A2727;
    --cc-color-accent: #F5A97F;
    --cc-color-accent-hover: #F8BC98;
    --cc-color-accent-fg: #4A0F1C;
    --cc-color-focus: #F5A97F;
    --cc-color-switch-off: #393636;
    --cc-color-switch-on: #F5A97F;
    --cc-color-switch-thumb: #F4F4F4;
    --cc-color-backdrop: rgba(0, 0, 0, 0.6);
    --cc-shadow: 0 1em 3em rgba(0, 0, 0, 0.5);
    --cc-radius: 0.875em;
    --cc-radius-btn: 0.5em;
    --cc-card-width: 24em;
}

/* landing, light theme (html[data-theme="light"], set by the landing's theme switch) */
:root[data-theme="light"] .cc[data-cc-scheme],
:root[data-theme="light"] .cc__placeholder[data-cc-scheme] {
    --cc-color-bg: #FFFFFF;
    --cc-color-fg: #121417;
    --cc-color-muted: #555B63;
    --cc-color-border: rgba(18, 20, 23, 0.14);
    --cc-color-divider: rgba(18, 20, 23, 0.1);
    --cc-color-surface: rgba(18, 20, 23, 0.05);
    --cc-color-focus: #121417;
    --cc-color-switch-off: rgba(18, 20, 23, 0.22);
    --cc-color-switch-thumb: #FFFFFF;
    --cc-color-backdrop: rgba(0, 0, 0, 0.4);
    --cc-shadow: 0 1em 3em rgba(0, 0, 0, 0.14);
}

/* the landing's display face for the titles */
:root[data-theme] .cc[data-cc-scheme] {
    --cc-font-family-heading: var(--f-display, inherit);
}

/* banner: Accept and Reject look exactly the same (ADR-084) — filled with the theme's ink (white on dark, black on light);
   Settings is the text link first in the row (Georgi 2026-10-12, consent.js puts it first) */
.cc__banner .cc__btn--accept,
.cc__banner .cc__btn--reject {
    background: var(--cc-color-fg);
    border-color: var(--cc-color-fg);
    color: var(--cc-color-bg);
}
.cc__banner .cc__btn--accept:hover,
.cc__banner .cc__btn--reject:hover {
    background: var(--cc-color-muted);
    border-color: var(--cc-color-muted);
    color: var(--cc-color-bg);
}
.cc__banner .cc__btn--manage {
    margin-right: 0.25em;
}
