/* ==================================================================
   MINDFUL MAMA — DETAIL PRODUKTU
   Shoptet markup se nemění. Vzhled = CSS, přesuny = JS.
   Vše, co v grafice není, je skryto (blok SKRYTÉ PRVKY níže).
   ================================================================== */

/* --- Rámec ---------------------------------------------------------- */
.type-detail .content-wrapper {
  position: relative;
}
.type-detail .content-wrapper-in { width: 100%; margin: 0 auto; }
.type-detail .content.wide { display: block; }
.stag__p-detail-inner-wrap {
  background:
    radial-gradient(ellipse 45% 38% at 6% 6%, oklch(90% 0.09 300 / 0.35), transparent 68%),
    radial-gradient(ellipse 40% 34% at 96% 14%, oklch(90% 0.1 190 / 0.28), transparent 68%),
    oklch(98.7% 0.006 85);
  padding: 128px 0 60px;
}
.p-detail-inner .detail-parameters, .p-detail-inner .p-detail-inner-header, .p-detail-inner .p-short-description {
  margin: 0;
}
.p-detail-inner .p-detail-inner-header {
  display: block;
}

/* --- Hlavní grid ---------------------------------------------------- */
.p-detail-inner {
  display: grid; grid-template-columns: 5fr 7fr; gap: 90px;
  align-items: start;
}
.p-image-wrapper { order: 1; position: sticky; top: 110px; align-self: start; }
.p-data-wrapper { order: 2; display: flex; flex-direction: column; }

/* --- Obrázek -------------------------------------------------------- */
.p-image { position: relative; display: flex; flex-direction: column; align-items: center; }
.p-main-image {
  display: block; width: 100%; max-width: 320px; position: relative; overflow: hidden;
  margin-bottom: 20px;
  background: oklch(97.5% 0.012 85);
  border: 1px solid oklch(90% 0.01 85);
  box-shadow: 22px 30px 60px oklch(55% 0.13 340 / 0.28), 4px 10px 24px oklch(0% 0 0 / 0.13);
  aspect-ratio: 2/3;
  border-radius: 8px;
}
.p-main-image > img { display: block; width: 100%; height: auto; }
.p-main-image .stag__cover-mock-logo { width: 50%; }

/* --- Breadcrumbs (JS je přesouvá do pravého sloupce) ---------------- */
.p-data-wrapper .breadcrumbs {
  order: 0; display: flex; align-items: center; flex-wrap: wrap;
  font-size: 12px; color: oklch(56% 0.01 270); margin-bottom: 22px;
}
.breadcrumbs span[itemprop="itemListElement"] { display: inline-flex; align-items: center; }
.breadcrumbs a, .breadcrumbs a:visited { color: oklch(56% 0.01 270); }
.breadcrumbs a:hover { color: oklch(60% 0.18 350); }
.navigation-bullet { margin: 0 9px; color: oklch(78% 0.01 270); }
#navigation-2 span[itemprop="name"] { color: oklch(38% 0.01 270); }

/* --- Hlavička ------------------------------------------------------- */
.p-detail-inner-header { order: 1; margin-bottom: 0; }
.p-detail-inner-header::before {
  content: 'E-book · meditace zdarma v ceně';
  display: block; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: oklch(68% 0.18 350); margin-bottom: 14px;
}
.p-detail-inner-header h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(28px, 3.2vw, 42px); font-weight: 800; line-height: 1.2;
  letter-spacing: -0.01em; color: oklch(24% 0.01 270); margin-bottom: 16px;
}

