/*
 * product-page.css
 * Product page styles: QrTiger icon font, layout, themes 1–10, carousel, description, link component.
 * Sections: @font-face & icons | .productPage base & utilities | theme text overrides |
 * shared modals/video/social | theme-1 … theme-10 | carousel | description truncation | link component
 */

/* ==========================================================================
   QrTiger icon font
   ========================================================================== */

@font-face {
  font-family: 'QrTiger';
  src:  url('../fonts/QrTiger.eot?76u8lk');
  src:  url('../fonts/QrTiger.eot?76u8lk#iefix') format('embedded-opentype'),
      url('../fonts/QrTiger.ttf?76u8lk') format('truetype'),
      url('../fonts/QrTiger.woff?76u8lk') format('woff'),
      url('../fonts/QrTiger.svg?76u8lk#QrTiger') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="qr-"], [class*=" qr-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'QrTiger' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.qr-stoplight_logo:before {
  content: "\e900";
}
.qr-email:before {
  content: "\e901";
}
.qr-instagram:before {
  content: "\e902";
}
.qr-pdf:before {
  content: "\e903";
}
.qr-html:before {
  content: "\e904";
}
.qr-facebook-thin:before {
  content: "\e905";
}
.qr-email1:before {
  content: "\e906";
}
.qr-app-store:before {
  content: "\e907";
}
.qr-facebook-like:before {
  content: "\e908";
}
.qr-pinterest:before {
  content: "\e909";
}
.qr-mp3:before {
  content: "\e90a";
}
.qr-vcard:before {
  content: "\e90b";
}
.qr-url:before {
  content: "\e90c";
}
.qr-text:before {
  content: "\e90d";
}
.qr-event:before {
  content: "\e90e";
}
.qr-youtube:before {
  content: "\e90f";
}
.qr-star-inside-circle:before {
  content: "\e910";
}
.qr-open-menu:before {
  content: "\e911";
}
.qr-twitter:before {
  content: "\e912";
}
.qr-caret-up:before {
  content: "\e913";
}
.qr-caret-down:before {
  content: "\e914";
}
.qr-sns:before {
  content: "\e915";
}
.qr-wechat:before {
  content: "\e916";
}
.qr-multi:before {
  content: "\e917";
}
.qr-search:before {
  content: "\e918";
}
.qr-alipay:before {
  content: "\e919";
}
.qr-social-media:before {
  content: "\e91a";
}
.qr-forms:before {
  content: "\e91b";
}
.qr-check-circle:before {
  content: "\e91c";
}
.qr-more:before {
  content: "\e91d";
}
.qr-line:before {
  content: "\e91e";
}
.qr-tiktok:before {
  content: "\e91f";
}
.qr-close:before {
  content: "\e920";
}
.qr-question-circle:before {
  content: "\e921";
}
.qr-angle-down:before {
  content: "\e922";
}
.qr-angle-up:before {
  content: "\e923";
}
.qr-plus:before {
  content: "\e924";
}
.qr-user:before {
  content: "\e925";
}
.qr-qrcode:before {
  content: "\e926";
}
.qr-double-arrow-left:before {
  content: "\e927";
}
.qr-double-arrow-right:before {
  content: "\e928";
}
.qr-question:before {
  content: "\e929";
}
.qr-paint-brush:before {
  content: "\e92a";
}
.qr-trash:before {
  content: "\e92b";
}
.qr-linkedin:before {
  content: "\e92c";
}
.qr-wechat-main:before {
  content: "\e92d";
}
.qr-whatsapp:before {
  content: "\e92e";
}
.qr-tumblr:before {
  content: "\e92f";
}
.qr-skype:before {
  content: "\e930";
}
.qr-reddit:before {
  content: "\e931";
}
.qr-qq:before {
  content: "\e932";
}
.qr-medium:before {
  content: "\e933";
}
.qr-yelp:before {
  content: "\e934";
}
.qr-quora:before {
  content: "\e935";
}
.qr-meetup:before {
  content: "\e936";
}
.qr-snapchat:before {
  content: "\e937";
}
.qr-check:before {
  content: "\e938";
}
.qr-exchange:before {
  content: "\e939";
}
.qr-facebook:before {
  content: "\e93a";
}
.qr-play:before {
  content: "\e93b";
}
.qr-kakao-talk:before {
  content: "\e93c";
}
.qr-viber:before {
  content: "\e93d";
}
.qr-high-signal:before {
  content: "\e93e";
}
.qr-telegram:before {
  content: "\e93f";
}
.qr-twitch:before {
  content: "\e940";
}
.qr-phone-call:before {
  content: "\e941";
}
.qr-global:before {
  content: "\e942";
}
.qr-postmates:before {
  content: "\e943";
}
.qr-foodpanda:before {
  content: "\e944";
}
.qr-ebay:before {
  content: "\e945";
}
.qr-rakuten:before {
  content: "\e946";
}
.qr-menulog:before {
  content: "\e947";
}
.qr-podcast:before {
  content: "\e948";
}
.qr-zomato:before {
  content: "\e949";
}
.qr-shopify:before {
  content: "\e94a";
}
.qr-ubereats:before {
  content: "\e94b";
}
.qr-etsy:before {
  content: "\e94c";
}
.qr-bilibili:before {
  content: "\e94d";
}
.qr-streamlabs:before {
  content: "\e94e";
}
.qr-soundcloud:before {
  content: "\e94f";
}
.qr-patreon:before {
  content: "\e950";
}
.qr-grubhub:before {
  content: "\e951";
}
.qr-doordash:before {
  content: "\e952";
}
.qr-kuaishou:before {
  content: "\e953";
}
.qr-douban:before {
  content: "\e954";
}
.qr-account:before {
  content: "\e955";
}
.qr-settings:before {
  content: "\e956";
}
.qr-refresh:before {
  content: "\e957";
}
.qr-swiggy:before {
  content: "\e958";
}
.qr-justeat:before {
  content: "\e959";
}
.qr-deliveroo:before {
  content: "\e95a";
}
.qr-glovo:before {
  content: "\e95b";
}
.qr-time:before {
  content: "\e95c";
}
.qr-notification:before {
  content: "\e95d";
}
.qr-lock:before {
  content: "\e95e";
}
.qr-zhihu:before {
  content: "\e95f";
}
.qr-xiao-hongsu:before {
  content: "\e960";
}
.qr-weibo:before {
  content: "\e961";
}
.qr-wechat-mini:before {
  content: "\e962";
}
.qr-soul:before {
  content: "\e963";
}
.qr-himalaya:before {
  content: "\e964";
}
.qr-meituan:before {
  content: "\e965";
}
.qr-eleme:before {
  content: "\e966";
}
.qr-pingduoduo:before {
  content: "\e967";
}
.qr-jingdong:before {
  content: "\e968";
}
.qr-taobao:before {
  content: "\e969";
}
.qr-xuexi:before {
  content: "\e96a";
}
.qr-qq-music:before {
  content: "\e96b";
}
.qr-k-song:before {
  content: "\e96c";
}
.qr-hibixin:before {
  content: "\e96d";
}
.qr-dianping:before {
  content: "\e96e";
}
.qr-wechat-channel:before {
  content: "\e96f";
}
.qr-amazon:before {
  content: "\e970";
}
.qr-applemusic:before {
  content: "\e971";
}
.qr-yogiyo:before {
  content: "\e972";
}
.qr-send:before {
  content: "\e973";
}
.qr-open-box:before {
  content: "\e974";
}
.qr-left-arrow:before {
  content: "\e975";
}
.qr-xianyu:before {
  content: "\e976";
}
.qr-tick-inside-circle:before {
  content: "\e977";
}
.qr-reward:before {
  content: "\e978";
}
.qr-template:before {
  content: "\e979";
}
.qr-location:before {
  content: "\e97a";
}
.qr-fax:before {
  content: "\e97b";
}
.qr-brief-case:before {
  content: "\e97c";
}
.qr-phone:before {
  content: "\e97d";
}
.qr-form:before {
  content: "\e97e";
}
.qr-add-user:before {
  content: "\e97f";
}
.qr-documentation:before {
  content: "\e980";
}
.qr-kesong:before {
  content: "\e981";
}
.qr-cloud-computing:before {
  content: "\e982";
}
.qr-rise:before {
  content: "\e983";
}
.qr-box:before {
  content: "\e984";
}
.qr-bolt:before {
  content: "\e985";
}
.qr-shield:before {
  content: "\e986";
}
.qr-circle-check-thin:before {
  content: "\e987";
}
.qr-share:before {
  content: "\e988";
}
.qr-link:before {
  content: "\e989";
}
.qr-hot-coffee:before {
  content: "\e98a";
}
.qr-speech-bubble:before {
  content: "\e98b";
}
.qr-shopping-bag:before {
  content: "\e98c";
}
.qr-music:before {
  content: "\e98d";
}
.qr-wifi:before {
  content: "\e98e";
}
.qr-paper:before {
  content: "\e98f";
}
.qr-user-profile:before {
  content: "\e990";
}
.qr-facebook-circle:before {
  content: "\e991";
}
.qr-frame:before {
  content: "\e992";
}
.qr-layout:before {
  content: "\e993";
}
.qr-sliders:before {
  content: "\e994";
}
.qr-image:before {
  content: "\e995";
}
.qr-two-arrows-pointing-right-and-left:before {
  content: "\e996";
}
.qr-lock-no-key-hold:before {
  content: "\e997";
}
.qr-arrow-down-in-circle:before {
  content: "\e998";
}
.qr-scan:before {
  content: "\e999";
}
.qr-star:before {
  content: "\e99a";
}
.qr-embed-other:before {
  content: "\e99b";
}
.qr-embed-video:before {
  content: "\e99c";
}
.qr-meta-tags:before {
  content: "\e99d";
}
.qr-store-hours:before {
  content: "\e99e";
}
.qr-eyes:before {
  content: "\e99f";
}
.qr-pattern:before {
  content: "\e9a0";
}
.qr-template-frame:before {
  content: "\e9a1";
}
.qr-angle-right:before {
  content: "\e9a2";
}
.qr-angle-left:before {
  content: "\e9a3";
}
.qr-uber:before {
  content: "\e9a4";
}
.qr-exclamation-circle:before {
  content: "\e9a5";
}
.qr-circle-check-regular:before {
  content: "\e9a6";
}
.qr-plus-circle:before {
  content: "\e9a7";
}
.qr-colors:before {
  content: "\e9a8";
}
.qr-logo:before {
  content: "\e9a9";
}
.qr-close-circle:before {
  content: "\e9aa";
}
.qr-trashcan:before {
  content: "\e9ab";
}
.qr-arrow:before {
  content: "\e9ac";
}
.qr-location-solid:before {
  content: "\e9ad";
}
.qr-lock-circle:before {
  content: "\e9ae";
}
.qr-show-more:before {
  content: "\e9af";
}
.qr-register:before {
  content: "\e9b0";
}
.qr-login:before {
  content: "\e9b1";
}
.qr-user-add:before {
  content: "\e9b2";
}
.qr-dashboard:before {
  content: "\e9b3";
}
.qr-logout:before {
  content: "\e9b4";
}
.qr-sms:before {
  content: "\e9b5";
}
.qr-event2:before {
  content: "\e9b6";
}
.qr-padlock:before {
  content: "\e9b7";
}
.qr-profile-stack:before {
  content: "\e9b8";
}
.qr-huawei:before {
  content: "\e9b9";
}
.qr-apple:before {
  content: "\e9ba";
}
.qr-android:before {
  content: "\e9bb";
}
.qr-billing:before {
  content: "\e9bc";
}
.qr-x-logo:before {
  content: "\e9bd";
}
.qr-micro:before {
  content: "\e9be";
}
.qr-pieces:before {
  content: "\e9bf";
}
.qr-ebook:before {
  content: "\e9c0";
}
.qr-edit-comment:before {
  content: "\e9c1";
}
.qr-tiger:before {
  content: "\e9c2";
}
.qr-group:before {
  content: "\e9c3";
}
.qr-clound:before {
  content: "\e9c4";
}
.qr-stacks:before {
  content: "\e9c5";
}
.qr-frame-code:before {
  content: "\e9c6";
}
.qr-audio:before {
  content: "\e9c7";
}
.qr-facebook-solid:before {
  content: "\e9c8";
}
.qr-share-link:before {
  content: "\e9c9";
}
.qr-upload:before {
  content: "\e9ca";
}
.qr-registration-form:before {
  content: "\e9cb";
}
.qr-file-search:before {
  content: "\e9cc";
}
.qr-retail:before {
  content: "\e9cd";
}
.qr-analytics:before {
  content: "\e9ce";
}
.qr-service:before {
  content: "\e9cf";
}
.qr-product-recall:before {
  content: "\e9d0";
}
.qr-open:before {
  content: "\e9d1";
}
.qr-logistics:before {
  content: "\e9d2";
}
.qr-location-circle:before {
  content: "\e9d3";
}
.qr-cargo:before {
  content: "\e9d4";
}
.qr-file-bookmark:before {
  content: "\e9d5";
}
.qr-appointment:before {
  content: "\e9d6";
}
.qr-marketing:before {
  content: "\e9d7";
}
.qr-advertising:before {
  content: "\e9d8";
}
.qr-elearning:before {
  content: "\e9d9";
}
.qr-customer-support:before {
  content: "\e9da";
}
.qr-feedback:before {
  content: "\e9db";
}
.qr-dine-bell:before {
  content: "\e9dc";
}
.qr-guidebook:before {
  content: "\e9dd";
}
.qr-help:before {
  content: "\e9de";
}
.qr-innovation:before {
  content: "\e9df";
}
.qr-verification:before {
  content: "\e9e0";
}
.qr-folder2:before {
  content: "\e9e1";
}
.qr-smart-label:before {
  content: "\e9e2";
}
.qr-allergens:before {
  content: "\e9e3";
}
.qr-certification:before {
  content: "\e9e4";
}
.qr-safety:before {
  content: "\e9e5";
}
.qr-ingredients:before {
  content: "\e9e6";
}
.qr-add-product:before {
  content: "\e9e7";
}
.qr-package:before {
  content: "\e9e8";
}
.qr-nutrition:before {
  content: "\e9e9";
}
.qr-truck:before {
  content: "\e9ea";
}
.qr-truck-line:before {
  content: "\e9eb";
}
.qr-details:before {
  content: "\e9ec";
}
.qr-details-line:before {
  content: "\e9ed";
}
.qr-home-line:before {
  content: "\e9ef";
}
.qr-holding-heart:before {
  content: "\e9ee";
}
.qr-holding-heart-2:before {
  content: "\e9f0";
}
.qr-composition:before {
  content: "\e9f1";
}
.qr-dimension:before {
  content: "\e9f2";
}
.qr-copy:before {
  content: "\e9f3";
}

