/*
 * Avicena look — site styles (REDESIGN.md, rounds 1–2). Loaded by mu-plugins/avicena-look.php after Neve.
 * Dark frame (header, hero, footer, consultation band), light warm content, white cards.
 * System: warm neutrals; Montserrat headings, Inter text; 1px lines; radius 6px (fields, buttons)
 * and 8px (cards, tiles, blocks); fields and buttons 44px high; spacing in steps of 8px.
 */

/* 1. Fonts, served from this server (variable fonts; cyrillic + latin subsets) */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("fonts/montserrat-cyrillic-ext.woff2") format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("fonts/montserrat-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("fonts/montserrat-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("fonts/montserrat-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("fonts/inter-cyrillic-ext.woff2") format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("fonts/inter-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("fonts/inter-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("fonts/inter-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* 2. Tokens (Neve reads the --*fontfamily and --*btn* variables) */
:root {
	--av-frame: #0b0b0b;
	--av-cream: #f4f1ec;              /* light end of the header gradient */
	--av-page: #f7f5f1;
	--av-card: #ffffff;
	--av-soft: #fbf9f6;               /* zebra rows, hover */
	--av-line: #e7e2da;
	--av-line-strong: #d6cfc4;        /* field borders */
	--av-text: #1c1917;
	--av-muted: #57534e;
	--av-accent: #c2410c;
	--av-accent-hover: #9a3412;
	--av-accent-on-dark: #fb923c;     /* accent text on black (#c2410c is only ~4:1 there) */
	--av-on-dark: #ffffff;
	--av-on-dark-muted: #a8a29e;
	--av-ring: 0 0 0 3px rgba(194, 65, 12, 0.16);
	--av-r: 6px;
	--av-r-lg: 8px;
	--av-head: "Montserrat", Arial, Helvetica, sans-serif;
	--av-body: "Inter", Arial, Helvetica, sans-serif;
	--bodyfontfamily: var(--av-body);
	--headingsfontfamily: var(--av-head);
	--primarybtnborderradius: 6px;
	--secondarybtnborderradius: 6px;
	--btntexttransform: uppercase;
	--btnfontweight: 600;
	--btnfs: 13px;
	--btnpadding: 0 22px;
	--primarybtnpadding: 0 22px;
}

/* 3. Base */
body {
	background-color: var(--av-page);
	color: var(--av-text);
	font-family: var(--av-body);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font-family: var(--av-body); }
h1, h2, h3, h4, h5, h6, .woocommerce-loop-category__title, .product_title {
	font-family: var(--av-head);
	color: var(--av-text);
	letter-spacing: -0.01em;
}
a { color: var(--av-accent); }
a:hover, a:focus { color: var(--av-accent-hover); }
:focus-visible { outline: 2px solid var(--av-accent); outline-offset: 2px; }

/* 4. Fields: one look everywhere (search, forms).
   Neve's "form input:read-write" outranks the rule below and draws fields inside forms (contact
   forms) with --formfieldborderwidth, 2px by default; keep them at the same 1px. */
body { --formfieldborderwidth: 1px; --formfieldbordercolor: var(--av-line-strong); --formfieldborderradius: var(--av-r); }
input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="number"], input[type="url"], input[type="password"], select, textarea {
	min-height: 44px;
	padding: 0 14px;
	background: #fff;
	color: var(--av-text);
	border: 1px solid var(--av-line-strong);
	border-radius: var(--av-r);
	box-shadow: none;
	font-size: 15px;
	line-height: 1.4;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
textarea { padding: 12px 14px; min-height: 120px; }
input::placeholder, textarea::placeholder { color: #8a837c; opacity: 1; }
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="search"]:focus, input[type="number"]:focus, select:focus, textarea:focus {
	/* focus = the same thin border turning orange; no pale halo around it (it read as a thick
	   double border with the orange line inside) */
	border-color: var(--av-accent);
	box-shadow: none;
	outline: none;
}
input[readonly] { background: var(--av-soft); color: var(--av-muted); }

/* 5. Buttons: 44px high, radius 6px, small uppercase label */
.button, button.button, input[type="submit"], .wp-block-button__link, .wpcf7-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 22px;
	border-radius: var(--av-r);
	font-family: var(--av-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.2;
}
input[type="submit"], .wpcf7-submit {
	background-color: var(--av-accent);
	border: 1px solid var(--av-accent);
	color: #fff;
	cursor: pointer;
}
input[type="submit"]:hover, .wpcf7-submit:hover { background-color: var(--av-accent-hover); border-color: var(--av-accent-hover); }
/* hero button on the home page: accent fill instead of the white outline stored in the block */
.home .wp-block-cover .wp-block-button .wp-block-button__link {
	background-color: var(--av-accent) !important;
	border-color: var(--av-accent) !important;
	color: #fff !important;
	border-radius: var(--av-r) !important;
	min-height: 48px;
	padding: 0 28px !important;
}
.home .wp-block-cover .wp-block-button .wp-block-button__link:hover {
	background-color: var(--av-accent-hover) !important;
	border-color: var(--av-accent-hover) !important;
}

/* 6. Header: full width, logo near the left edge, light → dark gradient, semi-transparent
   and blurred, staying at the top of the window on every page (round 3) */
html { scroll-padding-top: 110px; } /* anchors (#site-footer…) are not hidden under the header */
/* Neve sets overflow:hidden on .wrapper, which turns off position:sticky for the header and the
   catalog sidebar. "clip" cuts off sideways overflow the same way but keeps sticky working. */
.wrapper { overflow: visible !important; overflow-x: clip !important; }
header.header {
	position: sticky;
	top: 0;
	/* above Neve's transparent .nav-clickaway-overlay (z-index 90), which covers the page while
	   the header search is open; below it, clicks on the field and on live-search results hit
	   that layer and only close the search */
	z-index: 100;
}
/* On phones Neve's full-width row holding the close (x) button lies over the lower half of the
   search field; let taps through it so they reach the field, the button itself still works */
.nv-nav-search .close-container { pointer-events: none; }
.nv-nav-search .close-container button { pointer-events: auto; }
.admin-bar header.header { top: 32px; }
@media (max-width: 782px) { .admin-bar header.header { top: 46px; } }
@media (max-width: 600px) { .admin-bar header.header { top: 0; } } /* the admin bar scrolls away on phones */
.header-main { background-color: transparent !important; } /* Neve paints the row itself black (--bgcolor) */
.header-main .header--row-inner {
	background-color: transparent !important;
	background-image: linear-gradient(90deg, rgba(244, 241, 236, 0.94) 0%, rgba(244, 241, 236, 0.9) 10%, rgba(11, 11, 11, 0.84) 54%, rgba(11, 11, 11, 0.8) 100%);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	transition: background-image 0.25s ease;
}
.header-main.layout-fullwidth .container {
	max-width: none;
	padding-left: 32px;
	padding-right: 32px;
}
@media (max-width: 959px) {
	.header-main .header--row-inner {
		background-image: linear-gradient(90deg, rgba(244, 241, 236, 0.94) 0%, rgba(244, 241, 236, 0.9) 22%, rgba(11, 11, 11, 0.84) 68%, rgba(11, 11, 11, 0.8) 100%);
	}
	.header-main.layout-fullwidth .container { padding-left: 16px; padding-right: 16px; }
}
/* Neve prints the logo as .neve-site-logo (setting logo_logo) */
/* Bigger logo at the same header height (round 14): Neve's 8px+5px space above and below the logo
   item and its 79px width cap are dropped; desktop 74px tall in an 82px header, phones 58px in 64px. */
.header-main .builder-item:has(> .item--inner.builder-item--logo) { margin-top: 0 !important; margin-bottom: 0 !important; }
.header-main .item--inner.builder-item--logo { padding-top: 4px !important; padding-bottom: 4px !important; }
.header-main .neve-site-logo { max-height: 74px !important; max-width: none !important; width: auto; }
@media (max-width: 959px) {
	.header-main .item--inner.builder-item--logo { padding-top: 3px !important; padding-bottom: 3px !important; }
	.header-main .neve-site-logo { max-height: 58px !important; }
}
.header-main .nav-ul > li > a,
.header-main .nav-ul > li > .wrap > a {
	font-family: var(--av-head);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.header-main .nav-ul > li.current-menu-item > a,
.header-main .nav-ul > li.current-menu-item > .wrap > a,
.header-main .nav-ul > li > a:hover { color: #fdba74 !important; } /* light orange: readable on black (≥8:1) */

/* Phone header: the menu (burger) button had Neve's white 1px box; now it matches the header —
   no frame, three 22px lines, a 44×44 tap area with a soft highlight; the search icon next to it
   is drawn at the same scale. */
.header-main button.navbar-toggle,
.header-menu-sidebar button.navbar-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: var(--av-r) !important;
	background: transparent !important;
	box-shadow: none !important;
	transition: background-color 0.15s ease;
}
.header-main button.navbar-toggle:hover,
.header-main button.navbar-toggle:focus-visible,
.header-menu-sidebar button.navbar-toggle:hover,
.header-menu-sidebar button.navbar-toggle:focus-visible { background: rgba(255, 255, 255, 0.12) !important; outline: none; }
/* bar spacing stays Neve's own: its open-menu animation turns the bars into an X from that spacing */
.header-main button.navbar-toggle .icon-bar {
	width: 20px !important;
	border-radius: 2px;
	background-color: #fff !important;
}
.header-main .menu-item-nav-search > button.nv-search {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 44px;
	border-radius: var(--av-r);
}
.header-main .menu-item-nav-search > button.nv-search svg { width: 18px; height: 18px; }
.header-main .menu-item-nav-search > button.nv-search:hover { background: rgba(255, 255, 255, 0.12); }
/* Home and pages that open with a cover photo (About, Contacts: body class avicena-hero-page):
   the header lies over the photo and is lighter there (as on the old site); once the
   page scrolls past the photo, avicena-search.js adds .avicena-scrolled and the header
   darkens like on other pages, so the white menu stays readable over light sections. */
:is(.home, .avicena-hero-page) header.header {
	position: fixed;
	left: 0;
	right: 0;
}
:is(.home, .avicena-hero-page) .header-main .nav-ul > li > a { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4); } /* readable over the bright lamps */
:is(.home, .avicena-hero-page):not(.avicena-scrolled) .header-main .header--row-inner {
	background-image: linear-gradient(90deg, rgba(244, 241, 236, 0.92) 0%, rgba(244, 241, 236, 0.85) 9%, rgba(11, 11, 11, 0.45) 48%, rgba(11, 11, 11, 0.25) 100%);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
@media (max-width: 959px) {
	:is(.home, .avicena-hero-page):not(.avicena-scrolled) .header-main .header--row-inner {
		background-image: linear-gradient(90deg, rgba(244, 241, 236, 0.92) 0%, rgba(244, 241, 236, 0.85) 20%, rgba(11, 11, 11, 0.5) 66%, rgba(11, 11, 11, 0.35) 100%);
	}
}
:is(.home, .avicena-hero-page) .wp-block-cover:first-child .wp-block-cover__inner-container { padding-top: 64px; } /* keep the title clear of the header */

/* 7. Headings of sections: normal case, quiet accent bar (blocks store uppercase inline, hence !important) */
.avicena-section-title,
.related.products > h2,
.upsells.products > h2 {
	font-family: var(--av-head) !important;
	font-size: clamp(24px, 3vw, 30px) !important;
	font-weight: 700 !important;
	letter-spacing: -0.01em !important;
	text-transform: none !important;
	text-align: center;
	margin: 0 0 32px !important;
}
.avicena-section-title::after,
.related.products > h2::after {
	content: "";
	display: block;
	width: 40px;
	height: 2px;
	background: var(--av-accent);
	margin: 14px auto 0;
}
.wp-block-group:has(> .avicena-section-title) > p.has-text-align-center { color: var(--av-muted); margin-top: -16px !important; }

/* 8. Catalog (К1) */
.woocommerce-products-header__title.page-title,
.archive .page-title { font-size: clamp(28px, 3.4vw, 36px); font-weight: 700; margin-bottom: 4px; }
.woocommerce-breadcrumb { color: var(--av-muted); font-size: 13px; margin-bottom: 12px; }
.woocommerce-breadcrumb a { color: var(--av-muted); text-decoration: underline; text-decoration-color: var(--av-line-strong); text-underline-offset: 3px; }
.woocommerce-breadcrumb a:hover { color: var(--av-accent); }

/* catalog page («Продукція»): no breadcrumbs there, so no 60px gap above the heading (Neve: main .nv-shop) */
body.woocommerce-shop:not(.search) main .nv-shop { margin-top: 0; }

/* Neve's filter bar (.nv-woo-filters) only holds the phone button that opens the category panel
   (sorting is hidden). From 960px the sidebar is visible and the bar is empty but kept a 40px
   margin, so it goes; the gap under the breadcrumbs is tightened too. */
@media (min-width: 960px) {
	.nv-shop .nv-woo-filters { display: none; }
}
.nv-shop .nv-bc-count-wrap { margin-bottom: 12px; }
.nv-shop .nv-woo-filters { margin-bottom: 10px; } /* phones: the bar with the category button (Neve: 40px) */
/* sidebar: 280px wide, stays in view while the products scroll */
@media (min-width: 960px) {
	.shop-container > .row > .nv-sidebar-wrap.shop-sidebar {
		flex: 0 0 280px;
		max-width: 280px !important; /* Neve limits the sidebar to 25% */
		padding-right: 0;
		margin-right: 48px;
	}
	.shop-container > .row > .nv-shop { flex: 1 1 0; max-width: none; min-width: 0; }
	.shop-sidebar > aside { position: sticky; top: 110px; } /* below the sticky header */
	.admin-bar .shop-sidebar > aside { top: 142px; }
	/* the category list scrolls on its own when it is taller than the window */
	.shop-sidebar .widget_product_categories .product-categories {
		max-height: calc(100vh - 200px);
		overflow-y: auto;
		padding-right: 6px;
		scrollbar-width: thin;
	}
}
.shop-sidebar .widget { margin-bottom: 28px; }
.shop-sidebar .widget-title {
	font-family: var(--av-head);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--av-text);
	margin-bottom: 8px;
}
/* Product search band right under the header, above the whole catalog (round 4) */
.avicena-search-band {
	padding: 24px 0 4px;
	background: transparent; /* the warm page colour runs up to the top, behind the header (round 5) */
}
.avicena-search-band .container { display: flex; }
.avicena-search-band form.woocommerce-product-search { width: 100%; max-width: 640px; }
.woocommerce-products-header { margin-bottom: 28px; }
/* Search forms (catalog band, the header search, 404): the form draws the frame, so the magnifier
   button sits inside it (the right edge used to be covered by the button). "body :is(…)" outranks
   Neve's own .search-form rules. */
body :is(.woocommerce-product-search, form.search-form) {
	position: relative;
	display: flex;
	align-items: stretch;
	background: #fff;
	border: 1px solid var(--av-line-strong);
	border-radius: var(--av-r);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body :is(.woocommerce-product-search, form.search-form):focus-within { border-color: var(--av-accent); box-shadow: none; }
body :is(.woocommerce-product-search, form.search-form) .search-field,
body :is(.woocommerce-product-search, form.search-form) .search-field:focus {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	min-height: 46px;
	padding: 0 4px 0 16px;
	border: 0;
	border-radius: var(--av-r) 0 0 var(--av-r);
	background: transparent;
	box-shadow: none;
	outline: none;
}
body :is(.woocommerce-product-search, form.search-form) button {
	position: static;
	flex: 0 0 48px;
	width: 48px;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 0 var(--av-r) var(--av-r) 0;
	background: transparent;
	color: var(--av-muted);
	cursor: pointer;
}
/* the button never draws its own frame or focus ring: the whole form shows focus (Neve and the
   global :focus-visible rule used to draw a box around the magnifier on hover/click) */
body :is(.woocommerce-product-search, form.search-form) button,
body :is(.woocommerce-product-search, form.search-form) button:hover,
body :is(.woocommerce-product-search, form.search-form) button:focus,
body :is(.woocommerce-product-search, form.search-form) button:focus-visible,
body :is(.woocommerce-product-search, form.search-form) button:active {
	border: 0 !important;
	outline: none !important;
	box-shadow: none !important;
	background: transparent !important;
}
body :is(.woocommerce-product-search, form.search-form) button:hover,
body :is(.woocommerce-product-search, form.search-form) button:focus-visible { color: var(--av-accent); }
body :is(.woocommerce-product-search, form.search-form) button svg { width: 17px; height: 17px; fill: currentColor; }

/* category tree as an accordion (avicena-search.js adds the toggles) */
.shop-sidebar .product-categories,
.shop-sidebar .product-categories .children { list-style: none; margin: 0; padding: 0; }
.shop-sidebar .product-categories > li {
	position: relative;
	border-bottom: 1px solid var(--av-line);
	font-size: 14px;
	line-height: 1.4;
}
.shop-sidebar .product-categories li > a {
	display: block;
	padding: 10px 48px 10px 0;
	color: var(--av-text);
	text-decoration: none;
}
.shop-sidebar .product-categories li > a:hover { color: var(--av-accent); }
.shop-sidebar .product-categories .count { display: none; } /* round 3: no product counts in the tree */
/* expand arrow: a 40×40 target (easy to hit, also with a finger) */
.shop-sidebar .avicena-cat-toggle {
	position: absolute;
	right: 0;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: var(--av-r);
	background: transparent;
	color: var(--av-muted);
	cursor: pointer;
}
.shop-sidebar .avicena-cat-toggle:hover,
.shop-sidebar .avicena-cat-toggle:focus-visible { background: #efe9e1; color: var(--av-accent); }
.shop-sidebar .avicena-cat-toggle::before {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	margin-top: -4px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.15s ease, margin 0.15s ease;
}
.shop-sidebar .cat-parent.is-open > .avicena-cat-toggle::before { transform: rotate(-135deg); margin-top: 4px; }
.shop-sidebar .product-categories .children {
	display: none;
	margin: 0 0 10px 2px;
	padding-left: 14px;
	border-left: 2px solid var(--av-line);
}
.shop-sidebar .cat-parent.is-open > .children { display: block; }
.no-js .shop-sidebar .product-categories .children,
.shop-sidebar:not(.avicena-tree) .product-categories .children { display: block; } /* without the script: everything open */
.shop-sidebar .product-categories .children li { position: relative; font-size: 13.5px; }
.shop-sidebar .product-categories .children li > a { padding: 6px 8px 6px 0; }
.shop-sidebar .product-categories .current-cat > a,
.shop-sidebar .product-categories .current-cat-parent > a { color: var(--av-accent); font-weight: 600; }

/* category tiles: name over the photo (selectors outrank WooCommerce's
   ".woocommerce ul.products li.product …" rules) */
body ul.products li.product.product-category > a {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--av-r-lg);
	background: var(--av-frame);
}
body ul.products li.product.product-category > a img {
	width: 100%;
	aspect-ratio: 4 / 3;
	height: auto;
	object-fit: cover;
	margin: 0;
	opacity: 0.92;
	transition: transform 0.35s ease, opacity 0.35s ease;
}
body ul.products li.product.product-category > a:hover img { transform: scale(1.04); opacity: 1; }
body ul.products li.product.product-category .woocommerce-loop-category__title {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 48px 16px 14px;
	background: linear-gradient(transparent, rgba(0, 0, 0, 0.82));
	color: #fff;
	font-family: var(--av-head);
	font-size: clamp(13px, 1.2vw, 16px); /* long words like «Електрокардіографи» fit narrow tiles */
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.3;
	overflow-wrap: break-word;
	hyphens: auto;
}
body ul.products li.product.product-category .woocommerce-loop-category__title mark.count {
	display: block;
	margin-top: 3px;
	padding: 0;
	background: none;
	color: #fdba74;
	font-family: var(--av-body);
	font-size: 13px;
	font-weight: 500;
}
@media (max-width: 600px) {
	body ul.products li.product { margin-bottom: 12px !important; } /* WooCommerce's ~3em gap between rows is too much on phones */
	body ul.products li.product.product-category .woocommerce-loop-category__title { font-size: 13px; padding: 32px 10px 10px; }
	body ul.products li.product.product-category .woocommerce-loop-category__title mark.count { font-size: 12px; }
}

/* product cards: white, hairline border, image on white */
ul.products li.product:not(.product-category) .nv-card-content-wrapper {
	height: 100%;
	padding: 14px 14px 16px;
	background: var(--av-card);
	border: 1px solid var(--av-line);
	border-radius: var(--av-r-lg);
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
ul.products li.product:not(.product-category) .nv-card-content-wrapper:hover {
	border-color: var(--av-line-strong);
	box-shadow: 0 8px 24px rgba(28, 25, 23, 0.08);
}
ul.products li.product:not(.product-category) img {
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background: #fff;
}
body ul.products li.product a.woocommerce-loop-product__link h2.woocommerce-loop-product__title {
	margin-top: 12px;
	padding: 0;
	font-family: var(--av-body);
	font-size: 14.5px;
	line-height: 1.45;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--av-text);
	overflow-wrap: break-word;
}
.avicena-more {
	display: inline-block;
	margin-top: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--av-accent);
	text-decoration: none;
}
.avicena-more:hover { color: var(--av-accent-hover); }

/* Product carousel (home «Продукція»: products block with class "avicena-product-slider").
   One row that scrolls sideways and snaps to cards; avicena-search.js adds the arrows.
   Selectors start with body .woocommerce.avicena-product-slider to beat WooCommerce's
   float/width rules (incl. its small-screen :nth-child ones). */
.avicena-product-slider {
	--av-slider-gap: 20px;
	--av-slider-cols: 5;
	position: relative;
}
body .woocommerce.avicena-product-slider ul.products {
	display: flex;
	gap: var(--av-slider-gap);
	margin: 0;
	padding: 8px 2px;   /* equal top/bottom so the arrows (top: 50% of the block) sit on the cards' middle */
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-padding-left: 2px;
	scrollbar-width: none;
}
body .woocommerce.avicena-product-slider ul.products::-webkit-scrollbar { display: none; }
body .woocommerce.avicena-product-slider ul.products::before,
body .woocommerce.avicena-product-slider ul.products::after { content: none; display: none; }
body .woocommerce.avicena-product-slider ul.products li.product {
	flex: 0 0 calc((100% - (var(--av-slider-cols) - 1) * var(--av-slider-gap)) / var(--av-slider-cols));
	float: none;
	clear: none;
	width: auto;
	margin: 0 !important;
	scroll-snap-align: start;
}
.avicena-slider-btn {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	color: var(--av-text);
	background: var(--av-card);
	border: 1px solid var(--av-line-strong);
	border-radius: 50%;
	box-shadow: 0 4px 14px rgba(28, 25, 23, 0.12);
	cursor: pointer;
	transform: translateY(-50%);
	transition: color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}
/* Neve paints every button:hover/:focus with its primary-button colours; keep the arrows white */
.avicena-product-slider .avicena-slider-btn:is(:hover, :focus, :active) {
	color: var(--av-text);
	background: var(--av-card);
	border-color: var(--av-line-strong);
}
.avicena-product-slider .avicena-slider-btn:hover:not(:disabled) { color: var(--av-accent); border-color: var(--av-accent); }
.avicena-product-slider .avicena-slider-btn:focus-visible { outline: none; box-shadow: var(--av-ring); }
.avicena-product-slider .avicena-slider-btn:disabled { opacity: 0.35; cursor: default; }
.avicena-slider-prev { left: -22px; }
.avicena-slider-next { right: -22px; }
.avicena-slider-next svg { transform: scaleX(-1); }
.avicena-slider-static .avicena-slider-btn { display: none; }
@media (max-width: 1200px) {
	.avicena-slider-prev { left: -8px; }
	.avicena-slider-next { right: -8px; }
}
@media (max-width: 1024px) {
	.avicena-product-slider { --av-slider-cols: 3; }
}
@media (max-width: 768px) {
	/* phones and small tablets: swipe; a slice of the next card shows that the row goes on */
	.avicena-product-slider { --av-slider-cols: 2.2; --av-slider-gap: 12px; }
	.avicena-slider-btn { display: none; }
}
@media (max-width: 480px) {
	.avicena-product-slider { --av-slider-cols: 1.6; }
}

/* category description under the products */
.avicena-term-description {
	margin-top: 40px;
	padding: 28px;
	background: var(--av-card);
	border: 1px solid var(--av-line);
	border-radius: var(--av-r-lg);
}
.avicena-term-description h2 { font-size: 18px; font-weight: 700; margin-bottom: 12px; }

/* 9. Product page (П2) */
.single-product .woocommerce-product-gallery {
	padding: 20px;
	background: var(--av-card);
	border: 1px solid var(--av-line);
	border-radius: var(--av-r-lg);
}
.single-product .summary .product_meta { display: none; } /* the category is shown as a label above the title */
.single-product .product_title { font-size: clamp(26px, 3vw, 34px); font-weight: 700; line-height: 1.2; margin-bottom: 8px; }
.avicena-cat-chip {
	display: inline-block;
	margin-bottom: 14px;
	padding: 4px 10px;
	border: 1px solid #f1c9b2;
	border-radius: 999px;
	background: #fdf3ec;
	color: var(--av-accent-hover);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-decoration: none;
}
.avicena-cat-chip:hover { color: var(--av-accent-hover); border-color: var(--av-accent); }
.avicena-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 8px; }
.avicena-actions a.button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; margin: 0; } /* Neve's .button.alt is inline-block */
.avicena-actions a.button.avicena-tel {
	background: transparent;
	color: var(--av-text);
	border: 1px solid var(--av-line-strong);
}
.avicena-actions a.button.avicena-tel:hover,
.avicena-actions a.button.avicena-tel:focus { border-color: var(--av-text); background: transparent; color: var(--av-text); }

.woocommerce-tabs {
	margin-top: 40px;
	padding: 0 28px 28px;
	background: var(--av-card);
	border: 1px solid var(--av-line);
	border-radius: var(--av-r-lg);
}
.woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 24px;
	padding: 0;
	border-bottom: 1px solid var(--av-line);
	list-style: none;
}
.woocommerce-tabs ul.tabs::before, .woocommerce-tabs ul.tabs::after { display: none; }
.woocommerce-tabs ul.tabs li { margin: 0; padding: 0; border: 0; background: none; }
.woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 16px 4px 14px;
	margin-right: 20px;
	margin-bottom: -1px;
	color: var(--av-muted);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border-bottom: 2px solid transparent;
}
.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover { color: var(--av-text); border-bottom-color: var(--av-accent); }
.woocommerce-tabs .panel > h2:first-child { display: none; } /* Woo repeats the tab name as a heading */
/* Neve/WooCommerce draw their own 3px line under the active <li> (and small corner pieces); with
   the 2px line under the link that gave two offset orange lines. Only the link's line stays, and the
   thin line under all tabs comes back. Selectors match Neve's ".woocommerce div.product …" weight. */
