/* WLK-10097 — Walks of Italy consent banner stylesheet.
   Deployed to s3://walks-ui-components/cookiebot/woi-staging.css (staging) and,
   at the production release, cookiebot/woi.css. Loaded by WalksofItaly-FrontEnd-Nuxt
   plugins/cookiebot.client.js from its CONSENT_CSS_URL build value.
   Same layout as dt.css (WLK-10098 round 2) with WOI tokens: Brand red #5E2013
   ($woi-red-main; the ticket's fallback, chosen over Gold #A08F56, which is only
   3.2:1 on white), Blackberry #212529, Open Sans text, Vollkorn buttons.
   Generated: WOI block + base.css verbatim. Edit base.css or the block,
   then run build.sh in this folder — do not hand-edit below the marker. */
#CybotCookiebotDialog {
  --consent-accent: #5E2013; /* WOI brand red ($woi-red-main) */
  --consent-optout: #212529; /* WOI Blackberry — CCPA opt-out link */
  /* WOI pages are white ($body-bg); the shared admin colour is WD's cream #FFFAED. */
  background-color: #FFFFFF !important;
  font-family: "Open Sans", sans-serif !important;
  color: #212529 !important;
}
/* Scroll faders fade in the admin cream too; on the white banner that shows as a
   cream band at the scroll edge (details panel). Same gradient, in white. */
html #CybotCookiebotDialog .CybotCookiebotFader {
  background-image: linear-gradient(to top, #FFFFFF, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0)) !important;
}
html #CybotCookiebotDialog .CybotCookiebotFader.CybotCookiebotFaderLeft {
  background-image: linear-gradient(to right, #FFFFFF, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0)) !important;
}
html #CybotCookiebotDialog .CybotCookiebotFader.CybotCookiebotFaderRight {
  background-image: linear-gradient(to left, #FFFFFF, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0)) !important;
}
#CybotCookiebotDialog h2,
#CybotCookiebotDialog #CybotCookiebotDialogBodyContentText {
  font-family: "Open Sans", sans-serif !important;
  color: #212529 !important;
}
/* Title is Open Sans Bold (ticket spec); the site serves Open Sans up to 600, so the
   browser uses that face. */
#CybotCookiebotDialog h2 {
  font-weight: 700 !important;
}
/* Allow all: Group #1 and California use BodyButtonAccept; the strict groups use LevelOptinAllowAll. */
#CybotCookiebotDialog #CybotCookiebotDialogBodyButtonAccept,
#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
  background-color: #5E2013 !important;
  border-color: #5E2013 !important;
  color: #FFFFFF !important;
  font-family: Vollkorn, serif !important;
}
/* Reject all. Never set display here: in California this is the required opt-out. */
#CybotCookiebotDialog #CybotCookiebotDialogBodyButtonDecline {
  background-color: #FFFFFF !important;
  border: 2px solid #5E2013 !important;
  color: #5E2013 !important;
  font-family: Vollkorn, serif !important;
}
/* Customise: the admin colours (shared with WD) give it a WD-green border. */
#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonCustomize {
  background-color: #FFFFFF !important;
  border-color: #212529 !important;
  color: #212529 !important;
  font-family: "Open Sans", sans-serif !important;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyEdgeMoreDetailsLink {
  color: #212529 !important;
}
/* base.css colours two WOI elements with the wrong token. Each rule below is the
   base.css selector with an `html` prefix, so it wins by one type selector.
   Customise link text is #212529 (base.css uses --consent-accent, WOI brand red):
   Group #1 desktop, and every Edge banner on mobile. */
