/* style.css — aktuální verze (KROK 1 + KROK 2, bez fajfek, větší text v kartách) */

.ring-configurator{
  width:100%;
  max-width:none;
  background:transparent;
  color:#000 !important;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:0;
  margin:0;
  transform:none;
  opacity:1 !important;
  filter:none !important;
}
.ring-configurator *{
  box-sizing:border-box;
  font-family:inherit;
  color:inherit;
  opacity:1;
  filter:none;
}

/* Desktop: rozměr nechat, ale posunout doleva */
@media (min-width:900px){
  .ring-configurator{
    width:calc(100% + 34px);
    margin-right:-34px;
    transform:translateX(-22px);
  }
}

/* =========================================================
   KROK 1A: SCHOVAT ZAKROUŽKOVANÉ VĚCI NA MASTER PRODUKTU
   (pouze když stránka obsahuje konfigurátor)
========================================================= */

/* velký blok ceny dole (12 Kč/ks apod.) */
html.rc-flag-konfigurator body:has(.ring-configurator) .p-final-price-wrapper{
  display:none !important;
}

/* “Kód produktu …” */
html.rc-flag-konfigurator body:has(.ring-configurator) .p-code,
html.rc-flag-konfigurator body:has(.ring-configurator) .p-product-code,
html.rc-flag-konfigurator body:has(.ring-configurator) .product-code,
html.rc-flag-konfigurator body:has(.ring-configurator) .p-detail-info .code,
html.rc-flag-konfigurator body:has(.ring-configurator) [data-testid="productCardCode"]{
  display:none !important;
}

/* krátký popis pod CTA s “Více informací” (Venus může mít víc variant tříd) */
html.rc-flag-konfigurator body:has(.ring-configurator) .p-short-description,
html.rc-flag-konfigurator body:has(.ring-configurator) .short-description,
html.rc-flag-konfigurator body:has(.ring-configurator) .basic-description,
html.rc-flag-konfigurator body:has(.ring-configurator) .p-detail-info .description,
html.rc-flag-konfigurator body:has(.ring-configurator) .p-detail-info .p-description,
html.rc-flag-konfigurator body:has(.ring-configurator) .p-detail-info .p-desc{
  display:none !important;
}

/* =========================================================
   KROK 1B: KONFIGURÁTOR — ODSTRANIT HORNÍ ŘÁDEK + KOMPAKTNÍ SPACING
========================================================= */

/* horní řádek v konfigurátoru (Kód produktu / Konfigurátor prstenů / Připraveno) */
.ring-configurator__head{
  display:none !important;
}

/* error box kompaktně */
.ring-configurator__errorBox{
  display:none;
  margin:0 0 10px;
  padding:8px 10px;
  border:1px solid rgba(200,0,0,.35);
  background:#fff;
  border-radius:0;
  color:#b00000 !important;
  font-size:13px;
  line-height:1.35;
}
.ring-configurator__errorBox.is-visible{ display:block; }

/* ===== KARTY (Dámský / Pánský) ===== */
.ring-configurator__cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:0 0 10px;
}
@media (max-width:640px){
  .ring-configurator__cards{ grid-template-columns:1fr; }
}
.ring-configurator__card{
  position:relative;
  border:3px solid rgba(0,0,0,.25);
  background:#fff;
  border-radius:0;
  min-height:62px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  cursor:pointer;
  user-select:none;
  transition:background .12s ease, border-color .12s ease;
}
.ring-configurator__card:hover{ background:rgba(0,0,0,.03); }
.ring-configurator__card.is-active{
  background:#fff;
  border-color:rgba(0,0,0,.9);
}

/* zvětšit text v kartách */
.ring-configurator__cardTitle{
  font-weight:700;
  font-size:18px;
  letter-spacing:.2px;
  color:#000 !important;
}

