/* Trendy Vlasy: výběr odstínu 2.1 (platí jen když JS přidá body.tvsp-on, tj. jen na testovaném produktu) */
.tvsp{--sp-pink:#C4176F;--sp-pink-soft:#FCE8F0;--sp-ink:#2B1B22;--sp-muted:#5E4A53;--sp-line:#EADCE2;--sp-cream:#FBF7F3;--sp-dot:72px;--sp-r:12px;
 font-family:Poppins,Arial,sans-serif;color:var(--sp-ink);margin:4px 0 18px;max-width:100%}
.tvsp *,.tvsp *::before,.tvsp *::after{box-sizing:border-box}

/* nativní výběr zůstává funkční, jen ho není vidět */
body.tvsp-on .p-variants-block>.variant-list,
body.tvsp-on .p-variants-block .variant-list,
body.tvsp-on .p-variants-block .detail-parameters .variant-list{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;margin:-1px!important;padding:0!important;border:0!important}
body.tvsp-on .tvs-shade-picked{display:none!important}
body.tvsp-on .p-variants-block{position:relative}

/* nadpis ODSTÍN — název */
.tvsp-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px;font-size:13px;line-height:1.5;letter-spacing:.2em;text-transform:uppercase;margin:0 0 14px;padding-top:16px;border-top:1px solid var(--sp-line)}
.tvsp-label{font-weight:400;color:var(--sp-muted)}
.tvsp-dash{color:var(--sp-muted)}
.tvsp-name{font-weight:500;color:var(--sp-muted)}
.tvsp-head .tvsp-name{font-weight:600}
.tvsp.is-picked .tvsp-name{color:var(--sp-ink)}

/* filtry */
/* filtry: bez vodorovného posouvání, na mobilu se vejdou / zalomí */
.tvsp-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:2px 0;overflow:visible;max-width:100%}
.tvsp-chip{flex:none;appearance:none;font:600 12px/1 Poppins,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--sp-ink);background:#fff;border:1px solid #cdbfc5;border-radius:999px;padding:0 20px;min-height:40px;cursor:pointer;transition:background-color .18s,color .18s}
.tvsp-chip:hover{background:var(--sp-pink-soft)}
.tvsp-chip[aria-pressed="true"]{background:var(--sp-ink);border-color:var(--sp-ink);color:#fff}
.tvsp-chip:focus-visible,.tvsp-sw:focus-visible,.tvsp-match:focus-visible,.tvsp-slot:focus-within{outline:2px solid var(--sp-pink);outline-offset:3px}

/* mřížka koleček */
.tvsp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--sp-dot),1fr));gap:14px 10px;align-items:start;justify-items:center}

.tvsp-sw{position:relative;appearance:none;background:none;border:0;padding:0;margin:0;width:100%;max-width:calc(var(--sp-dot) + 16px);display:flex;flex-direction:column;align-items:center;gap:6px;font-family:inherit;color:var(--sp-ink);border-radius:var(--sp-r);cursor:pointer;-webkit-tap-highlight-color:transparent}
.tvsp-dot{position:relative;display:block;width:var(--sp-dot);height:var(--sp-dot);border-radius:var(--sp-r);overflow:hidden;background:var(--sp-cream);box-shadow:inset 0 0 0 1px rgba(43,27,34,.12);transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .2s}
.tvsp-dot img{width:100%;height:100%;object-fit:cover;display:block}
.tvsp-code{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:12px;font-weight:600;color:var(--sp-muted)}
.tvsp-sw[aria-checked="true"] .tvsp-dot{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--sp-ink)}
@media (hover:hover){.tvsp-sw:hover .tvsp-dot{transform:scale(1.06)}}
.tvsp-sw[aria-checked="true"]:hover .tvsp-dot{transform:none}

/* vyprodané: poloprůhledné a přeškrtnuté */
.tvsp-sw.is-out .tvsp-dot img{opacity:.45}
.tvsp-sw.is-out .tvsp-dot::after{content:"";position:absolute;left:50%;top:-12%;width:2px;height:124%;margin-left:-1px;background:var(--sp-ink);transform:rotate(45deg);border-radius:2px;opacity:.7;pointer-events:none}
.tvsp-sw[aria-disabled="true"]{cursor:not-allowed}

