/* Celina Chapter 2 — Osano CMP theme overrides
 * Supported visual overrides on Osano's stable .osano-cm-* classes only.
 * Consent semantics, DOM order, focus management, and drawer behavior remain Osano-owned.
 *
 * Osano injects its stylesheet at runtime AFTER this file, and some of its rules
 * carry !important — an equal-specificity tie then goes to Osano. Every selector
 * here is therefore prefixed (html + .osano-cm-window ancestor) so this theme wins
 * those ties on specificity, not order. */

html .osano-cm-window{
  --chapter2-cmp-bg:#0f0d0b;
  --chapter2-cmp-panel:#171310;
  --chapter2-cmp-cream:#f4f0e8;
  --chapter2-cmp-muted:#c9c5bf;
  --chapter2-cmp-gold:#bda77d;
  --chapter2-cmp-focus:#f3dca8;
  color:var(--chapter2-cmp-cream)!important;
  font-family:Arial,Helvetica,sans-serif!important;
}

/* ---------- Dialogs (every variant gets the ink panel treatment) ---------- */
html .osano-cm-window .osano-cm-dialog{
  background:rgba(15,13,11,.97)!important;
  color:var(--chapter2-cmp-cream)!important;
  border:1px solid rgba(189,167,125,.42)!important;
  border-radius:2px!important;
  box-shadow:0 24px 60px rgba(0,0,0,.5)!important;
}
html .osano-cm-window .osano-cm-dialog .osano-cm-message{
  color:var(--chapter2-cmp-muted)!important;
  font-size:14px!important;
  line-height:1.55!important;
}
/* Kicker above the banner copy, echoing the site's numbered section kickers. */
html .osano-cm-window .osano-cm-dialog .osano-cm-content:before{
  content:'Privacy & cookies';
  display:block;
  margin:0 0 7px;
  font:700 9px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--chapter2-cmp-gold);
}
html .osano-cm-window .osano-cm-dialog--type_box{
  width:min(420px,calc(100vw - 32px))!important;
  max-width:calc(100vw - 32px)!important;
  padding:22px!important;
}
html .osano-cm-window .osano-cm-dialog--type_bar{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  box-sizing:border-box!important;
  width:100vw!important;
  max-width:100vw!important;
  top:auto!important;
  bottom:max(0px,calc(100% - 100vh))!important;
  min-height:0!important;
  max-height:min(70vh,440px)!important;
  padding:18px max(64px,3.5vw) max(18px,env(safe-area-inset-bottom)) max(28px,3.5vw)!important;
  overflow-y:auto!important;
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px 32px!important;
  background:rgba(15,13,11,.96)!important;
  backdrop-filter:blur(14px)!important;
  color:var(--chapter2-cmp-cream)!important;
  border:0!important;
  border-top:1px solid rgba(189,167,125,.5)!important;
  border-radius:0!important;
  box-shadow:0 -18px 50px rgba(0,0,0,.38)!important;
}
html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-content{
  flex:1 1 380px!important;
  min-width:min(100%,260px)!important;
  max-width:820px!important;
  margin:0!important;
  padding:0!important;
  color:var(--chapter2-cmp-muted)!important;
  font-size:14px!important;
  line-height:1.55!important;
}
/* Osano stacks the action buttons in a tall column by default; keep them on one
 * tidy row beside the copy (the mobile query below regrids them full-width). */
