/*
Theme Name: Mazenra E-commerce
Author: Arfaoui Marwen
Description: Modern e-commerce WordPress theme for Mazenra store.
Version: 1.0
Text Domain: mazenra
Requires at least: 6.0
Tested up to: 6.5
Template: blocksy
*/

/* Custom CSS placeholder (intentionally empty). */

/* LP Campaign Card (Bold Premium global brand style) */
.lp-campaign-card {
	position: relative;
	background: linear-gradient(135deg, #0f172a, #1e293b);
	border-radius: 18px;
	padding: 22px;
	color: #ffffff;
	box-shadow: 0 15px 40px rgba(0,0,0,0.35);
	overflow: hidden;
	transition: transform .3s ease, box-shadow .3s ease;
	text-align: start;
	direction: inherit;
}

.lp-campaign-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 25px 60px rgba(0,0,0,0.45);
}

.lp-campaign-brand {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: fit-content;
	max-width: 100%;
	margin: -2px 0 10px;
	padding: 8px 14px;
	background: #ffffff;
	border: 0;
	border-radius: 14px;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
}

.lp-campaign-brand img {
	width: 160px;
	max-width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
	filter: none;
}

/* Campaign brand ticker: ensure readable text on white badge */
.lp-campaign-brand .lp-campaign-brand-ticker,
.lp-campaign-brand .lp-campaign-brand-ticker__item,
.lp-campaign-brand .lp-campaign-ticker {
	color: #1f2937;
	font-weight: 700;
}

/* Campaign ticker motion/readability (CSS-only overrides; do not touch PHP renderer) */
@keyframes tickerScroll {
	0% { transform: translateX(100%); }
	100% { transform: translateX(-100%); }
}

.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-brand-ticker__track,
.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-ticker {
	animation: tickerScroll 26s linear infinite !important;
	animation-play-state: running;
}

.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-brand-ticker:hover .lp-campaign-brand-ticker__track,
.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-brand-ticker__track:hover,
.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-ticker:hover {
	animation-play-state: paused !important;
}

.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-brand-ticker__item,
.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-ticker {
	font-size: 16px;
	font-weight: 700;
}

.lp-campaign-ticker:hover {
	animation-play-state: paused;
}

.lp-campaign-content h1,
.lp-campaign-content h2 {
	color: #ffffff;
	font-weight: 700;
	position: relative;
	margin-bottom: 10px;
}