/* ==========================================================================
   Product page layout & base utilities
   ========================================================================== */

.productPage {
  position: relative;
  height: 100dvh;
  overflow: hidden;
  max-width: 440px;
  width: 100%;
}

.productPage .scroll-x {
  overflow-y: auto;
  scroll-padding-left: 0;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.productPage .scroll-x::-webkit-scrollbar {
  display: none;
}
.productPage .scroll-x > * {
  scroll-snap-align: start;
  flex-shrink: 0;
}

.productPage .full-width {
  width: 100%;
}

.productPage .gap-1 {
  gap: 4px;
}
.productPage .gap-2 {
  gap: 8px;
}
.productPage .gap-3 {
  gap: 12px;
}
.productPage .gap-4 {
  gap: 16px;
}
.productPage .gap-5 {
  gap: 20px;
}
.productPage .x-font-1 {
  font-size: 28px; /* ~24px */
}
.productPage .x-font-1-5 {
  font-size: 26px;
}
.productPage .font-1 {
  font-size: 22px; /* ~18px */
}
.productPage .font-2 {
  font-size: 20px; /* ~16px */
}
.productPage .font-3 {
  font-size: 18px; /* ~13px */
}
.productPage .x-font-2 {
  font-size: 16px; /* ~12px */
}
.productPage .font-2\.5 {
  font-size: 15px;
}
.productPage .font-4 {
  font-size: 14px;
}
.productPage .x-font-3 {
  font-size: 13px;
}
.productPage .x-font-4 {
  font-size: 12px;
}


.productPage .fw-normal {
  font-weight: 500;
}
.productPage .fw-semibold {
  font-weight: 600;
}
.productPage .fw-bold {
  font-weight: 700;
}
/* Theme overrides so text utilities use customization */
.productPage.theme-1 .text-bold { color: var(--theme-1-font-color); }
.productPage.theme-1 .text-semibold { color: var(--theme-1-font-color); }
.productPage.theme-1 .text-regular { color: var(--theme-1-description-font-color); }
.productPage.theme-2 .text-bold { color: var(--theme-2-font-color); }
.productPage.theme-2 .text-semibold { color: var(--theme-2-font-color); }
.productPage.theme-2 .text-regular { color: var(--theme-2-description-font-color); }
.productPage.theme-3 .text-bold { color: var(--theme-3-font-color); }
.productPage.theme-3 .text-semibold { color: var(--theme-3-font-color); }
.productPage.theme-3 .text-regular { color: var(--theme-3-description-font-color); }
.productPage.theme-4 .text-bold { color: var(--theme-4-font-color); }
.productPage.theme-4 .text-semibold { color: var(--theme-4-font-color); }
.productPage.theme-4 .text-regular { color: var(--theme-4-description-font-color); }
.productPage.theme-5 .text-bold { color: var(--theme-5-font-color); }
.productPage.theme-5 .text-semibold { color: var(--theme-5-font-color); }
.productPage.theme-5 .text-regular { color: var(--theme-5-description-font-color); }
.productPage.theme-6 .text-bold { color: var(--theme-6-font-color); }
.productPage.theme-6 .text-semibold { color: var(--theme-6-font-color); }
.productPage.theme-6 .text-regular { color: var(--theme-6-description-font-color); }
.productPage.theme-7 .text-bold { color: var(--theme-7-font-color); }
.productPage.theme-7 .text-semibold { color: var(--theme-7-font-color); }
.productPage.theme-7 .text-regular { color: var(--theme-7-description-font-color); }
.productPage.theme-8 .text-bold { color: var(--theme-8-font-color); }
.productPage.theme-8 .text-semibold { color: var(--theme-8-font-color); }
.productPage.theme-8 .text-regular { color: var(--theme-8-description-font-color); }
.productPage.theme-9 .text-bold { color: var(--theme-9-font-color); }
.productPage.theme-9 .text-semibold { color: var(--theme-9-font-color); }
.productPage.theme-9 .text-regular { color: var(--theme-9-description-font-color); }
.productPage.theme-10 .text-bold { color: var(--theme-10-font-color); }
.productPage.theme-10 .text-semibold { color: var(--theme-10-font-color); }
.productPage.theme-10 .text-regular { color: var(--theme-10-description-font-color); }
.productPage .text-grey-100 {
  color: #526179;
}
.productPage .text-grey-200 {
  color: #7E7E7E;
}
.productPage .footer-menu {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 12px 14px;
  color: #fff;
}
.productPage .footer-menu .menu {
  cursor: pointer;
  text-align: center;
}
.productPage .footer-menu .menu i {
  font-size: 20px;
}
.productPage .footer-menu .menu p {
  font-size: 14px;
  margin: 0;
}
.productPage .footer-menu .menu a {
  text-decoration: none;
  color: unset;
}
.productPage .faq .item {
  padding: 6px 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  margin-top: 8px;
}
.productPage.theme-1 { --faq-icon-color: var(--theme-1-font-color); }
.productPage.theme-2 { --faq-icon-color: var(--theme-2-font-color); }
.productPage.theme-3 { --faq-icon-color: var(--theme-3-font-color); }
.productPage.theme-4 { --faq-icon-color: var(--theme-4-font-color); }
.productPage.theme-5 { --faq-icon-color: var(--theme-5-font-color); }
.productPage.theme-6 { --faq-icon-color: var(--theme-6-font-color); }
.productPage.theme-7 { --faq-icon-color: var(--theme-7-font-color); }
.productPage.theme-8 { --faq-icon-color: var(--theme-8-font-color); }
.productPage.theme-9 { --faq-icon-color: var(--theme-9-font-color); }
.productPage.theme-10 { --faq-icon-color: var(--theme-10-font-color); }

.productPage .faq .faq-icon path{
  fill: var(--faq-icon-color);
}
.productPage .review-item {
  background-color: #f0f0f0;
  border-radius: 15px;
  width: 220px;
}
.productPage .review-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.productPage .review-avatar-placeholder {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: #d3d3d3;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.productPage .review-avatar-placeholder .qr-user-profile {
  color: #808080;
  font-size: 18px;
}
.productPage .details-modal {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #fff;
  width: 100%;
  border-radius: 20px 20px 0 0;
  overflow-y: auto;
  max-height: 90dvh;
  z-index: 99;
}
.productPage .details-modal.show {
  display: block;
}
.productPage .details-modal .image-placeholder {
  width: 100%;
  height: 200px;
  background-color: #ccc;
}
.productPage .details-modal .modal-overflow {
  margin-bottom: 14px;
}

/* Modal backdrop overlay */
.productPage .modal-backdrop {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 98;
}
.productPage .modal-backdrop.show {
  display: block;
}

/* Blur main content when modal is open */
.productPage .main .product-page.modal-open,
.productPage .main .support-page.modal-open {
  filter: blur(3px);
  transition: filter 0.3s ease;
}
.productPage .details-modal i {
  position: sticky !important;
  top: 12px;
  right: 12px;
  display: block;
  width: fit-content;
  margin-left: auto;
  margin-bottom: -1.5em;
  color: #fff;
  z-index: 100;
}
.productPage .details-modal img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 42%;
  display: block;
}
.productPage .accessory-modal {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #fff;
  padding: 30px 0;
  width: 100%;
  border-radius: 20px 20px 0 0;
  overflow: hidden;
  z-index: 99;
}
.productPage .accessory-modal.show {
  display: block;
}
.productPage .accessory-modal i {
  top: 12px;
  right: 12px;
  font-size: 50px;
}
.productPage .accessory-modal i.qr-close {
  color: #000 !important;
  font-size: 16px;
}
.productPage .accessory-modal .modal-overflow {
  max-height: 240px;
  overflow-y: auto;
  margin-bottom: 14px;
}
.productPage .video-wrapper {
  position: relative;
  width: 100%;
  height: 220px;
  overflow: hidden;
  margin-top: 6px;
}
.productPage .video-wrapper.round {
  border-radius: 20px;
}
.productPage .video-wrapper video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.productPage .video-wrapper .youtube-thumbnail {
  position: relative;
  width: 100%;
  height: 100%;
  cursor: pointer;
  border-radius: 8px;
  overflow: hidden;
}
/* .youtube-thumbnail:hover .play-button {
  background: rgba(255, 0, 0, 0.8);
} */
.productPage .video-wrapper.playing .play-button {
  display: none;
}
.productPage .video-wrapper.playing:hover .play-button {
  display: block;
}
.productPage .video-wrapper .play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  cursor: pointer;
}
.productPage .video-wrapper .play-button i {
  font-size: 16px;
  color: #fff;
  position: absolute;
  top: 11px;
  left: 13px;
}

.productPage .social-media a img {
  width: 35px;
  height: 35px;
  object-fit: cover;
  object-position: center;
}