html #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogBodyLevelButtonCustomize,
html #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyLevelButtonCustomize {
  color: #212529 !important;
}
@media (max-width: 600px) {
  /* Strict groups on mobile: Reject all text is WOI brand red (base.css uses
     --consent-optout); the Customise outline is #212529, not brand red. */
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide) {
    background-color: #FFFFFF !important;
    color: #5E2013 !important;
  }
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide) {
    border-color: #212529 !important;
  }
}
/* Details panel (after Customise): active tab, category toggles, Allow selection. */
#CybotCookiebotDialog #CybotCookiebotDialogNavList .CybotCookiebotDialogActive {
  color: #5E2013 !important;
  border-color: #5E2013 !important;
}
#CybotCookiebotDialog input:checked + .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: #5E2013 !important;
}
#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection {
  background-color: #FFFFFF !important;
  border-color: #212529 !important;
  color: #212529 !important;
  font-family: Vollkorn, serif !important;
}

/* Scrollbar mask: Cookiebot covers the native scrollbar with a strip in the admin
   background colour until hover. On the white WOI banner it showed as a cream strip
   between the text and the buttons (DT round 2, WLK-10098). Same mask, in white. */
html #CybotCookiebotDialog .CybotCookiebotScrollContainer .CybotCookiebotScrollbarContainer {
  background: #FFFFFF !important;
}
/* Edge line (DT round 2, WLK-10098): the vendor draws only a soft shadow, which reads as a faint
   grey edge against grey page sections. A solid line, every region. */
html #CybotCookiebotDialog.CybotEdge {
  border-top: 3px solid #212529 !important;
}

/* Compact EU / UK / Canada banner (DT round 2, WLK-10098; layout per WLK-10096). Scope: the
   closed strict banner only; Allow all is LevelOptinAllowAll there and nowhere else.
   The details panel drops .CybotEdge and keeps the vendor layout.
   - The logo sits on the title line, at its left and smaller, instead of its own
     column (desktop bar) or row (card and mobile).
   - Allow all, then Reject all, then Customise as a text link, stacked at every
     width. */
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll) {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}
/* Holds only the "Show details" link, which base.css hides here; its margin stays. */
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  .CybotCookiebotDialogBodyBottomWrapper {
  display: none !important;
}
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  #CybotCookiebotDialogBodyButtonsWrapper {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll,
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  #CybotCookiebotDialogBodyButtonDecline {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 10px 16px !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
  order: 1 !important;
}
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  #CybotCookiebotDialogBodyButtonDecline {
  order: 2 !important;
  background-color: #FFFFFF !important;
  border: 2px solid #5E2013 !important;
  color: #5E2013 !important;
}
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  #CybotCookiebotDialogBodyLevelButtonCustomize {
  order: 3 !important;
  display: block !important;
  align-self: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 2px 8px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #212529 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}
html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
  #CybotCookiebotDialogBodyLevelButtonCustomize .CybotCookiebotDialogArrow {
  display: none !important;
}
/* Logo on the title line, at its left, on every banner (EU / UK / CA, California, US /
   rest of world) at every width: the placement once, then the sizes per layout. */
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  .CybotCookiebotDialogContentWrapper {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  grid-template-areas: "body" "footer" !important;
  align-items: start !important;
}
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  #CybotCookiebotDialogTabContent {
  grid-area: body !important;
}
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  #CybotCookiebotDialogFooter {
  grid-area: footer !important;
}
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  #CybotCookiebotDialogHeader {
  grid-area: body !important;
  justify-self: start !important;
  align-self: start !important;
  position: relative !important;
  z-index: 1 !important;
  width: auto !important;
  min-height: 0 !important;
  margin: var(--consent-title-top, 6px) 0 0 var(--consent-title-left, 28px) !important;
  padding: 0 !important;
  border: 0 !important;
}
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  #CybotCookiebotDialogHeaderLogosWrapper {
  padding: 0 !important;
  align-items: center !important;
}
/* The admin custom-logo slot is empty for WOI; it only takes space. */
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  #CybotCookiebotDialogPoweredbyLink {
  display: none !important;
}
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  #CybotCookiebotDialogPoweredbyCybot,
html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
  #CybotCookiebotDialogPoweredbyCybot svg {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