/* Meta řádek: hodnocení + dostupnost (obsah plní Shoptet / JS) */
.p-detail-inner-header .ratings-and-brand {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.stag__stars { display: flex; gap: 2px; color: oklch(70% 0.18 80); font-size: 14px; }
.stag__rating-count { font-size: 13px; color: oklch(52% 0.01 270); }
.stag__meta-divider { width: 1px; height: 14px; background: oklch(85% 0.01 270); }
.p-detail-inner-header .availability-label {
  font-size: 13px !important; color: oklch(52% 0.14 150) !important;
}

.p-short-description {
  order: 2; margin-top: 24px !important; margin-bottom: 32px !important;
  font-size: 15px; line-height: 1.9; color: oklch(44% 0.01 270); max-width: 540px;
}

/* --- Formulář / cenová karta ---------------------------------------- */
#product-detail-form { order: 3; display: flex; flex-direction: column; }
.p-to-cart-block {
  padding: 28px; background: oklch(99.4% 0.008 300);
  border-radius: 20px; box-shadow: 0 14px 34px oklch(60% 0.1 300 / 0.1);
  gap: unset;
  display: flex;
  flex-flow: column;
  align-items: flex-start;
}
.p-final-price-wrapper { display: flex; align-items: baseline; gap: 12px; margin-bottom: 22px; }
.price-final { font-weight: 400; }
.price-final-holder {
  font-family: 'Montserrat', sans-serif; font-size: 36px; font-weight: 800 !important;
  color: oklch(24% 0.01 270); white-space: nowrap;
}
.price-standard { font-size: 14px; color: oklch(60% 0.01 270); text-decoration: line-through; }
.p-to-cart-block .flag-discount, .p-to-cart-block .price-save {
  font-size: 11px; letter-spacing: 0.08em;
  background: oklch(68% 0.18 350 / 0.15); color: oklch(52% 0.18 350);
  padding: 4px 10px; border-radius: 100px; line-height: 100%;
}
.p-to-cart-block .add-to-cart {
  margin-left: 0;
}
/* Shoperní skryté texty pro čtečky (Měrná cena, Množství…) */
.sr-only {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.price-measure { display: none; }

/* --- Galerie: náhledy pod obrázkem (staví JS) ----------------------- */
.stag__gallery-slide {
  width: 100%; max-width: 320px; aspect-ratio: 2 / 3; position: relative; overflow: hidden;
  border-radius: 8px;
  box-shadow: 22px 30px 60px oklch(55% 0.13 340 / 0.28), 4px 10px 24px oklch(0% 0 0 / 0.13);
  background: oklch(96.5% 0.01 290 / 0.6);
  display: flex; align-items: center; justify-content: center;
  border: 1px solid oklch(91% 0.04 290 / 0.5);
  margin-bottom: 20px;
}
.stag__gallery-slide-stripes {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(45deg, transparent, transparent 14px, oklch(88% 0.04 290 / 0.3) 14px, oklch(88% 0.04 290 / 0.3) 15px);
}
.stag__gallery-slide-text {
  position: relative; z-index: 1; padding: 24px; text-align: center;
  font-family: 'Courier New', monospace; font-size: 11px; line-height: 2;
  letter-spacing: 0.1em; text-transform: uppercase; color: oklch(60% 0.03 270);
}
.stag__gallery-label { font-size: 12px; color: oklch(52% 0.01 270); margin: 20px 0 12px; }
.stag__thumbs { display: flex; gap: 10px; }
.stag__thumb {
  width: 52px; height: 52px; border-radius: 10px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: oklch(97% 0.008 270); border: 1px solid oklch(90% 0.01 270);
  color: oklch(55% 0.01 270); transition: all 0.2s ease;
}
.stag__thumb-active {
  background: oklch(96% 0.02 350); border: 2px solid oklch(68% 0.18 350);
  color: oklch(52% 0.18 350);
}
/* Poznámka nad tlačítkem — nese ji kontejner .add-to-cart */
.add-to-cart::before {
  content: 'V ceně e-booku je vždy zahrnuto všech 7 vedených meditací.';
  display: block; font-size: 13px; color: oklch(50% 0.01 270); margin-bottom: 24px;
  text-align: left;
}
.btn.btn-conversion.add-to-cart-button {
  width: 100%; background: oklch(68% 0.18 350); color: white; border: none;
  padding: 15px 24px; border-radius: 100px; font-size: 14px; letter-spacing: 0.06em;
  cursor: pointer; transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
  font-weight: 400; line-height: normal;
}
.btn.btn-conversion.add-to-cart-button:hover {
  background: oklch(58% 0.18 350); transform: translateY(-2px);
  box-shadow: 0 10px 24px oklch(55% 0.18 350 / 0.35);
}

/* --- Přenesené bloky z popisu (přesouvá JS) ------------------------- */
.p-data-wrapper .stag__trust-badges {
  order: 4; display: flex; gap: 28px; flex-wrap: wrap; margin-top: 36px;
}
.stag__trust-badge { display: flex; align-items: center; gap: 10px; }
.stag__trust-badge > span:last-child { font-size: 12.5px; color: oklch(46% 0.01 270); }
.stag__trust-badge-icon {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 0; line-height: 0; /* pojistka: kdyby si Shoptet do prázdného tagu vložil &nbsp;, nic se nezobrazí */
}
.stag__trust-badge-icon-purple { background: oklch(93% 0.07 290 / 0.5); color: oklch(55% 0.1 290); }
.stag__trust-badge-icon-blue { background: oklch(93% 0.05 260 / 0.5); color: oklch(58% 0.1 260); }
.stag__trust-badge-icon-pink { background: oklch(93% 0.08 350 / 0.5); color: oklch(62% 0.14 350); }

.stag__trust-badge-icon::before {
  content: ''; display: block; width: 16px; height: 16px; background-color: currentColor;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
.stag__icon-download::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v13M7 12l5 5 5-5M4 20h16'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v13M7 12l5 5 5-5M4 20h16'/%3E%3C/svg%3E");
}
.stag__icon-lock::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='10' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='10' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E");
}
.stag__icon-check::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E");
}

