/* DIALSTORE: локальные фиксы перенесённой темы */

/* Герой-слайдер: стрелки внутри слайда, по центру краёв (а не над блоком).
   z-index 2 — выше слайдов, но НИЖЕ flyout-подменю категорий (z-index 9),
   чтобы стрелки не светили сквозь открытое меню категорий. */
.hero_carousel .owl-controls {
	position: static;
	margin: 0;
	z-index: 2;
}
.hero_carousel .owl-controls .owl-buttons {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	transform: translateY(-50%);
	z-index: 2;
}
.hero_carousel .slide_arrow_prev,
.hero_carousel .slide_arrow_next {
	top: 0;
	opacity: 1;
	background: #fff;
	border: 1px solid #c9c9c9;
	border-radius: 3px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
	color: #555;
	height: 44px;
	line-height: 40px;
	width: 44px;
	font-size: 26px;
	z-index: 2;
	transition: background 250ms, border-color 250ms;
}
.hero_carousel .slide_arrow_prev {
	left: 10px;
	right: auto;
}
.hero_carousel .slide_arrow_next {
	right: 10px;
}
.hero_carousel .slide_arrow_prev:hover,
.hero_carousel .slide_arrow_next:hover {
	opacity: 1;
	background: #00b0f0;
	border-color: transparent;
	color: #fff;
}
.hero_carousel .owl-pagination {
	position: absolute;
	bottom: 14px;
	left: 0;
	right: 0;
	text-align: center;
	font-size: 0;
}
.hero_carousel .owl-page {
	display: inline-block;
	margin: 0 4px;
}
.hero_carousel .owl-page span {
	display: block;
	width: 12px;
	height: 12px;
	background: #fff;
	border: 1px solid #c9c9c9;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
	border-radius: 50%;
	transition: background 250ms;
}
.hero_carousel .owl-page.active span,
.hero_carousel .owl-page:hover span {
	background: #00b0f0;
	border-color: transparent;
}

/* Зум в карточке товара: у фото прозрачный фон (PNG), без белой подложки
   окна зума сквозь прозрачные места просвечивает маленькая копия фото */
.cloud-zoom-big {
	background-color: #fff;
}

/* Кнопки избранного/сравнения на карточках: активное состояние —
   цвет кнопки «Купить» (#00b0f0), неактивное — штатный серый темы */
.btn.btn-icon.dial_active {
	background-color: #00b0f0;
	color: #fff;
}
.btn.btn-icon.dial_active:hover {
	background-color: #0092cc;
	color: #fff;
}
.btn.btn-icon.dial_active i,
.btn.btn-icon.dial_active i:before {
	color: #fff;
}

/* Страница «Закладки» (избранное): кнопки «Купить»/«Удалить» в строках —
   одинаковые квадратные, как иконки на карточках товаров */
#account-wishlist table .btn {
	width: 44px;
	height: 44px;
	padding: 0;
	margin-left: 4px;
	text-align: center;
}
#account-wishlist table .btn i {
	line-height: 44px;
	font-size: 18px;
}

/* ===== Верхняя тёмная полоса (по макету): слева телефон/адрес/доставка,
   справа избранное | сравнение | вход-регистрация (крупнее, жирный) ===== */