.lp-campaign-content h1::after,
.lp-campaign-content h2::after {
	content: "";
	display: block;
	width: 60px;
	height: 3px;
	background: linear-gradient(90deg, #ff8a00, #ff6a00);
	margin-top: 8px;
	border-radius: 3px;
}

.lp-campaign-content h3 {
	color: #ffffff;
	margin-bottom: 12px;
}

.lp-campaign-content p {
	opacity: 0.9;
	line-height: 1.7;
	margin: 0 0 10px;
}

/* Woo Single Product — Direct order UI (reuse LP handlers) */
body.single-product .davino-direct-order-error,
body.single-product .davino-direct-order-success {
	display: none;
	margin-top: 12px;
	padding: 12px;
	border-radius: 12px;
	border: 1px solid var(--theme-border-color, rgba(0,0,0,.12));
	background: var(--theme-palette-color-8, #fff);
}

body.single-product .davino-direct-order-error.is-visible,
body.single-product .davino-direct-order-success.is-visible {
	display: block;
}

body.single-product .davino-direct-order-fields {
	margin-top: 10px;
}

body.single-product .davino-direct-order-field {
	margin: 8px 0 0;
}

body.single-product .davino-direct-order-field > label {
	display: block;
	margin-bottom: 4px;
}

body.single-product .davino-direct-order-field > input,
body.single-product .davino-direct-order-field > textarea {
	width: 100%;
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 15px;
}

body.single-product .davino-direct-order-field > input[name="phone"] {
	width: 100%;
}

body.single-product .davino-direct-order-field > textarea[name="address"] {
	min-height: 42px;
	max-height: 120px;
	resize: vertical;
}

body.single-product .davino-direct-order-quote {
	margin-top: 12px;
	padding: 10px 12px;
	border-radius: 12px;
	border: 1px solid var(--theme-border-color, rgba(0,0,0,.12));
	background: var(--theme-palette-color-8, #fff);
}

body.single-product .davino-direct-order-quote-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
}

.lp-campaign-content a,
.lp-campaign-content .cta-button {
	display: inline-block;
	margin-top: 18px;
	background: linear-gradient(135deg, #ff8a00, #ff6a00);
	padding: 11px 24px;
	border-radius: 10px;
	color: white;
	font-size: 14px;
	font-weight: 600;
	box-shadow: 0 10px 25px rgba(255, 122, 0, 0.35);
	text-decoration: none;
	transition: all .3s ease;
}

.lp-campaign-content a:hover {
	background: linear-gradient(135deg, #ff6a00, #e85d00);
	transform: translateY(-2px);
	box-shadow: 0 15px 35px rgba(255, 122, 0, 0.45);
}

@media (max-width: 768px) {
	/* Mobile: keep CTA in same place but centered + more rectangular */
	.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-cta {
		display: flex;
		justify-content: center;
	}

	.lp-campaign-slot[data-slot="category_banner"] .lp-campaign-cta a {
		border-radius: 6px;
	}
}

/* ====================================================================== */
/* Homepage Hero Slider (ACF-driven)
   - Reuses existing .bc-hero container + responsive system
   - Does not remove min-height/overlay/breakpoints
/* ====================================================================== */

section.bc-hero.bc-hero--slider {
	overflow: hidden;
}

section.bc-hero.bc-hero--slider::before {
	/* Stronger contrast for white overlay text (keeps the overlay layer). */
	background: linear-gradient(
		90deg,
		rgba(0, 0, 0, 0.15) 0%,
		rgba(0, 0, 0, 0.25) 45%,
		rgba(0, 0, 0, 0.55) 100%
	);
	z-index: 2;
}

.bc-hero--slider .bc-hero__inner {
	/* Keep structure, but don’t block slider interactions. */
	position: relative;
	z-index: 1;
	pointer-events: none;
}

.bc-hero--slider .hero-slider {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	min-height: inherit;
	overflow: hidden;
	z-index: 3;
}

.bc-hero--slider .hero-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 1s ease;
}

.bc-hero--slider .hero-slide.active {
	opacity: 1;
	z-index: 2;
}

.bc-hero--slider .hero-bg {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transform: scale(1);
	will-change: transform;
}

.bc-hero--slider .hero-slide.active .hero-bg {
	animation: kenburns 18s ease infinite;
}

@keyframes kenburns {
	0% { transform: scale(1); }
	100% { transform: scale(1.15); }
}

.bc-hero--slider .hero-overlay {
	position: absolute;
	right: 8%;
	top: 50%;
	transform: translateY(-50%);
	color: #fff;
	text-align: right;
	max-width: 520px;
	z-index: 3;
	text-shadow: 0 10px 22px rgba(0, 0, 0, 0.35);
}

.bc-hero--slider .hero-title {
	font-size: 58px;
	font-weight: 800;
	line-height: 1.2;
	margin: 0;
}

.bc-hero--slider .hero-subtitle {
	margin-top: 16px;
	font-size: 22px;
	opacity: 0.9;
}

.bc-hero--slider .hero-btn {
	display: inline-block;
	margin-top: 25px;
	padding: 16px 34px;
	background: #F59E0B;
	color: #fff;
	border-radius: 10px;
	font-weight: 600;
	transition: 0.3s;
	text-decoration: none;
}

.bc-hero--slider .hero-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.bc-hero--slider .hero-dots {
	position: absolute;
	bottom: 30px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 10px;
	z-index: 4;
}


/* ====================================================================== */
/* WooCommerce Single Product — Design & UX (Blocksy/Flexy safe)
   - Scoped to product page only
   - Uses Blocksy CSS variables (does not break architecture)
/* ====================================================================== */

body.single-product {
	--davino-brand-primary: #0B1B3A;
	--davino-brand-accent: #F59E0B;
	--theme-palette-color-1: #F59E0B;
	--theme-link-hover-color: var(--theme-palette-color-1);
	--theme-link-active-color: var(--theme-palette-color-1);
}

/* ====================================================================== */
/* WooCommerce Single Product — Brand styling (Blocksy + WVS safe)
   - No WooCommerce core edits
   - No plugin source edits
   - Uses variables/overrides scoped to single product page
/* ====================================================================== */

/* TASK 1 — PRODUCT TITLE
   Blocksy dynamic styles attach --theme-heading-color on .entry-summary .entry-title.
   Override it on the same element with higher specificity + !important. */
body.single-product .entry-summary .entry-title {
	--theme-heading-color: #0B1B3A !important;
}

/* TASK 2 — PRODUCT PRICE
   Force brand primary for price; keep sale (ins) visually stronger than del. */
body.single-product .entry-summary .price {
	color: #0B1B3A !important;
}

body.single-product .entry-summary .price ins {
	font-weight: 800;
	text-decoration: none;
}

body.single-product .entry-summary .price del {
	opacity: 0.55;
}

/* TASK 3 + 4 — SIZE BUTTONS (WVS) + OUT OF STOCK CROSS
   Override Woo Variation Swatches CSS variables (single product only). */
body.single-product .woo-variation-swatches {
	--wvs-item-background-color: #ffffff;
	--wvs-item-text-color: #0B1B3A;

	/* Default: light border */
	--wvs-item-box-shadow: 0 0 0 1px rgba(11, 27, 58, 0.18);

	/* Hover: accent ring */
	--wvs-hover-item-box-shadow: 0 0 0 2px #F59E0B;

	/* Selected: primary ring + primary background + white text */
	--wvs-selected-item-box-shadow: 0 0 0 2px #0B1B3A;
	--wvs-selected-item-background-color: #0B1B3A;
	--wvs-selected-item-text-color: #ffffff;

	/* Replace default red cross (injected on :root by plugin) with accent SVG */
	--wvs-cross: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='72'%20height='72'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='none'%20stroke='%23F59E0B'%20stroke-linecap='round'%20stroke-width='0.6'%20d='M5%205L19%2019M19%205L5%2019'/%3E%3C/svg%3E") !important;
}

/* ====================================================================== */
/* WooCommerce Single Product — Tabs (Woo-safe)
   - Targets core selectors: .woocommerce-tabs, .wc-tabs, .woocommerce-Tabs-panel
   - Pure CSS (no markup/JS changes)
/* ====================================================================== */

body.single-product .woocommerce-tabs {
	margin-top: 26px;
}

/* Reset Woo default lines/pseudo elements so we can restyle cleanly */
body.single-product .woocommerce-tabs ul.tabs,
body.single-product .woocommerce-tabs ul.wc-tabs {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.single-product .woocommerce-tabs ul.tabs::before,
body.single-product .woocommerce-tabs ul.tabs::after,
body.single-product .woocommerce-tabs ul.wc-tabs::before,
body.single-product .woocommerce-tabs ul.wc-tabs::after {
	display: none;
}

/* Tabs nav: modern pill buttons, wraps on desktop and scrolls on small screens */
body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding-block: 6px;
	border-bottom: 1px solid rgba(11, 27, 58, 0.12);
}

@media (max-width: 689.98px) {
	body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 10px;
	}
}

body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) li {
	margin: 0;
	padding: 0;
}

body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) li a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 20px;
	border-radius: 8px;
	font-weight: 600;
	letter-spacing: 0.2px;
	text-decoration: none;
	color: rgba(11, 27, 58, 0.88);
	background: #ffffff;
	border: 1px solid rgba(11, 27, 58, 0.12);
	transition: color .15s ease, border-color .15s ease, opacity .15s ease;
}

