/* ===== Countdown aislado (prefijo ukx-) ===== */

:root {
  --ukx-bg: #ffffff;
  --ukx-fg: #0b0b0c;
  --ukx-muted: #6b7280;
  --ukx-border: #e5e7eb;
  --ukx-ring: #0a84ff;
  --ukx-shadow: 0 6px 24px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.06);
  --ukx-card: #0f0f10;
  --ukx-radius: 18px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --ukx-bg: #0b0b0c;
    --ukx-fg: #f5f5f7;
    --ukx-muted: #9ca3af;
    --ukx-border: #262628;
    --ukx-shadow: 0 8px 30px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.25);
    --ukx-card: #151517;
  }
}

/* contenedor del componente (opcional 80%) */

.ukx-countdown {
  width: 80%;
  max-width: 740px;
  margin-inline: auto;
}

/* fila de bloques */

.ukx-cd-row {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 14px;
}

/* bloque (horas/min/seg) */

.ukx-cd-box {
  background: var(--ukx-card);
  color: var(--ukx-fg);
  border: 1px solid var(--ukx-border);
  border-radius: var(--ukx-radius);
  box-shadow: var(--ukx-shadow);
  padding: 16px 18px;
  min-width: 120px;
  text-align: center;
}

.ukx-cd-num {
  font: 700 2.25rem/1 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  letter-spacing: .5px;
}

.ukx-cd-label {
  display: block;
  margin-top: 6px;
  font-size: .8rem;
  color: var(--ukx-muted);
  letter-spacing: .2px;
}

/* separador ":" */

.ukx-cd-sep {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ukx-muted);
  font: 700 2rem/1 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial;
  padding: 0 2px;
  user-select: none;
}

/* responsivo */

@media (max-width:600px) {
  .ukx-cd-box {
    min-width: 92px;
    padding: 14px 12px;
  }
}

@media (max-width:600px) {
  .ukx-cd-num {
    font-size: 1.8rem;
  }
}

@media (max-width:600px) {
  .ukx-cd-sep {
    font-size: 1.8rem;
  }
}