.p-data-wrapper .stag__product-block {
  order: 5; margin-top: 56px; padding-top: 44px; border-top: 1px solid oklch(90% 0.02 350);
}
.stag__product-block-heading {
  font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  color: oklch(50% 0.01 270); margin-bottom: 26px !important;
}
.stag__inclusions { display: flex; flex-direction: column; gap: 22px; }
.stag__inclusions-flush { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.stag__inclusion { display: flex; align-items: flex-start; gap: 18px; }
.stag__inclusion-icon {
  width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 0; line-height: 0; /* pojistka: kdyby si Shoptet do prázdného tagu vložil &nbsp;, nic se nezobrazí */
}
.stag__inclusion-icon-purple { background: oklch(93% 0.07 290 / 0.5); color: oklch(55% 0.1 290); }
.stag__inclusion-icon-pink { background: oklch(93% 0.08 350 / 0.5); color: oklch(62% 0.14 350); }
.stag__inclusion-icon-blue { background: oklch(93% 0.05 260 / 0.5); color: oklch(58% 0.1 260); }

.stag__inclusion-icon::before {
  content: ''; display: block; width: 18px; height: 18px; background-color: currentColor;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
.stag__icon-meditation::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l12-2v13'/%3E%3Ccircle cx='6' cy='18' r='3'/%3E%3Ccircle cx='18' cy='16' r='3'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l12-2v13'/%3E%3Ccircle cx='6' cy='18' r='3'/%3E%3Ccircle cx='18' cy='16' r='3'/%3E%3C/svg%3E");
}
.stag__icon-book::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z'/%3E%3C/svg%3E");
}
.stag__icon-chat::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
}
.stag__inclusion-title-product { font-size: 14px; font-weight: 600; color: oklch(28% 0.01 270); margin-bottom: 4px; }
.stag__inclusion-text { font-size: 13px; line-height: 1.65; color: oklch(50% 0.01 270); }