@media (max-width: 689.98px) {
	body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) li a {
		padding: 10px 14px;
		white-space: nowrap;
	}
}

@media (any-hover: hover) {
	body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) li a:hover {
		opacity: 0.92;
		border-color: rgba(245, 158, 11, 0.35);
		color: var(--davino-brand-primary);
	}
}

/* Active tab: accent underline + primary text */
body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) li.active a,
body.single-product .woocommerce-tabs :is(ul.tabs, ul.wc-tabs) li[aria-selected="true"] a {
	color: var(--davino-brand-primary);
	border-color: rgba(11, 27, 58, 0.16);
	box-shadow: inset 0 -3px 0 0 var(--davino-brand-accent);
}

/* Content panels */
body.single-product .woocommerce-tabs .woocommerce-Tabs-panel {
	margin: 14px 0 0;
	padding: 18px 20px;
	border: 1px solid rgba(11, 27, 58, 0.12);
	border-radius: 12px;
	background: #ffffff;
	color: rgba(11, 27, 58, 0.92);
	font-size: 16px;
	line-height: 1.8;
	text-align: start;
}

/* ====================================================================== */
/* WooCommerce Single Product — Reviews (Woo-safe, CSS only)
   Targets core selectors:
   - Container: .woocommerce-Reviews
   - Reviews list: .commentlist li
   - Form: #review_form, .comment-form, textarea, inputs
   - Submit button: #submit
/* ====================================================================== */

