/* «Куда доставить» (заказы, шаг 6.5; эталон `layout.css` и `components.css` — `.address-*`, `.dialog--wide`): окно адреса —
   «Мои адреса» карточками и новый адрес в два шага; поля шапки доставки — два рядом по одной сетке. */

.dialog--wide { width: min(100%, calc(var(--space-8) * 12)); }
.dialog__part { display: grid; gap: var(--space-3); min-width: 0; }
.dialog__part-title { margin: 0; font-size: var(--title-sm); }

/* Карточки адресов: радио слева, подпись («Дом», «Работа»), адрес и подробности. */
.address-dialog .points { display: grid; gap: var(--space-2); margin: 0; padding: 0; border: 0; min-width: 0; }
.choice-card {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-3);
  padding: var(--space-3) var(--space-4); border: 1px solid var(--border2); border-radius: var(--radius-lg);
  background: var(--panel); cursor: pointer;
}
.choice-card:has(input:checked) { border-color: var(--accent); }
.choice-card__text { display: grid; gap: var(--space-1); min-width: 0; overflow-wrap: anywhere; }
.choice-card__sub { color: var(--muted); font-size: var(--text-sm); }
/* Недоступная карточка (эталон `components.css`, `.choice-card.is-off`): адрес вне зоны, без места или без дома. */
.choice-card.is-off { background: var(--card); cursor: not-allowed; }
.choice-card.is-off b { color: var(--muted); }
/* Условия зоны у адреса (И108); пока служба отвечает — строка уже занята: карточка не прыгает. */
.address-pick__terms { min-height: 1lh; font-size: var(--text-sm); }
.address-pick__terms.is-off { color: var(--err); }
.address-pick__label {
  justify-self: start; padding: 0 var(--space-2); border-radius: var(--radius-pill); background: var(--cream);
  color: var(--ink); font-size: var(--text-xs); font-weight: var(--weight-semibold);
}
.address-new { justify-self: start; }

/* Новый адрес: шаги строкой, подсказки — выпадающим списком во всю ширину поля, квартирные поля — сеткой. */
.address-form { display: grid; gap: var(--space-4); min-width: 0; }
.address-steps {
  display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: 0; padding: 0; list-style: none;
  color: var(--muted); font-size: var(--text-sm); counter-reset: step;
}
.address-steps li { counter-increment: step; }
.address-steps li::before { content: counter(step) ". "; }
.address-steps .is-current { color: var(--ink); font-weight: var(--weight-semibold); }
.address-suggest { position: relative; display: grid; gap: var(--space-1); }
/* Подсказки — частью формы под полем, а не поверх: тело окна прокручивается, и плавающий список им обрезался бы. */
.address-suggest__list { position: static; max-width: none; margin: 0; padding: var(--space-1); list-style: none; }
.address-suggest__list[hidden] { display: none; }
.address-suggest__item { min-height: var(--control-lg); white-space: normal; cursor: pointer; }
.address-suggest__item[aria-selected="true"] { background: var(--tint); }
.address-form__details { display: grid; gap: var(--space-4); min-width: 0; }
.address-form__line {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-2) var(--space-3);
  margin: 0; overflow-wrap: anywhere;
}
.address-form__text { display: grid; gap: var(--space-1); min-width: 0; line-height: var(--leading-title); }
.address-form__text span { color: var(--muted); font-size: var(--text-sm); }
.address-form__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.address-form__grid[hidden] { display: none; }
.address-form__grid .field { align-content: start; }
.address-form__labels { justify-self: start; }
.address-form__say:empty { display: none; }
@media (max-width: 767px) { .address-form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Шапка доставки: «Куда доставить» и «Когда доставить» — рядом, поровну. На узком планшете «Доставка ⌄» и «Когда» —
   пополам, как у самовывоза, а адрес — своим рядом во всю ширину (симметрия, владелец 06.10). */
.ww--two > .ww__field { flex: 1 1 0; min-width: 0; }
@media (min-width: 768px) and (max-width: 899px) {
  .scenario--delivery #where-field { grid-column: 1 / -1; grid-row: 2; }
}

/* «Мои адреса» кабинета (шаг 6.5; эталон `layout.css`, «.address-card»): карточка — текст слева, действия справа; на
   телефоне — одной колонкой. Удалённый — строкой «… удалён · Вернуть». */
.address-intro { font-size: var(--text-sm); }
.address-list { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.address-card {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--space-2) var(--space-4);
  padding: var(--space-4) var(--space-5); border: 1px solid var(--border2); border-radius: var(--radius-lg); background: var(--panel);
}
.address-card__text { display: grid; gap: var(--space-1); justify-items: start; min-width: 0; overflow-wrap: anywhere; }
.address-card__label { padding: 0 var(--space-2); border-radius: var(--radius-pill); background: var(--cream); font-size: var(--text-xs); font-weight: var(--weight-semibold); }
.address-card__details, .address-card__comment { color: var(--muted); font-size: var(--text-sm); }
.address-card__actions { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); }
.address-card__delete { color: var(--err); }
.address-card--removed { align-items: center; color: var(--muted); }
.address-add { justify-self: start; }
.myaddresses__status:empty { display: none; }
@media (max-width: 767px) {
  .address-card { grid-template-columns: minmax(0, 1fr); padding: var(--space-4); }
}

