/* Pregnancy Due Date & Gestational Age — gestational-age row, progress bar, trimester tints. */

.preg-ga-row {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
}

.preg-ga-row .input-group {
  flex: 1 1 6rem;
  min-width: 6rem;
}

/* ---- Progress bar (40-week term split into three trimesters) ------------- */
.preg-bar {
  position: relative;
  display: flex;
  width: 100%;
  height: 12px;
  margin-top: var(--space-2);
  border-radius: var(--radius-full);
  overflow: hidden;
  background: var(--border);
}

.preg-seg { height: 100%; }
.preg-seg--t1 { width: 35%; background: var(--blue-400); }   /* weeks 0–13 */
.preg-seg--t2 { width: 35%; background: var(--green-400); }  /* weeks 14–27 */
.preg-seg--t3 { width: 30%; background: var(--warning-500); }/* weeks 28–40 */

.preg-marker {
  position: absolute;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-left: -7px;
  border-radius: var(--radius-full);
  background: var(--surface);
  border: 3px solid var(--text-primary);
  transform: translateY(-50%);
}

.preg-bar-scale {
  display: flex;
  justify-content: space-between;
  margin-top: var(--space-2);
  font-size: var(--text-xs-size);
  line-height: var(--text-xs-line);
  color: var(--text-secondary);
}

.preg-progress-text {
  margin-top: var(--space-3);
  font-weight: 600;
  color: var(--text-primary);
}

.preg-countdown {
  margin-top: var(--space-1);
  color: var(--text-secondary);
}

/* ---- Trimester tint on the headline stat -------------------------------- */
.preg-tri--1 { color: var(--blue-600); }
.preg-tri--2 { color: var(--green-600); }
.preg-tri--3 { color: var(--warning-700); }