body.single-product :where(.woocommerce-Reviews, #reviews) {
	font-size: 15px;
	line-height: 1.7;
	color: rgba(11, 27, 58, 0.92);
}

body.single-product :where(#reviews .woocommerce-Reviews-title, #review_form .comment-reply-title) {
	color: #0B1B3A;
	font-weight: 800;
	letter-spacing: 0.2px;
}

/* STEP 3 — Star rating style */
body.single-product :where(.woocommerce-Reviews .star-rating, .comment-form-rating .stars) {
	color: #F59E0B;
}

body.single-product .comment-form-rating .stars {
	font-size: 1.05em;
}

/* STEP 2 — Review form inputs */
body.single-product #review_form :where(textarea, input[type="text"], input[type="email"], input[type="url"]) {
	border-radius: 10px;
	padding: 12px 14px;
	border: 1px solid #ddd;
	font-size: 15px;
	background: #ffffff;
	color: #0B1B3A;
	box-shadow: none;
}

body.single-product #review_form :where(textarea, input[type="text"], input[type="email"], input[type="url"]):focus {
	outline: none;
	border-color: #F59E0B;
	box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.2);
}

body.single-product #review_form textarea {
	min-height: 140px;
	resize: vertical;
}

/* Ensure form fields stack cleanly */
body.single-product #review_form .comment-form > p {
	margin-bottom: 14px;
}

body.single-product #review_form .comment-form :where(input:not([type="checkbox"]):not([type="radio"]), textarea) {
	width: 100%;
}

/* Consent checkbox (cookies consent) — fix layout + premium checkbox */
body.single-product #review_form .comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.6;
	color: #0B1B3A;
	margin-top: 12px;
	margin-bottom: 12px;
}

body.single-product #review_form .comment-form .comment-form-cookies-consent input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	min-width: 18px;
	margin: 2px 0 0;
	border: 1px solid #0B1B3A;
	border-radius: 4px;
	background: #ffffff;
	display: inline-grid;
	place-content: center;
	box-shadow: none;
}

body.single-product #review_form .comment-form .comment-form-cookies-consent input[type="checkbox"]:checked {
	background-color: #F59E0B;
	border-color: #F59E0B;
}

body.single-product #review_form .comment-form .comment-form-cookies-consent input[type="checkbox"]:checked::after {
	content: "";
	width: 9px;
	height: 5px;
	border: 2px solid #ffffff;
	border-top: 0;
	border-right: 0;
	transform: rotate(-45deg);
}

body.single-product #review_form .comment-form .comment-form-cookies-consent input[type="checkbox"]:focus {
	outline: none;
	box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.2);
}

body.single-product #review_form .comment-form .comment-form-cookies-consent label {
	flex: 1;
	min-width: 0;
	margin: 0;
}

/* STEP 4 — Submit button design */
body.single-product #review_form #submit {
	background: #F59E0B;
	color: #ffffff;
	border: none;
	border-radius: 10px;
	padding: 12px 28px;
	font-weight: 600;
	transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

@media (any-hover: hover) {
	body.single-product #review_form #submit:hover {
		background: #e38c00;
		transform: translateY(-1px);
		box-shadow: 0 10px 22px rgba(11, 27, 58, 0.12);
	}
}

body.single-product #review_form #submit:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.22);
}

/* STEP 5 — Existing reviews layout */
body.single-product .woocommerce-Reviews .commentlist {
	list-style: none;
	padding: 0;
	margin: 0;
}

body.single-product .woocommerce-Reviews .commentlist li {
	padding: 20px;
	border: 1px solid #eee;
	border-radius: 12px;
	margin-bottom: 18px;
	background: #fafafa;
}

body.single-product .woocommerce-Reviews .commentlist li .comment_container {
	gap: 18px;
}

body.single-product .woocommerce-Reviews .commentlist li .meta {
	color: rgba(11, 27, 58, 0.78);
}

body.single-product .woocommerce-Reviews .commentlist li .description {
	font-size: 15px;
	line-height: 1.7;
}

/* STEP 7 — Responsive spacing */
@media (max-width: 689.98px) {
	body.single-product .woocommerce-Reviews .commentlist li {
		padding: 16px;
	}

	body.single-product #review_form #submit {
		width: 100%;
	}
}

@media (max-width: 689.98px) {
	body.single-product .woocommerce-tabs .woocommerce-Tabs-panel {
		padding: 16px;
	}
}

/* TASK 2 — Product gallery layout (Flexy)
   Reduce main image width slightly on desktop; improve thumbnails visibility/spacing */