/* vymazat “hnusné fajfky” v textu karet (na obrázku jsou jako znak před slovem) */
.ring-configurator__cardTitle{
  text-indent:0;
}
.ring-configurator__cardTitle::before{
  content:none !important;
  display:none !important;
}
/* pokud je to přímo znak ✓ v textu, zkusíme ho CSSkem schovat tím, že ho překryjeme přes font-feature */
.ring-configurator__cardTitle{
  font-variant-ligatures:none;
}

/* sekce */
.ring-configurator__section{ margin:0; padding:0; }
.ring-configurator__sectionTitle{
  margin:0 0 6px;
  font-weight:700;
  font-size:14px;
  color:#000 !important;
}

/* zbytečné nadpisy uvnitř — schovat title kalkulačky */
.ring-configurator__price .ring-configurator__sectionTitle{
  display:none !important;
}

/* rozložení velikost + rytina */
.ring-configurator__grid2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:0 0 10px;
}
@media (max-width:640px){
  .ring-configurator__grid2{ grid-template-columns:1fr; }
}

/* fieldy */
.ring-configurator__field{ display:grid; gap:6px; margin:0; }
.ring-configurator__label{
  font-size:14px;
  font-weight:700;
  color:#000 !important;
  margin:0;
}

/* select/input “shoptet-like” */
.ring-configurator__select,
.ring-configurator__input{
  width:100%;
  border:1px solid rgba(0,0,0,.25);
  background:#fff;
  border-radius:0;
  padding:12px 14px;
  font-size:18px;
  line-height:1.1;
  color:#000 !important;
  outline:none;
}
.ring-configurator__select:focus,
.ring-configurator__input:focus{
  border-color:rgba(0,0,0,.9);
  box-shadow:none;
}
.ring-configurator__input::placeholder{
  color:rgba(0,0,0,.55);
  opacity:1;
}

/* =========================================================
   BARVY ZLATA
========================================================= */

.ring-configurator__colors{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin:0 0 10px;
}
.ring-configurator__colorWrap{
  display:grid;
  justify-items:center;
  gap:6px;
}
.ring-configurator__colorBtn{
  position:relative;
  width:64px;
  height:64px;
  border-radius:0;
  border:1px solid rgba(0,0,0,.25);
  cursor:pointer;
  transition:border-color .12s ease;
  background:#eee;
  outline:0;
  box-sizing:border-box;
}
.ring-configurator__colorBtn:hover{
  border-color:rgba(0,0,0,.75);
}
/* SELECTED = jasně viditelné (bez fajfky) */
.ring-configurator__colorBtn.is-active{
  border:3px solid #000 !important;
  box-shadow:inset 0 0 0 2px #fff !important;
}
.ring-configurator__colorBtn.is-active::after{
  content:none !important;
  display:none !important;
}
.ring-configurator__colorName{
  font-size:12px;
  font-weight:400;
  color:#000 !important;
  opacity:.8;
}

/* toggle řádek */
.ring-configurator__toggleRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}
.ring-configurator__toggleLabel{
  font-size:14px;
  font-weight:700;
  color:#000 !important;
}
.ring-configurator__toggle{
  position:relative;
  width:46px;
  height:26px;
  border-radius:999px;
  background:rgba(0,0,0,.20);
  cursor:pointer;
}
.ring-configurator__toggle::after{
  content:"";
  position:absolute;
  top:3px;
  left:3px;
  width:20px;
  height:20px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(0,0,0,.18);
  transition:transform .12s ease, border-color .12s ease;
}
.ring-configurator__toggle.is-on{ background:rgba(0,0,0,.65); }
.ring-configurator__toggle.is-on::after{ transform:translateX(20px); border-color:rgba(0,0,0,.55); }

.ring-configurator__engraveBox{ display:none; margin-top:8px; }
.ring-configurator__engraveBox.is-visible{ display:block; }
.ring-configurator__hint{
  font-size:12px;
  opacity:.75;
  margin-top:4px;
  color:#000 !important;
}

/* price box kompaktně (bez title) */
.ring-configurator__price{
  margin-top:8px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}
.ring-configurator__priceRow{
  display:flex;
  align-items:baseline;
}

