/* Shop surfaces share the homepage's persisted theme. Media stays unfiltered. */
body.products-page, body.product-detail-page {
  --shop-bg: #070707;
  --shop-panel: #101010;
  --shop-ink: #f3efe7;
  --shop-muted: #a8a49e;
  --shop-line: #393735;
  color: var(--shop-ink);
  background: var(--shop-bg);
}
html[data-theme="light"] body.products-page,
html[data-theme="light"] body.product-detail-page {
  --shop-bg: #f3efe7;
  --shop-panel: #e9e3d9;
  --shop-ink: #201e1b;
  --shop-muted: #625c54;
  --shop-line: #c6bfb5;
  --burnt: #a73d12;
  --amber: #925800;
}
.products-page .products-shell { isolation: isolate; }
.retail-campaign.campaign-film {
  position: sticky;
  top: var(--store-header-height, 103px);
  z-index: 0;
  margin-bottom: 0;
}
.campaign-scroll-shade {
  position: absolute; inset: 0; z-index: 2;
  background: #000; opacity: var(--campaign-dim, 0);
  pointer-events: none;
}
.shop-content-panel {
  position: relative; z-index: 5;
  margin: 0 calc(-1 * var(--pad));
  padding: 30px var(--pad) 0;
  background: var(--shop-bg);
  min-height: 100vh;
  box-shadow: 0 -12px 35px rgba(0,0,0,.12);
}
.products-page .collection-toolbar { top: var(--store-header-height, 103px); }
.products-page .collection-filters { top: calc(var(--store-header-height, 103px) + 44px); }
.products-page .collection-toolbar, .products-page .collection-filters { background: var(--shop-bg); }
:is(.products-page, .product-detail-page) .store-header,
:is(.products-page, .product-detail-page) .store-search,
:is(.products-page, .product-detail-page) .cart-drawer,
:is(.products-page, .product-detail-page) .product-drawer,
:is(.products-page, .product-detail-page) .pdp-panel {
  background: var(--shop-bg); color: var(--shop-ink); border-color: var(--shop-line);
}
:is(.products-page, .product-detail-page) :is(.store-brand, .store-links a, .store-links a.is-active, .store-tools button, .store-tools a, .store-tools i, .store-language, .store-language select, .collection-toolbar select, .pdp-size, .pdp-design, .pdp-accordions summary, .filter-pill, .product-card-copy h3) { color: var(--shop-ink); }
:is(.products-page, .product-detail-page) :is(.store-announcement, .collection-toolbar p, .collection-toolbar label, .product-card-copy p, .product-card-footer, .pdp-breadcrumb, .pdp-title-row p, .pdp-description, .pdp-rating a, .pdp-option span, .pdp-option b, .pdp-delivery-note, .pdp-accordions details p, .pdp-story article p, .cart-item p, .cart-empty, .cart-summary label span, .journey-card p, .fit-confidence) { color: var(--shop-muted); }
:is(.products-page, .product-detail-page) :is(.store-announcement, .filter-pill, .pdp-size, .pdp-design, .pdp-description, .pdp-accordions, .pdp-accordions details, .pdp-story, .pdp-story > div, .pdp-story article, .journey-card, .cart-item, .cart-total) { border-color: var(--shop-line); }
:is(.products-page, .product-detail-page) :is(select, input) { color: var(--shop-ink); background-color: var(--shop-panel); border-color: var(--shop-line); }
:is(.products-page, .product-detail-page) :is(select option, .journey-card, .pdp-story) { color: var(--shop-ink); background: var(--shop-panel); }
.product-detail-page .pdp-story > h2 em { -webkit-text-stroke-color: var(--shop-ink); }
.product-detail-page .pdp-gallery { background: var(--shop-panel); }
.product-detail-page .pdp-swatch { box-shadow: inset 0 0 0 3px var(--shop-bg); border-color: var(--shop-line); }
.product-detail-page .pdp-swatch.is-active, .product-detail-page .pdp-size.is-active, .product-detail-page .pdp-design[aria-pressed="true"] { border-color: var(--burnt); }
body.products-page .filter-pill.is-active { background: var(--shop-ink); color: var(--shop-bg); border-color: var(--shop-ink); }
html[data-theme="light"] .products-page .filter-pill:not(.is-active) { background: transparent; }
.store-tools [data-store-theme] { min-height: 40px; min-width: 32px; }
.store-tools [data-store-theme]:focus-visible { outline: 2px solid var(--burnt); outline-offset: 3px; }
@media (max-width: 760px) {
  .store-tools { width: 104px; grid-template-columns: repeat(3, 30px); gap: 7px; }
  .store-nav { gap: 12px; }
  .shop-content-panel { padding-top: 18px; }
}

