@charset "UTF-8";
/*
 * Site header, categories drawer and footer (sh-*, sf-*). Imported at the top of global.css, so it loads on every page.
 * The old theme positions header parts absolutely; those rules are neutralised here under .sh / .sf.
 */

body {
	--pp-red: #d71920;
	--pp-red-dark: #b3141a;
	--pp-red-bright: #ef4444;
	/* owner 2026-09-17: the "Купи" button is green again, and it is styled in
	   components-pp.css (sitewide), so the green tokens must live here too -
	   product-pp.css declares its own under body#product. */
	--pp-green: #2e9e3e;
	--pp-green-dark: #257f32;
	--pp-ink: #111827;
	--pp-text: #374151;
	--pp-muted: #6b7280;
	--pp-border: #e5e7eb;
	--pp-soft: #f6f7f9;
	--pp-dark: #15171c;
	--pp-font: Roboto, Arial, Helvetica, sans-serif;
}
html.sh-lock,
html.sh-lock body {
	overflow: hidden;
}

/* ---------- header shell ---------- */
.header-container.sh {
	position: relative;
	z-index: 900;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--pp-border);
	background: #fff !important;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.sh #header {
	position: static;
	margin: 0;
	padding: 0;
	min-height: 0;
	background: none !important;
	font-family: var(--pp-font);
}
.sh #header .banner,
.sh #header .nav {
	display: none;
}

/* Bootstrap's .container clearfix pseudo-elements must not become flex items in the new rows */
.sh-topbar__inner:before,
.sh-topbar__inner:after,
.sh-main__inner:before,
.sh-main__inner:after,
.sh-navbar__inner:before,
.sh-navbar__inner:after {
	display: none;
}

/* ---------- top bar ---------- */
.sh-topbar {
	background: var(--pp-dark);
	color: #d1d5db;
	font: 400 13px/1.2 var(--pp-font);
}
.sh-topbar__inner {
	display: flex;
	align-items: center;
	gap: 26px;
	min-height: 38px;
}
.sh-topbar__item {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	white-space: nowrap;
	color: #d1d5db;
}
.sh-topbar__item svg,
.sh .sh-topbar .class0700 svg {
	flex: 0 0 auto;
	color: var(--pp-red-bright);
}
.sh-topbar a.sh-topbar__item:hover {
	color: #fff;
	text-decoration: none;
}
.sh-topbar__right {
	display: flex;
	align-items: center;
	gap: 22px;
	margin-left: auto;
}
.sh .sh-topbar a.class0700 {
	position: static !important;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background: none !important;
	color: #fff;
	font: 700 13px/1.2 var(--pp-font);
	text-shadow: none;
	white-space: nowrap;
}
.sh .sh-topbar a.class0700 div {
	display: inline;
	margin: 0;
	padding: 0;
	color: inherit;
	font: inherit;
	text-shadow: none;
}
.sh .sh-topbar a.class0700 div + div:before {
	content: "\00B7";
	margin: 0 6px;
	color: #9ca3af;
}
.sh .sh-topbar a.class0700:hover {
	color: #fff;
	text-decoration: none;
}

/* ---------- main row: logo, search, account, cart ---------- */
.sh #header .h_top {
	position: relative;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	background: #fff !important;
	box-shadow: none;
}
.sh-main__inner {
	display: flex;
	align-items: center;
	gap: 20px;
	min-height: 72px;
}
.sh #header_logo {
	position: static !important;
	flex: 0 0 auto;
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}
.sh #header_logo img {
	width: auto;
	height: 62px;
	max-width: none;
}
.sh .start_button {
	display: none !important;
}
.sh-hook {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 16px;
}
.sh #search_block_top {
	order: 1;
	position: static !important;
	flex: 1 1 auto;
	float: none;
	width: auto;
	max-width: 900px;
	margin: 0;
	padding: 0;
}
.sh #searchbox {
	position: static;
	display: flex;
	align-items: stretch;
	float: none;
	width: auto;
	height: 50px;
	margin: 0;
	padding: 0;
	border: 2px solid #d1d5db;
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
	transition: border-color .15s;
}
.sh #searchbox:focus-within {
	border-color: var(--pp-red);
}
.sh #search_query_top {
	flex: 1 1 auto;
	float: none;
	width: auto;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 0 16px;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--pp-ink);
	font: 400 15px/1 var(--pp-font);
}
.sh #searchbox .button-search {
	position: static;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 8px;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 22px;
	border: 0;
	border-radius: 0;
	background: var(--pp-red);
	color: #fff;
	font: 700 14px/1 var(--pp-font);
	text-transform: uppercase;
}
.sh #searchbox .button-search:before {
	content: "\f002";
	display: inline-block;
	position: static;
	font-family: "FontAwesome";
	font-size: 16px;
	font-weight: 400;
	color: #fff;
}
.sh #searchbox .button-search span {
	display: inline;
	color: #fff;
	font: inherit;
}
.sh #searchbox .button-search:hover {
	background: var(--pp-red-dark);
}

