/* ============================================================================
   EAA shared deadline timer — sticky bottom pill (NO buy button)
   Drop-in for any static page. Pair with /assets/deadline-timer.js.
   Styles are namespaced under #cdt-* so they can't collide with a page.
   Look matches the WordPress countdown pill Alex used on the old pages.
   ============================================================================ */

#cdt-pill{
  position:fixed;
  bottom:16px;
  left:50%;
  transform:translateX(-50%);
  z-index:999999;
  width:calc(100% - 24px);
  max-width:440px;
  background:#C49258;
  border:2px solid #c0440a;
  border-radius:12px;
  padding:10px 14px;
  box-shadow:0 6px 28px rgba(92,31,138,.45),0 2px 8px rgba(0,0,0,.18);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  font-family:'Georgia',serif;
  box-sizing:border-box;
}

#cdt-label{
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#000;
  font-family:'Georgia',serif;
  font-style:italic;
  opacity:.85;
  display:none;
  white-space:nowrap;
}

/* Reveal-on-scroll: start hidden, fade+rise in once the page is scrolled, so
   the pill doesn't clutter the above-the-fold view. Toggled by the JS with the
   .cdt-in class. The X translate keeps the pill centred (base uses -50%). */
#cdt-pill.cdt-reveal{
  opacity:0;
  visibility:hidden;
  transform:translateX(-50%) translateY(16px);
  transition:opacity .28s ease,transform .28s ease,visibility .28s;
}
#cdt-pill.cdt-reveal.cdt-in{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(0);
}
@media (prefers-reduced-motion:reduce){
  #cdt-pill.cdt-reveal{transition:opacity .28s ease,visibility .28s;transform:translateX(-50%)}
  #cdt-pill.cdt-reveal.cdt-in{transform:translateX(-50%)}
}

#cdt-grid{display:flex;align-items:center;gap:4px}

.cdt-unit{display:flex;flex-direction:column;align-items:center;gap:3px}

.cdt-num{
  background:#fdf8f2;
  border:1.5px solid rgba(192,68,10,.4);
  border-radius:6px;
  min-width:38px;
  padding:6px 4px;
  text-align:center;
  font-family:'Georgia',serif;
  font-size:22px;
  font-weight:700;
  color:#3a1060;
  line-height:1;
  transition:color .15s;
}

.cdt-unit-label{
  font-size:8px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#f2ece0;
  opacity:.75;
  font-family:'Georgia',serif;
}

.cdt-colon{
  font-size:20px;
  font-weight:700;
  color:#c0440a;
  margin-bottom:10px;
  line-height:1;
  font-family:'Georgia',serif;
}

.cdt-flash{color:#c0440a !important}

#cdt-expired{
  display:none;
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#f2ece0;
  font-family:'Georgia',serif;
  font-style:italic;
  text-align:center;
  padding:4px 0;
}

/* 361px+: show the label */
@media (min-width:361px){
  #cdt-label{display:block}
  #cdt-pill{gap:4px}
}

/* 541px+: larger numbers, more padding */
@media (min-width:541px){
  #cdt-pill{padding:12px 22px;gap:6px}
  .cdt-num{font-size:28px;min-width:48px;padding:8px 6px}
  .cdt-colon{font-size:26px;margin-bottom:14px}
  #cdt-label{font-size:11px}
  .cdt-unit-label{font-size:9px}
}