@charset "UTF-8";
/* ==========================================================================
   dp-ui.css — єдиний стиль кнопок і кольорів сайту (варіант A, 25.10.2026).
   Підключається останнім (headers/header9.tpl), тому перекриває розкидані старі правила.

   УСІ КОЛЬОРИ Й РОЗМІРИ — ТІЛЬКИ ТУТ, у блоці :root нижче.
   Щоб змінити фірмовий колір усього сайту, достатньо поміняти --dp-primary (і за бажанням --dp-primary-hover).
   ========================================================================== */
:root {
	/* кольори */
	--dp-primary:        #6E0A6E;   /* сливовий: головні кнопки, акценти */
	--dp-primary-hover:  #560856;   /* той самий, темніший — наведення */
	--dp-on-primary:     #FFFFFF;   /* текст на сливовому */
	--dp-soft:           #F7EDF7;   /* світло-сливовий: другорядні кнопки, плашки */
	--dp-soft-hover:     #EEDBEE;
	--dp-line:           #E9DCE9;   /* рамки й розділювачі */
	--dp-ink:            #241A30;   /* основний текст */
	--dp-muted:          #6F6479;   /* другорядний текст */
	--dp-surface:        #FFFFFF;   /* фон карток і вікон */
	--dp-success:        #2E7D4F;
	--dp-success-bg:     #EAF6EF;
	--dp-danger:         #C0392B;
	--dp-disabled:       #F1EEF3;   /* «Немає в наявності» */
	--dp-disabled-ink:   #9A90A4;
	--dp-bar:            var(--dp-primary);   /* стрічка категорій і футер (замість градієнта) */
	--dp-overlay:        rgba(36, 26, 48, .45);
	--dp-star:           #B98AB9;   /* зірки рейтингу — м'який сливовий, всюди однакові */
	--dp-star-empty:     #EADCEA;
	--dp-badge-sale:     #3D1240;   /* знижка: темна слива (акція/подарунок — --dp-primary) */
	--dp-focus:          0 0 0 3px rgba(110, 10, 110, .16);
	/* яскрава кнопка «Купити» на сторінці товару (головна і в липкій панелі) — єдине місце з градієнтом */
	--dp-cta:            #D0197F;
	--dp-cta-hover:      #B81470;
	--dp-cta-grad:       linear-gradient(135deg, #E8277E 0%, #C8137F 55%, #A80E86 100%);
	--dp-cta-glow:       0 10px 24px rgba(208, 25, 127, .38);

	/* форма кнопок */
	--dp-radius-pill:    999px;
	--dp-radius-card:    20px;
	--dp-btn-lg:         48px;      /* головна дія сторінки: «Купити» в товарі, «Оформити замовлення» */
	--dp-btn-md:         40px;      /* кнопки в картках і списках */
	--dp-btn-sm:         32px;      /* дрібні: чіпи, степери */
	--dp-btn-size:       15px;      /* кегль кнопок */
	--dp-btn-size-sm:    14px;
	--dp-btn-weight:     600;
	--dp-shadow-drawer:  -18px 0 50px rgba(36, 26, 48, .18);
}

/* ==========================================================================
   1. Головні кнопки (заливка сливовим)
   ========================================================================== */
html body .dp-btn,
html body .btn-primary,
html body .product-thumb .button-group .theme-btn-add-cart:not(.dp-unavailable),
html body .product-layout .theme-btn-add-cart:not(.dp-unavailable),
html body a.theme-btn-add-cart,
html body .ldev-card-product .ldev-buy-btn,
html body .ldev-card-product button[onclick*="cart.add"],
html body #product #button-cart.theme-btn-add-cart:not(.dp-unavailable),
html body #dpBar #dpBarBuy:not([disabled]):not(.dp-x),
html body #sticky-product-bar .theme-btn-add-cart:not([disabled]):not(.dp-x),
html body .sticky-bar-container .theme-btn-add-cart:not([disabled]):not(.dp-x),
html body .dpx2-buy,
html body a.dpr-read,
html body a.dprv-btn,
html body #dp-404-btn,
html body #dpc-submit.dpc-submit,
html body a.dbr-btn:not(.dbr-btn--ghost),
html body #cart .dp-cart .cart-button .btn-primary,
html body .dpv-row__buy,
html body .dpw-row__buy,
html body #dp-toast .dp-toast__act,
html body .dpk-go {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px;
	height: var(--dp-btn-md) !important;
	min-height: 0 !important;
	padding: 0 22px !important;
	border: 0 !important;
	border-radius: var(--dp-radius-pill) !important;
	background: var(--dp-primary) !important;
	background-image: none !important;
	color: var(--dp-on-primary) !important;
	font-size: var(--dp-btn-size) !important; font-weight: var(--dp-btn-weight) !important; line-height: 1.1 !important; font-family: inherit !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-decoration: none !important;
	text-shadow: none !important;
	box-shadow: none !important;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .15s ease, transform .15s ease;
}
html body .dp-btn:hover, html body .btn-primary:hover, html body .btn-primary:focus,
html body .product-thumb .button-group .theme-btn-add-cart:not(.dp-unavailable):hover,
html body .product-layout .theme-btn-add-cart:not(.dp-unavailable):hover,
html body a.theme-btn-add-cart:hover,
html body .ldev-card-product .ldev-buy-btn:hover,
html body .ldev-card-product button[onclick*="cart.add"]:hover,
html body #product #button-cart.theme-btn-add-cart:not(.dp-unavailable):hover,
html body #dpBar #dpBarBuy:not([disabled]):not(.dp-x):hover,
html body .dpx2-buy:hover,
html body a.dpr-read:hover, html body a.dprv-btn:hover,
html body #dp-404-btn:hover,
html body #dpc-submit.dpc-submit:hover,
html body a.dbr-btn:not(.dbr-btn--ghost):hover,
html body #cart .dp-cart .cart-button .btn-primary:hover,
html body .dpv-row__buy:hover, html body .dpw-row__buy:hover,
html body #dp-toast .dp-toast__act:hover,
html body .dpk-go:hover {
	background: var(--dp-primary-hover) !important;
	color: var(--dp-on-primary) !important;
}
/* іконки всередині кнопок — колір тексту кнопки */
html body .btn-primary i, html body .theme-btn-add-cart i, html body .ldev-buy-btn i,
html body #dpBarBuy i, html body .dpv-row__buy i, html body .dpw-row__buy i { color: inherit !important; }

/* великі: головна дія сторінки */
html body .dp-btn--lg,
html body #product #button-cart.theme-btn-add-cart:not(.dp-unavailable):not(.dp-x),
html body #dpc-submit.dpc-submit,
html body #dp-404-btn,
html body a.dbr-btn.dbr-btn,
html body #cart .dp-cart .cart-button .btn-primary {
	height: var(--dp-btn-lg) !important;
	padding: 0 28px !important;
	font-size: 16px !important;
}
/* малі: у вузьких рядках панелей */
html body .dp-btn--sm,
html body .dpv-row__buy,
html body .dpw-row__buy,
html body #dp-toast .dp-toast__act {
	height: var(--dp-btn-sm) !important;
	padding: 0 14px !important;
	font-size: var(--dp-btn-size-sm) !important; font-weight: var(--dp-btn-weight) !important;
}

/* ==========================================================================
   2. Другорядні кнопки (світло-сливові)
   ========================================================================== */