.sh .user_info {
	order: 2;
	/* pushes the account links and the cart to the right edge of the container on wide screens */
	margin-left: auto !important;
	position: static !important;
	display: flex;
	align-items: center;
	gap: 16px;
	float: none;
	margin: 0;
	padding: 0;
	list-style: none;
}
.sh .user_info li {
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}
.sh .user_info a {
	display: inline-flex;
	flex-direction: row-reverse;
	align-items: center;
	gap: 6px;
	padding: 0;
	background: none;
	color: var(--pp-ink);
	font: 500 14px/1.2 var(--pp-font);
	text-transform: none;
	white-space: nowrap;
}
.sh .user_info a i {
	font-size: 18px;
	color: var(--pp-ink);
}
.sh .user_info a:hover,
.sh .user_info a:hover i {
	color: var(--pp-red);
	text-decoration: none;
}

.sh .top_cart_h {
	order: 3;
	margin-left: 0;
	position: relative !important;
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}
.sh #header .shopping_cart,
.sh .shopping_cart {
	position: relative;
	display: flex;
	align-items: center;
	float: none;
	width: auto;
	margin: 0;
	padding: 0 !important;
	background: none;
}
.sh .shopping_cart > a:first-child {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: auto;
	padding: 9px 14px;
	border: 1px solid var(--pp-border);
	border-radius: 8px;
	background: #fff;
	color: var(--pp-ink);
	font: 600 14px/1.2 var(--pp-font);
	text-transform: none;
	overflow: visible;
	white-space: nowrap;
}
.sh .shopping_cart > a:first-child:after {
	display: none;
}
.sh .shopping_cart > a:first-child:hover {
	border-color: #cbd0d6;
	text-decoration: none;
}
.sh #cart_wheel {
	display: inline-block;
	position: static !important;
	top: auto !important;
	margin: 0 !important;
	width: 30px;
	height: 24px;
	margin: 0;
	background-size: contain;
	background-position: center;
}
.sh #cart_title {
	position: static;
	margin: 0;
	color: var(--pp-ink);
	font-weight: 700;
}
.sh .shopping_cart .ajax_cart_quantity {
	display: inline-block;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--pp-red);
	color: #fff;
	font: 700 12px/20px var(--pp-font);
	text-align: center;
}
.sh .shopping_cart .ajax_cart_quantity.unvisible {
	display: none;
}
.sh .shopping_cart .ajax_cart_product_txt,
.sh .shopping_cart .ajax_cart_product_txt_s {
	display: none !important;
}
.sh .shopping_cart .ajax_cart_total {
	color: var(--pp-red);
	font-weight: 700;
}
.sh .cart_block {
	top: calc(100% + 6px);
	right: 0;
	left: auto;
}

