/**
 * Product detail page (v2)
 *
 * Structure:
 *   1. Reset & base (scoped to .pdp-v2-content, lightbox, mob CTA)
 *   2. Design tokens (:root)
 *   3. Page shell (frame, hero)
 *   4. Main layout (grid / columns)
 *   5. Gallery (desktop row, mobile carousel, cells, fallback, lightbox targets)
 *   6. Description & read-more toggle
 *   7. Highlights
 *   8. Included / not included (pd-*)
 *   9. Itinerary
 *  10. Scoped: body.pdp-v2 (widget column, lightbox, voucher, mobile CTA)
 */

/* --- 1. Reset & base (scoped: v2 layout shell, lightbox, mobile CTA — not menu/footer/testimonials/how-it-works) --- */
html:has(body.pdp-v2) { scroll-behavior: smooth; }

body.pdp-v2 .pdp-v2-content {
  font-family: var(--font-body);
  background: #ffffff;
  color: var(--wf-800);
  -webkit-font-smoothing: antialiased;
}

body.pdp-v2 :is(.pdp-v2-content, .gallery-lightbox, .pdp-v2-mob-cta-bar) a {
  text-decoration: none;
  color: inherit;
}

body.pdp-v2 :is(.pdp-v2-content, .gallery-lightbox, .pdp-v2-mob-cta-bar) img {
  display: block;
  max-width: 100%;
}

/* --- 2. Design tokens --- */
:root {
  --border-radius-pill: 624.9375rem;
  --radius-border-radius-xs-8: 0.5rem;
  --border-color-success: #C3E8C0;
  --fill-color-success: #E6F6E5;
  --text-color-success: #006400;
  --fill-color-neutral-softest: #E8E8E8;
  --border-color-neutral-softer: #D2D2D2;
  --fill-color-neutral: #FFFFFF;
  --text-color-accent-base: #9609E2;
  --text-color-neutral-stronger: #464646;
  --text-color-neutral-strongest: #333333;
  --fill-color-primary-base: #0092FF;
  --wf-800: #393939;
  --wf-900: #1C1C1C;
  --blue-h: #0071C3;
  --blue-p: #005899;
  --font-body: 'Work Sans', sans-serif;
  --font-ui: 'Work Sans', sans-serif;
}

/* --- 3. Page shell — frame & hero --- */
.page-frame {
  width: 100%;
  background: var(--fill-color-neutral);
  overflow: clip; /* clip = sem scroll container, sticky funciona */
}

/* Hero band */
.wf-hero {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 50px 104px 60px;
}
@media (max-width: 1100px) { .wf-hero { padding: 36px 40px 48px; } }
@media (max-width: 800px)  { .wf-hero { padding: 16px; } }

/* Hero header */
.hero-header { display: flex; flex-direction: column; gap: 16px; }

.hero-title {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 48px);
  line-height: 1.286em;
  color: var(--wf-900);
  margin: 0;
}

.hero-meta-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.hero-info {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.hero-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--text-color-neutral-stronger);
  flex-shrink: 0;
}

.hero-info-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 15px;
  color: var(--text-color-neutral-stronger);
}

.hero-badge-most-sold {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.5rem;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 0.75rem;
  line-height: 1.25rem;
  color: var(--text-color-success);
  background: var(--fill-color-success);
  border: 1px solid var(--border-color-success);
  border-radius: var(--border-radius-pill);
  white-space: nowrap;
  flex-shrink: 0;
}

.hero-rating {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.25rem;
  color: var(--text-color-neutral-stronger);
  flex-shrink: 0;
}

.hero-rating__icon {
  flex-shrink: 0;
  display: block;
  width: 1.25rem;
  height: 1.25rem;
}

