/* HL Countdown styles (vars kan endres raskt) */
.countdown-wrap-in-container {
  --card-bg: #121a2b;   /* Kort-bakgrunn */
  --card-fg: #ffffff;   /* Tekstfarge */
  --accent:  #5da9ff;   /* Knapp/aksent */
  --muted:   #9fb0d3;   /* Sekundær tekst */
  --alpha:   0.85;      /* Gjennomsiktighet */
  --radius:  14px;
  --shadow:  0 10px 22px rgba(0,0,0,.18);
}

.countdown-card {
  background: rgba(18, 26, 43, var(--alpha));
  color: var(--card-fg);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  backdrop-filter: blur(6px);
  padding: 12px 16px;
  position: sticky; top: 12px; z-index: 2;
}

body.admin-bar .countdown-card { top: 58px; }
@media (max-width: 782px) { body.admin-bar .countdown-card { top: 70px; } }

.countdown-heading {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 6px;
}
.countdown-heading h2 {
  margin: 0;
  font-size: clamp(18px, 2.2vw, 22px);
  font-weight: 800;
  color: var(--card-fg);
}
.countdown-subtitle {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.cta-btn {
  background: var(--accent); color: #fff; font-weight: 700;
  padding: 8px 14px; border-radius: 8px; text-decoration: none; white-space: nowrap;
  transition: filter .2s ease;
}
.cta-btn:hover { filter: brightness(.92); }

.countdown-timer { display: flex; justify-content: center; align-items: center; gap: 10px; }
.timebox {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px; padding: 8px 10px; min-width: 60px; text-align: center;
}
.num { font-size: clamp(22px, 5vw, 34px); font-weight: 800; line-height: 1; color: var(--card-fg); }
.lbl { font-size: 11px; color: var(--muted); text-transform: uppercase; }
.sep { font-size: 22px; color: var(--card-fg); opacity: .6; }
.countdown-note { margin: 6px 2px 0; font-size: 12px; color: var(--muted); text-align: center; }

.countdown-readmore { text-align:center; margin: 8px 0 0; }
.countdown-readmore a { color: var(--accent); text-decoration: underline; }