html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-buttons{
  position:static!important;
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  align-self:center!important;
  justify-content:flex-end!important;
  width:auto!important;
  max-width:100%!important;
  margin:0 0 0 auto!important;
  gap:10px!important;
  padding:0!important;
  z-index:1!important;
}
html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-button{
  margin:0!important;
  width:auto!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
/* The display overrides above must never outrank Osano's own dismissal state. */
html .osano-cm-window .osano-cm-dialog--hidden,
html .osano-cm-widget--hidden{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* ---------- Buttons ---------- */
html .osano-cm-window .osano-cm-button{
  min-height:44px!important;
  padding:11px 18px!important;
  border:1px solid var(--chapter2-cmp-cream)!important;
  border-radius:0!important;
  background:var(--chapter2-cmp-cream)!important;
  color:#0a0908!important;
  font:600 10px/1.2 Arial,Helvetica,sans-serif!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  box-shadow:none!important;
}
html .osano-cm-window .osano-cm-button:hover{
  background:#fffaf0!important;
  color:#0a0908!important;
}
/* Accept/save stay solid cream; deny and manage read as quiet outlined actions. */
html .osano-cm-window .osano-cm-deny,
html .osano-cm-window .osano-cm-denyAll,
html .osano-cm-window .osano-cm-manage{
  background:transparent!important;
  color:var(--chapter2-cmp-cream)!important;
  border-color:rgba(244,240,232,.55)!important;
}
html .osano-cm-window .osano-cm-deny:hover,
html .osano-cm-window .osano-cm-denyAll:hover,
html .osano-cm-window .osano-cm-manage:hover{
  background:rgba(244,240,232,.1)!important;
  color:var(--chapter2-cmp-cream)!important;
  border-color:var(--chapter2-cmp-cream)!important;
}

/* ---------- Links ---------- */
html .osano-cm-window .osano-cm-link,
html .osano-cm-window .osano-cm-disclosure__toggle{
  color:var(--chapter2-cmp-gold)!important;
  text-decoration-color:currentColor!important;
  text-underline-offset:3px!important;
}
html .osano-cm-window .osano-cm-link:hover,
html .osano-cm-window .osano-cm-disclosure__toggle:hover{
  color:var(--chapter2-cmp-cream)!important;
}

/* ---------- Close controls ---------- */
html .osano-cm-window .osano-cm-close{
  box-sizing:border-box!important;
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(244,240,232,.4)!important;
  border-radius:50%!important;
  background:rgba(15,13,11,.9)!important;
  color:var(--chapter2-cmp-cream)!important;
  opacity:1!important;
  font-size:15px!important;
  line-height:1!important;
}
html .osano-cm-window .osano-cm-close:hover{
  border-color:var(--chapter2-cmp-cream)!important;
  background:var(--chapter2-cmp-panel)!important;
}
/* The glyph may be text or an inline SVG with hardcoded strokes — force both visible. */
html .osano-cm-window .osano-cm-close svg{
  width:14px!important;
  height:14px!important;
  stroke:currentColor!important;
  fill:none!important;
}
html .osano-cm-window .osano-cm-close svg *{
  stroke:currentColor!important;
  fill:none!important;
}
html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-dialog__close{
  position:absolute!important;
  top:10px!important;
  right:10px!important;
}

/* ---------- Preferences drawer ---------- */
html .osano-cm-window .osano-cm-info-dialog{
  background:rgba(10,9,8,.74)!important;
  backdrop-filter:blur(4px)!important;
}
/* Size the drawer against the dynamic viewport and make the view the scroll
 * region — with plain 100vh, mobile Chrome's URL bar covers the drawer's
 * bottom edge and hides the sticky save button. */
html .osano-cm-window .osano-cm-info{
  position:fixed!important;
  top:0!important;
  right:0!important;
  height:100vh!important;
  height:100dvh!important;
  max-height:100vh!important;
  max-height:100dvh!important;
  display:flex!important;
  flex-direction:column!important;
  width:min(440px,100vw)!important;
  max-width:100vw!important;
  background:var(--chapter2-cmp-bg)!important;
  color:var(--chapter2-cmp-cream)!important;
  border-left:1px solid rgba(189,167,125,.55)!important;
  box-shadow:-22px 0 60px rgba(0,0,0,.42)!important;
  overscroll-behavior:contain!important;
  padding-bottom:env(safe-area-inset-bottom)!important;
}
html .osano-cm-window .osano-cm-info .osano-cm-info-dialog-header{flex:0 0 auto!important}
html .osano-cm-window .osano-cm-info .osano-cm-view{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
}
html .osano-cm-window .osano-cm-info-dialog-header{
  box-sizing:border-box!important;
  height:64px!important;
  min-height:64px!important;
  padding:10px 12px 10px 20px!important;
  background:rgba(15,13,11,.98)!important;
  border-bottom:1px solid rgba(189,167,125,.3)!important;
}
html .osano-cm-window .osano-cm-info-dialog-header__header{
  color:var(--chapter2-cmp-cream)!important;
  font:400 24px/1.1 Georgia,'Times New Roman',serif!important;
  letter-spacing:-.02em!important;
}
html .osano-cm-window .osano-cm-info-dialog-header__close{
  margin-left:12px!important;
}
html .osano-cm-window .osano-cm-view{
  padding:20px 22px max(22px,env(safe-area-inset-bottom))!important;
  color:var(--chapter2-cmp-muted)!important;
  font-size:13.5px!important;
  line-height:1.5!important;
}
html .osano-cm-window .osano-cm-list-item{
  padding:12px 0!important;
  border-top:1px solid rgba(244,240,232,.15)!important;
}
html .osano-cm-window .osano-cm-list-item:first-child{border-top:0!important}
html .osano-cm-window .osano-cm-label{
  color:var(--chapter2-cmp-cream)!important;
  font:600 11px/1.35 Arial,Helvetica,sans-serif!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
}
html .osano-cm-window .osano-cm-description{
  color:var(--chapter2-cmp-muted)!important;
  font-size:13px!important;
  line-height:1.45!important;
  margin-top:6px!important;
}
html .osano-cm-window .osano-cm-view__description{
  font-size:13.5px!important;
  line-height:1.5!important;
}
html .osano-cm-window .osano-cm-list-item__toggle{
  min-height:44px!important;
  align-items:center!important;
}
html .osano-cm-window .osano-cm-disclosure{
  min-height:36px!important;
  margin-top:8px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
}
html .osano-cm-window .osano-cm-disclosure__toggle{
  min-height:36px!important;
  display:inline-flex!important;
  align-items:center!important;
  font-size:12px!important;
  font-weight:600!important;
  letter-spacing:.02em!important;
}

/* ---------- Toggles ----------
 * Osano positions its own knob pseudo-element (and moves it on input:checked),
 * so any styling layered on that knob drifts. Remove both pseudo-elements and
 * paint the knob deterministically as a background gradient on the track.
 * Checked state is matched three ways (state class, sibling input, :has) so it
 * works whatever the real DOM structure is. */
html .osano-cm-window .osano-cm-switch::before,
html .osano-cm-window .osano-cm-switch::after{
  content:none!important;
  display:none!important;
}
html .osano-cm-window .osano-cm-switch{
  position:relative!important;
  box-sizing:border-box!important;
  display:inline-block!important;
  width:46px!important;
  min-width:46px!important;
  flex:0 0 46px!important;
  height:24px!important;
  border:1px solid rgba(244,240,232,.45)!important;
  border-radius:24px!important;
  background-color:#3a322c!important;
  background-image:radial-gradient(circle 9px at 12px 50%,var(--chapter2-cmp-cream) 96%,rgba(244,240,232,0) 100%)!important;
  background-repeat:no-repeat!important;
  background-size:100% 100%!important;
  opacity:1!important;
}
html .osano-cm-window .osano-cm-toggle--checked .osano-cm-switch,
html .osano-cm-window .osano-cm-toggle__input:checked~.osano-cm-switch,
html .osano-cm-window .osano-cm-toggle:has(.osano-cm-toggle__input:checked) .osano-cm-switch{
  border-color:var(--chapter2-cmp-gold)!important;
  background-color:#8f1823!important;
  background-image:radial-gradient(circle 9px at calc(100% - 12px) 50%,var(--chapter2-cmp-cream) 96%,rgba(244,240,232,0) 100%)!important;
}
html .osano-cm-window .osano-cm-toggle--disabled .osano-cm-switch,
html .osano-cm-window .osano-cm-toggle__input:disabled~.osano-cm-switch,
html .osano-cm-window .osano-cm-toggle:has(.osano-cm-toggle__input:disabled) .osano-cm-switch{
  border-color:rgba(244,240,232,.5)!important;
  background-color:#5d5144!important;
  opacity:1!important;
}

/* ---------- Focus, sticky save, powered-by ---------- */
html .osano-cm-window :focus-visible{
  outline:3px solid var(--chapter2-cmp-focus)!important;
  outline-offset:3px!important;
}
html .osano-cm-window .osano-cm-view__button{
  box-sizing:border-box!important;
  width:100%!important;
  height:48px!important;
  min-height:48px!important;
  position:sticky!important;
  bottom:max(10px,env(safe-area-inset-bottom))!important;
  z-index:4!important;
  margin-top:16px!important;
  margin-bottom:max(10px,env(safe-area-inset-bottom))!important;
  box-shadow:0 -16px 30px 12px var(--chapter2-cmp-bg)!important;
}
html .osano-cm-window .osano-cm-powered-by{color:var(--chapter2-cmp-muted)!important}
html .osano-cm-window .osano-cm-powered-by__link{color:var(--chapter2-cmp-muted)!important}

/* ---------- Floating widget ----------
 * Osano positions the widget with `left` and ships its own blue SVG. Pin it
 * bottom-right and replace the artwork with a deterministic drawn icon. */
html .osano-cm-window .osano-cm-widget,
html .osano-cm-widget{
  left:auto!important;
  right:16px!important;
  top:auto!important;
  bottom:max(16px,env(safe-area-inset-bottom))!important;
  width:44px!important;
  height:44px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  transform:none!important;
  background-color:rgba(15,13,11,.94)!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='10.5' fill='none' stroke='%23f4f0e8' stroke-width='1.6'/%3E%3Ccircle cx='16' cy='11.5' r='1.9' fill='%23bda77d'/%3E%3Ccircle cx='12' cy='19' r='1.9' fill='%23bda77d'/%3E%3Ccircle cx='20' cy='19' r='1.9' fill='%23bda77d'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:30px 30px!important;
  border:1px solid rgba(189,167,125,.55)!important;
  border-radius:50%!important;
  box-shadow:0 6px 22px rgba(0,0,0,.45)!important;
  color:var(--chapter2-cmp-cream)!important;
}
html .osano-cm-widget:hover{border-color:var(--chapter2-cmp-cream)!important}
html .osano-cm-widget svg{display:none!important}
html .osano-cm-dialog:not(.osano-cm-dialog--hidden)~.osano-cm-widget,
html .osano-cm-window:has(.osano-cm-dialog:not(.osano-cm-dialog--hidden)) .osano-cm-widget{
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* ---------- Mobile ---------- */
@media(max-width:620px){
  html .osano-cm-window .osano-cm-dialog--type_bar{
    max-height:min(52vh,460px)!important;
    padding:10px 18px max(12px,env(safe-area-inset-bottom))!important;
  }
  html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-content{
    max-width:52ch!important;
    padding:0 50px 0 0!important;
    font-size:12px!important;
    line-height:1.42!important;
  }
  html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-storage-policy{display:inline!important}
  html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-buttons{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(104px,1fr))!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:10px 0 0!important;
    gap:7px!important;
  }
  html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-button{
    width:100%!important;
    max-width:100%!important;
    min-height:44px!important;
    padding:9px 6px!important;
    font-size:10px!important;
    letter-spacing:.08em!important;
    white-space:normal!important;
  }
  html .osano-cm-window .osano-cm-dialog--type_bar .osano-cm-dialog__close{top:10px!important;right:12px!important}
  html .osano-cm-window .osano-cm-info{
    width:100vw!important;
    border-left:0!important;
  }
  html .osano-cm-window .osano-cm-info-dialog-header{padding-left:20px!important}
  html .osano-cm-window .osano-cm-info-dialog-header__header{font-size:22px!important}
  html .osano-cm-window .osano-cm-info-dialog-header__close{margin-left:8px!important}
  html .osano-cm-window .osano-cm-view{padding:18px 18px max(24px,env(safe-area-inset-bottom))!important}
}