/**
 * Vino.cy Wine Routes — стили Фазы 1.
 * Цвет-акцент (#7a1f2b, винный бордовый) — подставьте свой брендовый, если
 * отличается от акцента темы Listeo на вашем сайте.
 */

/* Кнопка "В маршрут" рядом с сердечком "избранное" на карточке листинга */
.vino-add-to-route {
	display: inline-block;
	margin-left: 8px;
	cursor: pointer;
	font-size: 16px;
	color: #9aa0a6;
	transition: color 0.15s ease, transform 0.1s ease;
	vertical-align: middle;
}
.vino-add-to-route:hover {
	color: #7a1f2b;
	transform: scale(1.08);
}
.vino-add-to-route.vino-active {
	color: #7a1f2b;
}
.vino-add-to-route.vino-loading {
	opacity: 0.5;
	pointer-events: none;
}

/*
 * Большая кнопка "Add to My Routes" на странице отдельной винодельни —
 * размещается прямо под родной кнопкой "Bookmark this listing" и
 * скопирована с её реальных значений (проверено на живом сайте через
 * DevTools): pill-форма, тонкая серая рамка, паддинги, шрифт.
 * Если Purethemes изменит стиль своей кнопки в будущем обновлении —
 * поправьте значения здесь под неё же.
 */
.vino-add-to-route-listing {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	border: 1px solid #e0e0e0;
	border-radius: 50px;
	padding: 10px 25px;
	font-size: 14px;
	font-weight: 600;
	color: #444;
	cursor: pointer;
	margin-top: 12px;
	transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.vino-add-to-route-listing:hover {
	border-color: #7a1f2b;
	color: #7a1f2b;
}
.vino-add-to-route-listing.vino-active {
	border-color: #7a1f2b;
	color: #7a1f2b;
	background: #fdf3f2;
}
.vino-add-to-route-listing.vino-loading {
	opacity: 0.6;
	pointer-events: none;
}
.vino-add-to-route-listing .vino-route-icon {
	display: inline-block;
	width: 20px;
	text-align: center;
	font-size: 17px;
	flex-shrink: 0;
}
.vino-add-to-route-listing .vino-route-label {
	white-space: nowrap;
}

/* На мобильных ширина карточки уже не позволяет тексту "лежать" рядом с
   иконкой избранного — здесь кнопка своя, отдельным блоком под ней, так
   что на маленьких экранах она остаётся полностью видимой без доп. правок. */
@media (max-width: 480px) {
	.vino-add-to-route-listing {
		display: flex;
		width: 100%;
		justify-content: center;
	}
}

/* Плавающая панель "Мой маршрут (N)" */
.vino-route-floating-panel {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 9999;
}
.vino-route-floating-link {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #7a1f2b;
	color: #fff;
	padding: 12px 18px;
	border-radius: 999px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
	text-decoration: none;
	font-weight: 600;
	font-size: 14px;
}
.vino-route-floating-link:hover {
	background: #611720;
	color: #fff;
}

/* Страница "Мой маршрут" */
.vino-route-app {
	margin: 20px 0 40px;
}
.vino-route-loading {
	color: #9aa0a6;
}
.vino-route-shared-banner {
	background: #fdf3e7;
	border: 1px solid #eddcc3;
	border-radius: 8px;
	padding: 14px 18px;
	margin-bottom: 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}
.vino-route-layout {
	display: grid;
	grid-template-columns: minmax(280px, 420px) 1fr;
	gap: 24px;
	align-items: start;
}
@media (max-width: 860px) {
	.vino-route-layout {
		grid-template-columns: 1fr;
	}
}

.vino-route-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 16px;
}
.vino-route-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 6px;
	padding: 8px 14px;
	font-size: 13px;
	cursor: pointer;
	color: #333;
}
.vino-route-btn:hover:not(:disabled) {
	border-color: #7a1f2b;
	color: #7a1f2b;
}
.vino-route-btn:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.vino-route-stops-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.vino-route-stop {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	border: 1px solid #eee;
	border-radius: 8px;
	padding: 10px;
	margin-bottom: 8px;
}
.vino-route-stop.vino-dragging {
	opacity: 0.4;
}
.vino-route-drag-handle {
	cursor: grab;
	color: #bbb;
	font-size: 18px;
	line-height: 1;
	padding: 0 4px;
}
.vino-route-stop-thumb {
	width: 56px;
	height: 56px;
	border-radius: 6px;
	object-fit: cover;
	flex-shrink: 0;
	background: #f2f2f2;
}
.vino-route-stop-body {
	flex: 1;
	min-width: 0;
}
.vino-route-stop-title {
	font-weight: 600;
	color: #222;
	text-decoration: none;
	display: block;
}
.vino-route-stop-title:hover {
	color: #7a1f2b;
}
.vino-route-stop-address,
.vino-route-stop-phone {
	font-size: 12px;
	color: #888;
}
.vino-route-remove-stop {
	background: none;
	border: none;
	color: #bbb;
	font-size: 20px;
	cursor: pointer;
	line-height: 1;
	padding: 4px 8px;
}
.vino-route-remove-stop:hover {
	color: #c0392b;
}
.vino-route-empty {
	color: #999;
	padding: 20px 0;
}

