/* GGS Compliance Kit consent UI — themeable.
   Per site, override the --ggsc-* hooks (on :root or .ggs-consent) to match the
   brand; see compliance/consent/themes/*.css. With no overrides it falls back to
   the GGS cream/orange look (and reads --paper/--ink/--orange/--blue if present,
   so the GGS sites theme themselves automatically). */
.ggs-consent {
  /* Resolved theme values: --ggsc-* override  ->  GGS named token  ->  default. */
  --_font:         var(--ggsc-font, var(--font-body, 'Inter', system-ui, sans-serif));
  --_bg:           var(--ggsc-bg, var(--paper, #ECE6D7));
  --_fg:           var(--ggsc-fg, var(--ink, #16120E));
  --_link:         var(--ggsc-link, var(--blue, #2A37CC));
  --_accent:       var(--ggsc-accent, var(--orange, #F8501E));
  --_accent-fg:    var(--ggsc-accent-fg, var(--ink, #16120E));
  --_ghost-bg:     var(--ggsc-ghost-bg, var(--_bg));
  --_ghost-fg:     var(--ggsc-ghost-fg, var(--_fg));
  --_panel-border: var(--ggsc-panel-border, 2px solid var(--_fg));
  --_btn-border:   var(--ggsc-btn-border, 2px solid var(--_fg));
  --_solid-border: var(--ggsc-solid-border, var(--_btn-border));
  --_radius:       var(--ggsc-radius, 10px);
  --_btn-radius:   var(--ggsc-btn-radius, 8px);
  --_panel-shadow: var(--ggsc-panel-shadow, 5px 5px 0 var(--_fg));
  --_btn-shadow:   var(--ggsc-btn-shadow, 3px 3px 0 var(--_fg));
  --_btn-hover:    var(--ggsc-btn-hover, translate(1px, 1px));
  --_overlay:      var(--ggsc-overlay, rgba(13, 10, 8, .5));
  --_focus:        var(--ggsc-focus, var(--blue, #2A37CC));

  position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147483646;
  display: flex; justify-content: center; padding: 16px;
  font-family: var(--_font); color: var(--_fg);
}
.ggs-consent[hidden] { display: none; }
.ggs-consent--prefs { align-items: center; top: 0; background: var(--_overlay); }
.ggs-consent__panel {
  background: var(--_bg); border: var(--_panel-border);
  box-shadow: var(--_panel-shadow); border-radius: var(--_radius);
  max-width: 720px; width: 100%; padding: 18px 20px;
}
.ggs-consent__title { font-size: 1.1rem; margin: 0 0 6px; }
.ggs-consent__desc { font-size: .92rem; margin: 0 0 14px; line-height: 1.5; }
.ggs-consent__desc a { color: var(--_link); }
.ggs-consent__row { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; font-size: .92rem; }
.ggs-consent__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; margin-top: 12px; }
.ggs-consent__btn {
  font: inherit; font-weight: 600; cursor: pointer; padding: 9px 16px;
  border-radius: var(--_btn-radius); border: var(--_btn-border);
  background: var(--_ghost-bg); color: var(--_ghost-fg);
  transition: transform .15s ease, box-shadow .15s ease, background .2s, color .2s;
}
.ggs-consent__btn--solid {
  background: var(--_accent); color: var(--_accent-fg);
  border: var(--_solid-border); box-shadow: var(--_btn-shadow);
}
.ggs-consent__btn:focus-visible { outline: 3px solid var(--_focus); outline-offset: 2px; }
.ggs-consent__btn:hover { transform: var(--_btn-hover); }
@media (max-width: 560px) { .ggs-consent__actions { justify-content: stretch; } .ggs-consent__btn { flex: 1; } }
@media (prefers-reduced-motion: reduce) { .ggs-consent__btn { transition: none; } .ggs-consent__btn:hover { transform: none; } }
@media print { .ggs-consent { display: none !important; } }

/* Cursor safeguard. Sites with a custom JS cursor hide the native one with
   `body.cursor-on * { cursor: none !important }`, and their cursor element sits
   below this near-max-z-index dialog, leaving no visible pointer on it. The
   doubled class outranks that rule (with !important) so the pointer returns.
   Harmless on sites without a custom cursor. */
.ggs-consent.ggs-consent,
.ggs-consent.ggs-consent * { cursor: auto !important; }
.ggs-consent.ggs-consent a,
.ggs-consent.ggs-consent button,
.ggs-consent.ggs-consent label,
.ggs-consent.ggs-consent input { cursor: pointer !important; }

/* Lost Dutchman Marathon consent theme — pearl panel, deep-navy text, LDM gold
   accent, Outfit body font. Appended to the deployed css/consent.css after the
   themeable base. */
:root {
  --ggsc-font: 'Outfit', system-ui, sans-serif;
  --ggsc-bg: #f7f6f0;
  --ggsc-fg: #0f1a23;
  --ggsc-link: #254157;
  --ggsc-accent: #d0921a;
  --ggsc-accent-fg: #0f1a23;
  --ggsc-ghost-bg: #ffffff;
  --ggsc-ghost-fg: #0f1a23;
  --ggsc-panel-border: 1px solid #e4ddc9;
  --ggsc-btn-border: 1px solid #d8d2c2;
  --ggsc-solid-border: 1px solid transparent;
  --ggsc-radius: 14px;
  --ggsc-btn-radius: 8px;
  --ggsc-panel-shadow: 0 16px 40px rgba(15, 26, 35, .22);
  --ggsc-btn-shadow: none;
  --ggsc-btn-hover: translateY(-1px);
  --ggsc-overlay: rgba(15, 26, 35, .5);
  --ggsc-focus: #254157;
}