.woocommerce div.product .woocommerce-tabs ul.tabs { border-bottom: 1px solid var(--av-line) !important; padding: 0 !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--av-muted); border-bottom: 2px solid transparent; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--av-text); border-bottom-color: var(--av-accent); }
.woocommerce-Tabs-panel { font-size: 15.5px; }
.woocommerce-Tabs-panel h2, .woocommerce-Tabs-panel h3 { font-size: 18px; margin: 24px 0 10px; }

.avicena-specs { width: 100%; border-collapse: collapse; font-size: 15px; margin: 0; }
.avicena-specs td { padding: 11px 14px; border: 0; border-bottom: 1px solid var(--av-line); vertical-align: top; }
.avicena-specs tr:nth-child(odd) td { background: var(--av-soft); }
.avicena-specs td:first-child { width: 46%; color: var(--av-muted); }
.avicena-specs td:last-child { color: var(--av-text); font-weight: 500; }
.woocommerce-Tabs-panel pre {
	margin: 0 0 1em;
	padding: 0;
	overflow: visible;
	background: none;
	border: 0;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	white-space: pre-wrap;
}
.woocommerce-Tabs-panel table:not(.avicena-specs) { width: 100%; border-collapse: collapse; font-size: 15px; }
.woocommerce-Tabs-panel table:not(.avicena-specs) td,
.woocommerce-Tabs-panel table:not(.avicena-specs) th { border: 1px solid var(--av-line); padding: 9px 12px; }
@media (max-width: 600px) {
	.woocommerce-tabs { padding: 0 16px 18px; }
	.woocommerce-tabs ul.tabs li a { margin-right: 14px; }
	.avicena-specs td { padding: 10px; }
	.avicena-specs td:first-child { width: 50%; }
}

