/* ═══════════════════════════════════════════════════════════════════
   ux.css — stratul de experiență al portalului de retur (23 oct 2026)
   Se încarcă DUPĂ styles.css; nu înlocuiește nimic, doar adaugă.
   Oprire completă: scoate <link ux.css> și <script ux.js> din index.html.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --ux-ease: cubic-bezier(.22, 1, .36, 1);
  --ux-ease-in: cubic-bezier(.4, 0, 1, 1);
  --ux-1: 140ms;
  --ux-2: 260ms;
  --ux-3: 440ms;
  --ux-safe-b: env(safe-area-inset-bottom, 0px);
  --ux-grad: linear-gradient(135deg, #ff9a3c 0%, #f26b00 55%, #e8472b 100%);
  --ux-green: #4ade80;
}
html { color-scheme: dark light; -webkit-text-size-adjust: 100%; }
html[data-ux-theme="dark"] { color-scheme: dark; }
html[data-ux-theme="light"] { color-scheme: light; }

/* ── Text mai mare și mai ușor de citit (și pentru oameni în vârstă) ───────── */
.step-dot small { font-size: 11.5px; }
.step-lead { font-size: 16px; }
.step-head p { font-size: 16px; }
.field-label, .order-label { font-size: 13.5px; }
.sub-card h3 { font-size: 14px; }
.product-select, .product-meta span, .ordered-size-label, .ordered-qty { font-size: 14px; }
.size-list-label { font-size: 12.5px; }
.size-choice span { font-size: 11.5px; }
.size-choice strong { font-size: 14.5px; }
.action-text span, .method-inner span { font-size: 14px; line-height: 1.45; }
.method-suggestion, .pv-hint, .pv-desc { font-size: 14.5px; line-height: 1.55; }
.locker-choice span { font-size: 13.5px; }
.locker-choice small { font-size: 12.5px; }
.locker-results-head strong, .locker-results-head span, .locker-selected-note span { font-size: 13px; }
.exvar-desc, .exvar-steps li { font-size: 14px; line-height: 1.55; }
.exsz-hint { font-size: 13.5px; }
.exchange-credit-rows div, .exchange-credit-empty, .exchange-refund-note { font-size: 14px; }
.rv-meta { font-size: 13.5px; }
.rv-row span:first-child { font-size: 14px; }
.pack-steps { font-size: 15px; }
.check-label { font-size: 15px; }
.fees-output { font-size: 15px; }
.success-ref, .locker-hint, .success-fees { font-size: 15px; }
.success-fees > span { display: block; }
.awb-label, .locker-label { font-size: 12px; }
.policy-ghost { font-size: 14.5px; padding: 8px; }
.btn-primary, .btn-ghost { min-height: 48px; justify-content: center; }
.city-choice { min-height: 40px; }
.size-choice { min-height: 46px; min-width: 52px; justify-content: center; }
.check-label input[type="checkbox"], .product-select input[type="checkbox"] { width: 22px; height: 22px; }
.exsz-mode-switch input { width: 20px; height: 20px; }
.exsz-mode-switch label { min-height: 40px; font-size: 15px; }
.field-input { min-height: 48px; font-size: 16px; } /* 16px = iOS nu mai face zoom la focus */
select.field-input { font-size: 16px; }
.pv-input, .order-input-wrap input { font-size: 18px; }

/* ── Reparație: pe telefon câmpul comenzii împingea butonul „Caută” în afara ecranului ── */
.order-input-wrap, .pv-input-wrap { min-width: 0; }
.order-input-wrap input, .pv-input { min-width: 0; width: 100%; }
.btn-search { flex: none; }
.step-lead, .step-head p { text-wrap: balance; }
/* Pasul 1: întâi comanda (acțiunea principală), apoi ghidul video */
.step-panel[data-step="1"].active { display: flex; flex-direction: column; }
.step-panel[data-step="1"] .step-hero { order: 0; }
.step-panel[data-step="1"] .order-card { order: 1; }
.step-panel[data-step="1"] .phone-verify-card { order: 2; }
.step-panel[data-step="1"] .return-video-card { order: 3; margin-top: 8px; }
.step-panel[data-step="1"] .policy-ghost { order: 4; }