.header_top_line_wrapper.dial_top_line {
	background: #04546e;
	border-bottom: 0;
	color: #fff;
	padding: 7px 0;
}
.dial_top_line .dial_top_left span {
	color: #fff;
	white-space: nowrap;
	margin-right: 22px;
	font-size: 13px;
}
.dial_top_line .dial_top_left .fa-phone-square,
.dial_top_line .dial_top_left .fa-truck {
	font-size: 15px;
}
.dial_top_line .dial_top_left .dial_phone a {
	color: #fff;
	font-weight: 700;
	font-size: 13px;
}
.dial_top_line .dial_top_right {
	white-space: nowrap;
}
.dial_top_line .dial_wl,
.dial_top_line .dial_cmp {
	color: #fff;
	font-size: 12.5px;
	white-space: nowrap;
}
.dial_top_line .dial_sep {
	display: inline-block;
	width: 1px;
	height: 13px;
	background: rgba(255, 255, 255, 0.4);
	margin: 0 9px;
	vertical-align: -2px;
}
.dial_top_line .login_register {
	display: inline-block;
	white-space: nowrap;
	font-size: 15px;
	font-weight: 700;
	margin-left: 9px;
	/* у темы .login_register{max-width:90px} — снимаем ограничение */
	max-width: none;
	width: auto;
	color: #fff;
	text-align: right;
}
.dial_top_line .login_register a {
	color: #fff;
	text-decoration: none;
}
.dial_top_line .login_register a:hover {
	text-decoration: underline;
}
.dial_top_line .login_register span {
	color: rgba(255, 255, 255, 0.55);
	padding: 0 4px;
	font-weight: 400;
}
.dial_top_line .fa-heart,
.dial_top_line .icon-resize-small {
	color: #fff;
}
@media (max-width: 1199px) {
	.dial_top_line .dial_delivery { display: none; }
	.dial_top_line .dial_wl, .dial_top_line .dial_cmp { font-size: 12px; }
	.dial_top_line .login_register { font-size: 14px; margin-left: 8px; }
	.dial_top_line .dial_sep { margin: 0 8px; }
}
@media (max-width: 991px) {
	/* планшет: позволяем правому кластеру аккуратно переноситься внутри колонки */
	.dial_top_line .dial_top_right { white-space: normal; line-height: 2; }
}

/* Страница корзины: кнопки купона/сертификата/бонусов — в одну строку, высотой как поле ввода */
#button-coupon,
#button-voucher,
#button-reward {
	font-size: 13px;
	line-height: 1.3;
	padding: 8px 14px;
	white-space: nowrap;
	width: auto;
	max-width: none;
	height: 38px;
	vertical-align: middle;
}

/* Уведомления (купон/сертификат и др.): крестик по центру высоты,
   у темы он прибит top:12px и на низких уведомлениях вылезает за край */
.alert {
	/* JS вставляет уведомления внутрь .breadcrumb_wrapper с font-size:0 —
	   без явного шрифта текст сообщения становится невидимым */
	font-size: 13px;
	line-height: 20px;
}
.alert .close {
	top: 50%;
	transform: translateY(-50%);
	right: 12px;
	width: 26px;
	line-height: 22px;
	opacity: 0.45;
}
.alert .close:hover {
	opacity: 1;
}

/* Мини-корзина в шапке: как в оригинале — показываем только «Оформить заказ»
   (в оригинале #cart .checkoutbuttons .btn-default скрыт настройками темы) */
#cart .checkoutbuttons .btn-default {
	display: none;
}
#cart .checkoutbuttons .btn-primary {
	display: block;
	width: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