/* ---------- menu bar ---------- */
.sh-navbar {
	border-top: 1px solid var(--pp-border);
	background: #f3f4f6;
}
.sh-navbar__inner {
	display: flex;
	align-items: stretch;
	min-height: 48px;
}
.sh-cats {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 14px 0 0;
	padding: 0 22px;
	border: 0;
	background: #e5e7eb;
	color: var(--pp-ink);
	font: 700 14px/1 var(--pp-font);
	text-transform: uppercase;
	cursor: pointer;
}
.sh-cats:hover,
.sh-cats[aria-expanded="true"] {
	background: #dcdfe4;
}
.sh-menu {
	flex: 1 1 auto;
	min-width: 0;
	overflow-x: auto;
	scrollbar-width: none;
}
.sh-menu::-webkit-scrollbar {
	display: none;
}
.sh-menu ul {
	display: flex;
	align-items: stretch;
	height: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
.sh-menu li {
	margin: 0;
	padding: 0;
}
.sh-menu a {
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 12px;
	color: var(--pp-ink);
	font: 700 13.5px/1 var(--pp-font);
	letter-spacing: .02em;
	text-transform: uppercase;
	white-space: nowrap;
}
.sh-menu a:hover {
	color: var(--pp-red);
	text-decoration: none;
}
.sh-menu .sh-menu__sale a {
	color: var(--pp-red);
}
.sh-burger {
	display: none;
}
.sh-cats:focus-visible,
.sh-burger:focus-visible,
.sh-drawer__close:focus-visible,
.sh-menu a:focus-visible {
	outline: 3px solid rgba(215, 25, 32, .35);
	outline-offset: 2px;
}

/* ---------- categories drawer ---------- */
.sh-drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10050;
	background: rgba(17, 24, 39, .45);
}
.sh-drawer[hidden] {
	display: none !important;
}
.sh-drawer__panel {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 360px;
	max-width: 88vw;
	display: flex;
	flex-direction: column;
	background: #fff;
	box-shadow: 8px 0 24px rgba(0, 0, 0, .2);
	font-family: var(--pp-font);
}
.sh-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 16px 12px 20px;
	border-bottom: 1px solid var(--pp-border);
	color: var(--pp-ink);
	font: 700 16px/1 var(--pp-font);
	text-transform: uppercase;
}
.sh-drawer__close {
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--pp-soft);
	color: var(--pp-ink);
	font-size: 24px;
	line-height: 40px;
}
.sh-drawer__body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 6px 20px 28px;
	-webkit-overflow-scrolling: touch;
}
.sh-drawer__body ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.sh-drawer__body li {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #f0f1f3;
	background: none;
}
.sh-drawer__body li ul,
.sh-drawer__body .grower {
	display: none;
}
.sh-drawer__body a {
	display: block;
	padding: 11px 2px;
	background: none;
	color: var(--pp-ink);
	font: 500 14.5px/1.3 var(--pp-font);
	text-transform: none;
}
.sh-drawer__body a:before,
.sh-drawer__body a:after {
	display: none;
}
.sh-drawer__body a:hover {
	color: var(--pp-red);
	text-decoration: none;
}
.sh-drawer__group {
	margin: 18px 0 2px;
	color: var(--pp-muted);
	font: 700 12px/1 var(--pp-font);
	letter-spacing: .06em;
	text-transform: uppercase;
}

/* ---------- footer ---------- */
.footer-container.sf {
	margin: 40px 0 0;
	padding: 0;
	border: 0;
	background: var(--pp-dark) !important;
	color: #c7cbd1;
	font-family: var(--pp-font);
}
.sf #footer {
	padding: 46px 15px 0;
	background: none;
	color: inherit;
}
.sf-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 2.3fr);
	gap: 34px;
}
.sf-logo {
	display: inline-block;
}
.sf-logo img {
	width: auto;
	height: 66px;
}
.sf-brand p {
	max-width: 330px;
	margin: 14px 0 0;
	color: #aeb4bd;
	font-size: 13.5px;
	line-height: 1.6;
}
.sf-phones {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 16px 0 0;
}
.sf-phones a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #fff;
	font: 700 16px/1.2 var(--pp-font);
}
.sf-phones svg {
	color: var(--pp-red-bright);
}
.sf #footer h4,
.sf #footer h4 a {
	margin: 0 0 14px;
	padding: 0;
	border: 0;
	background: none;
	color: #fff;
	font: 700 14px/1.3 var(--pp-font);
	letter-spacing: .04em;
	text-transform: uppercase;
}
.sf #footer h4:after,
.sf #footer h4:before {
	display: none;
}
.sf #footer ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.sf #footer li {
	margin: 0 0 9px;
	padding: 0;
	border: 0;
	background: none;
	color: #c7cbd1;
	font-size: 13.5px;
	line-height: 1.5;
}
.sf #footer li:before,
.sf #footer li a:before {
	display: none !important;
}
.sf #footer a {
	color: #c7cbd1;
	font-weight: 400;
	text-transform: none;
}
.sf #footer a:hover {
	color: #fff;
	text-decoration: none;
}
.sf-hooks {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	gap: 34px;
}
.sf-hooks > .row {
	display: contents;
}
.sf #footer .footer-block {
	float: none;
	width: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
}
.sf #footer #block_contact_infos li span {
	color: #fff;
}
.sf-bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 20px;
	margin: 38px 0 0;
	padding: 18px 0 22px;
	border-top: 1px solid rgba(255, 255, 255, .08);
	color: #9aa1ab;
	font-size: 12.5px;
}
.sf-pay {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 10px;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 6px;
	color: #e5e7eb;
}