/* 10. «Запитати ціну» dialog */
#avicena-ask {
	width: calc(100% - 32px);
	max-width: 520px;
	max-height: calc(100vh - 32px);
	overflow: auto;
	padding: 0; /* padding sits on .avicena-ask-inner, so a click on the dialog element itself is a backdrop click */
	border: 0;
	border-radius: 10px;
	background: var(--av-card);
	color: var(--av-text);
	box-shadow: 0 24px 64px rgba(0, 0, 0, 0.35);
}
#avicena-ask::backdrop { background: rgba(12, 10, 9, 0.6); }
.avicena-ask-inner { position: relative; padding: 28px 28px 24px; border-top: 3px solid var(--av-accent); }
#avicena-ask h2 { margin: 0 0 18px; font-size: 20px; font-weight: 700; }
.avicena-ask-close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 36px;
	height: 36px;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: var(--av-r);
	background: none;
	color: var(--av-muted);
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
}
.avicena-ask-close:hover { background: var(--av-soft); color: var(--av-text); }
#avicena-ask .wpcf7-form p { margin: 0 0 14px; }
#avicena-ask .wpcf7-form label { display: block; font-size: 13px; font-weight: 500; color: var(--av-muted); }
#avicena-ask .wpcf7-form input[type="text"],
#avicena-ask .wpcf7-form input[type="tel"],
#avicena-ask .wpcf7-form input[type="email"],
#avicena-ask .wpcf7-form textarea { width: 100%; margin-top: 6px; }
#avicena-ask .wpcf7-form textarea { min-height: 96px; height: 96px; }