.ring-configurator__muted{
  opacity:.75;
  color:#000 !important;
}

/* CTA kompaktně */
.ring-configurator__cta{
  margin-top:10px;
  padding-top:0;
  border-top:0;
}
.ring-configurator__ctaRow{
  display:flex;
  gap:10px;
  align-items:stretch;
  flex-wrap:wrap;
}
.ring-configurator__ctaRow .quantity{ margin:0 !important; }
.ring-configurator__ctaRow button,
.ring-configurator__ctaRow input[type="submit"]{
  flex:1 1 240px;
}

/* field error */
.ring-configurator__field.is-error .ring-configurator__select,
.ring-configurator__field.is-error .ring-configurator__input{
  border-color:rgba(200,0,0,.8);
}
.ring-configurator__fieldError{
  display:none;
  color:#b00000 !important;
  font-size:12px;
  font-weight:700;
}
.ring-configurator__field.is-error .ring-configurator__fieldError{ display:block; }

/* toast */
.ring-configurator__toast{
  display:none;
  margin-top:10px;
  padding:8px 10px;
  border:1px solid rgba(0,0,0,.25);
  background:#fff;
  border-radius:0;
  font-size:13px;
  font-weight:700;
  color:#000 !important;
}
.ring-configurator__toast.is-visible{ display:block; }

/* =========================================================
   KROK 1C: dočištění – schovat zbytečné texty uvnitř konfigurátoru
   (ponecháme na později v JS, ale CSS jako fallback)
========================================================= */

/* “Dámský prsten / Pánský prsten” */
.ring-configurator [data-rc="ring-title"],
.ring-configurator .ring-configurator__ringTitle,
.ring-configurator .ring-configurator__ringHeader{
  display:none !important;
}

/* “Cena je informativní …” */
.ring-configurator [data-rc="price-note"],
.ring-configurator .ring-configurator__priceNote,
.ring-configurator .ring-configurator__price .ring-configurator__muted{
  display:none !important;
}

/* ===== CENY – čistý a stabilní layout (override) ===== */

/* Každý řádek: "Dámský – 21 600 Kč" na jednom řádku, hezky s mezerou */
.ring-configurator .rc-price-row{
  display:flex !important;
  align-items:baseline !important;
  justify-content:flex-start !important;
  gap:12px !important;
  margin:8px 0 !important;
  padding:0 !important;
}

/* Label (Dámský / Pánský / Celkem) */
.ring-configurator .rc-price-row strong{
  font-size:18px !important;
  font-weight:700 !important;
  margin:0 !important;
}

/* Přidej pomlčku a mezery za label */
.ring-configurator .rc-price-row strong::after{
  content:" –" !important;
}

/* Částka */
.ring-configurator .rc-price-row span{
  font-size:24px !important;
  font-weight:800 !important;
  margin:0 !important;
}

/* Divider */
.ring-configurator .rc-price-divider{
  border-top:2px solid #000 !important;
  margin:18px 0 25px !important;
}

/* Celkem řádek trochu větší (pokud máš class rc-price-row--total) */
.ring-configurator .rc-price-row--total strong{
  font-size:20px !important;
  font-weight:700 !important;
}
.ring-configurator .rc-price-row--total span{
  font-size:28px !important;
  font-weight:900 !important;
}

/* =========================================================
   FINÁL: menší text v polích + reset switche (už nebude bílej ani mimo)
   ========================================================= */

/* Text uvnitř polí (Vyber velikost / Max. 15 znaků) – menší */
:root{ --rc-field-h: 51px; } /* výška o 5px menší */

.ring-configurator .ring-configurator__select,
.ring-configurator .ring-configurator__input{
  height: var(--rc-field-h) !important;
  min-height: var(--rc-field-h) !important;
  padding: 0 16px !important;
  line-height: var(--rc-field-h) !important;
  font-size: 18px !important;      /* <- menší text uvnitř */
  box-sizing: border-box !important;
}