@media (min-width: 1000px) {
	body.single-product .product-entry-wrapper {
		/* Slightly larger gallery + narrower summary (COD direct order form) */
		--product-gallery-width: 55%;
		/* Ensure both columns start at the same vertical level */
		align-items: flex-start;
	}
}

/* Improve spacing between gallery and summary (Blocksy uses logical margin) */
@media (min-width: 1000px) {
	body.single-product.ct-default-gallery .entry-summary,
	body.single-product.ct-stacked-gallery .entry-summary {
		--davino-summary-gap: 32px;
		margin-inline-start: var(--davino-summary-gap);
		margin-top: 0;
		padding-top: 0;
		/* Blocksy sets summary width to (100% - gallery). We subtract the gap so
		   the 45/55 layout remains visually consistent without flex shrink. */
		width: calc(100% - var(--product-gallery-width, 50%) - var(--davino-summary-gap));
	}
}

/* Remove any extra top offset that can push the summary down (desktop only) */
@media (min-width: 1000px) {
	body.single-product :where(.summary, .entry-summary, .product-summary) {
		margin-block-start: 0;
		padding-block-start: 0;
		align-self: flex-start;
	}

	body.single-product :where(.woocommerce-product-gallery, .images, .product-gallery) {
		align-self: flex-start;
	}
}

/* Fallback for non-Blocksy single product layouts (Woo default markup) */
@media (min-width: 1000px) {
	body.single-product :where(.woocommerce, .woocommerce-page) div.product {
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-start;
		gap: 32px;
	}

	body.single-product :where(.woocommerce, .woocommerce-page) div.product > :where(.woocommerce-product-gallery, .images, .product-gallery) {
		flex: 0 0 55%;
		max-width: 55%;
	}

	body.single-product :where(.woocommerce, .woocommerce-page) div.product > :where(.summary, .entry-summary, .product-summary) {
		flex: 1 1 45%;
		max-width: 45%;
	}
}

@media (max-width: 999.98px) {
	body.single-product :where(.woocommerce, .woocommerce-page) div.product {
		display: block;
	}

	body.single-product :where(.woocommerce-product-gallery, .images, .product-gallery),
	body.single-product :where(.summary, .entry-summary, .product-summary) {
		max-width: 100%;
		width: 100%;
	}
}

body.single-product div.woocommerce-product-gallery {
	--thumbs-spacing: 18px;
}

/* Larger thumbs in vertical (thumbs-left) layout */
@media (min-width: 690px) {
	body.single-product .thumbs-left {
		--thumbs-width: 110px;
	}
}

/* More visible active thumbnail (brand accent) */
body.single-product div.woocommerce-product-gallery li.active .ct-media-container:after {
	border-color: var(--theme-palette-color-1);
}

/* TASK — Product gallery height (Flexy)
   Constrain the main image viewport on desktop so it doesn't visually exceed
   the purchase area (Add to Cart). Thumbnails remain outside the constrained
   region, so navigation stays usable. */
@media (min-width: 1000px) {
	body.single-product div.woocommerce-product-gallery {
		--davino-gallery-max-height: min(520px, 62vh);
	}

	body.single-product div.woocommerce-product-gallery .flexy-view {
		height: var(--davino-gallery-max-height);
		max-height: 520px;
	}

	body.single-product div.woocommerce-product-gallery .flexy-view .flexy-items,
	body.single-product div.woocommerce-product-gallery .flexy-view .flexy-items > * {
		height: 100%;
	}

	body.single-product div.woocommerce-product-gallery .flexy-view .ct-media-container {
		height: 100%;
		align-items: center;
		justify-content: center;
	}

	body.single-product div.woocommerce-product-gallery .flexy-view :is(img, picture, picture > img) {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}
}

/* TASK 3 — Add to Cart button redesign (Blocksy variables)
   Compatible with .ct-product-add-to-cart and Woo .single_add_to_cart_button */
body.single-product .entry-summary .ct-product-add-to-cart {
	--theme-button-min-height: 58px;
	--theme-button-padding: 10px 22px;
	--theme-button-font-size: 16px;
	--theme-button-font-weight: 700;
	--theme-button-border-radius: 14px;
}

body.single-product .entry-summary .single_add_to_cart_button {
	--theme-button-text-initial-color: #ffffff;
	--theme-button-text-hover-color: #ffffff;
	--theme-button-background-initial-color: #F59E0B;
	--theme-button-background-hover-color: #F59E0B;
	--theme-button-shadow: block;
	--theme-button-transform: translate3d(0, -2px, 0);
}