@media (min-width: 601px) {
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogHeader,
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogHeaderLogosWrapper,
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogPoweredbyCybot,
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogPoweredbyCybot svg {
    height: 24px !important;
  }
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyContentTitle {
    padding-left: 94px !important; /* room for the logo before the title */
    line-height: 24px !important;
  }
}
@media (max-width: 600px) {
  /* Where the title sits on the California and US / RoW phone banners (the strict
     banner's values are set with its other phone rules). */
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)) {
    --consent-title-top: 29px;
    --consent-title-left: 15px;
  }
  html #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide) {
    --consent-title-top: 13px;
    --consent-title-left: 22px;
  }
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogHeader,
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogHeaderLogosWrapper {
    height: 20px !important;
  }
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogPoweredbyCybot,
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogPoweredbyCybot svg {
    height: 18px !important;
  }
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyContentTitle {
    padding-left: 74px !important; /* room for the logo before the title */
    line-height: 20px !important;
  }
}
/* Desktop: stacked like mobile (Allow all, Reject all, Customise link); the vendor
   caps the column at 286px, so it takes the width set per layout below. */
@media (min-width: 601px) {
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogBodyButtons,
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogBodyButtonsWrapper {
    width: 100% !important;
    max-width: none !important;
  }
}
/* Card (601-1279px): tighter vendor paddings around the text and the buttons. */
@media (min-width: 601px) and (max-width: 1279px) {
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll) {
    --consent-title-top: 14px;
    --consent-title-left: 15px;
  }
  /* The stacked group keeps its 360px width and sits in the middle of the card. */
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogBodyButtons,
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogBodyButtonsWrapper {
    max-width: 360px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogBodyContent {
    padding-top: 8px !important;
    padding-bottom: 4px !important;
  }
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogFooter .CybotCookiebotScrollArea {
    padding-top: 8px !important;
    padding-bottom: 4px !important;
  }
}
/* Bar (1280px and up): text | stacked buttons in one row. The selector repeats the
   shared placement's :is() so this two-column grid wins over its one-column grid. */
@media (min-width: 1280px) {
  html #CybotCookiebotDialog.CybotEdge:is(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll), :has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)), [data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)):has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    .CybotCookiebotDialogContentWrapper {
    grid-template-columns: minmax(0, 1fr) 300px !important;
    grid-template-areas: "body footer" !important;
    column-gap: 24px !important;
    align-items: start !important;
  }
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogFooter,
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogFooter .CybotCookiebotScrollArea {
    width: auto !important;
    padding: 0 !important;
  }
}
@media (max-width: 600px) {
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll) {
    --consent-title-top: 13px;
    --consent-title-left: 15px;
  }
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)
    #CybotCookiebotDialogBodyContentText {
    font-size: 14px !important;
    line-height: 1.4 !important;
  }
  /* base.css turns both secondary actions into tall outlined buttons on mobile;
     these repeat its selectors with an `html` prefix to win. */
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide) {
    margin: 0 !important;
    padding: 10px 16px !important;
    border: 2px solid #5E2013 !important;
  }
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide) {
    width: auto !important;
    margin: 0 auto !important;
    padding: 2px 8px !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 13px !important;
    text-decoration: underline !important;
  }
}

@media (min-width: 601px) and (max-width: 1279px) {
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll)),
  html #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide) {
    --consent-title-top: 30px;
    --consent-title-left: 15px;
  }
}
@media (min-width: 1280px) {
  /* California: text | buttons in one row. Group #1 keeps its link under the text. */
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll))
    .CybotCookiebotDialogContentWrapper {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "body footer" !important;
    column-gap: 24px !important;
  }
}

/* California (DT round 2, WLK-10098), never the strict banners: OK and "Do not sell or share my personal information"
   keep one line each; the buttons take the width they need instead of wrapping in
   the fixed desktop column. Mobile keeps the WLK-9920 text-link layout. */
