/* ============================================================
   NAIA – Product Detail Page Styles
   ============================================================ */

:root { --cream: #F9F5F0; --sand: #E8DDD0; --taupe: #C4AA8F; --mink: #8B7355; --charcoal: #2C2C2C; --rose: #C8907A; }
* { margin: 0; padding: 0; box-sizing: border-box; }
html { overflow-x: hidden; }
body { font-family: 'Lato', sans-serif; background: var(--cream); color: var(--charcoal); overflow-x: hidden; }
h1, h2, h3, h4, h5, h6 { font-family: 'Playfair Display', serif; }
img, video, iframe { max-width: 100%; }

/* BREADCRUMB */
.bc { padding: .9rem 0; font-size: .75rem; letter-spacing: .08em; }
.bc a { color: var(--mink); text-decoration: none; }
.bc span { color: #bbb; margin: 0 .5rem; }

/* GALLERY */
.gal-main { aspect-ratio: 4/5; overflow: hidden; background: var(--sand); position: relative; cursor: zoom-in; }
.gal-main img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.gal-main:hover img { transform: scale(1.08); }
.gal-thumbs { display: flex; gap: .5rem; margin-top: .5rem; }
.gth { flex: 1; aspect-ratio: 1; overflow: hidden; background: var(--sand); cursor: pointer; border: 2px solid transparent; opacity: .6; transition: all .2s; }
.gth:hover, .gth.active { opacity: 1; border-color: var(--charcoal); }
.gth img { width: 100%; height: 100%; object-fit: cover; }
.gal-badge { position: absolute; top: .9rem; left: .9rem; background: var(--charcoal); color: #fff; font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; padding: .3rem .8rem; font-family: 'Lato', sans-serif; }

/* PRODUCT INFO */
.p-eye { font-size: .68rem; letter-spacing: .25em; text-transform: uppercase; color: var(--mink); }
.p-title { font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 400; line-height: 1.1; }
.p-price { font-family: 'Playfair Display', serif; font-size: 1.7rem; font-weight: 400; }
.p-old { text-decoration: line-through; color: #bbb; font-size: 1.1rem; margin-right: .5rem; }
.rev-mini { font-size: .78rem; color: var(--mink); }
.rev-mini .stars { letter-spacing: 2px; }

/* OPTIONS */
.opt-lbl { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; margin-bottom: .6rem; }
.cswatch { width: 34px; height: 34px; border-radius: 50%; border: 2.5px solid transparent; cursor: pointer; transition: all .2s; display: inline-flex; align-items: center; justify-content: center; margin: 0 6px 6px 0; }
.cswatch.active, .cswatch:hover { border-color: var(--charcoal); transform: scale(1.12); }
.sbtn { padding: .5rem 1.1rem; border: 1px solid var(--sand); background: transparent; font-size: .78rem; letter-spacing: .1em; cursor: pointer; transition: all .2s; font-family: 'Lato', sans-serif; color: var(--charcoal); margin: 0 .3rem .4rem 0; }
.sbtn:hover, .sbtn.active { background: var(--charcoal); color: #fff; border-color: var(--charcoal); }
.sbtn.na { opacity: .3; text-decoration: line-through; cursor: not-allowed; }

/* QTY */
.qty-box { display: flex; align-items: center; border: 1px solid var(--sand); }
.qty-box button { background: transparent; border: none; padding: .5rem .9rem; font-size: 1.1rem; cursor: pointer; color: var(--charcoal); transition: background .2s; }
.qty-box button:hover { background: var(--sand); }
.qty-box span { padding: 0 1rem; font-size: .9rem; min-width: 36px; text-align: center; }

/* ADD BUTTONS */
.btn-cart { background: var(--charcoal); color: #fff; padding: 1rem; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; border: none; width: 100%; cursor: pointer; font-family: 'Lato', sans-serif; transition: background .3s; }
.btn-cart:hover { background: var(--mink); }
.btn-buy { background: var(--rose); color: #fff; padding: 1rem; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; border: none; width: 100%; cursor: pointer; font-family: 'Lato', sans-serif; transition: background .3s; }
.btn-buy:hover { background: #a0624a; }
.btn-wish { background: transparent; border: 1px solid var(--sand); padding: 1rem 1.2rem; font-size: 1rem; cursor: pointer; color: var(--charcoal); transition: all .2s; }
.btn-wish:hover { border-color: var(--rose); color: var(--rose); }

/* TRUST */
.trust-item { text-align: center; padding: .9rem; }
.trust-item i { font-size: 1.2rem; color: var(--mink); display: block; margin-bottom: .35rem; }
.trust-item p { font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: #888; margin: 0; }

/* ACCORDION */
.acc-btn { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--charcoal); background: transparent; box-shadow: none; padding: 1rem 0; font-family: 'Lato', sans-serif; font-weight: 700; }
.accordion-item { border: none; border-top: 1px solid var(--sand); background: transparent; }
.acc-btn:not(.collapsed) { color: var(--mink); background: transparent; }
.acc-body { font-size: .85rem; line-height: 1.9; color: #5a4e42; padding: 0 0 1rem; }

/* REVIEWS */
.rcard { padding: 1.5rem; background: var(--sand); }
.rcard:nth-child(even) { background: transparent; border: 1px solid var(--sand); }
.rcard .stars { color: var(--rose); letter-spacing: 2px; }
.rcard blockquote { font-family: 'Playfair Display', serif; font-size: 1rem; font-style: italic; line-height: 1.7; margin: .6rem 0; }
.rcard .author { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--mink); }

/* RELATED */
.pc { cursor: pointer; }
.pc-img { position: relative; overflow: hidden; background: var(--sand); aspect-ratio: 3/4; }
.pc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.pc:hover .pc-img img { transform: scale(1.04); }
.pc-info h6 { font-family: 'Playfair Display', serif; font-size: 1rem; font-weight: 400; margin-top: .5rem; margin-bottom: .2rem; }
.pc-price { font-size: .85rem; color: var(--mink); font-weight: 700; }

/* PAGINATION */
.pagination-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
  padding: 2.5rem 0 1rem;
}
.pg-btn {
  min-width: 42px;
  height: 42px;
  padding: 0 .9rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--sand);
  background: #fff;
  color: var(--charcoal);
  text-decoration: none;
  font-family: 'Lato', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}
.pg-btn:hover,
.pg-btn.active {
  background: var(--charcoal);
  color: #fff;
  border-color: var(--charcoal);
  transform: translateY(-1px);
}
.pg-btn.dots {
  min-width: 28px;
  border-color: transparent;
  background: transparent;
  pointer-events: none;
  box-shadow: none;
}

/* FOOTER MINI */
.foot-mini { background: #1a1a1a; color: rgba(249,245,240,.45); padding: 1.5rem; text-align: center; font-size: .78rem; margin-top: 4rem; }
.foot-mini .fb { font-family: 'Playfair Display', serif; font-size: 1.4rem; color: #F9F5F0; letter-spacing: .12em; }

@media (max-width: 768px) {
  .gth { flex: none; width: 70px; height: 70px; }
  .p-title { font-size: 1.6rem; }
}