/* Shared PRODUCT DETAILS V2 (Theme 9 baseline).
   Theme 10 intentionally overrides with its own styles. */
   .productPage.theme-1 { --product-details-v2-bg: var(--theme-1-icon-color); }
   .productPage.theme-2 { --product-details-v2-bg: var(--theme-2-icon-color); }
   .productPage.theme-3 { --product-details-v2-bg: var(--theme-3-icon-color); }
   .productPage.theme-4 { --product-details-v2-bg: var(--theme-4-icon-color); }
   .productPage.theme-5 { --product-details-v2-bg: var(--theme-5-icon-color); }
   .productPage.theme-6 { --product-details-v2-bg: var(--theme-6-icon-color); }
   .productPage.theme-7 { --product-details-v2-bg: var(--theme-7-icon-color); }
   .productPage.theme-8 { --product-details-v2-bg: var(--theme-8-icon-color); }
   .productPage.theme-9 { --product-details-v2-bg: var(--theme-9-icon-color); }
   .productPage.theme-10 { --product-details-v2-bg: var(--theme-10-icon-color); }

   .productPage .product-page .product-details-v2 {
     display: grid;
     gap: 12px;
     margin-bottom: 10px;
   }
   .productPage .product-page .product-details-v2 .item {
     cursor: pointer;
     border: 1px solid var(--product-details-v2-bg);
     padding: 12px 20px;
     border-radius: 20px;
     text-align: center;
   }
   .productPage .product-page .product-details-v2 .item i:first-of-type {
     font-size: 18px;
   }
   .productPage .product-page .product-details-v2 .item span {
     font-size: 14px;
     flex: 1;
   }
   .productPage .product-page .product-details-v2 .item .qr-angle-right {
     font-size: 14px;
   }

  .productPage.theme-1 a {
    color: var(--theme-1-description-font-color);
  }
  .productPage.theme-2 a {
    color: var(--theme-2-description-font-color);
  }
  .productPage.theme-3 a {
    color: var(--theme-3-description-font-color);
  }
  .productPage.theme-4 a {
    color: var(--theme-4-description-font-color);
  }
  .productPage.theme-5 a {
    color: var(--theme-5-description-font-color);
  }
  .productPage.theme-6 a {
    color: var(--theme-6-description-font-color);
  }
  .productPage.theme-7 a {
    color: var(--theme-7-description-font-color);
  }
  .productPage.theme-8 a {
    color: var(--theme-8-description-font-color);
  }
  .productPage.theme-9 a {
    color: var(--theme-9-description-font-color);
  }
  .productPage.theme-10 a {
    color: var(--theme-10-description-font-color);
  }
/* ==========================================================================
   Theme 1
   ========================================================================== */

.productPage.theme-1 {
  background: var(--theme-1-background-color);
  font-family: var(--theme-1-font-family), sans-serif;
}
.productPage.theme-1 .font-family {
  font-family: var(--theme-1-font-family), sans-serif;
}
.productPage.theme-1 .font-color {
  color: var(--theme-1-font-color);
}
.productPage.theme-1 .description-font-color {
  color: var(--theme-1-description-font-color);
}
.productPage.theme-1 .icon-color {
  color: var(--theme-1-icon-color);
}
.productPage.theme-1 .main {
  width: 100%;
  height: 100%;
}
.productPage.theme-1 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-1 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-1 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.productPage.theme-1 .details-modal {
  background: var(--theme-1-background-color);
}
.productPage.theme-1 .details-modal i {
  color: var(--theme-1-icon-color);
}
.productPage.theme-1 .accessory-modal {
  background: var(--theme-1-background-color);
}
.productPage.theme-1 .accessory-modal i {
  color: var(--theme-1-icon-color);
}
.productPage.theme-1 .main.show .product-page {
  filter: blur(1px);
}
.productPage.theme-1 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-1 .home-page {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  background: var(--theme-1-background-color);
}
.productPage.theme-1 .home-page .main-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.productPage.theme-1 .home-page .logo {
  position: absolute;
  top: 40px;
  left: 50%;
  width: 60px;
  height: 60px;
  transform: translateX(-50%);
}
.productPage.theme-1 .home-page .learn-section {
  bottom: 40px;
  left: 50%;
  width: 90%;
  padding: 0 10px;
  transform: translateX(-50%);
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
  border-radius: 20px;
  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.1),
    inset 0 0 10px 6px rgba(255, 255, 255, 0.6);
}
.productPage.theme-1 .home-page .learn-section a {
  text-decoration: none;
}
.productPage.theme-1 .home-page .learn-section a i {
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin: auto;
  background: #ffffff;
  color: var(--theme-1-icon-color);
  font-size: 20px;
}
.productPage.theme-1 .product-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
}
.productPage.theme-1 .product-page .product-details {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
.productPage.theme-1 .product-page .product-details .item {
  display: flex;
  gap: 2px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: color-mix(in srgb, var(--theme-1-icon-color) 15%, transparent);
  padding: 24px 2px;
  border-radius: 12px;
  min-width: 65px;
  text-align: center;
  flex: 1;
}
.productPage.theme-1 .product-page .product-details .item i {
  font-size: 26px;
  color: var(--theme-1-icon-color);
}
.productPage.theme-1 .product-page .product-accessories {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  margin-top: 1.5rem;
}
.productPage.theme-1 .product-page .product-accessories .item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--theme-1-icon-color) 15%, transparent);
  padding: 10px;
  text-align: center;
  border-radius: 20px;
  cursor: pointer;
}
.productPage.theme-1 .product-page .product-accessories .item .label {
  font-weight: 600;
  margin: 0;
  margin-bottom: 6px;
}
.productPage.theme-1 .product-page .product-accessories .item i {
  font-size: 36px;
  color: var(--theme-1-icon-color);
}
.productPage.theme-1 .support-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
}
.productPage.theme-1 .operation-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
}
.productPage.theme-1 .operation-page .instructions {
  border-radius: 12px;
  background: color-mix(in srgb, var(--theme-1-icon-color) 15%, transparent);
}
.productPage.theme-1 .operation-page .instructions i {
  font-size: 45px;
  color: var(--theme-1-icon-color);
}
.productPage.theme-1 .footer-menu {
  background: var(--theme-1-theme-color);
}

/* ==========================================================================
   Theme 2
   ========================================================================== */

.productPage.theme-2 {
  background: var(--theme-2-background-color);
  font-family: var(--theme-2-font-family), sans-serif;
}
.productPage.theme-2 .font-family {
  font-family: var(--theme-2-font-family), sans-serif;
}
.productPage.theme-2 .font-color {
  color: var(--theme-2-font-color);
}
.productPage.theme-2 .description-font-color {
  color: var(--theme-2-description-font-color);
}
.productPage.theme-2 .icon-color {
  color: var(--theme-2-icon-color);
}
.productPage.theme-2 .main {
  position: relative;
  height: 100dvh;
}
.productPage.theme-2 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-2 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-2 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.productPage.theme-2 .details-modal {
  background: var(--theme-2-background-color);
}
.productPage.theme-2 .details-modal i {
  color: var(--theme-2-icon-color);
}
.productPage.theme-2 .accessory-modal {
  background: var(--theme-2-background-color);
}
.productPage.theme-2 .accessory-modal i {
  color: var(--theme-2-icon-color);
}
.productPage.theme-2 .main.show .product-page {
  filter: blur(1px);
}
.productPage.theme-2 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-2 .home-page {
  background: var(--theme-2-background-color);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}
.productPage.theme-2 .home-page .main-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.productPage.theme-2 .home-page .curve {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 372px;
  background: var(--theme-2-background-color);
  box-shadow: 1px 2px 3px rgba(255, 255, 255, 0.3);
  clip-path: polygon(100% 100%, 0% 100%, 0% 8.6%, 1.25% 7.78%, 2.5% 7%, 3.75% 6.25%, 5% 5.54%, 6.25% 4.88%, 7.5% 4.25%, 8.75% 3.67%, 10% 3.13%, 11.25% 2.63%, 12.5% 2.18%, 13.75% 1.78%, 15% 1.43%, 16.25% 1.12%, 17.5% 0.87%, 18.75% 0.66%, 20% 0.51%, 21.25% 0.4%, 22.5% 0.35%, 23.75% 0.35%, 25% 0.4%, 26.25% 0.5%, 27.5% 0.66%, 28.75% 0.86%, 30% 1.11%, 31.25% 1.41%, 32.5% 1.77%, 33.75% 2.17%, 35% 2.61%, 36.25% 3.11%, 37.5% 3.64%, 38.75% 4.23%, 40% 4.85%, 41.25% 5.52%, 42.5% 6.23%, 43.75% 6.97%, 45% 7.75%, 46.25% 8.57%, 47.5% 9.42%, 48.75% 10.3%, 50% 11.21%, 51.25% 12.14%, 52.5% 13.1%, 53.75% 14.09%, 55% 15.09%, 56.25% 16.12%, 57.5% 17.16%, 58.75% 18.21%, 60% 19.28%, 61.25% 20.35%, 62.5% 21.43%, 63.75% 22.52%, 65% 23.61%, 66.25% 24.7%, 67.5% 25.78%, 68.75% 26.86%, 70% 27.94%, 71.25% 29%, 72.5% 30.05%, 73.75% 31.08%, 75% 32.1%, 76.25% 33.1%, 77.5% 34.08%, 78.75% 35.03%, 80% 35.96%, 81.25% 36.86%, 82.5% 37.74%, 83.75% 38.58%, 85% 39.38%, 86.25% 40.15%, 87.5% 40.88%, 88.75% 41.58%, 90% 42.23%, 91.25% 42.85%, 92.5% 43.42%, 93.75% 43.94%, 95% 44.42%, 96.25% 44.85%, 97.5% 45.24%, 98.75% 45.58%, 100% 45.87%);
}
.productPage.theme-2 .home-page .info {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 60px;
  z-index: 2;
  padding: 0 16px;
  width: 80%;
}
.productPage.theme-2 .home-page .info .btn-cta {
  background: var(--theme-2-theme-color);
  border-radius: 10px;
}
.productPage.theme-2 .home-page .info .btn-cta i {
  width: 20px;
  height: 20px;
  font-size: 12px;
  line-height: 20px;
  color: var(--theme-2-icon-color);
}
.productPage.theme-2 .product-page .hero-image {
  width: calc(100% - 2rem);
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 20px;
}
.productPage.theme-2 .product-page .product-item {
  border: 1px solid var(--theme-2-icon-color);
  padding: 12px 20px;
  border-radius: 30px;
  min-width: 80px;
}
.productPage.theme-2 .product-page .product-item i {
  font-size: 18px;
  color: var(--theme-2-icon-color);
}
.productPage.theme-2 .product-page .product-item span {
  font-size: 14px;
}
.productPage.theme-2 .product-page .product-accessories {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, 1fr);
  margin: 1.5rem 2.5rem 0;
}
.productPage.theme-2 .product-page .product-accessories .item {
  display: flex;
  justify-content: center;
  align-items: center;
  background: color-mix(in srgb, var(--theme-2-icon-color) 15%, transparent);
  cursor: pointer;
  min-width: 76px;
  max-width: 76px;
  height: 76px;
  border-radius: 50%;
}
.productPage.theme-2 .product-page .product-accessories .item i {
  font-size: 36px;
  color: var(--theme-2-icon-color);
}
.productPage.theme-2 .support-page .hero-image {
  width: calc(100% - 2rem);
  height: 200px;
  object-fit: cover;
  border-radius: 20px;
  object-position: center 10%;
}
.productPage.theme-2 .support-page .video-wrapper {
  width: calc(100% - 2rem) !important;
}
.productPage.theme-2 .operation-page .hero-image {
  width: calc(100% - 2rem);
  height: 200px;
  object-fit: cover;
  object-position: center 10%;
  border-radius: 20px;
}
.productPage.theme-2 .operation-page .instructions {
  border-radius: 12px;
  border: 1px solid var(--theme-2-icon-color);
}
.productPage.theme-2 .operation-page .instructions i {
  font-size: 45px;
  color: var(--theme-2-icon-color);
}
.productPage.theme-2 .footer-menu {
  background: var(--theme-2-theme-color);
}

/* ==========================================================================
   Theme 3
   ========================================================================== */