html body .dp-btn--soft,
html body a.dbr-btn.dbr-btn--ghost,
html body .dbr-more,
html body .dp-rev-more button,
html body #dpBriefMore.dp-brief__more {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px;
	height: var(--dp-btn-md) !important;
	padding: 0 22px !important;
	border: 0 !important;
	border-radius: var(--dp-radius-pill) !important;
	background: var(--dp-soft) !important;
	background-image: none !important;
	color: var(--dp-primary) !important;
	font-size: var(--dp-btn-size) !important; font-weight: var(--dp-btn-weight) !important; line-height: 1.1 !important; font-family: inherit !important;
	text-decoration: none !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: background-color .15s ease;
}
html body .dp-btn--soft:hover,
html body a.dbr-btn.dbr-btn--ghost:hover,
html body .dbr-more:hover,
html body .dp-rev-more button:hover,
html body #dpBriefMore.dp-brief__more:hover {
	background: var(--dp-soft-hover) !important;
	color: var(--dp-primary) !important;
}
/* «Читати далі» лежить на темному блоці — там лишаємо білий контур */
html body #dpBriefMore.dp-brief__more { background: transparent !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .7) !important; }
html body #dpBriefMore.dp-brief__more:hover { background: rgba(255, 255, 255, .14) !important; color: #fff !important; }

/* «Немає в наявності» — неактивна */
html body .theme-btn-add-cart.dp-unavailable,
html body .theme-btn-add-cart[disabled] {
	height: var(--dp-btn-md) !important;
	border: 0 !important;
	border-radius: var(--dp-radius-pill) !important;
	background: var(--dp-disabled) !important;
	background-image: none !important;
	color: var(--dp-disabled-ink) !important;
	font-size: var(--dp-btn-size) !important; font-weight: var(--dp-btn-weight) !important; line-height: 1.1 !important; font-family: inherit !important;
	box-shadow: none !important;
	cursor: default;
}

/* ==========================================================================
   3. Степери кількості — пігулка з контуром
   ========================================================================== */
html body .ldev-card-product-qty,
html body #dpBar .dp-bar-qty,
html body .theme-quantity,
html body #cart .dp-cart .qty-stepper {
	border-radius: var(--dp-radius-pill) !important;
}
html body .ldev-qty-btn,
html body .dp-bar-step,
html body #minus-quantity, html body #plus-quantity {
	color: var(--dp-primary) !important;
}

/* ==========================================================================
   4. Градієнти → рівний колір
   ========================================================================== */
@media (min-width: 992px) {
	html body .dp-sticky-menu,
	html body .dp-sticky-menu .oc_mm,
	html body .oc_mm {
		background: var(--dp-bar) !important;
		background-image: none !important;
	}
	html body .dp-search-col #search .input-group-btn .btn {
		background: var(--dp-primary) !important;
		background-image: none !important;
	}
	html body .dp-search-col #search .input-group-btn .btn:hover { background: var(--dp-primary-hover) !important; filter: none; }
	html body .dp-search-col #search { border-color: var(--dp-primary) !important; }
}
@media (max-width: 991px) {
	html body .search-compact #search .input-group-btn .btn { background: var(--dp-primary) !important; background-image: none !important; }
	html body .search-compact #search { border-color: var(--dp-primary) !important; }
}

/* ==========================================================================
   5. Сповіщення (кошик більше не показує сповіщення — відкривається сам; лишились закладки й порівняння)
   Перенесено з common/cart.tpl без змін, крім кольорів кнопки.
   ========================================================================== */
#dp-toast { position: fixed; z-index: 100060; top: 96px; right: 24px; width: 390px; max-width: calc(100vw - 32px); box-sizing: border-box;
	display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; padding: 14px 34px 16px 14px;
	background: rgba(255, 255, 255, .97); border: 1px solid #efe6f4; border-radius: 20px; overflow: hidden;
	box-shadow: 0 22px 50px rgba(36, 18, 54, .22), 0 2px 6px rgba(36, 18, 54, .06);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	opacity: 0; transform: translateX(40px) scale(.96); transition: opacity .28s ease, transform .38s cubic-bezier(.2, 1.25, .4, 1);
	font-family: inherit; cursor: default; }
#dp-toast.is-on { opacity: 1; transform: none; }
#dp-toast .dp-toast__ic { width: 44px; height: 44px; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #fff;
	background: var(--dp-primary); transform: scale(.4); transition: transform .45s cubic-bezier(.2, 1.6, .4, 1) .08s; }