/* 11. Live product search (avicena-search.js) */
.avicena-ls { position: relative; }
.avicena-ls-list {
	position: absolute;
	left: 0;
	top: calc(100% + 6px);
	z-index: 1000;
	width: max(100%, 380px);
	max-width: calc(100vw - 32px);
	margin: 0;
	padding: 0;
	list-style: none;
	background: #fff;
	border: 1px solid var(--av-line);
	border-radius: var(--av-r-lg);
	box-shadow: 0 16px 40px rgba(28, 25, 23, 0.14);
	overflow: hidden;
	text-align: left;
}
.avicena-ls-list[hidden] { display: none; }
.avicena-ls-item a {
	display: grid;
	grid-template-columns: 44px 1fr;
	gap: 12px;
	align-items: center;
	padding: 10px 14px;
	border-bottom: 1px solid #f1ede7;
	color: var(--av-text);
	text-decoration: none;
}
.avicena-ls-item.is-active a, .avicena-ls-item a:hover { background: var(--av-soft); color: var(--av-text); }
.avicena-ls-item img {
	width: 44px;
	height: 44px;
	object-fit: contain;
	background: #fff;
	border: 1px solid #f1ede7;
	border-radius: 4px;
}
.avicena-ls-name { display: block; font-size: 14px; font-weight: 500; line-height: 1.35; }
.avicena-ls-name mark { background: #fde7d6; color: inherit; border-radius: 2px; padding: 0 1px; }
.avicena-ls-cat { display: block; font-size: 12px; color: var(--av-muted); margin-top: 2px; }
.avicena-ls-note { padding: 12px 14px; font-size: 14px; color: var(--av-muted); }
.avicena-ls-all a {
	display: block;
	padding: 11px 14px;
	background: #fcfbf9;
	color: var(--av-accent);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}
.avicena-ls-all.is-active a, .avicena-ls-all a:hover { background: var(--av-soft); color: var(--av-accent-hover); }

/* 12. Home: consultation band */
.avicena-cta-band {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 16px 32px;
	padding: 48px 24px;
	background: var(--av-frame);
	color: var(--av-on-dark);
	text-align: center;
}
.avicena-cta-band h2 { margin: 0; color: var(--av-on-dark); font-size: clamp(20px, 2.4vw, 26px); font-weight: 600; letter-spacing: -0.01em; }
.avicena-cta-band .avicena-tel { color: var(--av-on-dark); font-size: 18px; font-weight: 600; text-decoration: none; }
.avicena-cta-band .avicena-tel:hover { color: var(--av-accent-on-dark); }
.avicena-cta-band a.button { background-color: var(--av-accent); border: 1px solid var(--av-accent); color: #fff; }
.avicena-cta-band a.button:hover, .avicena-cta-band a.button:focus { background-color: var(--av-accent-hover); border-color: var(--av-accent-hover); color: #fff; }

/* 13. Footer and contact form (form rules moved here from Customizer → Additional CSS) */
.wpcf7-form input[type="text"], .wpcf7-form input[type="email"], .wpcf7-form input[type="tel"], .wpcf7-form textarea { width: 100%; }
.wpcf7-form label, .wpcf7-form .wpcf7-form-control-wrap { display: block; }
.wpcf7-form textarea { height: 130px; }
/* honeypot field: off-screen for people, bots still fill it */
.avicena-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.site-footer { font-size: 15px; }
.site-footer .widget-title, .site-footer h2, .site-footer h3, .site-footer h4 { color: #fff; font-size: 16px; font-weight: 600; letter-spacing: 0; }
.site-footer a { color: inherit; }
.site-footer a:hover { color: var(--av-accent-on-dark); }
.site-footer input[type="text"], .site-footer input[type="email"], .site-footer textarea {
	background: #1c1917;
	border-color: #3f3a36;
	color: #fff;
}
.site-footer input:focus, .site-footer textarea:focus { border-color: var(--av-accent-on-dark); box-shadow: none; }
.site-footer .wpcf7-form label { color: var(--av-on-dark-muted); font-size: 13px; }
.site-footer .wpcf7-submit { margin-top: 4px; }

/* Header search (Neve's overlay): leave room on the right for Neve's own close button, which
   otherwise sits on top of the magnifier */
.nv-nav-search .form-wrap form.search-form { margin-right: 84px; }
@media (max-width: 600px) { .nv-nav-search .form-wrap form.search-form { margin-right: 64px; } }

/* 14. Contacts page: the contact lines start level with the first form field (round 5); the footer
   keeps only the copyright line — its main row (menu, form, contacts) is empty there (round 7) */
.page-id-50 .site-footer .footer-main { display: none; }
.page-id-50 .avicena-contacts { padding-top: 34px; } /* padding: a margin would merge with the heading's margin above */
@media (max-width: 781px) { .page-id-50 .avicena-contacts { padding-top: 0; } }

/* 15. Home photo changing smoothly (avicena-search.js): the photos come from the hidden gallery
   «avicena-hero-slides» on the home page (edit it in the page editor) */
.avicena-hero-slides { display: none !important; }
.wp-block-cover .avicena-hero-layer {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
	opacity: 0;
	transition: opacity 1.4s ease;
	z-index: 0;
}
.wp-block-cover .avicena-hero-layer.is-on { opacity: 1; }

/* 16. Home photo fills the whole screen; the categories appear on scroll (as on the old site).
   The block itself is set to 100vh; svh keeps it exact on phones (browser bars), and the WordPress
   admin bar (only for signed-in editors) is taken off. */
.home .wp-block-cover:first-child { min-height: 100vh !important; min-height: 100svh !important; }
.admin-bar.home .wp-block-cover:first-child { min-height: calc(100vh - 32px) !important; min-height: calc(100svh - 32px) !important; }
@media (max-width: 782px) {
	.admin-bar.home .wp-block-cover:first-child { min-height: calc(100vh - 46px) !important; min-height: calc(100svh - 46px) !important; }
}