/* ---------------------------------------------------------------
   Страница «Доставка и оплата» — kryolan.ru
   Подключается: Asset::getInstance()->addCss(SITE_TEMPLATE_PATH.'/css/delivery.css');
   Все селекторы вложены в .dlv, чтобы не задеть остальной шаблон.
   --------------------------------------------------------------- */

.dlv {
	--ink: #1b2430;
	--calc-bg: #eef1f5;      /* фон блока расчёта */
	--calc-fg: #1b2430;      /* текст на нём; для тёмного фона ставить #fff */
	--calc-fg-muted: #626b78;
	--muted: #626b78;
	--rule: #dcdfe4;
	--panel: #f2f4f7;
	--accent: #002D62;       /* структурный акцент: линии, рамки, заголовки */
	--warn: #CF0000;         /* только для предупреждений */
	--warn-soft: #fdf0ef;

	max-width: 100%;
	color: var(--ink);
	line-height: 1.6;
	overflow-wrap: break-word;
	padding-bottom: 80px;
}

.dlv p { margin: 0 0 12px; }
.dlv p:last-child { margin-bottom: 0; }

/* --- Калькулятор ------------------------------------------------ */

#delivery-calculate.dlv-calc {
	position: relative;
	background: var(--calc-bg);
	color: var(--calc-fg);
	padding: 34px 36px 36px;
}

#delivery-calculate.dlv-calc::before {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 3px;
	background: var(--accent);
}

#delivery-calculate .dlv-calc__lead {
	font-size: 17px;
	color: var(--calc-fg);
}

#delivery-calculate .dlv-calc__note {
	margin: 14px 0 0;
	color: var(--calc-fg-muted);
	font-size: 14px;
}

#delivery-calculate .dlv-calc__field {
	margin: 26px 0 0;
	max-width: 520px;
}

#delivery-calculate .dlv-calc__field label {
	display: block;
	margin: 0 0 8px;
	font-size: 14px;
	color: var(--calc-fg-muted);
}

#delivery-calculate .suggestions-wrapper { width: 100%; }

#delivery-calculate.dlv-calc input[type="text"] {
	width: 100%;
	box-sizing: border-box;
	padding: 13px 14px;
	border: 1px solid var(--rule);
	border-radius: 0;
	background: #fff;
	color: var(--ink);
	font-size: 16px;
	font-family: inherit;
	outline: none;
}

#delivery-calculate.dlv-calc input[type="text"]:focus {
	border-color: var(--accent);
	box-shadow: 0 0 0 2px rgba(0, 45, 98, .2);
}

.dlv #delivery-list:empty { display: none; }

.dlv #delivery-list {
	margin: 22px 0 0;
	padding: 18px 22px 20px;
	background: #fff;
	border: 1px solid var(--rule);
	color: var(--ink);
	font-size: 15px;
}

/* Заголовок появляется вместе с результатами: он нарисован
   псевдоэлементом, поэтому у пустого блока его нет. */
.dlv #delivery-list::before {
	content: "Варианты доставки в выбранный населённый пункт";
	display: block;
	margin: 0 0 14px;
	padding: 0 0 12px;
	border-bottom: 1px solid var(--accent);
	color: var(--muted);
	font-size: 14px;
	line-height: 1.4;
}

/* Содержимое приходит из ajax_delivery.php и свёрстано под десктоп:
   не даём ему распирать страницу на телефоне. */
.dlv #delivery-list,
.dlv #delivery-list * {
	max-width: 100%;
	box-sizing: border-box;
	white-space: normal;
	overflow-wrap: break-word;
	word-break: break-word;
}

.dlv #delivery-list img { height: auto; }

.dlv #delivery-list table { width: 100%; border-collapse: collapse; }
.dlv #delivery-list td, .dlv #delivery-list th { padding: 8px 10px; border-bottom: 1px solid var(--rule); text-align: left; }
.dlv #delivery-list tr:last-child td { border-bottom: none; }

/* --- Выпадающий список подсказок DaData -------------------------
   Плагин не задаёт цвет текста, поэтому внутри тёмного блока
   подсказки наследовали светлый цвет. Возвращаем тёмный.
   --------------------------------------------------------------- */

#delivery-calculate .suggestions-suggestions {
	color: var(--ink);
	border-color: var(--rule);
}

#delivery-calculate .suggestions-suggestion,
#delivery-calculate .suggestions-value {
	color: var(--ink);
}

#delivery-calculate .suggestions-suggestions strong {
	color: var(--accent);
}

#delivery-calculate .suggestions-hint,
#delivery-calculate .suggestions-subtext,
#delivery-calculate .suggestions-subtext_label {
	color: var(--muted);
}

/* --- Заголовки разделов ----------------------------------------- */

.dlv-section { margin: 54px 0 0; }

.dlv-h {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 22px;
	font-size: 27px;
	line-height: 1.25;
	font-weight: normal;
}

.dlv-h::after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: var(--rule);
}

.dlv-h .dlv-d {
	flex: 0 0 auto;
	color: var(--accent);
	font-size: 11px;
	line-height: 1;
}

/* --- Предупреждение о приёмке ----------------------------------- */

.dlv-warn {
	margin: 28px 0 0;
	padding: 20px 24px;
	background: var(--warn-soft);
	border-left: 3px solid var(--warn);
}

.dlv-warn h3 {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: normal;
	color: var(--warn);
}

.dlv-warn p { font-size: 15px; line-height: 1.7; }

