/* ===========================================================
   Bliss Home Diffuser — shared dark theme for inner pages
   Reuses the Scent Atlas chrome/footer; restyles legacy
   (style.css) sections to match the new dark/gold look.
   =========================================================== */

body.atlas-page{
  background:var(--atlas-bg);
  color:var(--atlas-cream-dim);
  --black:#0a0a0a;
  --near-black:#141414;
  --cream-soft:#e6dccb;
  --gold:var(--atlas-gold-1);
  --gold-soft:var(--atlas-gold-2);
  --grey:rgba(245,233,216,.55);
  --line:rgba(245,233,216,.12);
}
body.atlas-page::after{ display:none; }

body.atlas-page h1,
body.atlas-page h2,
body.atlas-page h3,
body.atlas-page h4{ color:var(--atlas-cream); }

body.atlas-page .product-card{ background:var(--near-black); }
body.atlas-page .product-card .info h3{ color:var(--atlas-cream); }

body.atlas-page .field label{ color:rgba(245,233,216,.55); }
body.atlas-page .field input,
body.atlas-page .field textarea,
body.atlas-page .field select{
  background:#141414;
  color:var(--atlas-cream);
  border-color:rgba(245,233,216,.2);
}
body.atlas-page .qty-select option{ color:#000; }


/* fix paragraph text colors overridden by style.css */
body.atlas-page .text-block p{ color:var(--atlas-cream-dim); }
body.atlas-page .story .copy p{ color:var(--atlas-cream-dim); }
body.atlas-page .section-dark .story .copy p{ color:var(--atlas-cream-dim); }
/* room for the fixed, transparent atlas chrome above content */
body.atlas-page .page-header{ padding-top:160px; }

/* ---- Add to Cart button — always visible resting state ---- */
body.atlas-page #add-to-cart-btn{
  color:var(--atlas-gold-1);
  border-color:var(--atlas-gold-1);
  background:rgba(201,137,63,.08);
}
body.atlas-page #add-to-cart-btn:hover{
  background:var(--atlas-gold-2);
  border-color:var(--atlas-gold-2);
  color:#0a0a0a;
}

/* ================================================================
   Product image gallery
   ================================================================ */
.p-gallery{
  display:flex;
  flex-direction:column;
  gap:14px;
  flex:1;
  min-width:0;
}

/* --- Main image --- */
.p-gallery-main{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  border-radius:2px;
  cursor:zoom-in;
}
.p-gallery-main img{
  width:100%; height:100%;
  object-fit:cover;
  transition:opacity .2s ease;
  display:block;
}

/* Zoom hint */
.p-zoom-hint{
  position:absolute;
  bottom:14px; left:50%;
  transform:translateX(-50%);
  background:rgba(10,10,10,.65);
  color:rgba(245,233,216,.75);
  font-family:var(--atlas-sans,'Jost',sans-serif);
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  padding:6px 14px;
  border-radius:20px;
  pointer-events:none;
  white-space:nowrap;
  opacity:1;
  transition:opacity .3s ease;
}
.p-gallery-main:hover .p-zoom-hint{ opacity:0; }

/* Arrow navigation */
.p-arrow{
  position:absolute;
  top:50%; transform:translateY(-50%);
  width:40px; height:40px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(10,10,10,.55);
  border:1px solid rgba(201,137,63,.35);
  border-radius:50%;
  color:var(--atlas-gold-1,#e9c98f);
  cursor:pointer;
  z-index:4;
  transition:background .2s ease, border-color .2s ease;
  padding:0;
}
.p-arrow:hover{
  background:rgba(201,137,63,.25);
  border-color:var(--atlas-gold-1,#e9c98f);
}
.p-arrow svg{ width:16px; height:16px; pointer-events:none; }
.p-arrow-prev{ left:12px; }
.p-arrow-next{ right:12px; }
.p-arrow[disabled]{ opacity:.25; cursor:default; pointer-events:none; }

/* --- Thumbnail strip --- */
.p-gallery-thumbs{
  display:flex;
  gap:8px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding-bottom:4px;
}
.p-gallery-thumbs::-webkit-scrollbar{ display:none; }

.p-thumb{
  width:90px; height:90px;
  flex-shrink:0;
  border:2px solid rgba(245,233,216,.12);
  border-radius:2px;
  overflow:hidden;
  padding:0;
  background:transparent;
  cursor:pointer;
  transition:border-color .2s ease;
}
.p-thumb img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
}
.p-thumb:hover{ border-color:rgba(245,233,216,.45); }
.p-thumb.active{
  border-color:#c9a84c;
  box-shadow:0 0 0 1px #c9a84c;
}

/* ================================================================
   Lightbox
   ================================================================ */
.p-lightbox{
  position:fixed;
  inset:0;
  z-index:9000;
  background:rgba(5,5,5,.72);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
.p-lightbox.is-open{
  opacity:1;
  pointer-events:all;
}
.p-lightbox-img{
  max-width:min(58vw, 680px);
  max-height:72vh;
  object-fit:contain;
  display:block;
  border-radius:3px;
  box-shadow:0 24px 80px rgba(0,0,0,.7);
  user-select:none;
}
@media(max-width:768px){
  .p-lightbox-img{ max-width:88vw; max-height:65vh; }
}
.p-lightbox-close{
  position:absolute;
  top:20px; right:24px;
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(245,233,216,.2);
  border-radius:50%;
  color:var(--atlas-cream,#f5e9d8);
  cursor:pointer;
  font-size:22px;
  line-height:1;
  padding:0;
  transition:background .2s ease;
}
.p-lightbox-close:hover{ background:rgba(201,137,63,.25); }
.p-lightbox-arrow{
  position:absolute;
  top:50%; transform:translateY(-50%);
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(10,10,10,.6);
  border:1px solid rgba(201,137,63,.35);
  border-radius:50%;
  color:var(--atlas-gold-1,#e9c98f);
  cursor:pointer;
  padding:0;
  transition:background .2s ease, border-color .2s ease;
}
.p-lightbox-arrow:hover{
  background:rgba(201,137,63,.25);
  border-color:var(--atlas-gold-1,#e9c98f);
}
.p-lightbox-arrow svg{ width:20px; height:20px; pointer-events:none; }
.p-lightbox-prev{ left:20px; }
.p-lightbox-next{ right:20px; }
.p-lightbox-counter{
  position:absolute;
  bottom:20px; left:50%;
  transform:translateX(-50%);
  font-family:var(--atlas-sans,'Jost',sans-serif);
  font-size:11px;
  letter-spacing:.2em;
  color:rgba(245,233,216,.5);
}