/* --- Parametry (JS přesouvá .extended-description z tabu) ----------- */
.p-data-wrapper .extended-description {
  order: 6; margin-top: 48px; padding-top: 40px; border-top: 1px solid oklch(90% 0.02 350);
}
.p-data-wrapper .extended-description > p strong {
  display: block; font-family: 'Karla', sans-serif;
  font-size: 12px; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase;
  color: oklch(50% 0.01 270); margin-bottom: 18px;
}
.p-data-wrapper .extended-description .detail-parameters { width: 100%; border-collapse: collapse; }
.p-data-wrapper .extended-description .detail-parameters tr { border-bottom: 1px solid oklch(91% 0.015 350); }
.p-data-wrapper .extended-description .detail-parameters th,
.p-data-wrapper .extended-description .detail-parameters td { padding: 13px 0; vertical-align: top; text-align: left; font-weight: 400; }
.p-data-wrapper .extended-description .detail-parameters .row-header-label { font-size: 13.5px; color: oklch(52% 0.01 270); }
.p-data-wrapper .extended-description .detail-parameters td,
.p-data-wrapper .extended-description .detail-parameters td a {
  font-size: 13.5px; font-weight: 600; color: oklch(28% 0.01 270); text-align: right;
}
.p-data-wrapper .extended-description .detail-parameters td a { color: oklch(52% 0.18 350); }
table.detail-parameters tbody tr td, table.detail-parameters tbody tr th {
  line-height: normal;
}

/* --- SKRYTÉ PRVKY (v grafice nejsou) -------------------------------- */
.p-detail-inner-header-mobile,
.p-image-wrapper .row,
.flags,
.p-variants-block,
#product-detail-form > .detail-parameters,
.p-not-returnable,
.quantity,
.buttons-wrapper,
.social-buttons-wrapper,
.link-icons,
.cofidis-buttons-wrapper,
.hledejceny-buttons-wrapper,
.p-image-wrapper .breadcrumbs { display: none !important; }

.p-detail-tabs-wrapper { display: block !important; }
.p-detail-tabs-wrapper .shp-tabs-row,
.p-detail-tabs-wrapper .shp-tabs-holder,
.p-detail-tabs-wrapper #p-detail-tabs,
.p-detail-tabs-wrapper .navigation-btn,
.p-detail-tabs-wrapper .hidden-links,
.p-detail-tabs-wrapper #description { display: none !important; }
.p-detail-tabs-wrapper .row { display: block; margin: 0; }
.p-detail-tabs-wrapper [class*="col-sm-"] { width: 100%; float: none; padding: 0; }
.p-detail-tabs-wrapper #tab-content { padding: 0; border: 0; background: none; }
#ratingTab { display: block !important; opacity: 1 !important; visibility: visible !important; }
/* --- Recenze -------------------------------------------------------- */
/* --- 2. Sekce a nadpis ---------------------------------------------- */
#ratingTab {
  max-width: 1140px; margin: 0 auto; padding: 70px 0 100px;
  font-family: 'Karla', sans-serif;
}
#ratingTab > h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(26px, 2.8vw, 36px); font-weight: 800; line-height: 1.25;
  letter-spacing: -0.01em; text-transform: none; text-align: center;
  color: oklch(24% 0.01 270); margin: 0; padding: 0; border: 0;
}
#ratingTab > h2::after { content: none; }
#ratingTab > h2::before {
  content: 'Recenze'; display: block;
  font-family: 'Karla', sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: oklch(68% 0.18 350); margin-bottom: 16px;
}

/* --- 3. Hvězdičky (empty spany .star) ------------------------------- */
#ratingTab .stars { display: inline-flex; gap: 2px; vertical-align: middle; }
#ratingTab .star {
  width: auto !important; height: auto !important;
  background: none !important; border: 0 !important;
  margin: 0 !important; padding: 0 !important;
  font-size: 14px; line-height: 1; display: inline-block;
}
#ratingTab .star::after { content: none !important; }
#ratingTab .star::before {
  content: '★' !important; display: inline-block;
  font-size: 14px; line-height: 1; color: oklch(70% 0.18 80);
  background: none !important; width: auto !important; height: auto !important;
}
#ratingTab .star-off::before { color: oklch(88% 0.02 270); }
#ratingTab .sr-only, #ratingTab .no-display { display: none !important; }

