/* Cigar Detective — age gate + boot styles (footer)
   Scoped to #cd-age-gate / #cd-boot and html.cd-* classes.
   Main Jovy restyle CSS is injected by footer.js into document.head
   so it can win over the theme stylesheet.
*/

:root {
  --cd-paper: oklch(0.965 0.012 85);
  --cd-cream: oklch(0.945 0.018 82);
  --cd-sand: oklch(0.905 0.024 82);
  --cd-ink: oklch(0.20 0.02 60);
  --cd-ink-soft: oklch(0.44 0.02 60);
  --cd-rule: oklch(0.86 0.015 75);
  --cd-blaze: oklch(0.62 0.11 145);
  --cd-blaze-soft: oklch(0.76 0.08 145);
  --cd-forest: oklch(0.30 0.07 155);
  --cd-card: #fff;
  --cd-font: "Space Grotesk", "Inter Tight", system-ui, sans-serif;
}

#cd-age-gate {
  position: fixed; inset: 0; z-index: 2147483000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  background: color-mix(in oklab, var(--cd-paper) 95%, transparent);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  font-family: var(--cd-font);
}
#cd-age-gate .cd-age-card {
  width: 100%; max-width: 28rem; border-radius: 16px;
  background: #fff; border: 1px solid var(--cd-rule); padding: 40px; text-align: center;
}
#cd-age-gate .cd-age-eyebrow {
  margin: 0; font-size: 12.5px; font-weight: 600; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--cd-ink-soft);
}
#cd-age-gate .cd-age-title {
  margin: 16px 0 0; font-size: clamp(2rem, 4.5vw, 3.5rem); line-height: 1;
  letter-spacing: -0.035em; font-weight: 600; color: var(--cd-ink);
}
#cd-age-gate .cd-age-copy { margin: 16px 0 0; font-size: 14px; line-height: 1.5; color: var(--cd-ink-soft); }
#cd-age-gate .cd-age-actions { margin-top: 32px; display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
#cd-age-gate .cd-age-yes, #cd-age-gate .cd-age-no {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 13.6px 24px; border-radius: 999px; font-family: var(--cd-font);
  font-size: 14px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
  text-decoration: none; cursor: pointer; border: 1px solid var(--cd-ink);
}
#cd-age-gate .cd-age-yes { background: var(--cd-ink); color: var(--cd-paper); }
#cd-age-gate .cd-age-yes:hover { background: var(--cd-blaze-soft); border-color: var(--cd-blaze-soft); color: var(--cd-ink); }
#cd-age-gate .cd-age-no { background: transparent; color: var(--cd-ink); }
#cd-age-gate .cd-age-no:hover { background: var(--cd-ink); color: var(--cd-paper); }
html.cd-age-locked, body.cd-age-locked { overflow: hidden !important; }

#cd-boot {
  position: fixed; inset: 0; z-index: 2147482990;
  display: flex; align-items: center; justify-content: center;
  background: oklch(0.965 0.012 85);
  font-family: "Space Grotesk", system-ui, sans-serif;
  color: oklch(0.20 0.02 60);
  transition: opacity .35s ease, visibility .35s ease;
}
#cd-boot.cd-boot-out { opacity: 0; visibility: hidden; pointer-events: none; }
.cd-boot-inner { text-align: center; }
.cd-boot-label {
  margin: 0; font-size: 13px; font-weight: 600; letter-spacing: 0.18em;
  text-transform: uppercase; color: oklch(0.20 0.02 60);
}
.cd-boot-rule {
  width: 40px; height: 2px; margin: 14px auto 0;
  background: oklch(0.62 0.11 145);
  transform-origin: center;
  animation: cd-boot-pulse 1.05s ease-in-out infinite;
}
@keyframes cd-boot-pulse {
  0%, 100% { transform: scaleX(0.45); opacity: .45; }
  50% { transform: scaleX(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .cd-boot-rule { animation: none; }
  #cd-boot { transition: none; }
}
html.cd-booting, html.cd-booting body { overflow: hidden !important; }
