/**
 * Cookie consent theming.
 *
 * The library's own stylesheet (assets/css/vendor/cookieconsent.css) does the
 * layout — toggles, section accordions, icons, focus states, the lot. This file
 * only maps its ~30 theming variables onto the site's tokens.
 *
 * A previous version hand-rolled the whole stylesheet and styled maybe a dozen
 * classes; everything it missed rendered raw, including an unsized SVG chevron
 * that filled the modal. Theme the variables, don't reimplement the CSS.
 */

#cc-main {
  --cc-font-family: inherit;
  --cc-modal-border-radius: var(--radius);
  --cc-btn-border-radius: var(--radius);
  --cc-pm-toggle-border-radius: 999px;
  --cc-modal-transition-duration: 0.2s;
  --cc-z-index: 9000;

  /* surfaces */
  --cc-bg: var(--color-bg);
  --cc-primary-color: var(--color-text);
  --cc-secondary-color: var(--color-muted);
  --cc-link-color: var(--color-link);
  --cc-separator-border-color: var(--color-border);
  --cc-overlay-bg: var(--scrim-3, rgba(0, 0, 0, 0.4));

  /* primary action — accept */
  --cc-btn-primary-bg: var(--color-button);
  --cc-btn-primary-color: var(--color-button-text);
  --cc-btn-primary-border-color: var(--color-button);
  --cc-btn-primary-hover-bg: var(--ink-900, #111);
  --cc-btn-primary-hover-color: var(--color-button-text);
  --cc-btn-primary-hover-border-color: var(--ink-900, #111);

  /* secondary action — reject / choose. Same size and weight as accept:
     a reject that is harder to find than accept is not a real choice. */
  --cc-btn-secondary-bg: transparent;
  --cc-btn-secondary-color: var(--color-text);
  --cc-btn-secondary-border-color: var(--color-border);
  --cc-btn-secondary-hover-bg: var(--color-bg-soft);
  --cc-btn-secondary-hover-color: var(--color-text);
  --cc-btn-secondary-hover-border-color: var(--color-text);

  /* category rows in the preferences modal */
  --cc-cookie-category-block-bg: var(--color-bg-soft);
  --cc-cookie-category-block-border: var(--color-border);
  --cc-cookie-category-block-hover-bg: var(--grey-100, #f0f0f0);
  --cc-cookie-category-block-hover-border: var(--color-border);
  --cc-cookie-category-expanded-block-bg: transparent;
  --cc-cookie-category-expanded-block-hover-bg: var(--color-bg-soft);
  --cc-section-category-border: var(--color-border);

  /* toggles */
  --cc-toggle-on-bg: var(--color-button);
  --cc-toggle-off-bg: var(--grey-300, #c9c9c9);
  --cc-toggle-on-knob-bg: var(--color-bg);
  --cc-toggle-off-knob-bg: var(--color-bg);
  --cc-toggle-enabled-icon-color: var(--color-bg);
  --cc-toggle-disabled-icon-color: var(--color-bg);

  --cc-footer-bg: var(--color-bg-soft);
  --cc-footer-color: var(--color-muted);
  --cc-footer-border-color: var(--color-border);
}

/* The title reads as a label, matching the rest of the site's small caps. */
#cc-main .cm__title,
#cc-main .pm__title {
  letter-spacing: -0.01em;
}

/* Buttons pick up the monospace treatment used for every other CTA. */
#cc-main .cm__btn,
#cc-main .pm__btn {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.74rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