#dp-toast.is-on .dp-toast__ic { transform: scale(1); }
#dp-toast.dp-toast--wish.is-on .dp-toast__ic svg { animation: dpBeat 1s ease .35s 2; }
#dp-toast.dp-toast--info .dp-toast__ic { background: var(--dp-soft); color: var(--dp-primary); }
@keyframes dpBeat { 0%, 100% { transform: scale(1); } 30% { transform: scale(1.22); } 60% { transform: scale(.94); } }
#dp-toast .dp-toast__ic svg { width: 22px; height: 22px; display: block; }
#dp-toast .dp-toast__body { min-width: 0; }
#dp-toast .dp-toast__title { font-size: 14.5px; font-weight: 800; color: var(--dp-ink); line-height: 1.3; }
#dp-toast .dp-toast__name { margin-top: 2px; font-size: 13px; color: var(--dp-muted); line-height: 1.35; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#dp-toast .dp-toast__bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--dp-primary); transform-origin: left; opacity: .45; }
#dp-toast.is-on .dp-toast__bar { animation: dpToastBar 4.2s linear forwards; }
#dp-toast.is-hold .dp-toast__bar { animation-play-state: paused; }
@keyframes dpToastBar { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@media (max-width: 767px) {
	#dp-toast { top: auto; right: 10px; left: 10px; bottom: calc(66px + env(safe-area-inset-bottom)); width: auto; max-width: none; transform: translateY(30px) scale(.96); grid-template-columns: 40px 1fr auto; gap: 10px; padding: 12px 30px 14px 12px; border-radius: 18px; }
	#dp-toast .dp-toast__ic { width: 40px; height: 40px; border-radius: 12px; }
	body.dp-bn-buy #dp-toast { bottom: calc(122px + env(safe-area-inset-bottom)); }
}
@media (max-width: 767px) { body:has(#dp-toast.is-on) #scroller { opacity: 0 !important; pointer-events: none !important; } }
@media (prefers-reduced-motion: reduce) { #dp-toast, #dp-toast .dp-toast__ic { transition: opacity .2s ease !important; transform: none !important; } }

/* ==========================================================================
   6. Кружечки закриття по всьому сайту (як були — подобаються). Перенесено з common/cart.tpl без змін.
   ========================================================================== */
html body .modal .close, html body .alert .close, html body .dpk-x, html body .dpw__x, html body .dpc-modal__x, html body .dp-modal__x, html body .dpc-lb__x,
html body .dpv-close, html body .dpc-close, html body .dpw-close, html body #mm-remove-horizontal, html body .ocf-close-mobile,
html body .close-top-notice, html body .close-bottom-notice, html body [class*="close-anystore-notice"] {
	flex: 0 0 auto !important; text-align: center !important;
	width: 34px !important; height: 34px !important; min-width: 34px !important; padding: 0 !important;
	border: 0 !important; border-radius: 50% !important; box-shadow: none !important;
	opacity: 1 !important; text-shadow: none !important; text-decoration: none !important;
	cursor: pointer; transition: background-color .15s ease, transform .2s ease;
}
html body .modal .close:hover, html body .alert .close:hover, html body .dpk-x:hover, html body .dpw__x:hover, html body .dpc-modal__x:hover, html body .dp-modal__x:hover, html body .dpc-lb__x:hover,
html body .dpv-close:hover, html body .dpc-close:hover, html body .dpw-close:hover, html body #mm-remove-horizontal:hover, html body .ocf-close-mobile:hover { transform: rotate(90deg); }
html body .ocf-close-mobile .ocf-icon { display: none !important; }
html body .modal .close span { line-height: 1 !important; }
/* хрестик — SVG-фон по центру кружечка; текст «×» та іконки всередині ховаються */
html body .modal .close, html body .alert .close, html body .dpk-x, html body .dpw__x, html body .dpc-modal__x, html body .dp-modal__x, html body .dpc-lb__x, html body .dpv-close, html body .dpc-close, html body .dpw-close, html body #mm-remove-horizontal, html body .ocf-close-mobile, html body .close-top-notice, html body .close-bottom-notice, html body [class*="close-anystore-notice"], html body #cart .dp-cart .minicart-close {
	font-size: 0 !important; color: transparent !important; line-height: 34px !important;
	background: #f6eff8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B2A86' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 15px 15px no-repeat !important;
}
html body .modal .close:hover, html body .alert .close:hover, html body .dpk-x:hover, html body .dpw__x:hover, html body .dpc-modal__x:hover, html body .dp-modal__x:hover, html body .dpc-lb__x:hover, html body .dpv-close:hover, html body .dpc-close:hover, html body .dpw-close:hover, html body #mm-remove-horizontal:hover, html body .ocf-close-mobile:hover, html body .close-top-notice:hover, html body .close-bottom-notice:hover, html body [class*="close-anystore-notice"]:hover, html body #cart .dp-cart .minicart-close:hover { background-color: #ecdff2 !important; }
html body .modal .close > *, html body .alert .close > *, html body .dpk-x > *, html body .dpw__x > *, html body .ocf-close-mobile > *, html body #cart .dp-cart .minicart-close > *, html body .dpv-close > *, html body .dpc-close > *, html body .dpw-close > * { display: none !important; }
html body #mm-remove-horizontal::before, html body .ocf-close-mobile::after { content: none !important; }
html body #dp-toast .dp-toast__x { position: absolute; top: 6px; right: 8px; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; font-size: 0; background: #f6eff8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B2A86' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 10px 10px no-repeat; }
html body #dp-toast .dp-toast__x:hover { background-color: #ecdff2; }
/* на темному фоні — білий */
html body #dpw-note-x, html body #dpX.dp-x { text-align: center !important; width: 30px !important; height: 30px !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important; opacity: 1 !important; cursor: pointer; font-size: 0 !important; color: transparent !important; background: rgba(255, 255, 255, .2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 13px 13px no-repeat !important; }
html body #dpX.dp-x { width: 40px !important; height: 40px !important; background-size: 17px 17px !important; }
html body #dpw-note-x:hover, html body #dpX.dp-x:hover { background-color: rgba(255, 255, 255, .32) !important; }

/* ==========================================================================
   7. Мегаменю на комп'ютері: панелі з картинками (картриджі, RF) — рівна сітка однакових карток
   Колонки й списки теми стають «прозорими» (display: contents), тож усі пункти йдуть однією сіткою.
   Висота картинки менша на невисоких екранах, щоб панель вміщалась без прокрутки.
   ========================================================================== */
@media (min-width: 992px) {
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) { --dp-mm-img: 56px; }
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-subcategory,
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-subcategory > li {
		display: block !important; float: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; border: 0 !important;
	}
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-subcategory > li > .row {
		display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; width: 100% !important;
		margin: 0 !important; padding: 4px 0 !important;
	}
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-subcategory > li > .row::before,
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-subcategory > li > .row::after { content: none !important; display: none !important; }
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-subcategory > li > .row > [class*="col-"],
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu,
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul { display: contents !important; }
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul > li {
		display: flex !important; flex-direction: column; align-items: center; gap: 8px;
		float: none !important; width: auto !important; min-width: 0; height: auto !important;
		margin: 0 !important; padding: 8px 6px 10px !important;
		border: 0 !important; border-radius: 16px; background: transparent !important;
		text-align: center !important; transition: background-color .15s ease;
	}
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul > li:hover { background: var(--dp-soft) !important; }
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul > li > a.mm-submenu-main {
		display: flex !important; align-items: center; justify-content: center;
		width: 100% !important; height: var(--dp-mm-img) !important; margin: 0 !important; padding: 0 !important;
		background: none !important; border: 0 !important;
	}
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul > li > a.mm-submenu-main img {
		display: block !important; width: auto !important; height: auto !important;
		max-width: 100% !important; max-height: var(--dp-mm-img) !important;
		margin: 0 auto !important; padding: 0 !important; border: 0 !important; object-fit: contain;
	}
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul > li > p {
		width: 100%; min-height: 2.6em; margin: 0 !important; padding: 0 !important; font-size: 14px !important; line-height: 1.3 !important; text-align: center !important;
	}
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul > li > p a {
		display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
		margin: 0 !important; padding: 0 !important;
		color: var(--dp-ink) !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.3 !important;
		text-align: center !important; text-decoration: none !important; white-space: normal !important;
	}
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-menu > ul > li:hover > p a { color: var(--dp-primary) !important; }
}
@media (min-width: 992px) and (min-height: 900px) {
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) { --dp-mm-img: 72px; }
}
@media (min-width: 992px) and (min-height: 1000px) {
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) { --dp-mm-img: 96px; }
}
@media (min-width: 992px) and (max-width: 1199px) {
	html body .oc_mm ul.mm > li.mm-submenu-exist:has(.mm-menu img) .mm-subcategory > li > .row { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
/* ==========================================================================
   8. Зірки, бейджі, форми, футер
   ========================================================================== */
html body .rating .fa-star, html body .rating .fa-star-half-o, html body .rating .fa-stack .fa-star,
html body .ldev-card-product .fa-star, html body .product-thumb .rating .fa-star { color: var(--dp-star) !important; font-size: 16px !important; }
html body .rating .fa-star-o, html body .rating .fa-stack .fa-star-o { color: var(--dp-star-empty) !important; font-size: 16px !important; }
/* у картках товарів зірки дрібні: 13px на комп'ютері, 12px на телефоні */
html body .product-thumb .rating .fa-stack, html body .ldev-card-product .rating .fa-stack { width: 1.15em !important; height: 1em !important; line-height: 1em !important; font-size: 13px !important; margin: 0 1px 0 0 !important; }
html body .product-thumb .rating .fa, html body .ldev-card-product .rating .fa,
html body .product-thumb .rating .fa-stack .fa, html body .ldev-card-product .rating .fa-stack .fa { font-size: 13px !important; line-height: 1em !important; }
@media (max-width: 767px) {
	html body .product-thumb .rating .fa-stack, html body .ldev-card-product .rating .fa-stack,
	html body .product-thumb .rating .fa, html body .ldev-card-product .rating .fa,
	html body .product-thumb .rating .fa-stack .fa, html body .ldev-card-product .rating .fa-stack .fa { font-size: 12px !important; }
	html body .product-thumb .price, html body .product-thumb .price-new, html body .product-thumb .price span:not(.price-old) { color: var(--dp-ink) !important; }
}

/* бейджі: одна пігулка — акція/подарунок сливовим, знижка темною сливою, без «кричущих» великих літер */
html body .xdstickers, html body .stiker-sale, html body .discount-sticker {
	display: inline-flex !important; align-items: center !important;
	height: 26px !important; min-height: 0 !important; padding: 0 12px !important;
	border: 0 !important; border-radius: var(--dp-radius-pill) !important;
	font-size: 12.5px !important; font-weight: 700 !important; line-height: 1 !important; letter-spacing: 0 !important;
	box-shadow: none !important; width: auto !important;
}
html body .xdstickers { margin: 0 0 6px !important; background: var(--dp-primary) !important; color: var(--dp-on-primary) !important; text-transform: lowercase !important; }
html body .xdstickers::first-letter { text-transform: uppercase; }
html body .xdstickers.xdsticker_bestseller, html body .xdstickers[class*="stock"] { text-transform: none !important; }
html body .stiker-sale, html body .discount-sticker { background: var(--dp-badge-sale) !important; color: #fff !important; }

/* поля форм у вмісті сторінок */
html body #content .form-control:not(.qty-input):not(#input-quantity):not([class*="ocf"]):not([name="search"]),
html body #content input[type="text"].form-control, html body #content input[type="email"], html body #content input[type="tel"], html body #content input[type="password"] {
	height: 48px; padding: 0 16px; border: 1px solid var(--dp-line) !important; border-radius: 14px !important;
	box-shadow: none !important; font-size: 15px; color: var(--dp-ink); background: var(--dp-surface);
	transition: border-color .15s ease, box-shadow .15s ease;
}
html body #content textarea.form-control { height: auto; min-height: 120px; padding: 12px 16px; }
html body #content .form-control:focus, html body #content input:focus, html body #content textarea:focus {
	border-color: var(--dp-primary) !important; box-shadow: var(--dp-focus) !important; outline: 0 !important;
}

/* ==========================================================================
   14. Футер: темна слива. ПК — 4 колонки (контакти, асортимент, доставка, покупцям) і нижня смуга.
   Телефон — спершу контакти (телефон, месенджери, години), далі розділи-«гармошки».
   Розмітка — у налаштуваннях теми (блок під футером, UA/RU), стилі тут.
   ========================================================================== */
:root {
	--dp-footer-bg:   #2A0F2E;
	--dp-footer-ink:  #EADCEA;
	--dp-footer-link: #CDB6D0;
	--dp-footer-line: rgba(234, 220, 234, .14);
}
html body footer { background: var(--dp-footer-bg) !important; background-image: none !important; color: var(--dp-footer-ink) !important; padding: 0 !important; }
html body footer .container.type-footer1, html body footer > .container { padding-top: 40px !important; padding-bottom: 8px !important; }
html body footer .container > .row { margin-left: 0 !important; margin-right: 0 !important; }
html body footer .bottom-footer .row > [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; }
html body footer .under-footer { float: none !important; width: 100% !important; padding: 0 !important; }
html body footer .dpf {
	display: grid; grid-template-columns: 1.25fr 1.2fr 1fr 1fr; gap: 32px; align-items: start;
	color: var(--dp-footer-ink); font-size: 14px; line-height: 1.55; text-align: left;
}
html body footer .dpf p { margin: 0 0 8px !important; color: var(--dp-footer-ink) !important; }
html body footer .dpf b { color: #fff !important; font-weight: 600; }
html body footer .dpf-brand { color: #fff; font-size: 16px; font-weight: 700; margin: 0 0 14px; }
html body footer .dpf-ask { color: var(--dp-footer-link); font-size: 13.5px; margin: 0 0 4px; }
html body footer a.dpf-phone { display: inline-block; color: #fff !important; font-size: 22px; font-weight: 700; letter-spacing: .01em; text-decoration: none !important; margin: 0 0 12px; }
html body footer a.dpf-phone:hover { color: #F3C9F5 !important; }
html body footer .dpf-ms { display: flex; gap: 10px; margin: 0 0 14px; }
html body footer .dpf-ms a { display: inline-flex; width: 40px; height: 40px; border-radius: 50%; align-items: center; justify-content: center; background: rgba(255, 255, 255, .08); transition: background-color .15s; }
html body footer .dpf-ms a:hover { background: rgba(255, 255, 255, .16); }
html body footer .dpf-ms img { width: 28px !important; height: 28px !important; margin: 0 !important; background: transparent !important; }
html body footer .dpf-ship { padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .06); font-size: 13.5px; }
html body footer .dpf-col summary {
	list-style: none; display: block; cursor: default; margin: 0 0 12px; color: #fff; font-size: 15px; font-weight: 600; line-height: 1.35;
}
html body footer .dpf-col summary::-webkit-details-marker { display: none; }
html body footer .dpf-col ul { list-style: none; margin: 0; padding: 0; }
html body footer .dpf-col li { margin: 0 0 7px; padding: 0; color: var(--dp-footer-link); font-size: 14px; line-height: 1.45 !important; }
html body footer .dpf-col li a { display: inline !important; padding: 0 !important; line-height: inherit !important; font-size: 14px !important; }
html body footer .dpf a:not(.dpf-phone) { color: var(--dp-footer-link) !important; text-decoration: none !important; }
html body footer .dpf a:not(.dpf-phone):hover { color: #fff !important; }
html body footer .dpf-bye { grid-column: 1 / -1; padding-top: 18px; border-top: 1px solid var(--dp-footer-line); color: var(--dp-footer-link); font-size: 13.5px; }
html body footer .bottom-footer { background: transparent !important; border: 0 !important; padding: 0 0 20px !important; }
html body footer .bottom-footer, html body footer .bottom-footer * { color: rgba(234, 220, 234, .6) !important; font-size: 12.5px !important; }
html body footer .bottom-footer .powered-block { text-align: left !important; }
@media (min-width: 768px) and (max-width: 1199px) {
	html body footer .dpf { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
	html body footer .container.type-footer1, html body footer > .container, html body footer .bottom-footer .container { padding-left: 18px !important; padding-right: 18px !important; }
	html body footer .container.type-footer1, html body footer > .container { padding-top: 28px !important; }
	html body footer .dpf { grid-template-columns: 1fr; gap: 0; }
	html body footer .dpf-contact { padding-bottom: 18px; margin-bottom: 4px; border-bottom: 1px solid var(--dp-footer-line); }
	html body footer a.dpf-phone { font-size: 24px; }
	html body footer .dpf-ms a { width: 44px; height: 44px; }
	html body footer .dpf-col { border-bottom: 1px solid var(--dp-footer-line); }
	html body footer .dpf-col summary { cursor: pointer; margin: 0; padding: 15px 28px 15px 0; position: relative; }
	html body footer .dpf-col summary::after {
		content: ''; position: absolute; right: 4px; top: 50%; width: 8px; height: 8px; margin-top: -6px;
		border-right: 2px solid var(--dp-footer-link); border-bottom: 2px solid var(--dp-footer-link); transform: rotate(45deg); transition: transform .2s;
	}
	html body footer .dpf-col[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
	html body footer .dpf-col ul { padding: 0 0 14px; }
	html body footer .dpf-col li { margin: 0; padding: 5px 0; }
	html body footer .dpf-bye { border-top: 0; padding-top: 16px; }
	/* місце під нижнє меню і кнопку «вгору» */
	html body footer .bottom-footer { padding-bottom: 96px !important; }
}
/* ==========================================================================
   15. Закладки (/wishlist — гість і кабінет): картки як у каталозі, порожній стан
   ========================================================================== */
html body .dp-wl { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin: 4px 0 24px; }
@media (max-width: 1199px) { html body .dp-wl { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 991px) { html body .dp-wl { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { html body .dp-wl { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
html body .dp-wl__card {
	position: relative; display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 12px;
	background: var(--dp-surface); border: 1px solid var(--dp-line); border-radius: 20px;
}
html body .dp-wl__img { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; border-radius: 14px; background: var(--dp-soft); overflow: hidden; margin-bottom: 4px; }
html body .dp-wl__img img { width: 82%; height: 82%; object-fit: contain; mix-blend-mode: multiply; }
html body a.dp-wl__del {
	position: absolute; top: 18px; right: 18px; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	background: var(--dp-surface); color: var(--dp-muted) !important; box-shadow: 0 2px 8px rgba(36, 26, 48, .12); text-decoration: none !important;
}
html body a.dp-wl__del:hover { color: var(--dp-danger) !important; }
html body a.dp-wl__name {
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; min-height: 3.9em;
	color: var(--dp-ink) !important; font-size: 14.5px; font-weight: 600; line-height: 1.3; text-decoration: none !important;
}
html body a.dp-wl__name:hover { color: var(--dp-primary) !important; }
html body .dp-wl__stock { color: var(--dp-success); font-size: 12.5px; }
html body .dp-wl__stock.is-out { color: var(--dp-muted); }
html body .dp-wl__price { margin-top: auto; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
html body .dp-wl__new { color: var(--dp-ink); font-size: 17px; font-weight: 800; }
html body .dp-wl__old { color: var(--dp-muted); font-size: 13px; }
html body .dp-wl__buy {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: var(--dp-btn-md); margin-top: 6px; padding: 0 12px;
	border: 0; border-radius: var(--dp-radius-pill); background: var(--dp-primary); color: var(--dp-on-primary);
	font-size: var(--dp-btn-size-sm); font-weight: var(--dp-btn-weight); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html body .dp-wl__buy:hover { background: var(--dp-primary-hover); }
html body .dp-wl__buy.is-off { background: var(--dp-disabled); color: var(--dp-disabled-ink); cursor: default; }
html body .dp-wl-wrap .buttons { margin-top: 0; }
html body .dp-wl-empty { max-width: 420px; margin: 24px auto 40px; padding: 32px 24px; text-align: center; background: var(--dp-soft); border-radius: 24px; }
html body .dp-wl-empty__ic { width: 64px; height: 64px; margin: 0 auto 12px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--dp-surface); color: var(--dp-primary); }
html body .dp-wl-empty__t { margin: 0 0 6px !important; color: var(--dp-ink); font-size: 18px; font-weight: 700; }
html body .dp-wl-empty__s { margin: 0 0 18px !important; color: var(--dp-muted); font-size: 14.5px; }

/* ==========================================================================
   16. Особистий кабінет (/my-account, шаблон dp_cabinet): ті самі картки, пігулки, рівні кольори
   ========================================================================== */
html body .dpx2 { color: var(--dp-ink); }
html body .dpx2-side, html body .dpx2-card { border-color: var(--dp-line) !important; border-radius: 20px !important; box-shadow: none !important; }
html body .dpx2-ava { background: var(--dp-primary) !important; }
html body .dpx2-tabs button, html body .dpx2-tabs a.dpx2-out { border-radius: 12px !important; color: var(--dp-ink) !important; }
html body .dpx2-tabs button:hover, html body .dpx2-tabs a.dpx2-out:hover { background: var(--dp-soft) !important; }
html body .dpx2-tabs button.on { background: var(--dp-primary) !important; color: var(--dp-on-primary) !important; }
html body .dpx2-hero {
	border-radius: 20px !important;
	background: radial-gradient(120% 120% at 90% 0%, rgba(190, 60, 170, .35) 0%, rgba(190, 60, 170, 0) 60%), #2A0B33 !important;
}
html body .dpx2-stats button { border-radius: 14px !important; border-color: rgba(255, 255, 255, .18) !important; }
html body .dpx2-btn { height: var(--dp-btn-md) !important; border-radius: var(--dp-radius-pill) !important; padding: 0 20px !important; font-size: var(--dp-btn-size-sm) !important; }
html body .dpx2-ghost { background: var(--dp-soft) !important; color: var(--dp-primary) !important; }
html body .dpx2-ghost:hover { background: var(--dp-soft-hover) !important; }
html body .dpx2-status, html body .dpx2-track, html body .dpx2-tag { border-radius: var(--dp-radius-pill) !important; }
html body .dpx2-more { border-radius: var(--dp-radius-pill) !important; border-color: var(--dp-line) !important; }
html body .dpx2-form input, html body .dpx2-pick-q { border-radius: 12px !important; border-color: var(--dp-line) !important; }
/* картки товарів (закладки, «Ви дивилися», підбірки): ціна окремим рядком, «Купити» на всю ширину */
html body .dpx2-grid { gap: 14px !important; }
html body .dpx2-prod { position: relative; padding: 12px !important; border: 1px solid var(--dp-line) !important; border-radius: 20px !important; box-shadow: none !important; }
html body .dpx2-prod:hover { border-color: var(--dp-line) !important; box-shadow: 0 6px 18px rgba(36, 26, 48, .08) !important; }
html body .dpx2-prod-img { border-radius: 14px; background: var(--dp-soft); overflow: hidden; display: flex !important; align-items: center; justify-content: center; }
html body .dpx2-prod-img img { width: 82% !important; height: 82% !important; mix-blend-mode: multiply; }
html body .dpx2-prod-name { color: var(--dp-ink) !important; font-size: 14px !important; font-weight: 600; min-height: 3.9em; }
html body .dpx2-prod-row { flex-direction: column !important; align-items: stretch !important; gap: 8px !important; margin-top: auto; }
html body .dpx2-price { color: var(--dp-ink) !important; font-size: 17px !important; font-weight: 800 !important; }
html body .dpx2-buy {
	width: 100% !important; height: var(--dp-btn-md) !important; padding: 0 12px !important; border-radius: var(--dp-radius-pill) !important;
	font-size: var(--dp-btn-size-sm) !important; font-weight: var(--dp-btn-weight) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html body .dpx2-fav-del { top: 18px !important; right: 18px !important; width: 32px !important; height: 32px !important; background: var(--dp-surface) !important; color: var(--dp-muted) !important; }
html body .dpx2-fav-del:hover { color: var(--dp-danger) !important; }

/* ==========================================================================
   9. Сторінка товару: зона покупки
   ========================================================================== */
/* ціна: актуальна — основним кольором, стара — сіра закреслена */
html body #product .price-new, html body #product .price-new .autocalc-product-special,
html body #product .h2.price-new { color: var(--dp-ink) !important; }
html body #product .price-old, html body #product .price-old .autocalc-product-price {
	color: var(--dp-muted) !important; text-decoration-color: var(--dp-muted) !important; font-weight: 500 !important;
}
/* «Купити» — найсильніший елемент: 52px */
html body #product .dp-buy #button-cart.theme-btn-add-cart:not(.dp-unavailable):not(.dp-x) { height: 52px !important; max-width: none !important; width: auto !important; padding: 0 30px !important; font-size: 16px !important; }
/* степер кількості — пігулка 48px, як у кошику */
html body #product .dp-buy .button-group.btn-icon {
	display: inline-flex !important; align-items: center !important;
	height: 48px !important; padding: 0 4px !important; margin: 0 !important;
	border: 1px solid var(--dp-line) !important; border-radius: var(--dp-radius-pill) !important; background: var(--dp-surface) !important;
}
html body #product .dp-buy .button-group.btn-icon #minus-quantity,
html body #product .dp-buy .button-group.btn-icon #plus-quantity {
	width: 38px !important; height: 38px !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important;
	background: transparent !important; color: var(--dp-primary) !important; font-size: 18px !important; line-height: 1 !important; box-shadow: none !important;
}
html body #product .dp-buy .button-group.btn-icon #minus-quantity:hover,
html body #product .dp-buy .button-group.btn-icon #plus-quantity:hover { background: var(--dp-soft) !important; }
html body #product .dp-buy .button-group.btn-icon #input-quantity {
	width: 40px !important; height: 38px !important; padding: 0 !important; border: 0 !important; background: transparent !important;
	box-shadow: none !important; text-align: center !important; font-size: 16px !important; font-weight: 700 !important; color: var(--dp-ink) !important;
}
@media (max-width: 767px) {
	/* телефон: ціна й степер у рядку, «Купити» — окремим рядком на всю ширину */
	html body #product .dp-buy { flex-wrap: wrap !important; align-items: center; justify-content: space-between; row-gap: 12px; }
	html body #product .dp-buy > .button-group:not(.btn-icon) { flex: 1 1 100% !important; width: 100% !important; margin: 0 !important; }
	html body #product .dp-buy #button-cart.theme-btn-add-cart:not(.dp-unavailable):not(.dp-x) { width: 100% !important; flex: 1 1 auto !important; }
}

/* картка-вступ (Dr. Pen · …): рівний сливовий колір, як було до темного варіанту (без градієнта, світіння й тіні).
   Текст показуємо повністю (без «…»), відступи щільні, плашки в один ряд з переносом. */
html body #product #dpBrief.uzs-article {
	background: var(--dp-primary) !important; background-image: none !important;
	color: #fff !important; border: 0 !important; box-shadow: none !important;
	border-radius: var(--dp-radius-card) !important; margin: 16px 0 20px !important; padding: 0 0 16px !important;
}
html body #product #dpBrief .uzs-hero { background: transparent !important; background-image: none !important; padding: 18px 18px 0 !important; min-height: 0 !important; height: auto !important; }
html body #product #dpBrief .uzs-hero * { max-height: none !important; }
html body #product #dpBrief .uzs-lede, html body #product #dpBrief p, html body #product #dpBrief li {
	color: rgba(255, 255, 255, .92) !important; display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important; text-overflow: clip !important;
	margin: 8px auto 0 !important; font-size: 14.5px !important; line-height: 1.5 !important;
}
html body #product #dpBrief .uzs-eyebrow { color: #E9B8EC !important; font-size: 12px !important; letter-spacing: .06em; margin: 0 !important; }
html body #product #dpBrief .uzs-eyebrow .uzs-dot { background: #E9B8EC !important; }
html body #product #dpBrief .uzs-freq { margin-top: 12px !important; gap: 6px !important; justify-content: center; flex-wrap: wrap !important; }
html body #product #dpBrief .uzs-freq span, html body #product #dpBrief .uzs-tag {
	flex: 0 1 auto !important; width: auto !important; display: inline-block !important;
	background: rgba(255, 255, 255, .12) !important; color: #fff !important; border: 0 !important; box-shadow: none !important;
	border-radius: var(--dp-radius-pill) !important; padding: 5px 11px !important; font-size: 12.5px !important; line-height: 1.3 !important;
}
html body #product #dpBrief .uzs-freq span b, html body #product #dpBrief .uzs-freq span strong { color: #F3C9F5 !important; background: none !important; border: 0 !important; font-weight: 600 !important; }
html body #product #dpBrief .uzs-pen-pulse { margin: 10px auto 0 !important; }
html body #product #dpBrief .uzs-pen-pulse *, html body #product #dpBrief .uzs-pulse-dot { background: #fff !important; background-image: none !important; opacity: .7; }
html body #product #dpBrief #dpBriefMore.dp-brief__more {
	margin-top: 12px !important; height: var(--dp-btn-sm) !important; padding: 0 16px !important; font-size: 14px !important;
	background: transparent !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .7) !important;
}
html body #product #dpBrief #dpBriefMore.dp-brief__more:hover { background: rgba(255, 255, 255, .14) !important; color: #fff !important; }

/* доставка: м'яка картка замість лівої смуги */
html body #product #dp-ship.dp-ship {
	border: 1px solid var(--dp-line) !important; border-left-width: 1px !important; border-radius: 16px !important;
	background: var(--dp-surface) !important; box-shadow: none !important;
}
/* ==========================================================================
   10. Товар: «Картриджі | модулі … до дермапена» (#p_l) — рівні картки 2 в ряд (на телефоні 1)
   Ціна показується один раз (сума, що міняється з кількістю), степер — як у кошику, «Купити» — головна пігулка.
   ========================================================================== */
html body #p_l .p-l-modern__list { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
html body #p_l .p-l-card {
	display: grid !important; grid-template-columns: 64px minmax(0, 1fr); grid-template-areas: "img title" "side side";
	gap: 12px 14px; align-items: start; width: auto !important; max-width: none !important; min-width: 0 !important; flex: none !important; margin: 0 !important; padding: 14px !important;
	border: 1px solid var(--dp-line) !important; border-radius: 18px !important; background: var(--dp-surface) !important; box-shadow: none !important;
}
html body #p_l .p-l-card__media { grid-area: img; width: 64px !important; height: 64px !important; border-radius: 12px !important; background: var(--dp-soft) !important; overflow: hidden; display: flex !important; align-items: center; justify-content: center; }
html body #p_l .p-l-card__media img { width: 100% !important; height: 100% !important; object-fit: contain; mix-blend-mode: multiply; }
html body #p_l .p-l-card__body { grid-area: title; min-width: 0; }
html body #p_l .p-l-card__title {
	display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
	color: var(--dp-ink) !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.35 !important; text-decoration: none !important;
}
html body #p_l .p-l-card__title:hover { color: var(--dp-primary) !important; }
html body #p_l .p-l-card__side {
	grid-area: side; display: flex !important; align-items: center; justify-content: flex-end; gap: 10px;
	padding-top: 12px; border-top: 1px solid var(--dp-line); width: auto !important;
}
html body #p_l .p-l-card__label, html body #p_l .p-l-card__price-block--unit { display: none !important; }
html body #p_l .p-l-card__price-block--total { order: 0; margin-right: auto !important; }
html body #p_l .p-l-card__qty { order: 1; margin: 0 !important; }
html body #p_l .p-l-buy-btn { order: 2; }
html body #p_l .p-l-card__price { margin: 0 !important; display: flex; align-items: baseline; gap: 8px; }
html body #p_l .p-l-price-new { color: var(--dp-ink) !important; font-size: 17px !important; font-weight: 800 !important; }
html body #p_l .p-l-price-old { color: var(--dp-muted) !important; font-size: 13px !important; text-decoration: line-through; }
html body #p_l .p-l-stepper {
	display: inline-flex !important; align-items: center; height: 36px !important; padding: 0 3px !important;
	border: 1px solid var(--dp-line) !important; border-radius: var(--dp-radius-pill) !important; background: var(--dp-surface) !important;
}
html body #p_l .p-l-stepper__btn {
	width: 30px !important; height: 30px !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important;
	background: transparent !important; color: var(--dp-primary) !important; font-size: 18px !important; line-height: 1 !important; box-shadow: none !important;
}
html body #p_l .p-l-stepper__btn:hover { background: var(--dp-soft) !important; }
html body #p_l .p-l-stepper__input { width: 32px !important; height: 30px !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center; font-weight: 700; color: var(--dp-ink); box-shadow: none !important; }
html body #p_l .p-l-buy-btn {
	display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
	height: var(--dp-btn-md) !important; padding: 0 20px !important; border: 0 !important; border-radius: var(--dp-radius-pill) !important;
	background: var(--dp-primary) !important; background-image: none !important; color: var(--dp-on-primary) !important;
	font-size: var(--dp-btn-size) !important; font-weight: var(--dp-btn-weight) !important; box-shadow: none !important; white-space: nowrap;
}
html body #p_l .p-l-buy-btn:hover { background: var(--dp-primary-hover) !important; }
html body #p_l .p-l-buy-btn i { color: inherit !important; }
@media (max-width: 767px) {
	html body #p_l .p-l-modern__list { grid-template-columns: 1fr; }
	html body #p_l .p-l-card__side { flex-wrap: wrap; }
	html body #p_l .p-l-buy-btn { flex: 1 1 100%; }
}