/* --- 4. Souhrn (průměr) pod nadpisem -------------------------------- */
#ratingWrapper { margin: 28px 0 46px; padding: 0; border: 0; background: none; }
#ratingWrapper .rate-wrap { display: flex; justify-content: center; margin: 0; }
#ratingWrapper .rate-average-wrap { margin: 0; }
#ratingWrapper .votes { display: none !important; }
#ratingWrapper .rate-average-inner {
  display: inline-flex; align-items: center; gap: 10px; flex-wrap: nowrap;
  background: oklch(96% 0.02 350); border-radius: 100px; padding: 10px 22px;
}
#ratingWrapper .rate-average {
  font-family: 'Montserrat', sans-serif; font-size: 17px; font-weight: 800;
  color: oklch(30% 0.01 270); line-height: 1;
}
#ratingWrapper .rate-star-wrap { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; white-space: nowrap; }
#ratingWrapper .rate-average { flex: 0 0 auto; }
#ratingWrapper .stars-label { font-size: 12.5px; color: oklch(52% 0.01 270); }
#ratingWrapper .stars-label span + span { display: none; }

/* --- 4b. Tlačítko „Přidat hodnocení" -------------------------------- */
#ratingWrapper .rate-wrap {
  flex-direction: column; align-items: center; gap: 18px;
}
#ratingWrapper .add-comment {
  margin: 0; padding: 0; border: 0; background: none; text-align: center; margin-top: 20px;
}
#ratingWrapper .add-comment .btn,
#ratingWrapper .add-comment button {
  display: inline-block; margin: 0;
  padding: 12px 28px; border-radius: 100px;
  background: transparent; color: oklch(50% 0.16 350);
  border: 1px solid oklch(84% 0.07 350);
  font-size: 12px; font-weight: 500; letter-spacing: 0.09em; text-transform: uppercase;
  line-height: 1.2; cursor: pointer; box-shadow: none;
  transition: background .3s ease, border-color .3s ease, color .3s ease, transform .3s ease;
}
#ratingWrapper .add-comment .btn:hover,
#ratingWrapper .add-comment button:hover,
#ratingWrapper .add-comment .btn:focus-visible {
  background: oklch(68% 0.18 350); border-color: oklch(68% 0.18 350);
  color: #fff; transform: translateY(-1px);
}
#ratingWrapper .add-comment .btn::before,
#ratingWrapper .add-comment .btn::after { content: none !important; }
/* po otevření formuláře Shoptet trigger skryje – ať nezůstane mezera */
#ratingWrapper .rate-form-trigger[hidden],
#ratingWrapper .rate-form-trigger.js-hidden { display: none !important; }
p[data-testid="textCommentNotice"] {
  display: none;
}

/* --- 4c. Formulář hodnocení jako popup ------------------------------
   JS ho přesouvá na konec <body>, proto jsou všechna pravidla
   scopovaná na #rate-form.stag-rate-modal (ne pod #ratingTab). */
html.stag-rate-open { overflow: hidden; }

#rate-form.stag-rate-modal {
  position: fixed; inset: 0; z-index: 10000;
  margin: 0; padding: 24px; border: 0; border-radius: 0;
  background: oklch(24% 0.01 270 / 0.5);
  display: none; align-items: center; justify-content: center;
  overflow-y: auto; overscroll-behavior: contain;
  font-family: 'Karla', sans-serif;            /* PŘIDÁNO: font už nedědí z #ratingTab */
  color: oklch(28% 0.01 270);                  /* PŘIDÁNO */
}
#rate-form.stag-rate-modal.visible { display: flex; }
#rate-form.stag-rate-modal > h3 { display: none; }

#rate-form.stag-rate-modal .rating-form {
  position: relative; width: 100%; max-width: 520px;
  overflow-y: auto; margin: auto;
  padding: 40px 40px 34px; border-radius: 22px;
  background: #fff; box-shadow: 0 30px 70px oklch(30% 0.04 300 / 0.28);
  animation: stagRateIn .28s cubic-bezier(.2,.8,.25,1) both;
}
@keyframes stagRateIn {
  from { opacity: 0; transform: translateY(14px) scale(.98); }
  to   { opacity: 1; transform: none; }
}
#rate-form.stag-rate-modal .rating-form::before {
  content: 'Zanechte hodnocení';
  display: block; font-family: 'Montserrat', sans-serif;
  font-size: 20px; font-weight: 800; line-height: 1.3;
  color: oklch(24% 0.01 270); margin: 0 40px 22px 0;
}
#rate-form.stag-rate-modal .stag-rate-close {
  position: absolute; top: 16px; right: 16px;
  width: 34px; height: 34px; padding: 0;
  display: flex; align-items: center; justify-content: center;
  background: oklch(96% 0.012 350); border: 0; border-radius: 50%;
  font-size: 20px; line-height: 1; color: oklch(45% 0.03 350);
  cursor: pointer; transition: background .25s ease, color .25s ease;
}
#rate-form.stag-rate-modal .stag-rate-close:hover {
  background: oklch(68% 0.18 350); color: #fff;
}