.hero-key-info {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.hero-info-item__icon {
  flex-shrink: 0;
  color: inherit;
}

@media (max-width: 800px) {
  .hero-header { gap: 1rem; }
  .hero-meta-row { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
  .hero-info { flex-direction: column; align-items: flex-start; gap: 6px; }
  .hero-dot { display: none; }
  .hero-key-info-dot { display: none; }
  .hero-info-item { font-size: 16px; font-weight: 500; color: #555555; gap: 0.5rem; }
  .hero-key-info { flex-direction: column; align-items: flex-start; }
}

/* --- 4. Main layout ---
   Desktop: grid — left column rows 1–2, sidebar column 2 (see body.pdp-v2 .product-v2_sticky-aside).
   Mobile: flex column — top → aside (order 2) → bottom. */
.main-content {
  display: grid;
  grid-template-columns: 1fr 420px;
  grid-template-rows: auto auto;
  gap: 32px;
  align-items: start;
}

.main-col--top { grid-column: 1; grid-row: 1; }
.main-col--bottom { grid-column: 1; grid-row: 2; }

@media (max-width: 1000px) {
  .main-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .main-col--top { order: 1; }
  .main-col--bottom { order: 3; width: 100%; }
}

.main-col {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  min-width: 0;
}

@media (max-width: 768px) {
  .main-col { gap: 1.5rem; }
}

.main-col .main-col-group {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* --- 5. Gallery — desktop row, mobile carousel, cells, fallback --- */
.image-gallery { display: flex; flex-direction: column; gap: 14px; }

.image-row {
  display: flex;
  align-items: stretch;
  gap: 0.25rem;
  height: 404px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,.10);
}
@media (max-width: 760px) {
  .image-row:not(.image-row--placeholder) { height: 260px; }
}

/* Desktop: show gallery inside left column, hide mobile slot */
.gallery-mob  { display: none; }
.gallery-desk { display: contents; }

/* Mobile carousel (Swiper) */
.gallery-mob {
  position: relative;
  width: 100%;
  height: 12.5rem;
  overflow: hidden;
  user-select: none;
  flex-shrink: 0;
}
@media (min-width: 768px) {
  .gallery-mob {
    height: 21.875rem;
  }
}

.mob-gallery-swiper {
  width: 100%;
  height: 100%;
}

.mob-gallery-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

.pdp-v2-image-fallback {
  width: 100%;
  min-height: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: var(--fill-color-neutral-softest, #E8E8E8);
  color: var(--wf-800);
  border-radius: 0;
  border: none;
  box-shadow: none;
}

.gallery-mob--placeholder .pdp-v2-image-fallback {
  border: none;
  box-shadow: none;
  width: 100%;
  height: 100%;
}

.pdp-v2-image-fallback__icon {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  color: var(--wf-800);
  object-fit: contain;
}

@media (min-width: 641px) {
  .pdp-v2-image-fallback__icon { width: 3rem; height: 3rem; }
}

.pdp-v2-image-fallback__title {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 0.9375rem;
  line-height: 1.3;
  color: var(--wf-900);
  max-width: 20rem;
}

@media (min-width: 641px) {
  .pdp-v2-image-fallback__title { font-size: 1rem; }
}

.pdp-v2-image-fallback__desc {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--wf-800);
  max-width: 18rem;
}

@media (min-width: 641px) {
  .pdp-v2-image-fallback__desc { font-size: 0.875rem; max-width: 22rem; }
}

.image-row--placeholder {
  display: flex;
  align-items: stretch;
  justify-content: center;
  width: 100%;
  min-width: 0;
  height: 21.8125rem;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid var(--border-color-neutral-softer);
}

.image-row--placeholder .pdp-v2-image-fallback {
  width: 100%;
  height: 100%;
  border-radius: 0;
  gap: 0.625rem;
  padding: 1rem 1.25rem;
}

@media (min-width: 1001px) {
  .image-row--placeholder { height: 25.25rem; }
}

.mob-gallery-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 63px;
  background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(102,102,102,0) 83%);
  pointer-events: none;
}

.mob-gallery-dots {
  position: absolute !important;
  bottom: 16px !important;
  left: 50% !important;
  transform: translateX(-50%);
  display: flex !important;
  align-items: center;
  gap: 3px;
  z-index: 2;
  width: auto !important;
}

.mob-gallery-dot {
  display: block;
  height: 6px;
  width: 6px;
  border-radius: 99px;
  background: rgba(255,255,255,.5);
  transition: width .2s, background .2s;
  flex-shrink: 0;
  cursor: pointer;
  opacity: 1 !important;
}

.mob-gallery-dot--active {
  width: 24px;
  background: #fff;
}

/* Counter badge — bottom-right */
.mob-gallery-counter {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: rgba(0,0,0,0.7);
  color: #E8E8E8;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.43;
  padding: 4px 10px;
  border-radius: 50px;
  z-index: 2;
  pointer-events: none;
}

/* Phone + tablet: carousel gallery; wider viewports: grid in column */
@media (max-width: 1024px) {
  .gallery-mob  { display: block; }
  .gallery-desk { display: none; }
  .gallery-mob--placeholder {
    display: flex;
    align-items: stretch;
    justify-content: center;
    width: 100%;
    height: 12.5rem;
    user-select: none;
  }
}

.pdp-v2-gallery__cell {
  position: relative;
  overflow: hidden;
  min-width: 0;
  min-height: 0;
}
.pdp-v2-gallery__cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.pdp-v2-gallery__cell:hover img { transform: scale(1.03); }

.image-row--layout-1 > .pdp-v2-gallery__cell--full {
  flex: 1 1 100%;
  width: 100%;
}

.image-row--layout-2 > .pdp-v2-gallery__cell--half {
  flex: 1 1 0;
}

.image-row--layout-3 > .pdp-v2-gallery__cell--feature {
  flex: 2 1 0;
}
.image-row--layout-3 > .pdp-v2-gallery__stack {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
  min-height: 0;
}
.image-row--layout-3 .pdp-v2-gallery__stack > .pdp-v2-gallery__cell {
  flex: 1 1 0;
}

.image-row--layout-4 > .pdp-v2-gallery__cell--half:first-child {
  flex: 1 1 0;
}
.image-row--layout-4 > .pdp-v2-gallery__col--split-top-2bottom {
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.image-row--layout-4 .pdp-v2-gallery__col--split-top-2bottom > .pdp-v2-gallery__cell:first-child {
  flex: 1 1 0;
}
.image-row--layout-4 .pdp-v2-gallery__row-split {
  flex: 1 1 0;
  display: flex;
  flex-direction: row;
  gap: 0.25rem;
  min-height: 0;
}
.image-row--layout-4 .pdp-v2-gallery__row-split > .pdp-v2-gallery__cell {
  flex: 1 1 0;
}

.image-row--layout-5 > .pdp-v2-gallery__cell--half:first-child {
  flex: 1 1 0;
}
.image-row--layout-5 > .pdp-v2-gallery__grid-2x2 {
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 0.25rem;
}
.image-row--layout-5 .pdp-v2-gallery__grid-2x2 > .pdp-v2-gallery__cell {
  min-width: 0;
  min-height: 0;
}

.more-photos-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.65);
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 18px;
  color: var(--fill-color-neutral);
  cursor: pointer;
  transition: background .2s;
  letter-spacing: -.01em;
}
.more-photos-overlay:hover { background: rgba(0,0,0,.80); }


