.nixfubu-countdown {
  --nixfubu-countdown-bg: #0f172a;
  --nixfubu-countdown-text: #ffffff;
  --nixfubu-countdown-accent: #EA461E;
  --nixfubu-countdown-panel: #ffffff;
  --nixfubu-countdown-panel-text: #111827;
  --nixfubu-countdown-overlay: #000000;
  --nixfubu-countdown-overlay-opacity: .25;
  --nixfubu-countdown-py: 36px;
  --nixfubu-countdown-px: 36px;
  --nixfubu-countdown-gap: 18px;
  --nixfubu-countdown-radius: 24px;
  width: min(100%, 1200px);
  margin: 0 auto;
}

.nixfubu-countdown.is-fullwidth {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.nixfubu-countdown__surface {
  position: relative;
  overflow: hidden;
  border-radius: var(--nixfubu-countdown-radius);
  background: var(--nixfubu-countdown-bg);
  background-size: cover;
  background-position: center;
  color: var(--nixfubu-countdown-text);
}

.nixfubu-countdown.is-fullwidth .nixfubu-countdown__surface {
  border-radius: 0;
}

.nixfubu-countdown__overlay {
  position: absolute;
  inset: 0;
  background: var(--nixfubu-countdown-overlay);
  opacity: var(--nixfubu-countdown-overlay-opacity);
}

.nixfubu-countdown__inner {
  position: relative;
  z-index: 1;
  padding: var(--nixfubu-countdown-py) var(--nixfubu-countdown-px);
  text-align: center;
}

.nixfubu-countdown__heading {
  margin: 0 0 8px;
  color: var(--nixfubu-countdown-text);
  font: 700 clamp(28px, 3.2vw, 52px)/1.05 "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.nixfubu-countdown__subheading {
  margin: 0 0 24px;
  color: color-mix(in srgb, var(--nixfubu-countdown-text) 82%, transparent);
  font: 500 18px/1.4 "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.nixfubu-countdown__timer {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--nixfubu-countdown-gap);
}

.nixfubu-countdown__unit {
  min-width: 0;
}

.nixfubu-countdown--boxed .nixfubu-countdown__unit {
  padding: 22px 12px;
  border-radius: calc(var(--nixfubu-countdown-radius) - 8px);
  background: var(--nixfubu-countdown-panel);
  color: var(--nixfubu-countdown-panel-text);
}

.nixfubu-countdown--pill .nixfubu-countdown__unit {
  padding: 18px 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--nixfubu-countdown-accent) 18%, #ffffff);
  color: var(--nixfubu-countdown-text);
  border: 1px solid color-mix(in srgb, var(--nixfubu-countdown-accent) 56%, transparent);
}

.nixfubu-countdown--minimal .nixfubu-countdown__unit {
  padding: 8px 8px 0;
  background: transparent;
  border-bottom: 3px solid color-mix(in srgb, var(--nixfubu-countdown-accent) 76%, transparent);
}

.nixfubu-countdown__unit strong {
  display: block;
  font: 800 clamp(34px, 3vw, 54px)/1 "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: -.03em;
}

.nixfubu-countdown__unit span {
  display: block;
  margin-top: 10px;
  font: 600 13px/1.2 "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.editor-styles-wrapper .nixfubu-countdown-editor {
  width: 100%;
  max-width: none;
}

@media (max-width: 767px) {
  .nixfubu-countdown__inner {
    padding: 28px 20px;
  }

  .nixfubu-countdown__timer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nixfubu-countdown__heading {
    font-size: 28px;
  }

  .nixfubu-countdown__subheading {
    font-size: 15px;
  }

  .nixfubu-countdown__unit strong {
    font-size: 30px;
  }
}
