/* OyeKudiye — product detail page. Header/footer/type scale come from the shared partials +
   motion.css/responsive.css. Server-rendered, reserved image space (no layout shift). */
[hidden]{display:none !important}
body:has(.pdp-modal:not([hidden])){overflow:hidden}

.pdp,.pdp-about{padding-left:0;padding-right:0}
@media (max-width:1199px){.pdp{padding-left:56px;padding-right:56px}}
@media (max-width:1024px){.pdp{padding-left:32px;padding-right:32px}}
@media (max-width:640px){.pdp{padding-left:16px;padding-right:16px}}

.pdp-crumb{padding-top:22px;font:400 13px/1 'Jost',sans-serif;color:rgba(59,11,62,.55);letter-spacing:.04em}
.pdp-crumb a{color:rgba(59,11,62,.55);text-decoration:none}
.pdp-crumb a:hover{color:#B00A60}
.pdp-crumb span{color:#3B0B3E}

.pdp-main{padding:22px 0 44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:start}
@media (max-width:900px){.pdp-main{grid-template-columns:1fr;gap:26px;padding-top:16px}}

/* gallery */
.pdp-gallery{display:flex;flex-direction:column;gap:12px}
.pdp-stage{position:relative;border-radius:18px;overflow:hidden;background:#FDE4EF;aspect-ratio:1/1}
.pdp-mainimg{width:100%;height:100%}
.pdp .oye-slot-ring{display:none}
.pdp-wish{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.92);border:0;
  display:grid;place-items:center;cursor:pointer;color:#3B0B3E;line-height:0}
.pdp-wish.is-on svg{fill:#E6157F;stroke:#E6157F}
.pdp-badge{position:absolute;top:14px;left:14px;padding:6px 13px;border-radius:999px;background:#3B0B3E;color:#FDF0F8;font:500 12px/1 'Jost',sans-serif;letter-spacing:.1em}
.pdp-thumbs{display:flex;gap:10px}
.pdp-thumb{flex:1;padding:0;border-radius:12px;overflow:hidden;background:#FDE4EF;aspect-ratio:1/1;border:2px solid rgba(59,11,62,.12);cursor:pointer;transition:border-color .2s}
.pdp-thumb.is-on{border-color:#3B0B3E}
.pdp-thumb .oye-slot-cap,.pdp-thumb svg{display:none}

/* info */
.pdp-info{display:flex;flex-direction:column;gap:16px;min-width:0}
.pdp-title{margin:0;font:400 clamp(28px,3.2vw,38px)/1.18 'Marcellus',serif;color:#3B0B3E}
.pdp-rating{display:flex;align-items:center;gap:12px;font:400 14px/1 'Jost',sans-serif;color:rgba(59,11,62,.65)}
.pdp-stars{display:flex;gap:2px}
.pdp-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pdp-price b{font:500 28px/1 'Jost',sans-serif;color:#3B0B3E}
.pdp-price s{font:400 17px/1 'Jost',sans-serif;color:rgba(59,11,62,.4)}
.pdp-price em{font:500 15px/1 'Jost',sans-serif;color:#E6157F;font-style:normal}
.pdp-tax{font:400 13px/1 'Jost',sans-serif;color:rgba(59,11,62,.5);margin-top:-8px}
.pdp-stock{display:flex;align-items:center;gap:8px;background:rgba(230,21,127,.08);border:1px solid rgba(230,21,127,.25);border-radius:999px;
  padding:8px 14px;width:fit-content;font:500 13px/1 'Jost',sans-serif;color:#B00A60;letter-spacing:.04em}
.pdp-stock i{width:7px;height:7px;border-radius:50%;background:#E6157F;animation:pdpPulse 1.6s ease infinite}
@keyframes pdpPulse{0%,100%{opacity:1}50%{opacity:.35}}

.pdp-opt{display:flex;flex-direction:column;gap:10px}
.pdp-label{font:500 13px/1 'Jost',sans-serif;letter-spacing:.1em;color:#3B0B3E}
.pdp-labelrow{display:flex;justify-content:space-between;align-items:baseline}
.pdp-sizeguide-btn{background:none;border:0;padding:0;font:400 13px/1 'Jost',sans-serif;color:#B00A60;text-decoration:underline;cursor:pointer}
.pdp-chips{display:flex;gap:8px;flex-wrap:wrap}
.pdp-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:none;border:1px solid rgba(59,11,62,.2);
  font:500 13px/1 'Jost',sans-serif;color:#3B0B3E;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.pdp-tone{padding-left:7px}
.pdp-tone span{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.pdp-chip.is-on{background:#3B0B3E;border-color:#3B0B3E;color:#FDF0F8}
@media (hover:hover){.pdp-chip:not(.is-on):hover{border-color:#3B0B3E}}

.pdp-qtyrow{display:flex;align-items:center;gap:16px}
.pdp-qty{display:flex;align-items:center;border:1px solid rgba(59,11,62,.2);border-radius:999px;overflow:hidden}
.pdp-qty button{width:34px;height:34px;background:none;border:0;font:500 16px/1 'Jost',sans-serif;color:#3B0B3E;cursor:pointer}
.pdp-qn{width:30px;text-align:center;font:500 14px/1 'Jost',sans-serif;color:#3B0B3E}

.pdp-cta{display:flex;gap:10px}
.pdp-add,.pdp-buy{flex:1;height:40px;padding:0 16px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font:500 13px/1 'Jost',sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.pdp-add{background:none;border:1px solid #3B0B3E;color:#3B0B3E}
.pdp-buy{background:#3B0B3E;border:1px solid #3B0B3E;color:#FDF0F8}
@media (hover:hover){.pdp-add:hover{background:#3B0B3E;color:#FDF0F8}.pdp-buy:hover{background:#E6157F;border-color:#E6157F}}
.pdp-add.is-added{background:#3B0B3E;color:#FDF0F8}

.pdp-trust{display:flex;gap:8px;flex-wrap:wrap}
.pdp-trust span{padding:8px 12px;border-radius:999px;background:rgba(59,11,62,.05);font:400 12px/1 'Jost',sans-serif;color:#3B0B3E;letter-spacing:.04em}

.pdp-pin{display:flex;gap:10px;padding:10px 10px 10px 16px;border-radius:14px;background:#fff;border:1px solid rgba(59,11,62,.1);align-items:center}
.pdp-pin input{flex:1;min-width:0;border:0;outline:0;background:none;font:400 15px/1 'Jost',sans-serif;color:#3B0B3E}
.pdp-pincheck{height:34px;padding:0 18px;border-radius:999px;border:1px solid #3B0B3E;background:none;font:500 12px/1 'Jost',sans-serif;letter-spacing:.08em;color:#3B0B3E;cursor:pointer}
.pdp-pinmsg{font:400 14px/1.6 'Jost',sans-serif;color:#3B0B3E;margin-top:-6px}

/* accordions (native <details>) */
.pdp-acc{display:flex;flex-direction:column;margin-top:6px}
.pdp-acc details{border-top:1px solid rgba(59,11,62,.12);padding:16px 0}
.pdp-acc details:last-child{border-bottom:1px solid rgba(59,11,62,.12)}
.pdp-acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font:500 14px/1 'Jost',sans-serif;letter-spacing:.06em;color:#3B0B3E}
.pdp-acc summary::-webkit-details-marker{display:none}
.pdp-acc summary::after{content:"";width:8px;height:8px;border-right:1.6px solid #3B0B3E;border-bottom:1.6px solid #3B0B3E;transform:rotate(45deg);margin:-4px 4px 0 0;transition:transform .2s}
.pdp-acc details[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.pdp-acc p{margin:14px 0 0;font:400 14px/1.7 'Jost',sans-serif;color:rgba(59,11,62,.75)}
.pdp-acc dl{margin:14px 0 0;display:flex;flex-direction:column;gap:9px;font:400 14px/1.6 'Jost',sans-serif;color:rgba(59,11,62,.75)}
.pdp-acc dl div{display:flex;justify-content:space-between;gap:16px}
.pdp-acc dd{margin:0;color:#3B0B3E;text-align:right}
.pdp-acc dt{margin:0}

/* complete the look */
.pdp-rel{padding:8px 0 56px}
.pdp-rel h2{margin:0 0 20px;font:400 34px/1.15 'Marcellus',serif;color:#3B0B3E}
.pdp-relgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:900px){.pdp-relgrid{grid-template-columns:repeat(2,1fr);gap:8px}}
.pdp-relcard{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:inherit}
.pdp-relimg{border-radius:12px;overflow:hidden;background:#FDE4EF;aspect-ratio:1/1;transition:transform .35s ease}
@media (hover:hover){.pdp-relcard:hover .pdp-relimg{transform:translateY(-4px)}}
.pdp-relname{display:block;font:400 16px/1.3 'Marcellus',serif;color:#3B0B3E;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pdp-relname:hover{color:#B00A60}
.pdp-relimglink{display:block;border-radius:12px}
.pdp-zoom{display:block;width:100%;height:100%;cursor:zoom-in}
.pdp-relprice{font:500 15px/1 'Jost',sans-serif;color:#3B0B3E}

/* sticky add bar — stays under the header drawers (z-index 4 < header wrap 5) */
.pdp-sticky{position:fixed;left:0;right:0;bottom:0;z-index:4;background:#fff;border-top:1px solid rgba(59,11,62,.12);
  box-shadow:0 -8px 24px rgba(59,11,62,.12);padding:10px 20px calc(10px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:14px;animation:pdpUp .3s ease}
.pdp-sticky[hidden]{display:none}
.pdp-stickyinfo{flex:1;min-width:0}
.pdp-stickyname{font:400 15px/1.3 'Marcellus',serif;color:#3B0B3E;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pdp-stickyprice{font:500 15px/1 'Jost',sans-serif;color:#3B0B3E}
.pdp-stickyprice s{font:400 13px/1 'Jost',sans-serif;color:rgba(59,11,62,.4)}
.pdp-add2{flex:none;background:#3B0B3E;color:#FDF0F8;padding:0 22px}
@keyframes pdpUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* size-guide modal (outside .oye-root) */
.pdp-modal{position:fixed;inset:0;background:rgba(37,6,42,.55);z-index:60;display:flex;align-items:center;justify-content:center;padding:20px;animation:pdpFade .3s ease}
.pdp-modalbox{background:#fff;border-radius:18px;max-width:420px;width:100%;padding:26px 28px;box-shadow:0 30px 70px rgba(37,6,42,.4)}
.pdp-modalhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font:400 22px/1 'Marcellus',serif;color:#3B0B3E}
.pdp-modalclose{background:none;border:0;color:#3B0B3E;cursor:pointer;padding:6px}
.pdp-modalbox p{margin:0 0 14px;font:400 14px/1.7 'Jost',sans-serif;color:rgba(59,11,62,.75)}
.pdp-sgrow{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid rgba(59,11,62,.1);font:400 14px/1 'Jost',sans-serif;color:#3B0B3E}
@keyframes pdpFade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.pdp-stock i,.pdp-sticky,.pdp-modal{animation:none}}

/* mobile: icon-only add button in the sticky bar */
@media (max-width:640px){
  .pdp-cta{gap:8px}
  .pdp-title{font-size:28px}
  .pdp-price b{font-size:26px}
  .pdp-sticky{padding-left:16px;padding-right:16px}
  .pdp-add2{padding:0 18px}
}

/* --- data-driven additions (real images, out-of-stock state) --- */
.pdp-mainimg img{display:block;width:100%;height:100%;object-fit:cover}
.pdp-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.pdp-stock.is-out{background:rgba(59,11,62,.06);border-color:rgba(59,11,62,.2)}
.pdp-stock.is-out i{background:#8A7A8C;animation:none}
.pdp-add[disabled],.pdp-buy[disabled]{opacity:.45;cursor:not-allowed}
.pdp-rich p{margin:0 0 8px}
.pdp-relimg img{display:block;width:100%;height:100%;object-fit:cover}