/* =====================================================================
   CarParts — Premium custom Product page (cp-pdp)
   Styles OUR own markup (product-template.php). Scoped to .carparts-product-page.
   Brand #eb2500 appears only on price, Add-to-Cart, discount + small accents.
   No web fonts, no images, inline SVG icons → fast.
   ===================================================================== */

body.carparts-product-page {
	--cp-ink:#14181f; --cp-body:#3a4250; --cp-muted:#6b7280;
	--cp-line:#ECEEF2; --cp-surface:#fff; --cp-soft:#f7f8fa;
	--cp-brand:#eb2500; --cp-brand-d:#c91f00; --cp-amber:#f5a623;
	--cp-r:14px; --cp-r-s:10px;
	--cp-sh:0 1px 2px rgba(20,24,31,.05);
	--cp-sh-l:0 10px 30px rgba(20,24,31,.07);
}

/* hide the theme's own product-page chrome that may leak around our template */
body.carparts-product-page .cz-sticky-add-to-cart,
body.carparts-product-page .codevz-product-live { display:none !important; }

/* KILL the theme's stock-photo hero banner — keep only a clean compact breadcrumb */
body.carparts-product-page .page_cover {
	background:transparent !important; background-image:none !important;
	min-height:0 !important; height:auto !important; padding:0 !important;
	margin:0 !important; box-shadow:none !important; border:0 !important;
}
body.carparts-product-page .page_cover::before,
body.carparts-product-page .page_cover::after { content:none !important; display:none !important; background:none !important; }
body.carparts-product-page .page_cover .codevz-section-title { display:none !important; }
body.carparts-product-page .page_cover .page_title,
body.carparts-product-page .page_cover .row,
body.carparts-product-page .page_cover [data-title-parallax] {
	background:transparent !important; background-image:none !important;
	padding-top:0 !important; padding-bottom:0 !important; min-height:0 !important; height:auto !important;
}
body.carparts-product-page .page_cover .breadcrumbs_container { padding:14px 0 0 !important; margin:0 !important; }
body.carparts-product-page .page_cover .breadcrumbs { justify-content:flex-start !important; color:var(--cp-muted) !important; font-size:13.5px !important; }
body.carparts-product-page .page_cover .breadcrumbs a,
body.carparts-product-page .page_cover .breadcrumbs span,
body.carparts-product-page .page_cover .breadcrumbs b { color:var(--cp-muted) !important; text-shadow:none !important; font-weight:400 !important; }
body.carparts-product-page .page_cover .breadcrumbs a:hover { color:var(--cp-brand) !important; }
body.carparts-product-page .page_cover .breadcrumbs .fa { color:#cfd4db !important; }

/* keep the scroll-to-top arrow clearly ABOVE the sticky add-to-cart bar */
body.carparts-product-page .backtotop { z-index:9992 !important; bottom:90px !important; }

.cp-pdp { background:var(--cp-soft); padding:0 0 56px; color:var(--cp-body); }
.cp-pdp *, .cp-pdp *::before, .cp-pdp *::after { box-sizing:border-box; }
.cp-pdp__wrap { max-width:1240px; margin:0 auto; padding:0 20px; }

/* breadcrumb */
.cp-pdp__crumbs { display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:13.5px; color:var(--cp-muted); padding:22px 2px 18px; }
.cp-pdp__crumbs a { color:var(--cp-muted); text-decoration:none; transition:color .15s; }
.cp-pdp__crumbs a:hover { color:var(--cp-brand); }
.cp-pdp__crumbs-here { color:var(--cp-ink); font-weight:600; max-width:34ch; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ===== layout grid: gallery / details / buybox ===== */
.cp-pdp__grid { display:grid; grid-template-columns:1.25fr 1.25fr .95fr; gap:24px; align-items:start; }

/* ===== gallery ===== */
.cp-pdp__gallery { background:var(--cp-surface); border:1px solid var(--cp-line); border-radius:var(--cp-r); padding:16px; box-shadow:var(--cp-sh); }
.cp-pdp__stage { position:relative; border-radius:var(--cp-r-s); overflow:hidden; }
.cp-pdp__stage-link { display:block; }
.cp-pdp__stage img { display:block; width:100%; height:auto; aspect-ratio:1/1; object-fit:contain; transition:transform .12s ease-out; }
.cp-pdp__stage.is-zoomable { cursor:zoom-in; }
.cp-pdp__off { position:absolute; top:12px; inset-inline-start:12px; z-index:2; background:var(--cp-brand); color:#fff; font-weight:700; font-size:12.5px; padding:5px 11px; border-radius:999px; box-shadow:0 4px 12px rgba(235,37,0,.28); }
.cp-pdp__thumbs { display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.cp-pdp__thumb { width:66px; height:66px; padding:0; border:1px solid var(--cp-line); border-radius:10px; background:#fff; cursor:pointer; overflow:hidden; transition:border-color .15s, transform .15s; }
.cp-pdp__thumb img { width:100%; height:100%; object-fit:contain; }
.cp-pdp__thumb:hover { transform:translateY(-2px); }
.cp-pdp__thumb.is-active { border-color:var(--cp-brand); box-shadow:0 0 0 1px var(--cp-brand) inset; }

/* ===== details ===== */
.cp-pdp__info { padding-top:4px; }
.cp-pdp__title { color:var(--cp-ink); font-weight:700; font-size:25px; line-height:1.7; margin:0 0 14px; }
.cp-pdp__rating { display:flex; align-items:center; gap:8px; margin:0 0 16px; font-size:13.5px; color:var(--cp-muted); }
.cp-pdp__stars { position:relative; display:inline-flex; line-height:0; }
.cp-pdp__stars-base, .cp-pdp__stars-fill { display:inline-flex; }
.cp-pdp__stars-base .cp-pd-ic { width:17px; height:17px; stroke:#d7dbe0; fill:none; }
.cp-pdp__stars-fill { position:absolute; inset-inline-start:0; top:0; overflow:hidden; white-space:nowrap; }
.cp-pdp__stars-fill .cp-pd-ic { width:17px; height:17px; stroke:var(--cp-amber); fill:var(--cp-amber); }
.cp-pdp__rnum { font-weight:700; color:var(--cp-ink); }
.cp-pdp__rcount { color:var(--cp-muted); text-decoration:none; }
.cp-pdp__rcount:hover { color:var(--cp-brand); }
/* right-aligned, not justified (justify stretches word gaps on narrow phones);
   text-wrap:balance evens the line lengths so the ragged left edge stays small */
.cp-pdp__short { color:var(--cp-body); font-size:15.5px; line-height:1.95; padding:16px 0; border-top:1px solid var(--cp-line); border-bottom:1px solid var(--cp-line); text-align:right; }
/* balance only on phones: on the wide desktop column it shortens every line
   and creates a big empty left field — desktop keeps natural wrapping */
@media (max-width:768px){ .cp-pdp__short, .cp-pdp__short p { text-wrap:balance; } }
.cp-pdp__short ul { padding-inline-start:18px; margin:6px 0; }
.cp-pdp__specs { list-style:none; margin:18px 0 0; padding:0; }
.cp-pdp__specs li { display:flex; justify-content:space-between; gap:12px; padding:11px 2px; border-bottom:1px dashed var(--cp-line); font-size:14.5px; }
.cp-pdp__specs li:last-child { border-bottom:0; }
.cp-pdp__spec-k { color:var(--cp-muted); }
.cp-pdp__spec-v { color:var(--cp-ink); font-weight:600; }

/* ===== buy box ===== */
.cp-pdp__buybox { background:var(--cp-surface); border:1px solid var(--cp-line); border-radius:var(--cp-r); padding:20px; box-shadow:var(--cp-sh); }
@media (min-width:1025px){ .cp-pdp__buybox { position:sticky; top:20px; } }
.cp-pdp__seller { display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--cp-muted); padding-bottom:16px; border-bottom:1px solid var(--cp-line); margin-bottom:16px; }
.cp-pdp__seller strong { color:var(--cp-ink); font-weight:700; }
.cp-pdp__seller .cp-pd-ic { width:20px; height:20px; color:var(--cp-brand); }

/* price — ink, not brand red: inside the buybox the red belongs to the CTA
   alone; a red price next to a red button competes with it. Discount badge
   keeps the red accent. */
.cp-pdp__price { margin:0 0 16px; line-height:1.4; }
.cp-pdp__price .price, .cp-pdp__price ins { text-decoration:none; }
.cp-pdp__price .woocommerce-Price-amount { color:var(--cp-ink); font-weight:800; font-size:28px; }
.cp-pdp__price ins .woocommerce-Price-amount { color:var(--cp-ink); }
.cp-pdp__price .woocommerce-Price-currencySymbol { font-size:.6em; font-weight:600; color:var(--cp-muted); margin-inline-start:4px; }
.cp-pdp__price del { display:inline-block; margin-inline-start:10px; }
.cp-pdp__price del .woocommerce-Price-amount { color:var(--cp-muted); font-weight:500; font-size:17px; }
/* the struck-through old price doesn't need its own «تومان» — less clutter */
.cp-pdp__price del .woocommerce-Price-currencySymbol { display:none; }

/* add-to-cart form */
.cp-pdp__cart form.cart { display:flex; align-items:stretch; gap:10px; flex-wrap:wrap; margin:0; }
.cp-pdp__cart .quantity { display:inline-flex !important; align-items:stretch; width:auto !important; flex:0 0 auto; border:1px solid var(--cp-line); border-radius:var(--cp-r-s); overflow:hidden; height:52px; background:#fff; }
.cp-pdp__cart .quantity .qty { width:58px !important; height:50px !important; border:0 !important; text-align:center; font-weight:700; font-size:16px; color:var(--cp-ink) !important; background:transparent !important; box-shadow:none !important; -moz-appearance:textfield; }
.cp-pdp__cart .quantity .qty::-webkit-outer-spin-button,
.cp-pdp__cart .quantity .qty::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.cp-pdp__cart .quantity .quantity-up, .cp-pdp__cart .quantity .quantity-down { width:42px; display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--cp-ink); font-size:18px; border-inline:1px solid var(--cp-line); }
.cp-pdp__cart .quantity .quantity-up:hover, .cp-pdp__cart .quantity .quantity-down:hover { background:var(--cp-soft); color:var(--cp-brand); }
/* guarantee capsule (right) + quantity stepper (left) share one filled row;
   the CTA gets its own full-width line below — no half-empty strips */
.cp-pdp__cart form.cart { flex-direction:column; align-items:stretch; gap:12px; }
.cp-pdp__cart .cp-qty-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cp-pdp__cart .cp-qty-row .cp-guarantee--pdp { margin:0; flex:0 0 auto; }
.cp-pdp__cart .cp-qty-row__label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; } /* keep for screen readers */
.cp-pdp__cart .single_add_to_cart_button.button { flex:0 0 auto !important; width:100%; }
.cp-pdp__cart .cp-qty { display:inline-flex; align-items:center; flex:0 0 auto; height:52px; padding:4px; gap:2px; background:var(--cp-soft); border:1px solid var(--cp-line); border-radius:var(--cp-r-s); }
.cp-pdp__cart .cp-qty__btn { width:32px !important; height:42px !important; padding:0 !important; border:0 !important; border-radius:8px; background:transparent !important; font-size:20px; font-weight:600; line-height:1; color:var(--cp-ink) !important; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s, color .15s, box-shadow .15s; }
.cp-pdp__cart .cp-qty__btn:hover { background:#fff !important; color:var(--cp-brand) !important; box-shadow:0 1px 4px rgba(20,24,31,.10); }
.cp-pdp__cart .cp-qty__input { width:32px !important; height:40px; padding:0 !important; border:0 !important; text-align:center; font-weight:700; font-size:16px; color:var(--cp-ink) !important; background:transparent !important; box-shadow:none !important; -moz-appearance:textfield; }
.cp-pdp__cart .cp-qty__input::-webkit-outer-spin-button, .cp-pdp__cart .cp-qty__input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.cp-pdp__cart .single_add_to_cart_button.button {
	flex:1 1 160px; min-height:52px; background:var(--cp-brand) !important; color:#fff !important;
	border:0 !important; border-radius:var(--cp-r-s) !important; font-weight:700; font-size:16.5px;
	box-shadow:0 6px 18px rgba(235,37,0,.22); transition:background .2s, transform .15s, box-shadow .2s; cursor:pointer;
}
.cp-pdp__cart .single_add_to_cart_button.button:hover { background:var(--cp-brand-d) !important; transform:translateY(-1px); box-shadow:0 10px 24px rgba(235,37,0,.28); }
.cp-pdp__cart .single_add_to_cart_button.button:active { transform:translateY(0); }
.cp-pdp__cart .xtra-product-icons { display:none; } /* hide theme wishlist/compare inside our buy box for a clean look */

/* assurances inside buy box */
.cp-pdp__assure { list-style:none; margin:18px 0 0; padding:16px 0 0; border-top:1px solid var(--cp-line); display:flex; flex-direction:column; gap:13px; }
.cp-pdp__assure li { display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--cp-body); font-weight:600; }
.cp-pdp__assure .cp-pd-ic { width:20px; height:20px; color:var(--cp-ink); flex:0 0 auto; }

/* ===== full-width trust strip ===== */
.cp-pdp__strip { list-style:none; display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between; margin:24px 0 0; padding:18px 8px; background:var(--cp-surface); border:1px solid var(--cp-line); border-radius:var(--cp-r); box-shadow:var(--cp-sh); }
.cp-pdp__strip li { flex:1 1 150px; display:flex; align-items:center; justify-content:center; gap:9px; font-size:13.5px; font-weight:600; color:var(--cp-body); }
.cp-pdp__strip .cp-pd-ic { width:24px; height:24px; color:var(--cp-brand); }

/* ===== tabs (WooCommerce markup, forced horizontal + light) ===== */
.cp-pdp__tabs { margin-top:28px; }
.cp-pdp__tabs .woocommerce-tabs { display:block !important; background:var(--cp-surface); border:1px solid var(--cp-line); border-radius:var(--cp-r); box-shadow:var(--cp-sh); overflow:hidden; }
.cp-pdp__tabs ul.tabs { display:flex !important; flex-wrap:wrap; gap:4px; list-style:none; margin:0 !important; padding:8px 8px 0 !important; border-bottom:1px solid var(--cp-line) !important; background:transparent !important; float:none !important; width:auto !important; }
.cp-pdp__tabs ul.tabs::before, .cp-pdp__tabs ul.tabs::after { display:none !important; }
.cp-pdp__tabs ul.tabs li { float:none !important; width:auto !important; background:transparent !important; border:0 !important; margin:0 !important; padding:0 !important; border-radius:8px 8px 0 0; }
.cp-pdp__tabs ul.tabs li::before, .cp-pdp__tabs ul.tabs li::after { display:none !important; }
.cp-pdp__tabs ul.tabs li a { display:block; padding:12px 18px !important; color:var(--cp-body) !important; font-weight:600; font-size:14.5px; border-bottom:2px solid transparent; transition:color .15s, border-color .15s; }
.cp-pdp__tabs ul.tabs li a:hover { color:var(--cp-ink) !important; }
.cp-pdp__tabs ul.tabs li.active a { color:var(--cp-brand) !important; border-bottom-color:var(--cp-brand); }
.cp-pdp__tabs .panel, .cp-pdp__tabs .woocommerce-Tabs-panel, .cp-pdp__tabs .entry-content { background:transparent !important; float:none !important; width:auto !important; padding:24px !important; margin:0 !important; }
.cp-pdp__tabs .woocommerce-Tabs-panel, .cp-pdp__tabs .woocommerce-Tabs-panel p, .cp-pdp__tabs .woocommerce-Tabs-panel li, .cp-pdp__tabs .woocommerce-Tabs-panel td { color:var(--cp-body) !important; font-size:15.5px; line-height:2; }
.cp-pdp__tabs .woocommerce-Tabs-panel h1, .cp-pdp__tabs .woocommerce-Tabs-panel h2, .cp-pdp__tabs .woocommerce-Tabs-panel h3, .cp-pdp__tabs .woocommerce-Tabs-panel strong { color:var(--cp-ink) !important; }
.cp-pdp__tabs .woocommerce-Tabs-panel a { color:var(--cp-brand) !important; }
/* readable measure: constrain long-form copy to ~70–80 chars */
.cp-pdp__tabs .woocommerce-Tabs-panel > p,
.cp-pdp__tabs .woocommerce-Tabs-panel > ul,
.cp-pdp__tabs .woocommerce-Tabs-panel > ol,
.cp-pdp__tabs .woocommerce-Tabs-panel > h2,
.cp-pdp__tabs .woocommerce-Tabs-panel > h3 { max-width:760px; }
/* clean spec data table */
/* the warranty note is always the description's last paragraph — dress it as
   a green callout so it reads as a trust highlight, not a ragged afterthought */
.cp-pdp__tabs .woocommerce-Tabs-panel--description > p:last-child {
	background:linear-gradient(180deg,#effbf4,#e5f8ec); border:1px solid #cdeeda;
	border-radius:var(--cp-r-s); padding:14px 16px; margin-top:22px; max-width:760px;
}
.cp-pdp__tabs table.shop_attributes { width:100%; max-width:760px; border-collapse:collapse; margin:10px 0; border:1px solid var(--cp-line); border-radius:var(--cp-r-s); overflow:hidden; }
.cp-pdp__tabs table.shop_attributes th,
.cp-pdp__tabs table.shop_attributes td { padding:13px 16px !important; border-bottom:1px solid var(--cp-line); text-align:start; font-size:14.5px; line-height:1.7; }
.cp-pdp__tabs table.shop_attributes th { color:var(--cp-muted) !important; font-weight:600; width:36%; background:var(--cp-soft); }
.cp-pdp__tabs table.shop_attributes td { color:var(--cp-ink) !important; }
.cp-pdp__tabs table.shop_attributes tr:last-child th,
.cp-pdp__tabs table.shop_attributes tr:last-child td { border-bottom:0; }

/* ===== related ===== */
.cp-pdp__related .related.products > h2, .cp-pdp__related .products-header h2 { color:var(--cp-ink); font-size:19px; font-weight:700; margin:36px 0 18px; }
.cp-pdp__related ul.products li.product { transition:transform .2s ease, box-shadow .2s ease; border-radius:var(--cp-r); }
.cp-pdp__related ul.products li.product:hover { transform:translateY(-4px); box-shadow:var(--cp-sh-l); }
.cp-pdp__related .onsale, .cp-pdp__related .cz_new_badge,
.cp-pdp__related span.onsale { padding:4px 11px !important; border-radius:999px !important; box-shadow:0 4px 12px rgba(235,37,0,.22); }

/* ===== always-available sticky add-to-cart bar (desktop + mobile, built in JS) ===== */
.cp-stickybar { position:fixed; inset-inline:0; bottom:0; z-index:9990; background:rgba(255,255,255,.98); backdrop-filter:saturate(1.1) blur(8px); border-top:1px solid var(--cp-line); box-shadow:0 -6px 24px rgba(20,24,31,.10); transform:translateY(115%); transition:transform .28s ease; }
.cp-stickybar.is-visible { transform:translateY(0); }
.cp-stickybar__inner { max-width:1240px; margin:0 auto; display:flex; align-items:center; gap:16px; padding:10px 20px calc(10px + env(safe-area-inset-bottom)); }
.cp-stickybar__info { display:flex; align-items:center; gap:12px; flex:1; min-width:0; }
.cp-stickybar__img { width:48px; height:48px; object-fit:contain; border:1px solid var(--cp-line); border-radius:8px; background:#fff; flex:0 0 auto; }
.cp-stickybar__title { font-weight:700; font-size:15.5px; color:var(--cp-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cp-stickybar__buy { display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.cp-stickybar__price { font-weight:800; font-size:20px; color:var(--cp-ink); white-space:nowrap; }
.cp-stickybar__price del { display:none; }
.cp-stickybar__price .woocommerce-Price-currencySymbol { font-size:.6em; color:var(--cp-muted); font-weight:600; }
.cp-stickybar__btn { min-width:220px; min-height:48px; padding:0 28px; border:0; border-radius:var(--cp-r-s); background:var(--cp-brand); color:#fff; font-weight:700; font-size:16.5px; cursor:pointer; transition:background .2s, transform .15s; box-shadow:0 6px 18px rgba(235,37,0,.22); }
.cp-stickybar__btn:hover { background:var(--cp-brand-d); transform:translateY(-1px); }
@media (max-width:768px){
	/* the fixed bottom nav (carparts-mobile-bottom-nav, z-index 99999) owns
	   bottom:0 on phones — park the sticky bar right above it */
	.cp-stickybar { bottom:62px; }
	.cp-stickybar__inner { padding:9px 14px; gap:12px; }
	.cp-stickybar__info { display:none; }
	.cp-stickybar__buy { flex:1; gap:10px; }
	.cp-stickybar__btn { flex:1; min-width:0; padding:0 16px; }
	.cp-stickybar__price { font-size:17px; }
}

/* ===== responsive ===== */
@media (max-width:1024px){
	.cp-pdp__grid { grid-template-columns:1fr; }
	.cp-pdp__gallery { order:1; }
	.cp-pdp__buybox { order:2; position:static; }
	.cp-pdp__info { order:3; }
	.cp-pdp__buybox, .cp-pdp__gallery { max-width:640px; margin-inline:auto; width:100%; }
	/* single-column view: description + specs floated bare on the page bg while
	   gallery/buybox sat in cards — give the info section the same card shell */
	.cp-pdp__info { background:var(--cp-surface); border:1px solid var(--cp-line); border-radius:var(--cp-r); box-shadow:var(--cp-sh); padding:18px 16px; max-width:640px; margin-inline:auto; width:100%; box-sizing:border-box; }
}
@media (max-width:768px){
	/* the theme's product hero/tabs overflow the viewport on phones — clamp it */
	html, body.carparts-product-page { overflow-x:hidden; max-width:100%; }
	.cp-pdp, .cp-pdp__wrap, .cp-pdp__grid { overflow-x:clip; max-width:100%; }
	.cp-pdp__wrap { padding:0 14px; }
	.cp-pdp__title { font-size:21px; }
	.cp-pdp__price .woocommerce-Price-amount { font-size:25px; }
	.cp-pdp__strip li { flex:1 1 45%; justify-content:flex-start; }
	.cp-pdp__related { margin-bottom:140px; } /* room for sticky bar raised above the bottom nav */
	/* WooCommerce related grid forces min-width items → page-wide overflow; wrap to
	   2 cols — but ONLY while the theme's Slick carousel hasn't initialised. Once
	   slick-initialized lands, these !important rules would explode its track. */
	.cp-pdp__tabs, .cp-pdp__related, .cp-pdp__related .related.products { overflow-x:hidden; max-width:100%; }
	.cp-pdp__related ul.products:not(.slick-initialized) { display:flex !important; flex-wrap:wrap !important; gap:10px !important; margin:0 !important; padding:0 !important; width:100% !important; }
	.cp-pdp__related ul.products:not(.slick-initialized)::before, .cp-pdp__related ul.products:not(.slick-initialized)::after { display:none !important; }
	.cp-pdp__related ul.products:not(.slick-initialized) li.product { width:calc(50% - 5px) !important; min-width:0 !important; margin:0 !important; float:none !important; }
	.cp-pdp__related ul.products.slick-initialized li.product { min-width:0 !important; }
}

/* ===== a11y ===== */
.cp-pdp a:focus-visible, .cp-pdp button:focus-visible { outline:3px solid rgba(235,37,0,.35); outline-offset:2px; }
@media (prefers-reduced-motion:reduce){
	body.carparts-product-page *, .cp-stickybar { transition:none !important; animation:none !important; }
	.cp-pdp__stage:hover img { transform:none; }
}