/* =========================================================
   AESTHETICZ PRODUCT EXPERIENCE — apx-product-card.css
   =========================================================
   The .dlx-product-card / .dlx-pc-* / .apx-pc-* markup that
   apx-core.js's renderCard() outputs, styled once here and enqueued
   sitewide — so every page using window.apx.renderList() (homepage,
   Shop, category archives, wishlist, recently-viewed, and anywhere
   else in future) renders identically without duplicating this CSS
   per page.

   Uses the same --dlx-* variable names already defined by header.php
   (loaded on every page before this file), so no :root block needed
   here — this file only ever runs alongside header.php.

   Also fills in a few classes renderCard() has always emitted
   (out-of-stock overlay, extra badge chips, short description, Buy Now
   link) that hadn't been styled anywhere yet — a pre-existing gap this
   file now fixes for every page at once, homepage included.
   ========================================================= */

.dlx-product-card{
	background: var(--dlx-card); border-radius: var(--dlx-radius-md, 22px); overflow:hidden;
	box-shadow: var(--dlx-shadow); position:relative;
	transition: transform .45s var(--dlx-ease, cubic-bezier(.22,1,.36,1)), box-shadow .45s var(--dlx-ease, cubic-bezier(.22,1,.36,1));
	animation: dlx-pc-float 6s ease-in-out infinite;
}
@keyframes dlx-pc-float{ 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(-4px);} }
.dlx-product-card:hover{ transform: translateY(-10px); box-shadow: var(--dlx-shadow-lift); animation-play-state:paused; }

.dlx-pc-media{ position:relative; aspect-ratio:1/1.05; overflow:hidden; }
.dlx-pc-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition: opacity .5s ease, transform .6s var(--dlx-ease, cubic-bezier(.22,1,.36,1)); }
.dlx-pc-img-back{ opacity:0; }
.dlx-product-card:hover .dlx-pc-img-front{ opacity:0; transform: scale(1.06); }
.dlx-product-card:hover .dlx-pc-img-back{ opacity:1; transform: scale(1.06); }

.dlx-shine-sweep{ position:absolute; inset:0; z-index:2; background: linear-gradient(115deg, transparent 40%, hsla(0,0%,100%,.55) 50%, transparent 60%); transform: translateX(-120%); pointer-events:none; }
.dlx-pc-media:hover .dlx-shine-sweep{ animation: dlx-pc-shine 1s ease; }
@keyframes dlx-pc-shine{ to{ transform: translateX(120%);} }

.dlx-pc-badge{ position:absolute; top:.8rem; left:.8rem; z-index:3; background: var(--dlx-text); color: var(--dlx-bg); font-size:.64rem; font-weight:700; letter-spacing:.5px; padding:.35rem .65rem; border-radius:999px; }
.dlx-pc-badge.dlx-sale{ background: var(--dlx-pink); color:#fff; }

.apx-pc-badge-stack{ position:absolute; top:2.3rem; left:.8rem; z-index:3; display:flex; flex-direction:column; gap:.35rem; }
.apx-pc-chip{ font-size:.62rem; font-weight:600; letter-spacing:.3px; padding:.3rem .6rem; border-radius:999px; background: var(--dlx-card); color: var(--dlx-text); box-shadow: var(--dlx-shadow); width:fit-content; }

.dlx-pc-wish{ position:absolute; top:.7rem; right:.7rem; z-index:3; width:42px; height:42px; border-radius:50%; background: hsla(0,0%,100%,.85); display:flex; align-items:center; justify-content:center; color: var(--dlx-text); transition: transform .3s ease, color .3s ease; }
html[data-dlx-theme="dark"] .dlx-pc-wish{ background: hsla(255,15%,15%,.85); }
.dlx-pc-wish.apx-active{ color: var(--dlx-pink); }
.dlx-pc-wish:hover{ transform: scale(1.12); }
.dlx-pc-media .dlx-pc-wish svg{ width:20px !important; height:20px !important; flex-shrink:0; }

.dlx-pc-quickview{
	position:absolute; left:50%; bottom:-50px; transform: translateX(-50%); z-index:3;
	background: var(--dlx-card); color: var(--dlx-text); font-size:.74rem; font-weight:600;
	padding:.55rem 1.1rem; border-radius:999px; white-space:nowrap; box-shadow: var(--dlx-shadow);
	transition: bottom .4s var(--dlx-ease, cubic-bezier(.22,1,.36,1));
}
.dlx-product-card:hover .dlx-pc-quickview{ bottom:12px; }

.apx-pc-stock-overlay{
	position:absolute; inset:0; z-index:4; display:flex; align-items:center; justify-content:center; text-align:center;
	background: hsla(0,0%,100%,.6); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
	font-family:'Outfit',sans-serif; font-weight:600; font-size:.8rem; letter-spacing:.4px; color: var(--dlx-text);
}
html[data-dlx-theme="dark"] .apx-pc-stock-overlay{ background: hsla(255,15%,10%,.6); }
.dlx-product-card.apx-pc-out-of-stock{ opacity:.75; }

.dlx-pc-body{ padding:1.1rem 1.2rem 1.3rem; }
.dlx-pc-body h3{ font-size:1.05rem; margin-bottom:.4rem; font-weight:600; line-height:1.3; }
.dlx-pc-body h3 a{ color: var(--dlx-text); text-decoration:none; }
.dlx-pc-rating{ display:flex; align-items:center; gap:.4rem; font-size:.78rem; color:#F0B429; margin-bottom:.5rem; }
.dlx-pc-rating span{ color: var(--dlx-text-soft); }
.apx-pc-short-desc{ font-size:.8rem; color: var(--dlx-text-soft); line-height:1.5; margin:0 0 .7rem; }

.dlx-pc-price-row{ display:flex; align-items:center; justify-content:space-between; }
.dlx-pc-price{ font-weight:700; font-size:1rem; color: var(--dlx-text); }
.dlx-pc-price del{ color: var(--dlx-text-soft); font-weight:400; font-size:.8rem; margin-left:.4rem; }
.dlx-pc-add{ width:44px; height:44px; border-radius:50%; background: var(--dlx-pink-soft); color: var(--dlx-accent); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition: background .3s ease, transform .3s ease, color .3s ease; }
.dlx-pc-wish.apx-flash-success,
.dlx-pc-add.apx-flash-success{
	background:#2FBE6B !important; color:#fff !important; transform:scale(1.08);
}
.dlx-pc-add:hover{ background: linear-gradient(135deg, var(--dlx-pink), var(--dlx-lilac)); color:#fff; transform: rotate(90deg); }
.dlx-pc-add:disabled{ opacity:.4; cursor:not-allowed; }
.dlx-pc-add:disabled:hover{ background: var(--dlx-pink-soft); color: var(--dlx-accent); transform:none; }
.dlx-pc-price-row .dlx-pc-add svg{ width:20px !important; height:20px !important; flex-shrink:0; }

.apx-pc-buynow{
	display:block; width:100%; text-align:center; margin-top:.7rem; font-family:'Outfit',sans-serif; font-weight:600; font-size:.78rem;
	color: var(--dlx-accent); background:none; padding:.55rem; border-radius:999px; border:1px solid var(--dlx-border);
	text-decoration:none; cursor:pointer; transition: background .3s ease, border-color .3s ease, opacity .3s ease;
}
.apx-pc-buynow:hover{ background: var(--dlx-pink-soft); border-color:transparent; }
.apx-pc-buynow:disabled{ opacity:.5; cursor:not-allowed; }
.apx-pc-buynow:disabled:hover{ background:none; border-color: var(--dlx-border); }