.tt-vclassic { position: relative; }
.tt-vclassic__btn { box-sizing: border-box; display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 12px; border: 1px solid #d7dde6; border-radius: 6px; background: #fff; color: #0A1628; font: inherit; font-size: 14px; line-height: normal; cursor: pointer; }
.tt-vclassic__thumb { flex-shrink: 0; display: block; width: 26px; height: 26px; border-radius: 4px; object-fit: cover; }
.tt-vclassic__label { flex: 1; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.tt-vclassic__pop { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 120; max-height: 320px; overflow: hidden auto; background: #fff; border: 1px solid #E3E8EF; border-radius: 10px; box-shadow: 0 16px 40px rgba(10,22,40,.16); }
.tt-vclassic__opt { display: flex; align-items: center; gap: 11px; width: 100%; padding: 9px 12px; border: 0; background: none; color: #0A1628; font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
.tt-vclassic__opt + .tt-vclassic__opt { border-top: 1px solid #F0F2F5; }
.tt-vclassic__opt:hover { background: rgba(10,22,40,.04); }
.tt-vclassic__opt.is-on { background: rgba(10,22,40,.06); }
.tt-vclassic__opt-thumb { flex-shrink: 0; display: block; width: 36px; height: 36px; border: 1px solid #E6E8EC; border-radius: 6px; object-fit: cover; }
.tt-vclassic__opt-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tt-vclassic__opt-price { color: #5A6B7B; font-size: 12.5px; }
.tt-vclassic__opt-check { color: #0A1628; font-weight: 800; opacity: 0; }
.tt-vclassic__opt.is-on .tt-vclassic__opt-check { opacity: 1; }
.tt-variant-picker { display: flex; flex-direction: column; gap: 16px; }
.tt-variant-picker__option { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.tt-variant-picker__values { display: flex; flex-wrap: wrap; gap: 8px; }
.tt-variant-picker--equal .tt-variant-picker__values { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); }
.tt-variant-pill { position: relative; }
.tt-variant-pill input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.tt-variant-pill span { display: block; padding: 8px 16px; text-align: center; background: var(--tt-variant-background); color: var(--tt-variant-text); border: var(--tt-variant-border-width) solid var(--tt-variant-border); border-radius: var(--tt-variant-radius); }
.tt-variant-pill input:checked + span { background: var(--tt-variant-selected-background); color: var(--tt-variant-selected-text); border-color: var(--tt-variant-selected-border); }
.tt-variant-pill input:focus-visible + span { outline: 2px solid currentColor; outline-offset: 2px; }
.tt-variant-pill.is-unavailable span { text-decoration: line-through; opacity: .55; }