/* --- Mobile: product-filter (sort bar) must not overflow narrow screens (added 2026-10-05) --- */
@media (max-width: 767px) {
	.product-filter {
		display: block;
		width: 100%;
		padding: 10px;
	}
	.product-filter .left_side,
	.product-filter .right_side {
		display: block;
		width: 100%;
	}
	.product-filter .sort,
	.product-filter .limit {
		display: block;
		margin: 0 0 8px 0;
		white-space: normal;
	}
	.product-filter select,
	.product-filter .sbHolder {
		max-width: 100%;
		box-sizing: border-box;
	}
}
/* --- Mobile: buy button as a proper touch target (added 2026-10-05) --- */
@media (max-width: 767px) {
	.btn-holder:has(#button-cart) {
		display: flex;
		width: 100%;
		align-items: stretch;
		gap: 8px;
	}
	.btn-holder:has(#button-cart) #button-cart {
		flex: 1 1 auto;
		min-width: 150px;
	}
	.btn-holder:has(#button-cart) .btn-icon {
		flex: 0 0 44px;
		height: 44px;
	}
}
/* --- Mobile: hard guard against layout-viewport expansion (zoom-out effect on Android) --- */
@media (max-width: 767px) {
	html,
	body {
		overflow-x: hidden;
		max-width: 100vw;
	}
	.owl-carousel,
	.owl-carousel .owl-wrapper-outer {
		overflow: hidden !important;
		max-width: 100%;
	}
	.owl-carousel .owl-wrapper,
	.owl-carousel .owl-item {
		max-width: 100vw;
	}
	/* images and iframes never exceed the screen */
	img,
	iframe,
	video {
		max-width: 100%;
	}
}
/* --- Mobile: hide dark contact top line (matches old site behaviour) --- */
@media (max-width: 767px) {
	.header_top_line_wrapper.dial_top_line {
		display: none !important;
	}
}
/* --- Mobile: bulletproof no-horizontal-scroll (clip + no overscroll) --- */
@media (max-width: 767px) {
	html,
	body {
		width: 100%;
		overflow-x: hidden;
		overflow-x: clip;            /* современная замена hidden: контейнер физически не скроллится */
		overscroll-behavior-x: none; /* нет резинового растягивания вбок */
	}
}
/* --- Mobile: owl track must be free-width (v18 max-width broke hero: slides stacked).
       Clipping stays on .owl-carousel / .owl-wrapper-outer. --- */
@media (max-width: 767px) {
	.owl-carousel .owl-wrapper,
	.owl-carousel .owl-item {
		max-width: none;
	}
}
/* --- Mobile: logo must fit its 80px holder (was 100px tall, overlapped search bar) --- */
@media (max-width: 767px) {
	.logo img,
	#logo img {
		max-height: 76px !important;
		width: auto !important;
	}
}
/* --- Mobile: compact header per mockup: logo left + cart right in one row, search full-width below --- */
@media (max-width: 767px) {
	.header_sticky .row.header {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		margin: 0;
		padding-top: 6px;
		padding-bottom: 0;
	}
	.header_sticky .row.header > .col-md-3:first-child {
		flex: 0 0 50%;
		order: 1;
		text-align: left !important;
		padding: 0 0 0 10px;
		margin: 0;
	}
	.header_sticky .row.header .logo {
		max-height: none;
		height: auto;
		margin: 0;
	}
	.header_sticky .row.header .logo img {
		max-height: 52px !important;
	}
	.header_sticky .row.header .dial_cart_col {
		flex: 0 0 50%;
		order: 2;
		text-align: right !important;
		padding: 0 10px 0 0;
		margin: 0;
	}
	.header_sticky .row.header > .col-sm-7 {
		flex: 0 0 100%;
		order: 3;
		padding: 6px 10px 10px;
		margin: 0;
	}
	.header_sticky .search_wrapper {
		margin: 0;
	}
}
/* --- Mobile: logo holder must hug the image (theme forces 120px box -> big gaps) --- */
@media (max-width: 767px) {
	.header_sticky .row.header .logo {
		height: auto !important;
		max-height: none !important;
		margin: 0 !important;
		line-height: 1 !important;
	}
	.header_sticky .row.header .logo a {
		display: inline-block;
		line-height: 0;
	}
}
/* --- Mobile: re-inited carousels - arrows absolutely positioned at the edges (theme left them static) --- */
@media (max-width: 767px) {
	.owl-carousel.custom {
		position: relative;
	}
	.owl-carousel.custom .owl-buttons {
		/* absolute + transform:none: любой transform на .owl-buttons делает его
		   containing block'ом для стрелок (даже identity matrix) — тогда top:%
		   считается от нулевой высоты и стрелки падают под баннер */
		position: absolute !important;
		transform: none !important;
		-webkit-transform: none !important;
		top: 50%;
		left: 0;
		right: 0;
		height: 0;
	}
	.owl-carousel.custom .owl-buttons div {
		position: absolute;
		top: 0;
		transform: translateY(-50%);
		width: 38px;
		height: 38px;
		margin: 0;
		padding: 0;
		background: rgba(255, 255, 255, 0.82);
		border-radius: 50%;
		line-height: 36px;
		text-align: center;
		color: #0092cc;
		font-size: 20px;
		z-index: 12;
		box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
	}
	.owl-carousel.custom .owl-buttons div i {
		color: #0092cc;
		text-shadow: none;
		font-size: 22px;
	}
	.owl-carousel.custom .owl-buttons .owl-prev {
		left: 6px;
	}
	.owl-carousel.custom .owl-buttons .owl-next {
		right: 6px;
	}
}
/* --- Mobile: owl-controls has a CSS transform -> becomes zero-height containing block at
       carousel bottom, pulling banner arrows below the banner. Kill transform, center on carousel. --- */