/* ── Bifa de la „Ce vrei să faci?” era invizibilă (opacity 0 din styles.css): o arătăm ── */
.action-card .action-check { opacity: 1; transform: scale(.82); transition: transform var(--ux-2) var(--ux-ease), background var(--ux-1), border-color var(--ux-1), color var(--ux-1); }
.action-card input:checked + .action-card-inner .action-check { transform: scale(1); }
.exvar-card .action-check { transform: scale(.6); transition: opacity var(--ux-1), transform var(--ux-2) var(--ux-ease); }
.exvar-card input[type="radio"]:checked + .exvar-inner .action-check { transform: scale(1); }

/* ── Logo real al magazinului + subsol ───────────────────────────────────── */
.wz-logo .ux-logo { display: block; height: 46px; width: auto; border-radius: 6px; }
@media (max-width: 480px) { .wz-logo .ux-logo { height: 40px; } }
.ux-foot {
  margin-top: 40px; padding-top: 22px; border-top: 1px solid var(--border);
  display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; justify-content: space-between;
  color: var(--muted); font-size: 14px;
}
.ux-foot a { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.ux-foot a:hover { color: var(--orange); }
.ux-theme { display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px; border: 1px solid var(--border); background: var(--card); }
.ux-theme button {
  appearance: none; border: 0; background: transparent; color: var(--muted); cursor: pointer;
  font: inherit; font-size: 13.5px; font-weight: 600; padding: 8px 14px; min-height: 38px; border-radius: 999px;
  transition: background var(--ux-1), color var(--ux-1);
}
.ux-theme button[aria-pressed="true"] { background: var(--orange); color: #fff; }
.ux-theme button:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }

/* ── Progres: bară subțire + „Pasul n din 6” (vizibil mai ales pe telefon) ──── */
.ux-progress { height: 4px; border-radius: 4px; background: var(--faint); overflow: hidden; margin: -6px 0 10px; }
.ux-progress-fill {
  display: block; height: 100%; width: 100%; border-radius: 4px; background: var(--ux-grad);
  transform-origin: 0 50%; transform: scaleX(var(--p, .1667)); transition: transform var(--ux-3) var(--ux-ease);
}
.ux-stepnow { font-size: 14px; font-weight: 700; color: var(--muted); margin: 0 0 6px; letter-spacing: .2px; }
.ux-stepnow b { color: var(--orange); }
@media (min-width: 481px) { .ux-stepnow { display: none; } }
.step-line { position: relative; overflow: hidden; background: var(--faint); }
.step-line::after { content: ""; position: absolute; inset: 0; background: var(--orange); transform: scaleX(0); transform-origin: 0 50%; transition: transform var(--ux-3) var(--ux-ease); }
.step-line.done { background: var(--faint); }
.step-line.done::after { transform: scaleX(1); }
.step-dot.active span { animation: ux-ring 2.2s var(--ux-ease) 3; }
@keyframes ux-ring { 0%, 100% { box-shadow: 0 0 0 0 rgba(242,107,0,.45); } 55% { box-shadow: 0 0 0 9px rgba(242,107,0,0); } }

/* ── Tranziții între pași (View Transitions; fără suport = animația veche stepIn) ──
   Numele de tranziție se pun doar cât durează tranziția (clasa ux-vt-run), ca să nu rămână
   „containment” permanent pe panouri (ar tăia umbrele cardurilor). */
html.ux-vt .step-panel.active { animation: none; }
html.ux-vt-run .step-panel.active { view-transition-name: ux-step; }
html.ux-vt-run .success-screen:not(.hidden) { view-transition-name: ux-step; animation: none; }
html.ux-vt-run .wz-header { view-transition-name: ux-head; }
html.ux-vt-run .ux-progress { view-transition-name: ux-prog; }
html.ux-vt-run .ux-stepnow { view-transition-name: ux-now; }
html.ux-vt-run .step-panel.active > .nav-row:not(.nav-row-confirm) { view-transition-name: ux-nav; }
::view-transition-group(root) { animation-duration: 0s; }
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-group(ux-head), ::view-transition-group(ux-prog), ::view-transition-group(ux-now), ::view-transition-group(ux-nav) {
  animation-duration: var(--ux-2); animation-timing-function: var(--ux-ease);
}
html[data-ux-dir="fwd"]::view-transition-old(ux-step)  { animation: ux-out-l var(--ux-2) var(--ux-ease-in) both; }
html[data-ux-dir="fwd"]::view-transition-new(ux-step)  { animation: ux-in-r var(--ux-3) var(--ux-ease) both; }
html[data-ux-dir="back"]::view-transition-old(ux-step) { animation: ux-out-r var(--ux-2) var(--ux-ease-in) both; }
html[data-ux-dir="back"]::view-transition-new(ux-step) { animation: ux-in-l var(--ux-3) var(--ux-ease) both; }
@keyframes ux-out-l { to { opacity: 0; transform: translate3d(-34px, 0, 0); } }
@keyframes ux-out-r { to { opacity: 0; transform: translate3d(34px, 0, 0); } }
@keyframes ux-in-r  { from { opacity: 0; transform: translate3d(42px, 0, 0); } }
@keyframes ux-in-l  { from { opacity: 0; transform: translate3d(-42px, 0, 0); } }

/* ── Bară de acțiuni lipită jos pe telefon: „Continuă” e mereu la îndemână ──── */
@media (max-width: 719px) {
  .step-panel > .nav-row:not(.nav-row-confirm) {
    position: sticky; bottom: 0; z-index: 30;
    margin: 28px -16px 0; padding: 12px 16px calc(12px + var(--ux-safe-b));
    background: linear-gradient(to top, var(--bg) 72%, transparent);
  }
  .step-panel > .nav-row:not(.nav-row-confirm) .btn-next { flex: 1; font-size: 16px; padding-top: 14px; padding-bottom: 14px; }
  .step-panel > .nav-row:not(.nav-row-confirm) .btn-back { flex: 0 0 auto; }
  .wz-toast { bottom: calc(96px + var(--ux-safe-b)); }
}

/* Invitația de instalare nu acoperă formularul la mijlocul drumului: doar pe pasul 1 și după trimitere */
html[data-ux-step]:not([data-ux-step="1"]):not([data-ux-step="done"]) #pwa-install-banner { display: none !important; }

/* ── Apariție când se deschid blocuri ascunse (refund/schimb/easybox/curier…) ── */
#phone-verify-box:not(.hidden), #refund-section:not(.hidden), #exchange-section:not(.hidden),
#easybox-fields:not(.hidden), #courier-fields:not(.hidden), #exchange-product-mode:not(.hidden),
#exchange-size-mode:not(.hidden), #exchange-refund-fields:not(.hidden), #exchange-easybox-fields:not(.hidden),
#exchange-courier-fields:not(.hidden), .method-suggestion:not(.hidden), .size-recommendation:not(.hidden),
.initial-locker-box:not(.hidden), #exchange-product-size-picker:not(.hidden) {
  animation: ux-reveal var(--ux-3) var(--ux-ease) backwards;
}
@keyframes ux-reveal { from { opacity: 0; transform: translate3d(0, 12px, 0); } to { opacity: 1; transform: none; } }