/* Картки-модулі (ldev-card-product: «Схожі товари», підбірки в описах і питаннях) і ряд картриджів (#p_l):
   без степера — кількість міняють у кошику, що відкривається після «Купити» (додає 1 шт).
   Рядок: ціна зліва, «Купити» справа. Степер лишається тільки в зоні покупки, липкій панелі, кошику й оформленні. */
html body .ldev-card-product .ldev-card-product-qty, html body #p_l .p-l-card__qty,
html body .uzs-article .uzs-wrap .uzs-row .ldev-card-product .ldev-card-product-qty { display: none !important; }
html body .ldev-card-product {
	border: 1px solid var(--dp-line) !important; border-radius: 20px !important; background: var(--dp-surface) !important; box-shadow: none !important; transform: none !important;
}
html body .ldev-card-product .ldev-card-product-meta {
	display: flex !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important;
	margin-top: auto; padding-top: 12px !important; border-top: 1px solid var(--dp-line) !important;
}
html body .ldev-card-product .ldev-card-product-price {
	order: 0; flex: 0 1 auto !important; width: auto !important; margin: 0 !important; display: flex !important; flex-wrap: wrap; align-items: baseline; gap: 2px 8px;
	color: var(--dp-ink) !important; font-size: 17px !important; font-weight: 800 !important; white-space: nowrap; text-align: left !important;
}
html body .ldev-card-product .ldev-card-product-price .price-new { color: var(--dp-ink) !important; }
html body .ldev-card-product .ldev-card-product-price .price-old { color: var(--dp-muted) !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: line-through; }
html body .ldev-card-product .ldev-card-product-actions { order: 2; flex: 0 0 auto !important; width: auto !important; margin: 0 !important; }
html body .ldev-card-product .ldev-card-product-actions .ldev-buy-btn { width: auto !important; height: 44px !important; padding: 0 18px !important; }
html body .ldev-card-product .ldev-card-product-title h4, html body .ldev-card-product .ldev-card-product-title h4 a {
	color: var(--dp-ink) !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.35 !important;
}
@media (max-width: 359px) {
	html body .ldev-card-product .ldev-card-product-meta, html body #p_l .p-l-card__side { flex-wrap: wrap !important; }
	html body .ldev-card-product .ldev-card-product-actions, html body .ldev-card-product .ldev-card-product-actions .ldev-buy-btn { flex: 1 1 100% !important; width: 100% !important; }
}
/* блок «Купити … в Україні» в кінці опису: м'яка сливова картка замість помаранчевої смуги зліва */
html body .uzs-article .uzs-highlight-box {
	background: var(--dp-soft) !important; background-image: none !important; border: 0 !important; border-left: 0 !important;
	border-radius: var(--dp-radius-card) !important; box-shadow: none !important; padding: 18px 20px !important;
}
/* #p_l: та сама кнопка 44px, ціна зліва */
html body #p_l .p-l-buy-btn { height: 44px !important; width: auto !important; min-width: 0 !important; padding: 0 18px !important; }
html body #p_l .p-l-buy-btn span { display: inline !important; }
@media (max-width: 767px) { html body #p_l .p-l-card__side { flex-wrap: nowrap; } html body #p_l .p-l-buy-btn { flex: 0 0 auto; } }

/* «Навчальний протокол роботи · у подарунок» (модуль ldev_cart_notify, стилі вписані в атрибути — перебиваємо) */
html body .ldev-cart-notification .notification-description > div {
	display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px; flex-wrap: wrap;
	padding: 16px 18px !important; margin: 16px 0 !important; text-align: left !important;
	background: var(--dp-soft) !important; border: 0 !important; border-radius: var(--dp-radius-card) !important; font-family: inherit !important;
}
html body .ldev-cart-notification .notification-description > div > p {
	margin: 0 !important; padding-left: 34px !important; position: relative;
	color: var(--dp-ink) !important; font-size: 15px !important; font-weight: 600 !important;
}
html body .ldev-cart-notification .notification-description > div > p::before {
	content: ''; position: absolute; left: 0; top: 50%; width: 24px; height: 24px; margin-top: -12px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E0A6E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='13' rx='2'/%3E%3Cpath d='M12 8v13M3 12h18M12 8c-2-4-6-4-6-1.5S9 8 12 8zm0 0c2-4 6-4 6-1.5S15 8 12 8z'/%3E%3C/svg%3E") center / contain no-repeat;
}
html body .ldev-cart-notification .notification-description > div > div {
	display: inline-flex !important; align-items: center; height: 28px; padding: 0 12px !important;
	border-radius: var(--dp-radius-pill) !important; background: var(--dp-surface) !important;
}
html body .ldev-cart-notification .notification-description > div > div > span:first-child { display: none !important; }
html body .ldev-cart-notification .notification-description > div > div > span:last-child {
	color: var(--dp-primary) !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important;
}
html body .ldev-cart-notification .notification-description > div > div > span:last-child::first-letter { text-transform: uppercase; }
/* ==========================================================================
   11. Месенджери: скрізь оригінальні кольорові іконки (як на основному сайті).
   У блоці «Не знайшли потрібне?» на сторінці пошуку — маленькі круглі кольорові іконки без підписів.
   ========================================================================== */
/* блок «Не знайшли потрібне?»: маленькі кольорові круглі іконки, як у шапці біля телефону (без підписів) */
html body .dsp-help-msg { display: flex !important; justify-content: center; gap: 14px !important; flex-wrap: nowrap !important; }
html body .dsp-help-msg a {
	display: inline-flex !important; align-items: center; justify-content: center; width: 48px !important; height: 48px !important; padding: 0 !important;
	border: 0 !important; border-radius: 50% !important; background: var(--dp-surface) !important; background-image: none !important;
	box-shadow: 0 2px 10px rgba(36, 26, 48, .10) !important; font-size: 0 !important; color: transparent !important; flex: 0 0 auto !important;
	transition: transform .15s ease;
}
html body .dsp-help-msg a:hover { transform: translateY(-2px); }
html body .dsp-help-msg a img { width: 30px !important; height: 30px !important; margin: 0 !important; }
/* сторінка пошуку: кнопка «Знайти» — рівна, без градієнта */
html body .dsp-page button[type="submit"], html body .dsp-hero button { background: var(--dp-primary) !important; background-image: none !important; box-shadow: none !important; }
html body .dsp-page button[type="submit"]:hover, html body .dsp-hero button:hover { background: var(--dp-primary-hover) !important; }
/* сторінка контактів: картка телефону — рівний колір замість градієнта */
html body .dpct-card a.dpct-tel { background: var(--dp-primary) !important; background-image: none !important; box-shadow: none !important; }
html body .dpct-card a.dpct-tel:hover { background: var(--dp-primary-hover) !important; }
/* ==========================================================================
   12. Вікно «Перевірте модель апарата» (каталог картриджів → «Купити»)
   ========================================================================== */
html body .dpc-modal .dpc-modal__box {
	border-radius: 24px !important; border: 0 !important; background: var(--dp-surface) !important;
	box-shadow: 0 24px 60px rgba(36, 26, 48, .22) !important; padding: 26px 24px 22px !important;
}
html body .dpc-modal .dpc-modal__q { color: var(--dp-ink) !important; font-size: 20px !important; font-weight: 800 !important; }
html body .dpc-modal .dpc-modal__t { color: var(--dp-muted) !important; }
html body .dpc-modal .dpc-modal__list span {
	display: inline-flex !important; align-items: center; height: var(--dp-btn-sm); padding: 0 12px !important; margin: 0 6px 6px 0 !important;
	border: 0 !important; border-radius: var(--dp-radius-pill) !important; background: var(--dp-soft) !important;
	color: var(--dp-primary) !important; font-size: 13.5px !important; font-weight: 600 !important;
}
html body .dpc-modal .dpc-modal__yes {
	display: flex !important; align-items: center; justify-content: center; width: 100% !important;
	height: var(--dp-btn-lg) !important; margin: 16px 0 10px !important; padding: 0 20px !important;
	border: 0 !important; border-radius: var(--dp-radius-pill) !important;
	background: var(--dp-primary) !important; background-image: none !important; color: var(--dp-on-primary) !important;
	font-size: 16px !important; font-weight: 600 !important; box-shadow: none !important; cursor: pointer;
}
html body .dpc-modal .dpc-modal__yes:hover { background: var(--dp-primary-hover) !important; }
html body .dpc-modal .dpc-modal__nos { display: flex !important; flex-wrap: wrap; gap: 8px; }
html body .dpc-modal .dpc-modal__no {
	flex: 1 1 0; display: inline-flex !important; align-items: center; justify-content: center; gap: 4px;
	min-height: var(--dp-btn-md); padding: 6px 16px !important;
	border: 0 !important; border-radius: var(--dp-radius-pill) !important;
	background: var(--dp-soft) !important; color: var(--dp-primary) !important;
	font-size: 14px !important; font-weight: 500 !important; text-decoration: none !important; white-space: nowrap;
}
html body .dpc-modal .dpc-modal__no b { color: var(--dp-primary) !important; font-weight: 700 !important; }
html body .dpc-modal .dpc-modal__no:hover { background: var(--dp-soft-hover) !important; }
@media (max-width: 480px) { html body .dpc-modal .dpc-modal__no { flex-basis: 100%; } }

/* ціни в картках каталогу — один колір, не малиновий */
html body .product-thumb .price, html body .product-thumb .price-new, html body .product-thumb .price .autocalc-product-special { color: var(--dp-ink) !important; }
html body .product-thumb .price-old { color: var(--dp-muted) !important; }
/* ==========================================================================
   13. Відгуки (#record_columns-13, збирає dp-site.js): білі картки однакової висоти,
   шапка «фото товару + ім'я + зірки», текст до 4 рядків, «Читати далі» — тільки коли обрізано.
   Комп'ютер: 3 колонки (планшет 2). Телефон: гортання вбік з «прилипанням».
   ========================================================================== */
html body #record_columns-13.dp-rv-on {
	display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px !important;
	max-width: none !important; margin: 0 !important; padding: 0 !important;
}
html body #record_columns-13.dp-rv-on .column_width_13 {
	display: flex !important; flex-direction: column !important; height: auto !important; min-height: 0 !important;
	width: auto !important; margin: 0 !important; padding: 16px !important; float: none !important; overflow: hidden;
	background: var(--dp-surface) !important; border: 1px solid #EEE3F0 !important; border-radius: var(--dp-radius-card) !important; box-shadow: none !important;
}
html body #record_columns-13.dp-rv-on .column_width_13::after { content: none !important; display: none !important; }
html body #record_columns-13.dp-rv-on .dp-rv { display: flex; flex-direction: column; gap: 10px; flex: 1 1 auto; min-height: 0; }
html body #record_columns-13.dp-rv-on .dp-rv__head { display: flex; align-items: center; gap: 12px; }
html body #record_columns-13.dp-rv-on .dp-rv__img { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 10px; background: var(--dp-soft); overflow: hidden; display: flex; align-items: center; justify-content: center; }
html body #record_columns-13.dp-rv-on .dp-rv__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; border: 0 !important; padding: 0 !important; }
html body #record_columns-13.dp-rv-on .dp-rv__who { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
html body #record_columns-13.dp-rv-on .dp-rv__name { color: var(--dp-ink); font-size: 15px; font-weight: 600; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body #record_columns-13.dp-rv-on .dp-rv__stars {
	display: block; width: 84px; height: 16px;
	background: linear-gradient(90deg, var(--dp-star) calc(var(--r, 5) * 20%), var(--dp-star-empty) 0);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.8 16'%3E%3Cpath d='M8 1.2l2 4.3 4.6.5-3.4 3.2.9 4.6L8 11.5l-4.1 2.3.9-4.6L1.4 6l4.6-.5z'/%3E%3C/svg%3E") left / 16.8px 16px repeat-x;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.8 16'%3E%3Cpath d='M8 1.2l2 4.3 4.6.5-3.4 3.2.9 4.6L8 11.5l-4.1 2.3.9-4.6L1.4 6l4.6-.5z'/%3E%3C/svg%3E") left / 16.8px 16px repeat-x;
}
html body #record_columns-13.dp-rv-on .dp-rv__text {
	display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
	margin: 0 !important; color: var(--dp-ink); font-size: 14.5px; line-height: 1.5;
}
html body #record_columns-13.dp-rv-on .dp-rv__text--product { color: var(--dp-muted); font-style: italic; -webkit-line-clamp: 2; }
html body #record_columns-13.dp-rv-on .dp-rv__more {
	margin-top: auto; align-self: flex-start; padding: 2px 0;
	color: var(--dp-primary) !important; font-size: 14px; font-weight: 600; text-decoration: none !important;
}
html body #record_columns-13.dp-rv-on .dp-rv__more:hover { text-decoration: underline !important; }
html body #record_columns-13.dp-rv-on .dp-rv__more[hidden] { display: none !important; }
html body #record_columns-13.dp-rv-on.dp-rev-collapsed .column_width_13:nth-child(n+7) { display: none !important; }
html body .dp-rev-more { text-align: center; margin: 18px 0 4px; }
@media (max-width: 991px) {
	html body #record_columns-13.dp-rv-on { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html body #record_columns-13.dp-rv-on.dp-rev-collapsed .column_width_13:nth-child(n+5) { display: none !important; }
}
@media (max-width: 600px) {
	html body #record_columns-13.dp-rv-on {
		display: flex !important; gap: 12px !important; overflow-x: auto; scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch; padding: 0 2px 8px !important; scrollbar-width: none;
	}
	html body #record_columns-13.dp-rv-on::-webkit-scrollbar { display: none; }
	html body #record_columns-13.dp-rv-on .column_width_13 { flex: 0 0 85% !important; scroll-snap-align: start; display: flex !important; }
}