.productPage.theme-3 {
  background: var(--theme-3-background-color);
  font-family: var(--theme-3-font-family), sans-serif;
}
.productPage.theme-3 .font-family {
  font-family: var(--theme-3-font-family), sans-serif;
}
.productPage.theme-3 .font-color {
  color: var(--theme-3-font-color);
}
.productPage.theme-3 .description-font-color {
  color: var(--theme-3-description-font-color);
}
.productPage.theme-3 .icon-color {
  color: var(--theme-3-icon-color);
}
.productPage.theme-3 .main {
  position: relative;
  height: 100dvh;
}
.productPage.theme-3 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-3 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-3 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
}
.productPage.theme-3 .details-modal {
  background: var(--theme-3-background-color);
}
.productPage.theme-3 .details-modal i {
  color: var(--theme-3-icon-color);
}
.productPage.theme-3 .accessory-modal {
  background: var(--theme-3-background-color);
}
.productPage.theme-3 .accessory-modal i {
  color: var(--theme-3-icon-color);
}
.productPage.theme-3 .main.show .product-page {
  filter: blur(1px);
}
.productPage.theme-3 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-3 .home-page {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  background: var(--theme-3-background-color);
}
.productPage.theme-3 .home-page .main-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.productPage.theme-3 .home-page .learn-section {
  top: 10%;
  left: 50%;
  width: 90%;
  padding: 14px 10px;
  transform: translateX(-50%);
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
  border-radius: 20px;
}
.productPage.theme-3 .home-page .learn-section button {
  background-color: transparent;
  border: 1px solid #fff;
  outline: none;
  border-radius: 6px;
}
.productPage.theme-3 .home-page .learn-section button i {
  min-width: 16px;
  min-height: 16px;
  line-height: 16px;
  text-align: center;
  font-size: 10px;
  color: var(--theme-3-icon-color);
}
.productPage.theme-3 .product-page .product-details {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
.productPage.theme-3 .product-page .product-details .item {
  display: flex;
  gap: 6px;
  cursor: pointer;
  align-items: center;
  padding: 6px 10px;
  border-radius: 18px;
  min-width: 90px;
  text-align: center;
  border: 1px solid var(--theme-3-icon-color);
}
.productPage.theme-3 .product-page .product-details .item i {
  font-size: 22px;
  color: var(--theme-3-icon-color);
}
.productPage.theme-3 .product-page .product-details .item span {
  font-size: 14px;
  color: var(--theme-3-font-color);
}
.productPage.theme-3 .product-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 10%;
}
.productPage.theme-3 .product-page .product-accessories {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  margin: 1.5rem 1.5rem 0;
}
.productPage.theme-3 .product-page .product-accessories .item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  border: 1px solid var(--theme-3-icon-color);
  padding: 14px;
  gap: 14px;
  text-align: center;
  border-radius: 20px;
  cursor: pointer;
}
.productPage.theme-3 .product-page .product-accessories .item p {
  margin: 0;
}
.productPage.theme-3 .product-page .product-accessories .item i {
  font-size: 40px;
  color: var(--theme-3-icon-color);
}
.productPage.theme-3 .support-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
}
.productPage.theme-3 .operation-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
}
.productPage.theme-3 .operation-page .instructions {
  border-radius: 12px;
  border: 2px solid var(--theme-3-icon-color);
}
.productPage.theme-3 .operation-page .instructions i {
  font-size: 45px;
  color: var(--theme-3-icon-color);
}
.productPage.theme-3 .footer-menu {
  background: var(--theme-3-theme-color);
}

/* ==========================================================================
   Theme 4
   ========================================================================== */

.productPage.theme-4 {
  background: var(--theme-4-background-color);
  font-family: var(--theme-4-font-family), sans-serif;
}
.productPage.theme-4 .font-family {
  font-family: var(--theme-4-font-family), sans-serif;
}
.productPage.theme-4 .font-color {
  color: var(--theme-4-font-color);
}
.productPage.theme-4 .description-font-color {
  color: var(--theme-4-description-font-color);
}
.productPage.theme-4 .icon-color {
  color: var(--theme-4-icon-color);
}
.productPage.theme-4 .main {
  position: relative;
  height: 100dvh;
}
.productPage.theme-4 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-4 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-4 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.productPage.theme-4 .details-modal {
  background: var(--theme-4-background-color);
}
.productPage.theme-4 .details-modal i {
  color: var(--theme-4-icon-color);
}
.productPage.theme-4 .accessory-modal {
  background: var(--theme-4-background-color);
}
.productPage.theme-4 .accessory-modal i {
  color: var(--theme-4-icon-color);
}
.productPage.theme-4 .main.show .product-page {
  filter: blur(1px);
}
.productPage.theme-4 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-4 .logo img {
  min-width: 60px;
  max-height: 60px;
  background: var(--theme-4-background-color);
}
.productPage.theme-4 .logo .hero-image {
  width: 100%;
}
.productPage.theme-4 .logo p {
  color: var(--theme-4-font-color);
}
.productPage.theme-4 .home-page {
  width: 100%;
  height: 100%;
  background: var(--theme-4-background-color);
  display: flex;
  flex-direction: column;
}
.productPage.theme-4 .home-page button {
  border: none;
  outline: none;
  background: var(--theme-4-theme-color);
  border-radius: 6px;
}
.productPage.theme-4 .home-page button i {
  min-width: 16px;
  min-height: 16px;
  line-height: 16px;
  text-align: center;
  font-size: 10px;
  color: var(--theme-4-icon-color);
}
.productPage.theme-4 .home-page .label {
  color: var(--theme-4-font-color);
}
.productPage.theme-4 .home-page .description {
  color: var(--theme-4-description-font-color);
}
.productPage.theme-4 .home-page .show-case {
  flex: 1;
  min-height: 0;
  display: flex;
  gap: 10px;
}
.productPage.theme-4 .home-page .show-case img {
  width: 240px;
  height: 100%;
  object-fit: cover;
  object-position: center 100%;
  border-radius: 15px;
  flex: 1;
}
.productPage.theme-4 .product-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 20px;
}
.productPage.theme-4 .product-page .product-details {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}
.productPage.theme-4 .product-page .product-details .item {
  display: flex;
  gap: 10px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: color-mix(in srgb, var(--theme-4-icon-color) 15%, transparent);
  color: var(--theme-4-font-color);
  padding: 24px 2px;
  border-radius: 50%;
  aspect-ratio: 1; 
  text-align: center;
  flex: 1;
}
.productPage.theme-4 .product-page .product-details .item i {
  font-size: 26px;
  color: var(--theme-4-icon-color);
}
.productPage.theme-4 .product-page .product-details .item span {
  color: var(--theme-4-font-color);
}
.productPage.theme-4 .product-page .product-item {
  border: 1px solid var(--theme-4-font-color);
  border-radius: 20px;
  min-width: 80px;
}
.productPage.theme-4 .product-page .product-item .icon {
  min-width: 45px;
  max-width: 45px;
  margin-left: 14px;
}
.productPage.theme-4 .product-page .product-item i {
  font-size: 40px;
  color: var(--theme-4-icon-color);
}
.productPage.theme-4 .product-page .product-item span {
  font-size: 14px;
  color: var(--theme-4-description-font-color);
}
.productPage.theme-4 .support-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 20px;
  object-position: center 10%;
}
.productPage.theme-4 .operation-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 10%;
  border-radius: 20px;
}
.productPage.theme-4 .operation-page .instructions {
  border-radius: 12px;
  border: 1px solid var(--theme-4-icon-color);
}
.productPage.theme-4 .operation-page .instructions i {
  font-size: 45px;
  color: var(--theme-4-icon-color);
}
.productPage.theme-4 .footer-menu {
  background: var(--theme-4-theme-color);
}

/* ==========================================================================
   Theme 5
   ========================================================================== */

.productPage.theme-5 {
  background: var(--theme-5-background-color);
  font-family: var(--theme-5-font-family), sans-serif;
}
.productPage.theme-5 .font-family {
  font-family: var(--theme-5-font-family), sans-serif;
}
.productPage.theme-5 .font-color {
  color: var(--theme-5-font-color);
}
.productPage.theme-5 .description-font-color {
  color: var(--theme-5-description-font-color);
}
.productPage.theme-5 .icon-color {
  color: var(--theme-5-icon-color);
}
.productPage.theme-5 .main {
  position: relative;
  height: 100dvh;
}
.productPage.theme-5 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-5 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-5 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.productPage.theme-5 .details-modal {
  background: var(--theme-5-background-color);
}
.productPage.theme-5 .details-modal i {
  color: var(--theme-5-icon-color);
}
.productPage.theme-5 .accessory-modal {
  background: var(--theme-5-background-color);
}
.productPage.theme-5 .accessory-modal i {
  color: var(--theme-5-icon-color);
}
.productPage.theme-5 .main.show .product-page {
  filter: blur(1px);
}
.productPage.theme-5 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-5 .logo {
  min-width: 60px;
  max-height: 60px;
}
.productPage.theme-5 .home-page {
  width: 100%;
  height: 100%;
  background: var(--theme-5-background-color);
}

/* Theme 5 home: shrink carousel on small screens so everything fits */
@media (max-height: 740px), (max-width: 380px) {
  .productPage.theme-5 .carousel-wrapper {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
  .productPage.theme-5 .carousel-wrapper .carousel {
    height: 290px !important;
  }
  .productPage.theme-5 .carousel-wrapper .carousel-center {
    width: 220px;
    height: 290px;
  }
  .productPage.theme-5 .carousel-wrapper .carousel-side,
  .productPage.theme-5 .carousel-wrapper .carousel-side-left,
  .productPage.theme-5 .carousel-wrapper .carousel-side-right {
    width: 165px;
    height: 225px;
  }
}
.productPage.theme-5 .home-page button {
  border: none;
  outline: none;
  background: var(--theme-5-theme-color);
  border-radius: 6px;
}
.productPage.theme-5 .home-page button i {
  min-width: 16px;
  min-height: 16px;
  line-height: 16px;
  text-align: center;
  font-size: 10px;
  color: var(--theme-5-icon-color);
}
.productPage.theme-5 .product-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 20px;
}
.productPage.theme-5 .product-page .product-details {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
}
.productPage.theme-5 .product-page .product-details::-webkit-scrollbar {
  display: none;
}
.productPage.theme-5 .product-page .product-details .item {
  border: 1px solid var(--theme-5-icon-color);
  background: color-mix(in srgb, var(--theme-5-icon-color) 14%, transparent);
  padding: 14px 2px;
  border-radius: 6px;
  color: var(--theme-5-font-color);
  flex-shrink: 0;
  min-width: 207px;
}
.productPage.theme-5 .product-page .product-details .item i {
  font-size: 22px;
  color: var(--theme-5-icon-color);
}
.productPage.theme-5 .product-page .product-accessories {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 1.5rem;
}
.productPage.theme-5 .product-page .product-accessories .product-item {
  border-radius: 15px;
  min-width: 80px;
  background-color: #fff;
}
.productPage.theme-5 .product-page .product-accessories .product-item i {
  display: block;
  font-size: 28px;
  min-width: 45px;
  min-height: 45px;
  max-width: 45px;
  max-height: 45px;
  line-height: 45px;
  text-align: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--theme-5-icon-color) 20%, transparent);
  color: var(--theme-5-icon-color);
}
.productPage.theme-5 .product-page .product-accessories .product-item .title {
  font-size: 16px;
  color: var(--theme-5-font-color);
}
.productPage.theme-5 .support-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 20px;
  object-position: center 10%;
}
.productPage.theme-5 .operation-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 10%;
  border-radius: 20px;
}
.productPage.theme-5 .operation-page .instructions {
  border-radius: 12px;
  background-color: #fff;
  border: 1px solid var(--theme-5-icon-color);
}
.productPage.theme-5 .operation-page .instructions i {
  font-size: 45px;
  color: var(--theme-5-icon-color);
}
.productPage.theme-5 .footer-menu {
  background: var(--theme-5-theme-color);
}

/* ==========================================================================
   Theme 6
   ========================================================================== */

