/* ─── Elevate Maths · Cookiebot consent banner – brand theme ───────────────
   Gold: #C8A951  |  Gold-light: #E2C97E  |  Black: #1A1A1A
   All rules use !important to override Cookiebot's own specificity.
──────────────────────────────────────────────────────────────────────────── */

/* ── 1. CATCH-ALL: every element in the dialog → dark background, white text ── */
#CybotCookiebotDialog,
#CybotCookiebotDialog * {
  color: #ffffff !important;
  background-color: #1A1A1A !important;
  border-color: rgba(200,169,81,0.2) !important;
  box-shadow: none !important;
  outline-color: #C8A951 !important;
}

/* ── 2. CONTAINER: outer wrapper border & shadow ── */
#CybotCookiebotDialog {
  font-family: 'Montserrat', sans-serif !important;
  border-top: 2px solid #C8A951 !important;
  box-shadow: 0 -8px 40px rgba(0,0,0,0.6) !important;
}

/* ── 3. TITLE: gold ── */
#CybotCookiebotDialogBodyContentTitle,
#CybotCookiebotDialogBodyContentTitle * {
  font-family: 'Cormorant Garamond', serif !important;
  color: #C8A951 !important;
  background-color: transparent !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
}

/* ── 4. BODY TEXT: sizing ── */
#CybotCookiebotDialogBodyContentText,
#CybotCookiebotDialogBodyContentText * {
  background-color: transparent !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}
#CybotCookiebotDialogBodyContentText a {
  color: #C8A951 !important;
  background-color: transparent !important;
  text-decoration: underline !important;
}

/* ── 5. BUTTON WRAPPER BACKGROUNDS ── */
#CybotCookiebotDialogBodyButtons,
#CybotCookiebotDialogBodyLevelButtonsLevelOptinAllowAll,
#CybotCookiebotDialogBodyLevelButtonsLevelOptinAllowallSelector {
  background-color: transparent !important;
}

/* ── 6. CATCH-ALL BUTTONS: transparent with gold outline ── */
#CybotCookiebotDialog button,
#CybotCookiebotDialog a[class*="Button"],
#CybotCookiebotDialog a[id*="Button"] {
  background-color: transparent !important;
  border: 1px solid rgba(200,169,81,0.5) !important;
  color: #C8A951 !important;
}

/* ── 7. "ALLOW ALL" button → filled gold ── */
#CybotCookiebotDialogBodyButtonAccept,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
  background-color: #C8A951 !important;
  border: 1px solid #C8A951 !important;
  color: #0a0a0a !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  transition: all 0.3s !important;
}
#CybotCookiebotDialogBodyButtonAccept:hover,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll:hover {
  background-color: #E2C97E !important;
  border-color: #E2C97E !important;
}

/* ── 8. "ALLOW SELECTION" button → filled gold ── */
#CybotCookiebotDialogBodyLevelButtonAccept,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection,
.CybotCookiebotDialogBodyButton#CybotCookiebotDialogBodyLevelButtonAccept {
  background-color: #C8A951 !important;
  border: 1px solid #C8A951 !important;
  color: #0a0a0a !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  transition: all 0.3s !important;
}
#CybotCookiebotDialogBodyLevelButtonAccept:hover,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection:hover {
  background-color: #E2C97E !important;
  border-color: #E2C97E !important;
}

/* ── 9. "DECLINE" / "DETAILS" buttons → outlined gold ── */
#CybotCookiebotDialogBodyButtonDecline,
#CybotCookiebotDialogBodyButtonDetails,
#CybotCookiebotDialogBodyLevelButtonDecline {
  background-color: transparent !important;
  border: 1px solid rgba(200,169,81,0.5) !important;
  color: #C8A951 !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  transition: all 0.3s !important;
}
#CybotCookiebotDialogBodyButtonDecline:hover,
#CybotCookiebotDialogBodyButtonDetails:hover,
#CybotCookiebotDialogBodyLevelButtonDecline:hover {
  background-color: rgba(200,169,81,0.1) !important;
  border-color: #C8A951 !important;
}

/* ── 10. TOGGLE SWITCHES — "on" state ── */
/* accent-color covers the native checkbox colour in all modern browsers */
#CybotCookiebotDialog input[type="checkbox"] {
  accent-color: #C8A951 !important;
}
/* Cookiebot custom slider approach */
#CybotCookiebotDialog input:checked + .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: #C8A951 !important;
}
#CybotCookiebotDialogBodyContentControlSwitch:checked
  + .CybotCookiebotDialogBodyContentControlSliderWrapper
  .CybotCookiebotDialogBodyContentControlSliderRound,