/* ── Produse, rezultate, rânduri: intrare în cascadă ───────────────────────── */
.product-card, .locker-choice, .product-result-choice, .rv-section, .exvar-card, .action-card, .method-opt {
  animation: ux-rise var(--ux-3) var(--ux-ease) backwards;
  animation-delay: calc(var(--ux-i, 0) * 55ms);
}
@keyframes ux-rise { from { opacity: 0; transform: translate3d(0, 16px, 0) scale(.985); } to { opacity: 1; transform: none; } }
.product-card:nth-child(1), .locker-choice:nth-child(1) { --ux-i: 0; }
.product-card:nth-child(2), .locker-choice:nth-child(2), .rv-section:nth-child(2), .action-card:nth-child(2), .method-opt:nth-child(2) { --ux-i: 1; }
.product-card:nth-child(3), .locker-choice:nth-child(3), .rv-section:nth-child(3) { --ux-i: 2; }
.product-card:nth-child(4), .locker-choice:nth-child(4) { --ux-i: 3; }
.product-card:nth-child(n+5), .locker-choice:nth-child(n+5) { --ux-i: 4; }
.product-card { transition: border-color var(--ux-2), opacity var(--ux-2), transform var(--ux-2) var(--ux-ease), box-shadow var(--ux-2); }
.product-card:not(.not-selected) { border-color: rgba(242,107,0,.45); box-shadow: 0 0 0 1px rgba(242,107,0,.12); }
.product-card.not-selected { transform: scale(.985); opacity: .5; }
.product-card img { width: 88px; height: 88px; }

