/* Tehnoutil — plata în rate prin tbi bank (design ui_kits/website/tbi.js).
 * 1rem = 10px. Culorile din tokenii temei, cu valorile din design ca rezervă. */

.tu-tbi-row[hidden],
.tu-tbi-row [hidden],
.tu-tbi-m [hidden] { display: none !important; }

.tu-tbi-ico { display: inline-flex; flex-shrink: 0; line-height: 1; }
.tu-tbi-ico .tu-icon-svg { width: 1em; height: 1em; }

/* ── Rândul de rate din cardul de preț ───────────────────────────────────── */

/* elementul Bricks (shortcode) nu ocupă loc în coloana cardului cât rândul e ascuns
   (starea de pe server, înainte de JS: [hidden]) */
.tu-p-pricecard > .brxe-shortcode:empty,
.tu-p-pricecard > .brxe-shortcode:has(> .tu-tbi-row[hidden]) { display: none; }

/* Când cantitatea scoate suma din intervalul băncii (100–65.000 lei), rândul se strânge animat și
   rândul de cumpărare urcă lin (invers la revenire). Elementul Bricks devine o grilă 1fr ↔ 0fr, iar
   marginea de -1rem anulează gap-ul cardului (1rem): starea strânsă e identică cu lipsa rândului. */
.tu-p-pricecard > .brxe-shortcode:has(> .tu-tbi-row) {
	display: grid;
	grid-template-rows: 1fr;
	transition:
		grid-template-rows var(--tu-duration-slow, 300ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1)),
		margin-top var(--tu-duration-slow, 300ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1));
}
.tu-p-pricecard > .brxe-shortcode:has(> .tu-tbi-row.is-off) { grid-template-rows: 0fr; margin-top: -1rem; }

.tu-tbi-row {
	min-height: 0;
	font-family: "Archivo", sans-serif;
	font-size: 1.35rem;
	line-height: 1.4;
	color: var(--tu-ink-700, #52453A);
	transition: opacity var(--tu-duration-fast, 200ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1));
}
/* tăiat doar cât e strâns / în animație — altfel ar tăia popover-ul „Exemplu reprezentativ” */
.tu-tbi-row.is-off,
.tu-tbi-row.is-anim { overflow: hidden; }
.tu-tbi-row.is-off {
	opacity: 0;
	visibility: hidden;
	transition:
		opacity var(--tu-duration-fast, 200ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1)),
		visibility 0s linear var(--tu-duration-slow, 300ms);
}

.tu-tbi-row__inner {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1rem 0 .2rem;
	border-top: 1px dashed var(--tu-brand-200, #FFD9B8);
}

@media (prefers-reduced-motion: reduce) {
	.tu-p-pricecard > .brxe-shortcode:has(> .tu-tbi-row),
	.tu-tbi-row,
	.tu-tbi-row.is-off { transition: none; }
}

.tu-tbi-row__mark { flex: 0 0 2.2rem; width: 2.2rem; height: 2.2rem; display: flex; }
.tu-tbi-row__logo { display: block; width: 2.2rem; height: 2.2rem; }

.tu-tbi-row__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .6rem; }

.tu-tbi-row__line { display: flex; align-items: center; flex-wrap: wrap; column-gap: 1rem; row-gap: .4rem; min-height: 2.2rem; }
.tu-tbi-row__line--meta { column-gap: 1.2rem; min-height: 0; }
.tu-tbi-row__line--meta:not(:has(> :not([hidden]))) { display: none; }