/* --- 6. Description & read-more toggle --- */
.description-section { display: flex; flex-direction: column; gap: 10px; }

.description-text {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  color: var(--wf-800);
}

.learn-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  align-self: flex-end;
  padding: 6px 0;
  font-weight: 600;
  font-size: 14px;
  color: var(--fill-color-primary-base);
  background: none;
  border: none;
  cursor: pointer;
  transition: color .15s;
}
.learn-more-btn:hover { color: var(--blue-h); }
.learn-more-btn[hidden] {
  display: none;
}

/* --- 7. Highlights --- */
.pdp-v2-highlights {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}
@media (min-width: 768px) {
  .pdp-v2-highlights { gap: 16px; }
}

.pdp-v2-highlights__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  width: 100%;
}
@media (min-width: 768px) {
  .pdp-v2-highlights__grid {
    grid-template-columns: repeat(var(--pdp-highlight-cols, 3), minmax(0, 1fr));
    gap: 16px;
  }
}

.pdp-v2-highlights__card {
  background: var(--fill-color-neutral);
  border: 1px solid var(--border-color-neutral-softer);
  border-radius: 1rem;
  padding: 1rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  min-width: 0;
}
@media (min-width: 768px) {
  .pdp-v2-highlights__card {
    padding: 1.5rem;
  }
}