/* Unified single-product order fields (Shopify-like)
   Scope: only inside product summary on single product pages */
body.single-product .entry-summary form.cart :is(
	input[type="text"],
	input[type="tel"],
	input[type="email"],
	input[type="search"],
	input[type="url"],
	input[type="password"],
	select,
	textarea
) {
	box-sizing: border-box;
	width: 100%;
	height: 48px;
	border: 1px solid #E5E7EB;
	border-radius: 8px;
	padding: 12px;
	font-size: 15px;
	line-height: 1.2;
	color: #0B1B3A;
	background: #fff;
	outline: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Address behaves like a single-line input */
body.single-product .entry-summary form.cart textarea {
	height: 48px !important;
	min-height: 48px;
	max-height: 48px;
	resize: none;
	overflow: hidden;
}

body.single-product .entry-summary form.cart :is(
	input[type="text"],
	input[type="tel"],
	input[type="email"],
	input[type="search"],
	input[type="url"],
	input[type="password"],
	select,
	textarea
):hover {
	border-color: #D1D5DB;
}

body.single-product .entry-summary form.cart :is(
	input[type="text"],
	input[type="tel"],
	input[type="email"],
	input[type="search"],
	input[type="url"],
	input[type="password"],
	select,
	textarea
):focus {
	border-color: #F59E0B;
	box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.15);
}

body.single-product .entry-summary form.cart :is(
	input[type="text"],
	input[type="tel"],
	input[type="email"],
	input[type="search"],
	input[type="url"],
	input[type="password"],
	select,
	textarea
)::placeholder {
	color: rgba(11, 27, 58, 0.55);
}