/* ── Cardul de produs pe telefon: coloana cu mărimi era de ~110 px (o mărime pe rând) → grilă pe 2 niveluri ── */
.size-list-label::after { content: " · atinge una ca să faci schimb"; text-transform: none; letter-spacing: 0; font-weight: 500; }
.size-list { gap: 8px; }
@media (max-width: 600px) {
  .product-card { display: grid; grid-template-columns: 88px 1fr; column-gap: 14px; row-gap: 10px; align-items: start; }
  .product-card .product-body { display: contents; }
  .product-card .product-select { grid-column: 1 / -1; grid-row: 1; padding: 2px 0 6px; font-size: 15px; font-weight: 600; color: var(--text); border-bottom: 1px solid var(--border); }
  .product-card img { grid-column: 1; grid-row: 2 / span 2; }
  .product-card .product-body h3 { grid-column: 2; grid-row: 2; font-size: 15px; margin: 0; }
  .product-card .product-ordered-size { grid-column: 2; grid-row: 3; margin: 0; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
  .product-card .size-list-label { grid-column: 1 / -1; grid-row: 4; margin: 4px 0 0; }
  .product-card .size-list { grid-column: 1 / -1; grid-row: 5; }
  .product-card .size-choice { flex: 0 0 auto; }
}

/* ── Selectul „motiv pe fiecare produs” folosea stilul implicit al sistemului ── */
.item-reason-row { align-items: center; gap: 12px; }
.item-reason-row select {
  -webkit-appearance: none; appearance: none; font: inherit; font-size: 15px; color: var(--text);
  background: var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 14px;
  border: 1.5px solid var(--border); border-radius: var(--radius); padding: 10px 36px 10px 12px; min-height: 46px; min-width: 0; flex: 1 1 170px; cursor: pointer;
}
.item-reason-row select:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(242,107,0,.15); outline: 0; }
@media (max-width: 480px) { .item-reason-row { flex-direction: column; align-items: stretch; } .item-reason-row select { width: 100%; flex: none; } }

