/* =========================================
   Cookiebot Theme — Base template
   Per-site branding via variables only
   ========================================= */

/* =========================================
   SITE BRAND TOKENS
   Change only this block per site
   ========================================= */

:root {
  /* Brand name / notes
     Website: Einstein.nu
     Theme path must be case-correct on server
  */

  /* Core colors */
  --cb-bg: #ffffff;
  --cb-surface: #ffffff;
  --cb-text: #000000;
  --cb-text-muted: #3F3F3F;
  --cb-border: rgba(191,0,18,0.25);

  --cb-accent: #bf0012;
  --cb-accent-hover: #D13342;

  /* Buttons */
  --cb-btn-angle: 180deg;
  --cb-btn-top: #bf0012;
  --cb-btn-bottom: #bf0012;
  --cb-btn-top-hover: #D13342;
  --cb-btn-bottom-hover: #D13342;
  --cb-btn-text: #ffffff;

  /* Toggles */
  --cb-toggle-off: rgba(191,0,18,0.25);
  --cb-toggle-on: #bf0012;

  /* Scrollbar */
  --cb-scroll-rail: rgba(191,0,18,0.12);
  --cb-scroll-thumb: #bf0012;
  --cb-scroll-thumb-border: #ffffff;

  /* Shape + depth */
  --cb-radius: 12px;
  --cb-radius-sm: 8px;
  --cb-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);

  /* Typography */
  --cb-font-body: "Einstein Open Sans Regular", Arial, sans-serif;
  --cb-font-heading: "Einstein Bodoni Medium", Georgia, serif;
  --cb-font-size: 15px;

  /* Logo */
  --cb-brand-logo: url('/wp-content/themes/Avada-Child-Theme/assets/css/img/rebel-logo-zwart.png');
  --cb-logo-width: 120px;
  --cb-logo-height: 40px;
}

/* =========================================
   Main banner / dialog
   ========================================= */

#CybotCookiebotDialog {
  background: var(--cb-bg) !important;
  color: var(--cb-text) !important;
  border: 1px solid var(--cb-border) !important;
  border-radius: var(--cb-radius) !important;
  box-shadow: var(--cb-shadow) !important;
  font-family: var(--cb-font-body) !important;
  font-size: var(--cb-font-size) !important;
}

#CybotCookiebotDialog h1,
#CybotCookiebotDialog h2,
#CybotCookiebotDialogBodyTitle {
  font-family: var(--cb-font-heading) !important;
  color: var(--cb-text) !important;
  letter-spacing: 0.02em;
}

#CybotCookiebotDialog p,
#CybotCookiebotDialog span,
#CybotCookiebotDialog label {
  color: var(--cb-text) !important;
}

#CybotCookiebotDialog a {
  color: var(--cb-accent) !important;
  text-decoration: underline !important;
}

#CybotCookiebotDialog a:hover {
  color: var(--cb-accent-hover) !important;
}

/* Buttons base */
#CybotCookiebotDialog button {
  border-radius: var(--cb-radius-sm) !important;
  font-family: var(--cb-font-body) !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

/* Primary buttons */
#CybotCookiebotDialogBodyButtonAccept,
#CybotCookiebotDialogBodyLevelButtonAccept,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
  background: linear-gradient(
    var(--cb-btn-angle),
    var(--cb-btn-top) 0%,
    var(--cb-btn-bottom) 100%
  ) !important;
  border: 1px solid var(--cb-accent) !important;
  color: var(--cb-btn-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15),
              0 2px 6px rgba(0,0,0,0.25) !important;
}

#CybotCookiebotDialogBodyButtonAccept:hover,
#CybotCookiebotDialogBodyLevelButtonAccept:hover,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll:hover {
  background: linear-gradient(
    var(--cb-btn-angle),
    var(--cb-btn-top-hover) 0%,
    var(--cb-btn-bottom-hover) 100%
  ) !important;
  border-color: var(--cb-accent-hover) !important;
}

/* Secondary buttons */
#CybotCookiebotDialogBodyButtonDecline,
#CybotCookiebotDialogBodyButtonDetails,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection {
  background: transparent !important;
  background: rgba(247, 217, 191, 0.1) !important;
  border: 1px solid var(--cb-border) !important;
  color: var(--cb-text) !important;
}

#CybotCookiebotDialogBodyButtonDecline:hover,
#CybotCookiebotDialogBodyButtonDetails:hover,
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection:hover {
  background: rgba(247, 217, 191, 0.2) !important;
  border: 1px solid var(--cb-border) !important;
}

/* Toggles */
.CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: var(--cb-toggle-off) !important;
  border-radius: 999px !important;
}

