/* ==========================================================================
   DiagPro — pagina de coș (/cos/), design v3, macheta „Cos.dc.html”.
   ZONĂ PROPRIE: perechea acestui fișier e mu-plugins/diagpro-cos.php.
   Toate valorile sunt luate din machetă, nu aproximate.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Curățăm ce pune tema în jurul conținutului paginii de coș
   -------------------------------------------------------------------------- */

body.woocommerce-cart .hero-section,
body.woocommerce-cart .entry-header,
body.woocommerce-cart .ct-breadcrumbs { display: none !important; }

/* Subsolul mare (al altui agent) nu apare în machetă pe coș — îl ascundem doar aici. */
body.woocommerce-cart .dp-footer,
body.woocommerce-cart #footer { display: none !important; }

/* În macheta „Cos.dc.html" bara de categorii nu există pe pagina de coș —
   antetul rămâne (logo, căutare, linkuri, butonul de coș evidențiat), bara dispare. */
body.woocommerce-cart #header [data-row="middle"] { display: none !important; }

/* ...dar pe mobil rândul acela ESTE antetul (logo + hamburger), iar `.dp-masthead` e ascuns sub
   1000px ⇒ pagina rămânea complet fără antet și clientul nu se mai putea întoarce în magazin. */
@media (max-width: 999px) {
	body.woocommerce-cart #header [data-row="middle"] { display: block !important; }
}

body.woocommerce-cart #main .ct-container-full,
body.woocommerce-cart #main .ct-container {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	max-width: none;
}
body.woocommerce-cart #main article.page { margin: 0; }
body.woocommerce-cart .entry-content {
	max-width: none !important;
	width: 100%;
	margin: 0;
	padding: 0;
}
body.woocommerce-cart .entry-content > .dpc {
	max-width: none !important;
	width: 100%;
	margin: 0;
}

/* Butonul de coș din antet e ACTIV pe pagina de coș (ca în machetă). */
body.woocommerce-cart .dp-masthead-cart {
	border-color: oklch(0.5 0.15 260) !important;
	color: oklch(0.5 0.15 260) !important;
	background: oklch(0.97 0.015 258) !important;
}

/* --------------------------------------------------------------------------
   1. Cadrul paginii
   -------------------------------------------------------------------------- */

.dpc {
	background: #ffffff;
	color: #131a26;
	font-family: 'Archivo', system-ui, sans-serif;
	/* Macheta nu impune înălțime de rând nicăieri în afară de numele produsului;
	   fără asta, line-height-ul temei (1.6+) umflă rândurile cu ~15px. */
	line-height: normal;
}
.dpc *,
.dpc *::before,
.dpc *::after { box-sizing: border-box; }

.dpc--lucreaza { opacity: 0.55; pointer-events: none; transition: opacity 0.12s linear; }

/* --------------------------------------------------------------------------
   2. Indicatorul de pași
   -------------------------------------------------------------------------- */

