/*
 * "מתי נוח שנתקשר?" — the day / time-band row on the public lead forms (see lead-callback.js).
 *
 * Why this exists: a <select> is naturally as wide as its widest option, and the day list holds
 * "היום · יום חמישי 27/08". Two of those next to a no-wrap label came to ~410px, and inside the
 * forms that lay out as `display:grid` that minimum wins over the column — the form, the card and
 * the whole page grew past a phone's 375px and scrolled sideways (pricing rendered 472px wide,
 * the SEO articles 453px). `min-width:0` on the grid item is what lets the column shrink again;
 * the wrapping is so a narrow screen gets one select per line instead of two clipped ones.
 */
.lead-when {
  display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center;
  min-width: 0; max-width: 100%;
}
.lead-when-label { white-space: nowrap; }
/* The two lists: side by side when both fit at a readable width, stacked otherwise. */
.lead-when-slots { flex: 1 1 328px; min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.lead-when-slots > select { flex: 1 1 160px; min-width: 0; box-sizing: border-box; }
/* Fallback look for a page that styles no selects of its own. Zero specificity, so a page's own
   `select` rule (or an inline style) wins. 16px keeps iOS from zooming in on focus. */
:where(.lead-when-slots) > select {
  font: inherit; font-size: 16px; padding: 11px 12px;
  border: 1.5px solid #ccc; border-radius: 9px; background: #fff; color: #222;
}