/**
 * TehnoUtil — calculatorul de livrare (coșul flotant + pagina Coș).
 *
 * Valorile vin din designul din 19.09.2026 (ui_kits/website/common.js 884-945,
 * components/actions/Button.jsx, components/forms/Radio.jsx).
 *
 * Câteva reguli sunt mai specifice decât ar părea necesar: CSS-ul coșului flotant
 * (opțiunea `xoo-wsc-av-options`, randată inline) stilizează deja
 * `.xoo-wsc-shipping-destination` și `ul.xoo-wsc-shipping-methods` pentru varianta
 * veche — de exemplu `ul.xoo-wsc-shipping-methods .amount` colorează orice preț
 * în portocaliu, iar designul cere prețul în culoarea textului.
 */

/* ── Textul dinaintea primului calcul ───────────────────────────────────── */

.tu-calc-livrare__intro {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--tu-ink-700, #52453A);
}

/* ── Destinația ─────────────────────────────────────────────────────────── */

/* xoo-wsc-style.css o centrează (`display: table; margin: 0 auto 20px`) și dă
   etichetei 16px cu margine proprie — designul o vrea aliniată la stânga, pe toată lățimea */
.xoo-wsc-sl-body .xoo-wsc-shipping-destination {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 8px;
	margin: 0;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--tu-border-soft, #F0E6DC);
	font-size: 13px;
	line-height: 1.5;
	color: var(--tu-ink-500, #8A7B6C);
}

.xoo-wsc-sl-body .xoo-wsc-shipping-destination > span:first-child {
	margin: 0;
	font-size: inherit;
	font-weight: 700;
	color: var(--tu-ink-700, #52453A);
}

/* ── Metodele de livrare ────────────────────────────────────────────────── */

.xoo-wsc-sl-body ul.xoo-wsc-shipping-methods {
	gap: 10px;
}

ul.xoo-wsc-shipping-methods .tu-calc-livrare__metoda {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--tu-ink-900, #2B1D10);
	cursor: pointer;
}

/* radio-ul nativ rămâne în pagină, accesibil și citit de handler-ul Xoo,
   dar desenul e cel din design: cerc de 20px, inel de 6px când e bifat */
ul.xoo-wsc-shipping-methods .tu-calc-livrare__metoda input.xoo-wsc-shipping-method {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.tu-calc-livrare__radio {
	flex-shrink: 0;
	box-sizing: border-box;
	width: 20px;
	height: 20px;
	border: 1.5px solid var(--tu-border-strong, #E4DAD0);
	border-radius: 50%;
	background: #fff;
	transition: border-color var(--tu-duration-fast, 200ms) var(--tu-ease, ease), border-width var(--tu-duration-fast, 200ms) var(--tu-ease, ease);
}

.tu-calc-livrare__metoda:hover .tu-calc-livrare__radio {
	border-color: var(--tu-brand-500, #FF791F);
}

.tu-calc-livrare__metoda input:checked + .tu-calc-livrare__radio {
	border: 6px solid var(--tu-brand-500, #FF791F);
}

.tu-calc-livrare__metoda input:focus-visible + .tu-calc-livrare__radio {
	box-shadow: 0 0 0 3px rgba(255, 121, 31, .35);
}

ul.xoo-wsc-shipping-methods .tu-calc-livrare__cost {
	margin-left: auto;
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
	color: var(--tu-ink-900, #2B1D10);
}

ul.xoo-wsc-shipping-methods .tu-calc-livrare__cost .amount {
	font-weight: inherit;
	color: inherit;
}

ul.xoo-wsc-shipping-methods .tu-calc-livrare__cost--gratuit {
	color: var(--tu-success, #1B8A3A);
}

.tu-calc-livrare__sep {
	height: 1px;
	background: var(--tu-border-soft, #F0E6DC);
}

/* ── Comutatorul formularului ───────────────────────────────────────────── */

/* coșul flotant: Button „secondary”, md — dispare cât formularul e deschis */
.tu-calc-livrare__comuta--buton {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0 22px;
	border: 1.5px solid var(--tu-brand-500, #FF791F);
	border-radius: var(--tu-radius-md, .8rem);
	background: #fff;
	color: var(--tu-brand-600, #CC5200);
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition:
		background-color var(--tu-duration-fast, 200ms) var(--tu-ease, ease),
		color var(--tu-duration-fast, 200ms) var(--tu-ease, ease),
		box-shadow var(--tu-duration-fast, 200ms) var(--tu-ease, ease),
		transform var(--tu-duration-fast, 200ms) var(--tu-ease, ease);
}

.tu-calc-livrare__comuta--buton:hover {
	background: var(--tu-brand-500, #FF791F);
	color: #fff;
	box-shadow: var(--tu-shadow-hover, 0 1rem 2.8rem rgba(204, 82, 0, .13));
	transform: translateY(-2px);
}

.tu-calc-livrare__comuta--buton:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 121, 31, .35);
}

/* formularul deschis ține locul butonului */
.tu-calc-livrare__comuta--buton[aria-expanded="true"] {
	display: none;
}

/* pagina Coș: link cu săgeată, rămâne vizibil și se întoarce (Cart.js) */
.tu-calc-livrare__comuta--link {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 4px;
	width: auto;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 4px;
	background: none;
	color: var(--tu-brand-600, #CC5200);
	font-family: inherit;
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.4;
	cursor: pointer;
	transition: color var(--tu-duration-fast, 200ms) var(--tu-ease, ease);
}

.tu-calc-livrare__comuta--link:hover {
	background: none;
	color: var(--tu-brand-700, #A44200);
}

.tu-calc-livrare__comuta--link:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 121, 31, .35);
}

.tu-calc-livrare__comuta--link::after {
	content: "expand_more";
	font-family: "Material Symbols Outlined";
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	font-feature-settings: "liga";
}

.tu-calc-livrare__comuta--link[aria-expanded="true"]::after {
	content: "expand_less";
}

.tu-calc-livrare__pliabil[hidden] {
	display: none !important;
}

/* ── Formularul ─────────────────────────────────────────────────────────── */

.tu-calc-livrare {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 0;
}

.tu-calc-livrare__camp {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.tu-calc-livrare__eticheta {
	display: block;
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--tu-ink-700, #52453A);
}

.tu-calc-livrare__control {
	position: relative;
}

/* iconița câmpului (Dropdown din design: 18px, la 14px de margine) */
.tu-calc-livrare__ico {
	position: absolute;
	top: 50%;
	left: 14px;
	z-index: 2;
	font-size: 18px;
	line-height: 1;
	color: var(--tu-ink-400, #B0A294);
	transform: translateY(-50%);
	pointer-events: none;
}

/* ── Pastila select2 (Dropdown din design, înălțimea implicită de 44px) ────
   Selectorii încep cu `form.tu-calc-livrare`, ca să treacă peste regulile
   select2 ale coșului flotant (opțiunea m-custom-css) și să arate la fel pe
   pagina Coș, unde acelea nu ajung. */

form.tu-calc-livrare .select2-container {
	width: 100% !important;
}

/* xoo-wsc-style.css ridică orice `.select2-container` la z-index 9999999 cât e
   coșul deschis — gândit pentru lista atașată la <body>, dar prinde și pastila
   din formular, care ar acoperi iconița. Lista rămâne neatinsă. */
form.tu-calc-livrare .tu-calc-livrare__control .select2-container {
	z-index: 1;
}

form.tu-calc-livrare .select2-container .select2-selection--single {
	display: flex !important;
	align-items: center;
	box-sizing: border-box;
	height: 44px !important;
	margin: 0;
	padding: 0 12px 0 42px !important;
	border: 1px solid var(--tu-border-strong, #E4DAD0) !important;
	border-radius: var(--tu-radius-md, .8rem) !important;
	outline: none !important;
	background: #fff !important;
	cursor: pointer;
	transition: border-color var(--tu-duration-fast, 200ms) var(--tu-ease, ease), box-shadow var(--tu-duration-fast, 200ms) var(--tu-ease, ease);
}

form.tu-calc-livrare .select2-container .select2-selection--single:hover {
	border-color: var(--tu-brand-300, #FFB877) !important;
}

form.tu-calc-livrare .select2-container .select2-selection--single .select2-selection__rendered {
	flex: 1;
	min-width: 0;
	padding: 0 !important;
	font-family: inherit !important;
	font-size: 14px !important;
	font-weight: 400;
	line-height: normal !important;
	color: var(--tu-ink-900, #2B1D10) !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

form.tu-calc-livrare .select2-container .select2-selection--single .select2-selection__placeholder {
	font-weight: 400;
	color: var(--tu-ink-500, #8A7B6C);
}

/* săgeata: expand_more de 20px, rotită cu lista deschisă */
form.tu-calc-livrare .select2-container .select2-selection--single .select2-selection__arrow {
	position: static !important;
	display: inline-flex !important;
	flex-shrink: 0;
	align-items: center;
	width: auto !important;
	height: auto !important;
	margin-left: 8px;
	transition: transform var(--tu-duration-fast, 200ms) var(--tu-ease, ease);
}

form.tu-calc-livrare .select2-container--open .select2-selection--single .select2-selection__arrow {
	transform: rotate(180deg);
}

form.tu-calc-livrare .select2-container .select2-selection--single .select2-selection__arrow b {
	display: none !important;
}

form.tu-calc-livrare .select2-container .select2-selection--single .select2-selection__arrow::before {
	content: "expand_more";
	font-family: "Material Symbols Outlined";
	font-size: 20px;
	font-weight: 400;
	line-height: 1;
	color: var(--tu-ink-500, #8A7B6C);
	font-feature-settings: "liga";
}

/* deschis sau cu focus din tastatură: grosimea conturului rămâne 1px, inelul
   vine din box-shadow, deci eticheta și iconița nu se mută */
form.tu-calc-livrare .select2-container .select2-selection--single:focus,
form.tu-calc-livrare .select2-container--focus .select2-selection--single,
form.tu-calc-livrare .select2-container--open .select2-selection--single {
	border-color: var(--tu-brand-500, #FF791F) !important;
	box-shadow: 0 0 0 1px var(--tu-brand-500, #FF791F), 0 0 0 3px rgba(255, 121, 31, .35) !important;
}

/* ── Pagina Coș (Cart.js, varianta Colete-Online) ─────────────────────────
   Pastila select2 (42px, fără iconiță) și butonul „Actualizează” (sm, 36px) le
   stilizează deja CSS-ul paginii Coș (`#brxe-e1651e .tu-cart__ship …`). Aici
   rămân doar spațierile și eticheta. */

form.tu-calc-livrare--cos {
	gap: 10px;
	padding-top: 4px;
}

form.tu-calc-livrare--cos .tu-calc-livrare__camp {
	gap: 5px;
}

form.tu-calc-livrare--cos .tu-calc-livrare__eticheta {
	font-size: 12.5px;
	font-weight: 700;
	color: var(--tu-ink-900, #2B1D10);
}

/* ── Lista de rezultate (atașată la <body>) ─────────────────────────────── */

.select2-dropdown.tu-calc-livrare__lista {
	z-index: 1000001;
	overflow: hidden;
	border: 1px solid var(--tu-brand-200, #FFD9B8);
	border-radius: var(--tu-radius-md, .8rem);
	box-shadow: var(--tu-shadow-toast, 0 .8rem 2.4rem rgba(43, 29, 16, .18));
	font-family: inherit;
}

.tu-calc-livrare__lista .select2-search__field {
	box-sizing: border-box;
	height: 38px;
	padding: 0 10px !important;
	border: 1px solid var(--tu-border-soft, #F0E6DC) !important;
	border-radius: var(--tu-radius-sm, .6rem);
	font-size: 14px;
	outline: none;
}

.tu-calc-livrare__lista .select2-search__field:focus {
	border-color: var(--tu-brand-500, #FF791F) !important;
}

.tu-calc-livrare__lista .select2-results__option {
	padding: 10px 12px;
	font-size: 14px;
	white-space: nowrap;
	color: var(--tu-ink-900, #2B1D10);
}

.tu-calc-livrare__lista .select2-results__option--highlighted[aria-selected] {
	background: var(--tu-brand-50, #FFF6EE) !important;
	color: var(--tu-ink-900, #2B1D10) !important;
}

.tu-calc-livrare__lista .select2-results__option[aria-selected="true"] {
	background: var(--tu-brand-100, #FFF1E6);
	font-weight: 700;
}

.tu-calc-livrare__lista .select2-results__message {
	color: var(--tu-ink-500, #8A7B6C);
	white-space: normal;
}

/* ── Butonul „Actualizează” (Button „primary”, lățime plină) ─────────────── */

/* `form … button.…` trece peste `.xoo-wsc-slider button[name="calc_shipping"]`
   din xoo-wsc-style.css (display: table; margin: 0 auto) */
form.tu-calc-livrare button.tu-calc-livrare__submit {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	height: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0 22px;
	border: none;
	border-radius: var(--tu-radius-md, .8rem);
	background: var(--tu-gradient-orange, linear-gradient(135deg, #FF791F, #CC5200));
	color: #fff;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	cursor: pointer;
	transition: box-shadow var(--tu-duration-fast, 200ms) var(--tu-ease, ease), transform var(--tu-duration-fast, 200ms) var(--tu-ease, ease);
}

form.tu-calc-livrare button.tu-calc-livrare__submit:not(:disabled):hover {
	box-shadow: var(--tu-shadow-hover, 0 1rem 2.8rem rgba(204, 82, 0, .13));
	transform: translateY(-2px);
}

form.tu-calc-livrare button.tu-calc-livrare__submit:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 121, 31, .35);
}

/* pe Coș, regula paginii (`#brxe-e1651e .tu-cart__ship button[name="calc_shipping"]`)
   pune gradientul cu ID și !important — starea dezactivată are nevoie de același calibru */
form.tu-calc-livrare button.tu-calc-livrare__submit:disabled,
#brxe-e1651e form.tu-calc-livrare button.tu-calc-livrare__submit:disabled {
	background: var(--tu-border-strong, #E4DAD0) !important;
	box-shadow: none !important;
	transform: none !important;
	cursor: not-allowed;
}

form.tu-calc-livrare button.tu-calc-livrare__submit.is-loading {
	cursor: wait;
}

.tu-calc-livrare__eroare {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--tu-error, #C62D1F);
}

@media (prefers-reduced-motion: reduce) {
	.tu-calc-livrare__comuta--buton,
	.tu-calc-livrare__comuta--link,
	form.tu-calc-livrare button.tu-calc-livrare__submit,
	.tu-calc-livrare__radio {
		transition: none;
	}

	.tu-calc-livrare__comuta--buton:hover,
	form.tu-calc-livrare button.tu-calc-livrare__submit:not(:disabled):hover {
		transform: none;
	}
}