/* owner 2026-09-21: линкът стои само върху „Изработка на онлайн магазин"; името на
   студиото е обикновен текст до него. Самата връзка вече се стилизира от
   `.sf #footer a` (#c7cbd1, hover #fff), затова тук се задава само марката —
   малко по-светла, за да се чете като име, но в нашата палитра, не в оранжево. */
.sf-made {
	white-space: nowrap;
}
.sf-made strong {
	color: #e5e7eb;
	font-weight: 600;
}

/* ---------- overrides of stronger theme rules ---------- */
.sh #searchbox {
	border-color: #d1d5db !important;
}
.sh #searchbox:focus-within {
	border-color: var(--pp-red) !important;
}
.sh #searchbox .button-search {
	background: var(--pp-red) !important;
	color: #fff !important;
	text-shadow: none !important;
	box-shadow: none !important;
}
.sh #searchbox .button-search:hover {
	background: var(--pp-red-dark) !important;
}
/* blocksearch.css (#search_block_top ids) kept the input and button 35px tall on a #fbfbfb form: grey strip below them */
.sh #search_block_top #searchbox {
	float: none;
	width: auto;
	padding: 0;
	background: #fff;
}
.sh #search_block_top #search_query_top {
	display: block;
	height: auto;
	padding: 0 16px;
}
.sh #search_block_top .btn.button-search {
	position: static;
	height: auto;
	padding: 0 22px;
}
.sh .user_info a,
.sh .shopping_cart > a:first-child,
.sh .shopping_cart > a:first-child * {
	text-shadow: none !important;
}
.sh .shopping_cart > a:first-child {
	min-height: 40px;
}
.sh #cart_wheel {
	width: 36px;
	height: 28px;
}
#columns > .row > #left_column {
	margin-top: 0 !important;
}
.columns-container #columns {
	padding-top: 20px;
}
.under_content {
	min-height: 0 !important;
	padding: 0 !important;
	background: none !important;
}
.columns-container {
	padding-bottom: 40px;
	background: #fff;
}
.footer-container.sf {
	margin-top: 0 !important;
}
.sf-hooks {
	display: block;
}
.sf-hooks > .row {
	display: flex;
	flex-wrap: wrap;
	gap: 28px 34px;
	margin: 0;
}
.sf-hooks > .row:before,
.sf-hooks > .row:after {
	display: none;
}
.sf-hooks > .row > .footer-block {
	flex: 1 1 220px;
}
.footer-container #footer.sf a,
.footer-container #footer.sf li a {
	color: #c7cbd1;
}
.footer-container #footer.sf .sf-phones a,
.footer-container #footer.sf a[href^="mailto:"] {
	color: #fff;
}
.sf #footer li a,
.sf #footer ul a {
	font-weight: 400 !important;
	text-transform: none !important;
}

