/* ==========================================================================
   topblat.ro — pagina de produs (B4): galerie, rezumat, butoane, calculator, taburi, „Cele mai bine vândute”,
   „Solicită ofertă rapidă”, imaginile pe tot ecranul și „Vizualizare rapidă” (fragmentul din catalog).
   Aspectul vechiului site (tema MyMedi + pluginurile AIROD). Toate regulile sunt sub .tbp-* / .tbc-* (fără reguli globale).
   ========================================================================== */

/* ---------- așezarea ---------- */
.tbp { padding-bottom: 30px; }
.tbp-firimituri { padding: 20px 0 30px; }
.tbp-sus { display: grid; grid-template-columns: minmax(0, 570fr) minmax(0, 640fr); gap: 30px; align-items: start; }

/* ---------- galeria ---------- */
.tbp-galerie { position: relative; min-width: 0; }
/* touch-action: glisarea orizontală o tratează galeria (produs.js), nu browserul („înapoi” în istoric); cea verticală derulează pagina */
.tbp-galerie__scena { position: relative; overflow: hidden; background: #f4f6f7; border-radius: 4px; touch-action: pan-y pinch-zoom; }
.tbp-galerie__mare { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; position: relative; }
.tbp-galerie__mare img { display: block; width: 100%; height: 100%; object-fit: contain; }
.tbp-galerie__gol { aspect-ratio: 1 / 1; }
.tbp-galerie__zoom {
    position: absolute; inset: 0; opacity: 0; pointer-events: none; background-color: #fff; background-repeat: no-repeat;
    background-size: 200% auto; transition: opacity .15s ease;
}
.tbp-galerie__scena.is-zoom .tbp-galerie__zoom { opacity: 1; }
.tbp-reducere {
    position: absolute; top: 5px; left: 5px; z-index: 3; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%;
    background: var(--tb-verde, #0a5c48); color: #fff; font-size: 12px; line-height: 1; font-weight: 600; pointer-events: none;
}
.tbp-galerie__sag {
    position: absolute; top: 50%; z-index: 3; display: grid; place-items: center; width: 40px; height: 40px; margin-top: -20px; padding: 0;
    border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); color: #000; box-shadow: 0 6px 18px rgba(0, 0, 0, .14);
    opacity: .9; transition: opacity .15s ease, background-color .15s ease, color .15s ease;
}
.tbp-galerie__sag:hover { background: var(--tb-verde, #0a5c48); color: #fff; opacity: 1; }
.tbp-galerie__sag--st { left: 12px; }
.tbp-galerie__sag--dr { right: 12px; }
.tbp-galerie__contor {
    position: absolute; right: 12px; bottom: 12px; z-index: 3; padding: 2px 10px; border-radius: 30px; background: rgba(0, 0, 0, .55);
    color: #fff; font-size: 12px; line-height: 22px; font-weight: 600; font-variant-numeric: tabular-nums; pointer-events: none;
}
.tbp-galerie__miniaturi { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 74px)); gap: 12px; }
.tbp-mini {
    display: block; width: 100%; aspect-ratio: 1; padding: 0; border: 1px solid transparent; border-radius: 3px; background: #f4f6f7;
    overflow: hidden; opacity: .75; transition: opacity .15s ease, border-color .15s ease;
}
.tbp-mini img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tbp-mini:hover { opacity: 1; }
.tbp-mini[aria-current="true"] { border-color: #000; opacity: 1; }

/* ---------- rezumatul ---------- */
.tbp-rezumat { min-width: 0; }
.tbp-stoc {
    display: inline-block; margin: 0 0 14px; padding: 2px 10px; border-radius: 20px; background: var(--tb-stoc, #12a05c); color: #fff;
    font-size: 10.5px; line-height: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em;
}
.tbp-stoc--comanda { background: #fff; color: var(--tb-verde, #0a5c48); box-shadow: inset 0 0 0 1px currentColor; }
.tbp-stoc--epuizat { background: #8a8f98; }
.tbp-titlu { margin: 0 0 14px; font-size: 25px; line-height: 1.3; font-weight: 700; color: var(--tb-verde, #0a5c48); letter-spacing: -.005em; }
.tbp-scurta { padding: 20px 0; border-top: 1px solid var(--tb-linie, #e6eaee); border-bottom: 1px solid var(--tb-linie, #e6eaee); font-size: 13px; line-height: 22px; }
.tbp-scurta > :last-child { margin-bottom: 0; }
.tbp-pret { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 22px 0 18px; color: var(--tb-verde, #0a5c48); }
.tbp-pret__nou { font-size: 42px; line-height: 1.15; font-weight: 600; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.tbp-pret__vechi { font-size: 23.5px; line-height: 1.2; color: var(--tb-pret-vechi, #9babcd); font-variant-numeric: tabular-nums; }
.tbp-pret__cerere {
    display: inline-flex; align-items: center; padding: 0; border: 0; background: none; color: var(--tb-verde, #0a5c48);
    font-size: 32px; line-height: 1.2; font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px;
}
.tbp-pret__cerere:hover { color: #000; }

/* variantele (finisaj / grosime) */
.tbp-variante { margin: 0 0 18px; padding: 0; border: 0; min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; }
.tbp-variante__eticheta { float: left; padding: 0; margin: 0; font-size: 14px; line-height: 20px; color: #000; }
.tbp-variante__optiuni { display: flex; flex-wrap: wrap; gap: 10px; }
.tbp-varianta { position: relative; display: inline-flex; cursor: pointer; }
.tbp-varianta input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.tbp-varianta span {
    display: inline-flex; align-items: center; min-height: 28px; padding: 3px 18px; border: 1px solid var(--tb-linie, #e6eaee); border-radius: 30px;
    background: #fff; color: #000; font-size: 12px; line-height: 20px; font-weight: 500; transition: border-color .15s ease, box-shadow .15s ease;
}
.tbp-varianta:hover span { border-color: #000; }
.tbp-varianta input:checked + span { border-color: #000; box-shadow: inset 0 0 0 1px #000; }
.tbp-varianta input:focus-visible + span { outline: 2px solid var(--tb-verde, #0a5c48); outline-offset: 2px; }
/* „Șterge” (ca „Clar” din WooCommerce): în rândul variantelor; ținta de atingere are 44 px, fără să mărească rândul */
.tbp-variante__sterge { flex: 0 0 auto; min-height: 44px; margin: -8px 0; padding: 0 6px; border: 0; background: none; color: #c0392b; font-size: 12px; line-height: 18px; text-align: left; }
/* stocul variantei alese, când diferă („Disponibil pentru pre-comenzi”), ca „woocommerce-variation-availability” */
.tbp-variante__stoc { flex-basis: 100%; margin: 0; font-size: 13px; line-height: 20px; font-weight: 600; color: var(--tb-verde, #0a5c48); }
.tbp-variante__stoc--epuizat { color: #8a8f98; }
.tbp-variante__sterge:hover { text-decoration: underline; }

/* butoanele (ca pe vechiul site) */
.tbp-cta { display: flex; flex-direction: column; gap: 12px; margin-top: 16px; }
.tbp-cta__rand { display: flex; gap: 12px; }
.tbp-cta__rand > * { width: 50%; min-width: 0; }
.tbp-cta__btn {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 14px 18px; border-radius: 14px;
    border: 1px solid transparent; font-size: 14px; line-height: 1.15; font-weight: 900; text-decoration: none; cursor: pointer;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .12); transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.tbp-cta__btn--oferta { justify-content: center; background: linear-gradient(180deg, #0f6f56, #0a5c48); color: #fff; }
.tbp-cta__btn--showroom { background: #fff; color: #0b2a17; border-color: rgba(0, 0, 0, .10); box-shadow: 0 10px 22px rgba(0, 0, 0, .06); }
.tbp-cta__btn--whatsapp { background: linear-gradient(180deg, #0f6f56, #0a5c48); color: #fff; }
.tbp-cta__sag { font-size: 20px; line-height: 1; opacity: .55; }
.tbp-cta__wa { width: 20px; height: 20px; flex: 0 0 auto; }
.tbp-cta__btn:hover, .tbp-cta__btn:focus-visible { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(0, 0, 0, .24); background: #000; color: #fff; border-color: #000; }
.tbp-cta__btn:hover .tbp-cta__sag { opacity: 1; }

/* cod, distribuire, brand */
.tbp-meta { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--tb-linie, #e6eaee); font-size: 12px; line-height: 20px; color: #000; }
.tbp-meta__rand { margin: 0 0 12px; }
.tbp-meta__rand span { margin-left: 6px; }
.tbp-meta__rand a { display: inline-block; padding: 12px 0; margin: -12px 0; color: #000; }
.tbp-meta__rand a:hover { color: var(--tb-verde, #0a5c48); }
.tbp-distribuie { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; padding: 0; }
.tbp-distribuie a {
    display: grid; place-items: center; width: 32px; height: 32px; border-radius: 3px; background: var(--tb-verde, #0a5c48); color: #fff;
    transition: background-color .15s ease;
}
.tbp-distribuie a:hover { background: #000; color: #fff; }
.tbp-distribuie svg { width: 16px; height: 16px; }

/* ---------- taburile ---------- */
.tbp-taburi { margin-top: 70px; }
.tbp-taburi__lista { display: flex; flex-wrap: wrap; gap: 6px 38px; margin-bottom: 24px; }
.tbp-tab {
    padding: 0; border: 0; background: none; color: var(--tb-verde, #0a5c48); font-size: 20px; line-height: 30px; font-weight: 400;
    text-decoration: none; text-underline-offset: 5px;
}
.tbp-tab:hover { color: #000; }
.tbp-tab[aria-selected="true"] { font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; }
.tbp-panou { padding: 50px; border: 1px solid var(--tb-linie, #e6eaee); border-radius: 4px; }
.tbp-panou:focus-visible { outline-offset: -2px; }
.tbp-text { max-width: 1100px; }
.tbp-text h2 { font-size: 22px; }
.tbp-text h3 { font-size: 18px; }
.tbp-text li { margin-bottom: .6em; }
/* listele de sigle (certificări) din textele vechiului site: pe orizontală, ca acolo („style-horizontal”) */
.tbp-text ul:has(> li > img) { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px; margin: .5rem 0 1rem; padding-left: 0; list-style: none; }
.tbp-text ul:has(> li > img) > li { display: flex; align-items: center; margin: 0; }
/* ca pe vechiul site (.qs-cert-logos): 80 px înălțime, 64 px pe telefon */
.tbp-text ul:has(> li > img) img { display: block; width: auto; height: 80px; border-radius: 0; }
.tbp-atribute { width: 100%; border-collapse: collapse; font-size: 13px; line-height: 20px; }
.tbp-atribute th, .tbp-atribute td { padding: 10px 20px; border: 1px solid var(--tb-linie, #e6eaee); text-align: left; vertical-align: top; }
.tbp-atribute th { width: 30%; background: var(--tb-gri, #f0f2f5); font-weight: 400; color: #000; }
.tbp-atribute td { font-weight: 700; }
.tbp-recenzii { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.tbp-recenzie__cap { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 6px; }
.tbp-stele { color: var(--tb-verde, #0a5c48); letter-spacing: 1px; }

/* ---------- „Cele mai bine vândute” (carusel, ca pe vechiul site: 4 vizibile pe desktop, 2 pe telefon, cutie cu chenar) ---------- */
.tbp-vandute { margin-top: 80px; }
.tbp-vandute__cap { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 0 0 28px; }
.tbp-vandute__titlu { margin: 0; font-size: 42px; line-height: 50px; font-weight: 700; color: var(--tb-verde, #0a5c48); letter-spacing: -.01em; }
.tbp-vandute__nav { display: flex; gap: 8px; flex: 0 0 auto; }
.tbp-vandute__nav[hidden] { display: none; }
.tbp-vandute__sag {
    display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid #dfe3e9; border-radius: 50%;
    background: #fff; color: #000; transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.tbp-vandute__sag:hover, .tbp-vandute__sag:focus-visible { background: var(--tb-verde, #0a5c48); border-color: var(--tb-verde, #0a5c48); color: #fff; }
/* cardul e al catalogului (.tb-card din colectie.css, adus de card); aici doar șina */
.tbp-vandute__sina {
    display: grid; grid-auto-flow: column; grid-auto-columns: 25%; overflow-x: auto; scroll-snap-type: x mandatory;
    scrollbar-width: none; overscroll-behavior-x: contain; border: 1px solid var(--tb-linie, #e6eaee); border-radius: 4px;
}
.tbp-vandute__sina::-webkit-scrollbar { display: none; }
.tbp-vandute__el { display: flex; min-width: 0; padding: 20px; border-right: 1px solid var(--tb-linie, #e6eaee); scroll-snap-align: start; }
.tbp-vandute__el:last-child { border-right: 0; }
.tbp-vandute__el > .tb-card { width: 100%; }

/* ==========================================================================
   CALCULATORUL (airod-countertop-calculator — front.css, aceleași valori)
   ========================================================================== */
.tbc { margin-top: 24px; color: #1a1f1c; }
.tbc-titlu { margin: 0 0 18px; font-size: 26px; line-height: 1.25; font-weight: 700; color: var(--tb-verde, #0a5c48); letter-spacing: -.01em; }
.tbc-card {
    max-width: 760px; padding: 16px; border: 1px solid rgba(18, 34, 26, .10); border-radius: 18px;
    background: linear-gradient(180deg, #fff, #f6f8f7); box-shadow: 0 12px 28px rgba(0, 0, 0, .08);
}
.tbc-sus { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.tbc-pasi { display: flex; align-items: center; gap: 10px; width: 100%; max-width: 240px; }
.tbc-bula {
    display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%;
    background: #eef3f0; border: 1px solid rgba(18, 34, 26, .10); color: rgba(26, 31, 28, .70); font-weight: 900; opacity: .7;
    transition: background-color .18s ease, box-shadow .18s ease;
}
.tbc-bula.is-activ { opacity: 1; background: rgba(34, 198, 107, .14); border-color: rgba(34, 198, 107, .40); color: #0b2a17; box-shadow: 0 0 0 4px rgba(34, 198, 107, .10); }
.tbc-linie { flex: 1; height: 2px; border-radius: 999px; background: linear-gradient(90deg, rgba(34, 198, 107, .55), rgba(0, 0, 0, .06)); }
.tbc-insigna {
    display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; margin: 0; padding: 9px 12px; border-radius: 999px;
    background: rgba(34, 198, 107, .08); border: 1px solid rgba(34, 198, 107, .18); font-size: 12px; line-height: 18px; color: rgba(26, 31, 28, .85);
}
.tbc-insigna b { margin: 0 6px 0 4px; color: #0b2a17; font-weight: 900; font-variant-numeric: tabular-nums; }
.tbc-insigna__punct { width: 8px; height: 8px; border-radius: 50%; background: #22c66b; box-shadow: 0 0 0 5px rgba(34, 198, 107, .10); }

.tbc-ico { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 10px; background: rgba(34, 198, 107, .12); border: 1px solid rgba(34, 198, 107, .18); color: #0f8f4c; flex: 0 0 auto; }
.tbc-ico svg { width: 18px; height: 18px; display: block; }
.tbc-ico--mic { width: 24px; height: 24px; border-radius: 9px; }
.tbc-ico--mic svg { width: 16px; height: 16px; }
.tbc-ico-mic { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 8px; border-radius: 8px; background: rgba(34, 198, 107, .10); border: 1px solid rgba(34, 198, 107, .16); color: #0f8f4c; vertical-align: -5px; }
.tbc-ico-mic svg { width: 14px; height: 14px; display: block; }

/* cantul */
.tbc-cant { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; padding: 12px; border-radius: 16px; background: #f0f4f2; border: 1px solid rgba(18, 34, 26, .10); min-width: 0; }
.tbc-cant__titlu { float: left; display: flex; align-items: center; gap: 10px; padding: 0; font-weight: 900; color: #12221a; font-size: 14px; line-height: 20px; }
.tbc-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-left: auto; }
.tbc-chip { position: relative; display: inline-flex; cursor: pointer; }
.tbc-chip input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.tbc-chip span {
    display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 999px; background: #fff; border: 1px solid rgba(18, 34, 26, .12);
    font-weight: 900; font-size: 13px; line-height: 18px; color: rgba(26, 31, 28, .90); transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.tbc-chip input:checked + span { border-color: rgba(34, 198, 107, .40); box-shadow: 0 10px 20px rgba(34, 198, 107, .12); transform: translateY(-1px); }
.tbc-chip input:focus-visible + span { outline: 2px solid var(--tb-verde, #0a5c48); outline-offset: 2px; }

/* panourile */
.tbc-panou { animation: tbcApare .18s ease; }
@keyframes tbcApare { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.tbc-grila { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.tbc-camp { min-width: 0; margin-bottom: 12px; }
.tbc-grila .tbc-camp { margin-bottom: 0; }
.tbc-panou[data-tbc-panou="2"] .tbc-grila { margin-bottom: 12px; }
.tbc-camp label { display: block; margin-bottom: 6px; font-size: 13px; line-height: 20px; color: rgba(26, 31, 28, .78); }
.tbc-obl { color: #0f8f4c; }
.tbc-input {
    display: block; width: 100%; height: 42px; padding: 0 12px; border: 1px solid rgba(18, 34, 26, .14); border-radius: 12px; background: #fff;
    color: #1a1f1c; font-size: 13px; outline: none; box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease;
}
.tbc-input--gri { border-color: transparent; background: var(--tb-gri, #f0f2f5); border-radius: 21px; padding: 0 20px; }
.tbc-input--zona { height: auto; min-height: 120px; padding: 12px 20px; border-color: rgba(18, 34, 26, .14); background: #fff; border-radius: 21px; resize: vertical; line-height: 22px; }
.tbc-input:focus { border-color: rgba(34, 198, 107, .45); box-shadow: 0 0 0 4px rgba(34, 198, 107, .12); }
.tbc-input[aria-invalid="true"] { border-color: rgba(220, 60, 60, .55); box-shadow: 0 0 0 3px rgba(220, 60, 60, .10); }
.tbc-select {
    appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 44px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%231a1f1c' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 16px center; background-size: 14px;
}
.tbc-subtitlu { display: flex; align-items: center; gap: 10px; margin: 16px 0 8px; padding: 0; font-size: 13px; line-height: 20px; font-weight: 900; color: #12221a; }
.tbc-incluse { list-style: none; display: flex; flex-direction: column; gap: 8px; margin: 10px 0 16px; padding: 0; }
.tbc-incluse li {
    display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid rgba(29, 189, 124, .20);
    background: rgba(29, 189, 124, .06); border-radius: 14px; font-size: 13px; line-height: 20px;
}
.tbc-incluse span { display: flex; align-items: center; gap: 8px; color: rgba(26, 31, 28, .90); }
.tbc-incluse b { color: rgba(26, 31, 28, .92); font-weight: 900; white-space: nowrap; }
.tbc-incluse em, .tbc-rezumat em { font-style: normal; font-weight: 800; opacity: .75; }
.tbc-bifa { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 18px; height: 18px; border-radius: 999px; background: rgba(29, 189, 124, .20); color: rgba(26, 31, 28, .95); font-style: normal; font-size: 11px; font-weight: 900; }
.tbc-extra { margin: 0; padding: 0; border: 0; min-width: 0; }
.tbc-extra .tbc-subtitlu { float: left; width: 100%; }
.tbc-radiouri { clear: both; display: flex; flex-direction: column; gap: 10px; }
.tbc-radio {
    display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px; background: #fff; border: 1px solid rgba(18, 34, 26, .12); border-radius: 14px;
    cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.tbc-radio:hover { border-color: rgba(34, 198, 107, .22); box-shadow: 0 10px 20px rgba(0, 0, 0, .06); transform: translateY(-1px); }
.tbc-radio:has(input:checked) { border-color: rgba(34, 198, 107, .45); }
.tbc-radio input { width: 16px; height: 16px; margin: 0; accent-color: #22c66b; flex: 0 0 auto; }
.tbc-radio span { font-weight: 900; font-size: 14px; line-height: 20px; color: rgba(26, 31, 28, .90); }

/* butoanele */
.tbc-actiuni { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 12px; }
.tbc-actiuni--doua { justify-content: space-between; }
.tbc-btn {
    display: inline-flex; align-items: center; gap: 10px; min-height: 42px; padding: 10px 14px; border: 0; border-radius: 12px; cursor: pointer;
    font-size: 13px; line-height: 18px; font-weight: 900; transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}
.tbc-btn__ico { width: 18px; height: 18px; display: block; }
.tbc-btn--plin { background: linear-gradient(180deg, #0f6f56, #0a5c48); color: #fff; box-shadow: 0 12px 22px rgba(34, 198, 107, .18); }
.tbc-btn--plin:hover { filter: brightness(1.04); transform: translateY(-1px); box-shadow: 0 14px 26px rgba(34, 198, 107, .22); }
.tbc-btn--gol { background: #fff; border: 1px solid rgba(18, 34, 26, .14); color: rgba(26, 31, 28, .92); }
.tbc-btn--gol:hover { border-color: rgba(34, 198, 107, .22); transform: translateY(-1px); }
.tbc-btn[disabled] { opacity: .7; cursor: progress; transform: none; }

/* rezultatul (pasul 2) */
.tbc-rezultat { display: flex; justify-content: space-between; align-items: stretch; gap: 12px; margin-bottom: 14px; padding: 14px; border-radius: 16px; background: #f0f4f2; border: 1px solid rgba(18, 34, 26, .10); }
.tbc-rezultat__st { min-width: 0; flex: 1 1 auto; }
.tbc-rezultat__eticheta { margin: 0 0 6px; color: rgba(26, 31, 28, .72); font-weight: 900; font-size: 12px; line-height: 18px; outline: none; }
.tbc-rezultat__val { margin: 0; font-size: 26px; line-height: 1.2; font-weight: 900; color: #0b2a17; font-variant-numeric: tabular-nums; }
.tbc-subpret { margin-top: 10px; color: rgba(26, 31, 28, .85); font-size: 12.5px; line-height: 1.4; }
.tbc-subpret p { margin: 0; }
.tbc-subpret__gri { margin-top: 6px !important; opacity: .8; font-weight: 800; }
.tbc-nota { margin-top: 12px !important; padding-top: 12px; border-top: 1px solid rgba(18, 34, 26, .08); color: rgba(26, 31, 28, .72); font-size: 11.5px; line-height: 1.55; }
.tbc-rezumat { flex: 0 0 auto; width: 240px; padding: 12px; background: #fff; border: 1px solid rgba(18, 34, 26, .12); border-radius: 14px; }
.tbc-rezumat__titlu { margin: 0 0 8px; font-weight: 900; font-size: 12px; line-height: 18px; color: #12221a; }
.tbc-rezumat__randuri { display: flex; flex-direction: column; gap: 6px; margin: 0; font-size: 12px; line-height: 18px; }
.tbc-rezumat__randuri > div { display: flex; justify-content: space-between; gap: 10px; color: rgba(26, 31, 28, .70); }
.tbc-rezumat__randuri dt { min-width: 0; }
.tbc-rezumat__randuri dd { margin: 0; text-align: right; color: rgba(26, 31, 28, .92); font-weight: 900; }

.tbc-acord { display: flex; align-items: center; gap: 12px; margin-top: 8px; color: rgba(26, 31, 28, .8); font-size: 12px; line-height: 18px; cursor: pointer; }
.tbc-acord input {
    appearance: none; -webkit-appearance: none; flex: 0 0 auto; width: 18px; height: 18px; margin: 0; border-radius: 5px; border: 1.5px solid rgba(0, 0, 0, .25);
    background: #fff; display: inline-grid; place-content: center; cursor: pointer; transition: all .15s ease;
}
.tbc-acord input:hover { border-color: rgba(0, 0, 0, .4); }
.tbc-acord input:checked { background: #0f8f4c; border-color: #0f8f4c; }
.tbc-acord input::after { content: ""; width: 9px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) scale(0); transition: transform .12s ease; margin-top: -2px; }
.tbc-acord input:checked::after { transform: rotate(-45deg) scale(1); }
.tbc-acord input[aria-invalid="true"] { border-color: rgba(220, 60, 60, .8); }
.tbc-acord a { color: #0f8f4c; text-decoration: none; border-bottom: 1px dashed rgba(34, 198, 107, .35); }

.tbc-mesaj { margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; font-weight: 800; font-size: 12px; line-height: 18px; }
.tbc-actiuni .tbc-mesaj { margin: 0; }
.tbc-mesaj--eroare { background: rgba(220, 60, 60, .10); border: 1px solid rgba(220, 60, 60, .18); color: rgba(140, 10, 10, .95); }
.tbc-mesaj--ok { background: rgba(34, 198, 107, .10); border: 1px solid rgba(34, 198, 107, .18); color: #0b2a17; }

/* ==========================================================================
   „Solicită ofertă rapidă” (aspectul #airod-offer-modal de pe vechiul site)
   ========================================================================== */
html.tbp-fara-derulare { overflow: hidden; }
/* câmpul-capcană anti-spam din formulare (calculator, ofertă rapidă) */
.tbp-capcana { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
dialog.tbp-dialog {
    position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 18px; border: 0;
    background: transparent; color: #fff; overflow: auto; color-scheme: dark;
}
dialog.tbp-dialog[open] { display: flex; align-items: center; justify-content: center; animation: tbpApare .18s ease; }
dialog.tbp-dialog::backdrop { background: rgba(0, 0, 0, .65); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
@keyframes tbpApare { from { opacity: 0; } to { opacity: 1; } }
.tbp-dialog__panou {
    width: min(720px, 100%); max-height: calc(100dvh - 36px); display: flex; flex-direction: column; overflow: hidden; border-radius: 22px;
    background: linear-gradient(180deg, #053a33, #032a25); border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 40px 90px rgba(0, 0, 0, .45);
}
.tbp-dialog__cap { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 16px 12px 22px; border-bottom: 1px solid rgba(255, 255, 255, .10); }
.tbp-dialog__titlu { margin: 0; color: #fff; font-size: 28px; line-height: 1.2; font-weight: 900; letter-spacing: -.01em; }
.tbp-dialog__x { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 auto; padding: 0; border: 0; border-radius: 50%; background: none; color: #fff; }
.tbp-dialog__x .tb-i { width: 24px; height: 24px; }
.tbp-dialog__x:hover { background: rgba(255, 255, 255, .10); }
.tbp-dialog__corp { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 16px 22px 22px; overflow: auto; }
.tbp-dialog__camp {
    width: 100%; min-height: 58px; padding: 16px; border: 1px solid rgba(255, 255, 255, .18); border-radius: 16px; background: rgba(0, 0, 0, .18);
    color: #fff; caret-color: #fff; font-size: 15px; line-height: 24px; outline: none; transition: border-color .15s ease, box-shadow .15s ease;
}
.tbp-dialog__camp::placeholder { color: rgba(255, 255, 255, .60); opacity: 1; }
.tbp-dialog__camp:focus { border-color: rgba(255, 255, 255, .45); box-shadow: 0 0 0 3px rgba(255, 255, 255, .10); }
.tbp-dialog__camp[aria-invalid="true"] { border-color: #ff9d8c; }
.tbp-dialog__camp:-webkit-autofill { -webkit-text-fill-color: #fff; box-shadow: 0 0 0 1000px #0b3f37 inset; transition: background-color 9999s ease-in-out 0s; }
.tbp-dialog__trimite {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 54px; padding: 14px 18px; border: 1px solid rgba(0, 0, 0, .10);
    border-radius: 14px; background: #fff; color: #0b2a17; font-size: 14px; line-height: 1.2; font-weight: 900; box-shadow: 0 10px 22px rgba(0, 0, 0, .06);
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
}
.tbp-dialog__trimite span { font-size: 20px; line-height: 1; opacity: .55; }
.tbp-dialog__trimite:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(0, 0, 0, .24); background: #000; color: #fff; border-color: #000; }
.tbp-dialog__trimite[disabled] { opacity: .75; cursor: progress; transform: none; }
.tbp-dialog__nota { margin: 0; font-size: 13px; line-height: 18px; color: rgba(255, 255, 255, .9); }
.tbp-dialog__stare { margin: 0; padding: 12px 14px; border-radius: 12px; font-size: 14px; line-height: 20px; font-weight: 700; }
.tbp-dialog__stare.is-ok { background: rgba(46, 204, 113, .18); border: 1px solid rgba(46, 204, 113, .35); color: #d8ffe8; }
.tbp-dialog__stare.is-eroare { background: rgba(231, 76, 60, .18); border: 1px solid rgba(231, 76, 60, .35); color: #ffd9d4; }
.tbp-dialog :focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* ==========================================================================
   imaginile pe tot ecranul
   ========================================================================== */
dialog.tbp-ecran {
    position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
    background: rgba(0, 0, 0, .92); color: #fff; overflow: hidden;
}
dialog.tbp-ecran[open] { display: grid; place-items: center; animation: tbpApare .18s ease; }
dialog.tbp-ecran::backdrop { background: rgba(0, 0, 0, .6); }
.tbp-ecran__img { max-width: 92vw; max-height: 88vh; max-height: 88dvh; width: auto; height: auto; object-fit: contain; border-radius: 4px; user-select: none; -webkit-user-drag: none; touch-action: pan-y; }
.tbp-ecran__x, .tbp-ecran__sag {
    position: absolute; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%;
    background: rgba(255, 255, 255, .12); color: #fff; transition: background-color .15s ease;
}
.tbp-ecran__x:hover, .tbp-ecran__sag:hover { background: rgba(255, 255, 255, .28); }
.tbp-ecran__x { top: 16px; right: 16px; }
.tbp-ecran__sag { top: 50%; margin-top: -24px; }
.tbp-ecran__sag--st { left: 16px; }
.tbp-ecran__sag--dr { right: 16px; }
.tbp-ecran__contor { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); padding: 2px 12px; border-radius: 30px; background: rgba(255, 255, 255, .12); font-size: 13px; line-height: 24px; font-weight: 600; font-variant-numeric: tabular-nums; }
dialog.tbp-ecran :focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* ==========================================================================
   „Vizualizare rapidă” (fragmentul GET /tb/rapid/{slug}/)
   ========================================================================== */
.tbp-rapid { display: grid; grid-template-columns: minmax(0, 520fr) minmax(0, 420fr); gap: 28px; align-items: start; color: #000; font-family: var(--tb-font, "Inter Tight", system-ui, sans-serif); font-size: 14px; line-height: 26px; }
.tbp-rapid--gol { display: block; padding: 30px; text-align: center; }
.tbp-rapid__galerie { position: relative; min-width: 0; }
.tbp-rapid__radio { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.tbp-rapid__img { display: none; margin: 0; background: #f4f6f7; border-radius: 4px; overflow: hidden; }
.tbp-rapid__radio:checked + .tbp-rapid__img { display: block; }
.tbp-rapid__img img { display: block; width: 100%; height: min(62vh, 560px); object-fit: contain; }
.tbp-rapid__mini { display: grid; grid-template-columns: repeat(auto-fill, minmax(56px, 74px)); gap: 12px; margin-top: 12px; }
.tbp-rapid__mini label { display: block; aspect-ratio: 1; border: 1px solid transparent; border-radius: 3px; overflow: hidden; cursor: pointer; opacity: .75; background: #f4f6f7; }
.tbp-rapid__mini label:hover { opacity: 1; }
.tbp-rapid__mini img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* miniatura imaginii afișate (fără JS: radio-ul bifat → eticheta cu același număr) */
.tbp-rapid__radio:nth-of-type(1):checked ~ .tbp-rapid__mini label:nth-of-type(1),
.tbp-rapid__radio:nth-of-type(2):checked ~ .tbp-rapid__mini label:nth-of-type(2),
.tbp-rapid__radio:nth-of-type(3):checked ~ .tbp-rapid__mini label:nth-of-type(3),
.tbp-rapid__radio:nth-of-type(4):checked ~ .tbp-rapid__mini label:nth-of-type(4),
.tbp-rapid__radio:nth-of-type(5):checked ~ .tbp-rapid__mini label:nth-of-type(5),
.tbp-rapid__radio:nth-of-type(6):checked ~ .tbp-rapid__mini label:nth-of-type(6),
.tbp-rapid__radio:nth-of-type(7):checked ~ .tbp-rapid__mini label:nth-of-type(7),
.tbp-rapid__radio:nth-of-type(8):checked ~ .tbp-rapid__mini label:nth-of-type(8),
.tbp-rapid__radio:nth-of-type(9):checked ~ .tbp-rapid__mini label:nth-of-type(9),
.tbp-rapid__radio:nth-of-type(10):checked ~ .tbp-rapid__mini label:nth-of-type(10),
.tbp-rapid__radio:nth-of-type(11):checked ~ .tbp-rapid__mini label:nth-of-type(11),
.tbp-rapid__radio:nth-of-type(12):checked ~ .tbp-rapid__mini label:nth-of-type(12) { border-color: #000; opacity: 1; }
.tbp-rapid__radio:focus-visible ~ .tbp-rapid__mini { outline: 2px solid var(--tb-verde, #0a5c48); outline-offset: 4px; border-radius: 4px; }
.tbp-rapid__info { min-width: 0; padding-top: 6px; }
.tbp-rapid__titlu { margin: 0 0 14px; font-size: 25px; line-height: 1.4; font-weight: 700; }
.tbp-rapid__titlu a { color: var(--tb-verde, #0a5c48); text-decoration: none; }
.tbp-rapid__titlu a:hover { color: #000; }
.tbp-pret--rapid { margin: 0; padding: 22px 0; border-top: 1px solid var(--tb-linie, #e6eaee); border-bottom: 1px solid var(--tb-linie, #e6eaee); }
.tbp-pret--rapid .tbp-pret__nou { font-size: 25px; }
.tbp-pret--rapid .tbp-pret__vechi { font-size: 14px; }
.tbp-pret--rapid .tbp-pret__cerere { font-size: 22px; }

/* ==========================================================================
   ecrane mai mici
   ========================================================================== */
@media (max-width: 991px) {
    .tbp-vandute__sina { grid-auto-columns: calc(100% / 3); }
    .tbp-sus { grid-template-columns: minmax(0, 1fr); gap: 26px; }
    .tbp-galerie__scena { max-height: none; }
    .tbp-taburi { margin-top: 50px; }
    .tbp-panou { padding: 30px; }
}
@media (max-width: 767px) {
    .tbp-firimituri { padding: 14px 0 16px; }
    .tbp-galerie__sag { width: 44px; height: 44px; margin-top: -22px; }
    .tbp-galerie__sag--st { left: 8px; }
    .tbp-galerie__sag--dr { right: 8px; }
    .tbp-distribuie a { width: 44px; height: 44px; }
    .tbp-distribuie svg { width: 18px; height: 18px; }
    .tbp-galerie__miniaturi { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
    .tbp-titlu { font-size: 22px; }
    .tbp-pret__nou { font-size: 32px; }
    .tbp-pret__vechi { font-size: 18px; }
    .tbp-pret__cerere { font-size: 26px; }
    .tbp-cta__rand { flex-direction: column; }
    .tbp-cta__rand > * { width: 100%; }
    .tbc-titlu { font-size: 22px; }
    .tbc-sus { flex-direction: column; align-items: flex-start; }
    .tbc-cant { flex-direction: column; align-items: flex-start; }
    .tbc-chips { margin-left: 0; }
    .tbc-grila { grid-template-columns: minmax(0, 1fr); }
    /* 16 px în câmpuri pe telefon: Safari (iPhone) nu mai mărește pagina la atingere */
    .tbc-input, .tbp-dialog__camp { font-size: 16px; }
    .tbc-rezultat { flex-direction: column; }
    .tbc-rezumat { width: auto; }
    .tbp-taburi__lista { gap: 4px 22px; margin-bottom: 18px; }
    .tbp-tab { min-height: 44px; font-size: 18px; line-height: 30px; }
    .tbp-panou { padding: 20px 16px; border-radius: 4px; }
    .tbp-atribute th, .tbp-atribute td { padding: 8px 12px; }
    .tbp-atribute th { width: 44%; }
    /* titlul pe un rând (ca pe vechiul site), săgețile sub carusel */
    .tbp-vandute { margin-top: 56px; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "titlu" "sina" "nav"; }
    .tbp-vandute__cap { display: contents; }
    .tbp-vandute__titlu { grid-area: titlu; margin-bottom: 20px; font-size: 26px; line-height: 34px; }
    .tbp-vandute__sina { grid-area: sina; grid-auto-columns: 50%; }
    .tbp-vandute__nav { grid-area: nav; justify-content: center; margin-top: 16px; }
    .tbp-vandute__el { padding: 14px; }
    .tbp-dialog__titlu { font-size: 22px; }
    dialog.tbp-dialog { padding: 10px; }
    .tbp-ecran__sag { width: 42px; height: 42px; margin-top: -21px; }
    .tbp-ecran__sag--st { left: 8px; }
    .tbp-ecran__sag--dr { right: 8px; }
    .tbp-rapid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .tbp-rapid__titlu { font-size: 21px; }
    .tbp-rapid__img img { height: 40vh; height: 40svh; }
}
@media (max-width: 600px) {
    .tbp-text ul:has(> li > img) img { height: 64px; }
}
@media (hover: none) {
    .tbp-galerie__zoom { display: none; }
    .tbp-galerie__mare { cursor: pointer; }
}
@media (prefers-reduced-motion: reduce) {
    .tbp *, .tbc *, .tbp-dialog, .tbp-ecran { transition: none !important; animation: none !important; }
}