.productPage.theme-6 {
  background: var(--theme-6-background-color);
  font-family: var(--theme-6-font-family), sans-serif;
}
.productPage.theme-6 .font-family {
  font-family: var(--theme-6-font-family), sans-serif;
}
.productPage.theme-6 .font-color {
  color: var(--theme-6-font-color);
}
.productPage.theme-6 .description-font-color {
  color: var(--theme-6-description-font-color);
}
.productPage.theme-6 .icon-color {
  color: var(--theme-6-icon-color);
}
.productPage.theme-6 .main {
  position: relative;
  height: 100dvh;
}
.productPage.theme-6 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-6 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-6 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.productPage.theme-6 .details-modal i,
.productPage.theme-6 .accessory-modal i {
  color: var(--theme-6-icon-color);
}
/* Theme 6: Safe/Sustainability modal – no icon, title + description only */
.productPage.theme-6 .details-modal {
  background: var(--theme-6-background-color);
}
.productPage.theme-6 .accessory-modal {
  background: var(--theme-6-background-color);
}
.productPage.theme-6 .accessory-modal .modal-overflow i {
  display: none;
}
.productPage.theme-6 .accessory-modal .modal-overflow {
  align-items: flex-start !important;
  text-align: left !important;
  padding: 2rem !important;
}
.productPage.theme-6 .accessory-modal .modal-overflow > p {
  font-size: 20px;
  font-weight: 600;
  color: var(--theme-6-font-color);
  margin-bottom: 12px;
}
.productPage.theme-6 .accessory-modal .modal-overflow .product-description,
.productPage.theme-6 .accessory-modal .modal-overflow .product-description p {
  font-size: 16px;
  font-weight: 400;
  color: var(--theme-6-description-font-color);
  line-height: 1.6;
}
.productPage.theme-6 .footer-menu {
  background: var(--theme-6-theme-color);
}
/* THEME 6 - HOME (same naming as gs1-home: home-page, main-image, logo, learn-section, cta-btn) */
.productPage.theme-6 .home-page {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  background: var(--theme-6-background-color);
}
.productPage.theme-6 .home-page .main-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.productPage.theme-6 .home-page .logo {
  position: absolute;
  top: 40px;
  left: 50%;
  width: 60px;
  height: 60px;
  transform: translateX(-50%);
}
.productPage.theme-6 .home-page .learn-section {
  bottom: 20px;
  left: 50%;
  width: 90%;
  padding: 14px 10px;
  transform: translateX(-50%);
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  border-radius: 20px;
}
.productPage.theme-6 .home-page .learn-section .cta-btn {
  width: 65%;
  margin-top: 10px;
  padding: 9px 18px;
  border-radius: 20px;
  border: 1px solid var(--theme-6-font-color);
  color: var(--theme-6-font-color);
  outline: none;
  background: transparent;
  gap: 0.5rem;
}
.productPage.theme-6 .home-page .learn-section .cta-label {
  font-size: 14px;
  font-weight: 500;
}
.productPage.theme-6 .home-page .learn-section .cta-btn i {
  font-size: 16px;
  color: var(--theme-6-icon-color);
  font-weight: 700;
}

/* THEME 6 - DETAILS / SUPPORT / OPERATIONS (same naming as gs1-home: product-page, support-page, operation-page + generic names) */
.productPage.theme-6 .product-page .title,
.productPage.theme-6 .operation-page .title,
.productPage.theme-6 .support-page .title {
  font-size: 16px;
  font-weight: 500;
  color: var(--theme-6-font-color);
}
.productPage.theme-6 .product-page .subtitle {
  font-size: 14px;
  color: var(--theme-6-description-font-color);
}
.productPage.theme-6 .hero-image {
  width: 100%;
  border-radius: 24px;
  overflow: hidden;
  background: var(--theme-6-background-color);
}
.productPage.theme-6 .hero-image img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  object-position: center;
}
.productPage.theme-6 .product-page .gallery {
  display: flex;
  gap: 12px;
}
.productPage.theme-6 .product-page .gallery .gallery-item {
  flex: 1;
  border-radius: 22px;
  overflow: hidden;
  background: var(--theme-6-background-color);
}
.productPage.theme-6 .product-page .gallery .gallery-item img {
  width: 100%;
  height: 290px;
  object-fit: cover;
  object-position: center;
}
.productPage.theme-6 .product-page .product-item {
  border: 1px solid var(--theme-6-icon-color);
  padding: 12px 20px;
  border-radius: 30px;
  min-width: 80px;
}
.productPage.theme-6 .product-page .product-item i {
  font-size: 18px;
  color: var(--theme-6-icon-color);
}
.productPage.theme-6 .product-page .product-item span {
  font-size: 14px;
}
.productPage.theme-6 .product-page .product-accessories {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
}
.productPage.theme-6 .product-page .product-accessories .item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  border: 1px solid var(--theme-6-icon-color);
  padding: 14px;
  gap: 14px;
  text-align: center;
  border-radius: 20px;
  cursor: pointer;
}
.productPage.theme-6 .product-page .product-accessories .item p {
  margin: 0;
}
.productPage.theme-6 .product-page .product-accessories .item i {
  font-size: 40px;
  color: var(--theme-6-icon-color);
}
.productPage.theme-6 .operation-page .instructions {
  border-radius: 12px;
  /* background: var(--theme-6-theme-color); */
  border: 1px solid var(--theme-6-icon-color);
  color: var(--theme-6-font-color);
}
.productPage.theme-6 .operation-page .instructions i {
  font-size: 45px;
  color: var(--theme-6-icon-color);
}
.productPage.theme-6 .support-page {
  padding-bottom: 24px;
}
.productPage.theme-6 .support-page .support-hero-section {
  padding: 0;
  width: 100%;
}
.productPage.theme-6 .support-page .support-hero-section .hero-image {
  border-radius: 0 0 24px 24px;
}
.productPage.theme-6 .support-page .video-wrapper {
  border-radius: 24px;
  overflow: hidden;
}
.productPage.theme-6 .support-page .section-title p {
  font-size: 15px;
  font-weight: 500;
  color: var(--theme-6-font-color);
}
.productPage.theme-6 .support-page .video-card {
  border-radius: 24px;
  overflow: hidden;
}
.productPage.theme-6 .support-page .support-card .image-wrapper,
.productPage.theme-6 .operation-page .support-card .image-wrapper {
  width: 166px;
  height: 166px;
  flex-shrink: 0;
  border-radius: 16px;
  overflow: hidden;
}
.productPage.theme-6 .support-page .support-card .image-wrapper img,
.productPage.theme-6 .operation-page .support-card .image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.productPage.theme-6 .support-page .support-card .support-card-title,
.productPage.theme-6 .support-page .support-engagement-block .support-card-title {
  font-size: 15px;
  font-weight: 500;
  color: var(--theme-6-font-color);
}
.productPage.theme-6 .support-page .support-engagement-block {
  text-align: left;
}
.productPage.theme-6 .btn-copy-link {
  border-radius: 999px;
  border-width: 1px;
}
.productPage.theme-6 .btn-learn-more {
  border-radius: 999px;
  background: var(--theme-6-theme-color);
}
.productPage.theme-6 .primary-cta {
  margin-top: 24px;
  border-radius: 24px;
  padding: 14px 20px;
  font-weight: 600;
}
/* THEME 7 - Aligned with GS1 Home product page Theme 7 (glassmorphism, gradient) - vars set by main.ejs */
.productPage.theme-7 {
  background: var(--theme-7-background-color);
  font-family: var(--theme-7-font-family);
}
.productPage.theme-7 .font-family {
  font-family: var(--theme-7-font-family);
}
.productPage.theme-7 .font-color {
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .description-font-color {
  color: var(--theme-7-description-font-color);
}
.productPage.theme-7 .icon-color {
  color: var(--theme-7-icon-color);
}
.productPage.theme-7 .main {
  position: relative;
  height: 100dvh;
}
.productPage.theme-7 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-7 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-7 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
/* gs1-home 7.scss: modals use background + font color only (no border) */
.productPage.theme-7 .details-modal {
  background: var(--theme-7-background-color);
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .details-modal i {
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .accessory-modal {
  background: var(--theme-7-background-color);
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .accessory-modal i {
  color: var(--theme-7-font-color) !important;
}
.productPage.theme-7 .accessory-modal i.qr-close {
  color: var(--theme-7-font-color) !important;
}
.productPage.theme-7 .accessory-modal .modal-overflow i {
  display: none;
}
.productPage.theme-7 .accessory-modal .modal-overflow {
  padding: 3rem !important;
}

.productPage.theme-7 .main.show .product-page,
.productPage.theme-7 .main.show .support-page {
  filter: blur(1px);
}
/* THEME 7 - HOME */
.productPage.theme-7 .home-page {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  background: var(--theme-7-background-color);
}
.productPage.theme-7 .home-page .main-image {
  object-fit: cover;
  border-radius: 20px;
  width: 100%;
  height: 76%;
}
.productPage.theme-7 .home-page .logo {
  position: absolute;
  top: 40px;
  left: 50%;
  width: 60px;
  height: 60px;
  transform: translateX(-50%);
}
.productPage.theme-7 .home-page .learn-section {
  bottom: 20px;
  left: 50%;
  width: 90%;
  padding: 14px 8px;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
  border-radius: 20px;
}
.productPage.theme-7 .home-page .learn-section .cta-btn {
  width: 36px;
  height: 36px;
  line-height: 36px;
  margin: auto;
  cursor: pointer;
  color: var(--theme-7-icon-color);
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4),
    0 0 0px rgba(255, 255, 255, 0.35),
    inset 0 0px 0 rgba(255, 255, 255, 0.5);
  transition: background 0.2s, box-shadow 0.2s;
  border-radius: 50%;
}
.productPage.theme-7 .home-page .learn-section .cta-label {
  text-transform: uppercase;
}
/* THEME 7 - PRODUCT PAGE */
.productPage.theme-7 .product-page .mirror {
  position: relative;
  height: 140px;
  margin: 32px 20px 36px 20px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.35);
  /* gs1-home 7.scss: no border; ring via box-shadow only */
  border: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4),
    0 0 0px rgba(255, 255, 255, 0.35),
    inset 0 0px 0 rgba(255, 255, 255, 0.5);
}
.productPage.theme-7 .product-page .mirror .hero-image {
  position: absolute;
  top: 53%;
  left: 50%;
  transform: translate(-50%, -50%);
   /* width: 79%; commented out for now as it was causing the image to be cut off */
  height: 200px;
  object-position: center 42%;
  border-radius: 16px;
  object-fit: cover;
}
.productPage.theme-7 .product-page .product-details {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
.productPage.theme-7 .product-page .product-details .item {
  display: flex;
  gap: 2px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--theme-7-icon-color);
  background: color-mix(in srgb, var(--theme-7-font-color) 10%, transparent);
  padding: 14px 2px;
  border-radius: 16px;
  min-width: 65px;
  text-align: center;
  flex: 1;
}
.productPage.theme-7 .product-page .product-details .item i {
  font-size: 24px;
  color: var(--theme-7-icon-color);
}
.productPage.theme-7 .product-page .product-details .item span {
  font-size: 14px;
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .product-page .product-details-v2 .item {
  cursor: pointer;
  border: 1px solid var(--theme-7-icon-color);
  background: color-mix(in srgb, var(--theme-7-font-color) 10%, transparent);
  padding: 8px 12px;
  border-radius: 20px;
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .product-page .product-accessories {
  display: grid;
  gap: 10px;
  margin-top: 1rem;
  grid-template-columns: 1fr 1fr;
}
.productPage.theme-7 .product-page .product-accessories .item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  border: 1px solid var(--theme-7-icon-color);
  background: color-mix(in srgb, var(--theme-7-font-color) 10%, transparent);
  padding: 36px 0;
  text-align: center;
  border-radius: 20px;
  cursor: pointer;
}
.productPage.theme-7 .product-page .product-accessories .item i {
  font-size: 40px;
  color: var(--theme-7-icon-color);
}
.productPage.theme-7 .product-page .learn-more {
  background: rgba(255, 255, 255, 0.2);
  border: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4),
    0 0 0px rgba(255, 255, 255, 0.35),
    inset 0 0px 0 rgba(255, 255, 255, 0.5);
  width: 100% !important;
  text-align: center;
  border-radius: 20px;
  text-decoration: none;
  display: block;
  padding: 8px 16px;
  color: var(--theme-7-description-font-color);
}
.productPage.theme-7 .btn-copy-link {
  border-radius: 10px;
  border-width: 1px;
}
.productPage.theme-7 .btn-learn-more {
  border-radius: 10px;
  background: var(--theme-7-theme-color);
}
.productPage.theme-7 .link-component-wrapper .link-input {
  border-color: #d2d2d2;
}
/* THEME 7 - SUPPORT PAGE */
.productPage.theme-7 .support-page .bg {
  background: var(--theme-7-background-color);
}
.productPage.theme-7 .support-page .hero-image {
  width: 100%;
  height: 166px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 15px;
}
.productPage.theme-7 .support-page .learn-more {
  background: rgba(255, 255, 255, 0.2);
  border: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4),
    0 0 0px rgba(255, 255, 255, 0.35),
    inset 0 0px 0 rgba(255, 255, 255, 0.5);
  width: 100% !important;
  text-align: center;
  border-radius: 20px;
  text-decoration: none;
}
.productPage.theme-7 .support-page .reviews-title {
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .support-page .review-author {
  color: #fff;
}
/* gs1-home 7.scss: no border on .video-wrapper */

/* THEME 7 - OPERATIONS PAGE */
.productPage.theme-7 .operation-page .bg {
  background: var(--theme-7-background-color);
}
.productPage.theme-7 .operation-page .hero-image {
  width: 100%;
  height: 194px;
  object-fit: cover;
  object-position: center 42%;
}
.productPage.theme-7 .operation-page .learn-more {
  background: rgba(255, 255, 255, 0.2);
  border: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4),
    0 0 0px rgba(255, 255, 255, 0.35),
    inset 0 0px 0 rgba(255, 255, 255, 0.5);
  width: 100% !important;
  text-align: center;
  border-radius: 20px;
  text-decoration: none;
  display: block;
  padding: 8px 16px;
  color: var(--theme-7-description-font-color);
}
.productPage.theme-7 .operation-page .instructions {
  background: rgba(255, 255, 255, 0.2);
  border: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4),
    0 0 0px rgba(255, 255, 255, 0.35),
    inset 0 0px 0 rgba(255, 255, 255, 0.5);
  border-radius: 20px;
}
.productPage.theme-7 .operation-page .instructions i {
  font-size: 45px;
  color: var(--theme-7-icon-color);
}
.productPage.theme-7 .operation-page .handling-storage-image {
  width: 100%;
  height: 166px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 15px;
}
.productPage.theme-7 .review-title {
  color: var(--theme-7-font-color);
}
.productPage.theme-7 .review-item {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.2) !important;
  border: none;
}
.productPage.theme-7 .product-description,
.productPage.theme-7 .product-description p {
  color: var(--theme-7-description-font-color);
}
.productPage.theme-7 .footer-menu {
  background: var(--theme-7-theme-color);
}