/* ── Feedback la atingere ──────────────────────────────────────────────────── */
.btn-primary, .btn-ghost, .btn-submit, .size-choice, .locker-choice, .city-choice, .initial-locker-use, .advisor-action,
.action-card-inner, .method-inner, .exvar-inner, .product-result-choice, .ux-theme button {
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
@media (hover: none) {
  .btn-primary:active, .btn-submit:active { transform: scale(.97); }
  .btn-ghost:active, .size-choice:active, .locker-choice:active, .city-choice:active, .product-result-choice:active { transform: scale(.975); }
  .action-card:active .action-card-inner, .method-opt:active .method-inner, .exvar-card:active .exvar-inner { transform: scale(.985); }
}
.action-card input:checked + .action-card-inner, .method-opt input:checked + .method-inner { animation: ux-pop var(--ux-3) var(--ux-ease); }
@keyframes ux-pop { 0% { transform: scale(.985); } 45% { transform: scale(1.018); } 100% { transform: scale(1); } }
.size-choice.selected, .exchange-size-btn.selected { animation: ux-pop var(--ux-3) var(--ux-ease); }
.action-card input:focus-visible + .action-card-inner, .method-opt input:focus-visible + .method-inner, .exvar-card input:focus-visible + .exvar-inner {
  outline: 3px solid var(--orange); outline-offset: 2px;
}
:where(a, button, input, select, textarea, summary, [role="button"]):focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
.field-input:focus-visible, .order-input-wrap input:focus-visible, .pv-input:focus-visible { outline: 0; }

/* ── Stări: se încarcă / reușit / greșit ───────────────────────────────────── */
.btn-primary.ux-loading, .btn-submit.ux-loading { position: relative; pointer-events: none; }
.btn-primary.ux-loading .btn-label, .btn-submit.ux-loading { opacity: .95; }
.btn-primary.ux-loading svg, .btn-submit.ux-loading svg { display: none; }
.btn-primary.ux-loading::after, .btn-submit.ux-loading::after {
  content: ""; width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,.35); border-top-color: #fff;
  animation: spin .7s linear infinite; flex: none;
}
.lookup-status { display: flex; align-items: center; gap: 8px; font-size: 15px; transition: color var(--ux-2); }
.lookup-status[data-ux="loading"]::before {
  content: ""; width: 16px; height: 16px; border-radius: 50%; flex: none;
  border: 2.5px solid rgba(242,107,0,.25); border-top-color: var(--orange); animation: spin .7s linear infinite;
}
.lookup-status[data-ux="ok"] { color: var(--ux-green); font-weight: 700; }
.lookup-status[data-ux="ok"]::before { content: "✓"; display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--ux-green); color: #0a0a0a; font-size: 13px; flex: none; animation: ux-pop var(--ux-3) var(--ux-ease); }
.lookup-status[data-ux="error"] { color: #f87171; font-weight: 600; }
.order-card.ux-shake, .phone-verify-card.ux-shake, .ux-shake { animation: ux-shake .42s var(--ux-ease) both; }
@keyframes ux-shake { 15% { transform: translateX(-8px); } 35% { transform: translateX(7px); } 55% { transform: translateX(-5px); } 75% { transform: translateX(3px); } }
.fees-output.ux-flash, .exchange-credit-summary.ux-flash { animation: ux-flash .9s var(--ux-ease); }
@keyframes ux-flash { 0% { box-shadow: 0 0 0 0 rgba(242,107,0,.55); } 100% { box-shadow: 0 0 0 14px rgba(242,107,0,0); } }
.wz-toast { width: max-content; max-width: calc(100vw - 32px); white-space: normal; text-align: left; border-radius: 22px; display: flex; align-items: center; gap: 10px; background: #26282c; border-color: rgba(255,255,255,.12); color: #fff; font-size: 15px; font-weight: 600; box-shadow: 0 14px 40px rgba(0,0,0,.4); }
.wz-toast::before { content: "!"; display: inline-grid; place-items: center; width: 24px; height: 24px; flex: none; border-radius: 50%; background: var(--ux-grad); color: #fff; font-size: 14px; font-weight: 800; }
.wz-toast.ux-ok::before { content: "✓"; background: var(--ux-green); color: #0a0a0a; }

/* ── Ecranul de succes: bifă desenată, cascadă, confetti, copiere cod ───────── */
.success-icon svg path, .success-icon svg polyline { stroke-dasharray: 1; stroke-dashoffset: 1; }
.success-screen:not(.hidden) .success-icon { animation: popIn .6s .05s var(--ux-ease) both, ux-glow 2.6s 1s ease-out 2; }
.success-screen:not(.hidden) .success-icon svg path { animation: ux-draw .7s .25s var(--ux-ease) forwards; }
.success-screen:not(.hidden) .success-icon svg polyline { animation: ux-draw .45s .85s var(--ux-ease) forwards; }
@keyframes ux-draw { to { stroke-dashoffset: 0; } }
@keyframes ux-glow { 0% { box-shadow: 0 0 0 0 rgba(74,222,128,.55); } 100% { box-shadow: 0 0 0 36px rgba(74,222,128,0); } }
.success-screen:not(.hidden) .success-inner > :not(.success-icon) { animation: ux-rise .6s var(--ux-ease) backwards; }
.success-screen:not(.hidden) .success-inner > :nth-child(2) { animation-delay: .35s; }
.success-screen:not(.hidden) .success-inner > :nth-child(3) { animation-delay: .45s; }
.success-screen:not(.hidden) .success-inner > :nth-child(4) { animation-delay: .55s; }
.success-screen:not(.hidden) .success-inner > :nth-child(5) { animation-delay: .65s; }
.success-screen:not(.hidden) .success-inner > :nth-child(6) { animation-delay: .75s; }
.success-screen:not(.hidden) .success-inner > :nth-child(7) { animation-delay: .85s; }
.success-screen:not(.hidden) .success-inner > :nth-child(8) { animation-delay: .95s; }
.success-screen:not(.hidden) .success-inner > :nth-child(n+9) { animation-delay: 1.05s; }
.ux-copy {
  appearance: none; margin-top: 8px; border: 1px solid var(--border); background: var(--card); color: var(--text);
  font: inherit; font-size: 14px; font-weight: 700; padding: 9px 16px; min-height: 42px; border-radius: 999px; cursor: pointer;
  transition: background var(--ux-1), transform var(--ux-1), border-color var(--ux-1);
}
.ux-copy:hover { border-color: var(--orange); }
.ux-copy:active { transform: scale(.96); }
.ux-copy.is-done { background: var(--ux-green); border-color: var(--ux-green); color: #0a0a0a; }
.ux-next { list-style: none; counter-reset: ux; text-align: left; margin: 0 0 24px; padding: 0; display: grid; gap: 10px; }
.ux-next li { counter-increment: ux; display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; font-size: 15px; line-height: 1.5; color: var(--text); }
.ux-next li::before {
  content: counter(ux); display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
  background: var(--ux-grad); color: #fff; font-weight: 800; font-size: 14px;
}
.ux-next-title { font-size: 13px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase; color: var(--muted); margin: 0 0 12px; text-align: left; }
.ux-confetti-wrap { position: fixed; inset: 0; pointer-events: none; overflow: hidden; z-index: 9998; }
.ux-confetti {
  position: absolute; top: -14px; width: 9px; height: 15px; border-radius: 2px; opacity: 0;
  animation: ux-fall var(--d, 2.2s) var(--l, 0s) cubic-bezier(.2, .6, .4, 1) forwards;
}
@keyframes ux-fall {
  0% { opacity: 1; transform: translate3d(0, 0, 0) rotate(0); }
  100% { opacity: 0; transform: translate3d(var(--x, 0), 105vh, 0) rotate(var(--r, 540deg)); }
}

/* ── Hărți (Leaflet): apariție lină ────────────────────────────────────────── */
.locker-map { transition: opacity var(--ux-3), filter var(--ux-3); }
.leaflet-container { font-family: inherit; }

/* ═══════════════════════ TEMA LUMINOASĂ (ca magazinul) ═══════════════════════ */
html[data-ux-theme="light"] {
  --bg: #faf7f4;
  --surface: #ffffff;
  --card: #ffffff;
  --border: rgba(30, 32, 36, .13);
  --orange: #d4520a;
  --orange-dk: #b84508;
  --orange-lt: rgba(212, 82, 10, .09);
  --text: #1e2024;
  --muted: #4d535c;
  --faint: #c9ced6;
  --ux-green: #16a34a;
  --ux-grad: linear-gradient(135deg, #e4600a 0%, #d4520a 45%, #c23a1e 100%);
}
html[data-ux-theme="light"] body {
  background: radial-gradient(900px 420px at 50% -140px, rgba(255, 150, 70, .16), transparent 70%), var(--bg);
  background-repeat: no-repeat;
}
html[data-ux-theme="light"] .step-hero h1,
html[data-ux-theme="light"] .step-head h2,
html[data-ux-theme="light"] .success-inner h2 { color: var(--text); }
html[data-ux-theme="light"] .glass-card {
  background: #fff; border: 1px solid var(--border); backdrop-filter: none; -webkit-backdrop-filter: none;
  box-shadow: 0 1px 2px rgba(30, 32, 36, .04), 0 10px 28px rgba(30, 32, 36, .06);
}
html[data-ux-theme="light"] .btn-primary,
html[data-ux-theme="light"] .btn-submit { background: var(--ux-grad); color: #fff; }
html[data-ux-theme="light"] .btn-primary:hover,
html[data-ux-theme="light"] .btn-submit:hover { background: linear-gradient(135deg, #d4520a 0%, #b84508 50%, #a8321a 100%); box-shadow: 0 8px 24px rgba(194, 58, 30, .32); }
html[data-ux-theme="light"] .btn-ghost { background: #fff; color: var(--text); border-color: var(--border); }
html[data-ux-theme="light"] .btn-ghost:hover { background: #fff7f1; border-color: var(--orange); color: var(--orange); }
html[data-ux-theme="light"] .order-input-wrap,
html[data-ux-theme="light"] .pv-input-wrap,
html[data-ux-theme="light"] .field-input { background: #fff; border-color: rgba(30, 32, 36, .22); }
html[data-ux-theme="light"] .order-input-wrap input::placeholder,
html[data-ux-theme="light"] .pv-input::placeholder,
html[data-ux-theme="light"] .field-input::placeholder { color: #6e747e; }
html[data-ux-theme="light"] .order-hash { color: #6e747e; }
html[data-ux-theme="light"] .btn-locate,
html[data-ux-theme="light"] .size-choice,
html[data-ux-theme="light"] .locker-choice,
html[data-ux-theme="light"] .city-choice,
html[data-ux-theme="light"] .product-result-choice,
html[data-ux-theme="light"] .exsz-badge { background: #fff; border-color: rgba(30, 32, 36, .2); }
html[data-ux-theme="light"] .pv-hint,
html[data-ux-theme="light"] .locker-results-head,
html[data-ux-theme="light"] .exchange-size-row,
html[data-ux-theme="light"] .exchange-credit-summary { background: #f6f2ee; }
html[data-ux-theme="light"] .product-card { background: #fff; box-shadow: 0 6px 20px rgba(30, 32, 36, .05); }
html[data-ux-theme="light"] .product-card:not(.not-selected) { border-color: rgba(212, 82, 10, .5); }
html[data-ux-theme="light"] .product-card img,
html[data-ux-theme="light"] .product-result-image-wrap,
html[data-ux-theme="light"] .exchange-credit-product img,
html[data-ux-theme="light"] .exchange-credit-product-empty { background: #eef0f3; border-color: rgba(30, 32, 36, .08); }
html[data-ux-theme="light"] .action-card-inner,
html[data-ux-theme="light"] .method-inner { background: #fff; border-color: rgba(30, 32, 36, .18); }
html[data-ux-theme="light"] .action-card input:checked + .action-card-inner,
html[data-ux-theme="light"] .method-opt input:checked + .method-inner { background: #fff4ec; border-color: var(--orange); box-shadow: 0 8px 24px rgba(212, 82, 10, .14); }
html[data-ux-theme="light"] .action-check { border-color: #aeb4bd; }
html[data-ux-theme="light"] .method-badge { background: rgba(212, 82, 10, .12); }
html[data-ux-theme="light"] .exvar-card { background: #fff; }
html[data-ux-theme="light"] .exvar-card input[type="radio"]:checked + .exvar-inner { background: #fff4ec; }
html[data-ux-theme="light"] .exvar-tag { background: rgba(212, 82, 10, .12); }
html[data-ux-theme="light"] .exvar-tag.wait-tag { background: rgba(71, 85, 105, .12); color: #475569; }
html[data-ux-theme="light"] .step-dot span { background: #fff; }
html[data-ux-theme="light"] .step-dot.active span { background: var(--orange); color: #fff; box-shadow: none; }
html[data-ux-theme="light"] .step-dot.done span { background: rgba(212, 82, 10, .12); }
html[data-ux-theme="light"] .method-suggestion { background: #fff4ec; border-color: rgba(212, 82, 10, .28); }
html[data-ux-theme="light"] .fees-output { background: #fff4ec; border-color: rgba(212, 82, 10, .28); }
html[data-ux-theme="light"] .lookup-status.found,
html[data-ux-theme="light"] .lookup-status[data-ux="ok"] { color: #15803d; }
html[data-ux-theme="light"] .lookup-status.error,
html[data-ux-theme="light"] .lookup-status[data-ux="error"] { color: #b91c1c; }
html[data-ux-theme="light"] .initial-locker-card { background: rgba(22, 163, 74, .07); border-color: rgba(22, 163, 74, .32); }
html[data-ux-theme="light"] .initial-locker-copy span { color: #166534; }
html[data-ux-theme="light"] .initial-locker-use { background: rgba(22, 163, 74, .12); border-color: rgba(22, 163, 74, .4); color: #14532d; }
html[data-ux-theme="light"] .locker-selected-note { background: rgba(22, 163, 74, .08); border-color: rgba(22, 163, 74, .32); }
html[data-ux-theme="light"] .locker-selected-note strong { color: #166534; }
html[data-ux-theme="light"] .size-advisor { background: rgba(22, 163, 74, .07); border-color: rgba(22, 163, 74, .28); }
html[data-ux-theme="light"] .advisor-kicker { color: #15803d; }
html[data-ux-theme="light"] .advisor-action { background: #16a34a; color: #fff; }
html[data-ux-theme="light"] .advisor-action:hover { background: #15803d; }
html[data-ux-theme="light"] .advisor-action-refund { border-color: rgba(30, 32, 36, .25); }
html[data-ux-theme="light"] .advisor-action-refund:hover { border-color: var(--text); }
html[data-ux-theme="light"] .exchange-credit-outcome.refund { color: #15803d; background: rgba(22, 163, 74, .1); }
html[data-ux-theme="light"] .exchange-credit-outcome.due { color: #b84508; }
html[data-ux-theme="light"] .exchange-credit-rows .credit-total { border-color: rgba(30, 32, 36, .14); }
html[data-ux-theme="light"] .exchange-refund-fields { background: rgba(22, 163, 74, .07); border-color: rgba(22, 163, 74, .25); }
html[data-ux-theme="light"] #message.error { background: rgba(220, 38, 38, .07); border-color: rgba(220, 38, 38, .3); color: #991b1b; }
html[data-ux-theme="light"] #message.success { background: rgba(22, 163, 74, .08); border-color: rgba(22, 163, 74, .3); color: #166534; }
html[data-ux-theme="light"] .success-icon { background: rgba(22, 163, 74, .1); border-color: rgba(22, 163, 74, .3); color: #15803d; }
html[data-ux-theme="light"] .success-locker { background: rgba(22, 163, 74, .07); border-color: rgba(22, 163, 74, .26); }
html[data-ux-theme="light"] .locker-code { color: #15803d; }
html[data-ux-theme="light"] .success-awb, html[data-ux-theme="light"] .success-exchange-order { background: #fff4ec; border-color: rgba(212, 82, 10, .3); }
html[data-ux-theme="light"] .return-video-frame { background: #0d0d0d; border-color: rgba(30, 32, 36, .12); }
html[data-ux-theme="light"] select.field-input option { background: #fff; color: var(--text); }
html[data-ux-theme="light"] ::-webkit-scrollbar-thumb { background: #c4c9d1; }
html[data-ux-theme="light"] .locker-map { background: #e8edf1; }
html[data-ux-theme="light"] .leaflet-tile { filter: none; }
html[data-ux-theme="light"] .leaflet-container { background: #e8edf1; }
html[data-ux-theme="light"] .leaflet-popup-content-wrapper,
html[data-ux-theme="light"] .leaflet-popup-tip { background: #fff; color: var(--text); border-color: var(--border); }
html[data-ux-theme="light"] .step-panel > .nav-row:not(.nav-row-confirm) { background: linear-gradient(to top, var(--bg) 72%, rgba(250, 247, 244, 0)); }
html[data-ux-theme="light"] .ux-progress { background: #e4e7ec; }
html[data-ux-theme="light"] .step-line { background: #d5d9df; }
html[data-ux-theme="light"] .ux-next li { color: var(--text); }

/* ── Mișcare redusă: fără animații, fără tranziții între pași ─────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .ux-confetti-wrap { display: none; }
  .step-dot.active span { animation: none; }
}
@media print { .ux-foot, .ux-confetti-wrap, .wz-toast { display: none !important; } }

/* ── Pretul PLATIT pe cardul produsului (lista taiata + reducerea comenzii) ── */
.product-ordered-size .ordered-paid { flex: 1 0 100%; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; font-size: 15px; margin-top: 4px; }
.ordered-paid s { color: var(--muted); font-size: 14px; }
.ordered-paid .paid-discount { color: #166534; font-weight: 700; font-size: 13px; }
.product-ordered-size { flex-wrap: wrap; }