@media (min-width: 601px) {
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll))
    #CybotCookiebotDialogBodyButtonAccept,
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll))
    #CybotCookiebotDialogBodyButtonDecline {
    white-space: nowrap !important;
  }
}
@media (min-width: 1280px) {
  /* The vendor caps the button column at 286px. */
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll))
    #CybotCookiebotDialogFooter,
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll))
    #CybotCookiebotDialogBodyButtons {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
  }
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll))
    #CybotCookiebotDialogBodyButtonAccept,
  html #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyButtonAccept):has(#CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide)):not(:has(#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll))
    #CybotCookiebotDialogBodyButtonDecline {
    width: auto !important;
    max-width: none !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* WLK-10136 — EU/UK banner as a centred modal over a backdrop, WOI only.
   The admin layout (Bar) is shared with WD and DT, so the modal is built here. The WOI
   plugin (WalksofItaly-FrontEnd-Nuxt helpers/cookiebot-modal.js) sets html.woi-cmp-modal
   and adds #woi-cmp-backdrop while an EU/UK visitor's banner is open; nothing below
   matches without that class. The rules sit in a cascade layer: an !important rule in a
   layer beats every unlayered !important rule (Cookiebot's own and the WOI rules above),
   whatever their selector weight. Sizes from the ticket: desktop <= 520px wide and
   <= 45vh high; phone (< 768px) <= 90vw and <= 35vh, text scrolls, buttons stay visible. */
@layer woi-cmp-modal {
  html.woi-cmp-modal,
  html.woi-cmp-modal body {
    overflow: hidden !important;
  }
  #woi-cmp-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483630 !important; /* one below the dialog (2147483631) */
    background: rgba(0, 0, 0, 0.45) !important;
    touch-action: none !important;
  }
  html.woi-cmp-modal #CybotCookiebotDialog {
    top: 50% !important;
    bottom: auto !important;
    left: 50% !important;
    right: auto !important;
    transform: translate(-50%, -50%) !important;
    width: calc(100vw - 32px) !important;
    max-width: 520px !important;
    min-width: 0 !important;
    inline-size: calc(100vw - 32px) !important;
    max-inline-size: 520px !important;
    min-inline-size: 0 !important;
    max-height: 45vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25) !important;
  }
  /* One column at every width: text on top, buttons under it. The text row shrinks and
     scrolls; the button row keeps its height. */
  html.woi-cmp-modal #CybotCookiebotDialog .CybotCookiebotDialogContentWrapper {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    grid-template-areas: "body" "footer" !important;
    flex: 1 1 auto !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    max-width: none !important;
  }
  html.woi-cmp-modal #CybotCookiebotDialog #CybotCookiebotDialogTabContent {
    align-self: stretch !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow-y: auto !important;
  }
  html.woi-cmp-modal #CybotCookiebotDialog #CybotCookiebotDialogFooter {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
  }
  html.woi-cmp-modal #CybotCookiebotDialog #CybotCookiebotDialogBodyButtonsWrapper {
    flex-direction: column !important;
  }
  html.woi-cmp-modal #CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll,
  html.woi-cmp-modal #CybotCookiebotDialog #CybotCookiebotDialogBodyButtonDecline {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  /* "Customise" opens the details view (Cookiebot drops .CybotEdge): the card may grow,
     and its four parts (header, tabs, content, buttons) each get a row; only the content
     row shrinks and scrolls. */
  html.woi-cmp-modal #CybotCookiebotDialog:not(.CybotEdge) {
    max-height: 80vh !important;
  }
  html.woi-cmp-modal #CybotCookiebotDialog:not(.CybotEdge) .CybotCookiebotDialogContentWrapper {
    grid-template-rows: auto auto minmax(0, 1fr) auto !important;
    grid-template-areas: none !important;
  }
  @media (max-width: 767px) {
    html.woi-cmp-modal #CybotCookiebotDialog.CybotEdge {
      width: 90vw !important;
      max-width: 90vw !important;
      inline-size: 90vw !important;
      max-inline-size: 90vw !important;
      max-height: 35vh !important;
    }
    html.woi-cmp-modal #CybotCookiebotDialog:not(.CybotEdge) {
      width: 90vw !important;
      max-width: 90vw !important;
      inline-size: 90vw !important;
      max-inline-size: 90vw !important;
    }
  }
  /* Short phones (iPhone SE class): Allow all and Reject all side by side, so some text
     still shows inside 35vh. */
  @media (max-width: 767px) and (max-height: 739px) {
    html.woi-cmp-modal #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtonsWrapper {
      flex-direction: row !important;
      flex-wrap: wrap !important;
      gap: 8px !important;
    }
    html.woi-cmp-modal #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll,
    html.woi-cmp-modal #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtonDecline {
      flex: 1 1 0 !important;
      width: auto !important;
      margin: 0 !important;
    }
    html.woi-cmp-modal #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
      order: 1 !important;
    }
    html.woi-cmp-modal #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtonDecline {
      order: 2 !important;
    }
    html.woi-cmp-modal #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyLevelButtonCustomize {
      order: 3 !important;
      flex: 1 0 100% !important;
    }
  }
}

