/* Ported verbatim from the retired WordPress plugin movieads-klaro-consent
   v1.0.5 (movieads.highrockhosting.com). Loaded by
   storefront/partials/consent.blade.php. */

/* =============================================================================
   Klaro! Consent Manager — Movie Ads Custom Styles
   $body-font-family compiled to: Avenir, sans-serif
   ============================================================================= */

/* ── Banner ─────────────────────────────────────────────────────────────────── */

body .klaro .cookie-notice:not(.cookie-modal-notice) {
  background-color: #f7911e;
  border-radius: 0;
  box-shadow: none;
  padding: 20px;
  max-width: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  outline: none;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  flex-wrap: wrap;
  gap: 20px;
}

/* Title */
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body h1,
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body h2 {
  color: #252525;
  font-family: "Bebas Neue Pro", Sans-serif;
  font-size: 22px;
  margin-top: 5px;
}

/* Banner description text */
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p {
  color: #252525;
  font-family: "Helvetica", Sans-serif;
  font-size: 16px;
  font-weight: normal;
  margin: 0;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p strong {
  font-weight: bold;
  display: block;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p a {
  color: #252525;
  text-decoration: underline;
  margin-bottom: 5px;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p a:hover,
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p a:focus {
  color: #252525;
}

/* ── Banner action area ──────────────────────────────────────────────────────── */

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok {
  flex-direction: row-reverse;
}

/* ── "Customize" link ────────────────────────────────────────────────────────── */

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok a.cm-link.cn-learn-more {
  background: #fff;
  border: 2px solid #252525;
  border-radius: 0;
  color: #252525;
  font-family: "Helvetica", Sans-serif;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-transform: uppercase;
  padding: 10px 20px;
  text-decoration: none;
  display: inline-block;
  transition: background-color 0.2s, color 0.2s;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok a.cm-link.cn-learn-more:hover,
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok a.cm-link.cn-learn-more:focus {
  color: #00A9FF;
  border: 2px solid #00A9FF;
}

/* ── Decline + Accept buttons ────────────────────────────────────────────────── */

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok .cn-buttons {
  display: flex;
  flex-direction: row-reverse;
  flex-shrink: 0;
  margin: 0;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok .cn-buttons .cm-btn {
  background: #f7911e;
  border: 2px solid #fff;
  color: #252525;
  font-family: "Helvetica", Sans-serif;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-transform: uppercase;
  padding: 10px 20px;
  box-shadow: none;
  text-shadow: none;
  border-radius: 0;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok .cn-buttons .cm-btn:hover,
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok .cn-buttons .cm-btn:focus {
  background-color: #fff;
  border: 2px solid #00A9FF;
  color: #00A9FF;
}

/* Accept button (dark blue) */
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok .cn-buttons .cm-btn-success {
  background-color: #00A9FF;
  border: 2px solid #00A9FF;
}

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok .cn-buttons .cm-btn-success:hover,
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok .cn-buttons .cm-btn-success:focus {
  background-color: #fff;
  border: 2px solid #00A9FF;
  color: #00A9FF;
}

/* ── Banner title (Klaro v0.7 doesn't render a title element in the notice) ── */
/* Injected via CSS ::before so no JS needed                                    */

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body::before {
  content: 'Cookie & Data Preferences';
  display: block;
  color: #252525;
  font-family: "Helvetica", Sans-serif;
  font-size: 22px;
  font-weight: bold;
  margin-top: 5px;
  margin-bottom: 0;
  width: 100%;
}

/* ── Spacing above the "Strictly necessary" line inside the description ──────── */
/* The second <p> tag inside the description span gets top margin               */

body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p span p {
  margin-top: 10px;
}