/* THEME 8 - Aligned with GS1 Home Theme 8 (diagonal gradient, theme-color pills, white CTA) - vars set by main.ejs */
.productPage.theme-8 {
  font-family: var(--theme-8-font-family);
}
.productPage.theme-8 .font-family {
  font-family: var(--theme-8-font-family);
}
.productPage.theme-8 .font-color {
  color: var(--theme-8-font-color);
}
.productPage.theme-8 .description-font-color {
  color: var(--theme-8-description-font-color);
}
.productPage.theme-8 .icon-color {
  color: var(--theme-8-icon-color);
}
.productPage.theme-8 .main {
  position: relative;
  height: 100dvh;
  background: var(--theme-8-background-color);
}
.productPage.theme-8 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-8 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-8 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.productPage.theme-8 .main.show .product-page,
.productPage.theme-8 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-8 .details-modal {
  background: var(--theme-8-background-color);
}
.productPage.theme-8 .details-modal i {
  color: var(--theme-8-font-color);
}
.productPage.theme-8 .accessory-modal {
  background: var(--theme-8-background-color);
}
.productPage.theme-8 .accessory-modal i {
  color: var(--theme-8-font-color);
}
/* THEME 8 - HOME */
.productPage.theme-8 .home-page {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
}
.productPage.theme-8 .home-page .main-image {
  padding: 50px 0;
  object-fit: cover;
  border-radius: 20px;
  width: 100%;
  height: 70%;
}
.productPage.theme-8 .home-page .title {
  position: absolute;
  top: 45%;
  left: 70%;
  transform: translateX(-50%);
  width: 52%;
  font-size: 28px;
  font-weight: 600;
}
.productPage.theme-8 .home-page .logo {
  position: absolute;
  top: 50%;
  left: 20%;
  width: 70px;
  height: 70px;
}
.productPage.theme-8 .home-page .learn-section {
  bottom: 20px;
  left: 50%;
  width: 90%;
  border-radius: 10px;
  transform: translateX(-50%);
  background: color-mix(in srgb, var(--theme-8-font-color) 10%, transparent); /* color mix not working for gradient */
  gap: 10px;
}
.productPage.theme-8 .home-page .learn-section .cta-btn {
  max-width: 150px;
  cursor: pointer;
  background: #ffffff;
  color: var(--theme-8-font-color);
  border: none;
  outline: none;
  border-radius: 10px;
  text-transform: uppercase;
}
/* THEME 8 - PRODUCT PAGE */
.productPage.theme-8 .product-page .hero-image {
  width: 100%;
  height: 272px;
  object-fit: cover;
  object-position: center 59%;
}
.productPage.theme-8 .product-page .hero-content {
  border-radius: 16px;
}
.productPage.theme-8 .product-page .hero-content .learn-more {
  color: var(--theme-8-font-color);
  border: 1px solid var(--theme-8-font-color);
  border-radius: 16px;
  padding: 7px 20px;
  text-align: center;
  text-decoration: none;
  /* font-size: 12px; */
  text-transform: uppercase;
}
.productPage.theme-8 .product-page .product-details {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
.productPage.theme-8 .product-page .product-details .item {
  display: flex;
  gap: 2px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--theme-8-icon-color);
  padding: 14px 2px;
  border-radius: 12px;
  min-width: 65px;
  text-align: center;
  flex: 1;
  /* aspect-ratio: 1; */
}
.productPage.theme-8 .product-page .product-details .item i {
  font-size: 24px;
  color: var(--theme-8-icon-color);
}
.productPage.theme-8 .product-page .product-details .item span {
  font-size: 14px;
  color: var(--theme-8-font-color);
}
.productPage.theme-8 .product-page .product-accessories {
  display: grid;
  gap: 16px;
  margin-top: 1rem;
  grid-template-columns: 1fr 1fr;
}
.productPage.theme-8 .product-page .product-accessories .item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  border: 1px solid var(--theme-8-icon-color);
  padding: 22px 16px;
  text-align: center;
  border-radius: 10px;
  cursor: pointer;
  color: var(--theme-8-font-color);
}
.productPage.theme-8 .product-page .product-accessories .item i {
  font-size: 26px;
  color: var(--theme-8-icon-color);
}
/* THEME 8 - SUPPORT PAGE */
.productPage.theme-8 .support-page {
  position: relative;
}
.productPage.theme-8 .support-page .blur-background {
  filter: blur(3px);
  width: 100%;
  margin: 0;
  overflow: hidden;
  height: 200px;
}
.productPage.theme-8 .support-page .video-wrapper {
  margin: 0 !important;
  border-radius: 0 !important;
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  overflow: hidden;
}
.productPage.theme-8 .support-page .video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 20px !important;
}
/* Main content overlays blur (starts at 10% from top of blur) and flows so page scrolls */
.productPage.theme-8 .support-page .main-content {
  margin-top: -130px;
  position: relative;
  z-index: 1;
  padding-bottom: 1rem;
}
.productPage.theme-8 .support-page .learn-more {
  color: var(--theme-8-font-color);
  border: 1px solid var(--theme-8-font-color);
  border-radius: 16px;
  padding: 5px 20px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}
.productPage.theme-8 .support-page .main-content .video-title {
  color: #ffffff !important;
}
.productPage.theme-8 .support-page .hero-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 15px;
}
.productPage.theme-8 .support-page .reviews-title {
  color: var(--theme-8-font-color);
}
.productPage.theme-8 .review-item {
  border: none !important;
  background: color-mix(in srgb, var(--theme-8-font-color) 10%, transparent) !important;
}
.productPage.theme-8 .review-item p {
  color: var(--theme-8-description-font-color);
}
.productPage.theme-8 .review-author {
  color: var(--theme-8-font-color) !important;
}
/* THEME 8 - OPERATIONS PAGE */
.productPage.theme-8 .operation-page .operations-content {
  background-color: #fff;
  border-radius: 20px 20px 0 0;
}
.productPage.theme-8 .operation-page .hero-image {
  width: 100%;
  height: 128px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 0 0 20px 20px;
}
.productPage.theme-8 .operation-page .learn-more {
  color: var(--theme-8-font-color);
  border: 1px solid var(--theme-8-font-color);
  border-radius: 16px;
  padding: 5px 20px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}
.productPage.theme-8 .operation-page .instructions {
  border-radius: 12px;
  background: color-mix(in srgb, var(--theme-8-font-color) 10%, transparent);
}
.productPage.theme-8 .operation-page .instructions i {
  font-size: 45px;
  scale: 1.2;
  color: var(--theme-8-icon-color);
}
.productPage.theme-8 .link-component .url-input {
  color: var(--theme-8-font-color);
}
.productPage.theme-8 .btn-copy-link {
  border-radius: 999px;
  border-width: 1px;
  /* background: transparent; */
}
.productPage.theme-8 .btn-learn-more {
  border-radius: 999px;
  background: var(--theme-8-theme-color);
}
/* Theme 8: Safe/Sustainability modal – no icon, title + description only */
.productPage.theme-8 .accessory-modal .modal-overflow i {
  display: none;
}
.productPage.theme-8 .accessory-modal .modal-overflow {
  align-items: flex-start !important;
  text-align: left !important;
  padding: 2rem !important;
}
.productPage.theme-8 .accessory-modal .modal-overflow > p {
  font-size: 20px;
  font-weight: 600;
  color: var(--theme-8-font-color);
  margin-bottom: 12px;
}
.productPage.theme-8 .accessory-modal .modal-overflow .product-description,
.productPage.theme-8 .accessory-modal .modal-overflow .product-description p {
  font-size: 16px;
  font-weight: 400;
  color: var(--theme-8-description-font-color);
  line-height: 1.6;
}
.productPage.theme-8 .footer-menu {
  background: var(--theme-8-theme-color);
}
.productPage.theme-8 .product-description,
.productPage.theme-8 .product-description p {
  color: var(--theme-8-description-font-color);
}

/* THEME 9 - Aligned with GS1 Home Theme 9 (white bg, burgundy theme, learn-section bottom-right) */
.productPage.theme-9 {
  font-family: var(--theme-9-font-family);
}
.productPage.theme-9 .font-family {
  font-family: var(--theme-9-font-family);
}
.productPage.theme-9 .font-color {
  color: var(--theme-9-font-color);
}
.productPage.theme-9 .description-font-color {
  color: var(--theme-9-description-font-color);
}
.productPage.theme-9 .icon-color {
  color: var(--theme-9-icon-color);
}
.productPage.theme-9 .main {
  position: relative;
  height: 100dvh;
  background: var(--theme-9-background-color);
}
.productPage.theme-9 .main.fixed-height {
  height: calc(100dvh - 70px);
  overflow-y: auto;
}
.productPage.theme-9 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-9 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.productPage.theme-9 .main.show .product-page,
.productPage.theme-9 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-9 .details-modal {
  background: var(--theme-9-background-color);
}
.productPage.theme-9 .details-modal i {
  color: var(--theme-9-font-color);
}
.productPage.theme-9 .accessory-modal {
  background: var(--theme-9-background-color);
}
.productPage.theme-9 .accessory-modal i {
  color: var(--theme-9-font-color);
}