/* pole */
#rate-form.stag-rate-modal .form-legend { display: none; }
#rate-form.stag-rate-modal .form-group { margin: 0 0 16px; }
#rate-form.stag-rate-modal label,
#rate-form.stag-rate-modal .label {
  display: block; margin: 0 0 6px;
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  font-weight: 500; color: oklch(52% 0.01 270);
}
#rate-form.stag-rate-modal .form-control {
  width: 100%; padding: 13px 16px; height: auto;
  border: 1px solid oklch(90% 0.03 350); border-radius: 10px;
  background: oklch(99.2% 0.004 350); box-shadow: none;
  font-family: inherit;                        /* PŘIDÁNO */
  font-size: 14px; color: oklch(28% 0.01 270); outline: none;
  transition: border-color .25s ease, background .25s ease;
}
#rate-form.stag-rate-modal .form-control:focus {
  border-color: oklch(72% 0.14 350); background: #fff;
}
#rate-form.stag-rate-modal textarea.form-control { height: 100px; resize: vertical; }
#rate-form.stag-rate-modal .required-asterisk::after { color: oklch(66% 0.18 20); }
.discussion-wrapper.unveiled .add-comment, .rate-wrapper.unveiled .add-comment {
  display: block;
}

/* hvězdičkové hodnocení */
#rate-form.stag-rate-modal .rating-stars-group { margin-bottom: 20px; }
#rate-form.stag-rate-modal .rating-stars-description {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: oklch(52% 0.01 270); margin-bottom: 10px;
}
#rate-form.stag-rate-modal .rating-stars-wrapper {
  display: flex; gap: 6px; direction: ltr;
}
#rate-form.stag-rate-modal .rating-star { margin: 0; cursor: pointer; }
#rate-form.stag-rate-modal .rating-star input {
  position: absolute; opacity: 0; width: 1px; height: 1px;
}
#rate-form.stag-rate-modal .rating-star,
#rate-form.stag-rate-modal .rating-star::before,
#rate-form.stag-rate-modal .rating-star::after {
  background: none !important; border: 0 !important;
  width: auto !important; height: auto !important;
}
#rate-form.stag-rate-modal .rating-star::after { content: none !important; }
#rate-form.stag-rate-modal .rating-star::before {
  content: '★' !important; display: inline-block;
  font-size: 30px; line-height: 1; color: oklch(90% 0.02 270);
  transition: color .2s ease, transform .2s ease;
}
#rate-form.stag-rate-modal .rating-star:hover::before { transform: scale(1.08); }
#rate-form.stag-rate-modal .rating-star:has(input:checked)::before,
#rate-form.stag-rate-modal .rating-star:has(~ .rating-star input:checked)::before,
#rate-form.stag-rate-modal .rating-stars-wrapper:hover .rating-star:hover::before,
#rate-form.stag-rate-modal .rating-stars-wrapper:hover .rating-star:hover ~ .rating-star::before {
  color: oklch(70% 0.18 80);
}
#rate-form.stag-rate-modal .rating-stars-wrapper:hover .rating-star::before { color: oklch(70% 0.18 80); }
#rate-form.stag-rate-modal .rating-stars-wrapper:hover .rating-star:hover ~ .rating-star::before { color: oklch(90% 0.02 270); }
#rate-form.stag-rate-modal .rating-star input:focus-visible + *,
#rate-form.stag-rate-modal .rating-star:focus-within::before { color: oklch(62% 0.18 80); }

