/* ---------- [ CookieInfo ] ---------- */

/*!
 * Cookie law banner — layout rewritten 2026-07.
 *
 * Previous versions gave the banner a viewport-percentage height (40% / 50% /
 * 60% / 80%) that was unrelated to its content, so a ~110px message painted a
 * ~650px opaque block over the page on mobile. The banner is now sized by its
 * own content and clamped with max-height instead.
 *
 * Structure notes:
 * - #jquery-cookie-law-script is only the fixed positioner and must stay a
 *   block-level element: jQuery slideDown()/slideUp() forces display:block on
 *   it, which would silently kill a display:flex declared here.
 * - The visible card is #cookie-law-container-box; the positioner is
 *   transparent and click-through, so the page stays usable around the card.
 * - .top / .bottom mirror the STORE_COOKIE_POSITION setting and are both
 *   declared explicitly.
 */

#jquery-cookie-law-script,
#jquery-cookie-law-script * {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
}

#jquery-cookie-law-script {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999999;
  display: none;
  width: 100%;
  background: transparent;
  color: #F1F1F3;
  font-family: Lato, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 14px;
  padding: 12px;
  padding-left: calc(12px + env(safe-area-inset-left, 0px));
  padding-right: calc(12px + env(safe-area-inset-right, 0px));
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  pointer-events: none;
}

#jquery-cookie-law-script.bottom {
  top: auto;
  bottom: 0;
}

#jquery-cookie-law-script.top {
  top: 0;
  bottom: auto;
  padding-top: calc(12px + env(safe-area-inset-top, 0px));
  padding-bottom: 12px;
}

#jquery-cookie-law-script.absolute {
  position: absolute;
}

#jquery-cookie-law-script.light {
  color: #1a1a1a;
}

/* Opt-in dimming layer. Not enabled by default: the card is separated from the
   page by its border and shadow, not by darkening the store behind it. Add the
   class to the wrapper to switch it on. It never swallows clicks. */
#jquery-cookie-law-script.with-scrim::before {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: rgba(20, 20, 19, 0.30);
  pointer-events: none;
}

/* ---------- Card ---------- */

#jquery-cookie-law-script #cookie-law-container-box {
  pointer-events: auto;
  max-width: 1120px;
  margin: 0 auto;
  background: #202226;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 12px;
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.35);
}

#jquery-cookie-law-script.light #cookie-law-container-box {
  background: #F9FAFC;
  border-color: rgba(0, 0, 0, 0.12);
}

#jquery-cookie-law-script #cookie-law-container {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 6px 20px 18px;
}

/* ---------- Message ---------- */

#jquery-cookie-law-script #cookie-law-message {
  float: none;
  width: auto;
  max-height: 320px;
  max-height: min(42dvh, 320px);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  font-size: 14px;
  line-height: 1.5;
  text-align: left;
}

#jquery-cookie-law-script a {
  color: #7FB6EA;
}

#jquery-cookie-law-script.light a {
  color: #2F6EA8;
}

#jquery-cookie-law-script #cookie-law-message a {
  text-decoration: underline;
}

/* ---------- Actions ---------- */

#jquery-cookie-law-script #cookie-law-action {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
}

#jquery-cookie-law-script a.cookie-law-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin: 0;
  padding: 10px 20px;
  border-radius: 8px;
  background-color: #3B89C7;
  color: #ffffff;
  font-size: 14px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  cursor: pointer;
  -webkit-transition: background-color 0.2s;
  transition: background-color 0.2s;
}

#jquery-cookie-law-script a.cookie-law-button:hover,
#jquery-cookie-law-script a.cookie-law-button:focus {
  background-color: #3176AF;
  color: #ffffff;
}

#jquery-cookie-law-script a#cookie-law-button-more {
  background: #7B8A8B;
}

#jquery-cookie-law-script a#cookie-law-button-more:hover,
#jquery-cookie-law-script a#cookie-law-button-more:focus {
  background: #697677;
}

/* ---------- Close ---------- */

#jquery-cookie-law-script .close-modal-cookie-law {
  align-self: flex-end;
  line-height: 0;
}

#jquery-cookie-law-script a#cookie-law-button-not {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  background: transparent;
  color: inherit;
  font-size: 18px;
}

#jquery-cookie-law-script a#cookie-law-button-not:hover,
#jquery-cookie-law-script a#cookie-law-button-not:focus {
  background: rgba(255, 255, 255, 0.10);
}

#jquery-cookie-law-script.light a#cookie-law-button-not:hover,
#jquery-cookie-law-script.light a#cookie-law-button-not:focus {
  background: rgba(0, 0, 0, 0.06);
}

/* Kept in the DOM because the consent script binds it, never rendered. */
#jquery-cookie-law-script a#cookie-law-button-not1 {
  display: none;
}

/* ---------- Small screens ---------- */

@media (max-width: 600px) {
  #jquery-cookie-law-script {
    padding: 8px;
    padding-left: calc(8px + env(safe-area-inset-left, 0px));
    padding-right: calc(8px + env(safe-area-inset-right, 0px));
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  }

  #jquery-cookie-law-script.top {
    padding-top: calc(8px + env(safe-area-inset-top, 0px));
    padding-bottom: 8px;
  }

  #jquery-cookie-law-script #cookie-law-container {
    padding: 4px 14px 14px;
  }

  #jquery-cookie-law-script #cookie-law-message {
    font-size: 13px;
    max-height: 240px;
    max-height: min(38dvh, 240px);
  }

  #jquery-cookie-law-script #cookie-law-action {
    flex-direction: column;
    align-items: stretch;
  }

  #jquery-cookie-law-script a.cookie-law-button {
    width: 100%;
  }
}