.pdp-v2-highlights__card-title {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--text-color-accent-base);
  margin: 0;
}

.pdp-v2-highlights__card-desc {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--wf-800);
  margin: 0;
}

/* --- 8. Included / not included --- */
.pd-container { display: flex; flex-direction: column; }

.pd-card-single {
  background: #FFFFFF;
  border: 1px solid var(--border-color-neutral-softer);
  border-radius: 1rem;
  padding: 1rem;
}
@media (min-width: 768px) {
  .pd-card-single { padding: 1.5rem; }
}

.pd-two-col {
  display: flex;
  flex-direction: row;
  width: 100%;
}

.pd-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  padding-right: 16px;
}

.pd-col--right {
  padding-right: 0;
  padding-left: 16px;
  border-left: 1px solid var(--border-color-neutral-softer);
}

.pd-col-title {
  font-family: var(--font-ui);
  font-size: 20px;
  font-weight: 500;
  color: #393939;
  line-height: 1.4em;
}

.pd-col-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0;
}

.pd-col-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 400;
  color: #393939;
  line-height: 1.5;
}

@media (max-width: 680px) {
  .pd-two-col { flex-direction: column; gap: 24px; }
  .pd-col { padding-right: 0; }
  .pd-col--right { padding-left: 0; border-left: none; padding-top: 0; }
}

/* --- 9. Itinerary --- */
.itinerary-section {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  background: #F4F4F4;
  border-radius: 1rem;
  padding: 1.5rem;
}

.itinerary-title {
  font-family: var(--font-body);
  font-size: 32px;
  font-weight: 600;
  color: #1C1C1C;
  line-height: 1.25em;
  margin: 0;
}

.itinerary-steps {
  display: flex;
  flex-direction: column;
}

.itinerary-step {
  display: flex;
  flex-direction: row;
  gap: 16px;
}

.itinerary-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 24px;
  flex-shrink: 0;
}

.itinerary-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.itinerary-connector {
  width: 1px;
  background: #BBBBBB;
  flex: 1;
  min-height: 16px;
  margin: 4px 0;
}

.itinerary-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-bottom: 16px;
  flex: 1;
}

.itinerary-step:last-child .itinerary-content { padding-bottom: 0; }

.itinerary-time-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.itinerary-timestamp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #E8E8E8;
  border-radius: 8px;
  font-family: var(--font-ui);
  font-size: 20px;
  font-weight: 500;
  color: #393939;
  line-height: 1.4em;
  align-self: flex-start;
}

.itinerary-step-title {
  font-family: var(--font-ui);
  font-size: 20px;
  font-weight: 500;
  color: #393939;
  line-height: 1.4em;
}

.itinerary-step-desc {
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 400;
  color: #393939;
  line-height: 1.5em;
}

@media (max-width: 768px) {
  .itinerary-section { padding: 1rem; }
  .itinerary-title { font-size: 1.5rem; }
  .itinerary-timestamp { font-size: 18px; }
  .itinerary-step-title { font-size: 18px; }
}

/* --- 10. Scoped: body.pdp-v2 (widget mount, lightbox, voucher, mobile CTA) --- */
body.pdp-v2 .page-frame {
  --pdp-v2-font: 'Work Sans', var(--font-body, sans-serif);
  font-family: var(--pdp-v2-font);
}

/* Widget mount */
body.pdp-v2 #product-adder-root {
  grid-column: unset !important;
  grid-row: unset !important;
  position: static !important;
  top: auto !important;
  align-self: auto !important;
  min-height: 220px;
  width: 100%;
  border-radius: 1rem;
  background: white;
  box-sizing: border-box;
  scroll-margin-top: 1rem;
}

body.pdp-v2 .product-v2_sticky-aside {
  grid-column: 2;
  grid-row: 1 / 3;
  position: sticky;
  top: 1.5rem;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  min-width: 0;
  scroll-margin-top: 1rem;
}