/* Карта зон доставки (Р175; эталон `components.css` — `.addr-layout`, `.zone-map`): на широком окне — слева и закреплена,
   справа список или форма; на телефоне — сверху, сворачивается. Цвета зон — темы клиента; выделена зона адреса. */
.addr-layout { display: grid; gap: var(--space-4); min-width: 0; }
.addr-layout__part { min-width: 0; }
@media (min-width: 768px) {
  .dialog--wide .addr-layout--map { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .dialog--wide .zone-map { position: sticky; top: 0; }
}
.zone-map { display: grid; gap: var(--space-2); min-width: 0; }
.zone-map__toggle {
  display: flex; align-items: center; gap: var(--space-2); cursor: pointer; list-style: none;
  font-size: var(--text-sm); font-weight: var(--weight-semibold);
}
.zone-map__toggle::-webkit-details-marker { display: none; }
.zone-map__toggle svg { flex: none; color: var(--accent); }
@media (max-width: 767px) { .zone-map__toggle { min-height: var(--tap, 44px); } }
.zone-map__art {
  position: relative; aspect-ratio: 16 / 10; max-width: 100%; overflow: hidden;
  border: 1px solid var(--border2); border-radius: var(--radius-lg); background: var(--cream);
}
.zone-map__failed {
  position: absolute; inset: 0; display: grid; place-items: center; margin: 0; padding: var(--space-4);
  color: var(--muted); font-size: var(--text-sm); text-align: center;
}
.zone-map__pin { display: grid; color: var(--accent); filter: drop-shadow(0 1px 1px rgb(0 0 0 / 0.35)); }
.zone-map__pin svg { width: 28px; height: 28px; fill: var(--panel); }
.zone-map__pin.is-out { color: var(--err); }
.zone-map__kitchen { width: 14px; height: 14px; border: 2px solid var(--panel); border-radius: 50%; background: var(--ink); }
.zone-map__legend { display: grid; gap: var(--space-1); margin: 0; padding: 0; list-style: none; font-size: var(--text-sm); }
.zone-map__item { display: flex; align-items: center; gap: var(--space-2); color: var(--muted); }
.zone-map__item.is-on { color: var(--ink); font-weight: var(--weight-semibold); }
.zone-map__swatch { flex: none; width: var(--icon-sm, 16px); height: var(--icon-sm, 16px); border-radius: var(--radius-sm); opacity: 0.7; }
.zone-map__caption { margin: 0; color: var(--ink); font-size: var(--text-sm); }
.zone-map__caption:empty { display: none; }
/* Кнопки «Приблизить» и «Отдалить» — спокойные, а не кнопки сайта: карта — справка, а не действие окна. */
.zone-map .maplibregl-ctrl-group { border-radius: var(--radius-md, 8px); background: var(--panel); box-shadow: 0 0 0 1px var(--border2); }
.zone-map .maplibregl-ctrl-group button {
  width: 32px; height: 32px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0;
  background: transparent; background-image: none; box-shadow: none; color: var(--ink); animation: none;
}
.zone-map .maplibregl-ctrl-group button:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.zone-map .maplibregl-ctrl-attrib { font-size: var(--text-xs); }