/* ---------- responsive ---------- */
@media (max-width: 1199px) {
	.sh-topbar__item--hours {
		display: none;
	}
	.sh-main__inner {
		gap: 20px;
	}
	.sh #searchbox .button-search span {
		display: none;
	}
}
@media (max-width: 991px) {
	.sh-topbar__item--delivery {
		display: none;
	}
	.sh .user_info li + li {
		display: none;
	}
	.sh #cart_title {
		display: none;
	}
	.sh-menu a {
		padding: 0 12px;
		font-size: 12.5px;
	}
	.sf-grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
	.sf-hooks {
		grid-column: 1 / -1;
	}
}
@media (max-width: 767px) {
	.sh-topbar__inner {
		justify-content: center;
		gap: 14px;
		min-height: 34px;
	}
	.sh-topbar__right {
		margin-left: 0;
	}
	.sh-topbar__item--help {
		display: none;
	}
	.sh-main__inner {
		flex-wrap: wrap;
		gap: 10px 12px;
		min-height: 0;
		padding: 10px 0 12px;
	}
	.sh-burger {
		order: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 1px solid var(--pp-border);
		border-radius: 8px;
		background: #fff;
		color: var(--pp-ink);
	}
	.sh #header_logo {
		order: 1;
	}
	.sh #header_logo img {
		height: 56px;
	}
	.sh-hook {
		display: contents;
	}
	.sh .user_info {
		order: 2;
		margin-left: auto;
	}
	.sh .user_info a {
		font-size: 0;
	}
	.sh .user_info a i {
		font-size: 22px;
	}
	.sh .top_cart_h {
		order: 3;
	}
	.sh .shopping_cart > a:first-child {
		padding: 8px 10px;
	}
	.sh .shopping_cart .ajax_cart_no_product,
	.sh .shopping_cart .ajax_cart_total {
		display: none !important;
	}
	.sh #search_block_top {
		order: 4;
		flex: 1 0 100%;
		max-width: none;
	}
	.sh #searchbox {
		height: 46px;
	}
	.sh-cats {
		display: none;
	}
	.sh-navbar__inner {
		min-height: 42px;
		padding: 0;
	}
	.sf #footer {
		padding: 34px 15px 64px;
	}
	.sf-grid,
	.sf-hooks {
		grid-template-columns: minmax(0, 1fr);
		gap: 26px;
	}
	.sf-bottom {
		margin-top: 26px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.sh #searchbox {
		transition: none;
	}
}
/* LS-01: grid columns had padding-left 15px / padding-right 5px, so nested Bootstrap rows
   (margin: 0 -15px) overshot and the page scrolled 1px sideways at 768px */
html body #columns .col-xs-1, html body #columns .col-xs-2, html body #columns .col-xs-3,
html body #columns .col-xs-4, html body #columns .col-xs-5, html body #columns .col-xs-6,
html body #columns .col-xs-7, html body #columns .col-xs-8, html body #columns .col-xs-9,
html body #columns .col-xs-10, html body #columns .col-xs-11, html body #columns .col-xs-12,
html body #columns .col-sm-3, html body #columns .col-sm-4, html body #columns .col-sm-6,
html body #columns .col-sm-8, html body #columns .col-sm-9, html body #columns .col-sm-12,
html body #columns .col-md-3, html body #columns .col-md-4, html body #columns .col-md-6,
html body #columns .col-md-9, html body #columns .col-md-12 {
	padding-right: 15px;
}

/* LS-04: the theme removes outlines everywhere; restore one visible keyboard ring */
html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body select:focus-visible,
html body textarea:focus-visible,
html body #header .shopping_cart > a:first-child:focus-visible,
html body #search_block_top input:focus-visible,
html body #search_block_top button:focus-visible,
html body #columns #left_column .tree a:focus-visible,
html body #columns .PM_ASLabelLink:focus-visible,
html body #center_column .pagination a:focus-visible,
html body #columns .breadcrumb a:focus-visible,
html body .pp-buy:focus-visible {
	outline: 3px solid rgba(215, 25, 32, .55) !important;
	outline-offset: 2px !important;
}
/* The buy button is green, so its focus ring is green too. The group above is shared and
   carries !important, and its `html body button:focus-visible` selector also catches the
   product-page and sticky buy BUTTONS - which is why the non-important green rings in
   product-pp.css lose. These selectors each add a class, so they win at equal !important. */
html body a.pp-buy:not(.pp-buy--view):not(.pp-buy--order):focus-visible,
html body button.pp-btn-buy:focus-visible,
html body button.pp-sticky__btn:focus-visible {
	outline-color: rgba(46, 158, 62, .55) !important;
}

/* ADV-01: blockcart.css loads after global.css, so these need id strength to win */
html body #header .shopping_cart {
	padding: 0 !important;
	background: none;
}
html body #header .shopping_cart > a:first-child:after {
	display: none;
}
/* blockcart.css:65-70 also paints a FontAwesome cart as a :before pseudo-element
   below 768px, which showed a SECOND cart next to the real icon (owner 2026-09-18). */