@supports (background: color-mix(in srgb, #000 0%, #fff 100%)) {
	body.single-product .entry-summary .single_add_to_cart_button {
		--theme-button-background-hover-color: color-mix(in srgb, #F59E0B 85%, #000);
	}
}

/* Mobile: keep CTA easy to tap and full width */
@media (max-width: 689.98px) {
	body.single-product .entry-summary .ct-product-add-to-cart .single_add_to_cart_button {
		width: 100%;
	}
}

/* ====================================================================== */
/* Landing Product (LP) — Order form UI overrides (CSS only)
   Scope: only inside the LP template markup (.lp-root .lp-wrap)
   Goal: visible borders, brand focus highlight, branded submit button
/* ====================================================================== */

.lp-root .lp-wrap :is(
	input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
	select,
	textarea
) {
	border: 1px solid #d1d5db !important;
	background: #ffffff !important;
	border-radius: 10px !important;
	padding: 12px 14px !important;
	min-height: 48px;
	line-height: 1.2;
	outline: none !important;
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

/* Fix ولاية select placeholder clipping/misalignment in RTL */
.lp-root .lp-wrap select.lp-select {
	direction: rtl;
	text-align: right;
	white-space: nowrap;
	padding-inline-start: 44px !important;
	padding-inline-end: 14px !important;
}

/* Keep phone readable as numbers */
.lp-root .lp-wrap input[type="tel"].lp-input {
	direction: ltr;
	text-align: left;
}

.lp-root .lp-wrap :is(
	input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
	select,
	textarea
):focus {
	border-color: #F59E0B !important;
	box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.18) !important;
}

.lp-root .lp-wrap form.cart button.single_add_to_cart_button {
	background-color: #F59E0B !important;
	color: #ffffff !important;
	border-radius: 12px !important;
	padding: 14px 18px !important;
	border: 0 !important;
	transition: background-color 140ms ease, filter 140ms ease;
}

.lp-root .lp-wrap form.cart button.single_add_to_cart_button:hover {
	background-color: #d97706 !important;
}

@supports (background: color-mix(in srgb, #000 0%, #fff 100%)) {
	.lp-root .lp-wrap form.cart button.single_add_to_cart_button:hover {
		background-color: color-mix(in srgb, #F59E0B 85%, #000) !important;
	}
}

/* Micro-trust under CTA (LP-only) */
.lp-root .lp-wrap .lp-microtrust {
	margin-top: -6px;
	margin-bottom: 14px;
	text-align: center;
	font-size: 13px;
	line-height: 1.5;
	color: rgba(15, 23, 42, 0.72);
}

/* ====================================================================== */
/* WooCommerce Quantity Selector — Premium UI (Woo-safe)
   - Styles only (no markup/JS changes)
   - Targets Woo classes: .quantity, .qty, .plus, .minus
   - Also supports Blocksy controls: .ct-increase, .ct-decrease
/* ====================================================================== */

/* Base container: rounded, subtle border, white background */
:where(.woocommerce, .woocommerce-page) div.quantity {
	--theme-form-field-border-radius: 10px;
	position: relative;
	border-radius: 10px;
	background: #ffffff;
	border: 1px solid rgba(15, 23, 42, 0.12);
	overflow: hidden;
}

/* Focus state for accessibility (keeps keyboard usability) */
:where(.woocommerce, .woocommerce-page) div.quantity:focus-within {
	border-color: var(--theme-palette-color-1, #F59E0B);
	box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.22);
}

/* Input: centered number, minimal chrome */
:where(.woocommerce, .woocommerce-page) div.quantity input.qty,
:where(.woocommerce, .woocommerce-page) div.quantity input[type="number"] {
	border: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	text-align: center;
	font-weight: 700;
	font-size: 16px;
	padding-block: 0;
}

/* Blocksy quantity buttons are absolutely positioned; keep their logic intact,
   just restyle colors/shape and spacing for a modern UI. */
:where(.woocommerce, .woocommerce-page) div.quantity[data-type] {
	--quantity-initial-color: transparent;
	--quantity-hover-color: var(--theme-palette-color-1, #F59E0B);
	--quantity-arrows-initial-color: rgba(15, 23, 42, 0.70);
	--quantity-arrows-hover-color: #ffffff;
}

:where(.woocommerce, .woocommerce-page) div.quantity[data-type] :is(.ct-increase, .ct-decrease) {
	border-radius: 8px;
	border: 1px solid rgba(15, 23, 42, 0.10);
}

:where(.woocommerce, .woocommerce-page) div.quantity[data-type] :is(.ct-increase, .ct-decrease):hover {
	border-color: color-mix(in srgb, var(--theme-palette-color-1, #F59E0B) 55%, transparent);
}

:where(.woocommerce, .woocommerce-page) div.quantity[data-type] :is(.ct-increase, .ct-decrease):active {
	transform: translateY(1px);
}

/* Type-2: left/right square icon buttons + balanced inner spacing */
:where(.woocommerce, .woocommerce-page) div.quantity[data-type="type-2"] :is(.ct-increase, .ct-decrease) {
	width: calc(var(--quantity-height, 55px) / 1.8);
	height: calc(var(--quantity-height, 55px) / 1.8);
}

:where(.woocommerce, .woocommerce-page) div.quantity[data-type="type-2"] .ct-decrease {
	inset-inline-start: 8px;
}

:where(.woocommerce, .woocommerce-page) div.quantity[data-type="type-2"] .ct-increase {
	inset-inline-end: 8px;
}

:where(.woocommerce, .woocommerce-page) div.quantity[data-type="type-2"] input.qty,
:where(.woocommerce, .woocommerce-page) div.quantity[data-type="type-2"] input[type="number"] {
	padding-inline: calc(var(--quantity-height, 55px) / 1.8 + 18px) !important;
}

/* Woo-style plus/minus buttons (some themes/plugins output these classes) */
:where(.woocommerce, .woocommerce-page) div.quantity :is(.plus, .minus) {
	appearance: none;
	border: 1px solid rgba(15, 23, 42, 0.10);
	background: transparent;
	color: rgba(15, 23, 42, 0.80);
	border-radius: 8px;
	width: clamp(34px, 8vw, 44px);
	height: clamp(34px, 8vw, 44px);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease, transform .05s ease, border-color .15s ease;
}

:where(.woocommerce, .woocommerce-page) div.quantity :is(.plus, .minus):hover {
	background: var(--theme-palette-color-1, #F59E0B);
	border-color: var(--theme-palette-color-1, #F59E0B);
	color: #ffffff;
}

:where(.woocommerce, .woocommerce-page) div.quantity :is(.plus, .minus):active {
	transform: translateY(1px);
}

/* Mobile usability: ensure tap targets stay comfortable */
@media (max-width: 479.98px) {
	:where(.woocommerce, .woocommerce-page) div.quantity {
		min-height: 38px;
	}
}
.bc-hero--slider .hero-dot {
	width: 34px;
	height: 34px;
	background: transparent;
	opacity: 1;
	border-radius: 999px;
	cursor: pointer;
	border: 0;
	padding: 0;
	display: grid;
	place-items: center;
	-webkit-tap-highlight-color: transparent;
}

.bc-hero--slider .hero-dot::before {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #fff;
	opacity: 0.4;
	transition: opacity 200ms ease, transform 200ms ease;
}

.bc-hero--slider .hero-dot.active {
	opacity: 1;
}

.bc-hero--slider .hero-dot.active::before {
	opacity: 1;
	transform: scale(1.05);
}

/* Progress bar (fills during active slide) */
.bc-hero--slider .hero-progress {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	z-index: 4;
	pointer-events: none;
	background: rgba(255, 255, 255, 0.22);
}

.bc-hero--slider .hero-progress__bar {
	height: 100%;
	width: 100%;
	transform-origin: left center;
	transform: scaleX(0);
	background: #F59E0B;
}

.bc-hero--slider .hero-progress__bar.is-animating {
	animation: heroProgressFill 5s linear forwards;
}

.bc-hero--slider.is-paused .hero-progress__bar.is-animating {
	animation-play-state: paused;
}

@keyframes heroProgressFill {
	0% { transform: scaleX(0); }
	100% { transform: scaleX(1); }
}

/* Tablet: reduce title and tighten overlay */
@media (min-width: 48em) and (max-width: 73.75em) {
	.bc-hero--slider .hero-overlay {
		right: 6%;
		max-width: 460px;
	}

	.bc-hero--slider .hero-title {
		font-size: clamp(2.4rem, 2rem + 1.2vw, 3.25rem);
		line-height: 1.15;
	}

	.bc-hero--slider .hero-subtitle {
		font-size: clamp(1.05rem, 0.95rem + 0.4vw, 1.25rem);
	}

	.bc-hero--slider .hero-btn {
		padding: 14px 28px;
		border-radius: 10px;
	}
}

/* Mobile: lower text slightly, center it, keep button visible */
@media (max-width: 47.9375em) {
	section.bc-hero.bc-hero--slider::before {
		background: linear-gradient(
			180deg,
			rgba(0, 0, 0, 0.62) 0%,
			rgba(0, 0, 0, 0.36) 55%,
			rgba(0, 0, 0, 0.24) 100%
		);
	}

	.bc-hero--slider .hero-overlay {
		left: 50%;
		right: auto;
		top: 56%;
		transform: translate(-50%, -50%);
		text-align: center;
		max-width: min(92vw, 34rem);
		padding-inline: 0.5rem;
	}

	.bc-hero--slider .hero-title {
		font-size: clamp(2rem, 6.2vw, 3rem);
		line-height: 1.12;
		text-wrap: balance;
	}

	.bc-hero--slider .hero-subtitle {
		font-size: clamp(1rem, 3.6vw, 1.2rem);
		margin-top: 12px;
		text-wrap: balance;
	}

	.bc-hero--slider .hero-btn {
		margin-top: 18px;
		padding: 12px 22px;
		border-radius: 10px;
		font-size: 14px;
	}

	.bc-hero--slider .hero-dots {
		bottom: 18px;
		gap: 14px;
	}

	.bc-hero--slider .hero-dot {
		width: 40px;
		height: 40px;
	}
}
}

/* ====================================================================== */
/* Mobile override: force summary (title/price) above gallery on small view */
/* Uses high-specificity selectors targeting Blocksy structure and !important
	 to reliably override dynamic CSS generated by the parent theme. */
@media (max-width: 768px) {
	body.single-product div.product.product-type-simple .product-entry-wrapper {
		display: flex !important;
		flex-direction: column !important;
		gap: 12px !important;
	}

	/* Put the summary (title, price, add-to-cart) visually before the gallery */
	body.single-product div.product.product-type-simple .product-entry-wrapper .summary.entry-summary {
		order: -1 !important;
	}

	/* Ensure gallery and thumbs stack after the summary */
	body.single-product div.product.product-type-simple .product-entry-wrapper .woocommerce-product-gallery {
		order: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Thumbnails often live inside the gallery; make sure they follow the main image */
	body.single-product div.product.product-type-simple .product-entry-wrapper .woocommerce-product-gallery .flexy-pills,
	body.single-product div.product.product-type-simple .product-entry-wrapper .woocommerce-product-gallery .flexy-items {
		order: 1 !important;
		width: 100% !important;
	}

	/* Safety: remove any sticky behaviour that could re-position the summary */
	body.single-product.sticky-summary div.product .summary.entry-summary,
	body.single-product .sticky-summary .entry-summary {
		position: static !important;
		top: auto !important;
	}
}