/* Остановка без сохранённых координат в каталоге — честно показываем это
   в списке, а не молча пропускаем её с карты без объяснений. */
.vino-route-stop-nogeo {
	font-size: 12px;
	color: #a06a1f;
	margin-top: 2px;
}

/* Предупреждение над картой, когда хотя бы одна остановка не может быть
   показана на карте/в маршруте из-за отсутствия координат. */
.vino-route-nogeo-notice {
	background: #fdf3e7;
	border: 1px solid #eddcc3;
	border-radius: 8px;
	padding: 10px 14px;
	margin-bottom: 10px;
	font-size: 13px;
	color: #7a5116;
}

.vino-route-map {
	width: 100%;
	height: 480px;
	border-radius: 8px;
	overflow: hidden;
	background: #eee;
}

.vino-route-summary {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	background: #fff;
	border: 1px solid #eee;
	border-radius: 8px;
	padding: 10px 14px;
	margin-bottom: 10px;
	font-size: 14px;
}
.vino-route-summary-item strong {
	color: #7a1f2b;
}
.vino-route-summary-fallback {
	color: #a06a1f;
	font-size: 13px;
}
.vino-route-routing-attribution {
	font-size: 11px;
	color: #aaa;
	margin: 6px 2px 0;
	text-align: right;
}

/*
 * Печать маршрута: список остановок + карта с проложенным маршрутом.
 * Интерактивные элементы (кнопки, drag-handle, плавающая панель, зум
 * карты) скрываем — на бумаге от них никакого толку.
 *
 * Тема Listeo верстает подвал как <div id="footer"> (а не тег <footer>),
 * поэтому прячем именно #footer — иначе на распечатку "протекает" полный
 * футер сайта (описание, меню, контакты).
 *
 * Одни и те же правила продублированы в двух местах:
 *  - @media print — гарантия для печати через Ctrl+P / меню браузера;
 *  - .vino-printing (класс, который сама кнопка "Print" ставит на <html>
 *    непосредственно перед вызовом window.print(), см. vino-wine-routes.js,
 *    preparePrintMap) — нужен, чтобы Leaflet пересчитал размер карты и
 *    подгрузил недостающие тайлы ДО того, как откроется системный диалог
 *    печати. Без этого шага браузер не ждёт догрузку тайлов и часть карты
 *    (обычно снизу или сбоку) остаётся пустой/серой на распечатке.
 */
@media print {
	.vino-route-toolbar,
	.vino-route-drag-handle,
	.vino-route-remove-stop,
	#vino-route-floating-panel,
	.leaflet-control-zoom,
	.leaflet-control-attribution,
	header,
	#footer {
		display: none !important;
	}
	.vino-route-layout {
		display: block;
	}
	.vino-route-stop {
		border: none;
		border-bottom: 1px solid #ccc;
		border-radius: 0;
		page-break-inside: avoid;
	}
	.vino-route-map-col {
		margin-top: 20px;
		page-break-inside: avoid;
		break-inside: avoid;
	}
	.vino-route-map {
		width: 100% !important;
		height: 350px !important;
		border: 1px solid #ccc;
	}
	.vino-route-summary {
		border: none;
		padding: 0 0 8px;
	}
}

/* См. пояснение выше — тот же набор правил, но включаемый заранее классом,
   пока страница ещё на экране (а не через @media print), чтобы дать
   Leaflet время догрузить тайлы печатного размера по сети. */
html.vino-printing .vino-route-toolbar,
html.vino-printing .vino-route-drag-handle,
html.vino-printing .vino-route-remove-stop,
html.vino-printing #vino-route-floating-panel,
html.vino-printing .leaflet-control-zoom,
html.vino-printing .leaflet-control-attribution,
html.vino-printing header,
html.vino-printing #footer {
	display: none !important;
}
html.vino-printing .vino-route-layout {
	display: block;
}
html.vino-printing .vino-route-map-col {
	margin-top: 20px;
}
html.vino-printing .vino-route-map {
	width: 100% !important;
	height: 350px !important;
	border: 1px solid #ccc;
}
html.vino-printing .vino-route-summary {
	border: none;
	padding: 0 0 8px;
}