.hfa-countdown {
  font-size: 1.2em;
  font-weight: bold;
  margin: 10px 0;
  color: #e63946;
}
.hfa-expired {
  color: #999;
  font-style: italic;
}
/* Standaard layout (klassiek) */
.hfa-countdown-default { background: #fffbe6; border-radius: 7px; padding: 16px 18px; border: 1px solid #f3e9ae; color: #222; font-size: 1.2em; margin-bottom: 14px; }

/* Modern layout (badges/blokken) */
.hfa-countdown-modern { background: linear-gradient(90deg, #ffecd2 0%, #fcb69f 100%); border-radius: 10px; box-shadow: 0 2px 8px #0001; padding: 18px 20px; display: flex; gap: 18px; font-size: 1.3em; align-items: center; }
.hfa-countdown-modern span { background: #fff; color: #fc6a37; border-radius: 5px; padding: 8px 16px; margin-right: 6px; font-weight: 600; box-shadow: 0 1px 4px #0001; }

/* Compact layout (strak, geen labels) */
.hfa-countdown-compact { background: #fafaff; border: 1px solid #d7e4f5; border-radius: 4px; padding: 8px 14px; color: #345; font-size: 1em; display: inline-block; margin-bottom: 10px; }
.hfa-countdown-compact span { font-size: 1.1em; padding: 0 4px; }

/* Nieuwe stijlen voor Elementor Widget */
.hfa-countdown-wrapper {
  display: flex;
  text-align: center;
}
.hfa-countdown-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.hfa-countdown-digits {
  font-weight: bold;
}
.hfa-countdown-label {
  font-size: 0.8em;
  margin-top: 5px;
}
.hfa-countdown-placeholder {
    background: #f1f1f1;
    border: 2px dashed #ccc;
    padding: 20px;
    text-align: center;
    color: #666;
}