.ring-configurator .ring-configurator__input::placeholder{
  font-size: 18px !important;      /* <- menší placeholder */
}

/* SWITCH – vrať ho na normální vzhled (track + kolečko) */
.ring-configurator .ring-configurator__toggleRow{
  position: static !important;
  height: auto !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important; /* text vlevo, switch vpravo */
  gap: 10px !important;
  margin: 0 0 10px !important;
}

.ring-configurator .ring-configurator__toggleLabel{
  display: inline-block !important;  /* "Rytina" vedle switche */
  position: static !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

/* track */
.ring-configurator .ring-configurator__toggle{
  position: relative !important;
  width: 44px !important;
  height: 26px !important;
  border-radius: 999px !important;
  background: #d2d2d2 !important;   /* OFF */
  box-shadow: none !important;
  padding: 0 !important;
}

/* kolečko */
.ring-configurator .ring-configurator__toggle::after{
  content: "" !important;
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 999px !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.18) !important;
  transition: transform .12s ease, border-color .12s ease !important;
}

/* ON stav */
.ring-configurator .ring-configurator__toggle.is-on{
  background: rgba(0,0,0,.65) !important;
}
.ring-configurator .ring-configurator__toggle.is-on::after{
  transform: translateX(20px) !important;
  border-color: rgba(0,0,0,.55) !important;
}


/* =========================================================
   FINÁL: Rytina = 1 rovina + OFF schová input, ON ukáže input
   - OFF: "Rytina — (switch)" v 1 řádce, bez polí
   - ON : "Rytina - dámský/pánský" vlevo + switch vpravo v 1 řádce
          a input je ve stejné rovině jako select
   ========================================================= */

/* 0) Default: engraveBox je VŽDY skrytý, ukáže se jen na .is-visible */
.ring-configurator .ring-configurator__engraveBox{
  display: none !important;
}

/* 1) Pravý field (ten s toggleRow) jako 2 řádky: labelRow + inputRow */
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow){
  display: grid !important;
  grid-template-columns: 1fr auto !important;   /* vlevo text, vpravo switch */
  grid-template-rows: auto auto !important;     /* řádek 1 = label, řádek 2 = input */
  column-gap: 14px !important;
  row-gap: 6px !important;
  align-items: start !important;
}

/* 2) OFF stav: toggleRow přes CELÝ řádek 1 -> "Rytina" vlevo, switch vpravo */
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow) > .ring-configurator__toggleRow{
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important; /* text vlevo, switch vpravo */
  gap: 10px !important;
}
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow) > .ring-configurator__toggleRow .ring-configurator__toggleLabel{
  display: inline-block !important; /* OFF: text "Rytina" viditelný */
  font-weight: 700 !important;
}

/* 3) ON stav: engraveBox se zobrazí a jeho děti "propustíme" do gridu rodiče
      => label jde do řádku 1 vlevo, input do řádku 2 přes celou šířku (rovina se selectem) */
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow) > .ring-configurator__engraveBox.is-visible{
  display: contents !important; /* klíč: děti se zarovnají přímo do gridu fieldu */
}

/* label "Rytina - dámský/pánský" = řádek 1 vlevo */
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow) > .ring-configurator__engraveBox.is-visible > .ring-configurator__label{
  grid-column: 1 !important;
  grid-row: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* input = řádek 2 přes oba sloupce (stejná rovina jako select vlevo) */
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow) > .ring-configurator__engraveBox.is-visible > .ring-configurator__input{
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
}

/* 4) ON: toggleRow přepneme do řádku 1 vpravo a schováme duplicitní text "Rytina" */
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow):has(> .ring-configurator__engraveBox.is-visible) > .ring-configurator__toggleRow{
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-content: flex-end !important;
}
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow):has(> .ring-configurator__engraveBox.is-visible) > .ring-configurator__toggleRow .ring-configurator__toggleLabel{
  display: none !important; /* ON: text bereme z "Rytina - dámský/pánský" */
}