html body #header .shopping_cart > a:first-child:before {
	display: none;
}
html body #header #cart_wheel {
	position: static !important;
	top: auto !important;
	margin: 0 !important;
	width: 24px;
	height: 24px;
	display: block;
	/* wheel.png is a single 52x38 icon: scale it into the 24x24 box
	   instead of cropping it (owner 2026-09-18: "да не е изрязана") */
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}
html body #header #cart_title {
	position: static;
	visibility: visible;
	float: none;
	width: auto;
	overflow: visible;
	color: var(--pp-ink);
	font-weight: 700;
	font-size: 12.5px;
}
html body #header .shopping_cart .ajax_cart_total {
	display: inline !important;
	color: var(--pp-red);
	font-weight: 700;
}

@media print {
	.sh-topbar,
	.sh-navbar,
	.sh-drawer {
		display: none !important;
	}
}


/* ---------- sitewide finishing pass ---------- */

/* screen reader only, for controls whose label must not be painted */
.pp-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* the menu strip scrolls sideways on a phone and clipped the last item with no
   hint that more exists */
.sh-navbar__inner {
	position: relative;
}
@media (max-width: 991px) {
	.sh-navbar__inner::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		width: 34px;
		background: linear-gradient(to right, rgba(243, 244, 246, 0), #f3f4f6);
		pointer-events: none;
	}
}

/* GDPR bar: a full width square blue strip that sat over the footer links.
   The module writes its background inline, so that one needs !important. */
html body .general_data_protection_regulation {
	right: 12px;
	bottom: 12px;
	left: 12px;
	width: auto;
	max-width: 720px;
	margin: 0 auto;
	padding: 13px 54px 13px 18px;
	border-radius: 14px;
	background: rgba(23, 26, 31, .96) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
	text-align: left;
}
html body .general_data_protection_regulation .container {
	width: auto;
	max-width: none;
	padding: 0;
}
html body .general_data_protection_regulation p {
	margin: 0;
	font: 400 12.5px/1.5 var(--pp-font);
	color: #e8eaed;
}
html body .general_data_protection_regulation .close_gdpr_popup {
	top: 50%;
	right: 13px;
	margin-top: -16px;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
	color: #fff;
	font: 700 13px/1 var(--pp-font);
	cursor: pointer;
}
html body .general_data_protection_regulation .close_gdpr_popup:hover {
	background: rgba(255, 255, 255, .26);
}


/* The help widget is positioned inline in footer.tpl (top:50%) and js/help.js
   animates its "right", so only its vertical placement is overridden here: on a
   phone the tab sat across the middle of the page content. */
@media (max-width: 767px) {
	html body #help_div {
		top: auto !important;
		bottom: 104px !important;
	}
}


/* ---------- header proportions (owner, 2026-09-17): bigger logo, search nearer the
   middle, smaller cart ---------- */

/* centre the search: give it auto margins so it sits between logo and cart
   instead of being pushed left by the logo's new width */
html body .sh #search_block_top {
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 900px;
}

/* the cart block takes less room and reads smaller */
html body .sh .shopping_cart > a:first-child {
	gap: 6px;
	padding: 6px 12px;
}
html body .sh #cart_title {
	font-size: 14px;
}
html body .sh .shopping_cart .ajax_cart_quantity {
	min-width: 20px;
	height: 20px;
	line-height: 20px;
	font-size: 12px;
}
html body .sh .shopping_cart .ajax_cart_total {
	font-size: 14px;
}
html body .sh .shopping_cart svg,
html body .sh .shopping_cart img {
	width: 30px;
	height: 30px;
}

/* owner 2026-09-17: with eight items the nav needs ~968px but only ~772px exists
   between 992 and 1199px, and above 991px there is no scrollbar and no fade - so the
   last items would just vanish. Let the nav wraps below 1200 instead of hiding them. */
@media (min-width: 992px) and (max-width: 1199px) {
	.sh-menu {
		overflow-x: visible;
	}
	.sh-menu ul {
		flex-wrap: wrap;
		height: auto;
		row-gap: 2px;
	}
	.sh-menu a {
		height: 40px;
		padding: 0 10px;
		font-size: 12.5px;
	}
}

/* PP-CALL 2026-09-18 (owner: "по-модерно"): the phone call bar came from global.css:8105-8112
   with box-shadow: 0 0 20px black and a white top border - a 2014 look that clashes with the
   rest of the site. Restyled here (site-pp.css loads after global.css) keeping the same id and
   the same fixed placement, so js and the "Обади се" link behave exactly as before. */