/* filtr: skryté odstíny opravdu schovat (display:flex by jinak přebil atribut hidden) */
.tvsp-sw[hidden]{display:none!important}
/* kód a název pod fotkou */
.tvsp-cap{display:flex;flex-direction:column;align-items:center;text-align:center;line-height:1.25;letter-spacing:0;text-transform:none}
.tvsp-cap b{font-size:13px;font-weight:700;color:var(--sp-ink)}
.tvsp-cap span{font-size:11.5px;color:var(--sp-muted);margin-top:2px;overflow-wrap:break-word;hyphens:manual;max-width:100%}
.tvsp-cap em{font-style:normal;font-size:11px;font-weight:600;color:var(--sp-pink);margin-top:3px}
.tvsp-sw[aria-checked="true"] .tvsp-cap span{color:var(--sp-ink)}
.tvsp-tip{display:none!important}
/* tooltip s názvem */
.tvsp-tip{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translate(-50%,4px);background:var(--sp-ink);color:#fff;font-size:12px;font-weight:500;line-height:1.35;letter-spacing:0;text-transform:none;white-space:nowrap;padding:7px 10px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;z-index:5}
.tvsp-tip::after{content:"";position:absolute;left:50%;top:100%;margin-left:-5px;border:5px solid transparent;border-top-color:var(--sp-ink)}
@media (hover:hover){.tvsp-sw:hover .tvsp-tip{opacity:1;transform:translate(-50%,0)}}
.tvsp-sw:focus-visible .tvsp-tip{opacity:1;transform:translate(-50%,0)}

/* pruh „Nejste si jistá odstínem?“ (jako info box u Lullabellz, v našich barvách) */
.tvsp-match{appearance:none;display:flex;align-items:center;gap:12px;width:100%;margin:0 0 18px;padding:14px 16px;text-align:left;font:400 14px/1.45 Poppins,Arial,sans-serif;color:var(--sp-ink);background:#F4ECE4;border:1px solid transparent;border-radius:12px;cursor:pointer;transition:border-color .18s,background-color .18s}
.tvsp-match-ic{flex:none;display:flex;color:var(--sp-pink)}
.tvsp-match-txt{flex:1;min-width:0}
.tvsp-match-txt b{font-weight:600}
.tvsp-match-go{flex:none;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;text-decoration:underline;text-underline-offset:4px;color:var(--sp-ink)}
@media (hover:hover){.tvsp-match:hover{border-color:var(--sp-ink)}}
.tvsp-match[aria-pressed="true"]{background:var(--sp-pink-soft);border-color:var(--sp-ink)}
.tvsp-match[aria-pressed="true"] .tvsp-match-go{display:none}
@media (max-width:767px){.tvsp-match{flex-wrap:wrap;gap:8px 12px}.tvsp-match-txt{flex-basis:calc(100% - 34px)}.tvsp-match-go{margin-left:32px}}

/* nahrání fotek */
.tvsp-upload{margin-top:18px;background:#fff;border:1px solid var(--sp-line);border-radius:18px;padding:16px}
.tvsp-upload[hidden]{display:none}
.tvsp-up-head{display:flex;flex-direction:column;gap:3px;margin-bottom:12px}
.tvsp-up-head strong{font-family:Georgia,'Times New Roman',serif;font-size:18px;font-weight:400;line-height:1.3}
.tvsp-up-head span{font-size:13px;line-height:1.5;color:var(--sp-muted)}
.tvsp-slots{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tvsp-slot{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;min-height:132px;padding:14px 10px;background:#FFFAFC;border:1.5px dashed #d9a9bf;border-radius:14px;cursor:pointer;overflow:hidden;transition:border-color .2s,background-color .2s}
@media (hover:hover){.tvsp-slot:hover{border-color:var(--sp-pink);background:#fffafc}}
.tvsp-file{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.tvsp-slot-ic{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--sp-pink-soft);color:var(--sp-pink);margin-bottom:4px}
.tvsp-slot-t{font-size:13px;font-weight:600;line-height:1.3}
.tvsp-slot-s{font-size:12px;line-height:1.35;color:var(--sp-muted)}
.tvsp-slot-ok{display:none;align-items:center;gap:4px;font-size:12px;font-weight:600;color:#fff;background:#2f7d4f;border-radius:999px;padding:4px 9px;position:absolute;left:8px;bottom:8px;z-index:2}
.tvsp-slot-prev{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;pointer-events:none}
.tvsp-slot.is-done{border-style:solid;border-color:#2f7d4f}
.tvsp-slot.is-done .tvsp-slot-ok{display:inline-flex}
.tvsp-up-note{margin:8px 0 0;font-size:12.5px;color:var(--sp-pink)}
.tvsp-up-note:empty{display:none}

/* postup ve 3 krocích + potvrzení u košíku */
.tvsp-steps{list-style:none;counter-reset:tvsp;margin:0 0 14px;padding:0;display:grid;gap:8px}
.tvsp-steps li{counter-increment:tvsp;position:relative;padding-left:32px;font-size:13px;line-height:1.5;color:var(--sp-muted)}
.tvsp-steps li b{color:var(--sp-ink);font-weight:600}
.tvsp-steps li::before{content:counter(tvsp);position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:var(--sp-ink);color:#fff;font-size:11.5px;font-weight:600;display:flex;align-items:center;justify-content:center}
.tvsp-cart-hint{display:flex;align-items:flex-start;gap:8px;margin:0 0 10px;padding:10px 14px;background:#EEF6F0;border:1px solid #CFE5D6;border-radius:12px;font:13px/1.45 Poppins,Arial,sans-serif;color:#2B1B22}
.tvsp-cart-hint[hidden]{display:none}
.tvsp-cart-hint svg{flex:none;margin-top:3px;color:#2f7d4f}
.tvsp-cart-hint b{font-weight:600}

/* doplněk dkLAB: schovaný, dokud není vybraná „Nejsem si jistá“; v kartě s fotkami zůstanou jen jeho hlášky */
.tvsp-dk-src.tvsp-dk-off{display:none!important}
.tvsp-dk #dkLabNoteMainWrapper,.tvsp-dk .dkLabNoteAttachmentWrapper,.tvsp-dk #dkLabNoteFileForm{margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;display:block}
.tvsp-dk .dkLabFileButton,.tvsp-dk #dkLabNoteFile{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;margin:-1px!important;padding:0!important;border:0!important;opacity:0!important}
.tvsp-dk .dkLabNoteResult{font:12px/1.5 Poppins,Arial,sans-serif!important;color:#5E4A53!important;background:none!important;border:0!important;padding:0!important;margin:8px 0 0!important}
.tvsp-dk .dkLabNoteResult:empty{display:none!important}
.tvsp-dk .dkLabNoteResult .tick{display:none}
.tvsp-dk .dkLabNoteResult.success,.tvsp-dk .dkLabNoteUpload{color:#2f7d4f!important;font-weight:500!important}
.tvsp-dk .dkLabNoteResult.error{color:#C4176F!important}
.tvsp-dk img{max-width:56px;max-height:56px;border-radius:10px;object-fit:cover}
.tvsp-dk ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tvsp-dk textarea{width:100%;min-height:84px;border:1px solid #EADCE2;border-radius:12px;padding:10px 12px;font:14px/1.5 Poppins,Arial,sans-serif;color:#2B1B22;background:#fff;margin-top:10px}
.tvsp-dk textarea:focus{outline:2px solid #C4176F;outline-offset:1px;border-color:transparent}

@media (min-width:768px){
 .tvsp-grid{grid-template-columns:repeat(auto-fill,calc(var(--sp-dot) + 14px));justify-content:start;gap:16px 6px}
}
@media (max-width:767px){
 .tvsp{--sp-dot:64px;--sp-r:10px}
 .tvsp-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 4px}
 .tvsp-tip{display:none}
 .tvsp-filters{gap:6px}
 .tvsp-chip{flex:1 1 auto;font-size:11px;letter-spacing:.06em;padding:0 10px;min-height:38px}
}
@media (prefers-reduced-motion:reduce){.tvsp *{transition:none!important}}