input:checked + .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: var(--cb-toggle-on) !important;
}

.CybotCookiebotDialogBodyLevelButtonSlider:before {
  background-color: #ffffff !important;
  border-radius: 50% !important;
}

/* Tabs */
#CybotCookiebotDialogNav {
  border-bottom: 1px solid var(--cb-border) !important;
}

#CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink {
  color: var(--cb-text-muted) !important;
}

#CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink.CybotCookiebotDialogActive {
  color: var(--cb-accent) !important;
  border-bottom: 2px solid var(--cb-accent) !important;
}

/* Detail cards */
#CybotCookiebotDialogBodyLevelDetailsWrapper,
#CybotCookiebotDialogDetailBodyContentCookieContainer {
  background: var(--cb-surface) !important;
  border: 1px solid var(--cb-border) !important;
  border-radius: var(--cb-radius-sm) !important;
}

/* Focus */
#CybotCookiebotDialog button:focus {
  outline: 2px solid var(--cb-accent) !important;
  outline-offset: 2px;
}

/* Mobile */
@media (max-width: 767px) {
  #CybotCookiebotDialog {
    border-radius: 12px 12px 0 0 !important;
  }

  #CybotCookiebotDialog button {
    min-height: 44px !important;
  }
}

/* Banner close button */
#CybotCookiebotBannerCloseButtonE2E {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

#CybotCookiebotBannerCloseButtonE2E svg path {
  fill: var(--cb-text) !important;
}

/* Banner custom logo */
#CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogPoweredbyImage {
  opacity: 0 !important;
}

#CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogPoweredbyLink {
  position: relative !important;
  display: inline-block !important;
  width: var(--cb-logo-width) !important;
  min-width: var(--cb-logo-width) !important;
  height: var(--cb-logo-height) !important;
  min-height: var(--cb-logo-height) !important;
  vertical-align: middle !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

#CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogPoweredbyLink::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  background: var(--cb-brand-logo) left center / contain no-repeat !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

/* Faux scrollbar */
#CybotCookiebotDialog .CybotCookiebotScrollContainer .CybotCookiebotScrollbarContainer {
  background: var(--cb-scroll-rail) !important;
  right: 0.375em !important;
  width: 0.6em !important;
  border-radius: 999px !important;
}

#CybotCookiebotDialog .CybotCookiebotScrollContainer .CybotCookiebotScrollbarContainer > div,
#CybotCookiebotDialog .CybotCookiebotScrollContainer .CybotCookiebotScrollbarTrack,
#CybotCookiebotDialog .CybotCookiebotScrollContainer .CybotCookiebotScrollbarHandle {
  background: var(--cb-scroll-thumb) !important;
  border-radius: 999px !important;
  border: 2px solid var(--cb-scroll-thumb-border) !important;
  box-sizing: border-box !important;
}

.CybotCookiebotFader {
  display: none !important;
}

/* =========================================
   Cookiebot widget / renew popup
   ========================================= */

#CookiebotWidget-widgetContent {
  background: var(--cb-bg) !important;
  color: var(--cb-text) !important;
  border: 1px solid var(--cb-border) !important;
  border-radius: var(--cb-radius) !important;
  box-shadow: var(--cb-shadow) !important;
  font-family: var(--cb-font-body) !important;
}

#CookiebotWidget .CookiebotWidget-header {
  background: transparent !important;
  border-bottom: 1px solid var(--cb-border) !important;
}

#CookiebotWidget .CookiebotWidget-header strong {
  color: var(--cb-text) !important;
  font-family: var(--cb-font-heading) !important;
  font-weight: normal !important;
  letter-spacing: 0.02em !important;
}

#CookiebotWidget .CookiebotWidget-body,
#CookiebotWidget .CookiebotWidget-body-inner,
#CookiebotWidget .CookiebotWidget-state,
#CookiebotWidget .CookiebotWidget-consents-list,
#CookiebotWidget .CookiebotWidget-consents-list li,
#CookiebotWidget .CookiebotWidget-consent-details,
#CookiebotWidget .CookiebotWidget-date,
#CookiebotWidget .CookiebotWidget-consent-id {
  color: var(--cb-text) !important;
  font-family: var(--cb-font-body) !important;
}

#CookiebotWidget .CookiebotWidget-date,
#CookiebotWidget .CookiebotWidget-consent-id {
  color: var(--cb-text-muted) !important;
}

/* Widget close button */
#CookiebotWidget .CookiebotWidget-close {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--cb-text) !important;
}