/* ==========================================================================
   17. Мобільне меню: один світло-сливовий відтінок для плиток, кружечків, стрілок і перемикача мови;
   один сливовий для іконок і лічильників; спокійний підпис біля UA/RU.
   ========================================================================== */
html body .mm-wrapper .mm-lang-switch,
html body .mm-wrapper .mm-ub,
html body .mm-wrapper .mm-close,
html body .mm-wrapper .dpg-ic, html body .mm-wrapper .dpk-ic, html body .mm-wrapper .dpc-ic, html body .mm-wrapper .dpv-ic,
html body .mm-wrapper .mm .clearfix > img,
html body .mm-wrapper .fa-times { background-color: var(--dp-soft) !important; background-image: none; box-shadow: none !important; border-color: transparent !important; }
html body .mm-wrapper .fa-times { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E0A6E' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 18px !important; }
html body .mm-wrapper .mm-ub:hover, html body .mm-wrapper .mm-close:hover { background-color: var(--dp-soft-hover) !important; }
html body .mm-wrapper svg, html body .mm-wrapper svg path { stroke: var(--dp-primary); }
html body .mm-wrapper .mm-ub-t { color: var(--dp-ink) !important; }
html body .mm-wrapper .dpm-say { color: var(--dp-muted) !important; font-style: normal !important; font-weight: 500 !important; }
/* лічильники: «Закладки» і «Ви дивилися» — однаковий значок */
html body .mm-wrapper .mm-ub-n.on { background: var(--dp-primary) !important; color: var(--dp-on-primary) !important; }
html body .mm-wrapper .dpv-n {
	display: inline-flex !important; align-items: center; justify-content: center; min-width: 20px; height: 20px; margin-left: 6px; padding: 0 6px;
	border-radius: var(--dp-radius-pill); background: var(--dp-soft) !important; color: var(--dp-primary) !important; font-size: 12px !important; font-weight: 700 !important; vertical-align: 1px;
}
/* стрілки праворуч — однакові кружечки, як у розділах каталогу */
html body .mm-wrapper .dpv-arr, html body .mm-wrapper .dpc-arr, html body .mm-wrapper .dpk-arr, html body .mm-wrapper .dpg-arr {
	display: inline-flex !important; align-items: center; justify-content: center; flex: 0 0 32px; width: 32px !important; height: 32px !important; border-radius: 50% !important;
	background: var(--dp-soft) !important; color: var(--dp-primary) !important; font-size: 0 !important; transform: none !important; border: 0 !important;
}
html body .mm-wrapper .dpv-arr::before, html body .mm-wrapper .dpc-arr::before, html body .mm-wrapper .dpk-arr::before, html body .mm-wrapper .dpg-arr::before {
	content: ''; width: 7px; height: 7px; border-right: 2px solid var(--dp-primary); border-bottom: 2px solid var(--dp-primary); transform: rotate(-45deg); margin-left: -3px;
}
/* кнопка «вгору» не висить над відкритим меню */
html.dp-menu-open #scroller { display: none !important; }

/* головна, плитки «Дермапени…», «Ампули…», «Картриджі за моделлю апарата»: назви повністю, у два рядки замість «…» */
html body .dv-cats .dv-sub a, html body .dv-cats .dv-sub li {
	white-space: normal !important; overflow: visible !important; text-overflow: clip !important; -webkit-line-clamp: unset !important; display: block !important;
	line-height: 1.3 !important; height: auto !important; max-height: none !important;
}
html body .dv-cats .dv-sub li { margin-bottom: 6px !important; }