/**
 * Stiluri pentru formularul de cereri.
 *
 * Butoanele rămân ale temei (clasa .button) ca să arate ca restul site-ului; aici stă doar
 * ce ține de structura formularului. Culorile sunt legate de `currentColor` și de nuanțe
 * neutre, ca să nu se bată cu paleta temei.
 */

.edp-cereri {
	--edp-buton-fundal: #1f2933;
	--edp-buton-text: #fff;
}

/* Pașii scurți — căutarea comenzii și confirmarea — rămân la o lățime de citit. Doar
   ecranele cu date multe (alegerea comenzii, formularul pe două coloane) folosesc tot
   spațiul paginii. */
.edp-cereri-cautare,
.edp-cereri-confirmare {
	max-width: 34rem;
}

/* Formularul de cerere: câmpurile într-o coloană, rezumatul comenzii alături.
   Rezumatul e primul în cod, ca pe ecran îngust să apară deasupra formularului; aici îl
   așezăm explicit în coloana a doua, deci ordinea vizuală nu depinde de ordinea din cod. */
@media ( min-width: 60em ) {
	.edp-cereri-form--comanda {
		align-items: start;
		display: grid;
		gap: 2.5rem;
		/* Coloana din dreapta creste odata cu pagina, nu ramane la o latime fixa: pe un
		   ecran mare o valoare fixa arata inghesuita langa un formular foarte lat. Marginile
		   o tin insa intre ceva citibil si ceva care nu inghite formularul. */
		grid-template-columns: minmax( 0, 1fr ) clamp( 18rem, 30%, 32rem );
	}

	.edp-cereri-form--comanda > .edp-cereri-coloana {
		grid-column: 1;
		grid-row: 1;
		min-width: 0;
	}

	.edp-cereri-form--comanda > .edp-cereri-rezumat {
		grid-column: 2;
		grid-row: 1;
		margin-bottom: 0;
		position: sticky;
		top: 1.5rem;
	}
}

/* Butoanele proprii: unele teme nu stilează clasa .button în afara șabloanelor
   WooCommerce, iar acolo linkul ajunge să arate ca text simplu. Aici nu depindem de temă.
   Culorile vin din variabilele de mai sus, deci se schimbă dintr-un singur loc. */