/* Posun rytiny (label + input + switch) o 2px nahoru */
.ring-configurator .ring-configurator__field:has(> .ring-configurator__toggleRow){
  transform: translateY(-2px) !important;
}


/* Schovej tabulku parametrů + spodní blok + quantity
   JEN když je na stránce konfigurátor a produkt má flag "Konfigurator"
   (tj. html má class rc-flag-konfigurator a zároveň existuje .ring-configurator)
*/
html.rc-flag-konfigurator body:has(.ring-configurator) table.detail\.parameters,
html.rc-flag-konfigurator body:has(.ring-configurator) table.detail-parameters,
html.rc-flag-konfigurator body:has(.ring-configurator) table.detail.parameters,     /* class="detail parameters" */
html.rc-flag-konfigurator body:has(.ring-configurator) table[class~="detail-parameters"]{
  display: none !important;
}

/*html.rc-flag-konfigurator body:has(.ring-configurator) .bottom{
  display: none !important;
}
*/
html.rc-flag-konfigurator body:has(.ring-configurator) span.quantity{
  display: none !important;
}

/* Nadpisy sekcí uvnitř konfigurátoru (tohle může zůstat bez flagu, protože cílí jen na tvůj konfigurátor) */
.ring-configurator__sectionTitle{
  display: none !important;
}



/* FIX: zapnout wrapper loga (někde ho něco vypíná) */
.site-name{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  height: 100% !important;
  overflow: visible !important;
}

/* ať je logo “normální” */
a[data-testid="linkWebsiteLogo"]{
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
}

a[data-testid="linkWebsiteLogo"] img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-height:60px !important;   /* změň dle potřeby */

  filter:none !important;
  mix-blend-mode:normal !important;
  opacity:1 !important;
}

/* ================================
   BARVA (parameter-id-80) – lepší viditelnost „Bílá“, bez kostiček,
   čtverec 1:1, a vybraný stav bez hnusného obrysu/checkbox looku
================================= */

/* scope jen na tenhle parametr */
#parameter-id-80{
  --sw: 60px; /* velikost čtverce (klidně změň) */
}

/* samotný čtvereček (span s barvou) */
#parameter-id-80 .advanced-parameter-inner{
  width: var(--sw) !important;
  aspect-ratio: 1 / 1 !important;   /* 1:1 */
  height: auto !important;
  display: block !important;

  /* ZRUŠIT „šachovnici“/pattern, pokud ji šablona dává přes background-image */
  background-image: none !important;

  border-radius: 0 !important;
  border: 1px solid rgba(0,0,0,.28) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.10) !important;
  overflow: hidden !important;
}

/* Když je to BÍLÁ: přidej jemný vnitřní okraj, aby byla vidět na bílém pozadí */
#parameter-id-80 .advanced-parameter-inner[data-testid="variant_Bílá"]{
  border-color: rgba(0,0,0,.35) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.18),
    inset 0 0 0 6px rgba(255,255,255,.0) !important; /* jen pro stabilitu vzhledu */
}

/* Zruš případné defaultní „fajfky“/overlay od šablony */
#parameter-id-80 .advanced-parameter-inner::before,
#parameter-id-80 .advanced-parameter-inner::after{
  content: none !important;
  display: none !important;
}

/* Vybraný stav – žádný velký obrys kolem, jen čistý jemný ring na čtverci */
#parameter-id-80 label.advanced-parameter:has(input[type="radio"]:checked) .advanced-parameter-inner{
  box-shadow:
    inset 0 0 0 2px rgba(0,0,0,.70),
    inset 0 0 0 3px rgba(255,255,255,.65) !important;
}

/* Zruš “focus” outline na labelu, aby to nevypadalo jako checkbox */
#parameter-id-80 label.advanced-parameter{
  outline: none !important;
  box-shadow: none !important;
}

/* Volitelně: schovej text „Ivory / Bílá“ vedle čtverců, když ho nechceš */
#parameter-id-80 .parameter-value{
  display: none !important;
}