#CookiebotWidget .CookiebotWidget-close svg,
#CookiebotWidget .CookiebotWidget-close path {
  fill: var(--cb-text) !important;
}

#CookiebotWidget .CookiebotWidget-close:hover {
  opacity: 0.8 !important;
}

#CookiebotWidget .CookiebotWidget-close:focus,
#CookiebotWidget .CookiebotWidget-close:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* Consent icons */
#CookiebotWidget .Cookiebotwidget-consent-icon svg,
#CookiebotWidget .Cookiebotwidget-consent-icon path,
#CookiebotWidget li.CookiebotWidget-approved .Cookiebotwidget-consent-icon svg,
#CookiebotWidget li.CookiebotWidget-approved .Cookiebotwidget-consent-icon path {
  fill: var(--cb-accent) !important;
}

/* Show details */
#CookiebotWidget .CookiebotWidget-show-consent-details {
  background: transparent !important;
  border: 0 !important;
  color: var(--cb-accent) !important;
  font-family: var(--cb-font-body) !important;
  font-weight: 600 !important;
  padding-left: 0 !important;
}

#CookiebotWidget .CookiebotWidget-show-consent-details svg,
#CookiebotWidget .CookiebotWidget-show-consent-details path {
  fill: var(--cb-accent) !important;
}

#CookiebotWidget .CookiebotWidget-show-consent-details:hover {
  color: var(--cb-accent-hover) !important;
}

#CookiebotWidget .CookiebotWidget-show-consent-details:hover svg,
#CookiebotWidget .CookiebotWidget-show-consent-details:hover path {
  fill: var(--cb-accent-hover) !important;
}

/* Widget footer */
#CookiebotWidget-buttons {
  background: transparent !important;
  border-top: 1px solid var(--cb-border) !important;
}

#CookiebotWidget-buttons button {
  border-radius: var(--cb-radius-sm) !important;
  font-family: var(--cb-font-body) !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

/* Widget secondary button */
#CookiebotWidget-btn-withdraw {
  background: transparent !important;
  border: 1px solid var(--cb-border) !important;
  color: var(--cb-text) !important;
}

#CookiebotWidget-btn-withdraw:hover:not(:disabled) {
  background: rgba(247, 217, 191, 0.1) !important;
}

#CookiebotWidget-btn-withdraw:disabled {
  opacity: 0.55 !important;
  color: var(--cb-text) !important;
  border-color: rgba(247, 217, 191, 0.15) !important;
  background: transparent !important;
}

/* Widget primary button */
#CookiebotWidget-btn-change {
  background: linear-gradient(
    var(--cb-btn-angle),
    var(--cb-btn-top) 0%,
    var(--cb-btn-bottom) 100%
  ) !important;
  border: 1px solid var(--cb-accent) !important;
  color: var(--cb-btn-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15),
              0 2px 6px rgba(0,0,0,0.25) !important;
}

#CookiebotWidget-btn-change:hover {
  background: linear-gradient(
    var(--cb-btn-angle),
    var(--cb-btn-top-hover) 0%,
    var(--cb-btn-bottom-hover) 100%
  ) !important;
  border-color: var(--cb-accent-hover) !important;
  color: var(--cb-btn-text) !important;
}

/* Widget logo block */
#CookiebotWidget .CookiebotWidget-main-logo {
  opacity: 0.9 !important;
}

#CookiebotWidget .CookiebotWidget-main-logo svg path {
  fill: var(--cb-text) !important;
}

/* Floating launcher button */
#CookiebotWidget .CookiebotWidget-logo {
  background: var(--cb-bg) !important;
  border: 1px solid var(--cb-border) !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.25) !important;
}

#CookiebotWidget .CookiebotWidget-logo svg circle {
  fill: var(--cb-bg) !important;
}

#CookiebotWidget .CookiebotWidget-logo svg path {
  fill: var(--cb-accent) !important;
}

/* Widget focus */
#CookiebotWidget button:focus {
  outline: 2px solid var(--cb-accent) !important;
  outline-offset: 2px !important;
}

/* Widget faux scrollbar */
#CookiebotWidget .CybotCookiebotScrollbarContainer {
  background: var(--cb-scroll-rail) !important;
  border-radius: 999px !important;
}

#CookiebotWidget .CybotCookiebotScrollbarContainer > div,
#CookiebotWidget .CybotCookiebotScrollbarTrack,
#CookiebotWidget .CybotCookiebotScrollbarHandle {
  background: var(--cb-scroll-thumb) !important;
  border-radius: 999px !important;
  border: 2px solid var(--cb-scroll-thumb-border) !important;
  box-sizing: border-box !important;
}