/* ---- base.css (do not edit below; regenerate with build.sh) ---- */

/* WLK-9920 — Cookiebot mobile banner: put the accept CTA first.
   On <600px Cookiebot's own template stacks the content column (which holds
   the "Show details" accordion trigger) above the footer that holds "Allow
   all"; Clarity heatmaps show users tapping "Show details", landing in the
   category accordion and leaving. The dashboard has no control over CTA
   order, but the banner is plain light DOM in our page, so we fix it here:
   hide the top trigger and surface the footer's pre-existing (hidden)
   "Customize" button directly under "Allow all" — it opens the same details
   panel, verified on prod against the US/RoW (`leveloptin`) variant at
   390x844 and 375x667 (see brain: wd-gtm-ga4/discovery/WLK-9920--*).
   `!important` is required: Cookiebot injects its rules via
   document.adoptedStyleSheets, which sit after author stylesheets. Scoped
   to `.CybotEdge` (the bottom-bar/edge template) so the CCPA-mode variant's
   "Do not sell or share" footer is left alone until verified separately. */
@media (max-width: 600px) {
  /* Bottom-aligned sheet (ticket target: "bottom-aligned compact modal /
     sheet"). Geometry is deliberately NOT scoped to .CybotEdge: Cookiebot
     removes that class while the details panel is open, so an Edge-scoped
     rule would snap the sheet back to a centred card on open. Position is
     variant-neutral chrome; the content rules below stay Edge-scoped.
     `html` prefix outranks vendor rules that carry !important at
     id+class specificity; the logical `inline-size` pair is required
     because the vendor constrains width via max-inline-size, which
     plain max-width does not override. */
  html #CybotCookiebotDialog,
  html #CybotCookiebotDialog.CybotEdge {
    top: auto !important;
    bottom: 0 !important;
    left: 50% !important;
    right: auto !important;
    width: 100% !important;
    max-width: none !important;
    inline-size: 100% !important;
    max-inline-size: none !important;
    transform: translateX(-50%) !important;
    border-radius: 12px 12px 0 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetails {
    display: none !important;
  }
  /* De-prioritised secondary action per the ticket's target hierarchy: a
     text link, not a second button competing with "Allow all". Verified on
     prod at 390x844: 114x32 link vs the 340x58 default button; the banner
     shrinks from 57% to 54% of the viewport as a side effect. */
  #CybotCookiebotDialog.CybotEdge
    #CybotCookiebotDialogBodyLevelButtonCustomize {
    display: block !important;
    background: transparent !important;
    border: none !important;
    color: var(--consent-accent) !important;
    font-size: 12px !important; /* minimum readable size; button text is 15px */
    font-weight: 600;
    width: auto !important;
    margin: 0.25em auto 0 !important;
    padding: 0.25em 0.5em !important;
  }
  /* The button ships an arrow glyph child that pushes the label left of the
     visual centre; text-only reads centred. */
  #CybotCookiebotDialog.CybotEdge
    #CybotCookiebotDialogBodyLevelButtonCustomize
    .CybotCookiebotDialogArrow {
    display: none !important;
  }
  /* The decline button — de-emphasised, NEVER hidden.
     Cookiebot renders one element for two very different jobs, chosen by
     responseMode: in `leveloptin` (US ex-CA / RoW) it is "Deny", which the
     vendor already sets to display:none; in `optionaloptin` (the California
     CCPA group) it is "Do not sell or share my personal information", which
     California law requires to be visible.
     So this block deliberately sets NO `display`. Cosmetic properties only,
     which makes one rule correct for both: the vendor keeps "Deny" hidden,
     California keeps its opt-out link, and that link picks up the weight the
     client's mockup asks for (plain text under the accept button, no border
     box — Jira 67550).
     A previous version of this block set `display: none` here to remove a
     third action from the US/RoW sheet (Jira 67491). That was wrong: the
     rule was a no-op on US/RoW — the vendor hides "Deny" on its own — and
     its only real effect was hiding California's mandatory opt-out.
     Verified on prod 2026-08-31 by rendering both variants with this
     stylesheet blocked. */
  #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtonDecline {
    background: transparent !important;
    border: none !important;
    color: var(--consent-optout) !important;
    font-size: 12px !important;
    font-weight: 600;
    width: auto !important;
    margin: 0.25em auto 0 !important;
    padding: 0.25em 0.5em !important;
  }
}