/* Reuse the homepage pill and orbital theme toggle; keep film actions vertical. */
.campaign-film .campaign-film-controls {
  display: flex; flex-direction: column; gap: 8px;
  right: 20px; bottom: 20px;
}
.campaign-film .campaign-film-controls .theme-toggle {
  position: relative; inset: auto; z-index: auto;
  width: 98px; height: 38px; padding: 0 5px 0 12px;
  display: flex; align-items: center; justify-content: space-between;
  border: 1px solid rgba(243,239,231,.22); border-radius: 999px;
  color: #f3efe7; background: rgba(10,10,10,.72);
  backdrop-filter: blur(16px);
}
.campaign-pill-icon {
  display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px;
  border: 1px solid rgba(243,239,231,.22); border-radius: 50%;
  color: #ffb000; font-size: 13px;
}
html[data-theme="light"] .campaign-film .campaign-film-controls .theme-toggle {
  color: #17130f; background: rgba(243,239,231,.88); border-color: rgba(232,90,12,.36);
}
html[data-theme="light"] .campaign-pill-icon { color: #9b4e0b; border-color: rgba(23,19,15,.18); }
@media (max-width: 760px) {
  .campaign-film .campaign-film-controls { right: 10px; bottom: 8px; gap: 5px; }
  .campaign-film .campaign-film-controls .theme-toggle { width: 88px; height: 36px; padding-left: 10px; }
}

/* One layout owns every hero control: no independent floating overlap. */
.campaign-film .campaign-film-controls { top: 18px; bottom: auto; right: 20px; align-items: flex-end; gap: 8px; }
.campaign-film .campaign-film-controls .theme-toggle:not([data-store-theme]) { width: 34px; height: 34px; padding: 0; justify-content: center; animation: none; box-shadow: 0 2px 9px rgba(0,0,0,.2); }
.campaign-film-controls .theme-toggle:not([data-store-theme]) .theme-toggle-copy { display: none; }
.campaign-film-controls .campaign-pill-icon { border: 0; width: 28px; height: 28px; font-size: 15px; }
@media(max-width:760px) {
 .campaign-film .campaign-film-controls { top: 6px; bottom: auto; right: 8px; gap: 4px; }
 .campaign-film .campaign-film-controls .theme-toggle:not([data-store-theme]) { width: 30px; height: 30px; padding: 0; }
 .campaign-film .campaign-film-controls [data-store-theme] { height: 36px; }
}

/* Keep the mood switch at the bottom, independently of the upper film controls. */
:is(.products-page, .product-detail-page) > [data-store-theme] { position: fixed; top: auto; right: 20px; bottom: max(82px, calc(env(safe-area-inset-bottom) + 64px)); z-index: 999; }
@media(max-width:760px) { :is(.products-page, .product-detail-page) > [data-store-theme] { right: 12px; bottom: max(72px, calc(env(safe-area-inset-bottom) + 58px)); } }

/* Show the actual back or alternate angle on hover, without zooming details. */
.products-page .product-card-media .product-card-alternate {
  opacity: 0; pointer-events: none; object-position: center;
  transform: none; transition: opacity 220ms ease;
}
.products-page .product-card:focus-visible .product-card-alternate,
.products-page .product-card:focus-within .product-card-alternate { opacity: 1; }
@media (hover:hover) and (pointer:fine) {
  .products-page .product-card:hover .product-card-alternate { opacity: 1; }
}
@media (prefers-reduced-motion:reduce) {
  .products-page .product-card-media .product-card-alternate { transition: none; }
}

/* Let the campaign film sit beneath the shop navigation, as on the main page. */
.products-page .store-header {
  margin-bottom: calc(-1 * var(--store-header-height, 103px));
  color: #f3efe7;
  background: rgba(8, 8, 8, .62);
  border-color: rgba(243, 239, 231, .19);
  -webkit-backdrop-filter: blur(16px) saturate(1.08);
  backdrop-filter: blur(16px) saturate(1.08);
}
.products-page .store-header :is(.store-brand, .store-links a, .store-links a.is-active, .store-tools button, .store-tools a, .store-tools i, .store-language, .store-language select) { color: #f3efe7; }
.products-page .store-header .store-announcement { color: rgba(243, 239, 231, .72); border-color: rgba(243, 239, 231, .19); }
.products-page .store-header .store-announcement span:first-child { color: #ffb000; }
.products-page .store-header .store-language select { background-color: transparent; }
html[data-theme="light"] .products-page .store-header .store-brand img { filter: none; }
.products-page .retail-campaign.campaign-film { top: 0; }
.products-page .campaign-film .campaign-film-controls { top: calc(var(--store-header-height, 103px) + 18px); }
@media (max-width: 760px) {
  .products-page .campaign-film .campaign-film-controls { top: calc(var(--store-header-height, 86px) + 6px); }
}

/* Keep the entire film below the translucent navigation and centered in its frame. */
.products-page .retail-campaign.campaign-film {
  display: block;
  box-sizing: border-box;
  height: min(100svh, 940px);
  min-height: 560px;
  padding: var(--store-header-height, 103px) 0 0;
  aspect-ratio: auto;
  overflow: hidden;
  background: #201b1a;
}
.products-page .campaign-film-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(22px) brightness(.78) saturate(1.12);
  transform: scale(1.08);
  pointer-events: none;
}
.products-page .campaign-film-video {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
}
.products-page .campaign-scroll-shade { z-index: 2; }
/* Leave room for the fixed mood control when the footer reaches the viewport edge. */
:is(.products-page, .product-detail-page) .world-footer { padding-bottom: max(164px, calc(env(safe-area-inset-bottom) + 152px)); }
.products-page .journey-card summary { color: var(--shop-ink); }
.product-detail-page .pdp-gallery { display: block; }
.product-detail-page .pdp-image { width: min(760px, 100%); margin-inline: auto; aspect-ratio: 4 / 5; touch-action: pan-y; }
.product-detail-page .pdp-image img { display: block; user-select: none; -webkit-user-drag: none; }
.product-detail-page .pdp-image:hover img { transform: none; }
.pdp-gallery-arrow { position: absolute; z-index: 2; top: 50%; display: grid; width: 44px; height: 44px; padding: 0; place-items: center; transform: translateY(-50%); border: 1px solid rgba(243,239,231,.4); border-radius: 50%; color: #f3efe7; background: rgba(8,8,8,.65); font: 20px Archivo, sans-serif; cursor: pointer; backdrop-filter: blur(12px); }
.pdp-gallery-arrow:hover { background: rgba(8,8,8,.88); }
.pdp-gallery-arrow:focus-visible { outline: 2px solid #ffb000; outline-offset: 3px; }
.pdp-gallery-prev { left: 16px; }
.pdp-gallery-next { right: 16px; }
@media (max-width: 760px) {
  .products-page .retail-campaign.campaign-film { height: auto; min-height: 0; padding-bottom: 18px; }
  .products-page .campaign-film-video { height: auto; aspect-ratio: 1920 / 824; }
}

.cart-discount { margin: 18px 0; }
.cart-discount > label { display: block; margin-bottom: 8px; font-size: 10px; letter-spacing: .12em; }
.cart-discount > div { display: flex; gap: 8px; }
.cart-discount input { flex: 1; min-width: 0; padding: 11px 12px; border: 1px solid var(--shop-line); border-radius: 2px; font: inherit; }
.cart-discount button { padding: 0 15px; border: 1px solid var(--shop-line); color: var(--shop-ink); background: var(--shop-panel); cursor: pointer; }
.cart-discount p { min-height: 1.2em; margin: 7px 0 0; color: var(--shop-muted); font-size: 11px; }
.cart-discount-line[hidden] { display: none; }
.cart-summary .dossier-cta span { display: block; width: auto; height: auto; aspect-ratio: auto; color: var(--void); background: transparent; font-size: 10px; }
.cart-summary .dossier-cta b { display: grid; flex: 0 0 40px; width: 40px; height: 40px; place-items: center; border-radius: 50%; color: var(--bone); background: var(--burnt); font-size: 16px; }