.edp-cereri-buton {
	background: transparent;
	border: 1px solid var( --edp-buton-fundal );
	border-radius: 0.3rem;
	color: var( --edp-buton-fundal );
	cursor: pointer;
	display: inline-block;
	font: inherit;
	font-weight: 600;
	line-height: 1.4;
	padding: 0.6rem 1.2rem;
	text-align: center;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.edp-cereri-buton:hover,
.edp-cereri-buton:focus {
	background: var( --edp-buton-fundal );
	color: var( --edp-buton-text );
	text-decoration: none;
}

.edp-cereri-buton--principal {
	background: var( --edp-buton-fundal );
	color: var( --edp-buton-text );
	padding: 0.75rem 1.75rem;
}

.edp-cereri-buton--principal:hover,
.edp-cereri-buton--principal:focus {
	opacity: 0.85;
}

.edp-cereri-form .edp-cereri-camp {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin-bottom: 1rem;
}

.edp-cereri-form label {
	cursor: pointer;
}

.edp-cereri-sectiune {
	border: 1px solid rgba( 0, 0, 0, 0.12 );
	border-radius: 0.4rem;
	margin: 0 0 1.5rem;
	padding: 1rem 1.25rem 1.25rem;
}

.edp-cereri-sectiune legend {
	font-weight: 600;
	padding: 0 0.4rem;
}

.edp-cereri-optiune {
	align-items: baseline;
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.4rem;
}

/* Rezumatul comenzii: etichetă la stânga, valoare la dreapta, pe două coloane. */
.edp-cereri-rezumat {
	background: rgba( 0, 0, 0, 0.03 );
	border-radius: 0.4rem;
	margin-bottom: 1.5rem;
	padding: 1rem 1.25rem;
}

.edp-cereri-rezumat h2 {
	margin-top: 0;
}

.edp-cereri-rezumat dl {
	display: grid;
	/* `1fr` pe coloana valorilor ar însemna `minmax( auto, 1fr )`, iar `auto` nu coboară sub
	   lățimea min-content. Un email lung n-are unde să se rupă, deci coloana ar crește după el
	   și ar împinge rezumatul în afara ecranului. `minmax( 0, 1fr )` îi dă voie să se strângă. */
	grid-template-columns: minmax( 6rem, max-content ) minmax( 0, 1fr );
	gap: 0.35rem 1rem;
	margin: 0;
}

.edp-cereri-rezumat dt {
	font-weight: 600;
}

.edp-cereri-rezumat dd {
	margin: 0;
	/* Valorile se rup, nu se taie: emailul și numele sunt date pe care clientul le verifică
	   înainte să trimită cererea, iar pe telefon o tăietură cu „…" n-are cum fi desfășurată.
	   `anywhere`, nu `break-word`, ca ruperea să intre și în calculul de min-content al
	   coloanei — altfel gridul rămâne dimensionat după cuvântul întreg. */
	overflow-wrap: anywhere;
}

/* Avertismentele nu sunt erori: spun ce urmează, nu că ceva e greșit. */
.edp-cereri-avertisment {
	background: rgba( 245, 166, 35, 0.12 );
	border-left: 3px solid rgba( 245, 166, 35, 0.9 );
	border-radius: 0 0.3rem 0.3rem 0;
	margin: 0.5rem 0 1rem;
	padding: 0.75rem 1rem;
}

.edp-cereri-erori {
	background: rgba( 200, 0, 0, 0.07 );
	border-left: 3px solid rgba( 200, 0, 0, 0.7 );
	border-radius: 0 0.3rem 0.3rem 0;
	margin-bottom: 1.5rem;
	padding: 0.75rem 1rem;
}

.edp-cereri-erori ul {
	margin: 0;
	padding-left: 1.2rem;
}

.edp-cereri-produs {
	align-items: center;
	border-bottom: 1px solid rgba( 0, 0, 0, 0.07 );
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: space-between;
	padding: 0.5rem 0;
}

.edp-cereri-produs:last-child {
	border-bottom: 0;
}

.edp-cereri-produs > label {
	align-items: baseline;
	display: flex;
	flex: 1 1 16rem;
	gap: 0.5rem;
}

.edp-cereri-cantitate {
	align-items: center;
	display: flex;
	gap: 0.4rem;
}

.edp-cereri-cantitate input {
	width: 4.5rem;
}

.edp-cereri-motive-titlu {
	font-weight: 600;
	margin: 0 0 0.5rem;
}

.edp-cereri-motive + .edp-cereri-motive {
	margin-top: 1rem;
}

/* Lista de comenzi din pasul de alegere. */
.edp-cereri-comenzi {
	list-style: none;
	margin: 0;
	padding: 0;
}

.edp-cereri-comenzi li {
	align-items: center;
	border: 1px solid rgba( 0, 0, 0, 0.12 );
	border-radius: 0.4rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	justify-content: space-between;
	margin-bottom: 0.75rem;
	padding: 0.85rem 1rem;
}

.edp-cereri-comanda-info {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.edp-cereri-stadiu {
	opacity: 0.75;
}

.edp-cereri-confirmare {
	border: 1px solid rgba( 0, 0, 0, 0.12 );
	border-radius: 0.4rem;
	padding: 1.5rem;
}

.edp-cereri-numar {
	font-weight: 600;
}

.edp-cereri-ajutor {
	opacity: 0.8;
}

/* --------------------------------------------------------------------------
   Cardul din „Cererile mele", când contul e construit cu Elementor Pro.

   Widget-ul „My Account" desenează cardul printr-o listă fixă de taburi, scrisă în
   widget-woocommerce-my-account.min.css: __dashboard, __downloads, __edit-account,
   __edit-address, __orders, __payment-methods. Un endpoint propriu nu e pe listă, deci
   conținutul lui rămâne fără fundal, fără chenar și fără padding, lângă restul contului.

   Copiem declarațiile pe care Elementor le dă tabului „orders", cu aceleași variabile:
   așa cardul urmează ce ai setat în Elementor (culoare, colțuri, grosime, padding), nu
   niște valori fixe scrise aici. Valorile de rezervă sunt cele din Elementor.
   -------------------------------------------------------------------------- */
.elementor-widget-woocommerce-my-account .e-my-account-tab__cererile-mele .woocommerce-MyAccount-content-wrapper {
	background-color: var( --sections-background-color, #fff );
	border-color: var( --sections-border-color, #d5d8dc );
	border-radius: var( --sections-border-radius, 3px );
	border-style: var( --sections-border-type, solid );
	border-width: var( --sections-border-top-width, 1px ) var( --sections-border-right-width, 1px ) var( --sections-border-bottom-width, 1px ) var( --sections-border-left-width, 1px );
	padding: var( --sections-padding, 16px 30px 3px 30px );
}

.elementor-widget-woocommerce-my-account .e-my-account-tab__cererile-mele .shop_table {
	border: none;
	margin-bottom: 0;
}

/* Plasă de siguranță, dacă altă versiune de Elementor numește altfel clasa tabului.
   Stă în reguli separate intenționat: un browser care nu cunoaște `:has()` aruncă toată
   regula în care apare, iar dacă ar fi lipită de cele de sus le-ar pierde și pe acelea. */
.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content-wrapper:has( .edp-cereri-tabel ) {
	background-color: var( --sections-background-color, #fff );
	border-color: var( --sections-border-color, #d5d8dc );
	border-radius: var( --sections-border-radius, 3px );
	border-style: var( --sections-border-type, solid );
	border-width: var( --sections-border-top-width, 1px ) var( --sections-border-right-width, 1px ) var( --sections-border-bottom-width, 1px ) var( --sections-border-left-width, 1px );
	padding: var( --sections-padding, 16px 30px 3px 30px );
}

.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content-wrapper:has( .edp-cereri-tabel ) .shop_table {
	border: none;
	margin-bottom: 0;
}

/* Tabelul din „Cererile mele". */
.edp-cereri-status {
	border-radius: 1rem;
	display: inline-block;
	font-size: 0.85em;
	font-weight: 600;
	padding: 0.15rem 0.6rem;
}

.edp-cereri-status--noua {
	background: rgba( 0, 115, 170, 0.12 );
}

.edp-cereri-status--in-lucru {
	background: rgba( 245, 166, 35, 0.18 );
}

.edp-cereri-status--aprobata {
	background: rgba( 0, 150, 80, 0.15 );
}

.edp-cereri-status--respinsa {
	background: rgba( 200, 0, 0, 0.12 );
}

/* Capcana pentru roboți: scoasă din pagină, dar nu prin display:none — unele scripturi
   automate ignoră câmpurile ascunse așa, iar noi vrem să le completeze. */
.edp-cereri-capcana {
	height: 0;
	left: -9999px;
	overflow: hidden;
	position: absolute;
	width: 0;
}