@media (max-width: 767px) {
	html body #call_us_button_mobile {
		display: flex !important;
		align-items: center;
		justify-content: center;
		gap: 8px;
		height: 52px;
		padding: 0 18px;
		border: 0 !important;
		border-top: 0 !important;
		background: var(--pp-red) !important;
		color: #fff !important;
		font: 700 16px/1 var(--pp-font);
		letter-spacing: .01em;
		text-transform: none;
		text-decoration: none;
		box-shadow: 0 -6px 18px rgba(17, 24, 39, .16) !important;
	}
	html body #call_us_button_mobile img {
		width: 20px !important;
		height: 20px !important;
		filter: brightness(0) invert(1);
	}
}

/* ==========================================================================
   HELP-WIDGET 2026-09-21 — джаджата „Помощ" в стила на сайта.

   МЕХАНИЗМЪТ НЕ Е ПИПАН, защото /js/help.js е с твърдо зашити числа:
     • #help_div е 359px; панелът 300px; табът 59px  (359 − 300 = 59)
     • help.js анимира САМО `right`: −359 (скрито) → −300 (затворено, табът се вижда)
       → 0 (отворено). Числото −300 е в кода на два места, тоест панелът ТРЯБВА
       да остане точно 300px, иначе затвореното състояние показва част от панела.
     • id-тата (#help_div, #help_image_div), класовете (.help_question(_normal|_open),
       .help_text(_normal|_open), .phonecall, .noselect, .hide-scroll) и правилата
       `:after` с етикетите „?" / „×" / „помощ" / „затвори" остават както са.

   Смененото е само вид: беше #343434 панел с #065eb8 син текст и бял PNG таб.
   ========================================================================== */

/* табът — беше син PNG; сега е брандово червен, нарисуван с CSS */
html body #help_div #help_image_div {
	border-radius: 10px 0 0 10px;
	background: var(--pp-red);
	box-shadow: -3px 0 12px rgba(17, 24, 39, .18);
}
html body #help_div #help_image_div:hover {
	background: var(--pp-red-dark);
}
/* синият PNG вече не участва — геометрията на div-а се пази от CSS */
html body #help_div #help_image_div > img {
	visibility: hidden;
}
html body #help_div .help_question {
	position: absolute;
	top: 13px;
	left: 0;
	width: 100%;
	color: #fff;
	font: 700 24px/1 var(--pp-font);
	text-align: center;
}
html body #help_div .help_text {
	position: absolute;
	top: 44px;
	left: 0;
	width: 100%;
	color: #fff;
	font: 600 12px/1.2 var(--pp-font);
	text-align: center;
	letter-spacing: .02em;
}

/* панелът — беше тъмно #343434; сега бяла карта като останалите на сайта */
html body #help_div .help_panel {
	border: 1px solid var(--pp-border);
	border-right: 0;
	border-radius: 12px 0 0 12px;
	background: #fff;
	box-shadow: -8px 0 28px rgba(17, 24, 39, .14);
	overflow: hidden;
	font-family: var(--pp-font);
}
html body #help_div .help_head {
	padding: 16px 18px 14px;
	border-bottom: 1px solid var(--pp-border);
	background: var(--pp-soft);
	color: var(--pp-ink);
	font: 600 15px/1.4 var(--pp-font);
	text-align: center;
}
html body #help_div .help_head > div + div {
	margin-top: 4px;
	color: var(--pp-muted);
	font-weight: 500;
	font-size: 13.5px;
}

/* телефоните — бяха 29px сиво/бяло върху тъмно; сега брандово червено на бяло */
html body #help_div .phonecall {
	padding: 0;
	text-align: center;
}
html body #help_div .phonecall + .phonecall {
	border-top: 1px solid var(--pp-border);
}
html body #help_div .phonecall a {
	display: block;
	min-height: 48px;
	padding: 12px 16px;
	color: var(--pp-red);
	font: 800 22px/24px var(--pp-font);
	letter-spacing: .01em;
	text-decoration: none;
	transition: background .15s, color .15s;
}
html body #help_div .phonecall a:hover,
html body #help_div .phonecall a:focus {
	background: var(--pp-soft);
	color: var(--pp-red-dark);
	text-decoration: none;
}