/* WLK-10051 — implied-consent banner (Domain Group #1, US ex-California +
   Rest of World): the vendor's own "Allow all" button becomes a top-right
   close icon, the settings action is an underlined text link (under the body
   text on desktop, centred on mobile), and the mobile sheet is compact with
   no divider lines.
   Stylesheet only — no page code.

   Scope, all rules: the closed `.CybotEdge` banner on the configured Slide up
   layout, with the vendor-hidden Deny marker. California uses Bottom and has
   a visible opt-out action, so it does not match even after `renew()`. Canada
   and the EU use Inline multilevel, where Customize stays visible. A config
   change that removes either Group #1 marker fails open to the vendor style.
   Browsers without `:has()` also keep the vendor style.

   The close icon IS the accept button: same consent record as a tap on
   "Allow all" (explicit), hidden by the vendor, back on renew(). Its
   accessible name stays "Allow all", which is what it does. */
#CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogFooter,
#CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogFooter .CybotCookiebotScrollArea,
#CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogBodyButtons,
#CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogBodyButtonsWrapper {
  /* The button's positioned ancestors would be its containing block; make
     them static so the icon is placed against the dialog itself. */
  position: static !important;
}
#CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogBodyButtonAccept {
  position: absolute !important;
  top: 6px !important;
  right: 8px !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--consent-optout) !important;
  font-size: 0 !important; /* hides the "Allow all" label; the glyph below is the visual */
  line-height: 32px !important;
  text-align: center !important;
  box-shadow: none !important;
  z-index: 2 !important;
}
#CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogBodyButtonAccept::before {
  content: "\2715";
  font-size: 20px;
  font-weight: 700;
  line-height: 32px;
}
/* The vendor right-aligns its logo row; keep 48px free for the icon. */
#CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
  #CybotCookiebotDialogHeader {
  padding-right: 48px !important;
}
/* Desktop: no "Show details" trigger; the settings action is an underlined
   text link under the body text (WLK-10051 follow-up). Two vendor layouts:
   a card up to 1279px (buttons row already under the text, only
   left-aligned here) and a full-width bar from 1280px (three columns, so
   the content wrapper becomes a two-row grid with the footer under the
   text). The close icon is absolute against the dialog and does not move. */