.tu-tbi-row__msg { text-wrap: pretty; }
.tu-tbi-row__amount { color: var(--tu-ink-900, #2B1D10); font-weight: 700; white-space: nowrap; }

.tu-tbi-row__bnpl { font-size: 1.2rem; color: var(--tu-ink-700, #52453A); }

/* „Vezi opțiunile” — buton cu aspect de link (Bricks dă :where(button){min-height:4.8rem}) */
.tu-tbi-row__open {
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	font: inherit;
	font-weight: 700;
	line-height: 1.4;
	color: var(--tu-brand-600, #CC5200);
	cursor: pointer;
	white-space: nowrap;
}
.tu-tbi-row__open > span:first-child { text-underline-offset: 3px; }
.tu-tbi-row__open:hover > span:first-child,
.tu-tbi-row__open:focus-visible > span:first-child { text-decoration: underline; }
.tu-tbi-row__open .tu-tbi-ico { font-size: 1.6rem; }
.tu-tbi-row__open:focus-visible { outline: 2px solid var(--tu-brand-500, #FF791F); outline-offset: 2px; border-radius: .4rem; }

/* „Exemplu reprezentativ” + popover */
.tu-tbi-rep { position: relative; display: inline-flex; }

.tu-tbi-rep__btn {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	font-family: "Archivo", sans-serif;
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--tu-ink-500, #8A7B6C);
	cursor: pointer;
	transition: color var(--tu-duration-fast, 200ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1));
}
.tu-tbi-rep__btn .tu-tbi-ico { font-size: 1.5rem; }
.tu-tbi-rep__label { text-decoration: underline; text-underline-offset: 3px; }
.tu-tbi-rep__btn:hover,
.tu-tbi-rep.is-open .tu-tbi-rep__btn { color: var(--tu-brand-700, #A34200); }
.tu-tbi-rep__btn:focus-visible { outline: 2px solid var(--tu-brand-500, #FF791F); outline-offset: 2px; border-radius: .4rem; }

.tu-tbi-rep__pop {
	position: absolute;
	top: calc(100% + .8rem);
	left: 0;
	z-index: 40;
	width: 30rem;
	max-width: calc(100vw - 3.2rem);
	box-sizing: border-box;
	padding: 1.2rem 1.4rem;
	background: #fff;
	border: 1px solid var(--tu-brand-200, #FFD9B8);
	border-radius: var(--tu-radius-md, .8rem);
	box-shadow: var(--tu-shadow-modal, 0 2.4rem 6.4rem rgba(43,29,16,.22));
	font-family: "Archivo", sans-serif;
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1.55;
	color: var(--tu-ink-700, #52453A);
	text-align: left;
	text-wrap: pretty;
	white-space: normal;
}

/* ── Butonul pluginului: ascuns pe produs (rândul nostru îl înlocuiește), restilizat în coș ── */

.tu-p-buyrow #tbi_button_container { display: none !important; }

/* Inter e dezactivat de perfmatters; „'Inter', open-sans” cădea pe serif */
.tbi_button_line { font-family: "Archivo", sans-serif !important; }

/* coș: între „Finalizează comanda” și „Continuă cumpărăturile” (spațiul de 10px vine din row-gap-ul cardului);
   fără slot gol când pluginul nu afișează butonul (sub 100 / peste 65.000 lei) */
body #brxe-e1651e .tu-cart__tbi-fragment:empty,
body #brxe-e1651e .tu-cart__tbi-fragment:not(:has(#tbi_button)) { display: none !important; }
body #brxe-e1651e .tu-cart__tbi-fragment [class^="tbi_button_container"] { display: block; width: 100%; overflow: visible; }
body #brxe-e1651e .tu-cart__tbi-fragment [id="tbi_button"] { display: block; width: 100%; min-width: 0 !important; max-width: 100%; margin: 0 !important; cursor: pointer; border-radius: .8rem; }
body #brxe-e1651e .tu-cart__tbi-fragment [id="tbi_button_body"] { width: 100%; min-height: 5rem; box-sizing: border-box; }

.tu-cart__tbi-fragment .tbi_button_line { font-size: 1.4rem; font-weight: 500; letter-spacing: 0; }
.tu-cart__tbi-fragment #tbi_button_body { transition: background-color var(--tu-duration-fast, 200ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1)), transform var(--tu-duration-fast, 200ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1)); }
.tu-cart__tbi-fragment .tbi_button4:hover #tbi_button_body { background: #1F1A16; }
.tu-cart__tbi-fragment #tbi_button:active #tbi_button_body { transform: scale(.98); }
.tu-cart__tbi-fragment #tbi_button:focus { outline: none; }
.tu-cart__tbi-fragment #tbi_button:focus-visible #tbi_button_body { box-shadow: 0 0 0 3px rgba(255, 121, 31, .45); }

/* ── Rama pop-up-ului: #tbi_popup_container (overlay) > #iframe_container.tu-tbi-m ── */

/* pagina din spate nu se derulează cât fereastra e deschisă (clasă pusă de tu-tbi.js) */
html.tu-tbi-lock { overflow: hidden !important; }

/* NU setăm display pe overlay: pluginul îl comută inline (flex / none) */
#tbi_popup_container.tu-tbi-overlay {
	z-index: 100001;
	left: 0;
	align-items: center;
	justify-content: center;
	padding: 2.4rem;
	box-sizing: border-box;
	background: rgba(31, 21, 11, .55);
	overscroll-behavior: contain;
}

#tbi_popup_container #iframe_container.tu-tbi-m {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 68rem;
	height: min(76rem, calc(100vh - 4.8rem));
	height: min(76rem, calc(100dvh - 4.8rem));
	min-height: 0;
	max-height: none;
	background: #fff;
	border-radius: 1.6rem;
	box-shadow: var(--tu-shadow-modal, 0 2.4rem 6.4rem rgba(43,29,16,.22));
	overflow: hidden;
	font-family: "Archivo", sans-serif;
}

/* antetul: titlu + subtitlu, fără logo. Închiderea e X-ul calculatorului tbi (din iframe); X-ul nostru
   apare doar de rezervă, când calculatorul nu s-a încărcat (eroare sau încărcare blocată) */
.tu-tbi-m__head {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	padding: 1.4rem 2rem;
	border-bottom: 1px solid var(--tu-border-soft, #F0E6DC);
	background: #fff;
}
.tu-tbi-m__titles { flex: 1 1 auto; min-width: 0; }
.tu-tbi-m__title {
	font-size: 1.6rem;
	font-weight: 800;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0;
	color: var(--tu-ink-900, #2B1D10);
}
.tu-tbi-m__sub { margin-top: .2rem; font-size: 1.25rem; line-height: 1.4; color: var(--tu-ink-500, #8A7B6C); text-wrap: pretty; }

.tu-tbi-m__x {
	display: none;
	flex: 0 0 4.4rem;
	width: 4.4rem;
	height: 4.4rem;
	min-height: 0;
	margin: -.6rem -1rem -.6rem 1.2rem;
	padding: 0;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 999px;
	background: transparent;
	box-shadow: none;
	color: var(--tu-ink-700, #52453A);
	cursor: pointer;
	transition: background-color var(--tu-duration-fast, 200ms) var(--tu-ease, cubic-bezier(.2,.7,.3,1));
}
.tu-tbi-m.is-error .tu-tbi-m__x,
.tu-tbi-m.is-stalled .tu-tbi-m__x { display: flex; }
.tu-tbi-m__x .tu-tbi-ico { font-size: 2.2rem; }
.tu-tbi-m__x:hover { background: var(--tu-brand-50, #FFF6EE); }
.tu-tbi-m__x:focus { outline: none; }
.tu-tbi-m__x:focus-visible { box-shadow: 0 0 0 3px rgba(255, 121, 31, .35); }

/* capcana de focus (elemente invizibile la începutul și sfârșitul ferestrei) */
.tu-tbi-m__trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.tu-tbi-m__body { position: relative; flex: 1 1 auto; min-height: 0; background: #fff; }

#tbi_popup_container .tu-tbi-m #tbi_popup_iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: 0;
}

/* încărcătorul pluginului (gif + „va rugam asteptati”) e înlocuit de al nostru */
#tbi_popup_container .tu-tbi-m #tbi_loading { display: none !important; }

.tu-tbi-m__loader {
	position: absolute;
	inset: 0;
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	background: #fff;
	font-size: 1.3rem;
	color: var(--tu-ink-500, #8A7B6C);
}
.tu-tbi-m.is-loading .tu-tbi-m__loader { display: flex; }
.tu-tbi-m__loading-ico { display: inline-flex; font-size: 2.8rem; color: var(--tu-brand-500, #FF791F); animation: tuTbiPulse 1.2s ease-in-out infinite; }
@keyframes tuTbiPulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

.tu-tbi-m__foot {
	flex: 0 0 auto;
	padding: 1.2rem 2rem 1.4rem;
	border-top: 1px solid var(--tu-border-soft, #F0E6DC);
	background: var(--tu-surface-subtle, #FAF6F1);
	font-size: 1.15rem;
	line-height: 1.55;
	color: var(--tu-ink-500, #8A7B6C);
	text-wrap: pretty;
}

/* cererea de credit (checkout, după plasare): fără exemplu reprezentativ */
.tu-tbi-m.is-application .tu-tbi-m__foot { display: none !important; }

/* fereastra primește focusul la deschidere (Escape, cititoare de ecran), fără contur */
#tbi_popup_container #iframe_container.tu-tbi-m:focus { outline: none; }

/* pluginul transformă pop-up-ul în panou jos sub 768px — păstrăm fereastra centrată */
@media (max-width: 767px) {
	#tbi_popup_container.tu-tbi-overlay { align-items: center; }
	#tbi_popup_container #iframe_container.tu-tbi-m { border-radius: 1.6rem; max-height: none; }
}

/* telefon (și telefon pe orizontală): ecran complet */
@media (max-width: 477px), (max-height: 520px) {
	#tbi_popup_container.tu-tbi-overlay { padding: 0; }
	#tbi_popup_container #iframe_container.tu-tbi-m { max-width: none; height: 100%; border-radius: 0; }
	.tu-tbi-m__head { padding: 1.2rem 1.6rem; }
	.tu-tbi-m__title { font-size: 1.45rem; }
	.tu-tbi-m__foot { padding: 1rem 1.6rem 1.2rem; }
}

@media (prefers-reduced-motion: reduce) {
	.tu-tbi-m__loading-ico { animation: none; }
}