@media (max-width: 767px) {
	.owl-carousel.custom .owl-controls {
		transform: none !important;
		-webkit-transform: none !important;
		position: static;
		height: 0;
	}
	.owl-carousel.custom .owl-buttons div {
		top: 0 !important;
		bottom: auto !important;
	}
}
/* --- Mobile: carousel arrows beat owl-theme gray square (higher specificity + !important) --- */
@media (max-width: 767px) {
	.owl-carousel.owl-theme.custom .owl-controls .owl-buttons div,
	.owl-carousel.custom .owl-controls .owl-buttons div.owl-prev,
	.owl-carousel.custom .owl-controls .owl-buttons div.owl-next {
		background: rgba(255, 255, 255, 0.88) !important;
		background-color: rgba(255, 255, 255, 0.88) !important;
		border-radius: 50% !important;
		border: 0 !important;
		color: #0092cc !important;
		filter: none !important;
		opacity: 1 !important;
		box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18) !important;
	}
	.owl-carousel.owl-theme.custom .owl-controls .owl-buttons div i,
	.owl-carousel.custom .owl-controls .owl-buttons div i {
		color: #0092cc !important;
		text-shadow: none !important;
		font-size: 22px !important;
	}
}
/* --- Mobile: the ICON itself carries a 46x46 gray box from the theme - neutralize it --- */
@media (max-width: 767px) {
	.owl-carousel.owl-theme.custom .owl-controls .owl-buttons div i,
	.owl-carousel.custom .owl-buttons div i {
		background: transparent !important;
		background-color: transparent !important;
		width: 38px !important;
		height: 38px !important;
		line-height: 38px !important;
		border-radius: 50% !important;
		color: #0092cc !important;
		font-size: 22px !important;
		text-shadow: none !important;
		display: inline-block;
	}
}
/* --- SEO-блок в карточке товара: единый стиль с описанием (цвет шапки #04546e) --- */
.dial-seo-block h2 {
	color: rgb(4, 84, 110);
	font-size: 20px;
	font-weight: 700;
	border-bottom: 1px solid rgba(4, 84, 110, 0.25);
	padding-bottom: 6px;
	margin: 20px 0 10px;
}
.dial-seo-block h2:first-child {
	margin-top: 0;
}
.dial-seo-block p {
	color: rgb(4, 84, 110);
	text-align: justify;
}
.dial-seo-block ul,
.dial-seo-block ol {
	color: rgb(4, 84, 110);
}
.dial-seo-block li {
	color: rgb(4, 84, 110);
	text-align: justify;
	margin-bottom: 4px;
}
.dial-seo-block strong,
.dial-seo-block b {
	color: rgb(4, 84, 110);
	font-weight: 700;
}
/* --- Фильтр товаров (dial_filter) --- */
.dial_filter_box {
	padding: 14px 16px;
}
.dial_filter_box h3 {
	margin: 0 0 10px;
	font-size: 17px;
	font-weight: 700;
	color: #04546e;
	text-transform: uppercase;
}
.df_group {
	margin-bottom: 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
}
.df_group:last-of-type {
	border-bottom: 0;
}
.df_group_title {
	font-weight: 700;
	font-size: 14px;
	color: #333;
	margin-bottom: 8px;
}
.df_price_row {
	display: flex;
	align-items: center;
	gap: 6px;
}
.df_price_row .form-control {
	padding: 5px 8px;
	font-size: 13px;
	height: 32px;
	text-align: center;
}
.df_dash {
	color: #999;
}
.df_option {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 3px 0;
	font-size: 13.5px;
	cursor: pointer;
}
.df_option input[type="checkbox"] {
	flex: 0 0 auto;
	margin: 0;
	accent-color: #00b0f0;
}
.df_option_name {
	color: #04546e;
}
.df_cnt {
	color: #999;
	font-size: 12px;
	margin-left: auto;
}
.df_buttons {
	margin-top: 6px;
}
.df_reset {
	display: block;
	text-align: center;
	margin-top: 8px;
	color: #777;
	text-decoration: underline;
	font-size: 13px;
}
.df_reset:hover {
	color: #0092cc;
}
@media (max-width: 767px) {
	.dial_filter_box {
		padding: 12px;
	}
	.df_option {
		padding: 6px 0;
	}
}
/* --- Фильтр: AJAX-режим, состояние загрузки --- */
.df_loading {
	color: #0092cc;
	font-size: 16px;
	margin-left: 10px;
	vertical-align: middle;
}
.dial_filter_box.updating {
	opacity: 0.6;
	pointer-events: none;
}
/* --- Фильтр: ползунок цены + сворачиваемые группы --- */
.df_price_slider {
	padding: 6px 8px 2px;
}
.df_slider_track {
	position: relative;
	height: 6px;
	margin: 12px 6px;
	border-radius: 3px;
	background: #e2e8ea;
	cursor: pointer;
}
.df_slider_range {
	position: absolute;
	top: 0;
	height: 6px;
	border-radius: 3px;
	background: #00b0f0;
}
.df_slider_handle {
	position: absolute;
	top: 50%;
	width: 16px;
	height: 16px;
	margin: -8px 0 0 -8px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid #00b0f0;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
	cursor: grab;
	transition: transform 0.1s;
}
.df_slider_handle:hover {
	transform: scale(1.15);
}
.df_slider_handle:active {
	cursor: grabbing;
	border-color: #0092cc;
}
.df_price_view {
	font-size: 12.5px;
	font-weight: 400;
	color: #0092cc;
	white-space: nowrap;
}
.df_group_collapse .df_group_title {
	cursor: pointer;
	user-select: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.df_group_collapse .df_caret::before {
	content: "\f0d7";
	color: #0092cc;
	font-size: 13px;
	transition: transform 0.15s;
}
.df_group_collapse.df_closed .df_caret::before {
	transform: rotate(-90deg);
}
.df_group_collapse .df_group_body {
	display: block;
}
.df_group_collapse.df_closed .df_group_body {
	display: none;
}
.df_group_price .df_group_title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
}
/* --- Фильтр: несовместимые опции затемнены и зачёркнуты --- */
.df_option_dim {
	opacity: 0.45;
	cursor: not-allowed;
}
.df_option_dim .df_option_name {
	text-decoration: line-through;
	color: #999 !important;
}
.df_option_dim .df_cnt {
	color: #bbb;
}
.df_option_dim input[type="checkbox"] {
	opacity: 0.4;
}