@media (min-width: 601px) {
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyEdgeMoreDetails {
    display: none !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyButtons,
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyButtonsWrapper {
    justify-content: flex-start !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyLevelButtonCustomize {
    display: inline-block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    color: var(--consent-accent) !important;
    font-size: 13px !important;
    font-weight: 600;
    text-align: left !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyLevelButtonCustomize
    .CybotCookiebotDialogArrow {
    display: none !important;
  }
}
/* Card layout: the link under the text's left edge. */
@media (min-width: 601px) and (max-width: 1279px) {
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogFooter .CybotCookiebotScrollArea {
    padding: 0 1.125em 1em !important;
  }
}
/* Bar layout: logo | text over link. */
@media (min-width: 1280px) {
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    .CybotCookiebotDialogContentWrapper {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    grid-template-rows: auto auto !important;
    align-items: start !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogHeader {
    grid-row: 1 / span 2 !important;
    grid-column: 1 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogTabContent {
    grid-row: 1 !important;
    grid-column: 2 !important;
    padding-bottom: 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogFooter {
    grid-row: 2 !important;
    grid-column: 2 !important;
    padding: 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBody {
    padding-bottom: 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyButtons,
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyButtonsWrapper {
    padding: 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyLevelButtonCustomize {
    margin: 4px 0 0 28px !important; /* 28px = the text's own inset inside the tab content */
  }
}
/* Mobile sheet under 35% of the viewport (29.4% at 390x664 with the
   ticket's copy). Branding row kept, just smaller: a 32px row with the logo
   and the close icon on one line, both centred on the row, above the
   vendor's divider (the icon straddled that line in the first cut). */
@media (max-width: 600px) {
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogHeader {
    padding: 9px 48px 9px 16px !important;
    min-height: 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyButtonAccept {
    top: 4px !important;
    right: 12px !important;
    width: 24px !important;
    height: 24px !important;
    line-height: 24px !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyButtonAccept::before {
    font-size: 17px;
    line-height: 24px;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogHeader svg,
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogHeader img {
    height: 14px !important;
    width: auto !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyContent {
    padding: 8px 40px 0 16px !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyContentTitle {
    font-size: 15px !important;
    margin-bottom: 4px !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyContentText {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }
  /* No divider lines on the sheet (WLK-10051 follow-up). Remove only the
     border each vendor element actually draws. */
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogHeader,
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    .CybotCookiebotScrollContainer {
    border-bottom: 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogFooter {
    border-top: 0 !important;
  }
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogFooter .CybotCookiebotScrollArea {
    padding: 4px 16px 6px !important;
  }
  /* The settings action reads as a link on the phone too. */
  #CybotCookiebotDialog.CybotEdge[data-template="slideup"]:has(#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogHide)
    #CybotCookiebotDialogBodyLevelButtonCustomize {
    margin: 0 auto !important;
    padding: 2px 8px !important;
    line-height: 1.2 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
  }
}

/* WLK-10051 (follow-up) — EU + GB and Canada groups with strict consent and
   banner type "Inline multilevel". The visible Customize control is the direct
   marker for this type. Group #1 and California keep that control vendor-hidden,
   so they do not match. This scope does not depend on the chosen layout.

   Hide the duplicate desktop "Show details" trigger. On mobile, keep the
   already-visible Reject all and Customize controls as full-width outlined
   buttons under "Allow all" (Jira 67670: the reporter's example banners show
   the secondary actions as buttons, not small links), because the WLK-9920
   mobile block above turns both controls into small text links on every
   Edge banner. The buttons stay transparent so they take the banner colour
   set in the admin. A hidden Reject control stays hidden. Browsers without :has()
   keep the vendor style. */
#CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
  #CybotCookiebotDialogBodyEdgeMoreDetails {
  display: none !important;
}

@media (max-width: 600px) {
  #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyContent {
    padding-top: 8px !important;
    padding-bottom: 6px !important;
  }

  #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyContentTitle {
    margin-bottom: 6px !important;
  }

  #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogFooter .CybotCookiebotScrollArea {
    padding-top: 6px !important;
    padding-bottom: 8px !important;
  }

  #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyButtonDecline:not(.CybotCookiebotDialogHide),
  #CybotCookiebotDialog.CybotEdge:has(#CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide))
    #CybotCookiebotDialogBodyLevelButtonCustomize:not(.CybotCookiebotDialogHide) {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 4px 0 0 !important;
    padding: 18px 16px !important;
    background: transparent !important;
    border: 2px solid var(--consent-accent) !important;
    box-shadow: none !important;
    color: var(--consent-optout) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    text-decoration: none !important;
  }
}