/* EL-CAR YOKE: tabel de coduri cu selectie pentru cererea de oferta. */
.elcar-yoke,
.elcar-yoke-cta {
	--ey-albastru: #009fdf;
	--ey-albastru-inchis: #0079a8;
	--ey-galben: #ffc20e;
	--ey-text: #1d2733;
	--ey-gri: #5d6b7a;
	--ey-linie: #e3e8ee;
	--ey-fundal: #f6f8fa;
	--ey-ales: #e6f5fc;
	font-variant-numeric: tabular-nums;
}

/* Rezumatul din dreapta pozei: inlocuieste formularul fara cod. */
body.elcar-yoke-are-tabel .summary form.cart { display: none !important; }
.elcar-yoke-cta { margin: 18px 0 22px; padding: 18px; border: 1px solid var(--ey-linie); border-radius: 10px; background: var(--ey-fundal); }
.elcar-yoke-cta p { margin: 0 0 10px; }
.elcar-yoke-marca { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: var(--ey-text); }
.elcar-yoke-logo { display: block; width: auto !important; height: 26px !important; max-width: none; margin: 0; }
.elcar-yoke-cap .elcar-yoke-logo { height: 30px !important; margin-bottom: 10px; }
.elcar-yoke-rezumat { font-size: 15px; color: var(--ey-gri); }
.elcar-yoke-cta .elcar-yoke-spre-tabel { display: inline-flex; align-items: center; gap: 8px; border-radius: 6px !important; padding: 12px 22px !important; background: var(--ey-albastru) !important; color: #fff !important; font-weight: 700; }
.elcar-yoke-cta .elcar-yoke-spre-tabel:hover { background: var(--ey-albastru-inchis) !important; }
.elcar-yoke-cta .elcar-yoke-spre-tabel::after { content: "↓"; font-weight: 700; }
.elcar-yoke-nota { margin: 10px 0 0 !important; font-size: 13px; color: var(--ey-gri); }

/* Sectiunea cu tabelul */
.elcar-yoke { clear: both; margin: 36px 0 40px; padding: 24px; border: 1px solid var(--ey-linie); border-radius: 14px; background: #fff; box-shadow: 0 6px 24px rgba(16, 38, 64, .06); color: var(--ey-text); }
.elcar-yoke-cap { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; margin-bottom: 18px; }
.elcar-yoke-cap h2 { margin: 0 0 6px; font-size: 22px; line-height: 1.25; }
.elcar-yoke-cap p { margin: 0; max-width: 680px; color: var(--ey-gri); font-size: 15px; line-height: 1.5; }
.elcar-yoke-cauta input { width: 260px; max-width: 100%; height: 42px; padding: 0 14px 0 38px; border: 1px solid var(--ey-linie); border-radius: 8px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%235d6b7a' stroke-width='2'%3E%3Ccircle cx='7' cy='7' r='5.5'/%3E%3Cpath d='m11 11 4 4'/%3E%3C/svg%3E") no-repeat 13px 50%; font-size: 15px; }
.elcar-yoke-cauta input:focus { outline: none; border-color: var(--ey-albastru); box-shadow: 0 0 0 3px rgba(0, 159, 223, .18); }

.elcar-yoke-corp.are-desen { display: grid; grid-template-columns: minmax(200px, 280px) minmax(0, 1fr); gap: 22px; align-items: start; }
.elcar-yoke-desen { position: sticky; top: 100px; margin: 0; padding: 12px; border: 1px solid var(--ey-linie); border-radius: 10px; background: #fff; text-align: center; }
.elcar-yoke-desen img { width: 100%; height: auto; display: block; }
.elcar-yoke-desen figcaption { margin-top: 8px; font-size: 12px; color: var(--ey-gri); }

.elcar-yoke-scroll { overflow: auto; max-height: 72vh; border: 1px solid var(--ey-linie); border-radius: 10px; }
.elcar-yoke-scroll:focus { outline: 2px solid var(--ey-albastru); outline-offset: 2px; }
.elcar-yoke-t { width: 100%; margin: 0 !important; border: 0 !important; border-collapse: separate; border-spacing: 0; font-size: 14px; }
.elcar-yoke-t th,
.elcar-yoke-t td { padding: 10px 12px !important; border: 0 !important; border-bottom: 1px solid var(--ey-linie) !important; white-space: nowrap; text-align: right; vertical-align: middle; background: #fff; }
.elcar-yoke-t thead th { position: sticky; top: 0; z-index: 2; background: #1d2733; color: #fff; font-size: 12px; font-weight: 600; text-transform: none; text-align: center; letter-spacing: .02em; }
.elcar-yoke-t thead tr:nth-child(2) th { top: 37px; background: #2c3a4a; }
.elcar-yoke-t thead th.grup { border-bottom: 1px solid rgba(255, 255, 255, .15) !important; }
.elcar-yoke-t thead th[data-sort] { cursor: pointer; user-select: none; }
.elcar-yoke-t thead th[data-sort]:hover { background: #3a4b5e; }
.elcar-yoke-t thead th.sort-asc::after { content: " ▲"; font-size: 9px; }
.elcar-yoke-t thead th.sort-desc::after { content: " ▼"; font-size: 9px; }
.elcar-yoke-t .col-alege { width: 44px; text-align: center; }
.elcar-yoke-t .col-cod { text-align: left; font-weight: 700; color: var(--ey-text); }
.elcar-yoke-t thead .col-cod { color: #fff; text-align: left; }
.elcar-yoke-t .col-alege,
.elcar-yoke-t .col-cod { position: sticky; left: 0; z-index: 1; }
.elcar-yoke-t .col-cod { left: 44px; box-shadow: 1px 0 0 var(--ey-linie); }
.elcar-yoke-t thead .col-alege,
.elcar-yoke-t thead .col-cod { z-index: 3; }
.elcar-yoke-t .col-cant { position: sticky; right: 0; z-index: 1; text-align: center; box-shadow: -1px 0 0 var(--ey-linie); }
.elcar-yoke-t thead .col-cant { z-index: 3; }
.elcar-yoke-t tbody tr { cursor: pointer; transition: background-color .12s; }
.elcar-yoke-t tbody tr:nth-child(even) td,
.elcar-yoke-t tbody tr:nth-child(even) th { background: #fafbfc; }
.elcar-yoke-t tbody tr:hover td,
.elcar-yoke-t tbody tr:hover th { background: #f0f7fb; }
.elcar-yoke-t tbody tr.ales td,
.elcar-yoke-t tbody tr.ales th { background: var(--ey-ales); }
.elcar-yoke-t tbody tr.ales .col-cod { color: var(--ey-albastru-inchis); box-shadow: inset 3px 0 0 var(--ey-albastru), 1px 0 0 var(--ey-linie); }
.elcar-yoke-t tbody tr.adaugat .col-cod::after { content: " ✓"; color: #1f9d55; }
.elcar-yoke-t tbody tr:last-child td,
.elcar-yoke-t tbody tr:last-child th { border-bottom: 0 !important; }
.elcar-yoke-t input[type=checkbox] { width: 18px; height: 18px; margin: 0; accent-color: var(--ey-albastru); cursor: pointer; }
.elcar-yoke-t .col-cant input { width: 68px; height: 34px; padding: 0 6px; border: 1px solid var(--ey-linie); border-radius: 6px; text-align: center; font-size: 14px; background: #fff; }
.elcar-yoke-t .col-cant input:disabled { opacity: .35; background: transparent; }
.elcar-yoke-gol { margin: 0; padding: 18px; color: var(--ey-gri); text-align: center; }

/* Bara de actiune: ramane vizibila jos cat timp sectiunea e pe ecran. */
.elcar-yoke-bara { position: sticky; bottom: 14px; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; padding: 12px 14px 12px 20px; border-radius: 12px; background: #1d2733; color: #fff; box-shadow: 0 10px 30px rgba(16, 38, 64, .28); }
.elcar-yoke-bara[hidden] { display: none; }
.elcar-yoke-numar { font-weight: 600; }
.elcar-yoke-bara .button { margin: 0 !important; border-radius: 8px !important; padding: 12px 22px !important; background: var(--ey-albastru) !important; color: #fff !important; font-weight: 700; }
.elcar-yoke-bara .button:hover { background: var(--ey-albastru-inchis) !important; }
.elcar-yoke-bara .button.loading { opacity: .7; }
.elcar-yoke-mesaj { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 12px 16px; border-radius: 10px; font-weight: 600; }
.elcar-yoke-mesaj[hidden] { display: none; }
.elcar-yoke-mesaj.ok { background: #e8f7ef; color: #155d38; }
.elcar-yoke-mesaj.err { background: #fdecec; color: #8a1c1c; }
.elcar-yoke-mesaj .button { margin: 0 !important; border-radius: 8px !important; }
.elcar-yoke-sursa { margin: 14px 0 0; font-size: 12px; color: var(--ey-gri); }

/* Ecrane inguste: fiecare cod devine un card cu eticheta langa valoare. */
@media (max-width: 760px) {
	.elcar-yoke { margin: 24px -4px; padding: 16px 14px; border-radius: 12px; }
	.elcar-yoke-cap h2 { font-size: 19px; }
	.elcar-yoke-cauta,
	.elcar-yoke-cauta input { width: 100%; }
	.elcar-yoke-corp.are-desen { display: block; }
	.elcar-yoke-desen { position: static; max-width: 320px; margin: 0 auto 16px; }
	.elcar-yoke-scroll { max-height: none; overflow: visible; border: 0; }
	.elcar-yoke-t,
	.elcar-yoke-t tbody,
	.elcar-yoke-t tr { display: block; width: 100%; }
	.elcar-yoke-t thead { display: none; }
	.elcar-yoke-t tbody tr { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; margin-bottom: 12px; padding: 10px 14px 12px; border: 1px solid var(--ey-linie); border-radius: 10px; background: #fff; }
	.elcar-yoke-t tbody tr[hidden] { display: none; }
	.elcar-yoke-t tbody tr td,
	.elcar-yoke-t tbody tr th,
	.elcar-yoke-t tbody tr:nth-child(even) td,
	.elcar-yoke-t tbody tr:nth-child(even) th,
	.elcar-yoke-t tbody tr:hover td,
	.elcar-yoke-t tbody tr:hover th { position: static; display: flex; justify-content: space-between; gap: 8px; padding: 6px 0 !important; border-bottom: 1px dashed var(--ey-linie) !important; background: transparent; box-shadow: none; white-space: normal; text-align: right; }
	.elcar-yoke-t tbody td::before { content: attr(data-eticheta); color: var(--ey-gri); font-size: 12px; text-align: left; }
	.elcar-yoke-t tbody tr.ales { border-color: var(--ey-albastru); background: var(--ey-ales); box-shadow: inset 4px 0 0 var(--ey-albastru); }
	.elcar-yoke-t tbody tr.ales td,
	.elcar-yoke-t tbody tr.ales th { background: transparent; }
	.elcar-yoke-t tbody .col-alege { order: -2; grid-column: 2; justify-content: flex-end; border-bottom: 0 !important; }
	.elcar-yoke-t tbody .col-cod { order: -3; grid-column: 1; grid-row: 1; justify-content: flex-start; font-size: 17px; border-bottom: 0 !important; box-shadow: none !important; }
	.elcar-yoke-t tbody .col-cant { grid-column: 1 / -1; order: 99; justify-content: space-between; align-items: center; border-bottom: 0 !important; padding-top: 10px !important; box-shadow: none !important; }
	.elcar-yoke-t input[type=checkbox] { width: 24px; height: 24px; }
	.elcar-yoke-t .col-cant input { width: 96px; height: 40px; font-size: 16px; }
	.elcar-yoke-bara { bottom: 8px; padding: 10px 10px 10px 14px; }
	.elcar-yoke-bara .button { padding: 12px 14px !important; font-size: 14px; }
}