/* souhlas + odeslání */
#rate-form.stag-rate-modal .consents .label,
#rate-form.stag-rate-modal .consents p {
  font-size: 11.5px; line-height: 1.65; letter-spacing: 0;
  text-transform: none; color: oklch(55% 0.01 270);
}
#rate-form.stag-rate-modal .consents a {
  color: oklch(56% 0.16 350); border-bottom: 1px solid oklch(84% 0.1 350);
}
#rate-form.stag-rate-modal button[type="submit"] {
  width: 100%; margin: 4px 0 0; padding: 15px 28px;
  background: oklch(68% 0.18 350); color: #fff;
  border: 0; border-radius: 100px; box-shadow: none;
  font-family: inherit;                        /* PŘIDÁNO */
  font-size: 13px; font-weight: 500; letter-spacing: 0.09em; text-transform: uppercase;
  cursor: pointer; transition: background .3s ease, transform .3s ease;
}
#rate-form.stag-rate-modal button[type="submit"]:hover {
  background: oklch(58% 0.18 350); transform: translateY(-1px);
}

@media (max-width: 767px) {
  #rate-form.stag-rate-modal { padding: 0; align-items: flex-end; }
  #rate-form.stag-rate-modal .rating-form {
    max-width: none;
    padding: 32px 22px 26px; border-radius: 22px;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
  }
}
#rate-form.stag-rate-modal,
#rate-form.stag-rate-modal .rating-form {
  scrollbar-width: none;        /* Firefox */
  -ms-overflow-style: none;     /* starý Edge / IE */
}
#rate-form.stag-rate-modal::-webkit-scrollbar,
#rate-form.stag-rate-modal .rating-form::-webkit-scrollbar {
  display: none;                /* Chrome, Safari, nový Edge */
}

/* --- 5. Výpis recenzí = karty --------------------------------------- */
#ratingsList {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
  margin: 0; padding: 0; list-style: none;
}
#ratingsList .vote-wrap {
  display: flex; flex-direction: column;
  padding: 30px 26px; margin: 0; border: 0;
  position: relative; overflow: hidden;
}
#ratingsList .vote-wrap:nth-child(3n+1) {
  background: oklch(99.4% 0.008 300); border-radius: 20px 20px 20px 4px;
  box-shadow: 0 14px 34px oklch(60% 0.1 300 / 0.1);
}
#ratingsList .vote-wrap:nth-child(3n+2) {
  background: oklch(99.4% 0.008 190); border-radius: 20px 20px 4px 20px;
  box-shadow: 0 14px 34px oklch(60% 0.1 190 / 0.1);
}
#ratingsList .vote-wrap:nth-child(3n+3) {
  background: oklch(99.4% 0.008 20); border-radius: 4px 20px 20px 20px;
  box-shadow: 0 14px 34px oklch(60% 0.12 20 / 0.1);
}

/* pořadí obsahu: hvězdičky + odznak → text → jméno */
#ratingsList .vote-header,
#ratingsList .vote-summary { display: contents; }
#ratingsList .vote-pic { display: none !important; }

#ratingsList .vote-rating {
  order: 1; display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin: 0 0 14px;
}
#ratingsList .vote-delimeter, #ratingsList .vote-time { display: none; }
#ratingsList .vote-rating::after {
  content: 'Ověřená recenze';
  font-size: 10.5px; letter-spacing: 0.04em; white-space: nowrap;
  color: oklch(48% 0.13 150); background-color: oklch(90% 0.09 150 / 0.4);
  padding: 4px 9px 4px 24px; border-radius: 100px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%232f7f56' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='M9 12l2 2 4-4'/><circle cx='12' cy='12' r='9'/></svg>");
  background-repeat: no-repeat; background-position: 9px center;
}
#ratingsList .vote-content {
  order: 2; font-size: 14px; line-height: 1.75;
  color: oklch(38% 0.01 270); margin: 0 0 16px; padding: 0; border: 0;
  text-wrap: pretty;
}
#ratingsList .vote-name {
  order: 3; font-size: 12.5px; font-weight: 600;
  color: oklch(50% 0.01 270); margin: 0; padding: 0;
}
#ratingsList .vote-name::before { content: none; }