.CybotCookiebotDialogBodyContentControlSliderWrapper.CybotCookiebotDialogBodyContentControlsCheckboxOn,
.CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: rgba(200,169,81,0.25) !important;
}
#CybotCookiebotDialog input:checked ~ .CybotCookiebotDialogBodyLevelButtonSlider,
#CybotCookiebotDialog input:checked + label .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: #C8A951 !important;
}

/* ── 11. ACTIVE TAB underline → gold ── */
#CybotCookiebotDialogDetailBodyContentCookieContainerButton[aria-selected="true"],
#CybotCookiebotDialogDetailBodyContentCookieContainerLink[aria-selected="true"],
.CybotCookiebotDialogNavItemSelected {
  color: #C8A951 !important;
  background-color: transparent !important;
  border-bottom: 2px solid #C8A951 !important;
}

/* ── 12. INACTIVE TABS ── */
#CybotCookiebotDialogDetailBodyContentCookieContainerButton,
#CybotCookiebotDialogDetailBodyContentCookieContainerLink {
  color: rgba(255,255,255,0.6) !important;
  background-color: transparent !important;
  border-bottom: 2px solid transparent !important;
}

/* ── 13. LINKS (non-button) → gold ── */
#CybotCookiebotDialog a:not([class*="Button"]):not([id*="Button"]) {
  color: #C8A951 !important;
  background-color: transparent !important;
}

/* ── 14. FOCUS RINGS → gold, not blue ── */
#CybotCookiebotDialog *:focus,
#CybotCookiebotDialog *:focus-visible {
  outline-color: #C8A951 !important;
  box-shadow: 0 0 0 2px rgba(200,169,81,0.4) !important;
}

/* ─── Cookie settings widget (post-consent "Change/Withdraw" panel) ────────
   This is a separate Cookiebot element (#CookiebotWidget), not the initial
   dialog above. Styled to match. A generic fallback also covers the case
   where these actions render inside #CybotCookiebotDialog instead.
──────────────────────────────────────────────────────────────────────────── */

/* ── 15. CATCH-ALL: widget → dark background, white text ── */
#CookiebotWidget,
#CookiebotWidget * {
  color: #ffffff !important;
  background-color: #1A1A1A !important;
  border-color: rgba(200,169,81,0.2) !important;
  box-shadow: none !important;
  outline-color: #C8A951 !important;
}
#CookiebotWidget {
  font-family: 'Montserrat', sans-serif !important;
  border: 1px solid rgba(200,169,81,0.3) !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.6) !important;
}

/* ── 16. CONSENT CATEGORY CHECKMARKS/TOGGLES → gold accent ── */
#CookiebotWidget input[type="checkbox"] {
  accent-color: #C8A951 !important;
}
#CookiebotWidget svg,
#CookiebotWidget [class*="icon"],
#CookiebotWidget [class*="Icon"] {
  fill: #C8A951 !important;
  color: #C8A951 !important;
}

/* ── 17. "CHANGE YOUR CONSENT" → primary gold filled button ── */
#CookiebotWidget-btn-change,
#CybotCookiebotDialog [id*="Change" i],
#CybotCookiebotDialog [id*="change" i] {
  background-color: #C8A951 !important;
  border: 1px solid #C8A951 !important;
  color: #0a0a0a !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  transition: all 0.3s !important;
}
#CookiebotWidget-btn-change:hover,
#CybotCookiebotDialog [id*="Change" i]:hover,
#CybotCookiebotDialog [id*="change" i]:hover {
  background-color: #E2C97E !important;
  border-color: #E2C97E !important;
}

/* ── 18. "WITHDRAW YOUR CONSENT" → gold outline on black ── */
#CookiebotWidget-btn-withdraw,
#CybotCookiebotDialog [id*="Withdraw" i],
#CybotCookiebotDialog [id*="withdraw" i] {
  background-color: transparent !important;
  border: 1px solid #C8A951 !important;
  color: #C8A951 !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  transition: all 0.3s !important;
}
#CookiebotWidget-btn-withdraw:hover,
#CybotCookiebotDialog [id*="Withdraw" i]:hover,
#CybotCookiebotDialog [id*="withdraw" i]:hover {
  background-color: rgba(200,169,81,0.1) !important;
  border-color: #E2C97E !important;
}

/* ── 19. FOCUS RINGS → gold, not blue ── */
#CookiebotWidget *:focus,
#CookiebotWidget *:focus-visible {
  outline-color: #C8A951 !important;
  box-shadow: 0 0 0 2px rgba(200,169,81,0.4) !important;
}