body.pdp-v2 .product-v2_price-box {
  background: #FFFFFF;
  border: 1px solid var(--border-color-neutral-softer);
  border-radius: 16px;
  padding: 20px 20px 16px;
}

body.pdp-v2 .product-v2_viewing-line {
  margin-top: 16px;
  font-size: 14px;
  color: var(--wf-800, #393939);
}

@media (max-width: 1000px) {
  body.pdp-v2 .product-v2_sticky-aside {
    order: 2;
    position: static;
    width: 100%;
    max-height: none;
  }
}

/* Lightbox */
body.pdp-v2 .gallery-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,0.92);
  flex-direction: column;
}
body.pdp-v2 .gallery-lightbox.open { display: flex; }

body.pdp-v2 .lightbox-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  flex-shrink: 0;
}
body.pdp-v2 .lightbox-product-name {
  color: #fff;
  font-family: var(--font-body, 'Work Sans', sans-serif);
  font-size: 14px;
  font-weight: 600;
  max-width: 60%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.pdp-v2 .lightbox-close {
  font-size: 24px;
  line-height: 1;
  color: rgba(255,255,255,.7);
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px 8px;
  transition: color .15s;
}
body.pdp-v2 .lightbox-close:hover { color: #fff; }

body.pdp-v2 .lightbox-body {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
  min-height: 0;
  overflow: hidden;
}
@media (max-width: 1024px) {
  body.pdp-v2 .lightbox-body {
    padding: 0;
  }
}
body.pdp-v2 .lightbox-nav {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,0.12);
  color: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  transition: background .15s;
}
@media (max-width: 1024px) {
  body.pdp-v2 .lightbox-nav {
    display: none;
  }
}
body.pdp-v2 .lightbox-nav:hover { background: rgba(255,255,255,0.22); }
body.pdp-v2 .lightbox-nav:disabled { opacity: .3; cursor: default; }

body.pdp-v2 .lightbox-swiper {
  flex: 1;
  max-width: 760px;
  margin: 0 auto;
  position: relative;
}
@media (max-width: 1024px) {
  body.pdp-v2 .lightbox-swiper {
    height: 100%;
  }
}
body.pdp-v2 .lightbox-swiper .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
body.pdp-v2 .lightbox-slide-media {
  position: relative;
  display: inline-block;
  max-width: 100%;
  line-height: 0;
}
body.pdp-v2 .lightbox-slide-media img {
  max-width: 100%;
  max-height: 58vh;
  object-fit: contain;
  border-radius: 8px;
  display: block;
}
@media (max-width: 1024px) {
  body.pdp-v2 .lightbox-slide-media img {
    border-radius: unset;
  }
}
body.pdp-v2 .lightbox-img-counter {
  z-index: 10;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  padding: 4px 10px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 5px;
  pointer-events: none;
}

body.pdp-v2 .lightbox-img-counter--desktop {
  position: absolute;
  bottom: 8px;
  left: 8px;
}
@media (max-width: 1024px) {
  body.pdp-v2 .lightbox-img-counter--desktop {
    display: none !important;
  }
}

body.pdp-v2 .lightbox-img-counter--mobile {
  display: none;
  position: static;
  align-self: flex-start;
  margin: 6px 16px 10px;
  flex-shrink: 0;
}
@media (max-width: 1024px) {
  body.pdp-v2 .lightbox-img-counter--mobile {
    display: flex;
  }
}
@media (min-width: 1025px) {
  body.pdp-v2 .lightbox-img-counter--mobile {
    display: none !important;
  }
}

body.pdp-v2 .lightbox-footer {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 14px 24px 20px;
}
body.pdp-v2 .lightbox-add-cart {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 11px 28px;
  background: #0092FF;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-family: var(--font-body, 'Work Sans', sans-serif);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s;
}
body.pdp-v2 .lightbox-add-cart:hover { background: #0071C3; }
@media (max-width: 1024px) {
  body.pdp-v2 .lightbox-add-cart {
    width: 100%;
  }
}
body.pdp-v2 .lightbox-caption {
  color: rgba(255,255,255,0.55);
  font-size: 13px;
  min-height: 18px;
}
body.pdp-v2 .lightbox-thumbs {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}
body.pdp-v2 .lightbox-thumbs .swiper-slide {
  width: 48px !important;
  height: 48px !important;
  border-radius: 25%;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  opacity: 0.55;
  transition: opacity .15s, border-color .15s;
}
body.pdp-v2 .lightbox-thumbs .swiper-slide-thumb-active {
  border-color: #0092FF;
  opacity: 1;
}
body.pdp-v2 .lightbox-thumbs .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.pdp-v2 .pdp-v2-gallery__cell { cursor: zoom-in; }

body.pdp-v2 #desc-text,
body.pdp-v2 #voucher-text {
  overflow: hidden;
  transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
body.pdp-v2 #desc-text.truncated,
body.pdp-v2 #voucher-text.truncated { max-height: 7.5rem; }
body.pdp-v2 #desc-text p { margin: 0; }
body.pdp-v2 #desc-text p + p,
body.pdp-v2 #voucher-text p + p { margin-top: 0.5rem; }

/* Voucher guidelines — card (Figma: título + texto + Ver mais, mesma regra da descrição) */
body.pdp-v2 .pdp-v2-voucher-card {
  background: var(--fill-color-neutral);
  border: 1px solid var(--border-color-neutral-softer);
  border-radius: 1.5rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (min-width: 768px) {
  body.pdp-v2 .pdp-v2-voucher-card {
    padding: 1.5rem;
  }
}

body.pdp-v2 .pdp-v2-voucher-card__title {
  font-family: var(--font-body);
  font-size: 2rem;
  font-weight: 600;
  line-height: 2.5rem;
  color: var(--text-color-neutral-strongest);
  margin: 0;
}

body.pdp-v2 .pdp-v2-voucher-card__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  color: var(--text-color-neutral-stronger);
}

body.pdp-v2 .pdp-v2-voucher-card__body .learn-more-btn {
  margin-left: auto;
}

body.pdp-v2 .pdp-v2-voucher-card__body .description-text a {
  color: var(--fill-color-primary-base);
}
body.pdp-v2 .pdp-v2-voucher-card__body .description-text a:hover {
  color: var(--blue-h, #0071C3);
}

@media (max-width: 768px) {
  body.pdp-v2 .pdp-v2-voucher-card__title {
    font-size: 18px;
  }
}

body.pdp-v2 .pdp-v2-mob-cta-bar {
  display: none;
}

@media (max-width: 800px) {
  body.pdp-v2--mob-cta {
    padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
    transition: padding-bottom 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  }

  body.pdp-v2--mob-cta.pdp-v2--mob-cta-bar-suppressed {
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  body.pdp-v2 .pdp-v2-mob-cta-bar {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: #fff;
    border-top: 1px solid var(--border-color-neutral-softer);
    box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.08);
    border-radius: 20px 20px 0 0;
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
    transition:
      opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1),
      transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
      visibility 0s linear 0s;
  }

  body.pdp-v2--mob-cta-bar-suppressed #pdp-v2-mob-cta-bar {
    opacity: 0;
    transform: translateY(100%);
    pointer-events: none;
    visibility: hidden;
    transition:
      opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1),
      transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
      visibility 0s linear 0.35s;
  }

  body.pdp-v2 .pdp-v2-mob-cta-bar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px 14px;
    max-width: 100%;
  }

  body.pdp-v2 .pdp-v2-mob-cta-bar__price {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
  }

  body.pdp-v2 .pdp-v2-mob-cta-bar__amount {
    font-family: var(--font-body);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--wf-900, #1C1C1C);
  }

  body.pdp-v2 .pdp-v2-mob-cta-bar__btn {
    flex: 0 0 auto;
    max-width: 55%;
    padding: 12px 16px;
    border-radius: var(--radius-border-radius-xs-8);
    background: var(--fill-color-primary-base);
    color: #fff;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    transition: background 0.15s ease;
    box-shadow: none;
  }

  body.pdp-v2 .pdp-v2-mob-cta-bar__btn:hover {
    background: var(--blue-h);
  }

  body.pdp-v2 .pdp-v2-mob-cta-bar__btn:active {
    background: var(--blue-p);
  }
}

