/* =========================================================================
   Memory Pet Shop – konfigurátor detailu produktu (site-wide)
   Nasazuje se do: Vzhled a obsah → Editor → Záhlaví (odkaz na tento soubor)
   Scope: html body.mc-on  (třídu přidává JS po rozpoznání režimu)
   Režimové varianty: body.mc-mode-{klasik|premium|sperky|seeyou|laser|psv1}
   ========================================================================= */

html body.mc-on{
  --mc-font-display:'Poppins',sans-serif;
  --mc-font-body:'Inter',sans-serif;
  --mc-ink:#14161a; --mc-ink-2:#3f454e; --mc-muted:#767d89;
  --mc-line:#e3e5e9; --mc-line-soft:#eef0f3; --mc-surface:#fff;
  --mc-accent:#77b82a; --mc-accent-dark:#66a022; --mc-accent-soft:#f2f8e8;
  --mc-gold:#e9cf82; --mc-gold-ink:#9a7b2e; --mc-gold-soft:#fdfaf1;
}

/* ---------- typografie (!important jen u font-family) ---------- */
html body.mc-on,
html body.mc-on .p-detail{ font-family:var(--mc-font-body)!important; color:var(--mc-ink); }
html body.mc-on .p-detail h1,
html body.mc-on .p-detail .h1,
html body.mc-on .p-detail h2,
html body.mc-on .p-detail h3{ font-family:var(--mc-font-display)!important; letter-spacing:-.015em; }
html body.mc-on .p-info-headline .h1,
html body.mc-on .p-info-headline h1{ font-size:30px; line-height:1.18; font-weight:600; margin:8px 0 10px; }
html body.mc-on .p-short-description-block,
html body.mc-on .p-short-description{ font-size:15px; color:var(--mc-ink-2); margin-bottom:20px; }

/* ---------- levý sloupec: popis pod galerií ---------- */
html body.mc-on .mc-desc{ margin-top:26px; background:var(--mc-surface); border:1px solid var(--mc-line); border-radius:10px; padding:28px 30px; }
html body.mc-on .mc-desc h2{margin:0 0 16px;font-size:20px;font-weight:600}
html body.mc-on .mc-desc h3{margin:26px 0 10px;font-size:16px;font-weight:600}
html body.mc-on .mc-desc p,
html body.mc-on .mc-desc li{color:var(--mc-ink-2);font-size:15px;max-width:66ch}
html body.mc-on .mc-desc p{margin:0 0 13px}
html body.mc-on .mc-desc ul{margin:0 0 4px;padding-left:19px}
html body.mc-on .mc-desc li{margin-bottom:7px}

/* schová původní záložku s popisem, hodnocení necháváme */
html body.mc-on .p-detail-tabs a[href="#description"],
html body.mc-on .p-detail-tabs li:has(a[href="#description"]){display:none}

/* ---------- blok o sklárně ---------- */
html body.mc-on .mc-origin{ position:relative; margin:30px 0 0; padding:22px 24px 20px; background:var(--mc-gold-soft); border:1px solid var(--mc-gold); border-left-width:3px; border-radius:8px; }
html body.mc-on .mc-origin .mc-kicker{ display:inline-block;max-width:calc(100% - 110px); font-family:var(--mc-font-display)!important; font-size:11px;font-weight:600; letter-spacing:.11em;text-transform:uppercase; color:var(--mc-gold-ink);margin-bottom:9px; text-decoration:none; border-bottom:1px solid rgba(154,123,46,.35); padding-bottom:1px; }
html body.mc-on .mc-origin .mc-kicker:hover{border-bottom-color:var(--mc-gold-ink)}
html body.mc-on .mc-origin .mc-arr{font-size:10px;opacity:.75;letter-spacing:0}
html body.mc-on .mc-origin h3{margin:0 0 10px;font-size:18px;font-weight:600;max-width:64ch}
html body.mc-on .mc-origin-logo{ position:absolute;top:20px;right:22px; height:36px;width:auto;max-width:72px; opacity:.95;pointer-events:none; }
@media(max-width:640px){ html body.mc-on .mc-origin-logo{position:static;display:block;margin:0 0 12px} }
html body.mc-on .mc-origin p{margin:0 0 14px;max-width:64ch;color:var(--mc-ink-2)}
html body.mc-on .mc-origin ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
html body.mc-on .mc-origin li{ display:flex;gap:10px;align-items:flex-start; margin:0;font-size:14.5px;color:var(--mc-ink-2);max-width:64ch; }
html body.mc-on .mc-origin li::before{ content:"";flex:none;width:7px;height:7px;margin-top:8px; border-radius:50%;background:var(--mc-gold); }

