/* Braai theme for vanilla-cookieconsent: postcard paper by day, night postcard in dark mode.
   Built on the theme tokens in site.css, so it follows the page's light/dark switch. */
#cc-main {
  --cc-font-family: "Nunito", system-ui, sans-serif;
  --cc-modal-border-radius: 16px;
  --cc-btn-border-radius: 12px;
  --cc-modal-margin: 16px;
  --cc-z-index: 2147483000;

  --cc-bg: var(--card);
  --cc-primary-color: var(--text);
  --cc-secondary-color: var(--muted);
  --cc-link-color: var(--link);
  --cc-overlay-bg: rgba(33, 22, 15, .7);

  --cc-btn-primary-bg: var(--tomato-dark);
  --cc-btn-primary-color: #fff;
  --cc-btn-primary-border-color: var(--ink);
  --cc-btn-primary-hover-bg: var(--tomato);
  --cc-btn-primary-hover-color: #fff;
  --cc-btn-primary-hover-border-color: var(--ink);

  --cc-btn-secondary-bg: var(--bg);
  --cc-btn-secondary-color: var(--text);
  --cc-btn-secondary-border-color: var(--ink);
  --cc-btn-secondary-hover-bg: var(--rule);
  --cc-btn-secondary-hover-color: var(--text);
  --cc-btn-secondary-hover-border-color: var(--ink);

  --cc-separator-border-color: var(--rule);
  --cc-footer-bg: var(--bg);
  --cc-footer-color: var(--muted);
  --cc-footer-border-color: var(--rule);

  --cc-toggle-on-bg: var(--grass-dark);
  --cc-toggle-off-bg: var(--kraft-dark);
  --cc-toggle-on-knob-bg: #fff;
  --cc-toggle-off-knob-bg: #fff;
  --cc-toggle-enabled-icon-color: var(--grass-dark);
  --cc-toggle-disabled-icon-color: var(--kraft-dark);
  --cc-toggle-readonly-bg: var(--muted);
  --cc-toggle-readonly-knob-bg: #fff;
  --cc-toggle-readonly-knob-icon-color: var(--muted);

  --cc-section-category-border: var(--rule);
  --cc-cookie-category-block-bg: var(--bg);
  --cc-cookie-category-block-border: var(--rule);
  --cc-cookie-category-block-hover-bg: var(--rule);
  --cc-cookie-category-block-hover-border: var(--rule);
  --cc-cookie-category-expanded-block-bg: var(--bg);
  --cc-cookie-category-expanded-block-hover-bg: var(--rule);

  --cc-webkit-scrollbar-bg: var(--kraft);
  --cc-webkit-scrollbar-hover-bg: var(--kraft-dark);
}

#cc-main .cm,
#cc-main .pm {
  border: 3px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
}

#cc-main .cm__title,
#cc-main .pm__title {
  font-family: "Lilita One", system-ui, sans-serif;
  font-weight: 400;
  letter-spacing: .01em;
}

#cc-main .cm__title { font-size: 1.4em; }

/* The site keeps every tap target at least 48px tall (tools/check-browser.mjs). */
#cc-main .cm__btn,
#cc-main .pm__btn {
  min-height: 48px;
  border-width: 3px;
  font-weight: 800;
}

#cc-main .cm__footer a,
#cc-main .pm__section-desc a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
}

#cc-main a,
#cc-main .cc__link {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* "Cookie settings" in the footer: a button styled like the footer links around it. */
.to .cookie-settings {
  display: flex; align-items: center; width: 100%; min-height: 48px; padding: 0;
  border: 0; border-bottom: 2px solid var(--rule); background: none;
  color: var(--text); font: inherit; font-weight: 800; text-align: left; cursor: pointer;
}
.to .cookie-settings:hover { color: var(--link); }