/* --- Фильтр: пустая выдача --- */
.df_empty_result {
	text-align: center;
	padding: 30px 20px;
}
/* FIX 2026-10i: корзина в шапке — высота как у поиска (40px), одна строка, аккуратная иконка */
#cart .mini_cart{margin:1px 0 0;height:40px;padding:0 14px;display:inline-flex;align-items:center;line-height:16px}
#cart .mini_cart .cart_holder{position:relative;height:auto;padding:0 0 0 32px;white-space:nowrap;display:inline-flex;align-items:center}
#cart .mini_cart .icon-basket{font-size:24px;position:absolute;left:2px;top:50%;margin-top:-12px}
#cart .mini_cart .icon-basket:before{line-height:24px}
#cart .mini_cart .count{top:22px;left:16px;width:18px;height:18px;line-height:18px;font-size:11px}
#cart .mini_cart .total{display:inline;font-size:14px;margin-left:6px}
#cart .mini_cart .icon-down-dir{margin-left:4px}

/* FIX 2026-10j: компактная строка шапки + счётчик корзины на иконку */
.header_sticky .row.header{display:flex;align-items:center}
.logo img{height:72px;width:auto}
#cart .mini_cart .cart_holder{position:static}
#cart .mini_cart .count{position:absolute;top:19px;left:17px;width:16px;height:16px;line-height:16px;font-size:10px}

