/* Магазины PURPUR: страница «Магазины», ссылка на неё в «Контактах», карты в блоке магазинов на главной.
   Приложение № 2 к договору № 27, задача 6.6. Скрипт карт: template/view/javascript/purpur-stores.js. */

/* Карта и метки */
.purpur-map {
	position: relative;
	z-index: 0;
	background: var(--bg-grey, #F6F6F8);
}
.purpur-map .leaflet-tile-pane { filter: grayscale(1) contrast(.95) brightness(1.03); }
.purpur-map .leaflet-container,
.purpur-map.leaflet-container { font-family: "Montserrat", Arial, sans-serif; }
.purpur-map__pin { background: none; border: 0; }
.purpur-map__pin span {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 30px;
	padding: 0 10px;
	background: var(--black, #1B1B1B);
	color: var(--white, #FFFFFF);
	font: 600 12px/30px "Montserrat", Arial, sans-serif;
	letter-spacing: .14em;
	text-align: center;
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
	transition: background .2s;
}
.purpur-map__pin span::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 30px;
	margin-left: -7px;
	border: 7px solid transparent;
	border-top: 9px solid var(--black, #1B1B1B);
	border-bottom: 0;
	transition: border-color .2s;
}
.purpur-map__pin:hover span,
.purpur-map__pin:focus span { background: var(--accent, #8B655A); }
.purpur-map__pin:hover span::after,
.purpur-map__pin:focus span::after { border-top-color: var(--accent, #8B655A); }
.purpur-map .leaflet-popup-content-wrapper { border-radius: 0; box-shadow: 0 4px 16px rgba(0, 0, 0, .18); }
.purpur-map .leaflet-popup-content { margin: 14px 18px; font-size: 13px; line-height: 1.5; color: var(--black, #1B1B1B); }
.purpur-map__popup-name { font-weight: 600; letter-spacing: .12em; }
.purpur-map__popup-place { margin-bottom: 4px; color: var(--grey, #8D8D8D); }
.purpur-map__popup-hours { margin-top: 4px; }
.purpur-map__popup a { display: inline-block; margin-top: 8px; color: var(--black, #1B1B1B); text-decoration: underline; text-underline-offset: 3px; }
.purpur-map__popup a:hover { color: var(--accent, #8B655A); }
.purpur-map .leaflet-control-attribution { font-size: 10px; }
.purpur-map .leaflet-control-attribution a { color: var(--grey, #8D8D8D); }

/* Страница «Магазины» */
.purpur-stores {
	display: grid;
	grid-template-columns: minmax(300px, 420px) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
	padding-bottom: 64px;
}
.purpur-stores__list { display: flex; flex-direction: column; gap: 24px; }
.purpur-stores__card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 28px 24px;
	background: var(--bg-grey, #F6F6F8);
}
.purpur-stores__name {
	margin: 0;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: .12em;
	color: var(--black, #1B1B1B);
}
.purpur-stores__place {
	display: block;
	margin-top: 6px;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--black, #1B1B1B);
}
.purpur-stores__label { margin-bottom: 4px; font-size: 13px; color: var(--grey, #8D8D8D); }
.purpur-stores__value { font-size: 15px; line-height: 1.5; color: var(--black, #1B1B1B); }
.purpur-stores__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 4px; }
.purpur-stores__route { padding: 12px 20px; font-size: 13px; letter-spacing: .04em; }
.purpur-stores__show {
	padding: 0;
	background: none;
	border: 0;
	font: inherit;
	font-size: 14px;
	color: var(--black, #1B1B1B);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
.purpur-stores__show:hover { color: var(--accent, #8B655A); }
.purpur-stores__photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.purpur-stores__photos img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.purpur-stores__map-wrap { position: sticky; top: 24px; }
.purpur-stores__map { height: 560px; }
@media (max-width: 1023px) {
	.purpur-stores { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.purpur-stores__map-wrap { position: static; order: -1; }
	.purpur-stores__map { height: 400px; }
}
@media (max-width: 767px) {
	.purpur-stores { padding-bottom: 40px; }
	.purpur-stores__map { height: 300px; }
	.purpur-stores__card { padding: 20px 16px; }
	.purpur-stores__name { font-size: 18px; }
	.purpur-stores__route { flex: 1 1 100%; }
}

/* Ссылка на страницу «Магазины» в «Контактах» */
.purpur-contacts-stores { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.purpur-contacts-stores p { margin: 0; color: var(--grey, #8D8D8D); }

/* Блок магазинов на главной: карта на месте прежнего виджета Яндекса, того же размера */
.card-map .purpur-map-wrap { flex: 0 0 auto; width: 390px; max-width: 100%; }
.card-map .purpur-map { width: 100%; height: 205px; }
@media (max-width: 767px) {
	.card-map .purpur-map-wrap { width: 100%; }
}