/* Theme 9 accessory modal – reference design: white modal, header icon+title, subheadings & lists */
.productPage.theme-9 .accessory-modal.accessory-modal--theme-9 {
  background: var(--theme-9-background-color);
  border-radius: 20px 20px 0 0;
  padding: 0;
  overflow-y: auto;
  max-height: 90dvh;
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__close {
  top: 24px;
  right: 24px;
  font-size: 16px;
  color: var(--theme-9-icon-color) !important;
  z-index: 10;
  font-weight: 600;
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__inner {
  padding: 46px 30px 28px;
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  font-size: 40px;
  background: color-mix(in srgb, var(--theme-9-icon-color) 20%, transparent) !important;
  color: var(--theme-9-icon-color) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  position: static;
  border-radius: 10px;
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__title {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
  flex: 1;
  color: var(--theme-9-font-color);
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__body {
  max-height: none;
  overflow-y: visible;
  margin-bottom: 0;
  padding: 0;
  text-align: left;
  align-items: stretch;
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__description-wrapper {
  margin: 0 0 16px;
}
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__description,
.productPage.theme-9 .accessory-modal--theme-9 .accessory-modal__description p {
  font-size: 15px;
  font-weight: 400;
  color: var(--theme-9-description-font-color);
  line-height: 1.6;
  margin: 0 0 4px;
}
/* THEME 9 - HOME */
.productPage.theme-9 .home-page {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  background: var(--theme-9-background-color);
}
.productPage.theme-9 .home-page .main-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.productPage.theme-9 .home-page .logo {
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 60px;
}
.productPage.theme-9 .home-page .learn-section {
  bottom: 0;
  right: 0;
  width: 90%;
  transform: translateY(-20%);
  background: #ffffff;
  border-radius: 20px 0 0 20px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
}
.productPage.theme-9 .home-page .learn-section .cta-btn {
  max-width: 200px;
  cursor: pointer;
  background: var(--theme-9-theme-color);
  color: #ffffff;
  outline: none;
  border: none;
  border-radius: 40px;
  padding: 12px 18px 12px 26px;
}
.productPage.theme-9 .home-page .learn-section .cta-btn span {
  font-size: 16px;
}
.productPage.theme-9 .home-page .learn-section i.icon-color {
  width: 22px;
  height: 22px;
  line-height: 22px;
  color: var(--theme-9-icon-color);
  font-weight: 700;
}
/* THEME 9 - PRODUCT PAGE */
/* .productPage.theme-9 .product-page .bg {
  background: var(--theme-9-background-color);
} */
.productPage.theme-9 .product-page .hero-image {
  width: 100%;
  height: 240px;
  object-fit: cover;
  object-position: center 59%;
  border-radius: 0 0 112px 0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
}
.productPage.theme-9 .product-page .product-details {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
.productPage.theme-9 .product-page .product-details .item {
  display: flex;
  gap: 2px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--theme-9-icon-color);
  background: color-mix(in srgb, var(--theme-9-font-color) 10%, transparent);
  color: var(--theme-9-font-color);
  padding: 14px 2px;
  border-radius: 12px;
  min-width: 65px;
  text-align: center;
  flex: 1;
  
}
.productPage.theme-9 .product-page .product-details .item i {
  font-size: 22px;
  color: var(--theme-9-icon-color);
}
.productPage.theme-9 .product-page .product-details .item span {
  font-size: 12px;
}
.productPage.theme-9 .product-page .product-accessories {
  display: grid;
  gap: 10px;
  margin-top: 1rem;
}
.productPage.theme-9 .product-page .product-accessories .item {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 10px 30px;
  border-radius: 44px;
  cursor: pointer;
  border: 1px solid color-mix(in srgb, var(--theme-9-icon-color) 30%, transparent);
}
.productPage.theme-9 .product-page .product-accessories .item i {
  font-size: 30px;
  scale: 1.4;
  color: var(--theme-9-icon-color);
}
/* THEME 9 - SUPPORT PAGE */
/* .productPage.theme-9 .support-page .bg {
  background: var(--theme-9-background-color);
} */
.productPage.theme-9 .support-page .hero-image {
  width: 100%;
  height: 240px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 0 0 112px 0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
}
/* THEME 9 - OPERATIONS PAGE */
/* .productPage.theme-9 .operation-page .bg {
  background: var(--theme-9-background-color);
} */
.productPage.theme-9 .operation-page .hero-image {
  width: 100%;
  height: 240px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 0 0 112px 0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
}
.productPage.theme-9 .operation-page .instructions {
  border-radius: 12px;
  border: 1px solid var(--theme-9-icon-color);
}
.productPage.theme-9 .operation-page .instructions i {
  font-size: 45px;
  scale: 1.2;
  color: var(--theme-9-icon-color);
}
/* Theme 9 – Link section (card, dark title, URL row with copy icon, Learn More button) */
.productPage.theme-9 .link-component-wrapper {
  background: color-mix(in srgb, var(--theme-9-icon-color) 5%, transparent);
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
.productPage.theme-9 .link-component-wrapper .link-input-wrapper {
  position: relative;
  margin-bottom: 12px;
}
.productPage.theme-9 .link-component-wrapper .link-input-wrapper i {
  color: var(--theme-9-icon-color);
}
.productPage.theme-9 .link-component-wrapper .link-input {
  width: 100%;
  padding: 7px 12px 7px 40px;
  border: 1px solid #D2D2D2;
  border-radius: 999px;
  background-color: transparent;
  color: var(--theme-9-font-color);
  font-size: 14px;
  outline: none;
  cursor: text;
}
.productPage.theme-9 .link-component-wrapper .link-icon {
  left: 14px;
}
.productPage.theme-9 .link-component-wrapper .link-copy-icon-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  background: transparent;
  color: #6c757d;;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.productPage.theme-9 .link-component-wrapper .link-copy-icon-btn:hover {
  background: color-mix(in srgb, var(--theme-9-font-color) 10%, transparent);
}
.productPage.theme-9 .link-component-wrapper .link-copy-icon-btn i {
  font-size: 18px;
}
.productPage.theme-9 .link-component-wrapper .link-buttons-wrapper {
  display: flex;
  justify-content: center;
  gap: 0;
}
.productPage.theme-9 .link-component-wrapper .btn-learn-more {
  width: 100%;
  max-width: 100%;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
  border: 1px solid var(--theme-9-font-color);
  background: color-mix(in srgb, var(--theme-9-icon-color) 15%, transparent);
  color: var(--theme-9-font-color);
  outline: none;
}
.productPage.theme-9 .footer-menu {
  background: var(--theme-9-theme-color);
}
.productPage.theme-9 .product-description,
.productPage.theme-9 .product-description p {
  color: var(--theme-9-description-font-color);
}

/* THEME 10 - Aligned with GS1 Home Theme 10 (dark gradient, hero right-aligned, Care+Manufacturing rows) */
.productPage.theme-10 {
  font-family: var(--theme-10-font-family);
}
.productPage.theme-10 .font-family {
  font-family: var(--theme-10-font-family);
}
.productPage.theme-10 .font-color {
  color: var(--theme-10-font-color);
}
.productPage.theme-10 .description-font-color {
  color: var(--theme-10-description-font-color);
}
.productPage.theme-10 .icon-color {
  color: var(--theme-10-icon-color);
}
.productPage.theme-10 .main {
  position: relative;
  height: 100dvh;
  background: var(--theme-10-background-color);
}
.productPage.theme-10 .main.fixed-height {
  height: calc(100dvh - 10px);
  overflow-y: auto;
  z-index: 0;
}
.productPage.theme-10 .main.fixed-height::-webkit-scrollbar {
  display: none;
}
.productPage.theme-10 .main.show::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.productPage.theme-10 .main.show .product-page,
.productPage.theme-10 .main.show .support-page {
  filter: blur(1px);
}
.productPage.theme-10 .details-modal {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
  linear-gradient(122.16deg, rgba(217, 217, 217, 0.4) 7.67%, rgba(115, 115, 115, 0.1) 83.61%);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  color: var(--theme-10-font-color);
}
.productPage.theme-10 .details-modal i {
  color: var(--theme-10-icon-color) !important;
}
.productPage.theme-10 .details-modal i:not(.qr-close) {
  color: var(--theme-10-icon-color);
}
/* THEME 10 - HOME */
.productPage.theme-10 .home-page {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  background: var(--theme-10-background-color);
}
.productPage.theme-10 .home-page .main-image {
  object-fit: cover;
  border-radius: 20px;
  width: 100%;
  height: 100%;
}
.productPage.theme-10 .home-page .logo {
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 70px;
  height: 70px;
}
.productPage.theme-10 .home-page .learn-section {
  position: relative;
  bottom: 20px;
  left: 0;
  width: 80%;
  transform: translateY(-20%);
  border-radius: 0 50px 20px 0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
  background: var(--theme-10-background-color);
  /* gs1-home 10.scss: learn-section border */
  border: 1px solid #a7ecf380;
  border-left: none;
}
.productPage.theme-10 .home-page .learn-section .cta-btn {
  position: absolute;
  bottom: -20px;
  right: -20px;
  width: 75px;
  height: 75px;
  cursor: pointer;
  outline: none;
  border-radius: 50px;
  background: #0b1c26;
  /* gs1-home 10.scss: CTA uses white border */
  border: 1px solid #ffffff;
}
.productPage.theme-10 .home-page .learn-section i.icon {
  font-size: 15px;
  width: 15px;
  height: 15px;
  line-height: 15px;
  font-weight: 700;
  color: var(--theme-10-icon-color);
  background: var(--theme-10-theme-color);
  background: transparent;
  /* -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; */
  /* background-clip: text; */
}
/* THEME 10 - PRODUCT PAGE */
.productPage.theme-10 .product-page {
  background: var(--theme-10-background-color);
  padding-bottom: 5rem;
}
.productPage.theme-10 .product-page .hero-image-wrapper {
  width: 94%;
  margin-left: auto;
  margin-right: 0;
}
.productPage.theme-10 .product-page .hero-image,
.productPage.theme-10 .support-page .hero-image,
.productPage.theme-10 .operation-page .hero-image {
  width: 100%;
  height: 240px;
  object-fit: cover;
  object-position: center 59%;
  border-radius: 112px 0 0 112px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
  /* gs1-home 10.scss hero-image borders */
  border-left: 1px solid #a7ecf380;
  border-top: 1px solid #a7ecf380;
  border-bottom: 1px solid #a7ecf380;
}
.productPage.theme-10 .product-page .title,
.productPage.theme-10 .support-page .title,
.productPage.theme-10 .operation-page .title {
  width: 90%;
  position: relative;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  margin: 0;
  margin-top: -20px;
  border-radius: 0 80px 80px 0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
  /* gs1-home 10.scss .title borders */
  border-top: 1px solid #a7ecf380;
  border-bottom: 1px solid #02385a;
}
.productPage.theme-10 .support-page .hero-image-wrapper,
.productPage.theme-10 .operation-page .hero-image-wrapper {
  width: 94%;
  margin-left: auto;
  margin-right: 0;
}
.productPage.theme-10 .product-page .product-details {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
.productPage.theme-10 .product-page .product-details .item {
  display: flex;
  gap: 2px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: linear-gradient(
    122.16deg,
    rgba(217, 217, 217, 0.3) 7.67%,
    rgba(115, 115, 115, 0.075) 83.61%
  );
  border: 1px solid #a7ecf380;
  padding: 14px 2px;
  border-radius: 12px;
  min-width: 65px;
  text-align: center;
  flex: 1;
  
}
.productPage.theme-10 .product-page .product-details .item  i {
  font-size: 22px;
  color: var(--theme-10-icon-color);
}
.productPage.theme-10 .product-page .product-details .item span {
  font-size: 12px;
  color: var(--theme-10-font-color);
}
.productPage.theme-10 .product-page .product-details-v2 .item {
  background: linear-gradient(
    122.16deg,
    rgba(217, 217, 217, 0.3) 7.67%,
    rgba(115 115 115 / 0.29) 83.61%
  );
  /* gs1-home 10.scss product-details-v2: top/bottom only */
  border-top: 1px solid #a7ecf380;
  border-bottom: 1px solid #03598f;
  border-left: none;
  border-right: none;
  border-radius: 20px;
  padding: 8px 12px;
  text-align: center;
}
.productPage.theme-10 .product-page .product-details-v2 .item i:first-of-type {
  color: var(--theme-10-icon-color);
}
.productPage.theme-10 .product-page .product-details-v2 .item span {
  color: var(--theme-10-font-color);
}
.productPage.theme-10 .product-page .product-accessories {
  display: grid;
  gap: 10px;
  margin-top: 1rem;
  grid-template-columns: repeat(2, 1fr);
}
.productPage.theme-10 .product-page .product-accessories .item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px;
  border-radius: 10px;
  cursor: pointer;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
  linear-gradient(122.16deg, rgba(217, 217, 217, 0.4) 7.67%, rgba(115, 115, 115, 0.1) 83.61%);
  border: 1px solid #a7ecf380;
}
.productPage.theme-10 .product-page .product-accessories .item i {
  font-size: 45px;
  color: var(--theme-10-icon-color);
}
/* THEME 10 - SUPPORT & OPERATIONS */
.productPage.theme-10 .support-page,
.productPage.theme-10 .operation-page {
  background: var(--theme-10-background-color);
  padding-bottom: 5rem;
}
.productPage.theme-10 .operation-page .instructions {
  border-radius: 12px;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
  linear-gradient(122.16deg, rgba(217, 217, 217, 0.4) 7.67%, rgba(115, 115, 115, 0.1) 83.61%);
  /* gs1-home 10.scss operation .instructions */
  border-top: 1px solid #a7ecf380;
  border-bottom: 1px solid #02385a;
}
.productPage.theme-10 .operation-page .instructions i {
  font-size: 45px;
  scale: 1.2;
  color: var(--theme-10-icon-color);
}
.productPage.theme-10 .review-title {
  color: var(--theme-10-font-color);
}
.productPage.theme-10 .review-item {
  color: #ffffff;
  background: #0b1c26;
}
.productPage.theme-10 .faq-item {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
  linear-gradient(122.16deg, rgba(217, 217, 217, 0.4) 7.67%, rgba(115, 115, 115, 0.1) 83.61%);
  border: 1px solid #a7ecf380;
}

/* Theme 10 – Link section (card, dark title, URL row with copy icon, Learn More button) */
.productPage.theme-10 .link-component-wrapper {
  background: #0B1C26;
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
.productPage.theme-10 .link-component-wrapper p {
  color: var(--theme-10-font-color);
}
.productPage.theme-10 .link-component-wrapper .link-input-wrapper {
  position: relative;
  margin-bottom: 12px;
}
.productPage.theme-10 .link-component-wrapper .link-input-wrapper i {
  color: var(--theme-10-icon-color);
}
.productPage.theme-10 .link-component-wrapper .link-input {
  width: 100%;
  padding: 7px 12px 7px 40px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: hsla(0, 0%, 85%, .4);
  color: var(--theme-10-font-color);
  font-size: 14px;
  outline: none;
  cursor: text;
}
.productPage.theme-10 .link-component-wrapper .link-icon {
  left: 14px;
}
.productPage.theme-10 .link-component-wrapper .link-copy-icon-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.productPage.theme-10 .link-component-wrapper .link-copy-icon-btn:hover {
  background: rgba(0, 0, 0, 0.06);
}
.productPage.theme-10 .link-component-wrapper .link-copy-icon-btn i {
  font-size: 18px;
}
.productPage.theme-10 .link-component-wrapper .link-buttons-wrapper {
  display: flex;
  justify-content: center;
  gap: 0;
}
.productPage.theme-10 .link-component-wrapper .btn-learn-more {
  width: 100%;
  max-width: 100%;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
  /* gs1-home 10.scss .link-component .learn-more-button */
  border-top: 1px solid #a7ecf380;
  border-bottom: 1px solid #03598f;
  border-left: none;
  border-right: none;
  background: linear-gradient(
    122.16deg,
    rgba(217, 217, 217, 0.3) 7.67%,
    rgba(115 115 115 / 0.29) 83.61%
  );
  color: var(--theme-10-font-color) !important;
  outline: none;
}
.productPage.theme-10 .footer-menu {
  background: transparent;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  /* gs1-home 10.scss: footer has no top border */
}
.productPage.theme-10 .footer-menu .active {
  padding: 6px 10px;
  background: #161d2380;
  border-radius: 30px;
}
.productPage.theme-10 .footer-menu i,
.productPage.theme-10 .footer-menu p {
  color: var(--theme-10-icon-color);
}
.productPage.theme-10 .product-description,
.productPage.theme-10 .product-description p {
  color: var(--theme-10-description-font-color);
}
/* Theme 10 accessory modal – reference design: white modal, header icon+title, subheadings & lists */
.productPage.theme-10 .accessory-modal.accessory-modal--theme-10 {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
  linear-gradient(122.16deg, rgba(217, 217, 217, 0.4) 7.67%, rgba(115, 115, 115, 0.1) 83.61%);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  /* gs1-home 10.scss: accessory-modal has no border */
  border-radius: 20px 20px 0 0;
  padding: 0;
  overflow-y: auto;
  max-height: 90dvh;
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__close {
  top: 24px;
  right: 24px;
  font-size: 16px;
  color:  #0B1C26 !important;
  z-index: 10;
  font-weight: 600;
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__inner {
  padding: 46px 30px 28px;
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  font-size: 40px;
  background: color-mix(in srgb, var(--theme-10-icon-color) 20%, transparent) !important;
  color: var(--theme-10-icon-color) !important;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: static;
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__title {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
  flex: 1;
  color: var(--theme-10-font-color);
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__body {
  max-height: none;
  overflow-y: visible;
  margin-bottom: 0;
  padding: 0;
  text-align: left;
  align-items: stretch;
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__description-wrapper {
  margin: 0 0 16px;
}
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__description,
.productPage.theme-10 .accessory-modal--theme-10 .accessory-modal__description p {
  font-size: 15px;
  font-weight: 400;
  color: var(--theme-10-description-font-color);
  line-height: 1.6;
  margin: 0 0 4px;
}

/* ==========================================================================
   Carousel
   ========================================================================== */

.productPage .carousel-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.productPage .carousel-wrapper .carousel {
  position: relative;
  width: 100%;
  height: 360px;
  overflow: hidden;
}
.productPage .carousel-wrapper .carousel img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 20px;
  object-fit: cover;
  transition: all 0.5s ease;
  opacity: 0;
}
.productPage .carousel-wrapper .carousel-center {
  width: 270px;
  height: 360px;
  opacity: 1 !important;
  z-index: 3;
  transform: translate(-50%, -50%) scale(1) !important;
  filter: blur(0);
}

.productPage .carousel-wrapper .carousel-side {
  width: 198px;
  height: 270px;
  opacity: 0.7 !important;
  z-index: 2;
  filter: blur(0.1px);
}
.productPage .carousel-wrapper .carousel-side-left {
  width: 198px;
  height: 270px;
  opacity: 0.7 !important;
  z-index: 2;
  filter: blur(0.1px);
  transform: translate(-170%, -50%) scale(0.9) !important;
}
.productPage .carousel-wrapper .carousel-side-right {
  width: 198px;
  height: 270px;
  opacity: 0.7 !important;
  z-index: 2;
  filter: blur(0.1px);
  transform: translate(70%, -50%) scale(0.9) !important;
}
.productPage .carousel-wrapper .carousel-hidden {
  opacity: 0;
  pointer-events: none;
}
.productPage .carousel-wrapper .carousel-btn {
  font-size: 2rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #333;
  transition: transform 0.2s ease;
}
.productPage.theme-1 .carousel-wrapper .carousel-btn { color: var(--theme-1-font-color); }
.productPage.theme-2 .carousel-wrapper .carousel-btn { color: var(--theme-2-font-color); }
.productPage.theme-3 .carousel-wrapper .carousel-btn { color: var(--theme-3-font-color); }
.productPage.theme-4 .carousel-wrapper .carousel-btn { color: var(--theme-4-font-color); }
.productPage.theme-5 .carousel-wrapper .carousel-btn { color: var(--theme-5-font-color); }
.productPage.theme-6 .carousel-wrapper .carousel-btn { color: var(--theme-6-font-color); }
.productPage.theme-7 .carousel-wrapper .carousel-btn { color: var(--theme-7-font-color); }
.productPage.theme-8 .carousel-wrapper .carousel-btn { color: var(--theme-8-font-color); }
.productPage.theme-9 .carousel-wrapper .carousel-btn { color: var(--theme-9-font-color); }
.productPage.theme-10 .carousel-wrapper .carousel-btn { color: var(--theme-10-font-color); }
.productPage .carousel-wrapper .carousel-btn:hover {
  transform: scale(1.2);
}

/* ==========================================================================
   Description truncation functionality
   ========================================================================== */

.productPage .product-description {
  position: relative;
}
.productPage .product-description p {
  margin: 0;
}
.productPage .product-description.truncated {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.4;
  /* max-height: calc(3 * 1.4em); */
  position: relative;
}

.productPage .product-description.expanded {
  max-height: none;
  overflow: visible;
}

.productPage .show-more-btn {
  display: none !important; /* Hidden by default */
  background: none !important;
  border: none !important;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  padding: 0px;
  margin-top: 0px;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.productPage .show-more-btn:hover {
  opacity: 0.8;
}

.productPage .show-more-btn:focus {
  outline: none;
}

/* Fallback for browsers that don't support line-clamp */
@supports not (-webkit-line-clamp: 3) {
  .productPage .product-description.truncated {
    max-height: calc(3 * 1.4em);
    overflow: hidden;
    position: relative;
  }
  
  .productPage .product-description.truncated::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 30px;
    height: 1.4em;
    background: linear-gradient(to right, transparent, white);
  }
}

/* ==========================================================================
   Link Component
   ========================================================================== */

.productPage .link-component-wrapper {
  width: 100%;
  margin: 0;
  padding: 0;
}

.productPage .link-input-wrapper {
  position: relative;
  width: 100%;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
}

.productPage .link-icon {
  position: absolute;
  left: 12px;
  color: var(--product-details-v2-bg);
  font-size: 16px;
  z-index: 1;
  pointer-events: none;
}

.productPage .link-input {
  width: 100%;
  padding: 7px 12px 7px 40px;
  border: 1px solid #D2D2D2;
  border-radius: 8px;
  background-color: transparent;
  font-size: 14px;
  outline: none;
  cursor: text;
}

.productPage .link-buttons-wrapper {
  display: flex;
  gap: 8px;
  width: 100%;
}

.productPage .btn-copy-link,
.productPage .btn-learn-more {
  flex: 1;
  padding: 10px 16px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
  outline: none;
}
.productPage .btn-copy-link {
  border: 1px solid #dee2e6;
  background: #f8f9fa;
  color: #495057;
}
.productPage.theme-5 .btn-copy-link {
  background-color: transparent !important;
  border-color: #d2d2d2 !important;
}
.productPage .btn-learn-more {
  border: none;
  color: #fff;
  display: inline-block;
}
.productPage.theme-1 .btn-learn-more {
  background: var(--theme-1-theme-color);
  color: #fff;
}
.productPage.theme-2 .btn-learn-more {
  background: var(--theme-2-theme-color);
  color: #fff;
}
.productPage.theme-3 .btn-learn-more {
  background: var(--theme-3-theme-color);
  color: #fff;
}
.productPage.theme-4 .btn-learn-more {
  background: var(--theme-4-theme-color);
  color: #fff;
}
.productPage.theme-5 .btn-learn-more {
  background: var(--theme-5-theme-color);
  color: #fff;
}
.productPage.theme-6 .btn-learn-more {
  background: var(--theme-6-theme-color);
  color: #fff;
}
.productPage.theme-7 .btn-learn-more {
  background: var(--theme-7-theme-color);
  color: #fff;
}
.productPage.theme-8 .btn-learn-more {
  background: var(--theme-8-theme-color);
  color: #fff;
}
.productPage.theme-9 .btn-learn-more {
  background: var(--theme-9-theme-color);
}
.productPage.theme-10 .btn-learn-more {
  background: var(--theme-10-theme-color);
}