/* --- Две зоны доставки ------------------------------------------ */

.dlv-zones {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.dlv-zone {
	padding: 26px 28px 28px;
	border: 1px solid var(--rule);
	background: #fff;
}

.dlv-zone + .dlv-zone { border-left: none; }

.dlv-zone__title {
	margin: 0 0 4px;
	font-size: 20px;
	line-height: 1.3;
	font-weight: normal;
}

.dlv-zone__sub {
	margin: 0 0 18px;
	padding: 0 0 14px;
	border-bottom: 1px solid var(--accent);
	color: var(--muted);
	font-size: 14px;
}

.dlv-spec { margin: 0; }

.dlv-spec > div {
	display: grid;
	grid-template-columns: 145px 1fr;
	gap: 6px 16px;
	padding: 11px 0;
	border-top: 1px dotted var(--rule);
}

.dlv-spec > div:first-child { border-top: none; padding-top: 0; }

.dlv-spec dt {
	color: var(--muted);
	font-size: 14px;
	line-height: 1.45;
}

.dlv-spec dd {
	margin: 0;
	font-size: 15px;
}

.dlv-spec .dlv-price dd {
	font-size: 22px;
	line-height: 1.2;
}

.dlv-spec .dlv-price dd span {
	display: block;
	margin: 6px 0 0;
	font-size: 14px;
	color: var(--muted);
	line-height: 1.5;
}

.dlv-zone__foot {
	margin: 18px 0 0;
	padding: 14px 0 0;
	border-top: 1px solid var(--rule);
	color: var(--muted);
	font-size: 14px;
}

/* --- Доставка «день в день» -------------------------------------- */

.dlv-sameday {
	margin: 26px 0 0;
	padding: 24px 28px 26px;
	background: #fff;
	border: 1px solid var(--rule);
	border-left: 3px solid var(--accent);
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 8px 48px;
	align-items: start;
}

.dlv-sameday__head h3 {
	margin: 0;
	font-size: 20px;
	line-height: 1.3;
	font-weight: normal;
}

.dlv-sameday__head p {
	margin: 6px 0 0;
	color: var(--muted);
	font-size: 14px;
}

.dlv-sameday .dlv-spec > div:first-child { padding-top: 0; }

/* --- Общие условия ---------------------------------------------- */

.dlv-terms {
	margin: 0;
	padding: 22px 28px;
	background: var(--panel);
	border: 1px solid var(--rule);
	border-top: none;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px 32px;
}

.dlv-terms div { font-size: 15px; }

.dlv-terms b {
	display: block;
	margin: 0 0 3px;
	font-weight: 600;
}

/* --- Пункты выдачи и партнёры ----------------------------------- */

.dlv-point {
	padding: 22px 0;
	border-top: 1px solid var(--rule);
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 8px 48px;
	align-items: start;
}

.dlv-point:first-of-type { border-top: none; padding-top: 0; }

.dlv-point__name {
	margin: 0;
	font-size: 17px;
	line-height: 1.4;
}

.dlv-point__hours {
	margin: 4px 0 0;
	color: var(--muted);
	font-size: 14px;
}

.dlv-point__body { font-size: 15px; }
.dlv-point__body p { margin-bottom: 10px; }

.dlv-hint {
	margin: 18px 0 0;
	padding: 14px 18px;
	background: var(--panel);
	color: var(--muted);
	font-size: 14px;
}

.dlv-prose { font-size: 15px; line-height: 1.7; }
.dlv-prose em { color: var(--muted); }

.dlv-sdek-widget:empty { display: none; }
.dlv-sdek-widget { margin: 18px 0 0; }

/* --- Красное предупреждение о предоплате -------------------------- */

.dlv-alert {
	margin: 18px 0 0;
	padding: 14px 18px;
	background: var(--warn-soft);
	border-left: 3px solid var(--warn);
	color: var(--warn);
	font-size: 15px;
}

/* --- Список запрещённых товаров ------------------------------------ */

.dlv-banned {
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
	counter-reset: banned;
	columns: 2;
	column-gap: 48px;
}

.dlv-banned li {
	break-inside: avoid;
	padding: 9px 0 9px 34px;
	border-top: 1px dotted var(--rule);
	position: relative;
	font-size: 14px;
	line-height: 1.45;
}

.dlv-banned li::before {
	counter-increment: banned;
	content: counter(banned);
	position: absolute;
	left: 0;
	top: 9px;
	color: var(--muted);
	font-size: 13px;
}

.dlv-banned b { font-weight: 600; }

.dlv-banned span {
	display: block;
	color: var(--muted);
}

/* --- Мобильная версия -------------------------------------------- */

@media (max-width: 860px) {
	.dlv-terms { grid-template-columns: 1fr 1fr; }
	.dlv-point,
	.dlv-sameday { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
	.dlv { padding-bottom: 48px; }
	#delivery-calculate.dlv-calc { padding: 26px 20px 28px; }
	.dlv-h { font-size: 23px; }
	.dlv-zones { grid-template-columns: 1fr; }
	.dlv-zone + .dlv-zone { border-left: 1px solid var(--rule); border-top: none; }
	.dlv-terms { grid-template-columns: 1fr; padding: 20px; }
	.dlv-banned { columns: 1; }
	.dlv-spec > div { grid-template-columns: 1fr; gap: 2px; padding: 10px 0; }
	.dlv-zone { padding: 22px 20px 24px; }
	.dlv-sameday { padding: 22px 20px 24px; gap: 16px; }
}