/* --- 6. Responzivita ------------------------------------------------ */
@media (max-width: 1199px) {
  #ratingsList { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  #ratingTab { padding: 50px 0 70px; }
  #ratingsList { grid-template-columns: 1fr; }
}

/* --- Mock obálky (na e-shopu zde bude reálná fotka) ----------------- */
.stag__cover-mock { aspect-ratio: 3 / 4; display: flex; flex-direction: column; align-items: center; padding: 36px 24px 24px; position: relative; overflow: hidden; }
.stag__cover-mock-blob { position: absolute; border-radius: 50%; filter: blur(6px); }
.stag__cover-mock-blob-1 { top: -60px; left: -50px; width: 200px; height: 200px; background: radial-gradient(circle, oklch(88% 0.09 300 / 0.55), transparent 70%); }
.stag__cover-mock-blob-2 { bottom: -70px; right: -60px; width: 220px; height: 220px; background: radial-gradient(circle, oklch(88% 0.1 190 / 0.4), transparent 70%); }
.stag__cover-mock-blob-3 { top: 40%; right: -40px; width: 140px; height: 140px; background: radial-gradient(circle, oklch(90% 0.12 20 / 0.4), transparent 70%); }
.stag__cover-mock-logo { width: 50%; position: relative; z-index: 1; margin-bottom: 20px; }
.stag__cover-mock-title { font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 24px; line-height: 1.3; letter-spacing: -0.01em; text-transform: uppercase; text-align: center; position: relative; z-index: 1; }
.stag__cover-mock-title-teal { color: oklch(62% 0.07 190); }
.stag__cover-mock-title-pink { color: oklch(68% 0.12 330); margin-bottom: 16px; }
.stag__cover-mock-desc { font-size: 12.5px; line-height: 1.55; color: oklch(58% 0.1 350); text-align: center; max-width: 230px; position: relative; z-index: 1; }
.stag__cover-mock-spacer { flex: 1; }
.stag__cover-mock-author { font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 0.04em; color: oklch(45% 0.02 270); position: relative; z-index: 1; }

@media (max-width: 991px) {
  .type-detail .content-wrapper { padding: 0 0 0; }
  .p-detail-inner { grid-template-columns: 1fr; gap: 44px; }
  .p-image-wrapper { position: static; }
  .stag__reviews { padding: 60px 24px 80px; }
  .stag__reviews-grid { grid-template-columns: 1fr; }
  .stag__nav-links { gap: 18px; }
  .stag__footer-grid { grid-template-columns: 1fr; gap: 40px; }
}

@media (max-width: 767px) {
  .shp-accordion-wrapper.p-detail-tabs-wrapper {
    padding: 0 20px;
  }
  #accordion-content .shp-accordion .shp-accordion-link {
    display: none;
  }
  #accordion-content .shp-accordion .shp-accordion-content {
    display: block;
    margin-top: 0;
  }
  #accordion-content .shp-accordion {
    padding-top: 0;
  }
  .p-detail-tabs-wrapper {
    margin: 0;
  }
  .p-data-wrapper .stag__trust-badges {
    gap: 13px;
  }
}

.stars .star.star-half:before, .stars .star.star-on:before {
  color: oklch(70% 0.18 80);
}
:where(.ums_discussion_rating_forms--on) .star:before {
    display: block;
    font-size: 11px;
    line-height: 11px;
}
:where(.ums_discussion_rating_forms--on) .starsLabel--productDetail span,
:where(.ums_discussion_rating_forms--on) .stars-link {
  font-size: 13px;
  color: oklch(52% 0.01 270) !important;
}
:where(.ums_discussion_rating_forms--on) .stars {
  align-items: center;
}
:where(.ums_discussion_rating_forms--on) .rate-wrapper.unveil-wrapper .rate-average-inner .stars {
  margin-block: 0px;
}
#ratingWrapper .rate-star-wrap {
  gap: 3px;
}