.header_sticky .logo img{max-height:64px !important}
.header_sticky .logo{height:64px;line-height:64px}

.header_sticky .row.header{padding-top:12px;padding-bottom:14px}

.header_wrapper{min-height:0 !important}

/* 2026-10f: большой спиннер фильтра по центру товарной области */
.df_overlay{position:fixed;z-index:9999;transform:translate(-50%,-50%);display:none;background:transparent;border:0;box-shadow:none;padding:0;}
.df_overlay .fa-spinner{font-size:96px;color:#00b0f0;}

/* 2026-10h: объёмные поля формы обратной связи (в стиле кнопок) */
.dial_contact_form .form-control{border:1px solid #c9c9c9;box-shadow:0 1px 2px rgba(0,0,0,.15);border-radius:3px;}
.dial_contact_form .form-control:focus{border-color:#00b0f0;box-shadow:0 1px 2px rgba(0,0,0,.15);outline:none;}

/* 2026-10i: капча и кнопка отправки в одной строке (v54 — фикс после усиления) */
.dial_captcha_row{display:flex;align-items:flex-end;flex-wrap:wrap;margin-bottom:15px;width:100%;}
.dial_captcha_block label{display:block;margin-bottom:5px;}
.dial_captcha_line{display:flex;align-items:center;gap:8px;}
.dial_captcha_line .form-control{flex:0 0 170px;width:170px;height:38px;max-width:170px;}
.dial_captcha_line img{flex:0 0 auto;height:36px;width:auto;border:1px solid #c9c9c9;border-radius:3px;box-shadow:0 1px 2px rgba(0,0,0,.15);cursor:pointer;}
.dial_captcha_reload{flex:0 0 auto;width:38px;height:38px;padding:0;border-radius:0;position:relative;}
.dial_captcha_reload i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;line-height:1;}
.dial_submit_inline{margin-left:8px;}
.dial_submit_inline .btn{height:38px;}
#tab-questions .dial_captcha_line .form-control{flex:0 0 170px;width:170px;height:38px;max-width:170px;}
#tab-questions .dial_captcha_line img{flex:0 0 auto;height:36px;width:auto;}
#tab-questions .dial_captcha_line .btn{flex:0 0 auto;width:38px;height:38px;padding:0;border-radius:0;position:relative;}
#tab-questions .dial_captcha_line .btn i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}

/* 2026-10j: модальное окно политики конфиденциальности — 2/3 ширины */
#modal-agree .modal-dialog{width:66.67%;max-width:900px;margin:30px auto;}
#modal-agree .modal-content{border-radius:8px;border:1px solid #c9c9c9;box-shadow:0 2px 8px rgba(0,0,0,.25);}
#modal-agree .modal-header{background:#fff;border-bottom:1px solid #e5e5e5;border-radius:8px 8px 0 0;padding:16px 24px;}
#modal-agree .modal-header h4{font-size:18px;font-weight:700;color:#333;}
#modal-agree .modal-body{padding:24px 32px;max-height:calc(100vh - 160px);overflow-y:auto;}
#modal-agree .modal-body h2{font-size:20px;margin:0 0 16px;}
#modal-agree .modal-body h3{font-size:16px;margin:20px 0 8px;}
#modal-agree .modal-body ul{margin:0 0 10px;padding-left:20px;}
#modal-agree .modal-body li{margin-bottom:5px;}
@media (max-width:768px){#modal-agree .modal-dialog{width:95%;margin:15px auto;}}