/* tlačítko videa */
html body.mc-on .mc-video-link{ display:inline-flex;align-items:center;gap:13px;margin-top:18px; padding:11px 16px 11px 13px;border-radius:8px; background:#fff;border:1px solid var(--mc-gold); color:var(--mc-ink);text-align:left;font:inherit;cursor:pointer; transition:background .15s ease,transform .15s ease; }
html body.mc-on .mc-video-link:hover{background:var(--mc-gold-soft);transform:translateY(-1px)}
html body.mc-on .mc-video-link .mc-play{ flex:none;width:30px;height:30px;border-radius:50%; background:var(--mc-gold);color:#fff;font-size:11px; display:flex;align-items:center;justify-content:center;padding-left:2px; }
html body.mc-on .mc-video-link .mc-vt{display:block;font-size:14px;font-weight:600}
html body.mc-on .mc-video-link .mc-vs{display:block;font-size:12px;color:var(--mc-muted);margin-top:1px}

/* ---------- modální okno s videem ---------- */
.mc-modal[hidden]{display:none}
.mc-modal{ position:fixed;inset:0;z-index:10000; display:flex;align-items:center;justify-content:center;padding:24px; font-family:'Inter',sans-serif!important; }
.mc-modal-backdrop{position:absolute;inset:0;background:rgba(12,13,16,.72)}
.mc-modal-box{ position:relative;width:min(920px,100%); background:#fff;border-radius:12px;overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.35); }
.mc-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px 14px}
.mc-modal-title{font-family:'Poppins',sans-serif!important;font-size:17px;font-weight:600}
.mc-modal-sub{font-size:13px;color:#767d89;margin-top:2px}
.mc-modal-close{ flex:none;width:34px;height:34px;border:1px solid #e3e5e9;border-radius:50%; background:#fff;color:#3f454e;font-size:20px;line-height:1;cursor:pointer; }
.mc-modal-close:hover{background:#eef0f3}
.mc-modal-video{aspect-ratio:16/9;background:#0c0d10}
.mc-modal-video iframe{width:100%;height:100%;border:0;display:block}
.mc-modal-foot{display:flex;gap:20px;flex-wrap:wrap;padding:14px 20px 16px;font-size:13px}
.mc-modal-foot a{color:#9a7b2e;text-decoration:none;font-weight:500}
.mc-modal-foot a:hover{text-decoration:underline}
body.mc-modal-open{overflow:hidden}

/* ---------- pravý sloupec: cena ---------- */
html body.mc-on .p-final-price-wrapper .price-final-holder,
html body.mc-on .p-info-grid .price-final strong{ font-family:var(--mc-font-display)!important; font-size:34px;font-weight:600;line-height:1;letter-spacing:-.02em; }
html body.mc-on .mc-breakdown{ font-size:13px;color:var(--mc-muted); min-height:20px;margin:8px 0 16px; }
html body.mc-on .mc-breakdown b{color:var(--mc-ink-2);font-weight:500}

/* ---------- karta personalizace ---------- */
html body.mc-on .mc-perso{ border:1px solid var(--mc-line); border-radius:10px;background:var(--mc-surface); padding:20px 20px 6px;margin:4px 0 22px; }
html body.mc-on .mc-perso-head h3{margin:0;font-size:15px;font-weight:600}
html body.mc-on .mc-perso-head .mc-sub{ display:block;font-size:12.5px;color:var(--mc-muted); margin:4px 0 14px;line-height:1.5; }
html body.mc-on .mc-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:520px){html body.mc-on .mc-grid2{grid-template-columns:1fr}}

/* kontejnery doplňku uvnitř karty – žádné odsazení */
html body.mc-on .mc-perso #dkLabNoteMainWrapper,
html body.mc-on .mc-perso #dkLabNoteDetailWrapper{ display:block;margin:0;padding:0;border:0;background:none; }

/* pole doplňku */
html body.mc-on .mc-perso .dkLabNoteDetailDiv{margin:0 0 14px}
html body.mc-on .mc-grid2 .dkLabNoteDetailDiv{margin-bottom:0}
html body.mc-on .mc-perso .dkLabNoteHeader{ display:block;font-size:11px;font-weight:600;letter-spacing:.08em; text-transform:uppercase;color:var(--mc-muted);margin-bottom:6px; }
html body.mc-on .mc-perso .dkLabNoteHeader span{font-size:inherit;font-weight:inherit;color:inherit}
html body.mc-on .mc-perso .dkLabNoteHeader span + span{color:var(--mc-accent-dark)}
html body.mc-on .mc-perso textarea.dkLabNote{ width:100%;font-family:var(--mc-font-body)!important;font-size:15px;color:var(--mc-ink); background:var(--mc-surface);border:1px solid var(--mc-line);border-radius:8px; padding:11px 13px;height:auto;min-height:0;resize:none;overflow:hidden; line-height:1.35;box-shadow:none; transition:border-color .15s ease,box-shadow .15s ease; }
html body.mc-on .mc-perso textarea.dkLabNote:focus{ outline:none;border-color:var(--mc-accent); box-shadow:0 0 0 3px rgba(119,184,42,.16); }
html body.mc-on .mc-perso textarea.dkLabNote::placeholder{ color:#b9bec6;font-style:italic;opacity:1; }
html body.mc-on .mc-counter{ font-size:11px;color:var(--mc-muted);text-align:right; margin-top:4px;font-variant-numeric:tabular-nums; }

/* ---------- nahrání fotky (laser/psv1) ---------- */
html body.mc-on .mc-label{ display:block;font-size:11px;font-weight:600;letter-spacing:.08em; text-transform:uppercase;color:var(--mc-muted);margin-bottom:6px; }
html body.mc-on .mc-req{color:var(--mc-accent-dark)}
html body.mc-on .mc-upload{ border:1.5px dashed var(--mc-line);border-radius:8px; background:#fcfcfd;padding:14px 15px;margin:0 0 16px; }
html body.mc-on .mc-upload input[type="file"]{ font-family:var(--mc-font-body)!important;font-size:13px;color:var(--mc-ink-2);max-width:100%; }
html body.mc-on .mc-note-free{font-size:12px;color:var(--mc-muted);margin-top:5px}

/* ---------- volný text v ceně (laser/psv1) ---------- */
html body.mc-on .mc-free{margin:0 0 8px}

/* ---------- příplatkový text (klasik/premium) ---------- */
html body.mc-on .mc-upsell{ border-top:1px solid var(--mc-line-soft); margin:6px -20px 0;padding:16px 20px 18px; transition:background .2s ease; }
html body.mc-on .mc-upsell.is-on{background:var(--mc-accent-soft)}
html body.mc-on .mc-check{display:flex;gap:11px;align-items:flex-start;cursor:pointer;margin:0}
html body.mc-on .mc-check input{ width:17px;height:17px;margin:2px 0 0; accent-color:var(--mc-accent);flex:none;cursor:pointer; }
html body.mc-on .mc-check .mc-t{font-size:14px;font-weight:500;color:var(--mc-ink)}
html body.mc-on .mc-check .mc-s{ font-size:12.5px;color:var(--mc-muted); display:block;margin-top:2px;font-weight:400; }
html body.mc-on .mc-chip{ display:inline-block;margin-left:8px;padding:1px 8px;border-radius:99px; background:var(--mc-accent);color:#fff;font-size:11.5px;font-weight:600;vertical-align:1px; }
html body.mc-on .mc-upsell .dkLabNoteDetailDiv{display:none;margin-top:14px}
html body.mc-on .mc-upsell.is-on .dkLabNoteDetailDiv{display:block}
html body.mc-on .mc-upsell .dkLabNoteHeader{display:none}

/* původní select příplatku schováme až když JS vytvořil náhradu */
html body.mc-on.mc-ready .mc-surcharge-hidden{ position:absolute!important;width:1px;height:1px; overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap; }

/* ---------- parametry ---------- */
html body.mc-on .mc-specs{ margin-top:28px;padding-top:22px;border-top:1px solid var(--mc-line); }
html body.mc-on .mc-specs h2{ margin:0 0 4px;font-family:var(--mc-font-body)!important; font-size:11px;font-weight:600;letter-spacing:.08em; text-transform:uppercase;color:var(--mc-muted); }
html body.mc-on .mc-specs dl{ display:grid;grid-template-columns:auto 1fr;margin:0; }
html body.mc-on .mc-specs dt,
html body.mc-on .mc-specs dd{ padding:9px 0;border-top:1px solid var(--mc-line-soft);margin:0; }
html body.mc-on .mc-specs dt{ font-size:13.5px;color:var(--mc-muted);padding-right:26px;white-space:nowrap; }
html body.mc-on .mc-specs dd{ font-size:14px;color:var(--mc-ink-2);text-align:right; }
@media(max-width:560px){
  html body.mc-on .mc-specs dl{grid-template-columns:1fr}
  html body.mc-on .mc-specs dt{white-space:normal;padding-bottom:0;border-bottom:0}
  html body.mc-on .mc-specs dd{text-align:left;padding-top:2px;border-top:0}
}

/* titulky v pravém sloupci */
html body.mc-on .p-info-grid .detail-grid-title,
html body.mc-on .mc-variants .detail-grid-title{ font-family:var(--mc-font-body)!important; font-size:11px;font-weight:600;letter-spacing:.08em; text-transform:uppercase;color:var(--mc-muted);margin-bottom:6px; }

/* popis: šablona mu dává poloviční šířku */
html body.mc-on .mc-desc .basic-description{ width:100%!important;max-width:none!important; float:none!important;display:block!important; padding:0!important;margin:0!important; }
html body.mc-on .mc-desc .extended-description{display:none!important}

/* tlačítko do košíku */
html body.mc-on .add-to-cart .btn,
html body.mc-on .add-to-cart button[type="submit"]{ font-family:var(--mc-font-display)!important; font-size:16px;font-weight:600;letter-spacing:.01em; border-radius:8px;padding:14px 20px; }

@media(prefers-reduced-motion:reduce){ html body.mc-on *{transition:none!important} }