.dpc-pasi {
	max-width: 1280px;
	margin: 0 auto;
	padding: 28px 32px 0;
	display: flex;
	justify-content: center;
}
.dpc-pasi-in { display: flex; align-items: center; gap: 14px; }
.dpc-pas { display: flex; align-items: center; gap: 9px; }
.dpc-bul {
	width: 28px; height: 28px; border-radius: 50%;
	background: #eef3fb; color: #8b97a8;
	font-size: 13px; font-weight: 800;
	display: flex; align-items: center; justify-content: center;
	flex-shrink: 0;
}
.dpc-pas-t { font-size: 14px; font-weight: 600; color: #8b97a8; white-space: nowrap; }
.dpc-pas--activ .dpc-bul { background: oklch(0.5 0.15 260); color: #ffffff; }
.dpc-pas--activ .dpc-pas-t { font-weight: 800; color: #16233d; }
.dpc-linie { width: 56px; height: 2px; background: #dbe4f2; flex-shrink: 0; }

/* --------------------------------------------------------------------------
   3. Mesajele WooCommerce (cupon greșit, stoc etc.)
   -------------------------------------------------------------------------- */

.dpc-notite { max-width: 1280px; margin: 0 auto; padding: 20px 32px 0; }
.dpc-notite-in ul,
.dpc-notite-in .woocommerce-error,
.dpc-notite-in .woocommerce-message,
.dpc-notite-in .woocommerce-info {
	list-style: none;
	margin: 0 0 10px;
	padding: 13px 18px;
	border-radius: 11px;
	font-size: 13.5px;
	line-height: 1.45;
	border: 1px solid #dbe4f2;
	background: #fbfcfe;
	color: #33415c;
}
.dpc-notite-in .woocommerce-error {
	border-color: oklch(0.85 0.06 25);
	background: oklch(0.97 0.02 25);
	color: oklch(0.45 0.16 25);
}
.dpc-notite-in .woocommerce-message { border-color: #cfe3d5; background: #f4faf6; color: oklch(0.42 0.11 150); }
.dpc-notite-in li { margin: 0; padding: 0; }
.dpc-notite-in li + li { margin-top: 5px; }
.dpc-notite-in .button { display: none; }
/* WooCommerce/Blocksy pun o iconiță absolută peste text — nu e în machetă.
   ⚠️ Mesajele nu vin mereu ca <ul>: WooCommerce 10 le dă ca <div class="woocommerce-message">,
   iar iconița lui rămânea suprapusă peste prima literă (se vedea pe telefon, 19.08). */
.dpc-notite-in ul::before,
.dpc-notite-in ul::after,
.dpc-notite-in li::before,
.dpc-notite-in li::after,
.dpc-notite-in > *::before,
.dpc-notite-in > *::after { content: none !important; display: none !important; }

/* --------------------------------------------------------------------------
   4. Aranjarea în două coloane
   -------------------------------------------------------------------------- */

.dpc-grid {
	max-width: 1280px;
	margin: 0 auto;
	padding: 26px 32px 56px;
	display: flex;
	gap: 28px;
	align-items: flex-start;
}
.dpc-main { flex: 1; min-width: 0; }

.dpc-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 16px; }
.dpc-titlu {
	margin: 0; padding: 0;
	font-size: 28px; font-weight: 800; color: #16233d; letter-spacing: -0.5px;
	line-height: 1.2;
}
.dpc-numar { font-size: 14px; color: #8b97a8; }

/* --------------------------------------------------------------------------
   5. Cardul cu produse
   -------------------------------------------------------------------------- */

.dpc-card { border: 1px solid #e3e8f0; border-radius: 16px; overflow: hidden; background: #ffffff; }
.dpc-form { margin: 0; padding: 0; }

.dpc-rand {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 20px 22px;
	border-bottom: 1px solid #edf1f7;
	background: #ffffff;
}

.dpc-poza {
	width: 104px; height: 84px;
	border-radius: 9px;
	background: #f7f9fc;
	flex-shrink: 0;
	display: flex; align-items: center; justify-content: center;
	overflow: hidden;
}
.dpc-poza img {
	width: 100%; height: 100%;
	object-fit: contain;
	display: block;
	padding: 4px;
	border-radius: 9px;
	margin: 0;
}

.dpc-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.dpc-nume {
	font-size: 15px; font-weight: 700; color: #16233d !important;
	line-height: 1.35; text-decoration: none;
}
.dpc-nume:hover { color: oklch(0.5 0.15 260) !important; }
.dpc-cod { font-family: 'Space Grotesk', sans-serif; font-size: 11.5px; color: #8b97a8; }
.dpc-stoc { font-size: 12.5px; font-weight: 700; }
.dpc-stoc--in { color: oklch(0.55 0.13 150); }
.dpc-stoc--com { color: oklch(0.6 0.14 60); }
.dpc-variatie { font-size: 12px; color: #8b97a8; white-space: pre-line; }
.dpc-variatie p { margin: 0; }

/* Selectorul de cantitate */
.dpc-cant {
	display: flex; align-items: center;
	border: 1.5px solid #cdd6e4; border-radius: 10px;
	overflow: hidden; flex-shrink: 0;
	background: #ffffff;
}
.dpc .dpc-cant-b {
	width: 36px; height: 38px;
	border: none; border-radius: 0;
	background: #fbfcfe;
	color: #33415c;
	font-size: 16px; font-weight: 400; line-height: 1;
	font-family: inherit;
	cursor: pointer;
	padding: 0; margin: 0;
	-webkit-appearance: none; appearance: none;
	display: flex; align-items: center; justify-content: center;
	box-shadow: none; text-transform: none; letter-spacing: normal;
	min-height: 0; min-width: 0;
	transition: background 0.12s linear, color 0.12s linear;
}
.dpc .dpc-cant-b:hover { background: #eef3fb; color: oklch(0.5 0.15 260); }
.dpc-cant-n {
	width: 40px; text-align: center;
	font-size: 14.5px; font-weight: 800; color: #16233d;
	background: #ffffff;
	line-height: 38px;
}

/* Coloana de preț */
.dpc-pret {
	width: 150px; flex-shrink: 0;
	display: flex; flex-direction: column; align-items: flex-end; gap: 2px;
	text-align: right;
}
.dpc-pret-t { font-size: 17px; font-weight: 800; color: #16233d; }
.dpc-pret-v { font-size: 12.5px; color: #8b97a8; text-decoration: line-through; }
.dpc-pret-n { font-size: 12px; color: #8b97a8; }
.dpc-pret .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }

/* Butonul de ștergere */
.dpc .dpc-sterge {
	width: 34px; height: 34px;
	border: none; border-radius: 9px;
	background: transparent;
	color: #b6c0cf;
	font-size: 16px; line-height: 1; font-family: inherit; font-weight: 400;
	cursor: pointer; flex-shrink: 0;
	padding: 0; margin: 0;
	-webkit-appearance: none; appearance: none;
	display: flex; align-items: center; justify-content: center;
	box-shadow: none; min-height: 0; min-width: 0;
	transition: background 0.12s linear, color 0.12s linear;
}
.dpc .dpc-sterge:hover { background: oklch(0.95 0.03 25); color: oklch(0.5 0.16 25); }

/* Bara de jos a cardului */
.dpc-bara {
	display: flex; align-items: center; justify-content: space-between;
	gap: 16px; padding: 16px 22px; background: #fbfcfe;
}
.dpc-cupon { display: flex; gap: 10px; align-items: center; margin: 0; }
.dpc .dpc-cupon-in {
	border: 1.5px solid #cdd6e4; border-radius: 9px;
	padding: 10px 14px;
	font-size: 13.5px; font-family: inherit; color: #16233d;
	outline: none; width: 200px; background: #ffffff;
	height: auto; margin: 0; box-shadow: none;
}
.dpc .dpc-cupon-in::placeholder { color: #93a0b4; }
.dpc .dpc-cupon-in:focus { border-color: oklch(0.5 0.15 260); box-shadow: none; }
.dpc .dpc-cupon-b {
	border: 1.5px solid #b9c7de; background: transparent;
	color: #16233d; font-weight: 700; font-size: 13px;
	padding: 10px 18px; border-radius: 9px;
	cursor: pointer; font-family: inherit;
	-webkit-appearance: none; appearance: none;
	box-shadow: none; text-transform: none; letter-spacing: normal;
	min-height: 0; line-height: 1.2;
	transition: border-color 0.12s linear, color 0.12s linear;
}
.dpc .dpc-cupon-b:hover { border-color: oklch(0.5 0.15 260); color: oklch(0.5 0.15 260); background: transparent; }
.dpc-continua { font-size: 13.5px; font-weight: 700; color: oklch(0.5 0.15 260) !important; text-decoration: none; white-space: nowrap; }
.dpc-continua:hover { color: oklch(0.42 0.15 260) !important; }

/* Cupoanele deja aplicate (nu sunt în machetă — necesare ca să poată fi scoase) */
.dpc-cupoane { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 22px 16px; background: #fbfcfe; }
.dpc-cupon-chip {
	display: inline-flex; align-items: center; gap: 8px;
	border: 1px solid #cfe3d5; background: #f4faf6;
	color: oklch(0.42 0.11 150);
	border-radius: 999px; padding: 5px 12px;
	font-size: 12.5px; font-weight: 700;
}
.dpc-cupon-chip a { color: oklch(0.42 0.11 150) !important; text-decoration: none; font-size: 11px; }

/* --------------------------------------------------------------------------
   6. „Merge bine împreună”
   -------------------------------------------------------------------------- */

.dpc-cross { margin-top: 26px; }
.dpc-cross-t { margin: 0 0 14px; padding: 0; font-size: 18px; font-weight: 800; color: #16233d; line-height: 1.3; }
.dpc-cross-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.dpc-cs {
	display: flex; align-items: center; gap: 14px;
	border: 1px solid #e3e8f0; border-radius: 12px;
	padding: 14px 16px; background: #ffffff;
}
.dpc-cs-poza {
	width: 58px; height: 46px; border-radius: 7px;
	background: #f7f9fc; flex-shrink: 0; overflow: hidden;
	display: flex; align-items: center; justify-content: center;
}
.dpc-cs-poza img { width: 100%; height: 100%; object-fit: contain; display: block; margin: 0; padding: 2px; }
.dpc-cs-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dpc-cs-nume {
	font-size: 13.5px; font-weight: 700; color: #16233d !important; line-height: 1.3;
	text-decoration: none;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.dpc-cs-nume:hover { color: oklch(0.5 0.15 260) !important; }
.dpc-cs-pret { font-size: 13px; font-weight: 800; color: #16233d; }
.dpc-cs-pret .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
.dpc .dpc-add {
	border: 1.5px solid oklch(0.5 0.15 260); background: transparent;
	color: oklch(0.5 0.15 260) !important;
	font-weight: 700; font-size: 12.5px;
	padding: 9px 14px; border-radius: 9px;
	cursor: pointer; font-family: inherit; flex-shrink: 0;
	text-decoration: none; white-space: nowrap; line-height: 1.2;
	transition: background 0.12s linear, color 0.12s linear;
}
.dpc .dpc-add:hover { background: oklch(0.5 0.15 260); color: #ffffff !important; }

/* --------------------------------------------------------------------------
   7. Bara laterală
   -------------------------------------------------------------------------- */

.dpc-side {
	width: 380px; flex-shrink: 0;
	position: sticky; top: 20px;
	display: flex; flex-direction: column; gap: 14px;
}
.dpc-sum {
	border: 1px solid #dbe4f2; border-radius: 16px;
	padding: 24px;
	box-shadow: 0 14px 34px rgba(22, 35, 61, 0.07);
	display: flex; flex-direction: column; gap: 12px;
	background: #ffffff;
}
.dpc-sum-t { margin: 0 0 2px; padding: 0; font-size: 18px; font-weight: 800; color: #16233d; line-height: 1.3; }
.dpc-r { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; color: #4a5568; }
.dpc-r-v { font-weight: 700; color: #16233d; white-space: nowrap; }
.dpc-r--economie { color: oklch(0.45 0.16 25); }
.dpc-r--economie .dpc-r-v { color: oklch(0.45 0.16 25); }
.dpc-r .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
/* Explicația de sub rândul de transport, când costul nu e încă știut (07.09.2026).
   Cardul e `flex column` cu `gap: 12px` ⇒ marginea negativă o lipește de rândul de
   deasupra, ca să se citească drept continuarea lui, nu ca un rând nou de sumar. */
.dpc-r-info { margin-top: -8px; font-size: 12px; line-height: 1.35; color: #8b97a8; }

.dpc-total {
	border-top: 1px solid #edf1f7; padding-top: 12px;
	display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
}
.dpc-total-t { font-size: 15px; font-weight: 800; color: #16233d; }
.dpc-total-v { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.dpc-total-n { font-size: 26px; font-weight: 800; color: #16233d; line-height: 1.15; }
.dpc-total-n .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
.dpc-total-tva { font-size: 12px; color: #8b97a8; }
.dpc-total-tva .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }

.dpc .dpc-cta {
	background: oklch(0.5 0.15 260); color: #ffffff !important;
	font-weight: 800; font-size: 15.5px;
	padding: 15px 0; border-radius: 11px;
	text-align: center; display: block; text-decoration: none;
	transition: background 0.12s linear;
}
.dpc .dpc-cta:hover { background: oklch(0.43 0.15 260); color: #ffffff !important; }
.dpc-nota { font-size: 12px; color: #8b97a8; text-align: center; }

.dpc-gar {
	border: 1px solid #e3e8f0; border-radius: 14px;
	padding: 18px 20px;
	display: flex; flex-direction: column; gap: 8px;
	background: #fbfcfe;
}
.dpc-gar span { font-size: 13px; color: #4a5568; }
.dpc-gar i { color: oklch(0.5 0.15 260); font-weight: 800; font-style: normal; }
.dpc-gar .dp-wa,
.dpc-gar a { font-weight: 700; color: oklch(0.48 0.13 150) !important; text-decoration: none; }

/* --------------------------------------------------------------------------
   8. Coșul gol
   -------------------------------------------------------------------------- */

.dpc-gol {
	max-width: 1280px; margin: 0 auto;
	padding: 60px 32px 80px;
	display: flex; flex-direction: column; align-items: center; gap: 14px;
	text-align: center;
}
.dpc-gol-ico {
	width: 74px; height: 74px; border-radius: 50%;
	background: #eef3fb;
	display: flex; align-items: center; justify-content: center;
	font-size: 28px; color: oklch(0.5 0.15 260);
}
.dpc-gol-t { margin: 0; padding: 0; font-size: 26px; font-weight: 800; color: #16233d; line-height: 1.25; }
.dpc-gol-p { margin: 0; font-size: 14.5px; color: #4a5568; }
.dpc .dpc-gol-b {
	background: oklch(0.5 0.15 260); color: #ffffff !important;
	font-weight: 700; font-size: 14.5px;
	padding: 13px 26px; border-radius: 10px;
	margin-top: 6px; text-decoration: none; display: inline-block;
	transition: background 0.12s linear;
}
.dpc .dpc-gol-b:hover { background: oklch(0.43 0.15 260); color: #ffffff !important; }

/* --------------------------------------------------------------------------
   9. Subsolul redus
   -------------------------------------------------------------------------- */

.dpc-subsol { background: #f7f9fc; border-top: 1px solid #e3e8f0; }
.dpc-subsol-in {
	max-width: 1280px; margin: 0 auto;
	padding: 18px 32px;
	display: flex; align-items: center; justify-content: space-between;
	gap: 16px; flex-wrap: wrap;
}
.dpc-insigne { display: flex; gap: 10px; flex-wrap: wrap; }
.dpc-insigne span {
	border: 1px solid #dbe1ea; border-radius: 6px;
	padding: 6px 12px;
	font-family: 'Space Grotesk', sans-serif; font-size: 11px; color: #5a6675;
}
.dpc-subsol-legal { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
/* 07.09.2026 — contrast 2,81:1 pe #f7f9fc, sub pragul WCAG; aliniat cu fixul deja făcut
   pe footer.css (#12, 04.09): #8b97a8 → #5b6779 (5,44:1). Frate al bugului deja reparat —
   subsolul ăsta e propriu paginii /cos/, nu trecea prin footer.css. */
.dpc-subsol-legal a { font-size: 12.5px; color: #5b6779 !important; text-decoration: none; }
.dpc-subsol-legal a:hover { color: oklch(0.5 0.15 260) !important; }
.dpc-subsol-legal span { font-size: 12.5px; color: #5b6779; }

/* --------------------------------------------------------------------------
   10. Ecrane mici
   -------------------------------------------------------------------------- */

@media (max-width: 1120px) {
	/* O singură coloană; sumarul urcă ÎNAINTEA cross-sells-urilor, ca butonul de
	   finalizare să nu ajungă la subsolul paginii. */
	.dpc-grid { flex-direction: column; gap: 20px; }
	.dpc-main { display: contents; }
	.dpc-head { order: 1; margin-bottom: -6px; }
	.dpc-card { order: 2; }
	.dpc-side { order: 3; width: 100%; position: static; }
	#dpc-cross { order: 4; }
	.dpc-cross { margin-top: 0; }
}

@media (max-width: 782px) {
	.dpc-pasi { padding: 20px 20px 0; }
	.dpc-linie { width: 26px; }
	.dpc-pas-t { font-size: 13px; }
	.dpc-notite { padding: 16px 20px 0; }
	.dpc-grid { padding: 20px 20px 44px; }
	.dpc-gol { padding: 48px 20px 64px; }
	.dpc-cross-grid { grid-template-columns: 1fr; }
	.dpc-subsol-in { padding: 16px 20px; justify-content: center; text-align: center; }
	.dpc-insigne { justify-content: center; }
	.dpc-subsol-legal { justify-content: center; gap: 14px; }
}

@media (max-width: 640px) {
	.dpc-titlu { font-size: 23px; }
	.dpc-rand {
		display: grid;
		grid-template-columns: 76px minmax(0, 1fr) 34px;
		grid-template-areas:
			"poza info sterge"
			"cant pret pret";
		gap: 12px 12px;
		padding: 16px 14px;
		align-items: center;
	}
	.dpc-poza { grid-area: poza; width: 76px; height: 62px; align-self: start; }
	.dpc-info { grid-area: info; align-self: start; }
	.dpc-sterge { grid-area: sterge; align-self: start; }
	.dpc-cant { grid-area: cant; justify-self: start; }
	.dpc-pret { grid-area: pret; width: auto; justify-self: end; }
	.dpc-pret-t, .dpc-pret-v, .dpc-pret-n { white-space: nowrap; }
	.dpc-bara { flex-direction: column; align-items: stretch; gap: 12px; padding: 14px; }
	.dpc-cupon { width: 100%; }
	.dpc .dpc-cupon-in { flex: 1; width: auto; min-width: 0; }
	.dpc-continua { text-align: center; }
	.dpc-cupoane { padding: 0 14px 14px; }
	.dpc-sum { padding: 20px; }
	.dpc-total-n { font-size: 24px; }
}

@media (max-width: 420px) {
	.dpc-pasi-in { gap: 8px; }
	.dpc-linie { width: 14px; }
	.dpc-pas-t { font-size: 12px; }
	.dpc-bul { width: 24px; height: 24px; font-size: 12px; }
}

/* ==========================================================================
   11. TELEFON — macheta „Mobil Cos.dc.html” (19–20.08.2026)
   Prag 767px, ca în fundația mobilă (css/mobil.css).
   Toate valorile sunt citite din machetă, nu aproximate.
   ========================================================================== */

/* Elementele care există DOAR în macheta mobilă. Le ținem stinse peste tot,
   ca desktopul să rămână bit-cu-bit cel de dinainte. */
.dpc-transport,
.dpc-incredere,
.dpc-total-net { display: none; }

@media (max-width: 767px) {

	/* --- cadru: cardurile stau direct pe fundal, cu 16px în margini ---------- */
	.dpc-pasi { display: none; }                     /* pașii 1-2-3 nu sunt în macheta mobilă */
	.dpc-notite { padding: 12px 16px 0; }
	/* `align-items: flex-start` (regula de desktop) strângea fiecare bloc la lățimea
	   textului lui — pe telefon coloana trebuie să fie plină. */
	.dpc-grid { padding: 0 0 10px; gap: 12px; align-items: stretch; }
	.dpc-side { padding: 0 16px; gap: 12px; }
	#dpc-cross { padding: 0 16px; }

	/* ordinea din macheta mobilă */
	#dpc-banda { order: 1; }
	.dpc-card { order: 2; }
	.dpc-side { order: 3; }
	#dpc-cross { order: 4; }

	/* --- antetul compact ------------------------------------------------------ */
	/* „← Coșul meu (2)” îl desenează antetul mobil (mu-plugins/diagpro-antet-mobil.php,
	   `data-tip="cos"`), exact ca în machetă. Titlul paginii ar fi al doilea antet. */
	.dpc-head { display: none; }

	/* --- banda de transport -------------------------------------------------- */
	/* Machetă: margin 14px 16px 0; radius 12px; padding 12px 14px; bară 6px. */
	#dpc-banda:empty { display: none; }
	#dpc-banda { padding: 0 16px; }
	.dpc-transport {
		display: block;
		background: #eef3fb;
		border: 1px solid #dbe4f2;
		border-radius: 12px;
		padding: 12px 14px;
	}
	.dpc-transport--gata { background: #eef8f1; border-color: #cfe8da; }
	.dpc-transport-t {
		display: flex;
		align-items: center;
		gap: 7px;
		font-size: 12.5px;
		font-weight: 800;
		color: oklch(0.45 0.15 260);
	}
	.dpc-transport--gata .dpc-transport-t { color: oklch(0.45 0.13 150); }
	.dpc-transport-t svg { flex-shrink: 0; }
	.dpc-transport-t .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
	.dpc-transport-d { font-size: 11.5px; color: #4a5568; margin-top: 2px; }
	.dpc-transport-d .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
	.dpc-transport-bara {
		height: 6px;
		background: #dbe4f2;
		border-radius: 999px;
		margin-top: 8px;
		overflow: hidden;
	}
	.dpc-transport-bara span {
		display: block;
		height: 100%;
		border-radius: 999px;
		background: oklch(0.5 0.15 260);
	}
	.dpc-transport--gata .dpc-transport-bara { background: #d8ede1; }
	.dpc-transport--gata .dpc-transport-bara span { background: oklch(0.55 0.13 150); }

	/* --- lista de produse: fiecare linie e un card ---------------------------- */
	.dpc-card {
		display: flex;
		flex-direction: column;
		gap: 12px;
		padding: 0 16px;
		border: 0;
		border-radius: 0;
		background: none;
		overflow: visible;
	}
	#dpc-items { display: flex; flex-direction: column; gap: 12px; }

	/* Machetă: card 1px #e3e8f0, radius 14px, padding 12px, gap 12px;
	   poza 84×84 la stânga pe ambele rânduri, ✕ sus-dreapta. */
	.dpc-rand {
		display: grid;
		grid-template-columns: 84px minmax(0, 1fr) auto;
		grid-template-areas:
			"poza info sterge"
			"poza cant pret";
		column-gap: 12px;
		row-gap: 10px;
		align-items: start;
		padding: 12px;
		border: 1px solid #e3e8f0;
		border-bottom: 1px solid #e3e8f0;
		border-radius: 14px;
	}
	.dpc-poza { grid-area: poza; width: 84px; height: 84px; border-radius: 10px; align-self: start; }
	.dpc-poza img { padding: 5px; border-radius: 10px; }
	.dpc-info { grid-area: info; gap: 6px; }
	.dpc-nume { font-size: 13px; line-height: 1.3; }
	.dpc-cod { display: none; }                       /* codul nu e în macheta mobilă */
	.dpc-stoc { font-size: 11px; }
	.dpc-variatie { font-size: 11px; line-height: 1.35; }

	.dpc-sterge { grid-area: sterge; align-self: start; justify-self: end; }
	.dpc .dpc-sterge { position: relative; width: 22px; height: 22px; font-size: 15px; color: #6b7683; margin: -2px -2px 0 0; }
	.dpc .dpc-sterge::after { content: ""; position: absolute; inset: -11px; }

	/* Machetă: butoane 32×32, cifra 34px, chenar 1.5px #cdd6e4, radius 9px.
	   Zona de atins reală o ducem la 44px cu un pseudo-element invizibil — desenul
	   rămâne al machetei, degetul primește minimul cerut. */
	.dpc-cant { grid-area: cant; justify-self: start; align-self: center; border-radius: 9px; overflow: visible; }
	.dpc .dpc-cant-b { position: relative; width: 32px; height: 32px; font-size: 15px; background: #f7f9fc; }
	.dpc .dpc-cant-b::after { content: ""; position: absolute; inset: -6px -3px; }
	.dpc .dpc-cant-b:first-of-type { border-radius: 8px 0 0 8px; }
	.dpc .dpc-cant-b:last-of-type { border-radius: 0 8px 8px 0; }
	.dpc-cant-n { width: 34px; font-size: 13.5px; line-height: 32px; }

	.dpc-pret { grid-area: pret; align-self: center; width: auto; justify-self: end; gap: 1px; }
	.dpc-pret-t { font-size: 16px; }
	.dpc-pret-v { font-size: 10.5px; color: #98a3b3; }
	.dpc-pret-n { display: none; }                    /* „fără TVA” stă o singură dată, la total */

	/* --- rândul de cupon: chenar punctat, ca în machetă ---------------------- */
	.dpc-bara {
		flex-direction: row;
		align-items: stretch;
		gap: 0;
		padding: 0;
		background: none;
	}
	/* Machetă: chenar punctat, padding 12px 14px. Padding-ul îl mutăm pe input și pe
	   buton, ca degetul să prindă tot rândul (desenul iese identic, ținta ajunge la 44px). */
	.dpc-cupon {
		flex: 1;
		gap: 10px;
		border: 1px dashed #cdd6e4;
		border-radius: 12px;
		padding: 0 14px;
	}
	.dpc .dpc-cupon-in {
		flex: 1;
		width: auto;
		min-width: 0;
		border: 0;
		border-radius: 0;
		padding: 12px 0;
		background: none;
		font-size: 13.5px;
	}
	.dpc .dpc-cupon-b {
		border: 0;
		background: none;
		padding: 12px 0;
		font-size: 13px;
		font-weight: 800;
		color: oklch(0.5 0.15 260);
	}
	.dpc-continua { display: none; }                  /* întoarcerea o face săgeata din antet */
	.dpc-cupoane { padding: 0; background: none; }

	/* --- cardul de totaluri --------------------------------------------------- */
	.dpc-sum {
		padding: 14px;
		gap: 8px;
		border: 1px solid #e3e8f0;
		border-radius: 14px;
		box-shadow: none;
	}
	.dpc-sum-t { display: none; }                     /* macheta nu are titlu pe card */
	.dpc-r { font-size: 13px; color: #5a6675; }
	/* ordinea din machetă: Subtotal · Transport · Reducere */
	.dpc-r { order: 2; }
	.dpc-r--economie { order: 3; }
	.dpc-r:first-of-type { order: 1; }
	/* ⚠️ Fără `order`, explicația de la transport ar avea order 0 (implicit) și ar sări
	   în capul cardului, deasupra subtotalului. Cu 2 rămâne lipită de rândul ei. */
	.dpc-r-info { order: 2; font-size: 12px; }
	.dpc-total { order: 4; padding-top: 10px; }
	.dpc-total-t { font-size: 14px; }
	.dpc-total-n { font-size: 22px; }
	.dpc-total-tva { display: none; }
	.dpc-total-net { display: block; font-size: 11px; color: #8b97a8; }
	.dpc-total-net .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
	/* butonul mare stă în bara lipită jos, nu în card */
	.dpc .dpc-cta,
	.dpc-nota { display: none; }

	/* --- rândul de încredere -------------------------------------------------- */
	.dpc-gar { display: none; }                       /* cardul de garanții e forma de desktop */
	.dpc-incredere {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 6px 14px;
		padding: 2px 0 4px;
	}
	.dpc-incredere span { font-size: 11px; color: #8b97a8; }

	/* --- „Merge bine împreună” ------------------------------------------------ */
	.dpc-cross-t { font-size: 16px; margin-bottom: 10px; }
	.dpc-cs { padding: 12px; gap: 12px; border-radius: 12px; }
	.dpc-cs-nume { font-size: 13px; }
	.dpc .dpc-add { padding: 10px 12px; font-size: 12px; }

	/* --- coșul gol ------------------------------------------------------------ */
	.dpc-gol { padding: 44px 16px 56px; }
	.dpc-gol-t { font-size: 22px; }
	.dpc-gol-p { font-size: 14px; }

	/* --- subsolul redus ------------------------------------------------------- */
	.dpc-subsol-in { padding: 14px 16px; gap: 12px; }

	/* --- bara de acțiune lipită jos ------------------------------------------- */
	/* Fundația (css/mobil.css) o poziționează; aici doar înfățișarea din machetă.
	   Selectorii au clasa în plus fiindcă mobil.css se încarcă DUPĂ cos.css. */
	.dpm-bara.dpc-bara-jos .dpm-bara-pret small {
		display: block;
		font-size: 10.5px;
		font-weight: 700;
		color: #8b97a8;
		line-height: 1.2;
	}
	.dpm-bara.dpc-bara-jos .dpm-bara-pret b {
		font-size: 17px;
		font-weight: 800;
		color: #16233d;
		line-height: 1;
	}
	.dpm-bara.dpc-bara-jos .dpm-bara-pret .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
	.dpm-bara .dpm-bara-buton a.dpc-bara-cta {
		background: oklch(0.5 0.15 260);
		color: #ffffff !important;
		border-radius: 10px;
		font-size: 15px;
		font-weight: 800;
		text-decoration: none;
		box-shadow: none;
		border: 0;
	}

	/* Bara noastră e cu 3px mai înaltă decât rezerva fundației (69 vs 66) —
	   ultimul card ar fi rămas pe jumătate sub ea. */
	body.woocommerce-cart.dpm-are-nav.dpm-cu-bara { padding-bottom: calc(var(--dpm-nav-total) + 74px); }
}

/* ⛔ REPARAT 04.09.2026 — caseta „Merge bine împreună" era mai îngustă decât restul coloanei
   pe tabletă (măsurat la 768px: 558px față de 680px cardul de deasupra), fiindcă grila ei
   primea o singură coloană dimensionată după conținut. Se întinde acum pe toată lățimea. */
.dpc-cross, .dpc-cross-grid { width: 100%; box-sizing: border-box; }
@media (min-width: 768px) and (max-width: 999px) {
	.dpc-cross-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
