/* Tool-specific: Cron Expression Parser */

/* Input row — text field + submit button side by side */
.cron-input-row {
  display: flex;
  gap: var(--space-3);
  align-items: stretch;
  margin-bottom: var(--space-4);
}

.cron-input-row input[type="text"] {
  flex: 1;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-mono);
  font-size: 1rem;
  background: var(--color-surface);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  outline: none;
  transition: border-color 0.15s;
}

.cron-input-row input[type="text"]:focus {
  border-color: var(--color-signal);
}

/* Quick presets row */
.cron-presets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
}

.cron-presets__label {
  font-size: 0.85rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}

/* Timezone selector row */
.cron-tz-row {
  margin-top: var(--space-3);
}

.cron-tz-row select {
  max-width: 280px;
}

/* Human-readable description output */
.cron-human {
  margin-bottom: var(--space-3);
}

.cron-human__desc {
  font-size: 1.05rem;
  color: var(--color-text);
  background: var(--color-surface-subtle);
  border-left: 3px solid var(--color-signal);
  padding: var(--space-3) var(--space-4);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-family: var(--font-mono);
  word-break: break-word;
}

/* Next 10 run times list */
.cron-next-runs {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-4) 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.cron-next-runs li {
  font-family: var(--font-mono);
  font-size: 0.9rem;
  color: var(--color-text);
  background: var(--color-surface-muted);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius);
}

.cron-next-runs li:first-child {
  color: var(--color-signal);
  background: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
}

/* Builder section */
.cron-builder-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

@media (max-width: 640px) {
  .cron-builder-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.cron-builder-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.cron-builder-field label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.cron-builder-field select {
  width: 100%;
}

/* Builder result row */
.cron-builder-result {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  background: var(--color-surface-subtle);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius);
  border: 1px solid var(--color-border);
}

.cron-builder-result__code {
  flex: 1;
  font-family: var(--font-mono);
  font-size: 1.1rem;
  color: var(--color-signal);
  word-break: break-all;
  background: none;
}