/* ==========================================================================
     ARVIS — Custom Theme Override
     Parent: Warehouse | PrestaShop 9.1.1
     ========================================================================== */

/* --- Inter (self-hosted) --- */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-regular.woff2")
    format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-italic.woff2")
    format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-500.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-500italic.woff2")
    format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-600.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-600italic.woff2")
    format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-700.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-700italic.woff2")
    format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-800.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-800italic.woff2")
    format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-900.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter/inter-v20-latin_latin-ext-900italic.woff2")
    format("woff2");
}

/* ============================================
     Arvis Brand Variables (ref: 0-2-brand-glossary.md §3)
     --arvis-ember        : CTA primary, accent
     --arvis-ember-hover  : hover state pe ember
     --arvis-midnight     : text principal, headings
     --arvis-trust        : links, info states
     --arvis-snow         : background light
     --arvis-slate        : text secundar, borders
     --arvis-jade         : success states, in-stock
     ============================================ */
:root,
[data-bs-theme="light"] {
  /* ---- Brand palette ---- */
  --arvis-midnight: #111827;
  --arvis-ember: #ff5c35;
  --arvis-ember-hover: #e64a24; /* Ember × 0.9 — ton mai inchis pentru :hover */
  --arvis-trust: #3b82f6;
  --arvis-jade: #22c55e;
  --arvis-snow: #f8f9fa;
  --arvis-slate: #6b7280;
  --arvis-amber: #f59e0b;
  --arvis-red: #ef4444;
  --arvis-ember-active: #c03a18; /* +15% mai inchis decat hover */

  /* RGB triplets — necesare pentru rgba() / Bootstrap utilities */
  --arvis-midnight-rgb: 17, 24, 39;
  /* Umbra/scrim: triplet STABIL — NU se inverseaza in dark (altfel umbrele
     pe midnight-rgb devin glow alb). Override la 0,0,0 in [data-theme=dark]. */
  --arvis-shadow-rgb: 17, 24, 39;
  --arvis-ember-rgb: 255, 92, 53;
  --arvis-trust-rgb: 59, 130, 246;
  --arvis-jade-rgb: 34, 197, 94;
  --arvis-snow-rgb: 248, 249, 250;
  --arvis-slate-rgb: 107, 114, 128;
  --arvis-amber-rgb: 245, 158, 11;
  --arvis-red-rgb: 239, 68, 68;

  /* ---- Bootstrap semantic mapping ---- */
  --bs-primary: var(--arvis-ember);
  --bs-secondary: var(--arvis-slate);
  --bs-success: var(--arvis-jade);
  --bs-info: var(--arvis-trust);
  --bs-warning: var(--arvis-amber);
  --bs-danger: var(--arvis-red);
  --bs-light: var(--arvis-snow);
  --bs-dark: var(--arvis-midnight);

  --bs-primary-rgb: var(--arvis-ember-rgb);
  --bs-secondary-rgb: var(--arvis-slate-rgb);
  --bs-success-rgb: var(--arvis-jade-rgb);
  --bs-info-rgb: var(--arvis-trust-rgb);
  --bs-warning-rgb: var(--arvis-amber-rgb);
  --bs-danger-rgb: var(--arvis-red-rgb);
  --bs-light-rgb: var(--arvis-snow-rgb);
  --bs-dark-rgb: var(--arvis-midnight-rgb);

  /* Text-emphasis (color × 0.4 — Bootstrap "shade 60%") */
  --bs-primary-text-emphasis: rgb(102, 37, 21);
  --bs-secondary-text-emphasis: rgb(43, 46, 51);
  --bs-success-text-emphasis: rgb(14, 79, 38);
  --bs-info-text-emphasis: rgb(24, 52, 98);
  --bs-warning-text-emphasis: rgb(98, 63, 4);
  --bs-danger-text-emphasis: rgb(96, 27, 27);

  /* Bg-subtle (tint 80% — color × 0.2 + white × 0.8) */
  --bs-primary-bg-subtle: rgb(255, 222, 215);
  --bs-secondary-bg-subtle: rgb(225, 227, 230);
  --bs-success-bg-subtle: rgb(211, 243, 223);
  --bs-info-bg-subtle: rgb(216, 230, 253);
  --bs-warning-bg-subtle: rgb(253, 236, 207);
  --bs-danger-bg-subtle: rgb(252, 218, 218);

  /* Border-subtle (tint 60% — color × 0.4 + white × 0.6) */
  --bs-primary-border-subtle: rgb(255, 190, 174);
  --bs-secondary-border-subtle: rgb(196, 199, 204);
  --bs-success-border-subtle: rgb(167, 232, 191);
  --bs-info-border-subtle: rgb(177, 205, 251);
  --bs-warning-border-subtle: rgb(251, 217, 158);
  --bs-danger-border-subtle: rgb(249, 181, 181);

  /* ---- Body / text ---- */
  --bs-body-color: var(--arvis-midnight);
  --bs-body-color-rgb: var(--arvis-midnight-rgb);
  --bs-body-bg: #ffffff;
  --bs-emphasis-color: var(--arvis-midnight);
  --bs-emphasis-color-rgb: var(--arvis-midnight-rgb);
  --bs-secondary-color: rgba(var(--arvis-midnight-rgb), 0.75);
  --bs-secondary-color-rgb: var(--arvis-midnight-rgb);
  --bs-tertiary-color: rgba(var(--arvis-midnight-rgb), 0.5);
  --bs-tertiary-color-rgb: var(--arvis-midnight-rgb);
  --bs-secondary-bg: #e9ecef;
  --bs-tertiary-bg: var(--arvis-snow);

  /* ---- Links — Ember cu hover mai inchis ---- */
  --bs-link-color: var(--arvis-ember);
  --bs-link-color-rgb: var(--arvis-ember-rgb);
  --bs-link-hover-color: var(--arvis-ember-hover);
  --bs-link-hover-color-rgb: 230, 74, 36;

  /* ---- Borders ---- */
  --bs-border-color: #e5e7eb;

  /* ---- Focus ring — Ember 25% ---- */
  --bs-focus-ring-color: rgba(var(--arvis-ember-rgb), 0.25);

  /* ---- Form valid / invalid ---- */
  --bs-form-valid-color: var(--arvis-jade);
  --bs-form-valid-border-color: var(--arvis-jade);
  --bs-form-invalid-color: var(--arvis-red);
  --bs-form-invalid-border-color: var(--arvis-red);

  /* ---- Highlight selectie text — Ember subtle ---- */
  --bs-highlight-color: var(--arvis-midnight);
  --bs-highlight-bg: rgb(255, 230, 222);

  /* ---- Font ---- */
  --bs-font-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

  /* ============================================================
     DARK MODE — token-uri semantice (valori LIGHT; se inverseaza
     in [data-theme="dark"]). Vezi spec 2026-06-02-dark-mode-design.md
     ============================================================ */
  /* Suprafete & pagina */
  --page-bg: #f8f9fa;
  --surface: #ffffff;
  --surface-1: #fafafb;
  --surface-2: #f4f5f7;
  --surface-3: #edeef2;
  --surface-container: #f8f9fa;
  --surface-container-high: #f0f2f5;
  --arvis-mist: #f0f2f5;
  --arvis-white: #ffffff;
  /* Text & foreground */
  --on-surface: #111827;
  --on-surface-faded: #6b7280;
  --arvis-slate-soft: #9ca3af;
  --arvis-midnight-90: #1f2937;
  --arvis-midnight-80: #29303d;
  /* Brand ember (variante) */
  --arvis-ember-dark: #e5502b;
  --arvis-ember-darker: #cc4827;
  --arvis-ember-soft: #fff3f0;
  /* Status soft */
  --arvis-jade-soft: #f0fdf4;
  --arvis-trust-soft: #eff6ff;
  /* Linii */
  --line: #e5e7eb;
  --line-soft: #eef0f3;
  --arvis-line: #e5e7eb;
  --arvis-line-soft: #eef0f3;
  /* Blocuri midnight (hero/footer/pillars) — fundaluri intunecate */
  --dark-surface: #111827;
  --dark-surface-1: #181f2d;
  --dark-surface-2: #1f2937;
  --dark-surface-3: #29303d;
}

/* ============================================================
   DARK MODE — mapare completa light → dark (pe <html data-theme="dark">)
   :root[...] = specificity (0,2,0) ca sa bata orice alt bloc :root (0,1,0)
   din partial-uri (ex. 21-account.css redefineste --surface la light).
   ============================================================ */
:root[data-theme="dark"] {
  color-scheme: dark;

  /* Suprafete & pagina */
  --page-bg: #0b1018;
  --surface: #111827;
  --surface-1: #161e2d;
  --surface-2: #1b2434;
  --surface-3: #232d3f;
  --surface-container: #161e2d;
  --surface-container-high: #1b2434;
  --arvis-snow: #0b1018;
  --arvis-mist: #1b2434;

  /* Text & foreground (se inverseaza contrastul) */
  --arvis-midnight: #f4f5f7;
  --arvis-midnight-rgb: 244, 245, 247;
  /* Umbra/scrim: ramane NEGRU pe dark (depth real + backdrop intunecat) */
  --arvis-shadow-rgb: 0, 0, 0;
  --on-surface: #f4f5f7;
  --on-surface-faded: #94a3b8;
  --arvis-slate: #94a3b8;
  --arvis-slate-soft: #64748b;
  /* slate-dark = text de body (mai inchis ca slate in light) → se DESCHIDE pe dark */
  --arvis-slate-dark: #c8cdd7;
  --arvis-midnight-90: #c8cdd7;
  --arvis-midnight-80: #aeb4c0;

  /* Brand ember — accent ramane; hover mai DESCHIS (nu mai inchis) */
  --arvis-ember-hover: #ff7755;
  --arvis-ember-active: #ff8a6b;
  --arvis-ember-dark: #ff7755;
  --arvis-ember-darker: #ff8a6b;
  --arvis-ember-soft: rgba(255, 92, 53, 0.14);

  /* Status soft → translucid */
  --arvis-jade-soft: rgba(34, 197, 94, 0.14);
  --arvis-trust-soft: rgba(59, 130, 246, 0.14);

  /* Linii & contururi → alb translucid */
  --line: rgba(255, 255, 255, 0.08);
  --line-soft: rgba(255, 255, 255, 0.05);
  --arvis-line: rgba(255, 255, 255, 0.08);
  --arvis-line-soft: rgba(255, 255, 255, 0.05);

  /* Blocuri midnight → ELEVATE fata de pagina (#0b1018). Folosim #111827 (ca
     header-ul/surface) ca sa se separe; designul avea #0b1018 = page-bg → se contopea. */
  --dark-surface: #111827;
  --dark-surface-1: #161e2d;
  --dark-surface-2: #1b2434;
  --dark-surface-3: #232d3f;

  /* Bootstrap — body/border/surface */
  --bs-body-bg: #0b1018;
  --bs-body-color: var(--arvis-midnight);
  --bs-border-color: rgba(255, 255, 255, 0.08);
  --bs-emphasis-color: var(--arvis-midnight);
  --bs-secondary-bg: #1b2434;
  --bs-tertiary-bg: #161e2d;

  /* Bootstrap — componente (dropdown/cos, modal, card) → surface + text deschis */
  --bs-dropdown-bg: var(--surface);
  --bs-dropdown-color: var(--arvis-midnight);
  --bs-dropdown-link-color: var(--arvis-midnight);
  --bs-dropdown-link-hover-color: var(--arvis-midnight);
  --bs-dropdown-link-hover-bg: var(--surface-2);
  --bs-dropdown-border-color: var(--arvis-line);
  --bs-modal-bg: var(--surface);
  --bs-modal-color: var(--arvis-midnight);
  --bs-modal-border-color: var(--arvis-line);
  --bs-card-bg: var(--surface);
  --bs-card-color: var(--arvis-midnight);
  --bs-card-cap-bg: var(--surface-1);
  --bs-card-border-color: var(--arvis-line);
}

::selection {
  background: rgba(var(--arvis-ember-rgb), 0.18);
  color: var(--arvis-midnight);
}

/* ===== Apply Inter as primary brand font ===== */
body,
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
button,
input,
select,
textarea,
.btn {
  font-family: var(--bs-font-sans-serif);
}

/* ===== Logo mobile — inaltime redusa ===== */
@media (max-width: 991px) {
  .col-mobile-logo img.logo,
  .col-mobile-logo .logo.img-fluid {
    max-height: 40px !important;
    width: auto !important;
    height: auto !important;
  }
}
@media (max-width: 480px) {
  .col-mobile-logo img.logo {
    max-height: 32px !important;
  }
}

/* ============================================
     Primary buttons — UNIFIED
     Acopera: .btn-primary + .btn-product-list
     Pe orice element: <button>, <a>, <input>
     Toate state-urile vizual identice
     ============================================ */

/* === DEFAULT === */
.btn.btn-primary,
.btn.btn-product-list,
button.btn-primary,
button.btn-product-list,
a.btn-primary,
a.btn-product-list,
input.btn-primary,
input.btn-product-list {
  background-color: var(--arvis-ember) !important;
  border: 1px solid var(--arvis-ember) !important;
  color: var(--arvis-snow) !important;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(var(--arvis-shadow-rgb), 0.08),
    0 2px 6px rgba(var(--arvis-ember-rgb), 0.18);
  transition: background-color 0.2s ease, border-color 0.2s ease,
    box-shadow 0.2s ease, transform 0.1s ease;
}

/* === HOVER === */
.btn.btn-primary:hover,
.btn.btn-product-list:hover,
button.btn-primary:hover,
button.btn-product-list:hover,
a.btn-primary:hover,
a.btn-product-list:hover,
input.btn-primary:hover,
input.btn-product-list:hover {
  background-color: var(--arvis-ember-hover) !important;
  border-color: var(--arvis-ember-hover) !important;
  color: var(--arvis-snow) !important;
  box-shadow: 0 2px 4px rgba(var(--arvis-shadow-rgb), 0.1),
    0 6px 14px rgba(var(--arvis-ember-rgb), 0.3) !important;
  transform: translateY(-1px);
}

/* === ACTIVE === */
.btn.btn-primary:active,
.btn.btn-primary.active,
.btn.btn-product-list:active,
.btn.btn-product-list.active,
button.btn-primary:active,
button.btn-primary.active,
button.btn-product-list:active,
button.btn-product-list.active,
a.btn-primary:active,
a.btn-primary.active,
a.btn-product-list:active,
a.btn-product-list.active,
input.btn-primary:active,
input.btn-product-list:active {
  background-color: var(--arvis-ember-active) !important;
  border-color: var(--arvis-ember-active) !important;
  color: var(--arvis-snow) !important;
  transform: translateY(0) !important;
  box-shadow: inset 0 2px 4px rgba(var(--arvis-shadow-rgb), 0.2) !important;
  transition-duration: 0.08s !important;
}

/* === FOCUS — keyboard only (Tab), nu mouse === */
.btn.btn-primary:focus-visible,
.btn.btn-product-list:focus-visible,
button.btn-primary:focus-visible,
button.btn-product-list:focus-visible,
a.btn-primary:focus-visible,
a.btn-product-list:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(var(--arvis-ember-rgb), 0.35),
    0 2px 6px rgba(var(--arvis-ember-rgb), 0.18) !important;
}

/* Mouse focus — nu arata halo, doar default shadow */
.btn.btn-primary:focus:not(:focus-visible),
.btn.btn-product-list:focus:not(:focus-visible),
button.btn-primary:focus:not(:focus-visible),
button.btn-product-list:focus:not(:focus-visible),
a.btn-primary:focus:not(:focus-visible),
a.btn-product-list:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: 0 1px 2px rgba(var(--arvis-shadow-rgb), 0.08),
    0 2px 6px rgba(var(--arvis-ember-rgb), 0.18) !important;
}

/* === DISABLED === */
.btn.btn-primary:disabled,
.btn.btn-primary.disabled,
.btn.btn-product-list:disabled,
.btn.btn-product-list.disabled,
button.btn-primary:disabled,
button.btn-product-list:disabled,
a.btn-primary.disabled,
a.btn-product-list.disabled {
  background-color: rgba(var(--arvis-ember-rgb), 0.55) !important;
  border-color: rgba(var(--arvis-ember-rgb), 0.55) !important;
  color: var(--arvis-snow) !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: not-allowed;
  pointer-events: none;
}

/* === Iconitele din buton (fa-shopping-bag etc.) === */
.btn.btn-primary i,
.btn.btn-product-list i,
.btn.btn-primary .fa,
.btn.btn-product-list .fa {
  color: inherit !important;
}

/* ===== Modal de cart + brand polish ===== */
.modal-backdrop,
.modal-backdrop.show {
  background-color: rgba(var(--arvis-shadow-rgb), 0.7) !important;
  opacity: 1 !important;
}

.modal-content {
  border: none;
  border-radius: 0.5rem;
  box-shadow: 0 20px 40px rgba(var(--arvis-shadow-rgb), 0.25);
}

.modal-header .close,
.modal-header .btn-close {
  opacity: 0.6;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.modal-header .close:hover,
.modal-header .btn-close:hover {
  opacity: 1;
  transform: scale(1.1);
  color: var(--arvis-ember);
}

/* Iconita "succes" — bifa verde Jade */
.modal .material-icons,
.modal-title i,
.modal-title .icon-check,
.cart-content .icon-check {
  color: var(--arvis-jade) !important;
}

/* Remove underline pe butoanele <a> */
a.btn,
a.btn-primary,
a.btn-secondary,
a.btn-product-list {
  text-decoration: none !important;
}

/* Buton secondary outline — pentru "Continua cumparaturile" */
.btn-secondary,
a.btn-secondary,
button.btn-secondary {
  background-color: transparent !important;
  border: 1px solid var(--arvis-midnight) !important;
  color: var(--arvis-midnight) !important;
  box-shadow: none;
  transition: all 0.2s ease;
}
.btn-secondary:hover,
a.btn-secondary:hover,
button.btn-secondary:hover {
  background-color: var(--dark-surface) !important;
  border-color: var(--arvis-midnight) !important;
  color: var(--arvis-snow) !important;
}

/* Focus ring vizibil DOAR pe keyboard, nu mouse */
.btn-primary:focus:not(:focus-visible),
a.btn-primary:focus:not(:focus-visible),
button.btn-primary:focus:not(:focus-visible) {
  box-shadow: 0 1px 2px rgba(var(--arvis-shadow-rgb), 0.08),
    0 2px 6px rgba(var(--arvis-ember-rgb), 0.18) !important;
}

/* ===== Focus state pe input-uri ===== */
.focus-input:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--arvis-trust);
  outline: none;
  box-shadow: 0 0 0 3px var(--bs-focus-ring-color);
}

/* ===== Product flags — brand Arvis ===== */
.product-flags > li,
.product-flags .product-flag {
  background: var(--dark-surface); /* default */
  color: var(--arvis-snow);
  border-radius: 0.25rem; /* --bs-border-radius-sm */
  font-family: var(--bs-font-sans-serif);
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Exceptii pe culoare */
.product-flags .new {
  background: var(--arvis-trust);
}
.product-flags .on-sale,
.product-flags [class*="discount"] {
  background: var(--arvis-ember);
}
.product-flags .out_of_stock,
.product-flags .out-of-stock {
  background: var(--arvis-slate);
}
.product-flags .pack {
  background: var(--arvis-jade);
}

/* trust bar */
.trust-bar-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  padding: 10px 0;
}
.trust-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--arvis-midnight);
  padding: 0 24px;
  position: relative;
}
.trust-item + .trust-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #f97316;
  opacity: 0.6;
}
.trust-item svg {
  flex-shrink: 0;
}
@media (max-width: 768px) {
  .trust-bar-inner {
    overflow-x: auto;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
  }
  .trust-item {
    white-space: nowrap;
  }
}

/* ============================================
     HEADER — Cart badge + nav button states
     ============================================ */

/* Badge "4" de pe icon-ul cos — Ember (era navy default) */
.cart-products-count-btn {
  background: var(--arvis-ember) !important;
  color: var(--arvis-snow) !important;
  font-weight: 600;
}

/* Autentificare + Cos — hover Ember subtil */
.header-btn .icon,
.header-btn .title {
  color: var(--arvis-midnight);
  transition: color 0.15s ease;
}
.header-btn:hover .icon,
.header-btn:hover .title,
.header-btn:focus .icon,
.header-btn:focus .title {
  color: var(--arvis-ember);
}

/* ============================================
     CART DROPDOWN — typography & polish
     ============================================ */

/* Separatori si valori in butonul Cos */
.cart-toggle-details .cart-separator,
.cart-toggle-details .text-faded {
  color: var(--arvis-slate);
}
.cart-toggle-details .value {
  color: var(--arvis-midnight);
  font-weight: 600;
}

/* Linkuri produs in dropdown */
#blockcart .cart-products a {
  color: var(--arvis-midnight);
  transition: color 0.15s ease;
}
#blockcart .cart-products a:hover {
  color: var(--arvis-ember);
}

/* Subtotal lines */
.cart-summary-line .label,
.cart-summary-line .value {
  color: var(--arvis-midnight);
}
.cart-totals {
  border-top: 1px solid var(--bs-border-color);
  padding-top: 12px;
  margin-top: 8px;
}
.cart-totals .label {
  color: var(--arvis-midnight);
  font-weight: 500;
}
.cart-totals .value {
  color: var(--arvis-midnight);
  font-weight: 700;
  font-size: 16px;
}

/* ============================================
     Free delivery counter — recolor din alert-info
     ============================================ */
.iqitfreedeliverycount.alert-info {
  background: rgba(var(--arvis-ember-rgb), 0.08) !important;
  border: none !important;
  border-left: 3px solid var(--arvis-ember) !important;
  color: var(--arvis-midnight) !important;
  border-radius: 4px;
}
.iqitfreedeliverycount .ifdc-remaining-price {
  color: var(--arvis-ember);
  font-weight: 700;
}

/* ============================================
     Quantity touchspin (+/-) in cart
     ============================================ */
.btn-touchspin {
  border-color: var(--bs-border-color) !important;
  background: var(--surface) !important;
  color: var(--arvis-midnight) !important;
  transition: background 0.15s ease, color 0.15s ease;
}
.btn-touchspin:hover {
  background: var(--arvis-snow) !important;
  color: var(--arvis-ember) !important;
}

/* ============================================
     Remove from cart — muted, red doar pe hover
     ============================================ */
.remove-from-cart {
  color: var(--arvis-slate);
  transition: color 0.15s ease;
}
.remove-from-cart:hover {
  color: var(--arvis-red);
}

/* ============================================
     Close cos (#js-cart-close) — buton cerc ca la meniul mobil (adaptiv teme)
     ============================================ */
#js-cart-close,
.blockcart-content .cart-title .close,
#blockcart-content .cart-title .close {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: var(--surface-2, #f4f5f7) !important;
  color: var(--arvis-midnight, #111827) !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}
#js-cart-close:hover,
.blockcart-content .cart-title .close:hover {
  background: rgba(255, 92, 53, 0.1) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}
#js-cart-close span {
  font-size: 18px;
  line-height: 1;
  font-weight: 400;
}

/* ============================================
     Cart secondary buttons (side-panel + modal) — uniformizare cu btn-primary.btn-lg
     "Cos" / "Continua cumparaturile" nu au btn-lg in markup
     ============================================ */
.btn-secondary.btn-block,
button.btn-secondary.btn-block,
a.btn-secondary.btn-block {
  border-radius: var(--bs-border-radius-lg) !important;
  padding: 0.5rem 1rem !important;
  font-size: 1.0625rem !important;
  line-height: 1.5;
  font-weight: 500;
}

/* ============================================
     SEARCH widget — brand alignment (desktop + mobile)
     Selectoare fara #search_widget wrapper ca sa prinda si mobile
     ============================================ */
.form-search-control,
#search_widget .form-search-control {
  background: var(--arvis-snow) !important;
  border: 1px solid var(--bs-border-color) !important;
  border-right: none !important;
  color: var(--arvis-midnight) !important;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.form-search-control::placeholder,
#search_widget .form-search-control::placeholder {
  color: var(--arvis-slate);
  opacity: 1;
}
.form-search-control:focus,
#search_widget .form-search-control:focus {
  background: var(--surface) !important;
}
.input-group .search-btn,
#search_widget .search-btn {
  background: var(--arvis-snow) !important;
  border: 1px solid var(--bs-border-color) !important;
  border-left: none !important;
  color: var(--arvis-slate) !important;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.input-group .search-btn:hover,
.input-group .search-btn:focus,
#search_widget .search-btn:hover,
#search_widget .search-btn:focus {
  background: var(--arvis-ember) !important;
  border-color: var(--arvis-ember) !important;
  color: #ffffff !important;
}
.form-search-control:focus + .search-btn,
#search_widget .form-search-control:focus + .search-btn {
  background: var(--surface) !important;
}

/* ============================================
   SEARCH mobil (#search-widget-mobile) — pill curat (ca search-ul din meniu)
   E un .dropdown-menu Bootstrap (border/shadow default = "linia neagra") +
   nu mostenea pill-ul desktop-ului. Resetam wrapper-ul si facem .input-group pill.
   ============================================ */
#search-widget-mobile.dropdown-menu {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 10px 12px !important;
  margin: 0 !important;
}

#search-widget-mobile .input-group {
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 999px !important;
  overflow: hidden;
  background: var(--surface) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#search-widget-mobile .input-group:focus-within {
  border-color: var(--arvis-ember, #ff5c35) !important;
  box-shadow: 0 0 0 3px rgba(255, 92, 53, 0.12);
}

#search-widget-mobile .form-search-control {
  border: 0 !important;
  background: transparent !important;
  padding: 12px 8px 12px 18px !important;
}

#search-widget-mobile .form-search-control:focus {
  background: transparent !important;
  box-shadow: none !important;
}

#search-widget-mobile .search-btn {
  border: 0 !important;
  background: transparent !important;
  color: var(--arvis-slate, #6b7280) !important;
  padding-right: 16px !important;
}

#search-widget-mobile .search-btn:hover,
#search-widget-mobile .search-btn:focus {
  background: transparent !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

/* ============================================
     MEGAMENU — brand alignment (desktop)
     ============================================ */

/* Nuke blue borders din parent warehouse pe toti wrappers IQIT */
.iqit-megamenu-container,
.iqitmegamenu-wrapper,
.sticky-desktop-wrapper,
.container-iqitmegamenu {
  background: var(--surface) !important;
  border: none !important;
  box-shadow: none;
}

/* Wrapper — separator subtil DOAR jos pe #iqitmegamenu-wrapper */
#iqitmegamenu-wrapper {
  background: var(--surface) !important;
  border: none !important;
  border-bottom: 1px solid var(--bs-border-color) !important;
}

/* Sticky state — shadow pentru separare vizuala pe scroll */
.sticky-desktop-wrapper.is-sticky,
.sticky-desktop-wrapper.iqit-sticky,
.sticky-desktop-wrapper.fixed,
body.iqit-sticky-active .sticky-desktop-wrapper {
  box-shadow: 0 2px 8px rgba(var(--arvis-shadow-rgb), 0.08),
    0 8px 24px rgba(var(--arvis-shadow-rgb), 0.06) !important;
  border-bottom: none !important;
}
.sticky-desktop-wrapper.is-sticky #iqitmegamenu-wrapper,
.sticky-desktop-wrapper.iqit-sticky #iqitmegamenu-wrapper,
.sticky-desktop-wrapper.fixed #iqitmegamenu-wrapper {
  border-bottom: none !important;
}

/* Top-level links */
.cbp-hrmenu .cbp-hrmenu-tab > a.nav-link,
.cbp-hrmenu .cbp-hrmenu-tab > a.nav-link .cbp-tab-title {
  color: var(--arvis-midnight);
  font-weight: 500;
  transition: color 0.15s ease;
}
.cbp-hrmenu .cbp-hrmenu-tab:hover > a.nav-link,
.cbp-hrmenu .cbp-hrmenu-tab:hover > a.nav-link .cbp-tab-title,
.cbp-hrmenu .cbp-hrmenu-tab > a.nav-link:hover .cbp-tab-title,
.cbp-hrmenu .cbp-hrmenu-tab.active > a.nav-link,
.cbp-hrmenu .cbp-hrmenu-tab.active > a.nav-link .cbp-tab-title {
  color: var(--arvis-ember) !important;
}

/* Submenu wrapper — drop refinat two-layer shadow */
.cbp-hrsub {
  background: var(--surface) !important;
  border: 1px solid var(--bs-border-color) !important;
  border-top: 2px solid var(--arvis-ember) !important;
  box-shadow: 0 4px 12px rgba(var(--arvis-shadow-rgb), 0.06),
    0 16px 32px rgba(var(--arvis-shadow-rgb), 0.08) !important;
  border-radius: 0 0 6px 6px;
}

/* Forteaza background alb pe TOATE wrappers interne submeniu */
.cbp-hrsub-inner,
.iqitmegamenu-submenu-container,
.cbp-hrsub .container {
  background: var(--surface) !important;
}

/* Column titles din submeniu (Telefon, Auto, Smartwatch, etc.) */
/* IMPORTANT: span.cbp-column-title are si .nav-link → trebuie !important */
span.cbp-column-title,
.cbp-menu-column .cbp-column-title,
.cbp-menu-column-inner .cbp-column-title {
  color: var(--arvis-midnight) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(var(--arvis-ember-rgb), 0.25) !important;
  margin-bottom: 12px !important;
  display: block !important;
}

/* Chevron `›` inainte de sublinkuri — Ember intotdeauna (nu doar pe hover) */
/* IQIT poate folosi diferite pseudo-elemente — acoperim toate variantele */
.cbp-links li::before,
.cbp-valinks li::before,
.cbp-links li > a::before,
.cbp-valinks li > a::before,
.cbp-links a::before,
.cbp-valinks a::before {
  color: var(--arvis-ember) !important;
}
/* Daca chevron-ul e ::marker (list-style nativ) */
.cbp-links li::marker,
.cbp-valinks li::marker {
  color: var(--arvis-ember);
}

/* Submenu links — specificity mare ca sa bata warehouse parent */
/* IMPORTANT: NU override padding (chevron IQIT depinde de el) */
#iqitmegamenu-horizontal .cbp-links a,
#iqitmegamenu-horizontal .cbp-valinks a,
.cbp-hrsub .cbp-links a,
.cbp-hrsub .cbp-valinks a,
.cbp-links li > a,
.cbp-valinks li > a {
  color: var(--arvis-midnight) !important;
  transition: color 0.15s ease, transform 0.15s ease;
  display: block;
  text-decoration: none !important;
}
#iqitmegamenu-horizontal .cbp-links a:hover,
#iqitmegamenu-horizontal .cbp-valinks a:hover,
#iqitmegamenu-horizontal .cbp-links a:focus,
#iqitmegamenu-horizontal .cbp-valinks a:focus,
.cbp-hrsub .cbp-links a:hover,
.cbp-hrsub .cbp-valinks a:hover,
.cbp-hrsub .cbp-links a:focus,
.cbp-hrsub .cbp-valinks a:focus,
.cbp-links li > a:hover,
.cbp-valinks li > a:hover,
.cbp-links li > a:focus,
.cbp-valinks li > a:focus {
  color: var(--arvis-ember) !important;
  transform: translateX(4px);
  text-decoration: none !important;
}

/* Home icon Ember (deja era, dar asiguram) */
.cbp-hrmenu .fa-home,
.cbp-mainlink-icon {
  color: var(--arvis-ember);
}

/* Chevron submeniu */
.cbp-submenu-aindicator {
  color: var(--arvis-slate);
  transition: color 0.15s ease, transform 0.2s ease;
}
.cbp-hrmenu-tab:hover .cbp-submenu-aindicator {
  color: var(--arvis-ember);
  transform: rotate(180deg);
}

/* ============================================
     MEGAMENU mobile — agresiv ca sa bata text-reset Bootstrap
     ============================================ */
#iqitmegamenu-mobile,
.mobile-menu,
.mobile-menu__submenu,
.mobile-menu__submenu--panel {
  background: var(--surface) !important;
}

.mobile-menu__header-wrapper {
  border-bottom: 1px solid var(--bs-border-color) !important;
  background: var(--arvis-snow) !important;
}

/* Linkuri top-level (Audio & Video, Accesorii, etc.) */
.mobile-menu__tab a.mobile-menu__link,
.mobile-menu__tab > a.mobile-menu__link,
a.mobile-menu__link,
.mobile-menu__link {
  color: var(--arvis-midnight) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}
.mobile-menu__tab:hover a.mobile-menu__link,
.mobile-menu__tab--active a.mobile-menu__link,
a.mobile-menu__link:hover,
a.mobile-menu__link:active,
.mobile-menu__link:hover,
.mobile-menu__link:active {
  color: var(--arvis-ember) !important;
}

/* Tab title (textul "Audio & Video") */
.js-mobile-menu__tab-title,
.mobile-menu__tab-title {
  color: var(--arvis-midnight) !important;
}
.mobile-menu__tab:hover .js-mobile-menu__tab-title,
.mobile-menu__tab--active .js-mobile-menu__tab-title {
  color: var(--arvis-ember) !important;
}

/* Column titles in submeniu mobile (Audio, Video, Telefon, etc.) */
.mobile-menu__column-title,
span.mobile-menu__column-title {
  color: var(--arvis-midnight) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  display: block !important;
  margin-bottom: 12px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid rgba(var(--arvis-ember-rgb), 0.25) !important;
}

/* Sublinkuri din submeniu mobile — bate .text-reset Bootstrap */
.mobile-menu__links-list a,
.mobile-menu__links-list-li a,
.mobile-menu__links-list-li a.text-reset,
.mobile-menu__submenu a.text-reset {
  color: var(--arvis-midnight) !important;
  padding: 8px 0 !important;
  display: block;
  text-decoration: none !important;
  transition: color 0.15s ease, padding-left 0.15s ease;
}
.mobile-menu__links-list a:hover,
.mobile-menu__links-list a:active,
.mobile-menu__links-list-li a:hover,
.mobile-menu__links-list-li a:active,
.mobile-menu__links-list-li a.text-reset:hover {
  color: var(--arvis-ember) !important;
  padding-left: 4px !important;
}

/* Header buttons (back, close, home icon) */
.mobile-menu__back-btn,
.mobile-menu__close,
.mobile-menu__back-btn .fa,
.mobile-menu__close .fa {
  color: var(--arvis-midnight) !important;
  transition: color 0.15s ease;
}
.mobile-menu__back-btn:hover,
.mobile-menu__close:hover,
.mobile-menu__back-btn:hover .fa,
.mobile-menu__close:hover .fa {
  color: var(--arvis-ember) !important;
}

/* Sageata > catre submenu (chevron right pe taburile cu submenu) */
.mobile-menu__arrow,
.mobile-menu__arrow .fa,
.expand-icon {
  color: var(--arvis-slate) !important;
  transition: color 0.15s ease;
}
.mobile-menu__tab:hover .mobile-menu__arrow,
.mobile-menu__tab:hover .mobile-menu__arrow .fa {
  color: var(--arvis-ember) !important;
}

/* Home icon mobile */
.mobile-menu__tab .fa-home,
.mobile-menu__tab-icon {
  color: var(--arvis-ember) !important;
}

/* Footer mobile (language, currency, user) */
.mobile-menu__footer {
  border-top: 1px solid var(--bs-border-color) !important;
  background: var(--arvis-snow) !important;
}
.mobile-menu__language-selector,
.mobile-menu__currency-selector,
.mobile-menu__user a {
  color: var(--arvis-midnight) !important;
}
.mobile-menu__user a:hover,
.mobile-menu__user a:hover .fa {
  color: var(--arvis-ember) !important;
}
.mobile-menu__user .fa {
  color: var(--arvis-midnight) !important;
}

/* ============================================
     SECTION HEADINGS Elementor — "Produse noi", etc.
     Reset bg-ul rosu din Elementor, aplicam stil brand
     (clasa .none pe h4.elementor-heading-title)
     ============================================ */
.elementor-widget-heading .elementor-heading-title.none {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--arvis-midnight) !important;
  font-weight: 700 !important;
  font-size: clamp(1.5rem, 2.5vw, 2rem) !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-block;
  position: relative;
  letter-spacing: -0.01em;
}
.elementor-widget-heading .elementor-heading-title.none span {
  display: inline-block;
  position: relative;
  padding-bottom: 12px;
  color: inherit;
}
.elementor-widget-heading .elementor-heading-title.none span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 3px;
  background: var(--arvis-ember);
  border-radius: 2px;
}
/* Container widget — fara padding/bg din Elementor */
.elementor-widget-heading .elementor-widget-container {
  background: transparent !important;
  padding: 1.5rem 0 !important;
}

/* ============================================
     PRODUCT CARDS — price Ember + hover refinat
     ============================================ */

/* Price — Ember (era rosu Bootstrap default) */
.product-miniature .product-price,
.product-miniature .regular-price,
.product-price-and-shipping .product-price,
.product-price-and-shipping .regular-price {
  color: var(--arvis-ember) !important;
  font-weight: 700;
}

/* Card hover — shadow DOAR pe outer .product-miniature (nu si pe thumbnail-container) */
.product-miniature {
  background: var(--surface);
  border-radius: 8px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.product-miniature .thumbnail-container {
  background: var(--surface);
  border-radius: 8px;
  box-shadow: none !important;
}
.product-miniature:hover,
.swiper-slide:hover .product-miniature {
  box-shadow: 0 4px 12px rgba(17, 24, 39, 0.1),
    0 20px 40px rgba(17, 24, 39, 0.14) !important;
  transform: translateY(-2px);
}
/* Inner thumbnail nu primeste shadow pe hover */
.product-miniature:hover .thumbnail-container,
.swiper-slide:hover .thumbnail-container {
  box-shadow: none !important;
  transform: none;
}

/* Quick actions (wishlist, compare, quickview) — pill style brand */
.product-functional-buttons-links a {
  background: var(--surface);
  color: var(--arvis-midnight);
  border: 1px solid var(--bs-border-color);
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.product-functional-buttons-links a:hover,
.product-functional-buttons-links a.active,
.product-functional-buttons-links a.js-iqitwishlist-added {
  background: var(--arvis-ember);
  border-color: var(--arvis-ember);
  color: #ffffff;
}

/* Wishlist heart inima rosie cand e activ — Ember peste tot */
.btn-iqitwishlist-add .fa-heart.added {
  color: var(--arvis-ember);
}

/* Card title hover — Ember + stretched link (tot cardul e clickable) */
.product-miniature {
  position: relative;
}
.product-miniature .product-title a {
  color: var(--arvis-midnight);
  transition: color 0.15s ease;
}
.product-miniature .product-title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.product-miniature .product-title a:hover {
  color: var(--arvis-ember);
}
.product-miniature .product-functional-buttons-links,
.product-miniature .arvis-pc__cta,
.product-miniature .btn-iqitwishlist-add,
.product-miniature .product-miniature-btn,
.product-miniature [data-button-action],
.product-miniature .arvis-pc__variants a {
  position: relative;
  z-index: 2;
}

/* Brand / category / reference — Slate (mai discret) */
.product-miniature .product-brand,
.product-miniature .product-category-name,
.product-miniature .product-reference {
  color: var(--arvis-slate) !important;
}
.product-miniature .product-brand a,
.product-miniature .product-category-name a,
.product-miniature .product-reference a {
  color: var(--arvis-slate) !important;
  transition: color 0.15s ease;
}
.product-miniature .product-brand a:hover,
.product-miniature .product-category-name a:hover,
.product-miniature .product-reference a:hover {
  color: var(--arvis-ember) !important;
}

/* ============================================================
   ARVIS FOOTER (override pentru _partials/footer.tpl)
   ============================================================ */

.arvis-footer {
  background: var(--dark-surface);
  color: rgba(255, 255, 255, 0.72);
  font-family: "Inter", system-ui, sans-serif;
  padding: 56px 0 24px;
  margin-top: 64px;
}

.arvis-footer a {
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0.2, 0, 0, 1);
}

.arvis-footer a:hover,
.arvis-footer a:focus-visible {
  color: var(--arvis-ember);
  outline: none;
}

/* --- Grid 4 coloane --- */

.arvis-footer__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.arvis-footer__col {
  min-width: 0;
}

.arvis-footer__col-title {
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 16px;
  list-style: none;
  cursor: default;
}

.arvis-footer__col-title::-webkit-details-marker {
  display: none;
}

/* --- Col 1: Brand --- */

.arvis-footer__logo {
  display: inline-block;
  margin-bottom: 16px;
}

.arvis-footer__logo img {
  height: 40px;
  width: auto;
  filter: brightness(0) invert(1); /* daca logo-ul e dark, il facem alb */
}

.arvis-footer__brand-desc {
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.65);
  margin: 0 0 20px;
  max-width: 36ch;
}

.arvis-footer__social {
  display: flex;
  gap: 8px;
}

.arvis-footer .arvis-footer__social-link,
#footer .arvis-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff !important;
  transition: background 150ms cubic-bezier(0.2, 0, 0, 1),
    color 150ms cubic-bezier(0.2, 0, 0, 1);
}

.arvis-footer .arvis-footer__social-link:hover,
.arvis-footer .arvis-footer__social-link:focus-visible,
#footer .arvis-footer__social-link:hover,
#footer .arvis-footer__social-link:focus-visible {
  background: var(--arvis-ember);
  color: #ffffff !important;
}

/* Umbrella override pentru regula IQIT `a:link:not(.nav-link):not(.btn) { color: var(--arvis-midnight) }`
   care setteaza toate <a>-urile pe Midnight (invizibil pe footer Midnight).
   Specificity (.arvis-footer + a:link + 2 :not) = (0, 5, 2) — bate (0, 3, 1) al IQIT. */
.arvis-footer a:link:not(.nav-link):not(.btn),
.arvis-footer a:visited:not(.nav-link):not(.btn),
#footer .arvis-footer a:link:not(.nav-link):not(.btn),
#footer .arvis-footer a:visited:not(.nav-link):not(.btn) {
  color: rgba(255, 255, 255, 0.85);
}

/* --- Liste de linkuri --- */

.arvis-footer__list,
.arvis-footer__contact-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.arvis-footer .arvis-footer__list a,
.arvis-footer .arvis-footer__contact-list a,
#footer .arvis-footer__list a,
#footer .arvis-footer__contact-list a {
  font-size: 14px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.85) !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}

.arvis-footer .arvis-footer__list a:hover,
.arvis-footer .arvis-footer__list a:focus,
.arvis-footer .arvis-footer__contact-list a:hover,
.arvis-footer .arvis-footer__contact-list a:focus,
#footer .arvis-footer__list a:hover,
#footer .arvis-footer__list a:focus,
#footer .arvis-footer__contact-list a:hover,
#footer .arvis-footer__contact-list a:focus {
  color: var(--arvis-ember) !important;
  text-decoration: none !important;
}

.arvis-footer__contact-link {
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  line-height: 1.45;
}

.arvis-footer__contact-link svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--arvis-ember);
}

.arvis-footer__contact-link strong {
  color: #ffffff;
  font-weight: 600;
  font-size: 13px;
}

.arvis-footer__contact-link--static {
  cursor: default;
}

/* --- Bottom strip --- */

.arvis-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 0;
  flex-wrap: wrap;
}

.arvis-footer__nap {
  font-size: 12px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.55);
  margin: 0;
}

.arvis-footer__nap strong {
  color: rgba(255, 255, 255, 0.85);
}

.arvis-footer__nap-addr {
  color: rgba(255, 255, 255, 0.58);
}

.arvis-footer__badges {
  display: flex;
  gap: 8px;
  margin-top: 8px;
  flex-wrap: wrap;
}

.arvis-footer .arvis-footer__badge,
#footer .arvis-footer__badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72) !important;
  text-decoration: none !important;
  transition: background 150ms, border-color 150ms, color 150ms;
}

.arvis-footer .arvis-footer__badge:hover,
.arvis-footer .arvis-footer__badge:focus-visible,
#footer .arvis-footer__badge:hover,
#footer .arvis-footer__badge:focus-visible {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
  color: #ffffff !important;
}

/* --- Payment logos --- */

.arvis-footer__payment {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  opacity: 0.7;
}

.arvis-footer__pay {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.08);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: rgba(255, 255, 255, 0.78);
}

/* --- Copyright --- */

.arvis-footer__copy {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.58);
  flex-wrap: wrap;
}

.arvis-footer__signoff {
  font-style: italic;
}

/* --- Tablet (768-991px) --- */

@media (max-width: 991px) {
  .arvis-footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }

  .arvis-footer__col--brand {
    grid-column: 1 / -1;
  }
}

/* --- Mobile (< 768px) — accordion --- */

@media (max-width: 767px) {
  .arvis-footer {
    padding: 40px 0 16px;
    margin-top: 40px;
  }

  .arvis-footer__grid {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .arvis-footer__col--brand {
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  /* Activeaza accordion pe coloanele de linkuri */
  .arvis-footer__col--links,
  .arvis-footer__col--contact {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    margin: 0;
  }

  .arvis-footer__col--links .arvis-footer__col-title,
  .arvis-footer__col--contact .arvis-footer__col-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 4px;
    margin: 0;
    cursor: pointer;
    user-select: none;
  }

  .arvis-footer__col--links .arvis-footer__col-title::after,
  .arvis-footer__col--contact .arvis-footer__col-title::after {
    content: "+";
    font-size: 20px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.5);
    transition: transform 200ms;
  }

  details[open] > .arvis-footer__col-title::after {
    content: "−";
  }

  .arvis-footer__list,
  .arvis-footer__contact-list {
    padding-bottom: 16px;
  }

  .arvis-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding: 24px 0 16px;
  }

  .arvis-footer__copy {
    flex-direction: column;
    gap: 4px;
  }
}

/* Pe desktop, details/summary expandate by default — anuleaza behavior nativ */
@media (min-width: 768px) {
  .arvis-footer details {
    display: block;
  }

  .arvis-footer details > .arvis-footer__col-title {
    display: block;
    cursor: default;
  }

  .arvis-footer details > .arvis-footer__col-title::after {
    content: none;
  }

  .arvis-footer details > .arvis-footer__list,
  .arvis-footer details > .arvis-footer__contact-list {
    display: flex !important;
  }
}

/* Fix content-visibility shadow DOM pentru <details> in browser moderne (Chrome 89+).
   ::details-content pseudo-element are content-visibility: hidden by default
   cand details nu e [open]. Fortam visible pe desktop si pentru cazurile cu [open] explicit. */
.arvis-footer details[open]::details-content {
  content-visibility: visible !important;
}

@media (min-width: 768px) {
  .arvis-footer details::details-content {
    content-visibility: visible !important;
  }
}

/* ============================================================
   ARVIS PRODUCT CARD (override miniature-1)
   ============================================================ */

.product-miniature.product-miniature-layout-1,
.product-miniature.product-miniature-layout-1 article {
  /* Resetam padding/border setate de Warehouse base */
  background: transparent;
  border: 0;
  box-shadow: none;
}

.product-miniature-layout-1 .product-miniature {
  position: relative;
}

/* --- Card container --- */

.js-product-miniature-wrapper .product-miniature {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--arvis-line-soft, #eef0f3);
  border-radius: 16px;
  overflow: hidden;
  transition: transform 200ms cubic-bezier(0.2, 0, 0, 1),
    box-shadow 200ms cubic-bezier(0.2, 0, 0, 1),
    border-color 200ms cubic-bezier(0.2, 0, 0, 1);
  height: 100%;
  font-family: "Inter", system-ui, sans-serif;
}

.js-product-miniature-wrapper .product-miniature:hover {
  transform: translateY(-2px);
  /* Elevatie two-layer identica cu panourile meniului (varianta preferata user) */
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.06), 0 16px 40px rgba(17, 24, 39, 0.12);
  border-color: var(--arvis-line, #e5e7eb);
}

/* --- Media (imagine + badges + wishlist) --- */

.arvis-pc__media {
  position: relative;
  aspect-ratio: 1 / 1;
  /* Fundal alb in spatele fotografiei in TOATE contextele cardului
     (PLP, homepage, search, related, wishlist). Sursa unica. */
  background: var(--surface);
  overflow: hidden;
}

.arvis-pc__img-link {
  display: block;
  width: 100%;
  height: 100%;
}

.arvis-pc__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 12px;
  transition: opacity 300ms cubic-bezier(0.2, 0, 0, 1),
    transform 400ms cubic-bezier(0.2, 0, 0, 1);
}

.arvis-pc__img--hover {
  position: absolute;
  inset: 0;
  opacity: 0;
}

.js-product-miniature-wrapper .product-miniature:hover .arvis-pc__img--primary {
  opacity: 0;
}

.js-product-miniature-wrapper .product-miniature:hover .arvis-pc__img--hover {
  opacity: 1;
}

.js-product-miniature-wrapper
  .product-miniature:hover
  .arvis-pc__img--primary:only-child,
.js-product-miniature-wrapper
  .product-miniature:hover
  .arvis-pc__img:only-of-type {
  opacity: 1;
  transform: scale(1.03);
}

/* --- Flags / badges --- */

.arvis-pc__flags {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.arvis-pc__flag {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 4px;
  background: var(--dark-surface);
  color: #ffffff;
  line-height: 1.2;
}

.arvis-pc__flag--new {
  background: var(--dark-surface);
}
.arvis-pc__flag--on-sale,
.arvis-pc__flag--discount,
.arvis-pc__flag--discount-percentage,
.arvis-pc__flag--discount-amount {
  background: var(--arvis-ember, #ff5c35);
}
.arvis-pc__flag--pack {
  background: var(--arvis-jade, #22c55e);
}
.arvis-pc__flag--out-of-stock {
  background: rgba(17, 24, 39, 0.45);
}
.arvis-pc__flag--online-only {
  background: var(--arvis-trust, #3b82f6);
}

/* --- Discount % big pill --- */

.arvis-pc__discount {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 800;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  letter-spacing: -0.01em;
}

/* Cand exista atat flags cat si discount, mutam wishlist-ul mai jos */
.product-miniature .product-functional-buttons-links,
.product-miniature .product-functional-buttons {
  position: absolute;
  top: 48px;
  right: 10px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.product-miniature .product-functional-buttons-links a,
.product-miniature .product-functional-buttons a {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(17, 24, 39, 0.06);
  border-radius: 999px;
  color: var(--arvis-midnight, #111827);
  font-size: 14px;
  transition: background 150ms, color 150ms, border-color 150ms;
}

.product-miniature .product-functional-buttons-links a:hover {
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
}

/* --- Body (text + cta) --- */

.arvis-pc__body {
  padding: 14px 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.arvis-pc__brand {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.2;
}

.arvis-pc__brand--muted {
  color: var(--arvis-slate, #6b7280);
  opacity: 0.7;
}

.arvis-pc__title {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  margin: 0;
  min-height: 40px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.arvis-pc__title a {
  color: var(--arvis-midnight, #111827);
  transition: color 150ms;
}
.arvis-pc__title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

.arvis-pc__title a:hover {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-pc__cta,
[data-button-action] {
  position: relative;
  z-index: 2;
}

.arvis-pc__reviews {
  font-size: 12px;
  min-height: 18px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-pc__reviews:empty {
  display: none;
}

.arvis-pc__price-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: auto;
  padding-top: 4px;
  flex-wrap: wrap;
}

.arvis-pc__price {
  font-size: 17px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}

.arvis-pc__price-old {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  text-decoration: line-through;
  font-variant-numeric: tabular-nums;
}

.arvis-pc__variants {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-top: 4px;
}

/* --- CTA Adauga in cos --- */

.arvis-pc__cta {
  margin-top: 10px;
}

.arvis-pc__cta .btn,
.product-miniature-layout-1 .product-list-actions .btn,
.product-miniature-layout-1 .product-add-cart .btn {
  width: 100%;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 600;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  transition: background 150ms, transform 100ms;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.arvis-pc__cta .btn:hover,
.product-miniature-layout-1 .product-list-actions .btn:hover {
  background: var(--arvis-ember-hover, #e64a24);
  border-color: var(--arvis-ember-hover, #e64a24);
  color: #ffffff;
}

.arvis-pc__cta .btn:active {
  transform: scale(0.98);
}

/* Disabled (stoc 0) */
.arvis-pc__cta .btn:disabled,
.arvis-pc__cta .btn.disabled {
  background: var(--arvis-snow, #f8f9fa);
  border-color: var(--arvis-line, #e5e7eb);
  color: var(--arvis-slate, #6b7280);
  cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
  .js-product-miniature-wrapper .product-miniature,
  .arvis-pc__img,
  .arvis-pc__cta .btn {
    transition: none;
  }
  .js-product-miniature-wrapper .product-miniature:hover {
    transform: none;
  }
}

/* ============================================================
   ARVIS CMS PAGES (Despre, Retur, Livrare, FAQ, Termeni, etc.)
   ============================================================ */

.arvis-cms__hero {
  background: var(--dark-surface);
  color: #ffffff;
  padding: 32px 0 40px;
  margin: 0 16px 32px;
  position: relative;
  overflow: hidden;
  border-radius: 20px;
}

.arvis-cms__hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
      circle at 90% 10%,
      rgba(255, 92, 53, 0.15),
      transparent 50%
    ),
    radial-gradient(circle at 5% 95%, rgba(255, 92, 53, 0.08), transparent 50%);
  z-index: 0;
}

.arvis-cms__hero > .container {
  position: relative;
  z-index: 1;
}

.arvis-cms__breadcrumb {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: 16px;
}

.arvis-cms .arvis-cms__breadcrumb a,
#wrapper .arvis-cms__breadcrumb a {
  color: rgba(255, 255, 255, 0.7) !important;
  text-decoration: none !important;
  transition: color 150ms;
}

.arvis-cms .arvis-cms__breadcrumb a:hover,
.arvis-cms .arvis-cms__breadcrumb a:focus,
#wrapper .arvis-cms__breadcrumb a:hover {
  color: var(--arvis-ember) !important;
}

.arvis-cms__breadcrumb span[aria-hidden] {
  margin: 0 8px;
  color: rgba(255, 255, 255, 0.3);
}

.arvis-cms__title {
  font-size: 32px;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: -0.025em;
  line-height: 1.1;
  margin: 0 0 8px;
  max-width: 24ch;
}

.arvis-cms__lede {
  font-size: 17px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.72);
  max-width: 58ch;
  margin: 0;
}

.arvis-cms__layout {
  max-width: 720px;
  margin: 0 auto;
  padding: 48px 0;
}

.arvis-cms__body {
  font-size: 16px;
  line-height: 1.7;
  color: var(--arvis-midnight);
}

.arvis-cms__body h2,
.cms-content h2 {
  font-size: 28px;
  font-weight: 800;
  margin: 40px 0 16px;
  line-height: 1.2;
  letter-spacing: -0.015em;
}

.arvis-cms__body h2:first-child,
.cms-content h2:first-child {
  margin-top: 0;
}

.arvis-cms__body h3,
.cms-content h3 {
  font-size: 20px;
  font-weight: 700;
  margin: 28px 0 12px;
}

.arvis-cms__body p,
.cms-content p {
  margin: 0 0 16px;
}

.arvis-cms__body ul,
.arvis-cms__body ol,
.cms-content ul,
.cms-content ol {
  margin: 0 0 16px;
  padding-left: 24px;
}

.arvis-cms__body li,
.cms-content li {
  margin-bottom: 8px;
}

.arvis-cms__body a,
.cms-content a {
  color: var(--arvis-ember);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.arvis-cms__body a:hover,
.cms-content a:hover {
  color: var(--arvis-ember-hover);
}

@media (max-width: 767px) {
  .arvis-cms__hero {
    padding: 32px 0 40px;
  }
  .arvis-cms__title {
    font-size: 30px;
  }
  .arvis-cms__lede {
    font-size: 15px;
  }
  .arvis-cms__layout {
    padding: 32px 0;
  }
  .arvis-cms__body h2 {
    font-size: 22px;
  }
}

/* ============================================================
   ARVIS PRETUL SINCER — pagina dedicata
   ============================================================ */

.arvis-pretulsincer {
  max-width: 760px;
  margin: 0 auto;
  padding: 56px 0 64px;
  font-size: 16px;
  line-height: 1.65;
  color: var(--arvis-midnight);
}

.arvis-pretulsincer__intro {
  text-align: center;
  margin-bottom: 48px;
}

.arvis-pretulsincer__lede {
  font-size: 20px;
  line-height: 1.55;
  color: var(--arvis-slate);
  margin: 0;
  max-width: 56ch;
  margin-left: auto;
  margin-right: auto;
}

.arvis-pretulsincer__example-title {
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  margin: 0 0 16px;
  color: var(--arvis-midnight);
  letter-spacing: -0.01em;
}

.arvis-pretulsincer__breakdown {
  margin-bottom: 56px;
  background: var(--surface);
  border-radius: 16px;
  border: 1px solid var(--arvis-line-soft, #eef0f3);
  overflow: hidden;
}

.arvis-pretulsincer__table {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}

.arvis-pretulsincer__table th,
.arvis-pretulsincer__table td {
  padding: 14px 24px;
  text-align: left;
  border-bottom: 1px solid var(--arvis-line-soft, #eef0f3);
  font-size: 15px;
}

.arvis-pretulsincer__table thead th {
  background: var(--arvis-snow, #f8f9fa);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
}

.arvis-pretulsincer__amount {
  text-align: right;
  font-weight: 600;
  white-space: nowrap;
}

.arvis-pretulsincer__subtotal td {
  background: rgba(17, 24, 39, 0.02);
  font-weight: 700;
  border-top: 2px solid var(--arvis-line, #e5e7eb);
}

.arvis-pretulsincer__margin td {
  background: rgba(255, 92, 53, 0.05);
  color: var(--arvis-ember);
}

.arvis-pretulsincer__total td {
  background: var(--dark-surface);
  color: #ffffff;
  font-size: 18px;
  border-bottom: 0;
}

.arvis-pretulsincer__filosofie h2 {
  font-size: 24px;
  font-weight: 800;
  margin: 40px 0 12px;
  letter-spacing: -0.015em;
}

.arvis-pretulsincer__filosofie p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 16px;
}

.arvis-pretulsincer__list {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.arvis-pretulsincer__list li {
  display: flex;
  gap: 12px;
  padding: 12px 16px;
  background: var(--arvis-snow, #f8f9fa);
  border-radius: 8px;
  font-size: 15px;
}

.arvis-pretulsincer__list li strong {
  flex-shrink: 0;
  min-width: 60px;
  color: var(--arvis-ember);
  font-weight: 700;
}

.arvis-pretulsincer__list--negative li {
  background: transparent;
  border-left: 3px solid var(--arvis-ember);
  padding-left: 16px;
  border-radius: 0;
}

@media (max-width: 575px) {
  .arvis-pretulsincer {
    padding: 32px 0 48px;
  }
  .arvis-pretulsincer__lede {
    font-size: 17px;
  }
  .arvis-pretulsincer__table th,
  .arvis-pretulsincer__table td {
    padding: 12px 16px;
    font-size: 14px;
  }
}

/* ============================================================
   ARVIS PRETUL SINCER BADGE PDP
   ============================================================ */

.arvis-pretulsincer-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 6px 12px;
  background: rgba(255, 92, 53, 0.08);
  border: 1px solid rgba(255, 92, 53, 0.18);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--arvis-ember-active, #c03a18);
  text-decoration: none !important;
  letter-spacing: 0.01em;
  line-height: 1.4;
  transition: background 150ms, border-color 150ms;
}

.arvis-pretulsincer-badge:hover {
  background: rgba(255, 92, 53, 0.14);
  border-color: rgba(255, 92, 53, 0.35);
  color: var(--arvis-ember-active, #c03a18) !important;
}

.arvis-pretulsincer-badge svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* Badge-ul e randat in .arvis-pdp__price-meta (flex-wrap) via hook type='price',
   ca frate cu "Cu TVA inclus". Pe ecrane mari incapea inline langa label (urat).
   Fortam label-ul pe latime intreaga => badge-ul cade MEREU pe rand propriu sub el. */
.arvis-pdp__price-meta > span:first-child {
  flex-basis: 100%;
}
.arvis-pdp__price-meta .arvis-pretulsincer-badge {
  margin-top: 0;
}

/* ---- Scarcity badge PDP "Doar N ramase" ----
   Apare sub indicatorul de stoc cand stocul real < pragul nativ PS_LAST_QTIES
   (asignat de arvisextend ca $arvis_scarcity). Doar numarul real (scarcity onesta).
   Ton Ember = urgenta fara rosu alarmant. */
.arvis-pdp__scarcity {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 8px;
  padding: 6px 12px;
  background: rgba(255, 92, 53, 0.10);
  border: 1px solid rgba(255, 92, 53, 0.22);
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--arvis-ember-active, #c03a18);
  letter-spacing: 0.01em;
  line-height: 1.4;
}

.arvis-pdp__scarcity svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* ============================================================
   ARVIS 404 PAGE (rewritten per design)
   ============================================================ */

/* Ascunde page header default (titlu "Pagina pe care o cauti nu a fost gasita" + linie orizontala).
   Hero-ul nostru e in not-found.tpl si are deja H1. Folosim :has() ca sa target wrappere care contin .page-not-found. */
body.pagenotfound .page-header,
body.pagenotfound > h1,
body.page-pagenotfound .page-header,
body.page-pagenotfound > h1,
#wrapper:has(.page-not-found) > .page-header,
#wrapper:has(.page-not-found) > h1,
#main:has(.page-not-found) > .page-header,
#main:has(.page-not-found) > h1,
.page-content-wrapper:has(.page-not-found) > .page-header,
.page-content-wrapper:has(.page-not-found) > h1,
section#wrapper:has(.page-not-found) header,
.inner-wrapper:has(.page-not-found) > .page-header,
.inner-wrapper:has(.page-not-found) > h1 {
  display: none !important;
}

.arvis-404 {
  font-family: "Inter", system-ui, sans-serif;
  background: var(--arvis-snow, #f8f9fa);
}

.arvis-404__hero {
  background: var(--surface);
  padding: 64px 0 32px;
  text-align: center;
  position: relative;
}

.arvis-404__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0 auto 24px;
}

.arvis-404__digit {
  font-family: "Inter", system-ui, sans-serif;
  font-weight: 900;
  font-size: 120px;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--arvis-midnight);
}

.arvis-404__digit--logo {
  width: 120px;
  height: 120px;
  object-fit: contain;
}

.arvis-404__eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--arvis-ember);
  margin: 0 0 12px;
}

.arvis-404__eyebrow span {
  margin: 0 6px;
  opacity: 0.5;
}

.arvis-404__title {
  font-size: 32px;
  font-weight: 800;
  color: var(--arvis-midnight);
  margin: 0 0 12px;
  letter-spacing: -0.02em;
  line-height: 1.2;
  max-width: 24ch;
  margin-inline: auto;
}

.arvis-404__lede {
  font-size: 15px;
  line-height: 1.6;
  color: var(--arvis-slate, #6b7280);
  margin: 0 auto 32px;
  max-width: 50ch;
}

.arvis-404__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.arvis-404__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 150ms, color 150ms, border-color 150ms, transform 100ms;
  cursor: pointer;
}

.arvis-404 .arvis-404__btn--primary,
#main .arvis-404__btn--primary {
  background: var(--arvis-ember) !important;
  color: #ffffff !important;
  border: 1px solid var(--arvis-ember);
}

.arvis-404 .arvis-404__btn--primary:hover,
.arvis-404 .arvis-404__btn--primary:focus {
  background: var(--arvis-ember-hover, #e64a24) !important;
  color: #ffffff !important;
}

.arvis-404 .arvis-404__btn--outline,
#main .arvis-404__btn--outline {
  background: transparent !important;
  color: var(--arvis-midnight) !important;
  border: 1px solid var(--arvis-line, #e5e7eb);
}

.arvis-404 .arvis-404__btn--outline:hover,
.arvis-404 .arvis-404__btn--outline:focus {
  background: var(--arvis-snow, #f8f9fa) !important;
  border-color: var(--arvis-midnight) !important;
  color: var(--arvis-midnight) !important;
}

.arvis-404__btn:active {
  transform: scale(0.98);
}

/* ========== Tag chips populare ========== */
.arvis-404__chips-wrap {
  padding: 32px 0 8px;
  text-align: center;
  background: var(--surface);
}

.arvis-404__chips-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
  margin: 0 0 16px;
}

.arvis-404__chips {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}

.arvis-404 .arvis-404__chip,
#main .arvis-404__chip {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  background: var(--surface);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: background 150ms, color 150ms, border-color 150ms;
}

.arvis-404 .arvis-404__chip:hover,
.arvis-404 .arvis-404__chip:focus {
  background: var(--arvis-snow, #f8f9fa) !important;
  border-color: var(--arvis-slate, #6b7280);
  color: var(--arvis-midnight) !important;
}

.arvis-404 .arvis-404__chip--accent,
#main .arvis-404__chip--accent {
  background: rgba(255, 92, 53, 0.1) !important;
  border-color: rgba(255, 92, 53, 0.3);
  color: var(--arvis-ember) !important;
}

.arvis-404 .arvis-404__chip--accent:hover,
.arvis-404 .arvis-404__chip--accent:focus {
  background: var(--arvis-ember) !important;
  border-color: var(--arvis-ember);
  color: #ffffff !important;
}

/* ========== 3 carduri contact ========== */
.arvis-404__cards-wrap {
  padding: 32px 0 64px;
  background: var(--surface);
}

.arvis-404__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  max-width: 960px;
  margin: 0 auto;
}

.arvis-404 .arvis-404__card,
#main .arvis-404__card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 16px;
  text-decoration: none !important;
  color: var(--arvis-midnight) !important;
  text-align: left;
  transition: transform 180ms cubic-bezier(0.2, 0, 0, 1),
    box-shadow 180ms cubic-bezier(0.2, 0, 0, 1),
    border-color 180ms cubic-bezier(0.2, 0, 0, 1);
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  width: 100%;
}

.arvis-404 .arvis-404__card:hover,
.arvis-404 .arvis-404__card:focus {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(17, 24, 39, 0.08);
  border-color: var(--arvis-line, #e5e7eb);
}

.arvis-404__card-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
}

.arvis-404__card-icon--wa {
  background: rgba(37, 211, 102, 0.12);
  color: #25d366;
}

.arvis-404__card-icon--email {
  background: rgba(255, 92, 53, 0.1);
  color: var(--arvis-ember);
}

.arvis-404__card-icon--search {
  background: rgba(17, 24, 39, 0.08);
  color: var(--arvis-midnight);
}

.arvis-404__card-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.arvis-404__card-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight);
  line-height: 1.3;
}

.arvis-404__card-sub {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  font-weight: 500;
  line-height: 1.4;
}

/* ========== Mobile ========== */
@media (max-width: 991px) {
  .arvis-404__cards {
    grid-template-columns: 1fr;
    max-width: 480px;
  }
}

@media (max-width: 767px) {
  .arvis-404__hero {
    padding: 40px 16px 24px;
  }
  .arvis-404__digit {
    font-size: 72px;
  }
  .arvis-404__digit--logo {
    width: 72px;
    height: 72px;
  }
  .arvis-404__title {
    font-size: 22px;
  }
  .arvis-404__lede {
    font-size: 14px;
  }
  .arvis-404__chips-wrap {
    padding: 24px 16px 8px;
  }
  .arvis-404__cards-wrap {
    padding: 24px 16px 48px;
  }
}

/* ============================================================
   ARVIS TRUST STRIP PDP (overlay pe blockreassurance)
   ============================================================ */

#block-reassurance,
.block-reassurance,
[id*="reassurance"] {
  margin: 24px 0;
}

#block-reassurance > ul,
.block-reassurance > ul,
#block-reassurance ul[class*="reassurance"],
.block-reassurance ul[class*="reassurance"] {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
  background: var(--arvis-snow, #f8f9fa);
  border-radius: 12px;
  padding: 4px;
}

#block-reassurance li,
.block-reassurance li {
  margin: 0;
  padding: 0;
  list-style: none;
}

#block-reassurance .block-reassurance-item,
.block-reassurance .block-reassurance-item,
[id*="reassurance"] [class*="reassurance-item"] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: transparent;
  border: 0;
  border-radius: 10px;
  text-align: left;
  transition: background 150ms;
}

#block-reassurance .block-reassurance-item:hover,
.block-reassurance .block-reassurance-item:hover {
  background: var(--surface);
}

#block-reassurance img,
.block-reassurance img,
#block-reassurance .svg-inline,
.block-reassurance .svg-inline {
  width: 28px !important;
  height: 28px !important;
  max-width: 28px !important;
  max-height: 28px !important;
  filter: none;
  flex-shrink: 0;
  /* Forteaza icoanele monochrome la Ember */
  /* (filter colorize doar daca sunt SVG monochrome — pentru imagini raster nu se aplica) */
}

#block-reassurance .block-reassurance-item-title,
#block-reassurance span,
.block-reassurance .block-reassurance-item-title,
.block-reassurance span {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--arvis-midnight) !important;
  line-height: 1.35 !important;
  font-family: "Inter", system-ui, sans-serif !important;
}

@media (max-width: 575px) {
  #block-reassurance > ul,
  .block-reassurance > ul {
    grid-template-columns: 1fr 1fr;
    padding: 4px;
  }

  #block-reassurance .block-reassurance-item,
  .block-reassurance .block-reassurance-item {
    padding: 10px 12px;
    gap: 8px;
  }

  #block-reassurance span,
  .block-reassurance span {
    font-size: 12px !important;
  }

  #block-reassurance img,
  .block-reassurance img {
    width: 22px !important;
    height: 22px !important;
  }
}

/* --- PDP price block — sectiunea cu pretul + Pretul Sincer badge --- */

.product-prices,
.product-price-and-shipping {
  font-family: "Inter", system-ui, sans-serif;
}

.product-prices .current-price,
.product-page .product-prices .current-price,
.product-price.h4 {
  display: inline-flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
}

.product-prices .current-price-value,
.product-page .price {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: var(--arvis-midnight) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
  font-variant-numeric: tabular-nums;
}

.product-prices .regular-price,
.product-page .product-prices .regular-price {
  font-size: 18px;
  color: var(--arvis-slate);
  text-decoration: line-through;
  font-weight: 500;
}

.product-discount-percentage,
.product-page .discount.discount-percentage {
  display: inline-block;
  padding: 4px 10px;
  background: var(--arvis-ember);
  color: #ffffff;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* ============================================================
   FIX blockwishlist orphan modals/backdrops
   ============================================================
   Modulul blockwishlist randeaza 1 modal + 1 backdrop PER buton wishlist
   pe pagina (4 produse = 4 modale + 4 backdrops). Cand CSS-ul Bootstrap
   modal nu se aplica corect (regula default `.modal { display: none }`),
   acestea raman vizibile peste tot continutul si acopera pagina.
   Fortez display: none cand nu sunt active (.show). */
.modal-backdrop.fade:not(.show),
.modal.fade:not(.show),
.wishlist-modal.modal.fade:not(.show) {
  display: none !important;
}

/* Cand sunt deschise legitim — pastreaza behavior normal */
.modal-backdrop.fade.show,
.modal.fade.show {
  display: block !important;
}

/* ============================================================
   ARVIS WISHLIST BUTTON (override blockwishlist Material Icons)
   ============================================================ */

/* Ascunde Material Icons font fallback (textul "favorite_border" brut)
   in caz ca alt template din modul scapa de override-ul nostru */
.product-miniature .wishlist-button-add .material-icons,
.arvis-pc .wishlist-button-add .material-icons {
  display: none !important;
}

/* Buton wishlist — cerc alb sus dreapta peste imagine */
.product-miniature .wishlist-button-add,
.arvis-pc .wishlist-button-add {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  width: 40px;
  height: 40px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 999px;
  color: var(--arvis-slate, #6b7280);
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(17, 24, 39, 0.08);
  transition: background 150ms cubic-bezier(0.2, 0, 0, 1),
    color 150ms cubic-bezier(0.2, 0, 0, 1),
    border-color 150ms cubic-bezier(0.2, 0, 0, 1),
    transform 150ms cubic-bezier(0.2, 0, 0, 1);
}

.product-miniature .wishlist-button-add:hover,
.product-miniature .wishlist-button-add:focus-visible,
.arvis-pc .wishlist-button-add:hover,
.arvis-pc .wishlist-button-add:focus-visible {
  background: var(--surface);
  color: var(--arvis-ember);
  border-color: var(--arvis-ember);
  transform: scale(1.05);
  outline: none;
}

/* SVG icons in button */
.arvis-wl__icon {
  display: block;
  pointer-events: none;
}

/* Default: heart outline vizibil, filled ascuns */
.arvis-wl__icon--filled {
  display: none;
}

/* Active state — produsul e in wishlist.
   blockwishlist adauga clasa pe button sau parent dupa adaugare. Acoperim cazurile uzuale. */
.wishlist-button-add.wishlist-product-added .arvis-wl__icon--outline,
.wishlist-button-add[data-product-is-in="1"] .arvis-wl__icon--outline,
.wishlist-button-add.added .arvis-wl__icon--outline {
  display: none;
}

.wishlist-button-add.wishlist-product-added .arvis-wl__icon--filled,
.wishlist-button-add[data-product-is-in="1"] .arvis-wl__icon--filled,
.wishlist-button-add.added .arvis-wl__icon--filled {
  display: block;
}

.wishlist-button-add.wishlist-product-added,
.wishlist-button-add[data-product-is-in="1"],
.wishlist-button-add.added {
  color: var(--arvis-ember);
  border-color: var(--arvis-ember);
}

/* ============================================================
   IQIT WISHLIST TOAST notification (Midnight-on-Midnight fix)
   ============================================================ */

#iqitwishlist-notification,
#iqitwishlist-notification .ns-box-inner,
#iqitwishlist-notification .ns-content,
#iqitwishlist-notification .ns-title,
#iqitwishlist-notification strong,
#iqitwishlist-notification .fa {
  color: #ffffff !important;
}

#iqitwishlist-notification {
  background: var(--dark-surface) !important;
  border-left: 4px solid var(--arvis-jade, #22c55e) !important;
  padding: 14px 18px !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) !important;
}

#iqitwishlist-notification .fa-check {
  color: var(--arvis-jade, #22c55e) !important;
  margin-right: 6px;
}

/* === ARVIS WISHLIST + COMPARE (iqit) — butoane pe CARD si PDP ===
   Card: hook displayProductListFunctionalButtons (wishlist + compare)
   PDP:  hook displayAfterProductAddCartBtn (wishlist + compare) */

/* --- CARD: cercuri albe sus-dreapta, in rand --- */
.arvis-pc__wishlist {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  display: flex;
  gap: 8px;
}
.arvis-pc__wishlist .col-add-wishlist,
.arvis-pc__wishlist .col-add-compare {
  padding: 0;
}
.arvis-pc__wishlist .btn-iqitwishlist-add,
.arvis-pc__wishlist .btn-iqitcompare-add,
.arvis-pc__wishlist .btn-iqitwishlist-add:link,
.arvis-pc__wishlist .btn-iqitcompare-add:link,
.arvis-pc__wishlist .btn-iqitwishlist-add:visited,
.arvis-pc__wishlist .btn-iqitcompare-add:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: var(--surface);
  box-shadow: 0 2px 8px rgba(17, 24, 39, 0.12);
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  text-decoration: none !important;
  transition: color 150ms, transform 150ms, box-shadow 150ms;
}
.arvis-pc__wishlist .btn-iqitwishlist-add:hover,
.arvis-pc__wishlist .btn-iqitcompare-add:hover {
  color: var(--arvis-ember, #ff5c35) !important;
  transform: scale(1.08);
  box-shadow: 0 4px 12px rgba(17, 24, 39, 0.18);
}
.arvis-pc__wishlist .btn-iqitwishlist-add.iqitwishlist-added,
.arvis-pc__wishlist .btn-iqitcompare-add.iqitcompare-added {
  color: var(--arvis-ember, #ff5c35) !important;
}

/* --- PDP: icon-buttons patrate, in rand --- */
.arvis-pdp__wishlist {
  display: inline-flex;
  gap: 8px;
}
.arvis-pdp__wishlist .col-add-wishlist,
.arvis-pdp__wishlist .col-add-compare {
  padding: 0;
}
.arvis-pdp__wishlist .btn-iqitwishlist-add,
.arvis-pdp__wishlist .btn-iqitcompare-add,
.arvis-pdp__wishlist .btn-iqitwishlist-add:link,
.arvis-pdp__wishlist .btn-iqitcompare-add:link,
.arvis-pdp__wishlist .btn-iqitwishlist-add:visited,
.arvis-pdp__wishlist .btn-iqitcompare-add:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 12px;
  background: var(--surface) !important;
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 18px;
  box-shadow: none !important;
  cursor: pointer;
  transition: color 150ms, border-color 150ms, transform 150ms;
}
.arvis-pdp__wishlist .btn-iqitwishlist-add:hover,
.arvis-pdp__wishlist .btn-iqitcompare-add:hover {
  color: var(--arvis-ember, #ff5c35) !important;
  border-color: var(--arvis-ember, #ff5c35) !important;
  transform: translateY(-1px);
}
.arvis-pdp__wishlist .btn-iqitwishlist-add.iqitwishlist-added,
.arvis-pdp__wishlist .btn-iqitcompare-add.iqitcompare-added {
  color: var(--arvis-ember, #ff5c35) !important;
  border-color: var(--arvis-ember, #ff5c35) !important;
}

/* --- Icon toggle (not-added implicit; added cand e in lista) --- */
.arvis-pc__wishlist .added,
.arvis-pdp__wishlist .added {
  display: none;
}
.arvis-pc__wishlist .iqitwishlist-added .not-added,
.arvis-pc__wishlist .iqitcompare-added .not-added,
.arvis-pdp__wishlist .iqitwishlist-added .not-added,
.arvis-pdp__wishlist .iqitcompare-added .not-added {
  display: none;
}
.arvis-pc__wishlist .iqitwishlist-added .added,
.arvis-pc__wishlist .iqitcompare-added .added,
.arvis-pdp__wishlist .iqitwishlist-added .added,
.arvis-pdp__wishlist .iqitcompare-added .added {
  display: inline-block;
}

/* === PDP: rand actiuni secundare — favorite + comparare + share, 3 iconite egale ===
   Wishlist (hook iqit) e flatten cu display:contents, deci col-add-wishlist +
   col-add-compare + share-open devin 3 flex items egale pe acelasi rand. */
.arvis-pdp__secondary-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.arvis-pdp__secondary-actions .arvis-pdp__wishlist {
  display: contents;
}
.arvis-pdp__secondary-actions .col-add-wishlist,
.arvis-pdp__secondary-actions .col-add-compare,
.arvis-pdp__secondary-actions .arvis-pdp__share-open {
  flex: 1 1 0;
  min-width: 0;
}
.arvis-pdp__secondary-actions .btn-iqitwishlist-add,
.arvis-pdp__secondary-actions .btn-iqitcompare-add {
  width: 100% !important;
}
/* Share: acelasi look ca favorite/comparare (icon patrat, fara text) */
.arvis-pdp__secondary-actions .arvis-pdp__share-open {
  justify-content: center;
  gap: 0;
  height: 52px;
  padding: 0;
  border-radius: 12px;
  border: 1px solid var(--arvis-line, #e5e7eb);
  background: var(--surface);
  color: var(--arvis-slate, #6b7280);
}
.arvis-pdp__secondary-actions .arvis-pdp__share-open:hover,
.arvis-pdp__secondary-actions .arvis-pdp__share-open:focus-visible {
  color: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
}

/* Desktop (buy-row devine rand pe ≥576px): scoatem actiunile secundare pe un
   RAND PROPRIU sub qty+add-to-cart, ca iconite compacte 52px aliniate la stanga
   (nu stretch pe toata latimea). Pe mobil buy-row e column => raman 3 egale. */
@media (min-width: 576px) {
  .arvis-pdp__buy-row {
    flex-wrap: wrap;
  }
  .arvis-pdp__secondary-actions {
    flex-basis: 100%;
  }
  .arvis-pdp__secondary-actions .col-add-wishlist,
  .arvis-pdp__secondary-actions .col-add-compare,
  .arvis-pdp__secondary-actions .arvis-pdp__share-open {
    flex: 0 0 52px;
  }
}

/* === ARVIS WISHLIST iqitwishlist — modal login (#iqitwishlist-modal) === */
#iqitwishlist-modal .modal-content {
  border: none;
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(17, 24, 39, 0.25);
  overflow: hidden;
}

#iqitwishlist-modal .modal-header {
  border-bottom: 1px solid var(--arvis-line-soft, #eef0f3);
  padding: 20px 24px;
}

#iqitwishlist-modal .modal-title {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
}

#iqitwishlist-modal .modal-body {
  padding: 24px;
}

#iqitwishlist-modal .form-control,
#iqitwishlist-modal input[type="text"],
#iqitwishlist-modal input[type="email"],
#iqitwishlist-modal input[type="password"] {
  width: 100%;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 14px;
  padding: 14px 16px;
  font-size: 15px;
  font-family: "Inter", sans-serif;
  color: var(--arvis-midnight, #111827);
  background: var(--surface-container, #f8f9fa);
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
#iqitwishlist-modal .form-control:focus,
#iqitwishlist-modal input:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
  background: var(--surface, #ffffff);
  box-shadow: 0 0 0 3px rgba(255, 92, 53, 0.12);
}

/* Input group parola (ochi show/hide) — identic cu pagina de autentificare */
#iqitwishlist-modal .input-group,
#iqitwishlist-modal .js-parent-focus {
  position: relative;
  display: block;
  width: 100%;
}
#iqitwishlist-modal .input-group > .form-control,
#iqitwishlist-modal .input-group input.form-control,
#iqitwishlist-modal .js-parent-focus input.form-control {
  width: 100% !important;
  padding-right: 52px !important;
  border-radius: 14px !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  flex: none;
}
#iqitwishlist-modal .input-group > .form-control:focus,
#iqitwishlist-modal .input-group input.form-control:focus {
  border-color: var(--arvis-ember, #ff5c35) !important;
}
#iqitwishlist-modal .input-group-append,
#iqitwishlist-modal .input-group-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  background: transparent;
  z-index: 2;
  width: auto;
  max-width: none;
  padding: 0;
}
#iqitwishlist-modal .input-group-append .btn,
#iqitwishlist-modal .input-group-btn .btn,
#iqitwishlist-modal [data-action="show-password"] {
  background: transparent !important;
  border: none !important;
  color: var(--arvis-slate, #6b7280) !important;
  padding: 6px 10px !important;
  margin: 0 !important;
  min-width: 0 !important;
  width: auto !important;
  font-size: 16px;
  line-height: 1;
  box-shadow: none !important;
  border-radius: 8px !important;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}
#iqitwishlist-modal .input-group-append .btn:hover,
#iqitwishlist-modal .input-group-btn .btn:hover,
#iqitwishlist-modal [data-action="show-password"]:hover {
  background: var(--surface-container, #f8f9fa) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}
#iqitwishlist-modal .input-group-append .btn i,
#iqitwishlist-modal .input-group-btn .btn i,
#iqitwishlist-modal [data-action="show-password"] i {
  font-size: 16px;
  color: inherit !important;
  line-height: 1;
}

/* Buton "Autentificare" — full-width, la fel ca butonul Google de sub el */
#iqitwishlist-modal button[type="submit"],
#iqitwishlist-modal .btn-primary {
  display: block;
  width: 100%;
  padding: 13px 20px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
}

/* Label-urile pe rand propriu (deasupra inputului) in loc de stanga */
#iqitwishlist-modal .form-group.row,
#iqitwishlist-modal .form-group {
  display: block;
  margin-bottom: 16px;
}
#iqitwishlist-modal .form-group label,
#iqitwishlist-modal .col-form-label {
  display: block;
  width: 100%;
  max-width: none;
  flex: none;
  text-align: left;
  padding: 0 0 6px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--arvis-slate, #6b7280);
}
#iqitwishlist-modal .form-group > div,
#iqitwishlist-modal .form-group .col,
#iqitwishlist-modal .form-group [class^="col-"] {
  width: 100%;
  max-width: none;
  flex: none;
  padding: 0;
}

/* ============================================================
   SCROLL-TO-TOP — restyled Arvis + repozitionat deasupra FAB
   ============================================================
   Butonul tinta: #back-to-top (din Warehouse).
   1. Styling: cerc alb cu sageata Midnight, hover Ember.
   2. Pozitionare: deasupra FAB-ului WhatsApp.
   3. Ascuns pe mobile PDP (UI saturat) + cand cart drawer e deschis. */

#back-to-top {
  position: fixed !important;
  right: 24px !important;
  bottom: 92px !important;
  z-index: 9989 !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  background: var(--surface) !important;
  color: var(--arvis-midnight, #111827) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  box-shadow: 0 4px 12px rgba(17, 24, 39, 0.12) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  font-size: 18px !important;
  line-height: 1 !important;
  transition: background 150ms, color 150ms, transform 150ms, box-shadow 150ms !important;
}

#back-to-top:hover {
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border-color: var(--arvis-ember, #ff5c35) !important;
  transform: translateY(-2px);
}

#back-to-top .fa,
#back-to-top i {
  color: inherit !important;
  font-size: 18px;
}

/* Mobile general: deasupra FAB-ului (76 + 50 + 12 = 138px) */
@media (max-width: 767px) {
  #back-to-top {
    right: 16px !important;
    bottom: 138px !important;
    width: 40px !important;
    height: 40px !important;
  }
}

/* Mobile PDP — ascunde scroll-to-top complet (UI saturat: botnav + sticky CTA + FAB) */
@media (max-width: 767px) {
  body:has(.arvis-pdp-sticky) #back-to-top,
  body#product #back-to-top,
  body.product-page #back-to-top,
  body.page-product #back-to-top {
    display: none !important;
  }
}

/* Cand cart drawer / dropdown account / orice menu Bootstrap e deschis,
   ascunde FAB-ul WhatsApp + #back-to-top.
   :has() + aria-expanded prinde Bootstrap dropdowns. */
body.modal-open .arvis-wa-fab,
body.modal-open #back-to-top,
body.cart-open .arvis-wa-fab,
body.cart-open #back-to-top,
body:has([aria-expanded="true"][data-bs-toggle="dropdown"]) .arvis-wa-fab,
body:has([aria-expanded="true"][data-bs-toggle="dropdown"]) #back-to-top,
body:has(.dropdown-menu.show) .arvis-wa-fab,
body:has(.dropdown-menu.show) #back-to-top {
  display: none !important;
}

/* Backup pentru FAB pe PDP via :has() — daca regula din arviswhatsapp.css esueaza */
@media (max-width: 767px) {
  body:has(.arvis-pdp-sticky) .arvis-wa-fab {
    bottom: calc(
      60px + 64px + 12px + env(safe-area-inset-bottom, 0)
    ) !important;
  }
}

/* ============================================================
   ARVIS HEADER FIXES — Cos, Search, User dropdown
   ============================================================ */

/* === Container header-right: layout horizontal cu spacing === */
.col-header-right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
}

#ps-shoppingcart-wrapper {
  display: inline-flex;
}

/* Ordine pill-uri: Autentificare (cont) PRIMUL, Cos al doilea (conform design).
   `order` pe flex-children directi din .col-header-right. */
.col-header-right #user_info {
  order: 1 !important;
}
.col-header-right #ps-shoppingcart-wrapper,
.col-header-right .ps-shoppingcart,
.col-header-right .side-cart {
  order: 2 !important;
}

/* === Cos button: pill EMBER permanent (icon+text albe) + badge = cerc alb cu
   numar ember in interior, pozitionat la dreapta pill-ului. Design #61. === */
#cart-toogle,
a#cart-toogle,
.cart-toogle.header-cart-btn,
.cart-toogle.header-btn {
  position: relative !important;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  padding: 9px 40px 9px 16px !important; /* spatiu dreapta pt. cercul contor */
  border-radius: 999px !important;
  border: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px;
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none !important;
  transition: background 150ms, color 150ms;
}

#cart-toogle:hover,
#cart-toogle:focus-visible,
.cart-toogle.header-cart-btn:hover {
  background: var(--arvis-ember-hover, #e64a24) !important;
  color: #ffffff !important;
}

#cart-toogle .icon,
#cart-toogle .fa-shopping-bag {
  color: #ffffff !important;
  font-size: 18px;
  background: transparent !important;
}

#cart-toogle .title,
#cart-toogle .cart-toggle-details,
#cart-toogle .cart-separator,
#cart-toogle .info-wrapper {
  color: inherit !important;
  background: transparent !important;
}

#cart-toogle .cart-separator {
  opacity: 0.4;
  margin: 0 4px;
}

/* Badge contor = cerc ALB cu numar EMBER, pozitionat la dreapta pill-ului.
   (Elementul e in interiorul <i class="fa-shopping-bag"> → absolut fata de pill.) */
#cart-toogle .cart-products-count-btn {
  position: absolute !important;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  min-width: 22px;
  padding: 0 !important;
  background: #ffffff !important;
  color: var(--arvis-ember, #ff5c35) !important;
  border-radius: 999px !important;
  font-size: 12px;
  font-weight: 700;
  margin: 0 !important;
}

/* Mereu vizibil, inclusiv pe cos gol (afiseaza 0) */
#cart-toogle .cart-products-count-btn.d-none {
  display: inline-flex !important;
}

/* Pill Cos pe desktop = doar iconita + "Cos" + badge contor, FARA valoarea
   (totalul) care ocupa spatiu. Ascundem detaliile monetare, pastram .title. */
#cart-toogle .cart-toggle-details,
#cart-toogle .cart-separator,
#cart-toogle .header-cart-total,
#cart-toogle .ajax_cart_total {
  display: none !important;
}

/* ===========================================================================
   MOBIL — redesign butoane header (apropiat de desktop)
   - Cos: pill EMBER compact = iconita cart + cerc alb contor (fara text "Cos")
   - Cont: pill OUTLINE = iconita persoana (fara text)
   =========================================================================== */
@media (max-width: 991px) {
  /* Spatiu intre pill-ul de cont si cel de cos + breathing room la marginea dreapta */
  #mobile-header .col-mobile-btn-cart {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }

  /* --- Cos = pill ember --- */
  #mobile-header #mobile-cart-toogle.m-nav-btn,
  #mobile-header #mobile-cart-toogle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    background: var(--arvis-ember, #ff5c35) !important;
    color: #ffffff !important;
  }
  #mobile-header #mobile-cart-toogle > span {
    display: none !important; /* label "Cos" */
  }
  /* iconita cart alba + contor inline langa ea */
  #mobile-header #mobile-cart-toogle .mobile-bag-icon,
  #mobile-header #mobile-cart-toogle .fa-shopping-bag {
    color: #ffffff !important;
    font-size: 17px;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
  }
  /* contor = cerc ALB cu numar EMBER (inline, scos din pozitia absoluta a temei) */
  #mobile-header #mobile-cart-toogle .cart-products-count-btn {
    position: static !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    min-width: 18px;
    padding: 0 !important;
    margin: 0 !important;
    background: #ffffff !important;
    color: var(--arvis-ember, #ff5c35) !important;
    border-radius: 999px !important;
    font-size: 11px;
    font-weight: 700;
    top: auto;
    right: auto;
  }
  #mobile-header #mobile-cart-toogle .cart-products-count-btn.d-none {
    display: inline-flex !important;
  }

  /* --- Cont = pill outline --- */
  #mobile-header .col-mobile-btn-account .m-nav-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    border: 1px solid var(--arvis-line, #e5e7eb) !important;
    background: var(--surface, #ffffff) !important;
    color: var(--arvis-midnight, #111827) !important;
  }
  #mobile-header .col-mobile-btn-account .m-nav-btn > span {
    display: none !important; /* label "Autentificare" */
  }
  #mobile-header .col-mobile-btn-account .m-nav-btn .fa-user {
    color: inherit !important;
    font-size: 17px;
  }
}

/* ===========================================================================
   TRUST-BAR actiuni relocate (.col.right-nav: wishlist + Cercul) — fixe layout
   =========================================================================== */
/* 1) Wrapper Bootstrap `.col` → rand inline (wishlist langa Cercul, nu stacked) */
.arvis-trustbar__right .col.right-nav,
.arvis-trustbar__right .right-nav {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 16px !important;
  width: auto !important;
  flex: 0 0 auto !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}
.arvis-trustbar__right .right-nav .d-inline-block {
  display: inline-flex !important;
  align-items: center !important;
}
/* 2) Text wishlist deschis pe bara inchisa (bate `a:link:not(...)` 0,3,1 al temei
   prin !important), iconita + contor la fel; hover ember. */
.arvis-trustbar__right .right-nav a,
.arvis-trustbar__right .d-inline-block a,
.arvis-trustbar__right a[href*="iqitwishlist"],
.arvis-trustbar__right a[href*="iqitwishlist"] .fa,
.arvis-trustbar__right #iqitwishlist-nb {
  color: rgba(255, 255, 255, 0.92) !important;
}
.arvis-trustbar__right .right-nav a:hover,
.arvis-trustbar__right .right-nav a:hover .fa {
  color: var(--arvis-ember, #ff5c35) !important;
}

/* === Search widget: pill rounded pe ambele capete === */
#search_widget {
  width: 100%;
  max-width: 540px;
}

#search_widget .input-group {
  display: flex !important;
  align-items: stretch !important;
  background: var(--surface) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  transition: border-color 150ms, box-shadow 150ms !important;
}

#search_widget .input-group:focus-within {
  border-color: var(--arvis-ember, #ff5c35) !important;
  box-shadow: 0 0 0 3px rgba(255, 92, 53, 0.12) !important;
}

#search_widget .form-search-control,
#search_widget input.form-control {
  flex: 1 1 auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 10px 18px !important;
  box-shadow: none !important;
  outline: none !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
}

#search_widget .form-search-control:focus,
#search_widget input.form-control:focus {
  box-shadow: none !important;
  outline: none !important;
}

#search_widget .form-search-control::placeholder {
  color: var(--arvis-slate, #6b7280);
  opacity: 1;
}

#search_widget .search-btn {
  flex-shrink: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--arvis-slate, #6b7280) !important;
  padding: 0 18px !important;
  cursor: pointer;
  transition: color 150ms;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#search_widget .search-btn:hover,
#search_widget .search-btn:focus-visible {
  color: var(--arvis-ember, #ff5c35) !important;
  background: transparent !important;
}

#search_widget .search-btn .fa-search {
  font-size: 15px;
}

/* === User info: side-by-side cu cart === */
#user_info {
  display: inline-flex !important;
  margin: 0 !important;
}

#user_info .dropdown {
  display: inline-flex;
}

/* Buton cont/Autentificare = pill OUTLINE (border + bg surface). Markup guest =
   `#user_info > a` (fara clasa .account), deci tintim si a-ul direct. Design #64. */
#user_info .account,
#user_info a.account,
#user_info > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px;
  padding: 9px 16px !important;
  border-radius: 999px !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  color: var(--arvis-midnight, #111827) !important;
  background: var(--surface, #ffffff) !important;
  text-decoration: none !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 600;
  font-size: 14px;
  transition: background 150ms, color 150ms, border-color 150ms;
}

#user_info .account:hover,
#user_info .account:focus-visible,
#user_info > a:hover,
#user_info > a:focus-visible {
  background: var(--surface, #ffffff) !important;
  border-color: var(--arvis-ember, #ff5c35) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

/* GUEST (Autentificare) — iconita persoana simpla */
#user_info > a .icon,
#user_info > a .fa-user {
  color: inherit !important;
  font-size: 18px;
  background: transparent !important;
}

/* LOGAT (.account, in .dropdown) — avatar = cerc EMBER cu iconita alba */
#user_info .account .icon,
#user_info .account .fa-user {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  flex-shrink: 0;
}

/* GUEST text simplu */
#user_info > a .title,
#user_info > a span {
  color: inherit !important;
}

/* LOGAT — „Salut," mic/muted deasupra numelui (bold), pe doua randuri */
#user_info .account .title {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  line-height: 1.15;
  font-weight: 700;
  color: var(--arvis-midnight, #111827) !important;
  text-align: left;
}
#user_info .account .title::before {
  content: "Salut,";
  font-size: 11px;
  font-weight: 500;
  color: var(--arvis-slate, #6b7280);
}

/* Dropdown menu styling */
#user_info .dropdown-menu {
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(17, 24, 39, 0.12);
  padding: 8px;
  min-width: 220px;
}

#user_info .dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 14px;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
  transition: background 120ms, color 120ms;
}

#user_info .dropdown-item:hover,
#user_info .dropdown-item:focus {
  background: var(--arvis-snow, #f8f9fa) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

#user_info .dropdown-item .fa {
  color: var(--arvis-slate, #6b7280);
  width: 16px;
}

#user_info .dropdown-item:hover .fa {
  color: var(--arvis-ember, #ff5c35);
}

/* ============================================================================
   ARVIS PLP (Product Listing Page) — Etapa 4 Faza 1
   ============================================================================
   Sursa design: design/pages-category.jsx
   Structura:
     .arvis-plp
       .arvis-plp__hero (full-width, bg Snow)
         .arvis-plp__breadcrumb
         .arvis-plp__hero-grid
           .arvis-plp__hero-content (H1 + descriere)
           .arvis-plp__hero-stats (count produse + future stats)
       .arvis-plp__container
         .arvis-plp__layout (grid 260px sidebar | 1fr main)
           .arvis-plp__sidebar
             ...{hook displayLeftColumn}...
             .arvis-plp__trust-card
           .arvis-plp__main
             .arvis-plp .products-selection
             .arvis-plp__listing (grid 3 col desktop / 2 col mobile)
             .arvis-plp__pagination-wrap
         .arvis-plp__seo (card jos cu long content categorie)
   ============================================================================ */

/* === Hero PLP === */
.arvis-plp__hero {
  background: var(--arvis-snow, #f8f9fa);
  padding: 32px 0 48px;
  border-bottom: 1px solid var(--arvis-line-soft, #eef0f3);
}

.arvis-plp__hero > .container {
  max-width: 1200px;
}

.arvis-plp__breadcrumb {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 16px;
}

/* Override pentru breadcrumb-ul nativ din displayBreadcrumb hook */
.arvis-plp__breadcrumb .breadcrumb,
.arvis-plp__breadcrumb ol {
  padding: 0;
  margin: 0;
  background: transparent;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  font-size: inherit;
}

.arvis-plp__breadcrumb li {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.arvis-plp__breadcrumb li + li::before {
  content: "/";
  margin: 0 8px;
  color: var(--arvis-slate-soft, #9ca3af);
}

.arvis-plp .arvis-plp__breadcrumb a {
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: color 150ms;
}

.arvis-plp .arvis-plp__breadcrumb a:hover,
.arvis-plp .arvis-plp__breadcrumb a:focus {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-plp__breadcrumb li:last-child {
  color: var(--arvis-midnight, #111827);
  font-weight: 500;
}

.arvis-plp__hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 64px;
  align-items: end;
  margin-top: 16px;
}

.arvis-plp__hero-content {
  min-width: 0;
}

.arvis-plp__title {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 48px;
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.1;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

.arvis-plp__description {
  margin-top: 16px;
  margin-bottom: 0;
  font-size: 16px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
  max-width: 640px;
}

.arvis-plp__description p {
  margin: 0 0 8px;
}

.arvis-plp__description p:last-child {
  margin-bottom: 0;
}

.arvis-plp__description strong {
  color: var(--arvis-midnight, #111827);
  font-weight: 600;
}

/* === Hero stats (desktop only) === */
.arvis-plp__hero-stats {
  display: flex;
  gap: 32px;
  justify-content: flex-end;
  align-items: end;
}

.arvis-plp__stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.arvis-plp__stat-value {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 32px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  line-height: 1;
  letter-spacing: -0.02em;
}

.arvis-plp__stat-label {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1;
}

/* Accent stat (ex. rating mediu) — Ember value pentru emphasis vizual */
.arvis-plp__stat--accent .arvis-plp__stat-value {
  color: var(--arvis-ember, #ff5c35);
}

/* Mobile hero adjustments */
@media (max-width: 991px) {
  .arvis-plp__hero {
    padding: 20px 0 28px;
  }

  .arvis-plp__hero-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }

  .arvis-plp__title {
    font-size: 32px;
  }

  .arvis-plp__description {
    font-size: 14px;
    max-width: 100%;
  }

  .arvis-plp__hero-stats {
    justify-content: flex-start;
    gap: 24px;
  }

  .arvis-plp__stat-value {
    font-size: 24px;
  }
}

/* === Sub-category chips (orizontale, sub hero) === */
.arvis-plp__subcat {
  background: var(--surface);
  padding: 20px 0;
  /* Border-bottom removed — pill Snow al toolbarului ofera separare vizuala suficienta */
}

.arvis-plp__subcat > .container {
  max-width: 1200px;
}

.arvis-plp__subcat-scroll {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* Chip pill (folosit pentru sub-categorii si active filter chips) */
.arvis-plp .arvis-plp__chip,
#main .arvis-plp .arvis-plp__chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  min-height: 32px;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 150ms, color 150ms, border-color 150ms,
    box-shadow 150ms;
  white-space: nowrap;
  border: 0;
}

/* Outlined: pentru sub-categorii ne-selectate */
.arvis-plp .arvis-plp__chip--outlined,
#main .arvis-plp .arvis-plp__chip--outlined {
  background: transparent !important;
  color: var(--arvis-midnight, #111827) !important;
  box-shadow: inset 0 0 0 1px var(--arvis-line, #e5e7eb);
}

.arvis-plp .arvis-plp__chip--outlined:hover,
.arvis-plp .arvis-plp__chip--outlined:focus {
  background: var(--arvis-snow, #f8f9fa) !important;
  color: var(--arvis-midnight, #111827) !important;
  box-shadow: inset 0 0 0 1px var(--arvis-midnight, #111827);
}

/* Selected: pentru "Toate" — chip-ul activ (categoria curenta) */
.arvis-plp .arvis-plp__chip--selected,
#main .arvis-plp .arvis-plp__chip--selected {
  background: var(--dark-surface) !important;
  color: #ffffff !important;
  box-shadow: none;
}

.arvis-plp .arvis-plp__chip--selected:hover,
.arvis-plp .arvis-plp__chip--selected:focus {
  background: var(--arvis-midnight-90, #1f2937) !important;
  color: #ffffff !important;
}

/* Soft: pentru active filter chips Ember tint (folosit in Faza 2.3) */
.arvis-plp .arvis-plp__chip--soft,
#main .arvis-plp .arvis-plp__chip--soft {
  background: var(--arvis-ember-soft, #fff3f0) !important;
  color: var(--arvis-ember-darker, #cc4827) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 92, 53, 0.2);
}

.arvis-plp .arvis-plp__chip--soft:hover,
.arvis-plp .arvis-plp__chip--soft:focus {
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  box-shadow: inset 0 0 0 1px var(--arvis-ember, #ff5c35);
}

/* Mobile: scroll orizontal in loc de wrap */
@media (max-width: 767px) {
  .arvis-plp__subcat {
    padding: 16px 0;
  }

  .arvis-plp__subcat-scroll {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0 16px;
    margin: 0 -16px;
  }

  .arvis-plp__subcat-scroll::-webkit-scrollbar {
    display: none;
  }

  .arvis-plp__subcat-scroll > * {
    flex-shrink: 0;
    scroll-snap-align: start;
  }
}

/* === Layout principal: sidebar + main column === */
.arvis-plp__container {
  /* fara max-width propriu → se expandeaza pana la latimea temei (ca restul sectiunilor) */
  padding-top: 16px;
  padding-bottom: 96px;
}

.arvis-plp__layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}

.arvis-plp__sidebar {
  position: sticky;
  top: 20px;
  align-self: start;
  /* Limita inaltime sidebar la viewport - 40px (top+bottom margin) ca sa scroll-uiasca daca filters sunt multe */
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--arvis-line, #e5e7eb) transparent;
}

/* Custom scrollbar pe webkit */
.arvis-plp__sidebar::-webkit-scrollbar {
  width: 6px;
}

.arvis-plp__sidebar::-webkit-scrollbar-track {
  background: transparent;
}

.arvis-plp__sidebar::-webkit-scrollbar-thumb {
  background: var(--arvis-line, #e5e7eb);
  border-radius: 999px;
}

.arvis-plp__sidebar::-webkit-scrollbar-thumb:hover {
  background: var(--arvis-slate-soft, #9ca3af);
}

/* Card wrapper pentru hook displayLeftColumn (containe ps_facetedsearch, ps_categorytree, etc.) */
.arvis-plp__sidebar #search_filters,
.arvis-plp__sidebar .block-categories,
.arvis-plp__sidebar #search_filters_wrapper,
.arvis-plp__sidebar > div:not(.arvis-plp__trust-card):first-child {
  background: var(--arvis-snow, #f8f9fa);
  border-radius: 20px;
  padding: 8px 20px 20px;
}

/* Containere multiple in sidebar (categorytree + facetedsearch) → margin intre ele */
.arvis-plp__sidebar > div + div:not(.arvis-plp__trust-card) {
  margin-top: 16px;
}

/* === Filter sidebar polish — ps_facetedsearch native render ===
   Modulul ps_facetedsearch produce structura:
     #search_filters (container)
       .facet (per filter group)
         header (title)
         .collapse > ul > li.facet-label > label > input + span
   Stilizam pentru aspect Arvis: titluri uppercase, checkbox custom Midnight, etc. */

/* Reset container */
.arvis-plp__sidebar #search_filters,
.arvis-plp__sidebar .block-categories,
.arvis-plp__sidebar .block.facets {
  border: 0 !important;
  box-shadow: none !important;
}

/* Header global "Filter By" — ascund (avem deja titlu sidebar via container) */
.arvis-plp__sidebar #search_filters > .h6,
.arvis-plp__sidebar #search_filters > h4.title_block,
.arvis-plp__sidebar #search_filter_controls,
.arvis-plp__sidebar .search-filter-controls,
.arvis-plp__sidebar #_mobile_search_filters_wrapper {
  display: none !important;
}

/* Filter group (.facet) */
.arvis-plp__sidebar .facet,
.arvis-plp__sidebar .facet-type-checkbox,
.arvis-plp__sidebar .block-categories .category-sub-menu {
  border-bottom: 1px solid var(--arvis-line-soft, #eef0f3) !important;
  padding: 20px 0 !important;
  margin: 0 !important;
}

.arvis-plp__sidebar .facet:last-child,
.arvis-plp__sidebar > div > div:last-child .facet:last-child {
  border-bottom: 0 !important;
  padding-bottom: 4px !important;
}

.arvis-plp__sidebar .facet:first-child {
  padding-top: 4px !important;
}

/* Group title — uppercase, letter-spaced */
.arvis-plp__sidebar .facet .facet-title,
.arvis-plp__sidebar .facet > .h6,
.arvis-plp__sidebar .facet > h6,
.arvis-plp__sidebar .facet > header,
.arvis-plp__sidebar .facet .js-facet-title,
.arvis-plp__sidebar .facet-title,
.arvis-plp__sidebar .collapse-list,
.arvis-plp__sidebar .title_block,
.arvis-plp__sidebar .block-categories h4,
.arvis-plp__sidebar .block-categories .title_block {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--arvis-midnight, #111827) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  line-height: 1.2 !important;
  cursor: pointer;
}

.arvis-plp__sidebar .facet .navbar-toggler,
.arvis-plp__sidebar .facet .collapse-icons,
.arvis-plp__sidebar .facet .fa-angle-down,
.arvis-plp__sidebar .facet .fa-angle-up,
.arvis-plp__sidebar .facet [class*="collapse-icon"] {
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 12px !important;
  transition: transform 200ms;
  background: transparent !important;
}

/* Filter list reset */
.arvis-plp__sidebar .facet ul,
.arvis-plp__sidebar .facet-type-checkbox ul,
.arvis-plp__sidebar .block-categories .category-sub-menu,
.arvis-plp__sidebar .collapse > ul,
.arvis-plp__sidebar .block-content > ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block;
}

/* Fara scroll intern (double-scroll, #48) — listele lungi se controleaza din
   ps_facetedsearch (limita "valori afisate" → link "Vezi toate N"), nu cu scroll. */
.arvis-plp__sidebar .facet ul,
.arvis-plp__sidebar .facet .collapse,
.arvis-plp__sidebar .facet-type-checkbox,
.facet ul,
.facet .collapse {
  max-height: none !important;
  overflow: visible !important;
}

/* Filter row (.facet-label) */
.arvis-plp__sidebar .facet li,
.arvis-plp__sidebar .facet-label,
.arvis-plp__sidebar .block-categories li {
  margin: 0 !important;
  padding: 0 !important;
}

.arvis-plp__sidebar .facet label,
.arvis-plp__sidebar .facet-label label,
.arvis-plp__sidebar .facet li > label,
.facet label.facet-label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 0 !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 14px !important;
  color: var(--arvis-midnight, #111827) !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  margin: 0 !important;
  line-height: 1.4 !important;
  transition: color 120ms;
}

/* Linkul textului (text + magnitude) = umple randul, magnitude impins la dreapta */
.facet label.facet-label > a.search-link,
.arvis-plp__sidebar .facet-label a.search-link {
  display: flex !important;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
}

.arvis-plp__sidebar .facet label:hover,
.arvis-plp__sidebar .facet-label label:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Unele facet-uri (ex. Categorii) randeaza textul ca <a> → primeste culoarea de
   link a temei (ember). Il aducem la midnight, hover ember (ca label-urile). */
.arvis-plp__sidebar .facet a:link,
.arvis-plp__sidebar .facet a:visited,
.arvis-plp__sidebar .facet-label a:link,
.arvis-plp__sidebar .facet-label a:visited {
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
}

.arvis-plp__sidebar .facet a:hover,
.arvis-plp__sidebar .facet-label a:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

/* === Custom checkbox PS (.custom-checkbox = input nativ + span.ps-shown-by-js > i.fa-check)
   Scopat pe .facet (NU .arvis-plp__sidebar) ca sa mearga si in drawer-ul mobil.
   Ascundem inputul, span-ul devine casuta Arvis, fortam display (span-ul e
   "ps-shown-by-js" → pe clona mobila JS nu-l afiseaza → era invizibil). === */
.facet .custom-checkbox {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin: 0 !important;
}

/* input nativ peste casuta, invizibil dar clickabil */
.facet .custom-checkbox input[type="checkbox"] {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  cursor: pointer;
  z-index: 1;
}

/* span = casuta vizibila (fortat display, altfel invizibil pe mobil) */
.facet .custom-checkbox > span.ps-shown-by-js,
.facet .custom-checkbox > span:not(.ps-shown-by-js) {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin: 0 !important;
  border: 1.5px solid var(--arvis-slate-soft, #9ca3af);
  border-radius: 5px;
  background: var(--surface);
  flex-shrink: 0;
  transition: background 120ms, border-color 120ms;
}

/* Ascundem iconul fa (nu se randa fiabil) — folosim bifa CSS ::after garantata */
.facet .custom-checkbox .checkbox-checked {
  display: none !important;
}

.facet .custom-checkbox input[type="checkbox"]:checked ~ span {
  background: var(--dark-surface);
  border-color: var(--arvis-midnight, #111827);
}

.facet .custom-checkbox input[type="checkbox"]:checked ~ span::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 9px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.facet .custom-checkbox input[type="checkbox"]:hover ~ span {
  border-color: var(--arvis-midnight, #111827);
}

/* Filter count "(24)" */
.arvis-plp__sidebar .facet .magnitude,
.arvis-plp__sidebar .facet-label .magnitude,
.arvis-plp__sidebar .facet small {
  margin-left: auto;
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  background: transparent !important;
}

/* "Show more" link "Vezi toate N" */
.arvis-plp__sidebar .facet .js-show-more,
.arvis-plp__sidebar .facet .show-more,
.arvis-plp__sidebar .facet a.js-show-more {
  display: inline-block;
  margin-top: 8px;
  padding: 4px 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-ember, #ff5c35) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  transition: color 120ms;
}

.arvis-plp__sidebar .facet .js-show-more:hover {
  color: var(--arvis-ember-hover, #e64a24) !important;
  text-decoration: underline !important;
}

/* Price/range slider — ps_facetedsearch foloseste ui-slider (jQuery UI) */
.arvis-plp__sidebar .ui-slider-horizontal,
.arvis-plp__sidebar .input-slider-container {
  position: relative;
  height: 4px !important;
  background: var(--arvis-line, #e5e7eb) !important;
  border-radius: 2px;
  border: 0 !important;
  margin: 12px 0 16px;
  padding: 0 !important;
}

.arvis-plp__sidebar .ui-slider-range,
.arvis-plp__sidebar .input-slider-progress {
  background: var(--arvis-ember, #ff5c35) !important;
  border: 0 !important;
  border-radius: 2px;
  height: 100% !important;
  position: absolute;
}

.arvis-plp__sidebar .ui-slider-handle,
.arvis-plp__sidebar .input-slider-handle {
  width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  background: var(--surface) !important;
  border: 2px solid var(--arvis-ember, #ff5c35) !important;
  box-shadow: 0 2px 6px rgba(17, 24, 39, 0.15) !important;
  top: -6px !important;
  margin-left: -8px !important;
  cursor: pointer;
  outline: none !important;
}

.arvis-plp__sidebar .ui-slider-handle:hover,
.arvis-plp__sidebar .ui-slider-handle:focus,
.arvis-plp__sidebar .input-slider-handle:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(255, 92, 53, 0.3) !important;
}

/* Slider min/max value labels */
.arvis-plp__sidebar .slider-range-min,
.arvis-plp__sidebar .slider-range-max,
.arvis-plp__sidebar .ui-slider-input,
.arvis-plp__sidebar .price-amount,
.arvis-plp__sidebar p.facet-price-label {
  font-size: 12px !important;
  color: var(--arvis-slate, #6b7280) !important;
  font-weight: 500 !important;
  margin: 0 !important;
}

/* Color swatches (daca exista filter color) */
.arvis-plp__sidebar .facet-type-color li > label,
.arvis-plp__sidebar .facet [data-search-type="color"] label {
  gap: 12px !important;
}

.arvis-plp__sidebar .color,
.arvis-plp__sidebar .facet input[type="checkbox"] + .color {
  width: 20px !important;
  height: 20px !important;
  border-radius: 999px !important;
  display: inline-block !important;
  border: 1px solid rgba(17, 24, 39, 0.1) !important;
  margin: 0 !important;
}

/* === Trust card Midnight (WhatsApp CTA) === */
.arvis-plp__trust-card {
  margin-top: 24px;
  background: var(--dark-surface);
  color: #ffffff;
  border-radius: 20px;
  padding: 20px;
  border: 0;
}

.arvis-plp__trust-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  color: #ffffff;
}

.arvis-plp__trust-title {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 15px;
  font-weight: 700;
  margin: 0;
  color: #ffffff;
  line-height: 1.3;
}

.arvis-plp__trust-text {
  margin: 8px 0 12px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.5;
}

.arvis-plp .arvis-plp__trust-btn,
#wrapper .arvis-plp .arvis-plp__trust-btn {
  display: block;
  width: 100%;
  padding: 10px 16px;
  background: transparent !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: 999px;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  text-decoration: none !important;
  transition: background 150ms, border-color 150ms;
}

.arvis-plp .arvis-plp__trust-btn:hover,
.arvis-plp .arvis-plp__trust-btn:focus {
  background: #25d366 !important;
  border-color: #25d366 !important;
  color: #ffffff !important;
}

/* ===== Drawer header + footer ===== */
/* Default: hidden — apar doar pe mobile cand sidebar e drawer */
.arvis-plp__drawer-header,
.arvis-plp__drawer-footer {
  display: none;
}

.arvis-plp__drawer-body {
  /* No special styling on desktop - just a wrapper */
  display: contents; /* Modern browsers - element nu afecteaza layout */
}

/* ===== Mobile filter trigger button ===== */
/* Default hidden — apare doar pe mobile via media query */
.arvis-plp__filter-trigger {
  display: none;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: var(--surface) !important;
  color: var(--arvis-midnight, #111827) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 999px;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  margin: 0 0 16px;
  width: auto;
  align-self: flex-start;
  text-decoration: none !important;
  transition: border-color 150ms, color 150ms, background 150ms;
}

.arvis-plp__filter-trigger:hover,
.arvis-plp__filter-trigger:focus {
  border-color: var(--arvis-midnight, #111827) !important;
  color: var(--arvis-ember, #ff5c35) !important;
  background: var(--arvis-snow, #f8f9fa) !important;
}

/* ===== Drawer backdrop ===== */
.arvis-plp__drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(17, 24, 39, 0.5);
  z-index: 9990;
  opacity: 0;
  visibility: hidden;
  transition: opacity 250ms ease, visibility 250ms ease;
  cursor: pointer;
}

.arvis-plp__drawer-backdrop.is-visible {
  opacity: 1;
  visibility: visible;
}

/* ===== Mobile drawer (sidebar repurposed) ===== */
@media (max-width: 991px) {
  /* Layout single col pe mobile */
  .arvis-plp__layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  /* Container padding-bottom redus pe mobile (no SEO card spacing needed) */
  .arvis-plp__container {
    padding-bottom: 48px;
  }

  /* === Sidebar devine drawer bottom-sheet pe mobile === */
  .arvis-plp__sidebar {
    display: flex !important;
    flex-direction: column;
    position: fixed !important;
    bottom: 0;
    left: 0;
    right: 0;
    top: auto !important;
    max-width: 100vw;
    width: 100vw;
    max-height: 85vh;
    height: auto;
    z-index: 9991;
    background: var(--surface);
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -8px 32px rgba(17, 24, 39, 0.2);
    transform: translateY(100%);
    transition: transform 300ms cubic-bezier(0.2, 0, 0, 1);
    overflow: hidden;
    padding: 0 !important;
    margin: 0 !important;
  }

  .arvis-plp__sidebar.is-open {
    transform: translateY(0);
  }

  /* Drawer header devine vizibil pe mobile */
  .arvis-plp__sidebar .arvis-plp__drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: var(--arvis-snow, #f8f9fa);
    border-bottom: 1px solid var(--arvis-line-soft, #eef0f3);
    flex-shrink: 0;
  }

  .arvis-plp__sidebar .arvis-plp__drawer-title {
    font-family: "Inter", system-ui, sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: var(--arvis-midnight, #111827);
    margin: 0;
    letter-spacing: -0.01em;
  }

  .arvis-plp__drawer-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--surface);
    color: var(--arvis-midnight, #111827);
    border: 1px solid var(--arvis-line, #e5e7eb);
    border-radius: 999px;
    cursor: pointer;
    padding: 0;
    transition: border-color 150ms, color 150ms;
  }

  .arvis-plp__drawer-close:hover {
    border-color: var(--arvis-midnight, #111827);
    color: var(--arvis-ember, #ff5c35);
  }

  /* Drawer body scrolls */
  .arvis-plp__sidebar .arvis-plp__drawer-body {
    display: block;
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding: 16px 20px;
  }

  /* Filter sidebar card override pe mobile — fara wrapper Snow, full-width */
  .arvis-plp__sidebar #search_filters,
  .arvis-plp__sidebar .block-categories,
  .arvis-plp__sidebar #search_filters_wrapper {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
  }

  /* Forteaza filtrele vizibile in drawer — overrides Warehouse Bootstrap helper
     classes (.hidden-md-down, .d-none.d-lg-block etc.) care le ascundeau pe mobile */
  .arvis-plp__sidebar #search_filters,
  .arvis-plp__sidebar #search_filters_wrapper,
  .arvis-plp__sidebar .block.facets,
  .arvis-plp__sidebar .block-content,
  .arvis-plp__sidebar #search_filters.hidden-md-down,
  .arvis-plp__sidebar #search_filters.hidden-sm-down,
  .arvis-plp__sidebar .hidden-md-down,
  .arvis-plp__sidebar .hidden-sm-down,
  .arvis-plp__sidebar .d-none,
  .arvis-plp__sidebar .d-md-none + #search_filters {
    display: block !important;
  }

  /* Cazuri specifice: facetele individuale pot avea clase responsive */
  .arvis-plp__sidebar .facet,
  .arvis-plp__sidebar .facet-type-checkbox,
  .arvis-plp__sidebar .facet-type-price {
    display: block !important;
  }

  /* Cand #facets_search_wrapper e mutat in drawer body, reset orice positioning native */
  .arvis-plp__sidebar #facets_search_wrapper,
  .arvis-plp__sidebar #facets_search_wrapper > div {
    display: block !important;
    background: transparent !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Ascunde controale native PS mobile (Sterge tot / Da) — avem header X + footer apply */
  .arvis-plp__sidebar #search_filter_controls,
  .arvis-plp__sidebar #search_filter_controls.hidden-md-up,
  .arvis-plp__sidebar .hidden-md-up#search_filter_controls {
    display: none !important;
  }

  /* Block-title pentru fiecare facet (Warehouse foloseste p.block-title.facet-title.h4) */
  .arvis-plp__sidebar .block-title.facet-title,
  .arvis-plp__sidebar .facet > .block-title,
  .arvis-plp__sidebar .facet > p.block-title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-family: "Inter", system-ui, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--arvis-midnight, #111827) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  /* Custom checkbox span Warehouse — reset, folosim CSS-ul nostru pe input */
  .arvis-plp__sidebar .custom-checkbox {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    flex-shrink: 0;
    margin-right: 0 !important;
    width: auto;
  }

  /* Ascunde "ps-shown-by-js" check icon — folosim ::after pe input via CSS-ul nostru */
  .arvis-plp__sidebar .custom-checkbox .ps-shown-by-js {
    display: none !important;
  }

  /* Trust card hidden pe mobile drawer (nu e prioritate aici) */
  .arvis-plp__sidebar .arvis-plp__trust-card {
    margin-top: 24px;
    border-radius: 16px;
  }

  /* Drawer footer apare cu apply button */
  .arvis-plp__sidebar .arvis-plp__drawer-footer {
    display: flex;
    padding: 12px 20px 16px;
    border-top: 1px solid var(--arvis-line-soft, #eef0f3);
    background: var(--surface);
    flex-shrink: 0;
  }

  .arvis-plp__drawer-apply {
    width: 100%;
    padding: 14px 24px;
    background: var(--arvis-ember, #ff5c35) !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 999px;
    font-family: "Inter", system-ui, sans-serif !important;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 150ms, transform 100ms;
  }

  .arvis-plp__drawer-apply:hover,
  .arvis-plp__drawer-apply:focus {
    background: var(--arvis-ember-hover, #e64a24) !important;
    color: #ffffff !important;
  }

  .arvis-plp__drawer-apply:active {
    transform: scale(0.98);
  }

  /* === Filter trigger button visible pe mobile === */
  .arvis-plp__filter-trigger {
    display: inline-flex !important;
  }

  /* Ascunde butoanele native Warehouse pentru drawer (folosim doar al nostru) */
  .search-filters-mobile-toggler,
  .filters-mobile-toggler,
  .search-filters-toggler,
  [class*="filters-toggler"]:not(.arvis-plp__filter-trigger),
  [class*="filter-toggle"]:not(.dropdown-toggle):not(
      .arvis-plp__filter-trigger
    ),
  .products-selection .filter-button,
  .toolbar-filters-toggler,
  button.btn-filter[data-bs-toggle],
  a.btn-filter[data-bs-toggle] {
    display: none !important;
  }
}

/* Body scroll-lock cand drawer e deschis (fallback la JS overflow=hidden) */
body:has(.arvis-plp__sidebar.is-open) {
  overflow: hidden;
}

/* === Main column === */
.arvis-plp__main {
  min-width: 0;
}

/* === Toolbar (top) — products count + sort + view ===
   Structura Warehouse 4.8.2 (verificata via DOM inspect):
     .arvis-plp .products-selection (wrapper outer, sets bg pill)
       .products-selection (inner)
         .row.align-items-center.justify-content-between.small-gutters
           .col.col-auto.facated-toggler (empty on desktop → hidden)
           .col.view-switcher (grid/list icons → hidden, design grid-only)
           .col.col-auto (showing + sort dropdown + items per page dropdown)
   Cu primele 2 cols hidden, ramane doar ultimul col. Stilizam pentru a distribui
   showing-ul stanga si dropdowns dreapta cu margin-right:auto pe showing. */

.arvis-plp .products-selection {
  margin-bottom: 24px;
  background: var(--surface);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 16px;
  padding: 14px 18px;
  /* Sticky pe desktop: ramane vizibil cand scroll-uiesti grid-ul.
     Top: 0 — overlap cu header sticky se gestioneaza prin z-index. */
  position: sticky;
  top: 0;
  z-index: 50;
  /* Box-shadow subtle pentru "lift" cand sticky activeaza */
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
}

/* Pe mobile dezactivam sticky — toolbar compact, nu e nevoie */
@media (max-width: 991px) {
  .arvis-plp .products-selection {
    position: static;
    box-shadow: none;
  }

  /* Stop "piramida": fiecare col al toolbar-ului ocupa tot randul (stivuit) */
  .arvis-plp .products-selection > .row > .col,
  .arvis-plp .products-selection > .row > [class*="col-"] {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  /* Ultimul col (sort + nr/pagina): dropdown-urile umplu latimea egal */
  .arvis-plp .products-selection > .row > .col:last-child,
  .arvis-plp .products-selection > .row > [class*="col-"]:last-child {
    display: flex !important;
    align-items: center;
    gap: 10px;
  }

  .arvis-plp .products-selection > .row > .col:last-child > *,
  .arvis-plp .products-selection > .row > [class*="col-"]:last-child > * {
    flex: 1 1 0;
    min-width: 0;
  }

  /* Ascundem col-urile goale care faceau toolbar-ul inalt pe mobil:
     - .facated-toggler = butonul Filtre IQIT (redundant, avem propriul trigger separat)
     - .view-switcher = grid/list (design e doar grid) */
  .arvis-plp .products-selection .facated-toggler,
  .arvis-plp .products-selection .view-switcher {
    display: none !important;
  }
}

/* Bootstrap .row — distribui content
   Dupa fix-ul de duplicate id, .products-selection e wrapper-ul direct
   randat de products-top.tpl. Stilizam .row interior direct. */
.arvis-plp .products-selection > .row,
.arvis-plp .products-selection .row {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin: 0 !important;
  width: 100%;
}

/* Bootstrap .col — reset paddings, lasa width sa fie auto din continut */
.arvis-plp .products-selection .col,
.arvis-plp .products-selection .col-auto,
.arvis-plp .products-selection [class*="col-"] {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Ultimul .col (cel cu showing + dropdowns) trebuie sa ia toata latimea
   ramasa si sa distribuie continutul intern */
.arvis-plp .products-selection .col.col-auto:last-child {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 1 1 auto !important;
  width: auto !important;
  flex-wrap: wrap;
}

/* Showing text "Se afiseaza X-Y din N produs(e)" — push la stanga */
.arvis-plp .products-selection .showing,
.arvis-plp .products-selection .col .showing {
  margin-right: auto !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 13px !important;
  color: var(--arvis-slate, #6b7280) !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  white-space: nowrap;
}

/* Pe mobile ascund "showing" — economisim spatiu */
@media (max-width: 575px) {
  .arvis-plp .products-selection .showing.hidden-sm-down {
    display: none !important;
  }
}

/* Total items display */
.arvis-plp .products-selection .total-products,
.arvis-plp .products-selection .product-count,
.arvis-plp .products-selection p.total-products {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
}

.arvis-plp .products-selection .total-products strong,
.arvis-plp .products-selection .total-products b {
  color: var(--arvis-midnight, #111827);
  font-weight: 700;
}

/* Sort + Items per page toggle buttons — pill rounded.
   IMPORTANT: toggle-ul are clasa Bootstrap .form-control care impune width:100% —
   overridem cu width:auto. Texte "Relevanta" / "22" / etc trebuie sa fie pe o linie. */
.arvis-plp .products-sort-order,
.arvis-plp .products-sort-nb-dropdown,
.arvis-plp .products-nb-per-page,
.arvis-plp .products-sort-row,
.arvis-plp .sort-by-row {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px;
  width: auto !important;
  flex: 0 0 auto !important;
}

/* Label "Sortează:" sau prefix */
.arvis-plp .products-sort-order > .select-title-wrapper,
.arvis-plp .sort-by-row > span:first-child {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

/* Toggle button (pill) — sort + items per page */
.arvis-plp .products-sort-order .select-title,
.arvis-plp .products-sort-order .dropdown-toggle,
.arvis-plp .products-sort-order > a.form-control,
.arvis-plp .products-sort-nb-dropdown.products-sort-order .select-title,
.arvis-plp .products-sort-nb-dropdown.products-nb-per-page .select-title,
.arvis-plp .products-sort-nb-dropdown > a.form-control,
.arvis-plp .products-nb-per-page .select-title,
.arvis-plp .products-nb-per-page > a.form-control,
.arvis-plp a.select-title.form-control,
.arvis-plp .show-row .select-title,
.arvis-plp .sort-by-row .select-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  background: var(--surface) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 999px !important;
  padding: 8px 14px !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--arvis-midnight, #111827) !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: pointer;
  transition: border-color 150ms, color 150ms;
}

.arvis-plp .products-sort-order .select-title:hover,
.arvis-plp .products-sort-order .dropdown-toggle:hover,
.arvis-plp .products-sort-nb-dropdown .select-title:hover,
.arvis-plp .products-nb-per-page .select-title:hover,
.arvis-plp a.select-title.form-control:hover,
.arvis-plp .products-sort-order .select-title:focus,
.arvis-plp .products-sort-nb-dropdown .select-title:focus,
.arvis-plp .products-nb-per-page .select-title:focus {
  border-color: var(--arvis-midnight, #111827) !important;
  color: var(--arvis-midnight, #111827) !important;
  background: var(--surface) !important;
}

.arvis-plp .products-sort-order .select-title[aria-expanded="true"],
.arvis-plp .products-sort-nb-dropdown .select-title[aria-expanded="true"],
.arvis-plp .products-nb-per-page .select-title[aria-expanded="true"] {
  border-color: var(--arvis-ember, #ff5c35) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Chevron icon din toggle */
.arvis-plp .products-sort-order .select-title .fa-angle-down,
.arvis-plp .products-sort-nb-dropdown .select-title .fa-angle-down,
.arvis-plp .products-nb-per-page .select-title .fa-angle-down,
.arvis-plp .select-title > i.fa {
  color: inherit !important;
  font-size: 11px !important;
  margin-left: 2px;
  transition: transform 200ms;
}

.arvis-plp .select-title[aria-expanded="true"] > i.fa-angle-down {
  transform: rotate(180deg);
}

/* Min-width consistent pentru sort dropdown → layout stabil cand schimbi sortarea
   (Relevanta scurt vs "Nume - crescator" lung n-ar mai trebui sa modifice layoutul) */
.arvis-plp .products-sort-order .select-title,
.arvis-plp .products-sort-nb-dropdown.products-sort-order .select-title {
  min-width: 160px !important;
  max-width: 240px;
  justify-content: space-between !important;
}

/* Text "Nume - crescator" — truncate cu ellipsis daca depaseste max-width */
.arvis-plp .products-sort-order .select-title-name,
.arvis-plp .select-title-name {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  flex: 1 1 auto;
  min-width: 0;
}

/* Items per page e mereu mic (12 / 22 / 36) — min-width mai mic */
.arvis-plp .products-nb-per-page .select-title,
.arvis-plp .products-sort-nb-dropdown.products-nb-per-page .select-title {
  min-width: 60px !important;
  justify-content: space-between !important;
}

/* ULTRA-OVERRIDE pe culorile linkurilor din toolbar — overrideze IQIT global rules.
   Trick: reset --bs-link-color variabila pe contextul dropdown-menu. */
.arvis-plp .products-selection .dropdown-menu {
  --bs-link-color: var(--arvis-midnight, #111827);
  --bs-link-hover-color: var(--arvis-ember, #ff5c35);
}

/* Plus specificity directa pe a.js-search-link (clasa universal in PS layered nav) */
.arvis-plp .dropdown-menu a.js-search-link,
.arvis-plp .dropdown-menu a.select-list,
.arvis-plp .dropdown-menu a.dropdown-item,
body .arvis-plp .products-selection .dropdown-menu a {
  color: var(--arvis-midnight, #111827) !important;
}

.arvis-plp .dropdown-menu a.js-search-link.current,
.arvis-plp .dropdown-menu a.select-list.current,
.arvis-plp .dropdown-menu a.dropdown-item.active,
body .arvis-plp .products-selection .dropdown-menu a.current {
  color: var(--arvis-ember-darker, #cc4827) !important;
  background: var(--arvis-ember-soft, #fff3f0) !important;
  font-weight: 600 !important;
}

.arvis-plp .dropdown-menu a.js-search-link:hover,
.arvis-plp .dropdown-menu a.select-list:hover,
.arvis-plp .dropdown-menu a.dropdown-item:hover,
body .arvis-plp .products-selection .dropdown-menu a:hover {
  color: var(--arvis-ember, #ff5c35) !important;
  background: var(--arvis-snow, #f8f9fa) !important;
}

/* Dropdown menu (sort + items per page) — bg alb, border subtle, shadow elev */
.arvis-plp .products-selection .dropdown-menu,
.arvis-plp .dropdown-menu.dropdown-menu-products,
body.arvis-category .dropdown-menu {
  background: var(--surface) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(17, 24, 39, 0.12) !important;
  padding: 6px !important;
  min-width: 200px !important;
  margin-top: 4px !important;
}

/* Items default: Midnight text — override IQIT default Ember pe items.
   IMPORTANT: width:100% + box-sizing:border-box pentru ca bg-ul highlighted
   sa ajunga corect la marginea dreapta a meniului. */
.arvis-plp .products-selection .dropdown-menu .select-list,
.arvis-plp .products-selection .dropdown-menu .dropdown-item,
.arvis-plp .products-selection .dropdown-menu a,
.arvis-plp .products-selection .dropdown-menu li > a,
.arvis-plp .products-selection .dropdown-menu li > button,
.arvis-plp .products-sort-order .dropdown-menu a,
.arvis-plp .products-sort-order .dropdown-menu .select-list,
.arvis-plp .show-row .dropdown-menu a,
.arvis-plp .show-row .dropdown-menu .select-list,
#main .arvis-plp .dropdown-menu .select-list,
#main .arvis-plp .dropdown-menu a {
  display: block !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 13px !important;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  text-align: left !important;
  margin: 0 !important;
  transition: background 120ms, color 120ms;
}

.arvis-plp .products-selection .dropdown-menu .select-list:hover,
.arvis-plp .products-selection .dropdown-menu .select-list:focus,
.arvis-plp .products-selection .dropdown-menu .dropdown-item:hover,
.arvis-plp .products-selection .dropdown-menu .dropdown-item:focus,
.arvis-plp .products-selection .dropdown-menu a:hover,
.arvis-plp .products-selection .dropdown-menu a:focus,
.arvis-plp .products-sort-order .dropdown-menu a:hover,
.arvis-plp .show-row .dropdown-menu a:hover,
#main .arvis-plp .dropdown-menu .select-list:hover,
#main .arvis-plp .dropdown-menu a:hover {
  background: var(--arvis-snow, #f8f9fa) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Active item (selected sort/items per page) - aici e Ember bold */
.arvis-plp .products-selection .dropdown-menu .select-list.current,
.arvis-plp .products-selection .dropdown-menu .dropdown-item.active,
.arvis-plp .products-selection .dropdown-menu a.current,
.arvis-plp .products-selection .dropdown-menu a.active {
  background: var(--arvis-ember-soft, #fff3f0) !important;
  color: var(--arvis-ember-darker, #cc4827) !important;
  font-weight: 600 !important;
}

/* Force default color Midnight pe items care NU sunt current/active.
   Acopera regulile IQIT cu specificity mai mare prin :not() + multi-class chain. */
.arvis-plp
  .products-selection
  .products-sort-nb-dropdown
  .dropdown-menu
  a.js-search-link:not(.current):not(.active),
.arvis-plp
  .products-selection
  .products-sort-nb-dropdown
  .dropdown-menu
  a.select-list:not(.current):not(.active),
.arvis-plp
  .products-selection
  .products-sort-nb-dropdown
  .dropdown-menu
  .dropdown-item:not(.current):not(.active),
.arvis-plp
  .products-selection
  .products-sort-order
  .dropdown-menu
  a.js-search-link:not(.current):not(.active),
.arvis-plp
  .products-selection
  .products-nb-per-page
  .dropdown-menu
  a.js-search-link:not(.current):not(.active) {
  color: var(--arvis-midnight, #111827) !important;
  background: transparent !important;
}

.arvis-plp
  .products-selection
  .products-sort-nb-dropdown
  .dropdown-menu
  a.js-search-link:not(.current):not(.active):hover,
.arvis-plp
  .products-selection
  .products-sort-nb-dropdown
  .dropdown-menu
  a.select-list:not(.current):not(.active):hover,
.arvis-plp
  .products-selection
  .products-sort-nb-dropdown
  .dropdown-menu
  .dropdown-item:not(.current):not(.active):hover,
.arvis-plp
  .products-selection
  .products-sort-order
  .dropdown-menu
  a.js-search-link:not(.current):not(.active):hover,
.arvis-plp
  .products-selection
  .products-nb-per-page
  .dropdown-menu
  a.js-search-link:not(.current):not(.active):hover {
  background: var(--arvis-snow, #f8f9fa) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Hide grid/list view toggle — design e grid only. Selectorul real in Warehouse 4.8.2: .view-switcher */
.arvis-plp .view-switcher,
.arvis-plp .products-selection .view-switcher,
.arvis-plp .display,
.arvis-plp .products-selection .display,
.arvis-plp .products-selection .view-switch,
.arvis-plp .products-selection .product-list-display,
.arvis-plp .products-selection .display-mode,
.arvis-plp .products-selection .products-view-mode,
.arvis-plp .products-selection [id*="product-list-toggle"],
.arvis-plp .products-selection [class*="display-mode"],
.arvis-plp .products-selection [class*="view-mode"]:not(.products-nb-per-page),
.arvis-plp .products-selection .display-grid,
.arvis-plp .products-selection .display-list,
.arvis-plp .products-selection button.display-grid,
.arvis-plp .products-selection button.display-list,
.arvis-plp .products-selection .col-display-mode,
.arvis-plp .products-selection .products-list-mode {
  display: none !important;
}

/* Hide empty .facated-toggler col (Warehouse il randa gol pe desktop) */
.arvis-plp .facated-toggler:empty,
.arvis-plp .products-selection .facated-toggler:empty {
  display: none !important;
}

/* === Active filter chips (ps_facetedsearch native render) ===
   Modulul ps_facetedsearch randa active filters intr-un <ul class="js-active-search-filters">
   inserat in products-top sau in pagina. Le stilizam ca chips soft Ember conform design. */
.arvis-plp .active_filters,
.arvis-plp .js-active-search-filters,
.arvis-plp ul.js-active-search-filters {
  list-style: none !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 8px; /* row-gap mai mare (12px) intre randurile de chips, col-gap 8px */
}

.arvis-plp .active_filters .active-filter-title,
.arvis-plp .js-active-search-filters .active-filter-title {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  font-weight: 500;
  margin: 0 4px 0 0;
}

.arvis-plp .active_filters .filter-block,
.arvis-plp .js-active-search-filters .filter-block,
.arvis-plp .active_filters > li,
.arvis-plp .js-active-search-filters > li {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
}

.arvis-plp .active_filters .filter-block a,
.arvis-plp .js-active-search-filters .filter-block a,
.arvis-plp .js-active-search-filters > li > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 12px !important;
  background: var(--arvis-ember-soft, #fff3f0) !important;
  color: var(--arvis-ember-darker, #cc4827) !important;
  border: 1px solid rgba(255, 92, 53, 0.2) !important;
  border-radius: 999px !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  transition: background 150ms, color 150ms, border-color 150ms;
}

.arvis-plp .active_filters .filter-block a:hover,
.arvis-plp .js-active-search-filters .filter-block a:hover,
.arvis-plp .js-active-search-filters > li > a:hover {
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border-color: var(--arvis-ember, #ff5c35) !important;
}

/* Iconita X close din active filter chip */
.arvis-plp .active_filters .close,
.arvis-plp .js-active-search-filters .close,
.arvis-plp .active_filters .material-icons,
.arvis-plp .js-active-search-filters .material-icons,
.arvis-plp .js-active-search-filters .fa-times {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  font-size: 14px !important;
  line-height: 1 !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0.7;
}

/* Fallback daca Material Icons font lipseste si textul "close" apare brut */
.arvis-plp .js-active-search-filters .material-icons::before {
  content: "×";
  font-size: 16px;
  font-family: -apple-system, system-ui, sans-serif;
  font-weight: bold;
}

.arvis-plp .js-active-search-filters .material-icons:not(:empty) {
  font-size: 0 !important;
}

.arvis-plp .active_filters .filter-block a:hover .close,
.arvis-plp .js-active-search-filters > li > a:hover .close {
  opacity: 1;
}

/* "Clear all" link */
.arvis-plp .active_filters .js-search-link,
.arvis-plp .js-active-search-filters + a,
.arvis-plp a.js-search-link {
  display: inline-flex;
  align-items: center;
  padding: 6px 0;
  font-size: 13px;
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
  text-decoration: none !important;
  border: 0 !important;
  background: transparent !important;
  margin-left: 4px;
}

.arvis-plp .active_filters .js-search-link:hover,
.arvis-plp .js-active-search-filters + a:hover,
.arvis-plp a.js-search-link:hover {
  color: var(--arvis-ember-hover, #e64a24) !important;
  text-decoration: underline !important;
}

/* Wrapper Arvis pentru filtrele active randate in products-top (override) */
.arvis-plp__active-filters {
  width: 100%;
}

/* Ascuns cand nu exista filtre active. ps randeaza structura goala (ul fara <li>)
   chiar si fara filtre → :empty nu prinde; folosim :has (no chip = ascuns). */
.arvis-plp__active-filters:empty,
.arvis-plp__active-filters:not(:has(li)):not(:has(.filter-block)) {
  display: none !important;
}

/* === Listing grid === */
.arvis-plp__listing {
  margin: 0;
}

/* Force grid layout pe wrapper-ul de produse */
.arvis-plp__listing > .row,
.arvis-plp__listing > .js-product-list,
.arvis-plp__listing > .products,
.arvis-plp__listing .products.row,
.arvis-plp__listing .products-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 0 !important;
}

/* Reset Bootstrap col widths in product list */
.arvis-plp__listing .products [class*="col-"],
.arvis-plp__listing .row > [class*="col-"] {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Tablet 2 columns */
@media (max-width: 991px) and (min-width: 576px) {
  .arvis-plp__listing > .row,
  .arvis-plp__listing > .js-product-list,
  .arvis-plp__listing > .products,
  .arvis-plp__listing .products.row,
  .arvis-plp__listing .products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
}

/* Mobile 2 columns compact */
@media (max-width: 575px) {
  .arvis-plp__listing > .row,
  .arvis-plp__listing > .js-product-list,
  .arvis-plp__listing > .products,
  .arvis-plp__listing .products.row,
  .arvis-plp__listing .products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .arvis-plp .products-selection > div,
  .arvis-plp .products-selection .row {
    padding: 10px 12px;
    gap: 8px;
  }

  .arvis-plp .products-selection .products-sort-order .dropdown-toggle {
    font-size: 12px !important;
    padding: 6px 10px !important;
  }
}

/* === Pagination wrapper (legacy class, deprecated dupa fix-ul de id duplicat) === */
.arvis-plp__pagination-wrap {
  /* Pastrat pentru compat — stilurile au fost mutate pe .arvis-plp__pagination */
}

/* === Pagination — custom Arvis (Faza 4) ===
   Spacing + border-top sunt pe element direct, nu pe wrapper outer (pentru AJAX safety). */
.arvis-plp__pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin: 40px 0 0;
  padding: 24px 0 0;
  border-top: 1px solid var(--arvis-line-soft, #eef0f3);
}

.arvis-plp__pagination-info {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
}

.arvis-plp__pagination-info strong {
  color: var(--arvis-midnight, #111827);
  font-weight: 700;
}

.arvis-plp__pagination-list {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.arvis-plp__pagination-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
}

/* Page buttons (numere + prev/next) */
.arvis-plp .arvis-plp__pagination-btn,
#main .arvis-plp .arvis-plp__pagination-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 36px !important;
  height: 36px !important;
  padding: 0 10px !important;
  background: transparent !important;
  color: var(--arvis-midnight, #111827) !important;
  border: 0 !important;
  border-radius: 10px !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 150ms, color 150ms, transform 100ms;
  line-height: 1;
}

.arvis-plp .arvis-plp__pagination-btn:hover,
.arvis-plp .arvis-plp__pagination-btn:focus,
#main .arvis-plp .arvis-plp__pagination-btn:hover {
  background: var(--arvis-snow, #f8f9fa) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-plp .arvis-plp__pagination-btn:active {
  transform: scale(0.96);
}

/* Current page state (Ember filled pill) */
.arvis-plp .arvis-plp__pagination-btn--current,
.arvis-plp .arvis-plp__pagination-item--current .arvis-plp__pagination-btn,
#main .arvis-plp .arvis-plp__pagination-btn--current {
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  cursor: default;
}

.arvis-plp
  .arvis-plp__pagination-item--current
  .arvis-plp__pagination-btn:hover {
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
}

/* Icon buttons (prev/next) */
.arvis-plp__pagination-btn--icon {
  padding: 0 !important;
  width: 36px !important;
}

.arvis-plp__pagination-btn--icon svg {
  display: block;
}

/* Disabled prev/next */
.arvis-plp__pagination-item--disabled .arvis-plp__pagination-btn {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}

/* Spacer "..." */
.arvis-plp__pagination-item--spacer {
  padding: 0 4px;
  color: var(--arvis-slate, #6b7280);
  font-size: 14px;
  font-weight: 600;
  user-select: none;
}

/* Mobile: stack vertical, center align */
@media (max-width: 575px) {
  .arvis-plp__pagination {
    flex-direction: column;
    gap: 16px;
    justify-content: center;
  }

  .arvis-plp__pagination-info {
    text-align: center;
    order: 2;
  }

  .arvis-plp__pagination-list {
    order: 1;
  }

  .arvis-plp .arvis-plp__pagination-btn {
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 8px !important;
    font-size: 12px !important;
  }

  .arvis-plp__pagination-btn--icon {
    width: 32px !important;
  }
}

/* Ascunde paginarea native Warehouse veche daca apare in paralel cu noua noastra */
.arvis-plp__main .pagination:not(.arvis-plp__pagination),
.arvis-plp__main nav.pagination:not(.arvis-plp__pagination) {
  /* fallback — daca cumva native pagination apare separat, n-o ascund explicit
     dar adaug margin sa nu apara dublu */
  margin-top: 0;
}

/* Empty state container */
.arvis-plp__empty {
  background: var(--arvis-snow, #f8f9fa);
  border-radius: 20px;
  padding: 64px 32px;
  text-align: center;
}

@media (max-width: 575px) {
  .arvis-plp__empty {
    padding: 40px 20px;
  }
}

/* === SEO long content card (jos pagina) === */
.arvis-plp__seo {
  margin-top: 48px;
}

.arvis-plp__seo-card {
  background: var(--arvis-snow, #f8f9fa);
  border-radius: 24px;
  padding: 40px;
}

.arvis-plp__seo-content {
  max-width: 960px;
  margin: 0 auto;
  font-family: "Inter", system-ui, sans-serif;
  color: var(--arvis-slate, #6b7280);
  font-size: 15px;
  line-height: 1.7;
}

/* Tipografie pentru continut HTML din BO (category description) */
.arvis-plp__seo-content h1,
.arvis-plp__seo-content h2 {
  font-size: 28px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin: 0 0 16px;
}

.arvis-plp__seo-content h3 {
  font-size: 20px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin: 32px 0 12px;
  line-height: 1.3;
}

.arvis-plp__seo-content h4,
.arvis-plp__seo-content h5,
.arvis-plp__seo-content h6 {
  font-size: 16px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin: 24px 0 8px;
  line-height: 1.3;
}

.arvis-plp__seo-content p {
  margin: 0 0 16px;
}

.arvis-plp__seo-content p:last-child {
  margin-bottom: 0;
}

.arvis-plp__seo-content strong,
.arvis-plp__seo-content b {
  color: var(--arvis-midnight, #111827);
  font-weight: 600;
}

.arvis-plp .arvis-plp__seo-content a {
  color: var(--arvis-ember, #ff5c35) !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  transition: color 150ms;
}

.arvis-plp .arvis-plp__seo-content a:hover,
.arvis-plp .arvis-plp__seo-content a:focus {
  color: var(--arvis-ember-hover, #e64a24) !important;
}

/* Liste: bullet point Ember pentru "tips" cards style */
.arvis-plp__seo-content ul,
.arvis-plp__seo-content ol {
  margin: 0 0 16px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  list-style: none;
}

.arvis-plp__seo-content ul li,
.arvis-plp__seo-content ol li {
  padding: 16px 20px;
  background: var(--surface);
  border-radius: 14px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--arvis-slate, #6b7280);
}

.arvis-plp__seo-content ul li strong:first-child,
.arvis-plp__seo-content ol li strong:first-child {
  display: block;
  color: var(--arvis-midnight, #111827);
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 6px;
}

/* Tabel — pentru cazuri rare cand cineva pune tabel in descriere */
.arvis-plp__seo-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  background: var(--surface);
  border-radius: 14px;
  overflow: hidden;
}

.arvis-plp__seo-content th,
.arvis-plp__seo-content td {
  padding: 12px 16px;
  text-align: left;
  border-bottom: 1px solid var(--arvis-line-soft, #eef0f3);
  font-size: 14px;
}

.arvis-plp__seo-content th {
  background: var(--arvis-snow, #f8f9fa);
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 12px;
}

/* Quote / blockquote */
.arvis-plp__seo-content blockquote {
  margin: 24px 0;
  padding: 16px 24px;
  border-left: 3px solid var(--arvis-ember, #ff5c35);
  background: var(--surface);
  border-radius: 8px;
  font-style: italic;
  color: var(--arvis-midnight, #111827);
}

/* Mobile adjustments */
@media (max-width: 991px) {
  .arvis-plp__seo-card {
    padding: 24px;
  }

  .arvis-plp__seo-content {
    font-size: 14px;
  }

  .arvis-plp__seo-content h1,
  .arvis-plp__seo-content h2 {
    font-size: 24px;
  }

  .arvis-plp__seo-content ul,
  .arvis-plp__seo-content ol {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .arvis-plp__seo {
    margin-top: 32px;
  }
}

/* ============================================================================
   ARVIS SEARCH AUTOCOMPLETE — Etapa 4 Faza 5
   ============================================================================
   IQIT iqitsearch randa sugestii intr-un `.autocomplete-suggestions` div.
   Inside items pot avea diverse class names; targetam defensiv multiple patterns.
   Sursa design: pattern PDP/category search box (autocomplete bottom). */

/* Wrapper sugestii — dropdown panel */
#search_widget .autocomplete-suggestions,
.search-widget .autocomplete-suggestions {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 540px;
  background: var(--surface) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 32px rgba(17, 24, 39, 0.15) !important;
  padding: 8px !important;
  margin: 0 !important;
  max-height: 480px;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 9000;
}

/* Hide when empty (no suggestions) */
#search_widget .autocomplete-suggestions:empty {
  display: none !important;
}

/* Scrollbar styling */
#search_widget .autocomplete-suggestions::-webkit-scrollbar {
  width: 6px;
}

#search_widget .autocomplete-suggestions::-webkit-scrollbar-thumb {
  background: var(--arvis-line, #e5e7eb);
  border-radius: 999px;
}

/* === Suggestion items (multiple naming patterns IQIT) === */
#search_widget .autocomplete-suggestion,
#search_widget .autocomplete-suggestions a,
#search_widget .autocomplete-suggestions > div > a,
.search-widget .autocomplete-suggestion {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 120ms;
  border: 0;
  font-family: "Inter", system-ui, sans-serif !important;
}

#search_widget .autocomplete-suggestion:hover,
#search_widget .autocomplete-suggestion:focus,
#search_widget .autocomplete-suggestion.selected,
#search_widget .autocomplete-suggestions a:hover,
#search_widget .autocomplete-suggestions a:focus,
.search-widget .autocomplete-suggestion:hover {
  background: var(--arvis-snow, #f8f9fa) !important;
  color: var(--arvis-midnight, #111827) !important;
}

/* Thumbnail image */
#search_widget .autocomplete-suggestion img,
#search_widget .autocomplete-suggestions img,
.search-widget .autocomplete-suggestion img {
  width: 44px !important;
  height: 44px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  flex-shrink: 0 !important;
  background: var(--arvis-snow, #f8f9fa);
}

/* Suggestion text content wrapper */
#search_widget .autocomplete-suggestion-text,
#search_widget .autocomplete-suggestion > div:not(.autocomplete-thumbnail),
#search_widget .autocomplete-suggestion > span:last-child {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

/* Product name in suggestion */
#search_widget .autocomplete-suggestion .product-name,
#search_widget .autocomplete-suggestion .suggestion-name,
#search_widget .autocomplete-suggestion .name,
#search_widget .autocomplete-suggestion strong,
#search_widget .autocomplete-suggestion h6,
.search-widget .autocomplete-suggestion strong {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--arvis-midnight, #111827) !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Brand label (small uppercase Slate) */
#search_widget .autocomplete-suggestion .brand,
#search_widget .autocomplete-suggestion .manufacturer,
#search_widget .autocomplete-suggestion .category,
#search_widget .autocomplete-suggestion small {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: var(--arvis-slate, #6b7280) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0 !important;
  line-height: 1.2 !important;
}

/* Price */
#search_widget .autocomplete-suggestion .price,
#search_widget .autocomplete-suggestion .product-price,
#search_widget .autocomplete-suggestion .amount,
.search-widget .autocomplete-suggestion .price {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--arvis-midnight, #111827) !important;
  margin-left: auto !important;
  white-space: nowrap;
  flex-shrink: 0 !important;
}

/* Highlighted search term inside suggestion */
#search_widget .autocomplete-suggestion strong em,
#search_widget .autocomplete-suggestion .highlight,
#search_widget .autocomplete-suggestion mark {
  background: var(--arvis-ember-soft, #fff3f0) !important;
  color: var(--arvis-ember-darker, #cc4827) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  padding: 0 2px;
  border-radius: 3px;
}

/* Group/category headers */
#search_widget .autocomplete-suggestion-category,
#search_widget .autocomplete-group-title,
#search_widget .autocomplete-suggestions .group-header,
.search-widget .autocomplete-group {
  padding: 12px 12px 6px !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--arvis-ember, #ff5c35) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  border-top: 1px solid var(--arvis-line-soft, #eef0f3) !important;
  margin-top: 4px;
  pointer-events: none;
  background: transparent !important;
  cursor: default;
}

#search_widget .autocomplete-suggestion-category:first-child,
#search_widget .autocomplete-group-title:first-child {
  border-top: 0 !important;
  margin-top: 0;
}

/* "See all results" link bottom */
#search_widget .autocomplete-see-all,
#search_widget .see-all-results,
.search-widget .autocomplete-see-all {
  display: block !important;
  padding: 10px 12px !important;
  margin-top: 4px;
  border-top: 1px solid var(--arvis-line-soft, #eef0f3);
  border-radius: 0 0 8px 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--arvis-ember, #ff5c35) !important;
  text-align: center;
  text-decoration: none !important;
}

#search_widget .autocomplete-see-all:hover,
#search_widget .see-all-results:hover {
  background: var(--arvis-snow, #f8f9fa) !important;
  color: var(--arvis-ember-darker, #cc4827) !important;
}

/* Mobile: full-width takeover when search focused — Faza 5.3 */
@media (max-width: 767px) {
  /* Body class adaugat de JS la focus pe search */
  body.arvis-search-active {
    overflow: hidden;
  }

  body.arvis-search-active::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(17, 24, 39, 0.5);
    z-index: 8000;
    cursor: pointer;
  }

  body.arvis-search-active #search_widget {
    position: fixed !important;
    top: 12px !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
    z-index: 9001 !important;
  }

  body.arvis-search-active #search_widget .input-group {
    box-shadow: 0 4px 16px rgba(17, 24, 39, 0.2) !important;
  }

  body.arvis-search-active #search_widget .autocomplete-suggestions {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    max-height: calc(100vh - 100px);
    width: auto !important;
    max-width: none !important;
  }
}

/* ==========================================================================
   ICON UNIFIED — Add to cart (PDP main + PDP sticky + PLP card)
   ==========================================================================
   Definitie unica a iconitei "shopping bag" folosita peste tot. Schimbi SVG-ul
   ramplasand un singur data URI mai jos, se aplica everywhere.
   Folosim mask-image ca sa pastram color din currentColor (mosteneste color
   din butonul parinte — alb pe Ember, etc).
*/

.arvis-icon-cart {
  display: inline-block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 4a5 5 0 0 1 10 0v2h3a1 1 0 0 1 1 1l-.5 13a2 2 0 0 1-2 1.91H5.5a2 2 0 0 1-2-1.91L3 7a1 1 0 0 1 1-1h3V4zm2 2h6V4a3 3 0 1 0-6 0v2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 4a5 5 0 0 1 10 0v2h3a1 1 0 0 1 1 1l-.5 13a2 2 0 0 1-2 1.91H5.5a2 2 0 0 1-2-1.91L3 7a1 1 0 0 1 1-1h3V4zm2 2h6V4a3 3 0 1 0-6 0v2z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
}

/* PLP card "Adauga" button — hide existing icon Warehouse + inject our icon
   via ::before. Asa nu trebuie sa override-uim product-miniature-btn.tpl. */
.arvis-pc__cta .btn .fa,
.arvis-pc__cta .btn .material-icons,
.arvis-pc__cta .btn svg,
.product-miniature-layout-1 .product-list-actions .btn .fa,
.product-miniature-layout-1 .product-list-actions .btn .material-icons,
.product-miniature-layout-1 .product-list-actions .btn svg,
.product-miniature-layout-1 .product-add-cart .btn .fa,
.product-miniature-layout-1 .product-add-cart .btn .material-icons,
.product-miniature-layout-1 .product-add-cart .btn svg {
  display: none !important;
}

.arvis-pc__cta .btn::before,
.product-miniature-layout-1 .product-list-actions .btn::before,
.product-miniature-layout-1 .product-add-cart .btn::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 4a5 5 0 0 1 10 0v2h3a1 1 0 0 1 1 1l-.5 13a2 2 0 0 1-2 1.91H5.5a2 2 0 0 1-2-1.91L3 7a1 1 0 0 1 1-1h3V4zm2 2h6V4a3 3 0 1 0-6 0v2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 4a5 5 0 0 1 10 0v2h3a1 1 0 0 1 1 1l-.5 13a2 2 0 0 1-2 1.91H5.5a2 2 0 0 1-2-1.91L3 7a1 1 0 0 1 1-1h3V4zm2 2h6V4a3 3 0 1 0-6 0v2z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
}

/* ==========================================================================
   CART PAGE (Etapa 7.2 Faza 1) — design pages-buy.jsx
   ==========================================================================
   Selectori cu prefix .arvis-cart__ ca sa nu colidam cu Warehouse parent.
   Toate var(--arvis-*) au fallback static.
*/

.arvis-cart {
  background: var(--page-bg, #f8f9fa);
  padding-bottom: 64px;
}

/* === Hero === */

.arvis-cart__hero {
  background: var(--page-bg, #f8f9fa);
  padding: 16px 0 8px;
}

@media (min-width: 768px) {
  .arvis-cart__hero {
    padding: 32px 0 8px;
  }
}

.arvis-cart__hero-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-top: 16px;
  flex-wrap: wrap;
  gap: 16px;
}

.arvis-cart__title {
  font: inherit;
  margin: 0;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--arvis-midnight, #111827);
}

@media (min-width: 768px) {
  .arvis-cart__title {
    font-size: 44px;
  }
}

.arvis-cart__hero-count {
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-cart__hero-count strong {
  color: var(--arvis-midnight, #111827);
}

/* === Stepper === */

.arvis-cart__stepper {
  padding: 20px 0;
  background: var(--surface-container, #f8f9fa);
  margin-top: 16px;
  display: none;
}

@media (min-width: 768px) {
  .arvis-cart__stepper {
    display: block;
  }
}

.arvis-cart__stepper-list {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.arvis-cart__stepper-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.arvis-cart__stepper-num {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: var(--surface);
  color: var(--arvis-slate, #6b7280);
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px;
}

.arvis-cart__stepper-label {
  font-size: 14px;
  font-weight: 500;
  color: var(--arvis-slate, #6b7280);
  white-space: nowrap;
}

.arvis-cart__stepper-item.is-active .arvis-cart__stepper-num {
  background: var(--arvis-ember, #ff5c35);
  color: #fff;
  border: none;
}

.arvis-cart__stepper-item.is-active .arvis-cart__stepper-label {
  color: var(--arvis-midnight, #111827);
  font-weight: 600;
}

.arvis-cart__stepper-divider {
  flex: 1;
  height: 1px;
  background: var(--arvis-line, #e5e7eb);
}

/* === Body grid === */

.arvis-cart__body {
  padding-top: 24px;
}

@media (min-width: 768px) {
  .arvis-cart__body {
    padding-top: 32px;
  }
}

.arvis-cart__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-cart__grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  }
}

/* === Items list card === */

.arvis-cart__items-card {
  background: var(--surface);
  border-radius: 20px;
  padding: 8px 20px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

@media (min-width: 768px) {
  .arvis-cart__items-card {
    padding: 8px 28px;
  }
}

.arvis-cart__items-list {
  display: flex;
  flex-direction: column;
}

.arvis-cart__items-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 0 8px;
  flex-wrap: wrap;
  gap: 8px;
}

.arvis-cart__continue-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--arvis-midnight, #111827);
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  transition: color 0.2s ease;
}

.arvis-cart__continue-link:hover {
  color: var(--arvis-ember, #ff5c35);
  text-decoration: none;
}

/* === Cart line item === */

.arvis-cart__line {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 12px;
  padding: 20px 0;
  border-bottom: 1px solid var(--arvis-line, #e5e7eb);
  align-items: center;
}

.arvis-cart__line:last-child {
  border-bottom: none;
}

@media (min-width: 768px) {
  .arvis-cart__line {
    grid-template-columns: 100px 1fr auto;
    gap: 24px;
  }
}

.arvis-cart__line-thumb {
  width: 80px;
  height: 80px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--surface-container, #f8f9fa);
  display: block;
  position: relative;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .arvis-cart__line-thumb {
    width: 100px;
    height: 100px;
  }
}

.arvis-cart__line-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.arvis-cart__line-info {
  min-width: 0;
}

.arvis-cart__line-brand {
  font-size: 11px;
  font-weight: 700;
  color: var(--arvis-slate, #6b7280);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.arvis-cart__line-name {
  font: inherit;
  margin: 4px 0 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--arvis-midnight, #111827);
}

.arvis-cart__line-name a {
  color: inherit;
  text-decoration: none;
}
.arvis-cart__line-name a:hover {
  color: var(--arvis-ember, #ff5c35);
  text-decoration: none;
}

.arvis-cart__line-variant {
  margin-top: 6px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-cart__line-stock {
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
}

.arvis-cart__line-stock-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  flex-shrink: 0;
}

.arvis-cart__line-stock--in {
  color: var(--arvis-jade, #22c55e);
}
.arvis-cart__line-stock--in .arvis-cart__line-stock-dot {
  background: var(--arvis-jade, #22c55e);
}
.arvis-cart__line-stock--warn {
  color: var(--arvis-ember-darker, #cc4827);
}
.arvis-cart__line-stock--warn .arvis-cart__line-stock-dot {
  background: var(--arvis-ember, #ff5c35);
}
.arvis-cart__line-stock--out {
  color: var(--arvis-slate, #6b7280);
}

/* === Mobile actions row (qty + total + trash sub info, < 768px) === */

.arvis-cart__line-mobile-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
  gap: 12px;
}

.arvis-cart__line-mobile-totals {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .arvis-cart__line-mobile-actions {
    display: none;
  }
}

/* === Desktop actions (qty + total + trash) === */

.arvis-cart__line-actions {
  display: none;
}

@media (min-width: 768px) {
  .arvis-cart__line-actions {
    display: flex;
    align-items: center;
    gap: 24px;
  }
}

.arvis-cart__line-totals {
  text-align: right;
  min-width: 90px;
}

.arvis-cart__line-total {
  font-size: 16px;
  font-weight: 800;
  color: var(--arvis-ember, #ff5c35);
  font-variant-numeric: tabular-nums;
}

@media (min-width: 768px) {
  .arvis-cart__line-total {
    font-size: 18px;
  }
}

.arvis-cart__line-unit {
  font-size: 11px;
  color: var(--arvis-slate, #6b7280);
  margin-top: 2px;
}

.arvis-cart__line-trash {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--arvis-slate, #6b7280);
  background: transparent;
  border: none;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}

.arvis-cart__line-trash:hover {
  background: var(--arvis-ember-soft, #fff3f0);
  color: var(--arvis-ember, #ff5c35);
  text-decoration: none;
}

/* === Qty stepper === */

.arvis-cart__qty {
  display: inline-flex;
  align-items: center;
  background: var(--surface-container, #f8f9fa);
  border-radius: 10px;
  padding: 2px;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .arvis-cart__qty {
    border-radius: 12px;
    padding: 4px;
  }
}

.arvis-cart__qty-btn {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--arvis-midnight, #111827);
  background: transparent;
  border: none;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
  padding: 0;
}

.arvis-cart__qty-btn:hover {
  background: var(--surface);
  color: var(--arvis-ember, #ff5c35);
  text-decoration: none;
}

.arvis-cart__qty-input {
  width: 40px;
  height: 32px;
  border: none;
  background: transparent;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
  padding: 0;
  -moz-appearance: textfield;
  appearance: none;
}

.arvis-cart__qty-input::-webkit-inner-spin-button,
.arvis-cart__qty-input::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
  display: none !important;
}

.arvis-cart__qty-input:focus {
  outline: none;
}

/* Nuke bootstrap-touchspin wrapper-ul Warehouse pe inputurile de qty din cart.
   Strategy revised: in loc de `display: contents` (buggy in unele browsers),
   facem `.bootstrap-touchspin` un inline-flex transparent ce contine doar input-ul
   vizibil + spinner buttons hidden. */
.arvis-cart__qty .input-group.bootstrap-touchspin,
.arvis-cart__qty .bootstrap-touchspin {
  display: inline-flex !important;
  align-items: center;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
}

.arvis-cart__qty .input-group-btn,
.arvis-cart__qty .input-group-btn-vertical,
.arvis-cart__qty .bootstrap-touchspin-prefix,
.arvis-cart__qty .bootstrap-touchspin-postfix,
.arvis-cart__qty .bootstrap-touchspin-up,
.arvis-cart__qty .bootstrap-touchspin-down,
.arvis-cart__qty .bootstrap-touchspin-injected,
.arvis-cart__qty .btn-touchspin,
.arvis-cart__qty
  [class*="touchspin-"]:not(.arvis-cart__qty-input):not(
    .arvis-cart__qty-btn
  ):not(.bootstrap-touchspin) {
  display: none !important;
}

/* Input-ul cu cantitatea — vizibil 40px, font bold 14px Midnight. */
.arvis-cart__qty input,
.arvis-cart__qty input.form-control,
.arvis-cart__qty input.js-cart-line-product-quantity,
.arvis-cart__qty input[name="product-quantity-spin"] {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 48px !important;
  height: 32px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-align: center !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  font-family: inherit !important;
  color: var(--arvis-midnight, #111827) !important;
  -moz-appearance: textfield !important;
  appearance: none !important;
  flex: 0 0 auto !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  text-indent: 0 !important;
  line-height: 32px !important;
}

.arvis-cart__qty input::-webkit-inner-spin-button,
.arvis-cart__qty input::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  display: none !important;
  margin: 0 !important;
}

/* === Cross-sell row === */

.arvis-cart__crosssell {
  margin-top: 16px;
}
.arvis-cart__crosssell:empty {
  display: none;
}

/* === Summary sticky === */

.arvis-cart__summary-col {
  position: relative;
}

@media (min-width: 992px) {
  .arvis-cart__summary-col {
    position: sticky;
    top: 20px;
  }
}

.arvis-cart__summary {
  background: var(--surface);
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.arvis-cart__summary-title {
  font: inherit;
  margin: 0 0 20px;
  font-size: 18px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
}

/* Voucher input */

.arvis-cart__voucher {
  margin-bottom: 16px;
}

.arvis-cart__voucher-input-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 12px;
}

.arvis-cart__voucher-icon {
  color: var(--arvis-slate, #6b7280);
  flex-shrink: 0;
  display: inline-flex;
}

.arvis-cart__voucher-input {
  flex: 1;
  background: transparent;
  border: 0;
  outline: 0;
  font-size: 14px;
  font-family: inherit;
  color: var(--arvis-midnight, #111827);
  min-width: 0;
}

.arvis-cart__voucher-input::placeholder {
  color: var(--arvis-slate, #6b7280);
}

.arvis-cart__voucher-btn {
  background: var(--surface);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 8px;
  padding: 6px 14px;
  font-weight: 600;
  font-size: 13px;
  color: var(--arvis-midnight, #111827);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.arvis-cart__voucher-btn:hover {
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
  color: #fff;
}

/* Spatiu intre zona voucher (input/chip aplicat) si bannerul de livrare gratuita */
.arvis-cart__summary-freeship {
  margin-top: 14px;
}

.arvis-cart__vouchers-applied {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.arvis-cart__voucher-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px 4px 12px;
  background: var(--arvis-ember-soft, #fff3f0);
  color: var(--arvis-ember-darker, #cc4827);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}

.arvis-cart__voucher-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  opacity: 0.7;
  transition: opacity 0.15s ease;
}

.arvis-cart__voucher-remove:hover {
  opacity: 1;
  color: var(--arvis-ember-darker, #cc4827);
}

/* Free shipping slot (din arvisextend) */

.arvis-cart__summary-freeship {
  margin-bottom: 16px;
}
.arvis-cart__summary-freeship:empty {
  display: none;
}

.arvis-cart__summary-freeship .arvis-freeship {
  margin: 0;
}

/* Totals lines */

.arvis-cart__summary-lines {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0 0 4px;
}

.arvis-cart__sum-line {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  align-items: baseline;
  gap: 12px;
}

.arvis-cart__sum-line-label {
  color: var(--arvis-slate, #6b7280);
}
.arvis-cart__sum-line-value {
  font-variant-numeric: tabular-nums;
  color: var(--arvis-midnight, #111827);
}
.arvis-cart__sum-line-jade {
  color: var(--arvis-jade, #22c55e);
  font-weight: 600;
}
.arvis-cart__sum-line-value--strike {
  text-decoration: line-through;
  color: var(--arvis-slate, #6b7280);
}
.arvis-cart__sum-line--discount .arvis-cart__sum-line-value {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
}
.arvis-cart__sum-line--meta {
  font-size: 13px;
}
.arvis-cart__sum-line--meta .arvis-cart__sum-line-value {
  color: var(--arvis-slate, #6b7280);
}

.arvis-cart__summary-divider {
  height: 1px;
  background: var(--arvis-line, #e5e7eb);
  margin: 20px 0;
}

.arvis-cart__summary-total-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
}

.arvis-cart__summary-total-label {
  color: var(--arvis-slate, #6b7280);
  font-size: 13px;
}
.arvis-cart__summary-total-sub {
  font-size: 11px;
  margin-top: 2px;
}

.arvis-cart__summary-total-value {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--arvis-midnight, #111827);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

@media (min-width: 768px) {
  .arvis-cart__summary-total-value {
    font-size: 32px;
  }
}

/* CTA Finalizeaza comanda — specificity boost ca sa batem `a:link:not(.btn)` din Warehouse */

a.arvis-cart__summary-cta,
.arvis-cart .arvis-cart__summary-cta,
body .arvis-cart__summary-cta {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-top: 20px;
  padding: 16px 24px;
  border-radius: 14px;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #fff !important;
  font-weight: 700;
  font-size: 15px;
  text-decoration: none !important;
  border: none !important;
  transition: background 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
}

a.arvis-cart__summary-cta:hover,
.arvis-cart .arvis-cart__summary-cta:hover,
body .arvis-cart__summary-cta:hover {
  background: var(--arvis-ember-darker, #cc4827) !important;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: 0 6px 16px rgba(255, 92, 53, 0.25);
}

a.arvis-cart__summary-cta:active {
  transform: translateY(1px);
}

/* Cartile interne (svg + span) mostenesc culoarea */
.arvis-cart__summary-cta > * {
  color: inherit;
}

/* Payment badges */

.arvis-cart__summary-payments {
  margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-cart__summary-payments-label {
  flex-shrink: 0;
}
.arvis-cart__summary-payments-list {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.arvis-cart__pay-badge {
  padding: 4px 8px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 6px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  font-size: 11px;
}

/* Trust mini-cards sub summary */

.arvis-cart__trust {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 16px;
}

.arvis-cart__trust-card {
  background: var(--surface);
  border-radius: 16px;
  padding: 16px;
}

.arvis-cart__trust-card svg {
  display: block;
}
.arvis-cart__trust-card--jade svg {
  color: var(--arvis-jade, #22c55e);
}
.arvis-cart__trust-card--ember svg {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-cart__trust-title {
  font-size: 13px;
  font-weight: 700;
  margin-top: 8px;
  color: var(--arvis-midnight, #111827);
}

.arvis-cart__trust-sub {
  font-size: 11px;
  color: var(--arvis-slate, #6b7280);
  margin-top: 2px;
}

/* === Empty state === */

.arvis-cart__empty {
  padding: 32px 0;
}

.arvis-cart__empty-card {
  background: var(--surface);
  border-radius: 24px;
  padding: 48px 24px;
  text-align: center;
  max-width: 560px;
  margin: 0 auto;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

@media (min-width: 768px) {
  .arvis-cart__empty-card {
    padding: 64px 32px;
  }
}

.arvis-cart__empty-icon {
  width: 96px;
  height: 96px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-slate, #6b7280);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}

.arvis-cart__empty-title {
  font: inherit;
  margin: 0;
  font-size: 24px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.01em;
}

@media (min-width: 768px) {
  .arvis-cart__empty-title {
    font-size: 28px;
  }
}

.arvis-cart__empty-text {
  margin: 12px 0 0;
  font-size: 15px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.55;
}

.arvis-cart__empty-actions {
  margin-top: 28px;
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.arvis-cart__empty-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 22px;
  background: var(--arvis-ember, #ff5c35);
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  transition: background 0.2s ease;
}

.arvis-cart__empty-cta:hover {
  background: var(--arvis-ember-darker, #cc4827);
  color: #fff;
  text-decoration: none;
}

.arvis-cart__empty-cta--secondary {
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-midnight, #111827);
}

.arvis-cart__empty-cta--secondary:hover {
  background: var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827);
}

.arvis-cart__empty-extras {
  margin-top: 32px;
}
.arvis-cart__empty-extras:empty {
  display: none;
}

/* ==========================================================================
   CHECKOUT PAGE (Etapa 7.2 Faza 2) — design pages-buy.jsx
   ========================================================================== */

.arvis-checkout {
  background: var(--page-bg, #f8f9fa);
  padding-bottom: 96px;
}

@media (max-width: 767px) {
  .arvis-checkout {
    padding-bottom: 96px;
  }
}

/* === Top bar (Back to cart + Secure connection) === */

.arvis-checkout__topbar {
  padding: 16px 0 8px;
  background: var(--page-bg, #f8f9fa);
}

@media (min-width: 768px) {
  .arvis-checkout__topbar {
    padding: 24px 0 8px;
  }
}

.arvis-checkout__topbar .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}

.arvis-checkout__back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  /* !important: bate regula parent Warehouse a:link:not(.nav-link):not(.btn) (spec 0,3,1)
     care altfel ii da culoarea ei -> pe dark devenea aproape invizibil. */
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  padding: 6px 0;
  transition: color 0.2s ease;
}

.arvis-checkout__back-link:hover {
  color: var(--arvis-ember, #ff5c35) !important;
  text-decoration: none;
}

.arvis-checkout__secure {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

/* === Stepper vizual === */

.arvis-checkout__stepper {
  padding: 16px 0 24px;
}

@media (min-width: 768px) {
  .arvis-checkout__stepper {
    padding: 16px 0 32px;
  }
}

.arvis-checkout__stepper-list {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 768px) {
  .arvis-checkout__stepper-list {
    gap: 16px;
  }
}

.arvis-checkout__stepper-item {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.arvis-checkout__stepper-num {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: var(--surface);
  color: var(--arvis-slate, #6b7280);
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px;
  flex-shrink: 0;
  position: relative;
}

/* Default: text vizibil, checkmark ascuns */
.arvis-checkout__stepper-num-text {
  display: inline;
}
.arvis-checkout__stepper-num-check {
  display: none;
}

/* Done state: checkmark vizibil, text ascuns */
.arvis-checkout__stepper-item.is-done .arvis-checkout__stepper-num-text {
  display: none;
}
.arvis-checkout__stepper-item.is-done .arvis-checkout__stepper-num-check {
  display: inline;
}

.arvis-checkout__stepper-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-slate, #6b7280);
  white-space: nowrap;
  display: none;
}

@media (min-width: 768px) {
  .arvis-checkout__stepper-label {
    display: inline;
  }
}

.arvis-checkout__stepper-item.is-active .arvis-checkout__stepper-num {
  background: var(--arvis-ember, #ff5c35);
  color: #fff;
  border: none;
}

.arvis-checkout__stepper-item.is-active .arvis-checkout__stepper-label {
  color: var(--arvis-midnight, #111827);
}

.arvis-checkout__stepper-item.is-done .arvis-checkout__stepper-num {
  background: var(--arvis-jade, #22c55e);
  color: #fff;
  border: none;
}

/* Pe DESKTOP toate label-urile sunt deja vizibile (vezi regula @min-width:768px
   de mai sus). Pe MOBIL le tinem ascunse (doar cifrele) — altfel label-urile
   active+done (nowrap) depaseau viewport-ul si produceau scroll orizontal pe
   toata pagina. Deci afisarea active/done e scopuita la desktop. */
@media (min-width: 768px) {
  .arvis-checkout__stepper-item.is-active .arvis-checkout__stepper-label,
  .arvis-checkout__stepper-item.is-done .arvis-checkout__stepper-label {
    display: inline;
  }
}

.arvis-checkout__stepper-divider {
  flex: 1;
  height: 1px;
  background: var(--arvis-line, #e5e7eb);
  min-width: 12px;
}

.arvis-checkout__stepper-divider.is-done {
  background: var(--arvis-jade, #22c55e);
}

/* === Main grid === */

.arvis-checkout__body {
  padding-top: 8px;
}

.arvis-checkout__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-checkout__grid {
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  }
}

/* Hide right summary col on mobile (mobile sticky bottom replaces) */
@media (max-width: 991px) {
  .arvis-checkout__summary-col {
    display: none;
  }
}

/* === Step card wrapper === */
/* NU folosim override la checkout-step.tpl (PS9 + Warehouse incompatibilitate
   cu $step.tpl). Stilizam direct clasele PS native: .checkout-step + .-current
   + .-complete + .step-title + .content. */

.arvis-checkout .checkout-step,
.arvis-checkout__steps-col > section {
  background: var(--surface);
  border-radius: 20px;
  padding: 24px;
  margin-bottom: 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
  list-style: none;
}

@media (min-width: 768px) {
  .arvis-checkout .checkout-step,
  .arvis-checkout__steps-col > section {
    padding: 28px;
    border-radius: 24px;
  }
}

/* Step title — h1 sau .step-title; PS native include numar inside text ("1 Informatii personale") */
.arvis-checkout .checkout-step > h1,
.arvis-checkout .checkout-step .step-title,
.arvis-checkout .checkout-step > header h1 {
  font: inherit;
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--arvis-slate, #6b7280);
  display: flex;
  align-items: center;
  gap: 12px;
}

.arvis-checkout .checkout-step.-current > h1,
.arvis-checkout .checkout-step.-current .step-title,
.arvis-checkout .checkout-step.-complete > h1,
.arvis-checkout .checkout-step.-complete .step-title {
  color: var(--arvis-midnight, #111827);
}

/* Number prefix in title — PS scrie "1 Title" — stilizam primul char prin
   :first-letter pattern (limitat) sau printr-un pseudo daca disponibil.
   Pentru robustete: stilizam h1 cu cifrele largi via font-weight + color. */

/* Done checkmark (PS adauga icon material .material-icons.done) */
.arvis-checkout .checkout-step .material-icons.done {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: var(--arvis-jade, #22c55e);
  color: #fff;
  font-size: 16px;
}

.arvis-checkout .checkout-step:not(.-complete) .material-icons.done {
  display: none;
}

/* Edit step link (Warehouse uses "editeaza" text) */
.arvis-checkout .checkout-step .edit,
.arvis-checkout .checkout-step .step-edit,
.arvis-checkout .checkout-step a[data-link-action="edit-step"] {
  margin-left: auto;
  font-size: 13px;
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
  text-decoration: none !important;
  padding: 6px 10px;
  border-radius: 8px;
  transition: background 0.15s ease;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.arvis-checkout .checkout-step .edit:hover,
.arvis-checkout .checkout-step .step-edit:hover,
.arvis-checkout .checkout-step a[data-link-action="edit-step"]:hover {
  background: var(--arvis-ember-soft, #fff3f0);
  color: var(--arvis-ember-darker, #cc4827) !important;
  text-decoration: none !important;
}

/* Step header (h1 + edit link) — flex space-between */
.arvis-checkout .checkout-step > header,
.arvis-checkout .checkout-step > h1 {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
}

.arvis-checkout .checkout-step.-current > header,
.arvis-checkout .checkout-step.-current > h1 {
  margin-bottom: 20px;
}

/* Content area */
.arvis-checkout .checkout-step .content {
  margin-top: 0;
}

.arvis-checkout .checkout-step .content.done,
.arvis-checkout .checkout-step:not(.-current) .content {
  display: none;
}

.arvis-checkout .checkout-step.-current .content {
  display: block;
  margin-top: 20px;
}

/* === Style PS form fields inside step body === */

/* Inputs cu floating labels Arvis. PS render structure varies — pattern-uri
   uzuale: <div class="form-group"><label>...</label><input class="form-control"></div> */

.arvis-checkout .checkout-step .content .form-group,
.arvis-checkout .checkout-step .content .form-row {
  margin-bottom: 14px;
}

.arvis-checkout .checkout-step .content label,
.arvis-checkout .checkout-step .content .form-control-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 6px;
}

.arvis-checkout .checkout-step .content label.required::after,
.arvis-checkout .checkout-step .content .form-control-label.required::after,
.arvis-checkout .checkout-step .content label:has(input[required])::after {
  content: " *";
  color: var(--arvis-ember, #ff5c35);
}

.arvis-checkout .checkout-step .content input[type="text"],
.arvis-checkout .checkout-step .content input[type="email"],
.arvis-checkout .checkout-step .content input[type="password"],
.arvis-checkout .checkout-step .content input[type="tel"],
.arvis-checkout .checkout-step .content input[type="number"],
.arvis-checkout .checkout-step .content select,
.arvis-checkout .checkout-step .content textarea,
.arvis-checkout .checkout-step .content .form-control {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  border-radius: 12px;
  font-size: 14px;
  font-family: inherit;
  color: var(--arvis-midnight, #111827);
  background: var(--surface);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* Fix taiere text pe select: tema forteaza height:2.625rem (theme.css) care, cu
   padding-ul nostru 12px/12px + line-height 21px, lasa doar ~13px pentru text.
   height:auto => select-ul creste ca input-urile, textul nu se mai taie. */
.arvis-checkout .checkout-step .content select,
.arvis-checkout .checkout-step .content select.form-control,
.arvis-checkout .checkout-step .content .form-control-select {
  height: auto;
  line-height: 1.5;
}

.arvis-checkout .checkout-step .content input[type="text"]:focus,
.arvis-checkout .checkout-step .content input[type="email"]:focus,
.arvis-checkout .checkout-step .content input[type="password"]:focus,
.arvis-checkout .checkout-step .content input[type="tel"]:focus,
.arvis-checkout .checkout-step .content select:focus,
.arvis-checkout .checkout-step .content textarea:focus,
.arvis-checkout .checkout-step .content .form-control:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 0 0 3px rgba(255, 92, 53, 0.12);
}

.arvis-checkout .checkout-step .content textarea {
  min-height: 80px;
  resize: vertical;
}

/* Custom checkbox / radio styling — Arvis chip */

.arvis-checkout .checkout-step .content input[type="checkbox"],
.arvis-checkout .checkout-step .content input[type="radio"] {
  accent-color: var(--arvis-ember, #ff5c35);
  width: 18px;
  height: 18px;
  cursor: pointer;
  flex-shrink: 0;
}

/* === Style carrier list (Step shipping) — radio cards === */

.arvis-checkout .delivery-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

/* Hide PS native empty extra-content + clearfix divs care produceau
   Snow boxes goale intre carriers (DOM: .carrier-extra-content + .clearfix
   sub fiecare .delivery-option). */
.arvis-checkout .delivery-options > .carrier-extra-content:empty,
.arvis-checkout .delivery-options > .clearfix,
.arvis-checkout .carrier-extra-content:empty {
  display: none !important;
}

/* Carrier card — DOAR pe .delivery-option (NU pe orice div). */
.arvis-checkout .delivery-option {
  background: var(--surface-container, #f8f9fa);
  border-radius: 14px;
  border: 1.5px solid transparent;
  padding: 16px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
  margin: 0 !important;
  display: flex !important;
  align-items: center;
  gap: 16px;
  flex-wrap: nowrap;
}

.arvis-checkout .delivery-option:hover {
  background: var(--surface);
  border-color: var(--arvis-line, #e5e7eb);
}

.arvis-checkout .delivery-option:has(input[type="radio"]:checked) {
  background: var(--arvis-ember-soft, #fff3f0);
  border-color: var(--arvis-ember, #ff5c35);
}

/* Flatten Bootstrap col-sm-X nested grid in carrier label la flex row simplu */
.arvis-checkout .delivery-option > [class*="col-"],
.arvis-checkout .delivery-option label.delivery-option-2 [class*="col-"],
.arvis-checkout .delivery-option .row {
  flex: 0 0 auto;
  max-width: none;
  width: auto;
  padding: 0;
  margin: 0;
}

.arvis-checkout .delivery-option label.delivery-option-2,
.arvis-checkout .delivery-option > label {
  display: flex !important;
  align-items: center;
  gap: 16px;
  margin: 0;
  cursor: pointer;
  flex: 1;
  font-weight: 400;
  color: inherit;
  min-width: 0;
}

.arvis-checkout .delivery-option label.delivery-option-2 > .row {
  display: flex !important;
  flex: 1;
  align-items: center;
  gap: 16px;
}

.arvis-checkout .delivery-option .carrier-hasLogo {
  display: flex !important;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
}

.arvis-checkout .delivery-option .carrier-hasLogo img {
  max-width: 40px;
  max-height: 40px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.arvis-checkout .delivery-option .carriere-name-container {
  padding: 0 !important;
  width: auto !important;
}

.arvis-checkout .delivery-option .carrier-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
  display: inline-block;
}

.arvis-checkout .delivery-option .carrier-delay {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  flex: 1;
  font-weight: 400;
}

.arvis-checkout .delivery-option .carrier-price {
  font-weight: 700;
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
  margin-left: auto;
  white-space: nowrap;
}

/* Custom radio button styling */
.arvis-checkout .delivery-option .custom-radio {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 1.5px solid var(--arvis-slate-soft, #9ca3af);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--surface);
  position: relative;
  margin: 0;
  padding: 0;
}

.arvis-checkout .delivery-option .custom-radio input[type="radio"] {
  position: absolute;
  opacity: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.arvis-checkout .delivery-option .custom-radio > span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: transparent;
  display: block;
  transition: background 0.15s ease;
}

.arvis-checkout
  .delivery-option:has(input[type="radio"]:checked)
  .custom-radio {
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-checkout
  .delivery-option:has(input[type="radio"]:checked)
  .custom-radio
  > span {
  background: var(--arvis-ember, #ff5c35);
}

/* === Style payment options (Step payment) === */

.arvis-checkout .payment-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Payment row (PS native uses .payment-option > .row pattern) */
.arvis-checkout .payment-option,
.arvis-checkout .payment-options > .row {
  background: var(--surface-container, #f8f9fa);
  border-radius: 16px;
  border: 1.5px solid transparent;
  padding: 16px 18px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
  margin: 0 !important;
  display: flex !important;
  align-items: center;
  gap: 14px;
}

.arvis-checkout .payment-option:hover,
.arvis-checkout .payment-options > .row:hover {
  background: var(--surface);
  border-color: var(--arvis-line, #e5e7eb);
}

.arvis-checkout .payment-option:has(input[type="radio"]:checked),
.arvis-checkout .payment-options > .row:has(input[type="radio"]:checked) {
  background: var(--arvis-ember-soft, #fff3f0);
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-checkout .payment-option label,
.arvis-checkout .payment-options > .row label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  cursor: pointer;
  font-weight: 500;
  color: var(--arvis-midnight, #111827);
  flex: 1;
  min-width: 0;
}

.arvis-checkout .payment-option label img,
.arvis-checkout .payment-options > .row label img {
  max-height: 24px;
  width: auto;
  margin-left: 8px;
}

/* Custom radio in payment options (PS uses .ps-shown-by-js styled) */
.arvis-checkout .payment-options [class*="col-"] {
  padding: 0;
  flex: 0 0 auto;
  width: auto;
  max-width: none;
}

.arvis-checkout .payment-option .additional-information,
.arvis-checkout .payment-options .additional-information {
  margin-top: 14px;
  padding: 14px 16px;
  background: var(--surface);
  border-radius: 12px;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.55;
  flex-basis: 100%;
}

.arvis-checkout .payment-option .additional-information a,
.arvis-checkout .payment-options .additional-information a {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
}

/* === Hide PS order review preview "Te rugam sa verifici comanda" ===
   DOM: <section id="order-summary-content" class="page-content page-order-confirmation">
   Conține adrese + metoda livrare + 2 produse + tabel totals — duplicate
   cu summary-ul nostru sticky. Hide pentru consistency cu designul.
   NOTA: nu folosim `:contains()` (jQuery only, invalideaza regula in CSS).
*/
.arvis-checkout #order-summary-content,
.arvis-checkout .page-order-confirmation,
.arvis-checkout #order-items,
.arvis-checkout .order-confirmation-table {
  display: none !important;
}

/* === Additional information slot (PS pune ca SIBLING al .payment-option, nu nested) ===
   DOM real: <div id="payment-option-3-container" class="payment-option">...</div>
            <div id="payment-option-3-additional-information" class="additional-information">...</div>
*/
.arvis-checkout [id$="-additional-information"],
.arvis-checkout .js-additional-information,
.arvis-checkout .additional-information {
  margin: 0 0 12px !important;
  padding: 14px 18px !important;
  background: var(--surface) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 12px !important;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.55;
}

.arvis-checkout .additional-information a,
.arvis-checkout .js-additional-information a {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
}

/* Hide ps-hidden-by-js (used to hide native checkbox/inputs while JS loads
   custom UI). NU folosim `.ps-hidden` generic — PS gestioneaza visibility
   via class toggle care poate fi influentat de scripturi alte module. */
.arvis-checkout .ps-hidden-by-js {
  display: none !important;
}

/* Additional info: default hidden cand ps-hidden, force visible pe sibling
   care urmeaza dupa payment option SELECTAT (independent de PS JS state). */
.arvis-checkout .additional-information.ps-hidden,
.arvis-checkout [id$="-additional-information"].ps-hidden {
  display: none;
}

.arvis-checkout
  .payment-option:has(input[type="radio"]:checked)
  + .additional-information,
.arvis-checkout
  .payment-option:has(input[type="radio"]:checked)
  + [id$="-additional-information"],
.arvis-checkout
  div[id^="payment-option"][id$="-container"]:has(input[type="radio"]:checked)
  + [id$="-additional-information"] {
  display: block !important;
}

/* === Hide buttons "pay-with-payment-option-X" empty ===
   PS randea per-payment buton submit dinamic, dar uneori e gol (depinde de
   modul). Apare ca pill Ember mic fara text. Plus bypass-eaza TOS validation.
   Hide → lasam #payment-confirmation standard PS sa fie singurul CTA.
*/
.arvis-checkout button[id^="pay-with-payment-option"]:empty,
.arvis-checkout button[id^="pay-with-payment-option"][value=""],
.arvis-checkout form[id$="-form"] > button[type="submit"]:empty {
  display: none !important;
}

/* === Style primary payment confirmation button (PS standard) === */
.arvis-checkout #payment-confirmation button,
.arvis-checkout #payment-confirmation .btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 16px 28px !important;
  border-radius: 14px !important;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  border: none !important;
  cursor: pointer;
  width: 100% !important;
  margin-top: 16px;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

.arvis-checkout #payment-confirmation button:hover:not(:disabled),
.arvis-checkout #payment-confirmation .btn:hover:not(:disabled) {
  background: var(--arvis-ember-darker, #cc4827) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(255, 92, 53, 0.25);
}

.arvis-checkout #payment-confirmation button:disabled,
.arvis-checkout #payment-confirmation button[disabled] {
  background: var(--surface-container, #f8f9fa) !important;
  color: var(--arvis-slate, #6b7280) !important;
  cursor: not-allowed;
}

/* Conditions checkbox (TOS) — design Arvis */
/* DOM PS9:
   <form id="conditions-to-approve">
     <ul><li>
       <span class="custom-checkbox">
         <input type="checkbox" required class="ps-shown-by-js">
         <span><i class="fa fa-check checkbox-checked"></i></span>
         <label class="js-terms" for="..."> Sunt de acord cu ... </label>
       </span>
     </li></ul>
   </form>
*/

.arvis-checkout #conditions-to-approve,
.arvis-checkout .conditions-to-approve {
  margin-top: 24px;
  padding: 18px 20px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 14px;
}

.arvis-checkout #conditions-to-approve ul,
.arvis-checkout .conditions-to-approve ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.arvis-checkout #conditions-to-approve li,
.arvis-checkout .conditions-to-approve li {
  margin: 0 0 10px;
  list-style: none;
}

.arvis-checkout #conditions-to-approve li:last-child,
.arvis-checkout .conditions-to-approve li:last-child {
  margin-bottom: 0;
}

/* Custom checkbox span — flex inline cu input + box visual + label */
.arvis-checkout .custom-checkbox {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  position: relative;
}

/* Hide native checkbox (PS adauga ps-shown-by-js cand JS loaded) */
.arvis-checkout .custom-checkbox > input[type="checkbox"] {
  position: absolute !important;
  opacity: 0;
  width: 22px;
  height: 22px;
  margin: 0;
  cursor: pointer;
  z-index: 2;
}

/* Visual box (span direct cu i fa-check inside) */
.arvis-checkout .custom-checkbox > span:not(.js-terms) {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  background: var(--surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  transition: background 0.15s ease, border-color 0.15s ease;
}

/* Checkmark icon inside box — initially hidden */
.arvis-checkout .custom-checkbox > span:not(.js-terms) > i.fa-check,
.arvis-checkout .custom-checkbox > span:not(.js-terms) > .checkbox-checked {
  display: none;
  font-size: 12px;
  color: #fff;
  line-height: 1;
}

/* Checked state: Ember box + visible check */
.arvis-checkout
  .custom-checkbox
  > input[type="checkbox"]:checked
  ~ span:not(.js-terms) {
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-checkout
  .custom-checkbox
  > input[type="checkbox"]:checked
  ~ span:not(.js-terms)
  > i.fa-check,
.arvis-checkout
  .custom-checkbox
  > input[type="checkbox"]:checked
  ~ span:not(.js-terms)
  > .checkbox-checked {
  display: inline-block;
}

/* Label inline cu textul Termenii */
.arvis-checkout .custom-checkbox > label,
.arvis-checkout .custom-checkbox > .js-terms,
.arvis-checkout label.js-terms {
  margin: 0 !important;
  flex: 1;
  cursor: pointer;
  font-size: 14px;
  font-weight: 400;
  color: var(--arvis-midnight, #111827);
  line-height: 1.5;
  display: inline;
  padding-top: 2px;
}

.arvis-checkout #conditions-to-approve a,
.arvis-checkout .conditions-to-approve a,
.arvis-checkout .custom-checkbox a {
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
  text-decoration: underline;
}

.arvis-checkout #conditions-to-approve a:hover,
.arvis-checkout .conditions-to-approve a:hover,
.arvis-checkout .custom-checkbox a:hover {
  color: var(--arvis-ember-darker, #cc4827) !important;
}

/* Submit buttons — pill Ember CTA */

.arvis-checkout .checkout-step .content button[type="submit"],
.arvis-checkout .checkout-step .content input[type="submit"],
.arvis-checkout .checkout-step .content .btn-primary,
.arvis-checkout .checkout-step .content .continue {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px !important;
  border-radius: 14px !important;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  border: none !important;
  cursor: pointer;
  text-decoration: none !important;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease;
  margin-top: 24px;
}

.arvis-checkout .checkout-step .content button[type="submit"]:hover,
.arvis-checkout .checkout-step .content input[type="submit"]:hover,
.arvis-checkout .checkout-step .content .btn-primary:hover,
.arvis-checkout .checkout-step .content .continue:hover {
  background: var(--arvis-ember-darker, #cc4827) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(255, 92, 53, 0.25);
  text-decoration: none !important;
}

.arvis-checkout .checkout-step .content button[type="submit"]:active,
.arvis-checkout .checkout-step .content .continue:active {
  transform: translateY(1px);
}

@media (max-width: 575px) {
  .arvis-checkout .checkout-step .content button[type="submit"],
  .arvis-checkout .checkout-step .content .continue {
    width: 100% !important;
  }
}

/* Desktop: butoanele de navigare ("Continua" date personale, "Continua la plata")
   compacte, dimensionate la continut si aliniate la stanga — NU full-width.
   (Butonul intins venea din stretch-ul de flex-child al containerului pasului.)
   CTA-ul de plata #payment-confirmation ramane full-width (regula proprie, id). */
@media (min-width: 576px) {
  .arvis-checkout .checkout-step .content button[type="submit"],
  .arvis-checkout .checkout-step .content .continue {
    width: auto !important;
    align-self: flex-start;
  }
}

/* Secondary buttons (Add address, edit, etc) — outline */

.arvis-checkout .checkout-step .content .btn-secondary,
.arvis-checkout .checkout-step .content .btn-tertiary,
.arvis-checkout .checkout-step .content .add-address {
  background: transparent !important;
  color: var(--arvis-midnight, #111827) !important;
  border: 1.5px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 999px !important;
  padding: 10px 18px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-decoration: none !important;
}

.arvis-checkout .checkout-step .content .btn-secondary:hover,
.arvis-checkout .checkout-step .content .btn-tertiary:hover,
.arvis-checkout .checkout-step .content .add-address:hover {
  border-color: var(--arvis-ember, #ff5c35) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Address selection cards */

.arvis-checkout .checkout-step .content .address-item,
.arvis-checkout .checkout-step .content .address-selector {
  background: var(--surface-container, #f8f9fa);
  border-radius: 14px;
  border: 1.5px solid transparent;
  padding: 16px;
  cursor: pointer;
}

.arvis-checkout .checkout-step .content .address-item.selected,
.arvis-checkout
  .checkout-step
  .content
  .address-item:has(input[type="radio"]:checked) {
  background: var(--arvis-ember-soft, #fff3f0);
  border-color: var(--arvis-ember, #ff5c35);
}

/* === Summary sticky right === */

.arvis-checkout__summary {
  background: var(--surface);
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
  position: sticky;
  top: 20px;
}

.arvis-checkout__summary--mobile {
  position: static;
  box-shadow: none;
  padding: 0;
}

.arvis-checkout__summary-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.arvis-checkout__summary-title {
  font: inherit;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
}

.arvis-checkout__summary-toggle-btn {
  list-style: none;
  cursor: pointer;
  font-size: 12px;
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
  padding: 4px 8px;
  background: transparent;
  border: none;
  user-select: none;
}

.arvis-checkout__summary-toggle-btn::-webkit-details-marker {
  display: none;
}

/* Products list */

.arvis-checkout__summary-products {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--arvis-line, #e5e7eb);
}

.arvis-checkout__summary-product {
  display: flex;
  gap: 10px;
  align-items: center;
}

.arvis-checkout__summary-product-thumb {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--surface-container, #f8f9fa);
}

.arvis-checkout__summary-product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.arvis-checkout__summary-product-info {
  flex: 1;
  min-width: 0;
}

.arvis-checkout__summary-product-name {
  font-size: 12px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.arvis-checkout__summary-product-qty {
  font-size: 11px;
  color: var(--arvis-slate, #6b7280);
  margin-top: 2px;
}

.arvis-checkout__summary-product-total {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--arvis-midnight, #111827);
  text-align: right;
  flex-shrink: 0;
}

.arvis-checkout__summary-more {
  background: transparent;
  border: none;
  color: var(--arvis-ember, #ff5c35);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 0;
  text-align: left;
}

.arvis-checkout__summary-more:hover {
  color: var(--arvis-ember-darker, #cc4827);
}

/* Totals lines (reuse from cart styling) */

.arvis-checkout__summary-lines {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 14px;
}

.arvis-checkout__sum-line {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}

.arvis-checkout__sum-line-label {
  color: var(--arvis-slate, #6b7280);
}
.arvis-checkout__sum-line-value {
  font-variant-numeric: tabular-nums;
  color: var(--arvis-midnight, #111827);
}
.arvis-checkout__sum-line-jade {
  color: var(--arvis-jade, #22c55e);
  font-weight: 600;
}
.arvis-checkout__sum-line--discount .arvis-checkout__sum-line-value {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
}

.arvis-checkout__summary-divider {
  height: 1px;
  background: var(--arvis-line, #e5e7eb);
  margin: 16px 0;
}

.arvis-checkout__summary-total-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
}

.arvis-checkout__summary-total-label {
  font-weight: 700;
  font-size: 16px;
  color: var(--arvis-midnight, #111827);
}

.arvis-checkout__summary-total-value {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--arvis-ember, #ff5c35);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

/* Trust mini-list */

.arvis-checkout__summary-trust {
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-checkout__summary-trust li {
  display: flex;
  align-items: center;
  gap: 8px;
}

.arvis-checkout__summary-trust-icon {
  color: var(--arvis-jade, #22c55e);
  flex-shrink: 0;
  display: inline-flex;
}

/* === Mobile sticky bottom summary === */

.arvis-checkout__mobile-summary {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: transparent;
}

@media (max-width: 991px) {
  .arvis-checkout__mobile-summary {
    display: block;
  }
}

.arvis-checkout__mobile-summary-bar {
  list-style: none;
  background: var(--surface);
  border-top: 1px solid var(--arvis-line, #e5e7eb);
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  position: relative;
  z-index: 101;
}

.arvis-checkout__mobile-summary-bar::-webkit-details-marker {
  display: none;
}

.arvis-checkout__mobile-summary-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.arvis-checkout__mobile-summary-label {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-checkout__mobile-summary-total {
  font-size: 20px;
  font-weight: 800;
  color: var(--arvis-ember, #ff5c35);
  font-variant-numeric: tabular-nums;
}

.arvis-checkout__mobile-summary-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
  transition: transform 0.2s ease;
}

.arvis-checkout__mobile-summary[open]
  .arvis-checkout__mobile-summary-toggle
  svg {
  transform: rotate(180deg);
}

.arvis-checkout__mobile-summary-body {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  padding: 16px;
  padding-bottom: 100px;
  overflow-y: auto;
  z-index: 100;
  display: flex;
  align-items: flex-end;
}

.arvis-checkout__mobile-summary[open] .arvis-checkout__mobile-summary-body {
  display: flex;
}

.arvis-checkout__mobile-summary-body .arvis-checkout__summary--mobile {
  background: var(--surface);
  border-radius: 20px 20px 0 0;
  padding: 24px 20px;
  width: 100%;
  max-height: calc(100vh - 200px);
  overflow-y: auto;
  margin: 0 -16px -16px;
}

/* ==========================================================================
   ORDER CONFIRMATION (Etapa 7.2 Faza 3) — design pages-buy.jsx
   ========================================================================== */

.arvis-confirm {
  background: var(--page-bg, #f8f9fa);
  padding: 24px 0 64px;
}

@media (min-width: 768px) {
  .arvis-confirm {
    padding: 40px 0 96px;
  }
}

.arvis-confirm__page {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.arvis-confirm__overline {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 8px;
}

.arvis-confirm__overline--inline {
  margin-bottom: 12px;
}

.arvis-confirm__overline--on-dark {
  color: var(--arvis-ember, #ff5c35);
}

/* === Success card === */

.arvis-confirm__success {
  background: var(--surface);
  border-radius: 24px;
  padding: 32px 24px;
  text-align: center;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

@media (min-width: 768px) {
  .arvis-confirm__success {
    padding: 48px 32px;
  }
}

.arvis-confirm__success-glow {
  position: absolute;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
  width: 320px;
  height: 320px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.12), transparent 70%);
  pointer-events: none;
}

.arvis-confirm__success-inner {
  position: relative;
  z-index: 1;
}

.arvis-confirm__success-icon {
  width: 72px;
  height: 72px;
  border-radius: 999px;
  background: var(--arvis-jade, #22c55e);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  box-shadow: 0 8px 24px rgba(34, 197, 94, 0.25);
}

.arvis-confirm__title {
  font: inherit;
  margin: 0;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--arvis-midnight, #111827);
}

@media (min-width: 768px) {
  .arvis-confirm__title {
    font-size: 40px;
  }
}

.arvis-confirm__intro {
  margin: 16px auto 0;
  max-width: 520px;
  font-size: 16px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

@media (min-width: 768px) {
  .arvis-confirm__intro {
    font-size: 17px;
  }
}

.arvis-confirm__intro strong {
  color: var(--arvis-midnight, #111827);
  font-weight: 700;
}

.arvis-confirm__order-ref {
  margin-top: 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 999px;
  font-size: 14px;
}

.arvis-confirm__order-ref-label {
  color: var(--arvis-slate, #6b7280);
}

.arvis-confirm__order-ref-value {
  font-family: ui-monospace, "SF Mono", Menlo, Monaco, Consolas, monospace;
  letter-spacing: 0.02em;
  color: var(--arvis-midnight, #111827);
  font-weight: 700;
}

/* === Generic card === */

.arvis-confirm__card {
  background: var(--surface);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

@media (min-width: 768px) {
  .arvis-confirm__card {
    padding: 32px;
  }
}

.arvis-confirm__card-title {
  font: inherit;
  margin: 0 0 24px;
  font-size: 18px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
}

/* === Timeline === */

.arvis-confirm__timeline-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
}

.arvis-confirm__timeline-step {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 14px 0;
  border-bottom: 1px solid var(--arvis-line-soft, #eef0f3);
  position: relative;
}

.arvis-confirm__timeline-step:last-child {
  border-bottom: none;
}

.arvis-confirm__timeline-icon {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-slate, #6b7280);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 4px;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-confirm__timeline-step.is-done .arvis-confirm__timeline-icon {
  background: var(--arvis-jade, #22c55e);
  color: #fff;
}

.arvis-confirm__timeline-body {
  flex: 1;
  padding-top: 6px;
}

.arvis-confirm__timeline-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--arvis-slate, #6b7280);
}

.arvis-confirm__timeline-step.is-done .arvis-confirm__timeline-title {
  color: var(--arvis-midnight, #111827);
}

.arvis-confirm__timeline-desc {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  margin-top: 2px;
}

.arvis-confirm__timeline-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  background: var(--arvis-jade-soft, #f0fdf4);
  color: #16a34a;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  margin-left: auto;
  align-self: center;
}

/* === Order details === */

.arvis-confirm__details-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}

@media (min-width: 768px) {
  .arvis-confirm__details-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 32px;
  }
}

.arvis-confirm__details-body {
  font-size: 14px;
  line-height: 1.7;
  color: var(--arvis-midnight, #111827);
}

.arvis-confirm__details-body strong {
  color: var(--arvis-midnight, #111827);
  font-weight: 700;
}

.arvis-confirm__details-paid {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--arvis-jade, #22c55e);
  font-weight: 600;
}

.arvis-confirm__details-meta {
  color: var(--arvis-slate, #6b7280);
  font-size: 13px;
}

/* === Hook order confirmation (PayU, etc) — wrap in white card === */

.arvis-confirm__hook {
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
}

.arvis-confirm__hook:empty {
  display: none;
}

/* === Midnight "Ce poti face acum" card === */

.arvis-confirm__next {
  background: var(--dark-surface);
  color: #fff;
  border-radius: 24px;
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

@media (min-width: 768px) {
  .arvis-confirm__next {
    padding: 40px;
  }
}

.arvis-confirm__next-glow {
  position: absolute;
  bottom: -100px;
  right: -100px;
  width: 320px;
  height: 320px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.2), transparent 70%);
  pointer-events: none;
}

.arvis-confirm__next-inner {
  position: relative;
  z-index: 1;
}

.arvis-confirm__next-title {
  font: inherit;
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
}

@media (min-width: 768px) {
  .arvis-confirm__next-title {
    font-size: 24px;
  }
}

.arvis-confirm__next-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-top: 24px;
}

@media (min-width: 768px) {
  .arvis-confirm__next-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.arvis-confirm__next-card {
  background: rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 18px;
  color: #fff !important;
  text-decoration: none !important;
  display: block;
  transition: background 0.15s ease, transform 0.15s ease;
}

.arvis-confirm__next-card:hover {
  background: rgba(255, 255, 255, 0.12);
  transform: translateY(-2px);
  color: #fff !important;
  text-decoration: none !important;
}

.arvis-confirm__next-card-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--arvis-ember, #ff5c35);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}

.arvis-confirm__next-card-title {
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  display: block;
}

.arvis-confirm__next-card-desc {
  margin: 4px 0 0;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.5;
}

/* === Bottom action buttons === */

.arvis-confirm__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
  padding: 16px 0;
}

.arvis-confirm__action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 22px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-confirm__action--secondary {
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-midnight, #111827) !important;
}

.arvis-confirm__action--secondary:hover {
  background: var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827) !important;
}

.arvis-confirm__action--text {
  color: var(--arvis-midnight, #111827) !important;
  background: transparent;
}

.arvis-confirm__action--text:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

/* ==========================================================================
   ARVIS — Customer pages (Etapa 8)
   8.1 authentication / 8.2 registration: .arvis-account
   8.3 my-account dashboard: .arvis-dashboard
   8.4 history + order-detail: .arvis-orders / .arvis-order-detail
   ========================================================================== */

/* ---------- Shared hero strip (auth/register/dashboard/orders/order-detail) ---------- */
.arvis-account__hero,
.arvis-dashboard__hero,
.arvis-orders__hero,
.arvis-order-detail__hero {
  background: var(--surface-container, #f8f9fa);
  border-bottom: 1px solid var(--arvis-line, #e5e7eb);
  padding: 24px 0 20px;
}

.arvis-dashboard__hero-row,
.arvis-orders__hero-row,
.arvis-order-detail__hero-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 12px;
  flex-wrap: wrap;
}

.arvis-account__eyebrow,
.arvis-dashboard__eyebrow,
.arvis-orders__eyebrow,
.arvis-order-detail__eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 8px;
}

.arvis-account__title,
.arvis-dashboard__title,
.arvis-orders__title,
.arvis-order-detail__title {
  font-family: "Inter", sans-serif;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

.arvis-account__subtitle,
.arvis-dashboard__subtitle,
.arvis-orders__subtitle,
.arvis-order-detail__subtitle {
  margin-top: 8px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
}

@media (min-width: 768px) {
  .arvis-account__hero,
  .arvis-dashboard__hero,
  .arvis-orders__hero,
  .arvis-order-detail__hero {
    padding: 36px 0 28px;
  }
  .arvis-account__title,
  .arvis-dashboard__title,
  .arvis-orders__title,
  .arvis-order-detail__title {
    font-size: 40px;
  }
}

/* ---------- 8.1/8.2: Authentication + Registration ---------- */
.arvis-account__body {
  padding: 32px 0 64px;
}

@media (min-width: 768px) {
  .arvis-account__body {
    padding: 48px 0 96px;
  }
}

.arvis-account__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
}

@media (min-width: 992px) {
  .arvis-account__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 32px;
    align-items: stretch;
  }
}

.arvis-account__card {
  border-radius: 24px;
  padding: 28px;
  position: relative;
  overflow: hidden;
}

@media (min-width: 768px) {
  .arvis-account__card {
    padding: 40px;
  }
}

.arvis-account__card--form {
  background: var(--surface, #ffffff);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
}

.arvis-account__card--form .arvis-account__title {
  margin-top: 4px;
  font-size: 28px;
}

@media (min-width: 768px) {
  .arvis-account__card--form .arvis-account__title {
    font-size: 36px;
  }
}

.arvis-account__card--form .arvis-account__subtitle {
  margin-bottom: 24px;
}

/* PS9 form fields inside Arvis account card — restyle to brand */
.arvis-account__form .form-group,
.arvis-account__form .form-fields > .form-group {
  margin-bottom: 14px;
}

/* PS9 uses Bootstrap row grid: col-md-2 label + col-md-8 input + col-md-2 comment.
   Reset to vertical block — label on top, input full-width, comment col collapses. */
.arvis-account__form .form-group.row {
  display: block;
  margin-left: 0;
  margin-right: 0;
}

.arvis-account__form .form-group.row > [class*="col-"] {
  flex: 0 0 100%;
  max-width: 100%;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  margin: 0;
}

.arvis-account__form .form-group.row > .col-form-label,
.arvis-account__form .form-group.row > label {
  margin-bottom: 6px;
}

.arvis-account__form .form-group.row > .form-control-comment:empty,
.arvis-account__form .form-group.row > .form-control-comment {
  display: none;
}

.arvis-account__form .form-group.row > .form-control-comment:not(:empty) {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-account__form label,
.arvis-account__form .col-form-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 6px;
  padding: 0;
  line-height: 1.4;
}

.arvis-account__form .col-form-label.required::after {
  content: " *";
  color: var(--arvis-ember, #ff5c35);
}

/* Hide empty outer label when form-group is a checkbox row (PS9 wraps custom-checkbox
   in a .form-group with empty .col-form-label.required, which would otherwise show
   a stray Ember asterisk floating above the checkbox label). */
.arvis-account__form .form-group.row:has(.custom-checkbox) > .col-form-label,
.arvis-account__form .form-group.row:has([type="checkbox"]) > .col-form-label {
  display: none !important;
}

/* PS9 custom-checkbox: <span class="custom-checkbox"> wraps input + faux-check span + label */
.arvis-account__form .custom-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--arvis-slate, #6b7280);
  cursor: pointer;
}

.arvis-account__form .custom-checkbox input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
  z-index: 1;
}

.arvis-account__form .custom-checkbox > span:not([class]) {
  position: relative;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  border-radius: 5px;
  background: var(--surface, #ffffff);
  transition: border-color 0.15s ease, background 0.15s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.arvis-account__form .custom-checkbox > span:not([class]) .fa,
.arvis-account__form .custom-checkbox > span:not([class]) i {
  font-size: 10px;
  color: #ffffff !important;
  opacity: 0;
  transition: opacity 0.1s ease;
}

.arvis-account__form .custom-checkbox input[type="checkbox"]:checked + span {
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-account__form .custom-checkbox input[type="checkbox"]:checked + span .fa,
.arvis-account__form .custom-checkbox input[type="checkbox"]:checked + span i {
  opacity: 1;
}

.arvis-account__form
  .custom-checkbox
  input[type="checkbox"]:focus-visible
  + span {
  outline: 2px solid var(--arvis-ember, #ff5c35);
  outline-offset: 2px;
}

.arvis-account__form .custom-checkbox label {
  font-size: 13px;
  font-weight: 400;
  text-transform: none;
  letter-spacing: normal;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
  padding: 0;
  line-height: 1.5;
  cursor: pointer;
}

.arvis-account__form .custom-checkbox label a {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
  text-decoration: none;
}

.arvis-account__form .custom-checkbox label a:hover {
  text-decoration: underline;
}

/* Help text below GDPR checkbox label (italic muted) */
.arvis-account__form .custom-checkbox + .form-text,
.arvis-account__form .custom-checkbox + small,
.arvis-account__form em {
  display: block;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  font-style: italic;
  margin-top: 4px;
  line-height: 1.5;
}

/* Tighter spacing for checkbox-only form groups */
.arvis-account__form .form-group.row:has(.custom-checkbox) {
  margin-bottom: 10px;
}

.arvis-account__form .form-control,
.arvis-account__form input[type="email"],
.arvis-account__form input[type="text"],
.arvis-account__form input[type="password"],
.arvis-account__form input[type="tel"],
.arvis-account__form input[type="date"],
.arvis-account__form select,
.arvis-account__form textarea {
  width: 100%;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 14px;
  padding: 14px 16px;
  font-size: 15px;
  font-family: "Inter", sans-serif;
  color: var(--arvis-midnight, #111827);
  background: var(--surface-container, #f8f9fa);
  transition: border-color 0.15s ease, background 0.15s ease,
    box-shadow 0.15s ease;
}

/* Fix taiere text pe select (tema forteaza height:2.625rem + padding-ul nostru => text taiat). */
.arvis-account__form select,
.arvis-account__form select.form-control,
.arvis-account__form .form-control-select {
  height: auto;
  line-height: 1.5;
}

.arvis-account__form .form-control:focus,
.arvis-account__form input:focus,
.arvis-account__form select:focus,
.arvis-account__form textarea:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
  background: var(--surface, #ffffff);
  box-shadow: 0 0 0 3px rgba(255, 92, 53, 0.12);
}

.arvis-account__form .form-control[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Input group (password field + show/hide toggle eye icon).
   PS9 markup: .input-group > input + .input-group-append > button.btn-outline-secondary > i.fa */
.arvis-account__form .input-group,
.arvis-account__form .js-parent-focus {
  position: relative;
  display: block;
  width: 100%;
}

.arvis-account__form .input-group > .form-control,
.arvis-account__form .input-group input.form-control,
.arvis-account__form .js-parent-focus input.form-control {
  width: 100% !important;
  padding-right: 52px !important;
  border-radius: 14px !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-right: 1px solid var(--arvis-line, #e5e7eb) !important;
  flex: none;
}

.arvis-account__form .input-group > .form-control:focus,
.arvis-account__form .input-group input.form-control:focus {
  border-color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-account__form .input-group-append,
.arvis-account__form .input-group-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  background: transparent;
  z-index: 2;
}

.arvis-account__form .input-group-append .btn,
.arvis-account__form .input-group-btn .btn,
.arvis-account__form [data-action="show-password"] {
  background: transparent !important;
  border: none !important;
  color: var(--arvis-slate, #6b7280) !important;
  padding: 6px 10px !important;
  margin: 0 !important;
  min-width: 0 !important;
  width: auto !important;
  font-size: 16px;
  line-height: 1;
  font-weight: normal;
  text-transform: none;
  letter-spacing: normal;
  border-radius: 8px !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}

.arvis-account__form .input-group-append .btn:hover,
.arvis-account__form .input-group-btn .btn:hover,
.arvis-account__form [data-action="show-password"]:hover {
  background: var(--surface-container, #f8f9fa) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-account__form .input-group-append .btn .fa,
.arvis-account__form .input-group-append .btn i,
.arvis-account__form .input-group-btn .btn .fa,
.arvis-account__form .input-group-btn .btn i {
  font-size: 16px;
  color: var(--arvis-slate, #6b7280) !important;
  line-height: 1;
}

.arvis-account__form .input-group-append .btn:hover .fa,
.arvis-account__form .input-group-append .btn:hover i,
.arvis-account__form .input-group-btn .btn:hover .fa,
.arvis-account__form .input-group-btn .btn:hover i {
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Forgot password link — keep right-aligned but inside card flow */
.arvis-account__form .forgot-password {
  margin-top: 8px;
  text-align: right;
  font-size: 13px;
}

.arvis-account__form .forgot-password a {
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
  text-decoration: none !important;
}

.arvis-account__form .forgot-password a:hover {
  text-decoration: underline !important;
}

.arvis-account__form .checkbox,
.arvis-account__form .form-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  margin: 10px 0;
}

.arvis-account__form .checkbox label,
.arvis-account__form .form-check label {
  text-transform: none;
  font-weight: 400;
  letter-spacing: normal;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
}

.arvis-account__form .checkbox input[type="checkbox"],
.arvis-account__form .form-check input[type="checkbox"] {
  margin-top: 2px;
  accent-color: var(--arvis-ember, #ff5c35);
}

.arvis-account__form a {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
  text-decoration: none;
}

.arvis-account__form a:hover {
  text-decoration: underline;
}

/* Submit buttons inside form — override PS native btn-primary */
.arvis-account__form .form-footer button,
.arvis-account__form button[type="submit"],
.arvis-account__form .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 20px;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 14px !important;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  margin-top: 8px;
  transition: background 0.15s ease;
}

.arvis-account__form .form-footer button:hover,
.arvis-account__form button[type="submit"]:hover,
.arvis-account__form .btn-primary:hover {
  background: var(--arvis-ember-hover, #e64a24) !important;
}

.arvis-account__form .forgot-password {
  font-size: 13px;
  text-align: right;
  margin-top: -6px;
  margin-bottom: 10px;
}

/* Divider "sau" */
.arvis-account__divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 24px 0;
  color: var(--arvis-slate, #6b7280);
  font-size: 12px;
}

.arvis-account__divider::before,
.arvis-account__divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--arvis-line, #e5e7eb);
}

.arvis-account__register-prompt {
  padding: 16px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 14px;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

.arvis-account__register-prompt strong {
  color: var(--arvis-midnight, #111827);
  display: block;
  margin-bottom: 4px;
}

.arvis-account__register-link {
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
  text-decoration: none !important;
}

.arvis-account__register-link:hover {
  text-decoration: underline !important;
}

.arvis-account__register-note {
  display: block;
  margin-top: 4px;
}

/* Right benefit panel Midnight */
.arvis-account__card--benefit {
  background: var(--dark-surface);
  color: #ffffff;
}

.arvis-account__benefit-glow {
  position: absolute;
  bottom: -100px;
  right: -100px;
  width: 320px;
  height: 320px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.2), transparent 70%);
  pointer-events: none;
}

.arvis-account__benefit-inner {
  position: relative;
  z-index: 1;
}

.arvis-account__benefit-logo {
  display: block;
  height: 44px;
  width: auto;
  margin-bottom: 8px;
}

@media (min-width: 768px) {
  .arvis-account__benefit-logo {
    height: 52px;
  }
}

.arvis-account__benefit-reward {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255, 92, 53, 0.15);
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 20px;
}

.arvis-account__benefit-reward-badge {
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.arvis-account__benefit-reward-text {
  font-size: 13px;
  font-weight: 600;
}

.arvis-account__benefit-title {
  font-family: "Inter", sans-serif;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: 24px 0 0;
  color: #ffffff;
}

@media (min-width: 768px) {
  .arvis-account__benefit-title {
    font-size: 36px;
  }
}

.arvis-account__benefit-sub {
  margin-top: 16px;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.6;
}

.arvis-account__benefit-list {
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.arvis-account__benefit-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.arvis-account__benefit-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.arvis-account__benefit-text strong {
  display: block;
  font-size: 15px;
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 4px;
}

.arvis-account__benefit-text p {
  margin: 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.5;
}

.arvis-account__benefit-trust {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}

.arvis-account__benefit-trust svg {
  color: var(--arvis-ember, #ff5c35);
  flex-shrink: 0;
}

/* ---------- 8.3: My Account Dashboard ---------- */
.arvis-dashboard__logout {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.arvis-dashboard__logout:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-dashboard__body {
  padding: 32px 0 64px;
}

@media (min-width: 768px) {
  .arvis-dashboard__body {
    padding: 40px 0 96px;
  }
}

.arvis-dashboard__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

@media (min-width: 576px) {
  .arvis-dashboard__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
}

@media (min-width: 992px) {
  .arvis-dashboard__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.arvis-dashboard__card {
  position: relative;
  display: block;
  padding: 24px;
  background: var(--surface, #ffffff) !important;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 20px;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease,
    border-color 0.15s ease;
}

.arvis-dashboard__card:hover {
  transform: translateY(-2px);
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06), 0 2px 4px rgba(0, 0, 0, 0.04);
}

.arvis-dashboard__card-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(255, 92, 53, 0.08);
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.arvis-dashboard__card-title {
  font-family: "Inter", sans-serif;
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 4px;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.01em;
}

.arvis-dashboard__card-sub {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

.arvis-dashboard__card-arrow {
  position: absolute;
  top: 24px;
  right: 20px;
  color: var(--arvis-line, #e5e7eb);
  transition: color 0.15s ease, transform 0.15s ease;
}

.arvis-dashboard__card:hover .arvis-dashboard__card-arrow {
  color: var(--arvis-ember, #ff5c35);
  transform: translateX(2px);
}

.arvis-dashboard__card--ember {
  background: linear-gradient(
    135deg,
    rgba(255, 92, 53, 0.06),
    rgba(255, 92, 53, 0.02)
  ) !important;
}

.arvis-dashboard__card--ember .arvis-dashboard__card-icon {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
}

.arvis-dashboard__addons {
  margin-top: 24px;
}

.arvis-dashboard__addons:empty {
  display: none;
}

/* ---------- 8.4: Order History list ---------- */
.arvis-orders__back,
.arvis-order-detail__actions-head a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.arvis-orders__back:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-orders__body,
.arvis-order-detail__body {
  padding: 32px 0 64px;
}

@media (min-width: 768px) {
  .arvis-orders__body,
  .arvis-order-detail__body {
    padding: 40px 0 96px;
  }
}

.arvis-orders__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.arvis-orders__card {
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 18px;
  padding: 20px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.arvis-orders__card:hover {
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.arvis-orders__card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.arvis-orders__card-meta {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
}

.arvis-orders__card-ref {
  font-size: 15px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  letter-spacing: 0.01em;
}

.arvis-orders__card-date {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-orders__card-status {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}

.arvis-orders__card-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.arvis-orders__card-totals {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.arvis-orders__card-total-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--arvis-slate, #6b7280);
}

.arvis-orders__card-total-value {
  font-size: 20px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.arvis-orders__card-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.arvis-orders__card-link:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-orders__card-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  background: var(--dark-surface) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
}

.arvis-orders__card-cta:hover {
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
}

.arvis-orders__help {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 24px;
  padding: 18px 20px;
  background: rgba(255, 92, 53, 0.05);
  border: 1px solid rgba(255, 92, 53, 0.15);
  border-radius: 16px;
  color: var(--arvis-midnight, #111827);
}

.arvis-orders__help svg {
  color: var(--arvis-ember, #ff5c35);
  flex-shrink: 0;
}

.arvis-orders__help strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 2px;
}

.arvis-orders__help p {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

/* Empty state */
.arvis-orders__empty {
  max-width: 480px;
  margin: 32px auto;
  text-align: center;
  padding: 48px 24px;
  background: var(--surface, #ffffff);
  border-radius: 24px;
  border: 1px dashed var(--arvis-line, #e5e7eb);
}

.arvis-orders__empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 16px;
}

.arvis-orders__empty-title {
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 8px;
}

.arvis-orders__empty-sub {
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  margin: 0 0 24px;
  line-height: 1.5;
}

.arvis-orders__empty-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 24px;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
}

.arvis-orders__empty-cta:hover {
  background: var(--arvis-ember-hover, #e64a24) !important;
}

/* ---------- 8.4: Order Detail ---------- */
.arvis-order-detail__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}

@media (min-width: 992px) {
  .arvis-order-detail__grid {
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
    align-items: start;
  }
}

.arvis-order-detail__main {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.arvis-order-detail__aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

@media (min-width: 992px) {
  .arvis-order-detail__aside {
    position: sticky;
    top: 84px;
  }
}

.arvis-order-detail__panel {
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 18px;
  padding: 22px;
}

.arvis-order-detail__panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.arvis-order-detail__panel-title {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 16px;
}

.arvis-order-detail__panel-head .arvis-order-detail__panel-title {
  margin-bottom: 0;
}

.arvis-order-detail__aside-title {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
  margin: 0 0 14px;
}

/* Timeline */
.arvis-order-detail__timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

.arvis-order-detail__timeline::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: var(--arvis-line, #e5e7eb);
}

.arvis-order-detail__timeline-item {
  position: relative;
  padding-left: 28px;
  padding-bottom: 18px;
}

.arvis-order-detail__timeline-item:last-child {
  padding-bottom: 0;
}

.arvis-order-detail__timeline-dot {
  position: absolute;
  left: 0;
  top: 4px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 3px solid var(--surface, #ffffff);
  box-shadow: 0 0 0 1px var(--arvis-line, #e5e7eb);
  z-index: 1;
}

.arvis-order-detail__timeline-item.is-current
  .arvis-order-detail__timeline-dot {
  box-shadow: 0 0 0 3px rgba(255, 92, 53, 0.18);
  transform: scale(1.1);
}

.arvis-order-detail__timeline-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.arvis-order-detail__timeline-state {
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
}

.arvis-order-detail__timeline-date {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-order-detail__tracking {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 16px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  border: 1px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827) !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.arvis-order-detail__tracking:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Items list */
.arvis-order-detail__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.arvis-order-detail__item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--arvis-line, #e5e7eb);
}

.arvis-order-detail__item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.arvis-order-detail__item-thumb {
  width: 72px;
  height: 72px;
  border-radius: 12px;
  background: var(--surface-container, #f8f9fa);
  object-fit: cover;
  flex-shrink: 0;
}

.arvis-order-detail__item-thumb--placeholder {
  display: inline-block;
}

.arvis-order-detail__item-body {
  flex: 1;
  min-width: 0;
}

.arvis-order-detail__item-name {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
  line-height: 1.35;
  margin-bottom: 4px;
}

.arvis-order-detail__item-name:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-order-detail__item-ref {
  display: block;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 6px;
}

.arvis-order-detail__item-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-order-detail__item-line strong {
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  font-variant-numeric: tabular-nums;
}

/* Messages */
.arvis-order-detail__messages {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.arvis-order-detail__message {
  padding: 14px 16px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 14px;
}

.arvis-order-detail__message-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-order-detail__message p {
  margin: 0;
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
  line-height: 1.5;
}

/* Totals dl */
.arvis-order-detail__panel--totals {
  background: var(--dark-surface);
  color: #ffffff;
  border-color: transparent;
}

.arvis-order-detail__panel--totals .arvis-order-detail__aside-title {
  color: rgba(255, 255, 255, 0.6);
}

.arvis-order-detail__totals {
  margin: 0;
}

.arvis-order-detail__total-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  font-size: 14px;
}

.arvis-order-detail__total-row dt {
  color: rgba(255, 255, 255, 0.7);
  font-weight: 400;
}

.arvis-order-detail__total-row dd {
  color: #ffffff;
  font-weight: 600;
  margin: 0;
  font-variant-numeric: tabular-nums;
}

.arvis-order-detail__total-row--grand {
  margin-top: 8px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 17px;
}

.arvis-order-detail__total-row--grand dt {
  color: #ffffff;
  font-weight: 700;
}

.arvis-order-detail__total-row--grand dd {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 800;
  font-size: 19px;
}

.arvis-order-detail__invoice-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-top: 18px;
  padding: 12px 20px;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
}

.arvis-order-detail__invoice-btn:hover {
  background: var(--arvis-ember-hover, #e64a24) !important;
  color: #ffffff !important;
}

.arvis-order-detail__address {
  font-style: normal;
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
  line-height: 1.5;
}

.arvis-order-detail__panel--help {
  background: rgba(255, 92, 53, 0.05);
  border-color: rgba(255, 92, 53, 0.15);
}

.arvis-order-detail__panel--help strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 4px;
}

.arvis-order-detail__panel--help p {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

/* ---------- 8.3 cont: Identity (Datele mele) ---------- */
.arvis-identity__card {
  max-width: 720px;
  margin: 0 auto;
  padding: 28px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 20px;
}

@media (min-width: 768px) {
  .arvis-identity__card {
    padding: 40px;
  }
}

/* ---------- 8.3 cont: Addresses (Adresele mele) ---------- */
.arvis-addresses__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

@media (min-width: 576px) {
  .arvis-addresses__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .arvis-addresses__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.arvis-addresses__card {
  display: flex;
  flex-direction: column;
  padding: 22px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 18px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.arvis-addresses__card:hover {
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.arvis-addresses__card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.arvis-addresses__card-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(255, 92, 53, 0.08);
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.arvis-addresses__card-alias {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

.arvis-addresses__card-body {
  flex: 1;
  font-style: normal;
  font-size: 14px;
  line-height: 1.6;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 18px;
}

.arvis-addresses__card-actions {
  display: flex;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--arvis-line, #e5e7eb);
}

.arvis-addresses__card-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-addresses__card-action:hover {
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-addresses__card-action--danger:hover {
  color: #dc2626 !important;
  background: rgba(220, 38, 38, 0.06);
}

.arvis-addresses__add-row {
  margin-top: 20px;
  display: flex;
  justify-content: center;
}

.arvis-addresses__add-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
}

.arvis-addresses__add-btn:hover {
  background: var(--arvis-ember-hover, #e64a24) !important;
  color: #ffffff !important;
}

/* ---------- 8.3 cont: Vouchers (Cupoanele mele) ---------- */
.arvis-vouchers__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

@media (min-width: 576px) {
  .arvis-vouchers__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .arvis-vouchers__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.arvis-vouchers__card {
  position: relative;
  padding: 24px;
  background: linear-gradient(
    135deg,
    var(--arvis-midnight, #111827) 0%,
    #1f2937 100%
  );
  color: #ffffff;
  border-radius: 18px;
  overflow: hidden;
}

.arvis-vouchers__card::before,
.arvis-vouchers__card::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  transform: translateY(-50%);
}

.arvis-vouchers__card::before {
  left: -12px;
}
.arvis-vouchers__card::after {
  right: -12px;
}

.arvis-vouchers__card-value {
  font-size: 32px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--arvis-ember, #ff5c35);
  line-height: 1;
  margin-bottom: 8px;
  font-variant-numeric: tabular-nums;
}

.arvis-vouchers__card-name {
  font-size: 15px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 16px;
  line-height: 1.4;
}

.arvis-vouchers__card-code {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  margin-bottom: 12px;
}

.arvis-vouchers__card-code-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.5);
}

.arvis-vouchers__card-code-value {
  font-family: "Inter", monospace;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #ffffff;
  background: transparent;
  padding: 0;
}

.arvis-vouchers__card-expiry {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
}

.arvis-vouchers__card-expiry svg {
  color: var(--arvis-ember, #ff5c35);
}

/* === Social login (iqitsociallogin) — buton Arvis pe login/register/checkout === */
.iqitsociallogin {
  margin-top: 14px;
  text-align: center;
}

.iqitsociallogin .btn-iqitsociallogin,
.iqitsociallogin .btn-iqitsociallogin:link,
.iqitsociallogin .btn-iqitsociallogin:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 13px 20px;
  border-radius: 12px;
  background: var(--surface) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  color: var(--arvis-midnight, #111827) !important;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: border-color 150ms, box-shadow 150ms, background 150ms;
}

.iqitsociallogin .btn-iqitsociallogin:hover,
.iqitsociallogin .btn-iqitsociallogin:focus {
  background: var(--arvis-snow, #f8f9fa) !important;
  border-color: var(--arvis-slate, #9ca3af) !important;
  color: var(--arvis-midnight, #111827) !important;
  box-shadow: 0 2px 8px rgba(17, 24, 39, 0.06) !important;
}

.iqitsociallogin .btn-iqitsociallogin span {
  display: inline-flex;
  align-items: center;
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}

.iqitsociallogin .btn-iqitsociallogin img {
  width: 18px;
  height: 18px;
  display: block;
}

/* ==========================================================================
   ARVIS — Account Shell (sidebar + breadcrumb + content card)
   Etapa 8 cont · design Arvis-Cont-Canvas (AccountShell wrapper)
   Pas 0 foundation — folosit de identity/addresses/history/credit/coupons/returns
   Hub (my-account) NU foloseste shell — are propriul layout
   ========================================================================== */

/* CSS vars locale: aliasuri/derivate folosite in account pages */
:root {
  --surface: #ffffff;
  --surface-1: #fafafb;
  --surface-2: #e5e7eb;
  --surface-container: #f8f9fa;
  --arvis-line-soft: rgba(17, 24, 39, 0.06);
  --arvis-ember-soft: rgba(255, 92, 53, 0.1);
  --arvis-ember-darker: #c03a18;
  --arvis-jade: #10b981;
}

/* ==========================================================================
   GLOBAL — Tighten Warehouse default breadcrumb spacing (fix minim)
   Default Warehouse: padding 1.33rem + margin-top -2.66rem (pull-up) + bg white.
   Pastram pozitionarea (margin-top negativ + bg white) DAR reducem
   padding-bottom si margin-bottom care creau spatiu in aer dedesubt.
   ========================================================================== */

#wrapper > nav.breadcrumb,
#wrapper nav.breadcrumb {
  margin-bottom: 0 !important;
}

/* Daca breadcrumb-ul ol e gol → ascunde intregul nav (modern browsers cu :has()) */
nav.breadcrumb:has(ol:empty) {
  display: none !important;
}

/* ---------- Shell wrapper ---------- */
.arvis-acc-shell {
  background: var(--page-bg, #f8f9fa);
  min-height: 60vh;
}

.arvis-acc-shell__breadcrumb {
  padding: 24px 0 0;
}

.arvis-acc-shell__crumb {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-acc-shell__crumb a {
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.arvis-acc-shell__crumb a:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-acc-shell__crumb-sep {
  color: var(--arvis-line, #e5e7eb);
}

.arvis-acc-shell__crumb-current {
  color: var(--arvis-midnight, #111827);
  font-weight: 600;
}

.arvis-acc-shell__body {
  padding: 8px 0 64px;
}

@media (min-width: 992px) {
  .arvis-acc-shell__body {
    padding: 16px 0 96px;
  }
}

.arvis-acc-shell__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-acc-shell__grid {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 32px;
  }
}

.arvis-acc-shell__main {
  min-width: 0;
}

.arvis-acc-shell__card {
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
  padding: 20px;
}

@media (min-width: 768px) {
  .arvis-acc-shell__card {
    padding: 32px;
  }
}

.arvis-acc-shell__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 20px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--arvis-line-soft);
  flex-wrap: wrap;
}

.arvis-acc-shell__title {
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

@media (min-width: 768px) {
  .arvis-acc-shell__title {
    font-size: 32px;
  }
}

.arvis-acc-shell__head-extra {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

/* ---------- Sidebar (desktop) ---------- */
.arvis-acc-sidebar {
  display: none;
}

@media (min-width: 992px) {
  .arvis-acc-sidebar {
    position: sticky;
    top: 24px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: var(--surface, #ffffff);
    border: 1px solid var(--arvis-line-soft);
    border-radius: 16px;
    padding: 12px;
  }
}

.arvis-acc-sidebar__user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 12px 14px;
  border-bottom: 1px solid var(--arvis-line-soft);
  margin-bottom: 8px;
}

.arvis-acc-sidebar__avatar {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: var(--dark-surface);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 16px;
  flex-shrink: 0;
  text-transform: uppercase;
}

.arvis-acc-sidebar__user-meta {
  min-width: 0;
  flex: 1;
}

.arvis-acc-sidebar__user-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.arvis-acc-sidebar__user-email {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.arvis-acc-sidebar__nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.arvis-acc-sidebar__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
  background: transparent;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-acc-sidebar__item:hover {
  background: var(--surface-container, #f8f9fa);
}

.arvis-acc-sidebar__item.is-active {
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
}

.arvis-acc-sidebar__icon {
  flex-shrink: 0;
  display: inline-flex;
  color: var(--arvis-slate, #6b7280);
}

.arvis-acc-sidebar__item.is-active .arvis-acc-sidebar__icon {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-acc-sidebar__label {
  flex: 1;
  line-height: 1.25;
}

.arvis-acc-sidebar__chev {
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
}

.arvis-acc-sidebar__item--disabled {
  opacity: 0.5;
  pointer-events: none;
}

.arvis-acc-sidebar__soon {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--arvis-slate, #6b7280);
  background: var(--surface-container, #f8f9fa);
  padding: 2px 8px;
  border-radius: 999px;
}

.arvis-acc-sidebar__footer {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--arvis-line-soft);
}

.arvis-acc-sidebar__item--logout {
  color: var(--arvis-slate, #6b7280) !important;
}

.arvis-acc-sidebar__item--logout:hover {
  color: #dc2626 !important;
  background: rgba(220, 38, 38, 0.05);
}

/* ---------- Mobile nav (chip-row) ---------- */
.arvis-acc-mobile-nav {
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 14px;
  padding: 10px 4px;
  margin-bottom: 16px;
}

@media (min-width: 992px) {
  .arvis-acc-mobile-nav {
    display: none;
  }
}

.arvis-acc-mobile-nav__scroll {
  display: flex;
  gap: 6px;
  padding: 0 12px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.arvis-acc-mobile-nav__scroll::-webkit-scrollbar {
  display: none;
}

.arvis-acc-mobile-nav__chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.arvis-acc-mobile-nav__chip:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-acc-mobile-nav__chip.is-active {
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
}

.arvis-acc-mobile-nav__chip.is-active svg {
  color: #ffffff;
}

/* ==========================================================================
   ARVIS — Hub Dashboard (my-account.tpl)
   Pas 1 · design AccountHubC pages-account.jsx
   Standalone layout (NO sidebar). Hero Midnight + 2-col body
   ========================================================================== */

.arvis-hub {
  background: var(--page-bg, #f8f9fa);
  min-height: 60vh;
}

/* ---------- Hero Midnight ---------- */
.arvis-hub__hero-wrap {
  padding: 8px 0 0;
}

@media (min-width: 768px) {
  .arvis-hub__hero-wrap {
    padding: 16px 0 0;
  }
}

.arvis-hub__hero {
  position: relative;
  overflow: hidden;
  background: var(--dark-surface);
  color: #ffffff;
  border-radius: 20px;
  padding: 24px;
}

@media (min-width: 768px) {
  .arvis-hub__hero {
    border-radius: 28px;
    padding: 40px;
  }
}

.arvis-hub__hero-glow {
  position: absolute;
  bottom: -120px;
  right: -120px;
  width: 360px;
  height: 360px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.18), transparent 70%);
  pointer-events: none;
}

.arvis-hub__hero-top {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.arvis-hub__hero-id {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
  flex: 1;
}

.arvis-hub__avatar {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: -0.02em;
}

@media (min-width: 768px) {
  .arvis-hub__avatar {
    width: 64px;
    height: 64px;
    font-size: 28px;
  }
}

.arvis-hub__hero-meta {
  min-width: 0;
  flex: 1;
}

.arvis-hub__hero-eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-hub__hero-title {
  font-family: "Inter", sans-serif;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: #ffffff;
  margin: 4px 0 0;
}

@media (min-width: 768px) {
  .arvis-hub__hero-title {
    font-size: 40px;
  }
}

.arvis-hub__hero-sub {
  margin-top: 6px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.7);
}

.arvis-hub__logout {
  display: none;
}

@media (min-width: 768px) {
  .arvis-hub__logout {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 999px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none !important;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    flex-shrink: 0;
  }

  .arvis-hub__logout:hover {
    border-color: var(--arvis-ember, #ff5c35);
    color: var(--arvis-ember, #ff5c35) !important;
  }
}

/* Stats row */
.arvis-hub__stats {
  position: relative;
  margin-top: 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

@media (min-width: 768px) {
  .arvis-hub__stats {
    margin-top: 36px;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
  }
}

.arvis-hub__stat {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 16px;
}

@media (min-width: 768px) {
  .arvis-hub__stat {
    padding: 20px;
  }
}

.arvis-hub__stat-value {
  font-size: 22px;
  font-weight: 800;
  color: #ffffff;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.015em;
  line-height: 1.1;
}

@media (min-width: 768px) {
  .arvis-hub__stat-value {
    font-size: 28px;
  }
}

.arvis-hub__stat-label {
  margin-top: 6px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.85);
  font-weight: 600;
}

.arvis-hub__stat-sub {
  margin-top: 2px;
  font-size: 11px;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-hub__stat-link {
  color: var(--arvis-ember, #ff5c35) !important;
  text-decoration: none !important;
  font-weight: 600;
}

.arvis-hub__stat-link:hover {
  text-decoration: underline !important;
}

/* ---------- Body 2-col ---------- */
.arvis-hub__body {
  padding: 24px 0 48px;
}

@media (min-width: 768px) {
  .arvis-hub__body {
    padding: 40px 0 96px;
  }
}

.arvis-hub__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-hub__grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: 32px;
  }
}

.arvis-hub__section-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 16px;
}

.arvis-hub__section-title {
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

@media (min-width: 768px) {
  .arvis-hub__section-title {
    font-size: 24px;
  }
}

.arvis-hub__section-title--right {
  margin-bottom: 16px;
}

.arvis-hub__section-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-ember, #ff5c35) !important;
  text-decoration: none !important;
}

.arvis-hub__section-link:hover {
  text-decoration: underline !important;
}

/* Recent orders empty state */
.arvis-hub__recent {
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
  overflow: hidden;
}

.arvis-hub__recent-empty {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  transition: background 0.15s ease;
}

.arvis-hub__recent-empty:hover {
  background: var(--surface-container, #f8f9fa);
}

.arvis-hub__recent-empty-icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.arvis-hub__recent-empty-body {
  flex: 1;
}

.arvis-hub__recent-empty-body strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 4px;
}

.arvis-hub__recent-empty-body p {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

.arvis-hub__recent-empty-arrow {
  color: var(--arvis-slate, #6b7280);
  transition: color 0.15s ease, transform 0.15s ease;
}

.arvis-hub__recent-empty:hover .arvis-hub__recent-empty-arrow {
  color: var(--arvis-ember, #ff5c35);
  transform: translateX(2px);
}

/* Right: Quick actions */
.arvis-hub__col-right {
  display: flex;
  flex-direction: column;
}

.arvis-hub__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.arvis-hub__action {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 14px;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  transition: border-color 0.15s ease, transform 0.15s ease,
    box-shadow 0.15s ease;
}

.arvis-hub__action:hover {
  border-color: var(--arvis-ember, #ff5c35);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

.arvis-hub__action-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.arvis-hub__action-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-midnight, #111827);
  display: flex;
  align-items: center;
  justify-content: center;
}

.arvis-hub__action:hover .arvis-hub__action-icon {
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35);
}

.arvis-hub__action-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
}

/* WhatsApp help banner */
.arvis-hub__help {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 16px;
  padding: 20px;
  background: var(--arvis-ember-soft);
  border: 1px solid var(--arvis-ember, #ff5c35);
  box-shadow: 0 0 0 1px var(--arvis-ember, #ff5c35);
  border-radius: 14px;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  transition: background 0.15s ease;
}

.arvis-hub__help:hover {
  background: rgba(255, 92, 53, 0.16);
}

.arvis-hub__help-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #25d366;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.arvis-hub__help-body {
  flex: 1;
}

.arvis-hub__help-body strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 2px;
}

.arvis-hub__help-body p {
  margin: 0;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-hub__help-arrow {
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
}

/* Mobile-only logout pill sub WhatsApp help (header logout e vizibil doar >=768px) */
.arvis-hub__logout-mobile {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding: 12px 22px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 999px;
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none !important;
  transition: border-color 0.15s ease, color 0.15s ease;
  align-self: flex-start;
}

.arvis-hub__logout-mobile:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

@media (min-width: 768px) {
  .arvis-hub__logout-mobile {
    display: none;
  }
}

/* Addons collapsible */
.arvis-hub__addons {
  margin-top: 16px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 14px;
  padding: 16px 20px;
}

.arvis-hub__addons > summary {
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-slate, #6b7280);
  list-style: none;
}

.arvis-hub__addons > summary::-webkit-details-marker {
  display: none;
}

.arvis-hub__addons[open] {
  padding-bottom: 20px;
}

/* ==========================================================================
   ARVIS — Identity / Informații (Pas 2)
   Restilizare PS9 native customer form la MD3 filled fields + Danger zone
   ========================================================================== */

.arvis-info__lead {
  margin: 0 0 24px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
  max-width: 640px;
}

/* ---------- Form: reset PS9 Bootstrap row → MD3 vertical ---------- */
/* PS9 customer-form.tpl produce structura:
   <form>
     <section> (date personale group)
       <div class="form-group row align-items-center">
         <label class="col-md-2 col-form-label">Prenume</label>
         <div class="col-md-8 js-input-column">
           <input class="form-control">
         </div>
         <div class="col-md-2 form-control-comment"></div>
       </div>
     </section>
     <footer class="form-footer">
       <button class="btn btn-primary">Salvează</button>
     </footer>
   </form>
*/

.arvis-info-form form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.arvis-info-form section {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px;
  background: var(--surface-1, #f8f9fa);
  border-radius: 14px;
  border: 1px solid var(--arvis-line-soft);
}

.arvis-info-form .form-group.row {
  display: block;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
}

.arvis-info-form .form-group.row > [class*="col-"] {
  flex: 0 0 100%;
  max-width: 100%;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  margin: 0;
}

.arvis-info-form .form-group.row > .form-control-comment:empty,
.arvis-info-form .form-group.row > .form-control-comment {
  display: none;
}

.arvis-info-form .form-group.row > .form-control-comment:not(:empty) {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

/* Hide empty label rows for checkbox groups (psgdpr, optin) */
.arvis-info-form .form-group.row:has(.custom-checkbox) > .col-form-label,
.arvis-info-form .form-group.row:has([type="checkbox"]) > .col-form-label {
  display: none !important;
}

/* Label - MD3 small uppercase floating-like */
.arvis-info-form label,
.arvis-info-form .col-form-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 6px;
  padding: 0;
  line-height: 1.4;
}

.arvis-info-form .col-form-label.required::after {
  content: " *";
  color: var(--arvis-ember, #ff5c35);
}

/* Inputs — MD3 filled */
.arvis-info-form .form-control,
.arvis-info-form input[type="email"],
.arvis-info-form input[type="text"],
.arvis-info-form input[type="password"],
.arvis-info-form input[type="tel"],
.arvis-info-form input[type="date"],
.arvis-info-form select,
.arvis-info-form textarea {
  width: 100%;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 14px;
  padding: 14px 16px;
  font-size: 15px;
  font-family: "Inter", sans-serif;
  color: var(--arvis-midnight, #111827);
  background: var(--surface, #ffffff);
  transition: border-color 0.15s ease, background 0.15s ease,
    box-shadow 0.15s ease;
}

/* Fix taiere text pe select (tema forteaza height:2.625rem + padding-ul nostru => text taiat). */
.arvis-info-form select,
.arvis-info-form select.form-control,
.arvis-info-form .form-control-select {
  height: auto;
  line-height: 1.5;
}

.arvis-info-form .form-control:focus,
.arvis-info-form input:focus,
.arvis-info-form select:focus,
.arvis-info-form textarea:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
  background: var(--surface, #ffffff);
  box-shadow: 0 0 0 3px var(--arvis-ember-soft);
}

/* Radio buttons (gender) — chip style */
.arvis-info-form .radio-inline,
.arvis-info-form .form-check.form-check-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  margin-right: 8px;
  margin-bottom: 4px;
  cursor: pointer;
  transition: border-color 0.15s ease;
}

.arvis-info-form .radio-inline:hover,
.arvis-info-form .form-check.form-check-inline:hover {
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-info-form .radio-inline input[type="radio"],
.arvis-info-form .form-check input[type="radio"] {
  accent-color: var(--arvis-ember, #ff5c35);
  cursor: pointer;
}

.arvis-info-form .radio-inline label,
.arvis-info-form .form-check label {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
  color: var(--arvis-midnight, #111827);
  cursor: pointer;
}

/* Password show toggle */
.arvis-info-form .input-group,
.arvis-info-form .js-parent-focus {
  position: relative;
  display: block;
  width: 100%;
}

.arvis-info-form .input-group > .form-control,
.arvis-info-form .input-group input.form-control {
  width: 100% !important;
  padding-right: 52px !important;
  border-radius: 14px !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
}

.arvis-info-form .input-group-append,
.arvis-info-form .input-group-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  background: transparent;
  z-index: 2;
}

.arvis-info-form .input-group-append .btn,
.arvis-info-form .input-group-btn .btn {
  background: transparent !important;
  border: none !important;
  color: var(--arvis-slate, #6b7280) !important;
  padding: 6px 10px !important;
  margin: 0 !important;
  font-size: 16px;
  border-radius: 8px !important;
  box-shadow: none !important;
}

.arvis-info-form .input-group-append .btn:hover,
.arvis-info-form .input-group-btn .btn:hover {
  background: var(--surface-container, #f8f9fa) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-info-form .input-group-append .btn .fa,
.arvis-info-form .input-group-append .btn i {
  font-size: 16px;
  color: var(--arvis-slate, #6b7280) !important;
}

.arvis-info-form .input-group-append .btn:hover .fa,
.arvis-info-form .input-group-append .btn:hover i {
  color: var(--arvis-ember, #ff5c35) !important;
}

/* Custom checkbox (psgdpr, newsletter) */
.arvis-info-form .custom-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--arvis-slate, #6b7280);
  cursor: pointer;
}

.arvis-info-form .custom-checkbox input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
  z-index: 1;
}

.arvis-info-form .custom-checkbox > span:not([class]) {
  position: relative;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  border-radius: 5px;
  background: var(--surface, #ffffff);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.arvis-info-form .custom-checkbox > span:not([class]) .fa,
.arvis-info-form .custom-checkbox > span:not([class]) i {
  font-size: 10px;
  color: #ffffff !important;
  opacity: 0;
}

.arvis-info-form .custom-checkbox input[type="checkbox"]:checked + span {
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-info-form .custom-checkbox input[type="checkbox"]:checked + span .fa,
.arvis-info-form .custom-checkbox input[type="checkbox"]:checked + span i {
  opacity: 1;
}

.arvis-info-form .custom-checkbox label {
  font-size: 13px;
  font-weight: 400;
  text-transform: none;
  letter-spacing: normal;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
  padding: 0;
  line-height: 1.5;
  cursor: pointer;
}

.arvis-info-form .custom-checkbox label a {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 600;
  text-decoration: none;
}

.arvis-info-form .custom-checkbox label a:hover {
  text-decoration: underline;
}

/* Submit button */
.arvis-info-form .form-footer,
.arvis-info-form footer {
  margin-top: 8px;
  padding: 0;
  background: transparent;
  border: none;
}

.arvis-info-form .form-footer button,
.arvis-info-form button[type="submit"],
.arvis-info-form .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease;
}

.arvis-info-form .form-footer button:hover,
.arvis-info-form button[type="submit"]:hover,
.arvis-info-form .btn-primary:hover {
  background: var(--arvis-ember-hover, #e64a24) !important;
}

/* PS9 section separators (vizual sectiuni via h2-like before specific groups) */
.arvis-info-form section + section {
  margin-top: 4px;
}

/* Help text / explanations */
.arvis-info-form small,
.arvis-info-form .form-text {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  font-style: italic;
}

/* ---------- Danger zone ---------- */
.arvis-info-danger {
  margin-top: 32px;
  padding: 20px;
  background: rgba(220, 38, 38, 0.04);
  border: 1px solid rgba(220, 38, 38, 0.15);
  border-radius: 14px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.arvis-info-danger__body {
  flex: 1;
  min-width: 200px;
}

.arvis-info-danger__body strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 4px;
}

.arvis-info-danger__body p {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

.arvis-info-danger__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  border: 1.5px solid #dc2626;
  color: #dc2626 !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-info-danger__btn:hover {
  background: #dc2626;
  color: #ffffff !important;
}

/* ==========================================================================
   ARVIS — Order History (Pas 3)
   Card row 4-col cu data + meta + total + actions
   ========================================================================== */

.arvis-orders-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.arvis-orders-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 16px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease,
    transform 0.15s ease;
}

.arvis-orders-row:hover {
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

@media (min-width: 768px) {
  .arvis-orders-row {
    grid-template-columns: 140px minmax(0, 1fr) auto auto;
    gap: 20px;
    padding: 20px;
    align-items: center;
  }
}

/* Date column */
.arvis-orders-row__date {
  text-align: left;
  color: var(--arvis-slate, #6b7280);
  font-size: 12px;
  font-weight: 600;
}

@media (min-width: 768px) {
  .arvis-orders-row__date {
    text-align: center;
    padding-right: 16px;
    border-right: 1px solid var(--arvis-line-soft);
  }
}

.arvis-orders-row__date-text {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.005em;
}

@media (min-width: 768px) {
  .arvis-orders-row__date-text {
    font-size: 14px;
  }
}

/* Meta column */
.arvis-orders-row__meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.arvis-orders-row__ref {
  font-size: 13px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827) !important;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.arvis-orders-row__ref:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-orders-row__sub {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-orders-row__sub-sep {
  color: var(--arvis-line, #e5e7eb);
}

.arvis-orders-row__status {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Total column */
.arvis-orders-row__total {
  font-size: 18px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .arvis-orders-row__total {
    text-align: right;
  }
}

/* Actions column */
.arvis-orders-row__actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .arvis-orders-row__actions {
    justify-content: flex-end;
    flex-wrap: nowrap;
  }
}

.arvis-orders-row__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  border: 1px solid transparent;
}

.arvis-orders-row__btn--tonal {
  background: var(--surface-container, #f8f9fa);
  border-color: var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827) !important;
}

.arvis-orders-row__btn--tonal:hover {
  background: var(--surface, #ffffff);
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-orders-row__btn--filled {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
}

.arvis-orders-row__btn--filled:hover {
  background: var(--arvis-ember-hover, #e64a24);
  color: #ffffff !important;
}

/* Help block jos — clickable WhatsApp link */
.arvis-orders-help {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 24px;
  padding: 18px 20px;
  background: var(--arvis-ember-soft);
  border: 1px solid rgba(255, 92, 53, 0.15);
  border-radius: 14px;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none !important;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.arvis-orders-help:hover {
  background: rgba(255, 92, 53, 0.16);
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-orders-help svg {
  color: var(--arvis-ember, #ff5c35);
  flex-shrink: 0;
}

.arvis-orders-help strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 2px;
}

.arvis-orders-help p {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

/* Empty state */
.arvis-orders-empty {
  text-align: center;
  padding: 48px 24px;
  background: var(--surface-1, #f8f9fa);
  border-radius: 16px;
  border: 1px dashed var(--arvis-line, #e5e7eb);
  max-width: 480px;
  margin: 0 auto;
}

.arvis-orders-empty__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 16px;
}

.arvis-orders-empty__title {
  font-family: "Inter", sans-serif;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 8px;
}

.arvis-orders-empty__sub {
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  margin: 0 0 24px;
  line-height: 1.5;
}

.arvis-orders-empty__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 24px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
}

.arvis-orders-empty__cta:hover {
  background: var(--arvis-ember-hover, #e64a24);
  color: #ffffff !important;
}

/* ==========================================================================
   ARVIS — Addresses List (Pas 4)
   Grid 2-col cu badge Implicita + dashed Adauga card
   ========================================================================== */

.arvis-addr-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

@media (min-width: 768px) {
  .arvis-addr-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.arvis-addr-card {
  position: relative;
  padding: 20px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 16px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.arvis-addr-card:hover {
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.arvis-addr-card.is-default {
  border-color: var(--arvis-ember, #ff5c35);
  border-width: 1.5px;
}

.arvis-addr-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.arvis-addr-card__head-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.arvis-addr-card__icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.arvis-addr-card__alias {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

.arvis-addr-card__badge {
  display: inline-flex;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.arvis-addr-card__actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

.arvis-addr-card__icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: transparent;
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-addr-card__icon-btn:hover {
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-addr-card__icon-btn--danger:hover {
  background: rgba(220, 38, 38, 0.06);
  color: #dc2626 !important;
}

.arvis-addr-card__body {
  font-style: normal;
  font-size: 14px;
  line-height: 1.55;
  color: var(--arvis-midnight, #111827);
}

/* Add card (dashed) */
.arvis-addr-card-add {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 200px;
  padding: 20px;
  background: var(--surface-1, #f8f9fa);
  border: 1.5px dashed var(--arvis-line, #e5e7eb);
  border-radius: 16px;
  color: var(--arvis-slate, #6b7280);
  text-decoration: none !important;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.arvis-addr-card-add:hover {
  border-color: var(--arvis-ember, #ff5c35);
  background: var(--arvis-ember-soft);
}

.arvis-addr-card-add__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  color: var(--arvis-midnight, #111827);
}

.arvis-addr-card-add:hover .arvis-addr-card-add__icon {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
}

.arvis-addr-card-add__title {
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
}

.arvis-addr-card-add__sub {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  text-align: center;
}

/* ==========================================================================
   ARVIS — Address Form (Pas 5)
   2-col: form (left 1.5fr) + GDPR aside (right 1fr)
   ========================================================================== */

.arvis-addr-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-addr-form-grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: 32px;
  }
}

.arvis-addr-form-grid__aside {
  display: none;
}

@media (min-width: 992px) {
  .arvis-addr-form-grid__aside {
    display: block;
  }
}

.arvis-addr-aside {
  position: sticky;
  top: 24px;
  background: var(--surface-1, #f8f9fa);
  border-radius: 16px;
  padding: 24px;
}

.arvis-addr-aside__eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 12px;
}

.arvis-addr-aside__title {
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

.arvis-addr-aside__sub {
  margin: 8px 0 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

.arvis-addr-aside__list {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.arvis-addr-aside__list li {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 13px;
  color: var(--arvis-midnight, #111827);
}

.arvis-addr-aside__icon {
  color: var(--arvis-jade);
  display: inline-flex;
  flex-shrink: 0;
}

/* ==========================================================================
   ARVIS — Order Detail (Pas 6)
   Banner status + tracking timeline + items + summary aside Midnight
   ========================================================================== */

.arvis-od-banner {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 20px;
  background: var(--arvis-ember-soft);
  border: 1px solid var(--arvis-ember, #ff5c35);
  border-radius: 14px;
  margin-bottom: 24px;
}

.arvis-od-banner__icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.arvis-od-banner__body {
  flex: 1;
  min-width: 200px;
}

.arvis-od-banner__body strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
}

.arvis-od-banner__body p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-od-banner__body strong + p strong {
  display: inline;
  color: var(--arvis-midnight, #111827);
}

.arvis-od-banner__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
}

.arvis-od-banner__btn:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

.arvis-od-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-od-grid {
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  }
}

.arvis-od-main {
  display: flex;
  flex-direction: column;
  gap: 28px;
  min-width: 0;
}

.arvis-od-section__title {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 16px;
}

/* Timeline */
.arvis-od-timeline {
  list-style: none;
  margin: 0;
  padding: 0 0 0 24px;
  position: relative;
}

.arvis-od-timeline::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 12px;
  bottom: 12px;
  width: 2px;
  background: var(--arvis-line, #e5e7eb);
}

.arvis-od-timeline__item {
  position: relative;
  padding-bottom: 18px;
}

.arvis-od-timeline__item:last-child {
  padding-bottom: 0;
}

.arvis-od-timeline__dot {
  position: absolute;
  left: -23px;
  top: 2px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: var(--surface-2);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

/* Pasi completati — Jade verde cu checkmark alb */
.arvis-od-timeline__item.is-done .arvis-od-timeline__dot {
  background: var(--arvis-jade, #10b981);
}

/* Pas curent — Ember cu pulse alb si halo Ember-soft */
.arvis-od-timeline__item.is-current .arvis-od-timeline__dot {
  background: var(--arvis-ember, #ff5c35);
  box-shadow: 0 0 0 4px var(--arvis-ember-soft);
}

.arvis-od-timeline__pulse {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--surface);
}

.arvis-od-timeline__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.arvis-od-timeline__body strong {
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
}

.arvis-od-timeline__item.is-current .arvis-od-timeline__body strong {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-od-timeline__body span {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

/* Items */
.arvis-od-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.arvis-od-item {
  display: grid;
  grid-template-columns: 72px 1fr auto;
  gap: 14px;
  padding: 12px 0;
  border-top: 1px solid var(--arvis-line-soft);
  align-items: center;
}

.arvis-od-item:first-child {
  border-top: none;
  padding-top: 0;
}

.arvis-od-item__thumb {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  background: var(--surface-container, #f8f9fa);
  object-fit: cover;
  flex-shrink: 0;
}

.arvis-od-item__body {
  min-width: 0;
}

.arvis-od-item__brand {
  font-size: 11px;
  font-weight: 700;
  color: var(--arvis-slate, #6b7280);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.arvis-od-item__name {
  display: block;
  margin-top: 2px;
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827) !important;
  line-height: 1.4;
  text-decoration: none !important;
}

.arvis-od-item__name:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-od-item__meta {
  margin-top: 4px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-od-item__price {
  font-size: 15px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.arvis-od-address {
  font-style: normal;
  font-size: 14px;
  line-height: 1.6;
  color: var(--arvis-midnight, #111827);
}

.arvis-od-messages {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.arvis-od-message {
  padding: 14px 16px;
  background: var(--surface-1, #f8f9fa);
  border-radius: 14px;
}

.arvis-od-message__head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-od-message p {
  margin: 0;
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
  line-height: 1.5;
}

/* Summary aside — LIGHT theme cu fundal off-white #FAFAFB (per design Arvis-Cont-Canvas) */
.arvis-od-aside {
  background: var(--surface-1, #fafafb);
  color: var(--arvis-midnight, #111827);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
  padding: 24px;
}

@media (min-width: 992px) {
  .arvis-od-aside {
    position: sticky;
    top: 24px;
  }
}

.arvis-od-aside__title {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0 0 14px;
}

.arvis-od-totals {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.arvis-od-totals__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
}

.arvis-od-totals__row dt {
  color: var(--arvis-slate, #6b7280);
  font-weight: 400;
}

.arvis-od-totals__row dd {
  margin: 0;
  color: var(--arvis-midnight, #111827);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.arvis-od-totals__row--ember dt,
.arvis-od-totals__row--ember dd {
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
}

.arvis-od-totals__row--grand {
  margin-top: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--arvis-line-soft);
}

.arvis-od-totals__row--grand dt {
  font-size: 13px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.arvis-od-totals__row--grand dd {
  font-size: 22px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.015em;
}

.arvis-od-aside__payment {
  margin-top: 6px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-od-aside__actions {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.arvis-od-aside__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  border: 1px solid transparent;
}

.arvis-od-aside__btn--filled {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
}

.arvis-od-aside__btn--filled:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

.arvis-od-aside__btn--outlined {
  background: transparent;
  border: 1px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827) !important;
}

.arvis-od-aside__btn--outlined:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-od-aside__btn--text {
  background: transparent;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-od-aside__btn--text:hover {
  background: rgba(255, 92, 53, 0.08);
}

/* Back to orders button (header extra) */
.arvis-od-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-slate, #6b7280) !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.arvis-od-back:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

/* ==========================================================================
   ARVIS — Return / RMA form (V2.12)
   Formular retur inline pe order-detail (flux nativ PS submitReturnMerchandise)
   ========================================================================== */

.arvis-od-return {
  scroll-margin-top: 90px;
}

.arvis-od-return__intro {
  font-size: 14px;
  line-height: 1.55;
  color: var(--arvis-slate, #6b7280);
  margin: 0 0 16px;
}

.arvis-od-return__items {
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.arvis-od-return__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 12px;
  background: var(--surface, #ffffff);
  transition: border-color 0.15s ease;
}

.arvis-od-return__row:hover {
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-od-return__check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  cursor: pointer;
  flex: 1 1 auto;
  min-width: 0;
}

.arvis-od-return__check input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--arvis-ember, #ff5c35);
  flex: 0 0 auto;
  cursor: pointer;
}

.arvis-od-return__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
}

.arvis-od-return__qty {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.arvis-od-return__qty label {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
}

.arvis-od-return__qty input[type="number"] {
  width: 64px;
  padding: 7px 10px;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 8px;
  font-size: 14px;
  text-align: center;
}

.arvis-od-return__qty input[type="number"]:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-od-return__reason {
  margin-bottom: 18px;
}

.arvis-od-return__reason label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 6px;
}

.arvis-od-return__reason label span {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-od-return__reason textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 10px;
  font-size: 14px;
  font-family: inherit;
  line-height: 1.5;
  resize: vertical;
}

.arvis-od-return__reason textarea:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-od-return__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 22px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease;
}

.arvis-od-return__submit:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

@media (max-width: 575px) {
  .arvis-od-return__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .arvis-od-return__qty {
    align-self: stretch;
    justify-content: space-between;
  }

  .arvis-od-return__submit {
    width: 100%;
  }
}

/* ==========================================================================
   ARVIS — Coupons / Cupoane (Pas 7)
   3 sectiuni Active/Viitoare/Folosite + card cupon cu strip Ember
   ========================================================================== */

.arvis-coupons-section {
  margin-top: 8px;
}

.arvis-coupons-section__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.arvis-coupons-section__title {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

.arvis-coupons-section__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35);
  font-size: 12px;
  font-weight: 700;
}

.arvis-coupons-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

@media (min-width: 768px) {
  .arvis-coupons-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.arvis-coupon {
  display: grid;
  grid-template-columns: 96px 1fr;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.arvis-coupon:hover {
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.arvis-coupon__strip {
  background: linear-gradient(
    135deg,
    var(--arvis-ember, #ff5c35) 0%,
    var(--arvis-ember-hover, #e64a24) 100%
  );
  color: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 16px 10px;
  text-align: center;
  position: relative;
}

.arvis-coupon__strip::after {
  content: "";
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
}

.arvis-coupon__strip-value {
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.arvis-coupon__strip-label {
  margin-top: 4px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.85;
}

.arvis-coupon__body {
  padding: 16px 20px;
  min-width: 0;
}

.arvis-coupon__name {
  font-family: "Inter", sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 10px;
  line-height: 1.35;
}

.arvis-coupon__code-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--surface-1, #f8f9fa);
  border-radius: 10px;
  margin-bottom: 10px;
}

.arvis-coupon__code-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-slate, #6b7280);
}

.arvis-coupon__code {
  flex: 1;
  font-family: "Inter", monospace;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--arvis-midnight, #111827);
  background: transparent;
  padding: 0;
}

.arvis-coupon__copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: transparent;
  border: none;
  color: var(--arvis-slate, #6b7280);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-coupon__copy:hover {
  background: var(--surface, #ffffff);
  color: var(--arvis-ember, #ff5c35);
}

.arvis-coupon__copy-icon-default {
  display: inline-block;
}

.arvis-coupon__copy-icon-done {
  display: none;
}

.arvis-coupon__copy.is-copied {
  color: var(--arvis-jade);
}

.arvis-coupon__copy.is-copied .arvis-coupon__copy-icon-default {
  display: none;
}

.arvis-coupon__copy.is-copied .arvis-coupon__copy-icon-done {
  display: inline-block;
}

.arvis-coupon__meta {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.arvis-coupon__meta li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-coupon__meta li svg {
  color: var(--arvis-ember, #ff5c35);
  flex-shrink: 0;
}

.arvis-coupon__meta strong {
  color: var(--arvis-midnight, #111827);
  font-weight: 600;
}

.arvis-coupons-help {
  margin-top: 32px;
  padding: 20px;
  background: var(--surface-1, #f8f9fa);
  border-radius: 14px;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

.arvis-coupons-help strong {
  display: block;
  margin-bottom: 6px;
  color: var(--arvis-midnight, #111827);
  font-weight: 700;
}

.arvis-coupons-help p {
  margin: 0;
}

/* ==========================================================================
   ARVIS — Credit Slips (Pas 8)
   Balance card Midnight + lista note + help block
   ========================================================================== */

.arvis-credit-balance {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  padding: 24px;
  background: var(--dark-surface);
  color: #ffffff;
  border-radius: 16px;
  margin-bottom: 24px;
  align-items: center;
}

@media (min-width: 768px) {
  .arvis-credit-balance {
    grid-template-columns: 1fr auto;
  }
}

.arvis-credit-balance__eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-credit-balance__value {
  margin-top: 8px;
  font-size: 36px;
  font-weight: 900;
  color: #ffffff;
  line-height: 1;
  letter-spacing: -0.025em;
  font-variant-numeric: tabular-nums;
}

@media (min-width: 768px) {
  .arvis-credit-balance__value {
    font-size: 48px;
  }
}

.arvis-credit-balance__sub {
  margin: 8px 0 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.5;
}

.arvis-credit-balance__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
  justify-self: stretch;
}

@media (min-width: 768px) {
  .arvis-credit-balance__btn {
    justify-self: end;
  }
}

.arvis-credit-balance__btn:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

.arvis-credit-section-head {
  margin-bottom: 12px;
}

.arvis-credit-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.arvis-credit-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  padding: 16px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 14px;
  align-items: center;
}

@media (min-width: 768px) {
  .arvis-credit-item {
    grid-template-columns: 1fr auto;
  }
}

.arvis-credit-item__head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.arvis-credit-item__id {
  font-size: 11px;
  font-weight: 700;
  color: var(--arvis-slate, #6b7280);
  letter-spacing: 0.04em;
}

.arvis-credit-item__sep {
  color: var(--arvis-line, #e5e7eb);
}

.arvis-credit-item__date {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-credit-item__source {
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
}

.arvis-credit-item__right {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: space-between;
}

@media (min-width: 768px) {
  .arvis-credit-item__right {
    justify-content: flex-end;
  }
}

.arvis-credit-item__amount {
  font-size: 22px;
  font-weight: 800;
  color: var(--arvis-ember, #ff5c35);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.arvis-credit-item__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  border: 1px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827) !important;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none !important;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.arvis-credit-item__btn:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-credit-help {
  margin-top: 32px;
  padding: 20px;
  background: var(--surface-1, #f8f9fa);
  border-radius: 14px;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

.arvis-credit-help strong {
  color: var(--arvis-midnight, #111827);
  display: block;
  margin-bottom: 6px;
  font-weight: 700;
}

.arvis-credit-help p {
  margin: 0;
}

/* ==========================================================================
   ARVIS — Returns List (Pas 9)
   Policy banner + card row per retur
   ========================================================================== */

.arvis-returns-policy {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: var(--arvis-ember-soft);
  border: 1px solid rgba(255, 92, 53, 0.15);
  border-radius: 14px;
  margin-bottom: 24px;
}

.arvis-returns-policy__icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.arvis-returns-policy__body {
  flex: 1;
}

.arvis-returns-policy__body strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 2px;
}

.arvis-returns-policy__body p {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

.arvis-returns-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ==========================================================================
   ARVIS — Despre noi (Etapa 9.4)
   Layout custom pages-misc.jsx AboutPage. Hero centered + foto + story
   Ars/Vis/Avis + 4 piloni Midnight + numbers + viziune + CTA WA.
   ========================================================================== */

/* Container override pentru toate sectiunile despre — asigura padding-uri
   constante indiferent de parent layout context (cms page poate fi randata
   in layout-full-width sau alt layout cu padding-uri diferite) */
.arvis-cms--despre .container,
.arvis-despre__hero .container,
.arvis-despre__photo-wrap .container,
.arvis-despre__story .container,
.arvis-despre__pillars .container,
.arvis-despre__numbers .container,
.arvis-despre__vision .container,
.arvis-despre__cta-wrap .container,
.arvis-despre__cms-extra .container {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  width: 100%;
  box-sizing: border-box;
}

@media (max-width: 575.98px) {
  .arvis-cms--despre .container,
  .arvis-despre__hero .container,
  .arvis-despre__photo-wrap .container,
  .arvis-despre__story .container,
  .arvis-despre__pillars .container,
  .arvis-despre__numbers .container,
  .arvis-despre__vision .container,
  .arvis-despre__cta-wrap .container,
  .arvis-despre__cms-extra .container {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* Hero centered */
.arvis-despre__hero {
  padding: 16px 0 32px;
  background: var(--surface, #ffffff);
  text-align: center;
}

@media (min-width: 768px) {
  .arvis-despre__hero {
    padding: 32px 0 64px;
  }
}

.arvis-despre__eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 16px;
}

.arvis-despre__eyebrow--on-dark {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-despre__title {
  font-family: "Inter", sans-serif;
  font-size: 40px;
  font-weight: 900;
  letter-spacing: -0.035em;
  line-height: 0.98;
  color: var(--arvis-midnight, #111827);
  margin: 0;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 768px) {
  .arvis-despre__title {
    font-size: 80px;
  }
}

.arvis-despre__title-accent {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-despre__lede {
  max-width: 720px;
  margin: 32px auto 0;
  font-size: 16px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

@media (min-width: 768px) {
  .arvis-despre__lede {
    font-size: 19px;
  }
}

/* Hero photo */
.arvis-despre__photo-wrap {
  padding: 0 0 48px;
}

@media (min-width: 768px) {
  .arvis-despre__photo-wrap {
    padding: 0 0 96px;
  }
}

.arvis-despre__photo {
  max-width: 1200px;
  margin: 0 auto;
  aspect-ratio: 1 / 1;
  border-radius: 20px;
  overflow: hidden;
  background: var(--surface-container, #f8f9fa);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px dashed var(--arvis-line, #e5e7eb);
}

@media (min-width: 768px) {
  .arvis-despre__photo {
    aspect-ratio: 21 / 9;
    border-radius: 32px;
  }
}

.arvis-despre__photo-placeholder {
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-slate, #6b7280);
  text-align: center;
  padding: 16px;
}

/* Story Ars/Vis/Avis */
.arvis-despre__story {
  padding: 0 0 64px;
}

@media (min-width: 768px) {
  .arvis-despre__story {
    padding: 0 0 120px;
  }
}

.arvis-despre__story-inner {
  max-width: 800px;
  margin: 0 auto;
}

.arvis-despre__h2 {
  font-family: "Inter", sans-serif;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
  position: relative;
  padding-bottom: 12px;
}

@media (min-width: 768px) {
  .arvis-despre__h2 {
    font-size: 40px;
  }
}

.arvis-despre__h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 3px;
  background: var(--arvis-ember, #ff5c35);
  border-radius: 2px;
}

.arvis-despre__h2--on-dark {
  color: #ffffff;
}

.arvis-despre__h2--tight {
  font-size: 32px;
}

@media (min-width: 768px) {
  .arvis-despre__h2--tight {
    font-size: 48px;
  }
}

.arvis-despre__story-body {
  margin-top: 32px;
  font-size: 17px;
  color: var(--arvis-midnight, #111827);
  line-height: 1.75;
}

.arvis-despre__story-body p {
  margin: 0 0 24px;
}

.arvis-despre__story-body p:last-child {
  margin-bottom: 0;
}

.arvis-despre__root {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-despre__quote {
  margin: 32px 0 0;
  padding: 24px 28px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 16px;
  border-left: 3px solid var(--arvis-ember, #ff5c35);
  font-size: 18px;
  font-style: italic;
  line-height: 1.6;
  color: var(--arvis-midnight, #111827);
}

/* Pillars — Midnight section */
.arvis-despre__pillars {
  background: var(--dark-surface);
  color: #ffffff;
  padding: 64px 0;
}

@media (min-width: 768px) {
  .arvis-despre__pillars {
    padding: 120px 0;
  }
}

.arvis-despre__pillars-head {
  max-width: 680px;
  margin-bottom: 48px;
}

@media (min-width: 768px) {
  .arvis-despre__pillars-head {
    margin-bottom: 64px;
  }
}

.arvis-despre__pillars-head .arvis-despre__h2 {
  font-size: 36px;
  letter-spacing: -0.025em;
  line-height: 1.05;
}

@media (min-width: 768px) {
  .arvis-despre__pillars-head .arvis-despre__h2 {
    font-size: 56px;
  }
}

.arvis-despre__pillars-head .arvis-despre__h2::after {
  background: var(--arvis-ember, #ff5c35);
}

.arvis-despre__pillars-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

@media (min-width: 768px) {
  .arvis-despre__pillars-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.arvis-despre__pillar {
  padding: 32px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
}

.arvis-despre__pillar-num {
  font-size: 48px;
  font-weight: 900;
  color: rgba(255, 255, 255, 0.08);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.arvis-despre__pillar-title {
  font-family: "Inter", sans-serif;
  margin: 12px 0;
  font-size: 22px;
  font-weight: 700;
  color: #ffffff;
}

.arvis-despre__pillar-body {
  margin: 0;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.65;
}

/* Numbers */
.arvis-despre__numbers {
  padding: 64px 0;
  background: var(--surface, #ffffff);
}

@media (min-width: 768px) {
  .arvis-despre__numbers {
    padding: 96px 0;
  }
}

.arvis-despre__numbers-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

@media (min-width: 768px) {
  .arvis-despre__numbers-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 32px;
  }
}

.arvis-despre__stat {
  padding: 24px;
  background: var(--surface-container, #f8f9fa);
  border-radius: 20px;
  text-align: center;
}

@media (min-width: 768px) {
  .arvis-despre__stat {
    text-align: left;
  }
}

.arvis-despre__stat-value {
  font-size: 36px;
  font-weight: 900;
  color: var(--arvis-ember, #ff5c35);
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}

@media (min-width: 768px) {
  .arvis-despre__stat-value {
    font-size: 56px;
  }
}

.arvis-despre__stat-label {
  margin-top: 8px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  font-weight: 500;
}

/* Vision */
.arvis-despre__vision {
  background: var(--surface-container, #f8f9fa);
  padding: 64px 0;
}

@media (min-width: 768px) {
  .arvis-despre__vision {
    padding: 120px 0;
  }
}

.arvis-despre__vision-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
}

@media (min-width: 768px) {
  .arvis-despre__vision-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: 64px;
    align-items: start;
  }
}

.arvis-despre__vision-right {
  font-size: 17px;
  color: var(--arvis-midnight, #111827);
  line-height: 1.75;
}

.arvis-despre__vision-right p {
  margin: 0 0 20px;
}

.arvis-despre__vision-right p:last-child {
  margin-bottom: 0;
}

/* CMS extra (admin content) */
.arvis-despre__cms-extra {
  padding: 48px 0;
  background: var(--surface, #ffffff);
}

/* CTA bottom */
.arvis-despre__cta-wrap {
  padding: 48px 0 64px;
  background: var(--surface, #ffffff);
}

@media (min-width: 768px) {
  .arvis-despre__cta-wrap {
    padding: 64px 0 96px;
  }
}

.arvis-despre__cta {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1000px;
  margin: 0 auto;
  padding: 28px 32px;
  background: var(--arvis-ember-soft);
  border: 1px solid var(--arvis-ember, #ff5c35);
  border-radius: 20px;
}

.arvis-despre__cta-body h2 {
  font-family: "Inter", sans-serif;
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--arvis-midnight, #111827);
}

.arvis-despre__cta-body p {
  margin: 4px 0 0;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-despre__cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 24px;
  background: #25d366;
  color: #ffffff !important;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease, transform 0.15s ease;
}

.arvis-despre__cta-btn:hover {
  background: #1fb855;
  transform: translateY(-1px);
}

/* ==========================================================================
   ARVIS — Contact page (Etapa 9.5)
   Layout: Hero + 3 channel cards + Form card + NAP grid
   Design source: pages-misc.jsx ContactPage (img 40)
   ========================================================================== */

.arvis-contact {
  background: var(--page-bg, #f8f9fa);
}

/* Container override pentru toate sectiunile contact (consistent cu despre) */
.arvis-contact__hero .container,
.arvis-contact__channels-wrap .container,
.arvis-contact__form-wrap .container,
.arvis-contact__faq-wrap .container,
.arvis-contact__legal-wrap .container,
.arvis-contact__sediu-wrap .container,
.arvis-contact__nap-wrap .container {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  width: 100%;
  box-sizing: border-box;
}

@media (max-width: 575.98px) {
  .arvis-contact__hero .container,
  .arvis-contact__channels-wrap .container,
  .arvis-contact__form-wrap .container,
  .arvis-contact__faq-wrap .container,
  .arvis-contact__sediu-wrap .container,
  .arvis-contact__nap-wrap .container {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* === Hero === */
.arvis-contact__hero {
  padding: 8px 0 24px;
  background: var(--page-bg, #f8f9fa);
}

@media (min-width: 768px) {
  .arvis-contact__hero {
    padding: 16px 0 36px;
  }
}

.arvis-contact__eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
  margin: 0 0 12px;
}

.arvis-contact__title {
  font-family: "Inter", sans-serif;
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.025em;
  line-height: 1.05;
  color: var(--arvis-midnight, #111827);
  margin: 0;
  position: relative;
  padding-bottom: 12px;
}

@media (min-width: 768px) {
  .arvis-contact__title {
    font-size: 56px;
  }
}

.arvis-contact__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 3px;
  background: var(--arvis-ember, #ff5c35);
  border-radius: 2px;
}

.arvis-contact__lede {
  max-width: 640px;
  margin: 24px 0 0;
  font-size: 16px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.65;
}

/* === Channels 3-card row === */
.arvis-contact__channels-wrap {
  padding: 24px 0 32px;
}

@media (min-width: 768px) {
  .arvis-contact__channels-wrap {
    padding: 32px 0 48px;
  }
}

.arvis-contact__cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

@media (min-width: 768px) {
  .arvis-contact__cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }
}

.arvis-contact__card {
  display: flex;
  flex-direction: column;
  padding: 24px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 18px;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease,
    border-color 0.15s ease;
}

.arvis-contact__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
  border-color: var(--arvis-ember, #ff5c35);
}

/* WhatsApp Midnight variant */
.arvis-contact__card--wa {
  background: var(--dark-surface);
  color: #ffffff !important;
  border-color: transparent;
  position: relative;
  overflow: hidden;
}

.arvis-contact__card--wa::before {
  content: "";
  position: absolute;
  bottom: -60px;
  right: -60px;
  width: 200px;
  height: 200px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.18), transparent 70%);
  pointer-events: none;
}

.arvis-contact__card--wa:hover {
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-contact__card-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  position: relative;
}

.arvis-contact__card-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.arvis-contact__card-icon--ember {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
}

.arvis-contact__card-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-slate, #6b7280);
}

.arvis-contact__card--wa .arvis-contact__card-label {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-contact__card-title {
  font-family: "Inter", sans-serif;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 6px;
  line-height: 1.2;
  position: relative;
  word-break: break-word;
}

.arvis-contact__card-title--on-dark {
  color: #ffffff;
}

.arvis-contact__card-main {
  font-size: 14px;
  font-weight: 500;
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 12px;
  position: relative;
}

.arvis-contact__card--wa .arvis-contact__card-main {
  color: rgba(255, 255, 255, 0.85);
}

.arvis-contact__card-main--small {
  font-size: 13px;
}

.arvis-contact__card-sub {
  flex: 1;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.55;
  margin: 0 0 18px;
  position: relative;
}

.arvis-contact__card-sub--on-dark {
  color: rgba(255, 255, 255, 0.65);
}

.arvis-contact__card-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  position: relative;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.arvis-contact__card-cta--filled {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
}

.arvis-contact__card:hover .arvis-contact__card-cta--filled {
  background: var(--arvis-ember-hover, #e64a24);
}

.arvis-contact__card-cta--outlined {
  background: transparent;
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827);
}

.arvis-contact__card:hover .arvis-contact__card-cta--outlined {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35);
}

/* === Form section === */
.arvis-contact__form-wrap {
  padding: 32px 0 48px;
}

@media (min-width: 768px) {
  .arvis-contact__form-wrap {
    padding: 48px 0 64px;
  }
}

/* 2-col grid: form (left 1.5fr) + aside (right 1fr) */
.arvis-contact__form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-contact__form-grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: 24px;
  }
}

.arvis-contact__form-card {
  padding: 24px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
}

@media (min-width: 768px) {
  .arvis-contact__form-card {
    padding: 36px;
  }
}

.arvis-contact__eyebrow--inline {
  margin: 0 0 12px;
}

/* === Aside (Program + Sediu + Promisiune) === */
.arvis-contact__aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.arvis-contact__aside-card {
  padding: 22px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
}

.arvis-contact__aside-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.arvis-contact__aside-icon {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.arvis-contact__aside-head strong {
  color: var(--arvis-midnight, #111827);
  font-size: 15px;
  font-weight: 700;
}

.arvis-contact__hours-list--clean {
  margin: 0 0 16px;
}

.arvis-contact__hours-list--clean li {
  padding: 8px 0;
  border-bottom: 1px solid var(--arvis-line-soft);
}

.arvis-contact__hours-list--clean li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.arvis-contact__online-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.2);
  font-size: 12px;
  font-weight: 600;
  color: #047857;
}

.arvis-contact__online-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #10b981;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2);
  animation: arvis-pulse 2s ease-in-out infinite;
}

@keyframes arvis-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2);
  }
  50% {
    box-shadow: 0 0 0 5px rgba(16, 185, 129, 0.1);
  }
}

.arvis-contact__aside-note {
  margin: 14px 0 0;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.55;
}

/* Map iframe wrapper */
.arvis-contact__map {
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 16px;
  background: var(--surface-container, #f8f9fa);
}

.arvis-contact__map iframe {
  display: block;
  width: 100%;
  border: 0;
}

/* Map placeholder (fallback cand nu avem adresa) */
.arvis-contact__map-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  aspect-ratio: 16 / 10;
  background: var(--surface-container, #f8f9fa);
  border: 1px dashed var(--arvis-line, #e5e7eb);
  border-radius: 12px;
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 16px;
  position: relative;
}

.arvis-contact__map-label {
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  padding: 0 16px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.arvis-contact__map-placeholder svg {
  color: var(--arvis-ember, #ff5c35);
  opacity: 0.7;
}

.arvis-contact__sediu-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.arvis-contact__sediu-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-slate, #6b7280);
}

.arvis-contact__sediu-address {
  font-style: normal;
  font-size: 14px;
  line-height: 1.5;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

.arvis-contact__sediu-address strong {
  font-weight: 700;
  font-size: 15px;
}

.arvis-contact__map-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-ember, #ff5c35) !important;
  text-decoration: none !important;
  margin-top: 4px;
}

.arvis-contact__map-link:hover {
  text-decoration: underline !important;
}

/* Promisiunea noastra — Midnight card */
.arvis-contact__promise {
  padding: 22px;
  background: var(--dark-surface);
  color: #ffffff;
  border-radius: 16px;
  position: relative;
  overflow: hidden;
}

.arvis-contact__promise::before {
  content: "";
  position: absolute;
  bottom: -60px;
  right: -60px;
  width: 200px;
  height: 200px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.15), transparent 70%);
  pointer-events: none;
}

.arvis-contact__promise-eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 14px;
  position: relative;
}

.arvis-contact__promise-body {
  margin: 0 0 18px;
  font-size: 15px;
  font-weight: 600;
  color: #ffffff;
  line-height: 1.5;
  position: relative;
}

.arvis-contact__promise-team {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
}

.arvis-contact__promise-avatars {
  display: flex;
  flex-shrink: 0;
}

.arvis-contact__promise-avatar {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: #ffffff;
  border: 2px solid var(--arvis-midnight, #111827);
}

.arvis-contact__promise-avatar--ember {
  background: var(--arvis-ember, #ff5c35);
}

.arvis-contact__promise-avatar--blue {
  background: #3b82f6;
  margin-left: -10px;
}

/* RECUPERAT (era direct in custom.css, sters de rebuild) */
.arvis-contact__promise-avatar--slate {
  background: var(--arvis-slate, #6b7280);
  margin-left: -10px;
}

.arvis-contact__promise-team-name {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.75);
}

.arvis-contact__form-title {
  font-family: "Inter", sans-serif;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 6px;
}

@media (min-width: 768px) {
  .arvis-contact__form-title {
    font-size: 28px;
  }
}

.arvis-contact__form-lede {
  margin: 0 0 24px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.55;
}

.arvis-contact__alert {
  padding: 12px 16px;
  border-radius: 10px;
  background: var(--arvis-ember-soft);
  border: 1px solid rgba(255, 92, 53, 0.2);
  font-size: 14px;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 16px;
}

.arvis-contact__alert--error {
  background: rgba(220, 38, 38, 0.06);
  border-color: rgba(220, 38, 38, 0.2);
  color: #991b1b;
}

/* PS9 contactform widget wraps content in <div class="col-sm-8">.
   Forteaza la 100% width pentru a folosi tot spatiul card-ului parent. */
.arvis-contact__form > [class*="col-"],
.arvis-contact__form > .col-sm-8,
.arvis-contact__form > .col-md-8,
.arvis-contact__form > .col-lg-8 {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* PS9 contactform widget form — restyle fields */
.arvis-contact__form input[type="email"],
.arvis-contact__form input[type="text"],
.arvis-contact__form input[type="file"],
.arvis-contact__form textarea,
.arvis-contact__form select,
.arvis-contact__form .form-control,
.arvis-contact__form .form-control-select {
  width: 100% !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  height: auto !important;
  min-height: 0 !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-family: "Inter", sans-serif !important;
  color: var(--arvis-midnight, #111827) !important;
  background-color: var(--surface, #ffffff) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  box-sizing: border-box !important;
}

/* Select — appearance reset + chevron custom Ember-slate via SVG bg.
   Force height auto + line-height 1.5 ca textul sa nu fie taiat de native select. */
.arvis-contact__form select,
.arvis-contact__form select.form-control,
.arvis-contact__form select.form-control-select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  padding: 14px 44px 14px 16px !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 14px 14px;
  cursor: pointer;
}

.arvis-contact__form select:focus {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23FF5C35' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
}

/* File upload (bootstrap-filestyle) reset — fundal alb cu Ember pe hover */
.arvis-contact__form .bootstrap-filestyle.input-group {
  width: 100%;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 14px;
  padding: 0;
  background: var(--surface, #ffffff);
  overflow: hidden;
  display: flex;
}

.arvis-contact__form .bootstrap-filestyle .form-control {
  flex: 1;
  border: none !important;
  background: transparent !important;
  padding: 14px 16px !important;
  border-radius: 0 !important;
}

.arvis-contact__form .bootstrap-filestyle .group-span-filestyle label.btn,
.arvis-contact__form .bootstrap-filestyle .btn-default {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 14px 18px !important;
  background: var(--surface-container, #f8f9fa) !important;
  color: var(--arvis-midnight, #111827) !important;
  border: none !important;
  border-left: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 0 !important;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  margin: 0 !important;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-contact__form .bootstrap-filestyle .btn-default:hover {
  background: var(--arvis-ember-soft) !important;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-contact__form textarea {
  min-height: 140px;
  resize: vertical;
}

.arvis-contact__form input:focus,
.arvis-contact__form textarea:focus,
.arvis-contact__form select:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 0 0 3px var(--arvis-ember-soft);
}

.arvis-contact__form .form-group,
.arvis-contact__form .form-fields > .form-group {
  margin-bottom: 16px;
}

.arvis-contact__form label,
.arvis-contact__form .col-form-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 6px;
  padding: 0;
}

.arvis-contact__form button[type="submit"],
.arvis-contact__form .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.arvis-contact__form button[type="submit"]:hover,
.arvis-contact__form .btn-primary:hover {
  background: var(--arvis-ember-hover, #e64a24) !important;
}

/* Reset PS9 Bootstrap row pe form: din .row flex → block vertical full-width.
   Cu !important pentru a invinge specificity-ul Bootstrap (.row { display: flex }) */
.arvis-contact__form .form-fields {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Ascund H4 "Contacteaza-ne" duplicat (modul contactform injecteaza titlu intern) */
.arvis-contact__form .form-fields > .form-group.row:first-child h4 {
  display: none;
}

/* Daca prima row contine doar H4 ascuns, scoate row-ul gol */
.arvis-contact__form .form-fields > .form-group.row:first-child:has(h4) {
  display: none !important;
}

.arvis-contact__form .form-group.row,
.arvis-contact__form .form-fields .form-group.row {
  display: block !important;
  margin: 0 0 18px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  --bs-gutter-x: 0 !important;
}

.arvis-contact__form .form-group.row > [class*="col-"],
.arvis-contact__form .form-fields .form-group.row > [class*="col-"] {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
}

.arvis-contact__form .form-group.row > .form-control-comment {
  margin-top: 4px !important;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  font-style: italic;
}

.arvis-contact__form .form-group.row > .form-control-comment:empty {
  display: none;
}

/* Form submit area (la final) — buton dreapta */
.arvis-contact__form .form-group.row:last-child {
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: 8px !important;
}

.arvis-contact__form .form-group.row:last-child > [class*="col-"] {
  flex: 0 0 auto !important;
  width: auto !important;
}

/* === NAP section === */
.arvis-contact__nap-wrap {
  padding: 0 0 64px;
}

@media (min-width: 768px) {
  .arvis-contact__nap-wrap {
    padding: 0 0 96px;
  }
}

.arvis-contact__nap-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

@media (min-width: 768px) {
  .arvis-contact__nap-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
  }
}

.arvis-contact__hours,
.arvis-contact__nap {
  padding: 24px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
}

.arvis-contact__hours-head,
.arvis-contact__nap-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-contact__hours-head strong,
.arvis-contact__nap-head strong {
  color: var(--arvis-midnight, #111827);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.arvis-contact__hours-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.arvis-contact__hours-list li {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 14px;
}

.arvis-contact__hours-list li span:first-child {
  color: var(--arvis-slate, #6b7280);
}

.arvis-contact__hours-list li strong {
  color: var(--arvis-midnight, #111827);
  font-variant-numeric: tabular-nums;
}

.arvis-contact__hours-closed {
  color: var(--arvis-slate, #6b7280);
  font-style: italic;
}

.arvis-contact__nap-body {
  font-style: normal;
  font-size: 14px;
  line-height: 1.65;
  color: var(--arvis-midnight, #111827);
}

.arvis-contact__nap-note {
  margin: 16px 0 0;
  padding-top: 16px;
  border-top: 1px solid var(--arvis-line-soft);
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

/* ==========================================================================
   ARVIS — FAQ section (contact page) — Etapa 9.5 v3
   Layout 2-col: intro stanga + lista FAQ dreapta
   ========================================================================== */

.arvis-contact__faq-wrap {
  padding: 32px 0 48px;
  background: var(--surface, #ffffff);
}

@media (min-width: 768px) {
  .arvis-contact__faq-wrap {
    padding: 64px 0 80px;
  }
}

.arvis-contact__faq-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

@media (min-width: 992px) {
  .arvis-contact__faq-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: 48px;
  }
}

.arvis-contact__faq-intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.arvis-contact__faq-intro .arvis-contact__eyebrow {
  margin: 0 0 16px;
}

.arvis-contact__faq-title {
  font-family: "Inter", sans-serif;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

@media (min-width: 768px) {
  .arvis-contact__faq-title {
    font-size: 40px;
  }
}

.arvis-contact__faq-lede {
  margin: 20px 0 24px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

.arvis-contact__faq-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.arvis-contact__faq-item details {
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 14px;
  transition: border-color 0.15s ease;
}

.arvis-contact__faq-item details:hover {
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-contact__faq-item details[open] {
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-contact__faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  cursor: pointer;
  list-style: none;
}

.arvis-contact__faq-item summary::-webkit-details-marker {
  display: none;
}

.arvis-contact__faq-q {
  font-size: 15px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
  line-height: 1.4;
}

.arvis-contact__faq-chev {
  flex-shrink: 0;
  color: var(--arvis-slate, #6b7280);
  transition: transform 0.2s ease, color 0.15s ease;
}

.arvis-contact__faq-item details[open] .arvis-contact__faq-chev {
  transform: rotate(180deg);
  color: var(--arvis-ember, #ff5c35);
}

.arvis-contact__faq-a {
  padding: 0 20px 18px;
}

.arvis-contact__faq-a p {
  margin: 0;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.65;
}

.arvis-contact__faq-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 24px;
  border-radius: 999px;
  background: transparent;
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827) !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: border-color 0.15s ease, color 0.15s ease;
  margin-top: 0;
}

.arvis-contact__faq-all:hover {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35) !important;
}

/* ==========================================================================
   ARVIS — Sediu social section (contact page) — Etapa 9.5 v3
   ========================================================================== */

.arvis-contact__sediu-wrap {
  padding: 0 0 64px;
  background: var(--page-bg, #f8f9fa);
}

@media (min-width: 768px) {
  .arvis-contact__sediu-wrap {
    padding: 0 0 96px;
  }
}

.arvis-contact__sediu-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  max-width: 1100px;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .arvis-contact__sediu-grid {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 20px;
  }
}

.arvis-contact__sediu {
  padding: 24px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
}

.arvis-contact__sediu-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-contact__sediu-head strong {
  color: var(--arvis-midnight, #111827);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.arvis-contact__sediu-body {
  font-style: normal;
  font-size: 14px;
  line-height: 1.65;
  color: var(--arvis-midnight, #111827);
}

.arvis-contact__sediu-body strong {
  display: inline-block;
  margin-bottom: 4px;
  font-weight: 700;
  font-size: 16px;
}

.arvis-contact__sediu-map {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-midnight, #111827) !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-contact__sediu-map:hover {
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-contact__sediu-legal {
  margin: 16px 0 0;
}

.arvis-contact__sediu-legal-row {
  display: flex;
  gap: 8px;
  padding-top: 12px;
  margin-top: 12px;
  border-top: 1px solid var(--arvis-line-soft);
  font-size: 13px;
}

.arvis-contact__sediu-legal dt {
  color: var(--arvis-slate, #6b7280);
  font-weight: 600;
  flex-shrink: 0;
  min-width: 80px;
}

.arvis-contact__sediu-legal dd {
  margin: 0;
  color: var(--arvis-midnight, #111827);
}

.arvis-contact__sediu-note {
  margin: 16px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--arvis-line-soft);
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

.arvis-contact__hours-note {
  margin: 16px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--arvis-line-soft);
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  font-style: italic;
  line-height: 1.5;
}

/* ==========================================================================
   ARVIS — Date firma + Litigii section (contact page)
   ========================================================================== */

.arvis-contact__legal-wrap {
  padding: 48px 0 64px;
  background: var(--page-bg, #f8f9fa);
}

@media (min-width: 768px) {
  .arvis-contact__legal-wrap {
    padding: 64px 0 96px;
  }
}

.arvis-contact__legal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
}

@media (min-width: 992px) {
  .arvis-contact__legal-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
  }
}

.arvis-contact__legal-card {
  padding: 28px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 18px;
}

@media (min-width: 768px) {
  .arvis-contact__legal-card {
    padding: 36px;
  }
}

.arvis-contact__legal-card .arvis-contact__eyebrow {
  margin: 0 0 14px;
}

.arvis-contact__legal-title {
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 20px;
  line-height: 1.2;
}

@media (min-width: 768px) {
  .arvis-contact__legal-title {
    font-size: 28px;
  }
}

.arvis-contact__legal-lede {
  margin: 0 0 24px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.65;
}

/* Date firma — dl key/value rows */
.arvis-contact__legal-list {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.arvis-contact__legal-row {
  display: grid;
  grid-template-columns: minmax(120px, max-content) 1fr;
  gap: 16px;
  align-items: baseline;
  font-size: 14px;
}

.arvis-contact__legal-row dt {
  color: var(--arvis-slate, #6b7280);
  font-weight: 500;
}

.arvis-contact__legal-row dd {
  margin: 0;
  color: var(--arvis-midnight, #111827);
  font-weight: 600;
}

.arvis-contact__legal-row code {
  font-family: "Inter", monospace;
  font-size: 14px;
  font-weight: 600;
  background: transparent;
  padding: 0;
  color: var(--arvis-midnight, #111827);
  letter-spacing: 0.02em;
}

/* Litigii — link cards */
.arvis-contact__legal-links {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.arvis-contact__legal-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  background: var(--surface-container, #f8f9fa);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 12px;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  transition: border-color 0.15s ease, background 0.15s ease;
  flex-wrap: wrap;
}

.arvis-contact__legal-link:hover {
  border-color: var(--arvis-ember, #ff5c35);
  background: var(--surface, #ffffff);
}

.arvis-contact__legal-link-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.arvis-contact__legal-link-body strong {
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  letter-spacing: 0.01em;
}

.arvis-contact__legal-link-body span {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.4;
}

.arvis-contact__legal-link-url {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: "Inter", monospace;
  font-size: 12px;
  font-weight: 600;
  color: var(--arvis-ember, #ff5c35);
  background: transparent;
  padding: 0;
  white-space: nowrap;
}

.arvis-contact__legal-link:hover .arvis-contact__legal-link-url {
  text-decoration: underline;
}

/* ==========================================================================
   ARVIS — Search results page (Etapa 11.1)
   Reuza .arvis-plp__* din category.tpl. Adauga eyebrow + title-q span +
   empty state dedicat cu sugestii.
   ========================================================================== */

.arvis-plp__eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 8px;
}

.arvis-plp__title-q {
  color: var(--arvis-ember, #ff5c35);
}

/* Search empty state */
.arvis-search-empty {
  text-align: center;
  padding: 64px 24px;
  background: var(--surface, #ffffff);
  border: 1px dashed var(--arvis-line, #e5e7eb);
  border-radius: 18px;
  max-width: 560px;
  margin: 32px auto;
}

.arvis-search-empty__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-slate, #6b7280);
  margin-bottom: 16px;
}

.arvis-search-empty__title {
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 12px;
}

.arvis-search-empty__sub {
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
  margin: 0 0 28px;
  max-width: 420px;
  margin-left: auto;
  margin-right: auto;
}

.arvis-search-empty__actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}

@media (min-width: 576px) {
  .arvis-search-empty__actions {
    flex-direction: row;
    justify-content: center;
  }
}

.arvis-search-empty__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.arvis-search-empty__cta--primary {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
}

.arvis-search-empty__cta--primary:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

.arvis-search-empty__cta--whatsapp {
  background: #25d366;
  color: #ffffff !important;
}

.arvis-search-empty__cta--whatsapp:hover {
  background: #1fb855;
}

/* ==========================================================================
   ARVIS — All Categories page (Etapa 11.2)
   Hero + grid carduri parent → children + WhatsApp help banner
   ========================================================================== */

.arvis-allcat {
  background: var(--page-bg, #f8f9fa);
}

.arvis-allcat__hero {
  padding: 24px 0 32px;
  background: var(--surface, #ffffff);
}

@media (min-width: 768px) {
  .arvis-allcat__hero {
    padding: 32px 0 48px;
  }
}

.arvis-allcat__eyebrow {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 12px;
}

/* Stats counter (X categorii) — eyebrow above H1 */
.arvis-allcat__stats {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 12px;
}

.arvis-allcat__title {
  font-family: "Inter", sans-serif;
  font-size: 32px;
  font-weight: 900;
  letter-spacing: -0.025em;
  line-height: 1.1;
  color: var(--arvis-midnight, #111827);
  margin: 0;
  position: relative;
  padding-bottom: 12px;
}

@media (min-width: 768px) {
  .arvis-allcat__title {
    font-size: 48px;
  }
}

.arvis-allcat__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 3px;
  background: var(--arvis-ember, #ff5c35);
  border-radius: 2px;
}

.arvis-allcat__lede {
  max-width: 720px;
  margin: 20px 0 8px;
  font-size: 16px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
}

.arvis-allcat__sublede {
  max-width: 640px;
  margin: 0 0 8px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.6;
  font-style: italic;
}

/* Search bar in hero */
.arvis-allcat__search {
  position: relative;
  display: flex;
  align-items: center;
  max-width: 560px;
  margin-top: 24px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 999px;
  padding: 4px 4px 4px 18px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.arvis-allcat__search:focus-within {
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 0 0 3px var(--arvis-ember-soft);
}

.arvis-allcat__search-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  color: var(--arvis-slate, #6b7280);
}

.arvis-allcat__search-input {
  flex: 1;
  border: none !important;
  background: transparent !important;
  padding: 12px 12px !important;
  font-size: 15px;
  color: var(--arvis-midnight, #111827);
  outline: none !important;
  width: 100%;
  font-family: "Inter", sans-serif;
}

.arvis-allcat__search-input::placeholder {
  color: var(--arvis-slate, #6b7280);
}

.arvis-allcat__search-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 10px 22px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  border: none;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease;
}

.arvis-allcat__search-btn:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

.arvis-allcat__body {
  padding: 32px 0 64px;
}

@media (min-width: 768px) {
  .arvis-allcat__body {
    padding: 48px 0 96px;
  }
}

.arvis-allcat__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

@media (min-width: 576px) {
  .arvis-allcat__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
}

@media (min-width: 992px) {
  .arvis-allcat__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1200px) {
  .arvis-allcat__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Popular badge */
.arvis-allcat__card {
  position: relative;
}

.arvis-allcat__card-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  z-index: 1;
}

.arvis-allcat__card--popular {
  border-color: rgba(255, 92, 53, 0.25);
  box-shadow: 0 1px 4px rgba(255, 92, 53, 0.06);
}

.arvis-allcat__card {
  display: flex;
  flex-direction: column;
  padding: 24px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 18px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease,
    transform 0.15s ease;
}

.arvis-allcat__card:hover {
  border-color: var(--arvis-ember, #ff5c35);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04);
}

.arvis-allcat__card-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
}

.arvis-allcat__card-thumb {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface-container, #f8f9fa);
}

.arvis-allcat__card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.arvis-allcat__card-thumb--placeholder {
  color: var(--arvis-slate, #6b7280);
}

.arvis-allcat__card-info {
  flex: 1;
  min-width: 0;
}

.arvis-allcat__card-title {
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 6px;
  line-height: 1.25;
}

.arvis-allcat__card-title a {
  color: inherit !important;
  text-decoration: none !important;
}

.arvis-allcat__card-title a:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-allcat__card-desc {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

.arvis-allcat__sublist {
  list-style: none;
  margin: 0 0 18px;
  padding: 16px 0;
  border-top: 1px solid var(--arvis-line-soft);
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1;
}

.arvis-allcat__sublink {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-midnight, #111827) !important;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-allcat__sublink:hover {
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-allcat__sublink--more {
  background: transparent;
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 700;
}

.arvis-allcat__sublink--more:hover {
  background: var(--arvis-ember-soft);
}

.arvis-allcat__card-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding: 10px 18px;
  border-radius: 999px;
  background: transparent;
  border: 1.5px solid var(--arvis-line, #e5e7eb);
  color: var(--arvis-midnight, #111827) !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  align-self: flex-start;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.arvis-allcat__card:hover .arvis-allcat__card-cta {
  border-color: var(--arvis-ember, #ff5c35);
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
}

.arvis-allcat__empty {
  text-align: center;
  padding: 48px 24px;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-allcat__help {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 32px;
  padding: 22px 24px;
  background: var(--arvis-ember-soft);
  border: 1px solid rgba(255, 92, 53, 0.18);
  border-radius: 16px;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  transition: background 0.15s ease, border-color 0.15s ease;
  flex-wrap: wrap;
}

.arvis-allcat__help:hover {
  background: rgba(255, 92, 53, 0.14);
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-allcat__help-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: #25d366;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.arvis-allcat__help-body {
  flex: 1;
  min-width: 200px;
}

.arvis-allcat__help-body strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 4px;
}

.arvis-allcat__help-body p {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  line-height: 1.5;
}

.arvis-allcat__help-arrow {
  color: var(--arvis-ember, #ff5c35);
}

/* În curând section — placeholder pentru raioane viitoare */
.arvis-allcat__soon {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-top: 32px;
  padding: 32px;
  background: var(--surface, #ffffff);
  border: 1.5px dashed var(--arvis-line, #e5e7eb);
  border-radius: 18px;
  position: relative;
}

@media (min-width: 768px) {
  .arvis-allcat__soon {
    flex-direction: row;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
  }
}

.arvis-allcat__soon-badge {
  display: inline-flex;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--surface-container, #f8f9fa);
  color: var(--arvis-slate, #6b7280);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  flex-shrink: 0;
}

.arvis-allcat__soon-title {
  flex: 1;
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
  min-width: 200px;
}

.arvis-allcat__soon-sub {
  margin: 0;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  flex-basis: 100%;
}

@media (min-width: 768px) {
  .arvis-allcat__soon-sub {
    flex-basis: auto;
    flex: 1;
    min-width: 240px;
  }
}

.arvis-allcat__soon-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
  flex-shrink: 0;
}

.arvis-allcat__soon-cta:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

/* Secondary section 4-col (Categorii + Informații + Contul Tău + Contact) */
.arvis-allcat__secondary {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
  margin-top: 48px;
  padding-top: 48px;
  border-top: 1px solid var(--arvis-line-soft);
}

@media (min-width: 576px) {
  .arvis-allcat__secondary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .arvis-allcat__secondary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 32px;
    margin-top: 64px;
    padding-top: 64px;
  }
}

.arvis-allcat__sec-col {
  display: flex;
  flex-direction: column;
}

.arvis-allcat__sec-title {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--arvis-ember, #ff5c35);
  align-self: flex-start;
}

.arvis-allcat__sec-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.arvis-allcat__sec-list li {
  font-size: 14px;
}

.arvis-allcat__sec-list a {
  display: inline-block;
  padding: 4px 0;
  color: var(--arvis-slate, #6b7280) !important;
  text-decoration: none !important;
  transition: color 0.15s ease, padding-left 0.15s ease;
}

.arvis-allcat__sec-list a:hover {
  color: var(--arvis-ember, #ff5c35) !important;
  padding-left: 4px;
}

/* Contact column variant — email + adresa + ANPC pe linii diferite */
.arvis-allcat__sec-list--contact li {
  margin-bottom: 12px;
}

.arvis-allcat__sec-list--contact a {
  padding: 0;
  font-weight: 600;
  color: var(--arvis-midnight, #111827) !important;
}

.arvis-allcat__sec-list--contact a:hover {
  padding-left: 0;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-allcat__sec-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 2px;
}

.arvis-allcat__sec-list--contact address {
  font-style: normal;
  font-size: 13px;
  line-height: 1.5;
  color: var(--arvis-slate, #6b7280);
}

.arvis-allcat__sec-anpc {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 13px;
}

.arvis-allcat__sec-anpc a {
  color: var(--arvis-ember, #ff5c35) !important;
  font-weight: 600;
}

.arvis-allcat__sec-anpc span {
  color: var(--arvis-line, #e5e7eb);
}

/* ==========================================================================
   ARVIS — Sitemap v4: Sections (parent = section header) + Cards children
   ========================================================================== */

.arvis-allcat__section {
  margin-bottom: 48px;
}

@media (min-width: 768px) {
  .arvis-allcat__section {
    margin-bottom: 64px;
  }
}

.arvis-allcat__section:last-of-type {
  margin-bottom: 0;
}

.arvis-allcat__section-head {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.arvis-allcat__section-title {
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
}

@media (min-width: 768px) {
  .arvis-allcat__section-title {
    font-size: 28px;
  }
}

.arvis-allcat__section-title a {
  color: inherit !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.arvis-allcat__section-title a:hover {
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-allcat__section-count {
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
  font-weight: 500;
}

/* Grid cards children (4-col layout per design) */
.arvis-allcat__cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

@media (min-width: 576px) {
  .arvis-allcat__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
}

@media (min-width: 992px) {
  .arvis-allcat__cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
  }
}

/* Card2 — design 1:1: image area top + body bottom + chevron */
.arvis-allcat__card2 {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--surface, #ffffff);
  border: 1px solid var(--arvis-line-soft);
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  transition: transform 0.15s ease, border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.arvis-allcat__card2:hover {
  transform: translateY(-2px);
  border-color: var(--arvis-ember, #ff5c35);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.arvis-allcat__card2-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  z-index: 1;
}

.arvis-allcat__card2-thumb {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--surface, #ffffff);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--arvis-slate, #6b7280);
  overflow: hidden;
  padding: 14px;
}

.arvis-allcat__card2-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
  transition: transform 0.25s ease;
}

.arvis-allcat__card2:hover .arvis-allcat__card2-img:not(.is-fallback) {
  transform: scale(1.04);
}

/* Fallback SVG image — afisat la centru micsorat, fara stretch full-width */
.arvis-allcat__card2-img.is-fallback {
  width: 40%;
  height: 40%;
  max-width: 64px;
  max-height: 64px;
  object-fit: contain;
  opacity: 0.6;
  margin: auto;
}

.arvis-allcat__card2-thumb svg {
  opacity: 0.6;
}

.arvis-allcat__card2-body {
  padding: 14px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.arvis-allcat__card2-title {
  font-family: "Inter", sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.005em;
  color: var(--arvis-midnight, #111827);
  margin: 0;
  line-height: 1.3;
}

.arvis-allcat__card2-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  font-weight: 500;
}

.arvis-allcat__card2-meta svg {
  flex-shrink: 0;
  transition: transform 0.15s ease, color 0.15s ease;
}

.arvis-allcat__card2:hover .arvis-allcat__card2-meta {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-allcat__card2:hover .arvis-allcat__card2-meta svg {
  transform: translateX(2px);
}

/* --- A11y: cookie banner + contrast fixes (Etapa 15) --- */

.iqitcookielaw-container,
#iqitcookielaw,
.iqitcookielaw {
  background: var(--dark-surface) !important;
}
#iqitcookielaw-accept {
  background: var(--surface) !important;
  color: var(--arvis-midnight) !important;
  border: none;
  font-weight: 600;
}

/* Mobil: ridica bannerul cookie deasupra bottom nav-ului (60px + safe-area) ca sa nu fie
   taiat / butonul de accept ascuns sub nav. Bottom nav are z-index 9985. */
@media (max-width: 767px) {
  .iqitcookielaw-container,
  #iqitcookielaw,
  .iqitcookielaw {
    bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 9990 !important;
  }
}

/* --- A11y: skip-to-content link (Etapa 15) --- */

.arvis-skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 100000;
  /* Ascuns sus, in afara ecranului; slide-in pe focus de tastatura. */
  transform: translateY(-200%);
  padding: 12px 24px;
  background: var(--dark-surface);
  color: #ffffff !important;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  letter-spacing: -0.01em;
  border: 2px solid #ff5c35;
  border-radius: 999px;
  text-decoration: none !important;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(17, 24, 39, 0.18), 0 14px 30px rgba(255, 92, 53, 0.22);
  transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 200ms ease;
}
/* :focus-visible => apare DOAR la navigare cu tastatura, nu la click cu mouse-ul. */
.arvis-skip-link:focus-visible {
  transform: translateY(0);
  outline: none;
}
.arvis-skip-link:hover {
  box-shadow: 0 6px 16px rgba(17, 24, 39, 0.22), 0 18px 36px rgba(255, 92, 53, 0.3);
}

/* Fix: Warehouse parent page.tpl renders cms.content in .rte-content
   outside our page_content_container block. Hide it — we render
   content in our own arvis-cms__body instead. */
.page-cms .rte-content {
  display: none;
}

/* ==========================================================================
   V2.1 — Homepage Hero
   ========================================================================== */

.arvis-hero {
  padding: 32px 0 48px;
  background: transparent;
}

.arvis-hero__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

/* === LEFT: content (light bg, dark text) === */

.arvis-hero__content {
  padding: 16px 0;
}

.arvis-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--arvis-midnight, #111827);
  background: rgba(255, 92, 53, 0.1);
  padding: 6px 14px;
  border-radius: 999px;
  margin-bottom: 20px;
}

.arvis-hero__eyebrow-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--arvis-ember, #ff5c35);
  flex-shrink: 0;
}

.arvis-hero__title {
  font-size: clamp(36px, 5vw, 56px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.03em;
  margin: 0 0 20px;
  color: var(--arvis-midnight, #111827);
}

.arvis-hero__title-accent {
  color: var(--arvis-ember, #ff5c35);
}

.arvis-hero__sub {
  font-size: 17px;
  line-height: 1.55;
  color: var(--arvis-slate, #6b7280);
  margin: 0 0 28px;
  max-width: 44ch;
}

.arvis-hero__ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 28px;
  color: #ffffff;
}

.arvis-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 26px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: transform 150ms, box-shadow 150ms, background 150ms;
}

.arvis-hero__cta--primary {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
}
.arvis-hero__cta--primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(255, 92, 53, 0.35);
  color: #ffffff !important;
}

.arvis-hero__cta--secondary {
  background: var(--surface);
  color: var(--arvis-midnight, #111827);
  border: 1px solid rgba(0, 0, 0, 0.12);
}
.arvis-hero__cta--secondary:hover {
  background: var(--surface);
  color: var(--arvis-midnight, #111827);
  border-color: rgba(0, 0, 0, 0.25);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.arvis-hero__trust {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  align-items: center;
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-hero__trust-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.arvis-hero__trust-item strong {
  color: var(--arvis-midnight, #111827);
  font-weight: 700;
}

.arvis-hero__trust-stars {
  display: inline-flex;
  gap: 1px;
}

/* === RIGHT: visual (Midnight panel with image) === */

.arvis-hero__visual {
  position: relative;
  min-height: 480px;
  border-radius: 24px;
  overflow: hidden;
  background: var(--dark-surface);
}

.arvis-hero__visual-bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #1a2940 0%, #111827 100%);
}

.arvis-hero__visual-glow {
  position: absolute;
  inset: 0;
  background: radial-gradient(
      circle at 90% 10%,
      rgba(255, 92, 53, 0.25),
      transparent 50%
    ),
    radial-gradient(circle at 10% 90%, rgba(255, 92, 53, 0.12), transparent 55%);
  pointer-events: none;
}

.arvis-hero__visual-img-wrap {
  position: absolute;
  inset: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.arvis-hero__visual-img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 12px;
}

.arvis-hero__badge {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--surface);
  padding: 10px 16px;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(15, 27, 45, 0.18);
  z-index: 2;
}

.arvis-hero__badge--top {
  top: 32px;
  right: 32px;
}

.arvis-hero__badge--bottom {
  bottom: 32px;
  left: 32px;
}

.arvis-hero__badge-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(34, 197, 94, 0.12);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.arvis-hero__badge-icon--ember {
  background: rgba(255, 92, 53, 0.12);
  color: var(--arvis-ember, #ff5c35);
}

.arvis-hero__badge-body {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
  font-size: 12px;
}

.arvis-hero__badge-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
}

.arvis-hero__badge-text {
  font-size: 13px;
  color: var(--arvis-midnight, #111827);
}

.arvis-hero__badge-text strong {
  font-weight: 700;
}

@media (max-width: 991px) {
  .arvis-hero__visual {
    min-height: 380px;
  }
}

@media (max-width: 767px) {
  .arvis-hero {
    padding: 24px 0 32px;
  }
  .arvis-hero__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .arvis-hero__sub {
    max-width: none;
  }
  .arvis-hero__visual {
    min-height: 320px;
  }
  .arvis-hero__visual-img-wrap {
    inset: 24px;
  }
  .arvis-hero__badge--top {
    top: 16px;
    right: 16px;
  }
  .arvis-hero__badge--bottom {
    bottom: 16px;
    left: 16px;
  }
  .arvis-hero__trust {
    gap: 16px;
    font-size: 13px;
  }
}

/* ==========================================================================
   V2.1 — Homepage Categories Grid
   ========================================================================== */

.arvis-homecats {
  padding: 56px 0;
}

.arvis-homecats__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}

.arvis-homecats__heading {
  max-width: 560px;
}

.arvis-homecats__eyebrow {
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 8px;
}

.arvis-homecats__title {
  position: relative;
  display: inline-block;
  font-size: 34px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.025em;
  margin: 0 0 16px;
}

.arvis-homecats__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 56px;
  height: 3px;
  border-radius: 2px;
  background: var(--arvis-ember, #ff5c35);
}

.arvis-homecats__sub {
  font-size: 15px;
  line-height: 1.6;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
}

.arvis-homecats__all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827) !important;
  text-decoration: none;
  white-space: nowrap;
  transition: color 200ms, gap 200ms;
}

.arvis-homecats__all:hover {
  color: var(--arvis-ember, #ff5c35) !important;
  gap: 10px;
}

.arvis-homecats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.arvis-homecats__card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--dark-surface);
  border-radius: 16px;
  padding: 12px;
  overflow: hidden;
  text-decoration: none;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.06);
  transition: transform 220ms ease, box-shadow 220ms ease;
}

.arvis-homecats__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(17, 24, 39, 0.28);
  color: #ffffff !important;
}

/* Ember glow — colt sus-dreapta */
.arvis-homecats__card-glow {
  position: absolute;
  top: -30px;
  right: -30px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.6) 0%, rgba(255, 92, 53, 0) 70%);
  opacity: 0.7;
  mix-blend-mode: screen;
  pointer-events: none;
  transition: opacity 220ms ease;
  z-index: 3;
}

.arvis-homecats__card:hover .arvis-homecats__card-glow {
  opacity: 1;
}

.arvis-homecats__card-img-wrap {
  position: relative;
  z-index: 1;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  overflow: hidden;
  background: var(--arvis-snow, #eef1f5);
  display: flex;
  align-items: center;
  justify-content: center;
}

.arvis-homecats__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 400ms ease;
}

.arvis-homecats__card:hover .arvis-homecats__card-img {
  transform: scale(1.05);
}

.arvis-homecats__card-placeholder {
  color: #9aa5b1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.arvis-homecats__card-body {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 6px 6px;
}

.arvis-homecats__card-name {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
  color: #ffffff !important;
}

.arvis-homecats__card-count {
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 800;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-homecats__card-arrow {
  flex-shrink: 0;
  color: var(--arvis-slate, #6b7280);
  transition: transform 200ms, color 200ms;
}
.arvis-homecats__card:hover .arvis-homecats__card-arrow {
  transform: translateX(3px);
  color: var(--arvis-ember, #ff5c35);
}

@media (max-width: 991px) {
  .arvis-homecats__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 767px) {
  .arvis-homecats__header {
    flex-direction: column;
    align-items: flex-start;
  }
  .arvis-homecats__grid {
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
}

/* ==========================================================================
   V2.1 — Homepage Newsletter
   ========================================================================== */

.arvis-newsletter {
  padding: 32px 0 48px;
}

.arvis-newsletter__inner {
  position: relative;
  overflow: hidden;
  background: var(--dark-surface);
  color: #ffffff;
  border-radius: 24px;
  padding: 56px 40px;
  text-align: center;
}

.arvis-newsletter__glow {
  position: absolute;
  top: -60px;
  left: 50%;
  transform: translateX(-50%);
  width: 520px;
  height: 380px;
  background: radial-gradient(circle at 50% 0%, rgba(255, 92, 53, 0.22), transparent 62%);
  pointer-events: none;
  z-index: 0;
}

.arvis-newsletter__content {
  position: relative;
  z-index: 1;
  max-width: 560px;
  margin: 0 auto;
}

.arvis-newsletter__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  margin-bottom: 20px;
}

.arvis-newsletter__title {
  font-size: 34px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.025em;
  margin: 0 0 14px;
  color: #ffffff;
}

.arvis-newsletter__sub {
  font-size: 16px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.7);
  margin: 0 0 26px;
}

.arvis-newsletter__hl {
  color: var(--arvis-ember, #ff5c35);
  font-weight: 700;
}

.arvis-newsletter__form {
  display: flex;
  gap: 10px;
  max-width: 480px;
  margin: 0 auto;
}

.arvis-newsletter__input {
  flex: 1;
  min-width: 0;
  padding: 14px 22px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-size: 14px;
}
.arvis-newsletter__input::placeholder {
  color: rgba(255, 255, 255, 0.45);
}
.arvis-newsletter__input:focus {
  outline: none;
  border-color: var(--arvis-ember, #ff5c35);
  background: rgba(255, 255, 255, 0.12);
}

.arvis-newsletter__btn {
  padding: 14px 28px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  font-weight: 700;
  font-size: 14px;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background 150ms, transform 150ms;
}
.arvis-newsletter__btn:hover {
  background: #e64a26;
  transform: translateY(-1px);
}

.arvis-newsletter__foot {
  margin: 16px 0 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.5);
}

.arvis-newsletter__icon--ok {
  background: #22c55e;
}

.arvis-newsletter__code {
  display: inline-block;
  margin: 6px auto 0;
  padding: 12px 28px;
  border-radius: 12px;
  border: 1px dashed rgba(255, 92, 53, 0.6);
  background: rgba(255, 92, 53, 0.1);
  color: var(--arvis-ember, #ff5c35);
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

@media (max-width: 575px) {
  .arvis-newsletter__inner {
    padding: 40px 24px;
  }
  .arvis-newsletter__title {
    font-size: 26px;
  }
  .arvis-newsletter__form {
    flex-direction: column;
  }
}

/* ==========================================================================
   V2.1 — Homepage Product Grids (Bestsellers + Produse Noi)
   ========================================================================== */

.arvis-homeproducts {
  padding: 48px 0;
}

.arvis-homeproducts__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 24px;
  gap: 16px;
}

.arvis-homeproducts__eyebrow {
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 4px;
}

.arvis-homeproducts__title {
  position: relative;
  display: inline-block;
  font-size: 28px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.02em;
  margin: 0 0 8px;
}
.arvis-homeproducts__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 48px;
  height: 3px;
  border-radius: 2px;
  background: var(--arvis-ember, #ff5c35);
}

.arvis-homeproducts__viewall {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--arvis-ember, #ff5c35);
  text-decoration: none;
  white-space: nowrap;
  transition: gap 200ms;
}
.arvis-homeproducts__viewall:hover {
  gap: 10px;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-homeproducts__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

/* Cardul de produs reutilizeaza miniatura temei (catalog/_partials/miniatures);
   stilul de baza vine din 07-product-card.css. Aici doar integrarea in grid
   + click pe tot cardul (stretched link), mai putin butonul si imaginea. */
.arvis-homeproducts__grid .js-product-miniature-wrapper {
  height: 100%;
}

/* Click oriunde pe card -> PDP, mai putin CTA-ul si overlay-urile din imagine */
.arvis-home-pc__stretched {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.arvis-home-pc .arvis-pc__media,
.arvis-home-pc .arvis-pc__cta {
  position: relative;
  z-index: 2;
}

/* Fundalul alb al imaginii e setat global in 07-product-card.css (.arvis-pc__media). */

@media (max-width: 991px) {
  .arvis-homeproducts__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 767px) {
  .arvis-homeproducts__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .arvis-homeproducts__header {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ==========================================================================
   V2.1 — Homepage Testimoniale
   ========================================================================== */

.arvis-testimonials {
  padding: 48px 0;
  background: var(--arvis-snow, #f8f9fa);
}

.arvis-testimonials__header {
  text-align: center;
  margin-bottom: 32px;
}

.arvis-testimonials__eyebrow {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 8px;
}

.arvis-testimonials__title {
  font-size: 32px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  letter-spacing: -0.025em;
  margin: 0;
}

.arvis-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.arvis-testimonials__card {
  background: var(--surface);
  border-radius: 16px;
  padding: 28px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.arvis-testimonials__stars {
  display: flex;
  gap: 2px;
}

.arvis-testimonials__card-title {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  color: var(--arvis-midnight, #111827);
}

.arvis-testimonials__card-text {
  font-size: 14px;
  line-height: 1.6;
  color: var(--arvis-slate, #6b7280);
  margin: 0;
  flex: 1;
}

.arvis-testimonials__card-footer {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
}

.arvis-testimonials__card-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  flex-shrink: 0;
}

.arvis-testimonials__card-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.arvis-testimonials__card-name {
  font-size: 13px;
  color: var(--arvis-midnight, #111827);
}

.arvis-testimonials__card-product {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Sursa recenziei (ex. Google) — badge cu logo, scoate in evidenta proveninenta */
.arvis-testimonials__card-source {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  color: var(--arvis-slate, #6b7280);
}
.arvis-testimonials__card-source--google {
  align-self: flex-start;
  padding: 2px 9px 2px 7px;
  border-radius: 999px;
  background: var(--surface-container, #f4f5f7);
  border: 1px solid var(--line, #e5e7eb);
  color: var(--arvis-midnight, #111827);
}
.arvis-testimonials__card-source--link {
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.arvis-testimonials__card-source--link:hover,
.arvis-testimonials__card-source--link:focus-visible {
  border-color: var(--arvis-ember, #ff5c35);
  background: var(--surface, #fff);
}
.arvis-testimonials__card-source .arvis-gicon {
  flex: 0 0 auto;
  display: block;
}

@media (max-width: 767px) {
  .arvis-testimonials__grid {
    grid-template-columns: 1fr;
  }
}

/* === Hero CTA "Vezi bestsellers" anchor offset (sticky header) === */
#arvis-bestsellers {
  scroll-margin-top: 100px;
}

/* ==========================================================================
   V2.1 — Homepage Oferta saptamanii (dupa Bestsellers)
   ========================================================================== */

.arvis-offer {
  padding: 8px 0 48px;
}

.arvis-offer__panel {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 0.85fr;
  gap: 40px;
  align-items: center;
  padding: 48px 52px;
  border-radius: 24px;
  background: var(--dark-surface);
}

/* Glow Ember stanga-jos */
.arvis-offer__glow {
  position: absolute;
  left: -80px;
  bottom: -100px;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 92, 53, 0.45) 0%, rgba(255, 92, 53, 0) 70%);
  pointer-events: none;
  z-index: 0;
}

.arvis-offer__content {
  position: relative;
  z-index: 1;
}

.arvis-offer__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--arvis-ember, #ff5c35);
  margin-bottom: 14px;
}

.arvis-offer__title {
  font-size: 34px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: #ffffff;
  margin: 0 0 14px;
}
.arvis-offer__title-pct {
  color: var(--arvis-ember, #ff5c35);
  white-space: nowrap;
}

.arvis-offer__sub {
  font-size: 15px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.66);
  margin: 0 0 22px;
  max-width: 46ch;
}

.arvis-offer__price-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 22px;
}

.arvis-offer__price {
  font-size: 42px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--arvis-ember, #ff5c35);
}

.arvis-offer__price-old {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.5);
  text-decoration: line-through;
}

.arvis-offer__countdown {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 26px;
}
.arvis-offer__countdown-label {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  margin-right: 4px;
}
.arvis-offer__unit {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  min-width: 52px;
  padding: 9px 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.arvis-offer__unit b {
  font-size: 20px;
  font-weight: 800;
  color: #ffffff;
  font-variant-numeric: tabular-nums;
}
.arvis-offer__unit small {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 2px;
}

.arvis-offer__cta,
.arvis-offer__cta:link,
.arvis-offer__cta:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 26px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none !important;
  transition: background 150ms, transform 150ms;
}
.arvis-offer__cta:hover,
.arvis-offer__cta:focus {
  background: #e64a26;
  color: #ffffff !important;
  transform: translateY(-1px);
}

.arvis-offer__visual {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 4 / 3;
  border-radius: 16px;
  overflow: hidden;
  background: var(--surface-2, #f1f3f5);
}
.arvis-offer__visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 24px;
}
.arvis-offer__visual-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: #9aa5b1;
  font-size: 13px;
}

@media (max-width: 767px) {
  .arvis-offer__panel {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 32px 24px;
  }
  .arvis-offer__title {
    font-size: 26px;
  }
  .arvis-offer__price {
    font-size: 36px;
  }
  .arvis-offer__glow {
    left: -120px;
    bottom: -140px;
  }
}
/* ==========================================================================
   ARVIS — Lista de dorinte (V2.11)
   Pagina wishlist (iqitwishlist override). Cardul refoloseste .arvis-pc;
   aici: grid + inima-remove + status stoc + empty state + wishlist partajat.
   ========================================================================== */

/* === Grid: 2 col mobil / 3 col desktop === */
.arvis-wishlist-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 8px;
}

@media (min-width: 992px) {
  .arvis-wishlist-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }
}

/* Card: fundal alb + border vizibil pe pagina alba (#3) + full-height pt. butoane aliniate.
   position:relative e ESENTIAL — contine stretched-link-ul .arvis-pc__title a::after in card. */
.arvis-wishlist-grid .arvis-wishlist-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--surface);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 14px;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.arvis-wishlist-grid .arvis-wishlist-card:hover {
  border-color: #d1d5db;
  box-shadow: 0 4px 12px rgba(17, 24, 39, 0.06);
}

/* Media alb: setat global in 07-product-card.css (.arvis-pc__media). */

/* Stretched-link: tot cardul e clickabil spre produs (.arvis-pc__title a::after, inset:0).
   Acum e CONTINUT in card datorita position:relative de mai sus — heart (z3) + CTA (z2)
   raman deasupra si clickabile. (Bug-ul "click oriunde pe pagina" venea din lipsa
   position:relative pe card, nu din ::after.) */

/* #1 — ascunde input-ul de cantitate din partial-ul parinte (ramane doar butonul Adauga).
   Larg: orice input + wrapperele tipice de qty din .arvis-pc__cta; butonul (.btn / a) ramane. */
.arvis-wishlist-card .arvis-pc__cta input,
.arvis-wishlist-card .arvis-pc__cta .product-quantity,
.arvis-wishlist-card .arvis-pc__cta .qty,
.arvis-wishlist-card .arvis-pc__cta .input-group,
.arvis-wishlist-card .arvis-pc__cta .bootstrap-touchspin {
  display: none !important;
}

/* CTA deasupra oricarui overlay rezidual */
.arvis-wishlist-card .arvis-pc__cta {
  position: relative;
  z-index: 2;
}

.arvis-wishlist-grid .arvis-wishlist-card .arvis-pc__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.arvis-wishlist-grid .arvis-wishlist-card .arvis-pc__cta {
  margin-top: auto;
}

/* === Inima remove — sus dreapta, cerc Ember === */
.arvis-wishlist-remove {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  box-shadow: 0 2px 6px rgba(17, 24, 39, 0.18);
  transition: background 0.15s ease, transform 0.15s ease;
}

.arvis-wishlist-remove:hover,
.arvis-wishlist-remove:focus-visible {
  background: var(--arvis-ember-hover, #e64a24);
  transform: scale(1.08);
  outline: none;
}

.arvis-wishlist-remove svg {
  display: block;
}

/* === Status stoc === */
.arvis-wishlist-stock {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  margin: 2px 0 10px;
}

.arvis-wishlist-stock::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  flex: 0 0 auto;
}

.arvis-wishlist-stock--available {
  color: #1f9d6b;
}

.arvis-wishlist-stock--last_remaining_items {
  color: #b45309;
}

.arvis-wishlist-stock--unavailable {
  color: #dc2626;
}

/* === Empty state === */
.arvis-wishlist-empty {
  text-align: center;
  padding: 48px 20px 40px;
}

.arvis-wishlist-empty.hidden-xs-up {
  display: none !important;
}

.arvis-wishlist-empty__icon {
  color: var(--arvis-slate, #6b7280);
  opacity: 0.55;
  margin-bottom: 14px;
}

.arvis-wishlist-empty__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 6px;
}

.arvis-wishlist-empty__sub {
  font-size: 14px;
  color: var(--arvis-slate, #6b7280);
  margin: 0 0 20px;
}

.arvis-wishlist-empty__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
}

.arvis-wishlist-empty__cta:hover {
  background: var(--arvis-ember-hover, #e64a24);
}

/* === Wishlist partajat (read-only, fara sidebar cont) === */
.arvis-wishlist-shared {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 16px 48px;
}

.arvis-wishlist-shared__title {
  font-size: 24px;
  font-weight: 800;
  color: var(--arvis-midnight, #111827);
  margin: 0 0 20px;
}
/* ==========================================================================
   ARVIS — Mega menu blocks (V2.5)
   Stiluri pentru blocurile Custom HTML lipite in IQIT Megamenu:
   cardul promo "Ghid Arvis" + elementul telefon.
   (Structura meniului — tab-uri, coloane — se configureaza din BO; aici doar
   componentele custom pe care le controlam noi prin HTML.)
   ========================================================================== */

/* === Card promo (coloana dreapta din mega dropdown) === */
.arvis-mm-promo {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 280px;
  padding: 24px;
  border-radius: 16px;
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(255, 92, 53, 0.22), transparent 60%),
    var(--dark-surface, #111827);
  color: #ffffff;
  text-decoration: none !important;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.arvis-mm-promo:hover,
.arvis-mm-promo:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(17, 24, 39, 0.25);
  outline: none;
}

.arvis-mm-promo__eyebrow {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-mm-promo__title {
  margin-top: 10px;
  font-size: 20px;
  line-height: 1.25;
  font-weight: 800;
  color: #ffffff !important;
}

.arvis-mm-promo__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding-top: 18px;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-ember, #ff5c35) !important;
}

.arvis-mm-promo__cta svg {
  transition: transform 0.15s ease;
}

.arvis-mm-promo:hover .arvis-mm-promo__cta svg {
  transform: translateX(3px);
}

/* === Telefon (element aliniat dreapta in bara meniu) === */
.arvis-mm-phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none !important;
  color: var(--arvis-midnight, #111827) !important;
  font-family: "Inter", system-ui, sans-serif;
  white-space: nowrap;
}

.arvis-mm-phone svg {
  color: var(--arvis-ember, #ff5c35);
  flex: 0 0 auto;
}

.arvis-mm-phone__num {
  font-weight: 700;
  font-size: 14px;
}

.arvis-mm-phone__sep {
  color: var(--arvis-line, #e5e7eb);
}

.arvis-mm-phone__hours {
  font-size: 12px;
  color: var(--arvis-slate, #6b7280) !important;
}

/* ==========================================================================
   Mega dropdown — bloc HTML autorat (V2.5 faza 2)
   Layout intern al unei coloane HTML latime-12 din IQIT: 3 coloane facet
   ("Dupa telefon/material/brand") + cardul promo. Linkurile = URL-uri
   ps_facetedsearch / producator. Vezi spec 2026-06-02-megamenu-v25-design.md.
   ========================================================================== */

.arvis-mm {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 280px;
  gap: 32px;
  padding: 28px 32px;
  font-family: "Inter", system-ui, sans-serif;
}

/* Fara card promo → 3 coloane egale (adauga clasa pe wrapper) */
.arvis-mm--no-promo {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* 2 coloane facet + card promo (ex. Suporturi auto) */
.arvis-mm--2col {
  grid-template-columns: repeat(2, minmax(0, 1fr)) 280px;
}

/* 2 coloane facet, fara promo */
.arvis-mm--2col.arvis-mm--no-promo {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* 1 coloana facet + promo (ex. doar "Dupa brand") — aliniat stanga, fara gol intins */
.arvis-mm--brand-only {
  grid-template-columns: minmax(220px, 360px) 280px;
  justify-content: start;
  gap: 48px;
}

.arvis-mm--brand-only.arvis-mm--no-promo {
  grid-template-columns: minmax(220px, 360px);
}

/* === Coloana facet === */
.arvis-mm__col {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.arvis-mm__heading {
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--arvis-line, #e5e7eb);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
}

/* Linkuri submeniu — dublu-selector + !important ca sa bata regula
   tema-parinte a:link:not(.nav-link):not(.btn) (specificity 0,3,1) */
.arvis-mm a.arvis-mm__link:link,
.arvis-mm a.arvis-mm__link:visited {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--arvis-slate, #374151) !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.arvis-mm a.arvis-mm__link:hover,
.arvis-mm a.arvis-mm__link:focus-visible {
  color: var(--arvis-ember, #ff5c35) !important;
  outline: none;
}

.arvis-mm__chev {
  flex: 0 0 auto;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.arvis-mm a.arvis-mm__link:hover .arvis-mm__chev,
.arvis-mm a.arvis-mm__link:focus-visible .arvis-mm__chev {
  opacity: 1;
  transform: translateX(0);
}

/* Link subsol "Vezi toate" */
.arvis-mm a.arvis-mm__all:link,
.arvis-mm a.arvis-mm__all:visited {
  margin-top: auto;
  padding-top: 12px;
  font-size: 14px;
  font-weight: 700;
  color: var(--arvis-ember, #ff5c35) !important;
  text-decoration: none !important;
}

.arvis-mm a.arvis-mm__all:hover {
  text-decoration: underline !important;
}

/* === Mobil: IQIT trece pe drawer < 992px → grid pe 1 coloana === */
@media (max-width: 991px) {
  .arvis-mm {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 16px 4px;
  }

  .arvis-mm-promo {
    min-height: auto;
  }
}

/* ==========================================================================
   Meniu VERTICAL "Toate categoriile" (IQIT cbp-vertical) — V2.5
   Markup: #cbp-hrmenu1.cbp-vertical > .cbp-vertical-title (trigger)
           + ul#cbp-hrmenu1-ul (categorii) + .cbp-hrsub (fly-out).
   Stilizam butonul-pill + panoul, scopat pe ID (bate default-urile IQIT).
   ========================================================================== */

@media (min-width: 992px) {
  /* Trigger = pill deschis Arvis (era bloc negru default) */
  #cbp-hrmenu1.cbp-vertical .cbp-vertical-title {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    background: var(--surface-2) !important;
    border: 1px solid var(--arvis-line, #e5e7eb);
    border-radius: 999px;
    vertical-align: middle;
    color: var(--arvis-midnight, #111827) !important;
    font-family: "Inter", system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1 !important;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  }

  /* nu lasa flex-ul barei sa stranga pill-ul (cauza wrap pe 2 randuri) */
  #iqitmegamenu-horizontal .cbp-vertical-on-top {
    flex: 0 0 auto;
  }

  /* Rename "Navigation" -> "Toate categoriile" din CSS (setarea BO nu e expusa).
     Daca o gasesti in International -> Translations (IqitMegaMenu), scoate astea. */
  #cbp-hrmenu1.cbp-vertical .cbp-vertical-title-text {
    font-size: 0 !important;
  }

  #cbp-hrmenu1.cbp-vertical .cbp-vertical-title-text::after {
    content: "Toate categoriile";
    font-size: 14px;
    font-weight: 700;
  }

  /* Meniu DESCHIS (hover oriunde pe nav, inclusiv submeniu) = pill ember plin, text alb.
     Submeniul e in interiorul nav#cbp-hrmenu1, deci nav:hover ramane true cat e deschis. */
  #cbp-hrmenu1.cbp-vertical:hover .cbp-vertical-title {
    background: var(--arvis-ember, #ff5c35) !important;
    border-color: var(--arvis-ember, #ff5c35);
    color: #ffffff !important;
  }

  #cbp-hrmenu1.cbp-vertical:hover .cbp-vertical-title .cbp-iconbars {
    color: #ffffff;
  }

  /* Iconul hamburger ember (stare default) */
  #cbp-hrmenu1.cbp-vertical .cbp-vertical-title .cbp-iconbars {
    color: var(--arvis-ember, #ff5c35);
    font-size: 15px;
  }

  /* Chevron jos in dreapta pill-ului (polish, ca in mockup) */
  #cbp-hrmenu1.cbp-vertical .cbp-vertical-title::after {
    content: "";
    width: 8px;
    height: 8px;
    margin-left: 4px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    opacity: 0.6;
  }

  /* Fly-out wrapper: aliniaza top-ul cu rail-ul (compenseaza margin-top-ul rail-ului) */
  #cbp-hrmenu1.cbp-vertical .cbp-hrsub-wrapper {
    margin-top: 8px !important;
  }

  /* Fly-out: scoatem border-top ember-ul default IQIT + il imbinam cu rail-ul.
     margin-top/-left = nudge fin (valori gasite live) ca sa se lipeasca perfect de rail. */
  #cbp-hrmenu1.cbp-vertical .cbp-hrsub {
    border-top: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    margin-top: -9px;
    margin-left: 9px;
  }

  /* Panoul fly-out al unei categorii = jumatatea dreapta a aceluiasi bloc */
  #cbp-hrmenu1.cbp-vertical .cbp-hrsub-inner {
    background: var(--surface);
    border: 1px solid var(--arvis-line, #e5e7eb);
    border-left: 0;                 /* se lipeste de rail */
    border-radius: 0 16px 16px 0;   /* rotund doar dreapta */
    box-shadow: 0 1px 2px rgba(17, 24, 39, 0.06), 0 16px 40px rgba(17, 24, 39, 0.12);
    padding: 24px 28px;
    min-height: 100%;
  }

  /* Reset bullets/markeri pe linkurile de subcategorie (artefactul "‹" din fata) */
  #cbp-hrmenu1.cbp-vertical .cbp-links,
  #cbp-hrmenu1.cbp-vertical .cbp-valinks {
    list-style: none !important;
    margin: 0;
    padding: 0;
  }

  #cbp-hrmenu1.cbp-vertical .cbp-links li::before,
  #cbp-hrmenu1.cbp-vertical .cbp-links li a::before {
    content: none !important;
    display: none !important;
  }

  /* Titlu coloana categorie */
  #cbp-hrmenu1.cbp-vertical .cbp-column-title {
    display: block;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--arvis-line, #e5e7eb);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--arvis-slate, #6b7280) !important;
  }

  /* Linkuri subcategorii — dublu-selector + !important vs regula tema-parinte */
  #cbp-hrmenu1.cbp-vertical .cbp-links li a:link,
  #cbp-hrmenu1.cbp-vertical .cbp-links li a:visited {
    display: block;
    padding: 5px 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--arvis-slate, #374151) !important;
    text-decoration: none !important;
    transition: color 0.15s ease, transform 0.15s ease;
  }

  #cbp-hrmenu1.cbp-vertical .cbp-links li a:hover {
    color: var(--arvis-ember, #ff5c35) !important;
    transform: translateX(2px);
  }

  /* Indicatorul ">" de pe categoriile cu submeniu */
  #cbp-hrmenu1.cbp-vertical .cbp-submenu-aindicator {
    color: var(--arvis-slate, #9ca3af);
    margin-left: auto;
  }

  #cbp-hrmenu1.cbp-vertical .cbp-hrmenu-tab > a:hover .cbp-submenu-aindicator {
    color: var(--arvis-ember, #ff5c35);
  }

  /* --- Aliniere verticala: bara = flex, pill centrat cu home + itemele --- */
  #iqitmegamenu-horizontal {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  /* --- Lista de nivel 1 (rail-ul de categorii) = panou stanga slate, spatiu sub pill --- */
  #cbp-hrmenu1.cbp-vertical > #cbp-hrmenu1-ul {
    margin-top: 10px;
    padding: 10px;
    background: var(--surface-1, #fafafb);
    border: 1px solid var(--arvis-line, #e5e7eb);
    border-radius: 16px 0 0 16px; /* rotund doar stanga → se imbina cu fly-out-ul */
    box-shadow: 0 1px 2px rgba(17, 24, 39, 0.06), 0 16px 40px rgba(17, 24, 39, 0.12);
  }

  /* Punte de hover transparenta peste gap-ul pill↔rail (altfel meniul se inchide
     cand mouse-ul trece prin spatiul gol). Face parte din rail → hover continuu. */
  #cbp-hrmenu1.cbp-vertical > #cbp-hrmenu1-ul::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -14px;
    height: 16px;
  }

  /* Randuri rail */
  #cbp-hrmenu1.cbp-vertical > #cbp-hrmenu1-ul > .cbp-hrmenu-tab > a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 10px;
    border: 0 !important; /* fara border pe randuri (cerere user, light+dark) */
    color: var(--arvis-midnight, #111827) !important;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none !important;
    transition: background 0.15s ease, color 0.15s ease;
  }

  /* Activ = randul a carui submeniu e deschis (raman ember cat esti in fly-out,
     fiindca fly-out-ul e in interiorul .cbp-hrmenu-tab). Fara box-shadow —
     umbra il facea sa arate ca un card cu border (cerere user). */
  #cbp-hrmenu1.cbp-vertical > #cbp-hrmenu1-ul > .cbp-hrmenu-tab:hover > a {
    background: var(--surface);
    color: var(--arvis-ember, #ff5c35) !important;
    box-shadow: none !important;
  }

  #cbp-hrmenu1.cbp-vertical > #cbp-hrmenu1-ul > .cbp-hrmenu-tab > a .cbp-mainlink-icon {
    color: var(--arvis-ember, #ff5c35);
  }

  /* Iconite categorii (<img> SVG) = tile ember ca-n drawer-ul mobil, pt.
     consistenta (ember + bg ember-transparent, ambele teme). Filtru ember
     aproximativ pe SVG-ul line-art. !important ca sa bata sizing-ul temei. */
  #cbp-hrmenu1.cbp-vertical > #cbp-hrmenu1-ul > .cbp-hrmenu-tab > a img.cbp-mainlink-iicon,
  #cbp-hrmenu1.cbp-vertical .cbp-hrmenu-tab > a > img {
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    padding: 8px !important;
    background: rgba(255, 92, 53, 0.12) !important;
    border-radius: 10px !important;
    object-fit: contain !important;
    filter: brightness(0) saturate(100%) invert(47%) sepia(60%) saturate(2438%) hue-rotate(338deg) brightness(101%) contrast(101%) !important;
  }

  /* Sageata catre fly-out, impinsa in dreapta */
  #cbp-hrmenu1.cbp-vertical > #cbp-hrmenu1-ul > .cbp-hrmenu-tab > a .cbp-submenu-aindicator {
    margin-left: auto;
  }
}

/* ==========================================================================
   Mega menu MOBILE drawer (iqitmegamenu .mobile-menu) — V2.6
   Markup: #iqitmegamenu-mobile.mobile-menu
     .mobile-menu__header-wrapper (back-btn + close)
     .mobile-menu__scroller > li.mobile-menu__tab > a.mobile-menu__link + .mobile-menu__arrow
       + .mobile-menu__submenu (panou slide cu .arvis-mm)
     .mobile-menu__footer (limba/moneda + .mobile-menu__user)
   ========================================================================== */
@media (max-width: 991px) {
  #iqitmegamenu-mobile {
    font-family: "Inter", system-ui, sans-serif;
  }

  /* Drawer-ul peste bottom-nav (bottom-nav e z-index 9985) */
  #_mobile_iqitmegamenu-mobile.show {
    z-index: 9995 !important;
  }

  /* Bottom-nav si drawer-ul sunt in stacking contexts diferite → z-index nu ajunge.
     Ascundem bottom-nav-ul + sticky-ul PDP (Adauga in cos) cat timp meniul e deschis. */
  body.arvis-mmenu-open .arvis-bottomnav,
  body.arvis-mmenu-open #arvis-pdp-sticky,
  body.arvis-mmenu-open .arvis-pdp-sticky {
    display: none !important;
  }

  /* --- Header drawer --- */
  #iqitmegamenu-mobile .mobile-menu__header-wrapper {
    position: relative;
    z-index: 3; /* deasupra scroller-ului absolut (altfel acopera logo-ul) */
    display: flex !important;
    align-items: center !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid var(--arvis-line, #e5e7eb);
    min-height: 64px;
    background: var(--surface);
  }

  #iqitmegamenu-mobile .mobile-menu__title {
    font-size: 16px;
    font-weight: 800;
    color: var(--arvis-midnight, #111827);
  }

  #iqitmegamenu-mobile .mobile-menu__back-btn {
    padding: 4px 0 !important;
    color: var(--arvis-midnight, #111827) !important;
    font-weight: 700;
  }

  #iqitmegamenu-mobile .mobile-menu__back-btn .fa-angle-left {
    color: var(--arvis-ember, #ff5c35);
    font-size: 18px;
  }

  /* Buton close = cerc Arvis */
  #iqitmegamenu-mobile .mobile-menu__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--surface-2);
    color: var(--arvis-midnight, #111827);
    border: 0;
    transition: background 0.15s ease, color 0.15s ease;
  }

  #iqitmegamenu-mobile .mobile-menu__close:hover {
    background: rgba(255, 92, 53, 0.1);
    color: var(--arvis-ember, #ff5c35);
  }

  /* Logo Arvis injectat in header (vizibil la root; ascuns cand esti in submeniu) */
  #iqitmegamenu-mobile .arvis-mm-logo {
    display: inline-flex;
    align-items: center;
    margin-right: auto;
  }

  #iqitmegamenu-mobile .arvis-mm-logo img {
    height: 40px;
    width: auto;
    display: block;
  }

  #iqitmegamenu-mobile.arvis-in-submenu .arvis-mm-logo {
    display: none; /* in submeniu apare back-btn + titlu in loc */
  }

  /* Back-btn vizibil doar in submeniu (la root e gol) */
  #iqitmegamenu-mobile:not(.arvis-in-submenu) .mobile-menu__back-btn {
    display: none;
  }

  /* Footer: ascundem "Autentificare" (avem card cont sus) */
  #iqitmegamenu-mobile .mobile-menu__user {
    display: none !important;
  }

  /* Label "CATEGORII" injectat inaintea listei de categorii */
  #iqitmegamenu-mobile .arvis-mm-cat-heading {
    display: block;
    padding: 14px 6px 8px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--arvis-slate, #6b7280);
  }

  /* --- Card cont + search injectate in above-content (design #74) --- */
  #iqitmegamenu-mobile .mobile-menu__above-content {
    display: block;
    list-style: none;
  }

  /* Search = pill ca pe desktop, icon dreapta, focus ember */
  #iqitmegamenu-mobile .arvis-mm-search {
    padding: 14px 16px;
    border-bottom: 1px solid var(--arvis-line, #e5e7eb);
  }

  #iqitmegamenu-mobile .arvis-mm-search__form {
    position: relative;
    margin: 0;
  }

  #iqitmegamenu-mobile .arvis-mm-search input {
    width: 100% !important;
    padding: 12px 44px 12px 18px !important;
    border: 1px solid var(--arvis-line, #e5e7eb) !important;
    border-radius: 999px !important;
    background: var(--surface) !important;
    font-size: 14px !important;
    font-family: "Inter", system-ui, sans-serif !important;
    color: var(--arvis-midnight, #111827) !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }

  #iqitmegamenu-mobile .arvis-mm-search input:focus {
    outline: none;
    border-color: var(--arvis-ember, #ff5c35) !important;
    box-shadow: 0 0 0 3px rgba(255, 92, 53, 0.12);
  }

  #iqitmegamenu-mobile .arvis-mm-search__btn {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    background: transparent;
    border: 0;
    color: var(--arvis-slate, #6b7280);
    cursor: pointer;
  }

  /* Card cont — rand cu divider jos (ca in design), nu card cu border propriu */
  #iqitmegamenu-mobile a.arvis-mm-account {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    border-bottom: 1px solid var(--arvis-line, #e5e7eb);
    background: transparent;
    text-decoration: none !important;
  }

  #iqitmegamenu-mobile .arvis-mm-account__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--dark-surface);
    color: #ffffff;
  }

  #iqitmegamenu-mobile .arvis-mm-account__text {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
    min-width: 0;
  }

  #iqitmegamenu-mobile .arvis-mm-account__title {
    font-size: 15px;
    font-weight: 700;
    color: var(--arvis-midnight, #111827);
  }

  #iqitmegamenu-mobile .arvis-mm-account__sub {
    font-size: 12px;
    color: var(--arvis-slate, #6b7280);
  }

  #iqitmegamenu-mobile .arvis-mm-account__chev {
    margin-left: auto;
    color: var(--arvis-slate, #9ca3af);
    flex: 0 0 auto;
  }

  /* --- DESPRE ARVIS injectat in below-content --- */
  #iqitmegamenu-mobile .arvis-mm-about {
    padding: 8px 6px 4px;
  }

  #iqitmegamenu-mobile .arvis-mm-about__heading {
    display: block;
    margin: 8px 0 8px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--arvis-slate, #6b7280);
  }

  #iqitmegamenu-mobile a.arvis-mm-about__link:link,
  #iqitmegamenu-mobile a.arvis-mm-about__link:visited {
    display: block;
    padding: 11px 0;
    font-size: 15px;
    font-weight: 500;
    color: var(--arvis-midnight, #111827) !important;
    text-decoration: none !important;
  }

  #iqitmegamenu-mobile a.arvis-mm-about__link:active {
    color: var(--arvis-ember, #ff5c35) !important;
  }

  /* --- Randuri categorii (nivel 1) --- */
  #iqitmegamenu-mobile .mobile-menu__scroller {
    padding: 8px 12px !important;
  }

  #iqitmegamenu-mobile .mobile-menu__tab {
    border-bottom: 1px solid var(--arvis-line-soft, #f1f3f5);
  }

  #iqitmegamenu-mobile .mobile-menu__tab:last-of-type {
    border-bottom: 0;
  }

  #iqitmegamenu-mobile a.mobile-menu__link:link,
  #iqitmegamenu-mobile a.mobile-menu__link:visited {
    display: flex !important;
    align-items: center !important;
    padding: 12px 6px !important;
    font-size: 16px;
    font-weight: 600;
    color: var(--arvis-midnight, #111827) !important;
    text-decoration: none !important;
  }

  /* Icon categorie = tile patrat rotunjit (ca in design #93).
     Specificity mare (id drawer + img + clasa) ca sa bata regula temei-parinte. */
  #_mobile_iqitmegamenu-mobile img.mobile-menu__tab-icon,
  #_mobile_iqitmegamenu-mobile img.mobile-menu__tab-icon--img,
  #iqitmegamenu-mobile img.mobile-menu__tab-icon {
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important; /* tema pune max-height ~23px care bate height → oval */
    margin: 0 12px 0 0 !important;
    padding: 9px !important;
    background: rgba(255, 92, 53, 0.12) !important; /* ember tint — vizibil pe light+dark */
    border-radius: 12px !important;
    object-fit: contain !important;
    align-self: center !important;
    /* SVG line-art (<img>) recolorat pe ember (~#ff5c35) ca sa fie identic in
       ambele teme. Filtru aproximativ generat pt. ember. */
    filter: brightness(0) saturate(100%) invert(47%) sepia(60%) saturate(2438%) hue-rotate(338deg) brightness(101%) contrast(101%) !important;
  }

  #iqitmegamenu-mobile .mobile-menu__tab > a.mobile-menu__link:active {
    color: var(--arvis-ember, #ff5c35) !important;
  }

  /* Chevron dreapta */
  #iqitmegamenu-mobile .mobile-menu__arrow {
    padding: 0 6px;
  }

  #iqitmegamenu-mobile .mobile-menu__arrow .expand-icon {
    color: var(--arvis-slate, #9ca3af);
    font-size: 16px;
  }

  /* Panoul de submeniu (continutul .arvis-mm e deja stilizat) */
  #iqitmegamenu-mobile .mobile-menu__submenu {
    padding: 8px 12px !important;
  }

  /* Submeniu pe sursa VERTICALA = liste subcategorii native (column-title + links-list) */
  #iqitmegamenu-mobile .mobile-menu__column-title {
    display: block;
    margin: 8px 0 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--arvis-line, #e5e7eb);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--arvis-slate, #6b7280);
  }

  #iqitmegamenu-mobile .mobile-menu__links-list {
    list-style: none !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
  }

  #iqitmegamenu-mobile .mobile-menu__links-list-li a:link,
  #iqitmegamenu-mobile .mobile-menu__links-list-li a:visited {
    display: block;
    padding: 11px 4px;
    font-size: 15px;
    font-weight: 500;
    color: var(--arvis-midnight, #111827) !important;
    text-decoration: none !important;
    border-bottom: 1px solid var(--arvis-line-soft, #f1f3f5);
  }

  #iqitmegamenu-mobile .mobile-menu__links-list-li:last-child a {
    border-bottom: 0;
  }

  #iqitmegamenu-mobile .mobile-menu__links-list-li a:active {
    color: var(--arvis-ember, #ff5c35) !important;
  }

  /* --- Footer drawer (vizibilitatea = control din BO) --- */
  #iqitmegamenu-mobile .mobile-menu__footer {
    border-top: 1px solid var(--arvis-line, #e5e7eb);
    padding: 14px 16px !important;
    gap: 12px;
    flex-wrap: wrap;
  }

  /* Linie [Cercul Arvis] | [switcher] (injectata din JS) */
  #iqitmegamenu-mobile .arvis-mm-footer-row {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin-bottom: 4px;
  }
  #iqitmegamenu-mobile .arvis-mm-footer-row .arvis-theme-seg {
    margin: 0;
  }
  #iqitmegamenu-mobile .arvis-mm-footer-sep {
    color: var(--arvis-line, #e5e7eb);
    font-weight: 300;
    user-select: none;
  }

  /* Limba/moneda — RO only, nu le afisam */
  #iqitmegamenu-mobile .mobile-menu__language-currency {
    display: none !important;
  }

  #iqitmegamenu-mobile .mobile-menu__user a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    color: var(--arvis-midnight, #111827) !important;
    text-decoration: none !important;
  }

  #iqitmegamenu-mobile .mobile-menu__user .fa-user {
    color: var(--arvis-ember, #ff5c35);
  }

  /* --- Extra-uri injectate de JS (Wishlist + WhatsApp) --- */
  #iqitmegamenu-mobile .arvis-mm-mobile-extras {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
  }

  /* Cand nu exista footer (config vertical) → block la baza drawer-ului */
  #iqitmegamenu-mobile .arvis-mm-mobile-extras--standalone {
    margin-top: auto; /* impins la baza coloanei flex */
    padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    background: var(--surface);
    border-top: 1px solid var(--arvis-line, #e5e7eb);
  }

  #iqitmegamenu-mobile .arvis-mm-mobile-extras a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 6px;
    font-size: 15px;
    font-weight: 600;
    color: var(--arvis-midnight, #111827) !important;
    text-decoration: none !important;
  }

  #iqitmegamenu-mobile .arvis-mm-mobile-extras a .arvis-mm-extra-ico {
    color: var(--arvis-ember, #ff5c35);
    flex: 0 0 auto;
  }

  #iqitmegamenu-mobile .arvis-mm-mobile-extras a:active {
    color: var(--arvis-ember, #ff5c35) !important;
  }
}
/* ==========================================================================
   ARVIS — PDP galerie nav + share modal (V2.13)
   NOTA: CSS-ul PDP traieste in mod normal in SCSS (arvis-product.scss → theme.css).
   Bucatile noi (sageti galerie/zoom + buton & modal share) sunt aici in custom.css
   ca additive, ca sa evitam build-ul webpack. Cleanup viitor: mutat in SCSS.
   ========================================================================== */

/* Fundal alb in spatele imaginii principale (era --surface-container #F8F9FA gri).
   Specificitate .arvis-pdp + clasa => invinge regula din theme.css fara !important. */
.arvis-pdp .arvis-pdp__gallery-stage {
  background: var(--surface);
}

/* === Sageti prev/next pe main stage (desktop; mobil = swipe) === */
.arvis-pdp__gallery-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  color: var(--arvis-midnight, #111827);
  box-shadow: 0 2px 8px rgba(17, 24, 39, 0.12);
  cursor: pointer;
  opacity: 0.9;
  transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.arvis-pdp__gallery-nav:hover,
.arvis-pdp__gallery-nav:focus-visible {
  opacity: 1;
  background: var(--surface);
  color: var(--arvis-ember, #ff5c35);
  outline: none;
}

.arvis-pdp__gallery-nav--prev { left: 10px; }
.arvis-pdp__gallery-nav--next { right: 10px; }

@media (max-width: 767px) {
  /* pe mobil folosim swipe, ascundem sagetile */
  .arvis-pdp__gallery-nav { display: none; }
}

/* === Prev/next in zoom modal (imaginea mare) === */
.arvis-pdp__zoom-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  cursor: pointer;
  transition: background 0.15s ease;
}

.arvis-pdp__zoom-nav:hover,
.arvis-pdp__zoom-nav:focus-visible {
  background: rgba(255, 255, 255, 0.25);
  outline: none;
}

.arvis-pdp__zoom-nav--prev { left: 16px; }
.arvis-pdp__zoom-nav--next { right: 16px; }

@media (max-width: 767px) {
  .arvis-pdp__zoom-nav { width: 40px; height: 40px; background: rgba(255, 255, 255, 0.18); }
}

/* === Buton "Distribuie" === */
.arvis-pdp__share-open {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 999px;
  background: var(--surface);
  color: var(--arvis-midnight, #111827);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.arvis-pdp__share-open:hover,
.arvis-pdp__share-open:focus-visible {
  border-color: var(--arvis-ember, #ff5c35);
  color: var(--arvis-ember, #ff5c35);
  outline: none;
}

/* === Share modal === */
.arvis-pdp__share-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(17, 24, 39, 0.55);
}

/* hidden attr trebuie sa invinga display:flex de mai sus */
.arvis-pdp__share-modal[hidden] {
  display: none;
}

.arvis-pdp__share-dialog {
  width: 100%;
  max-width: 420px;
  background: var(--surface);
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(17, 24, 39, 0.25);
  overflow: hidden;
}

.arvis-pdp__share-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-bottom: 1px solid var(--arvis-line, #e5e7eb);
}

.arvis-pdp__share-head strong {
  font-size: 16px;
  color: var(--arvis-midnight, #111827);
}

.arvis-pdp__share-close {
  border: 0;
  background: transparent;
  cursor: pointer;
  color: var(--arvis-slate, #6b7280);
  display: inline-flex;
  padding: 4px;
  border-radius: 8px;
}

.arvis-pdp__share-close:hover {
  color: var(--arvis-midnight, #111827);
  background: var(--arvis-snow, #f8f9fa);
}

.arvis-pdp__share-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 18px;
}

.arvis-pdp__share-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 8px;
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 12px;
  background: var(--surface);
  color: var(--arvis-midnight, #111827);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none !important;
  cursor: pointer;
  transition: border-color 0.15s ease, transform 0.1s ease;
}

.arvis-pdp__share-item:hover {
  border-color: var(--arvis-ember, #ff5c35);
  transform: translateY(-1px);
}

.arvis-pdp__share-ic {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
}

.arvis-pdp__share-ic--wa { background: #25d366; }
.arvis-pdp__share-ic--fb { background: #1877f2; }
.arvis-pdp__share-ic--x { background: #000000; }
.arvis-pdp__share-ic--pin { background: #e60023; }
.arvis-pdp__share-ic--mail { background: var(--arvis-slate, #6b7280); }
.arvis-pdp__share-ic--copy { background: var(--dark-surface); }
/* ==========================================================================
   V2.19 — Newsletter popup (.arvis-nl) — shell custom (markup in arvisextend)
   Two-panel: aside Midnight (badge + headline + checklist) | panel alb (forma)
   RECUPERAT: era direct in assets/css/custom.css (nu in _dev partials) si a fost
   sters de un rebuild build-custom-css.sh. Acum e partial => build-safe.
   ========================================================================== */

.arvis-nl-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.arvis-nl-overlay[hidden] { display: none; }
.arvis-nl-overlay.is-open { opacity: 1; }

body.arvis-nl-lock { overflow: hidden; }

.arvis-nl__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 24, 39, 0.55);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.arvis-nl__dialog {
  position: relative;
  display: flex;
  width: min(880px, 100%);
  max-height: calc(100vh - 32px);
  background: var(--surface);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
  transform: translateY(14px) scale(0.98);
  transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1);
  font-family: "Inter", system-ui, sans-serif;
}

.arvis-nl-overlay.is-open .arvis-nl__dialog { transform: none; }

/* --- Aside (dark) --- */
.arvis-nl__aside {
  flex: 1 1 50%;
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 40px 36px;
  color: #ffffff;
  background:
    radial-gradient(120% 80% at 28% 8%, rgba(255, 92, 53, 0.22), transparent 55%),
    var(--dark-surface, #111827);
}

.arvis-nl__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(255, 92, 53, 0.14);
  color: var(--arvis-ember, #ff5c35);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.arvis-nl__aside-body {
  margin-top: auto;
  padding-top: 36px;
}

.arvis-nl__aside .arvis-nl__headline {
  margin: 0;
  font-size: 34px;
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #ffffff;
}

.arvis-nl__aside .arvis-nl__headline-hl { color: var(--arvis-ember, #ff5c35); }

.arvis-nl__aside-sub {
  margin: 18px 0 0;
  max-width: 34ch;
  font-size: 15px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.72);
}

.arvis-nl__list {
  list-style: none;
  margin: 26px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.arvis-nl__list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.92);
}

.arvis-nl__check {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* --- Panel (white) --- */
.arvis-nl__panel {
  flex: 1 1 50%;
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 44px 40px;
  overflow-y: auto;
}

.arvis-nl__close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--arvis-midnight, #111827);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.arvis-nl__close:hover {
  background: var(--arvis-snow, #f3f4f6);
  color: var(--arvis-ember, #ff5c35);
}

.arvis-nl__title {
  margin: 0;
  padding-right: 36px;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arvis-midnight, #111827);
}

.arvis-nl__sub {
  margin: 12px 0 0;
  font-size: 16px;
  line-height: 1.5;
  color: var(--arvis-slate, #6b7280);
}

.arvis-nl__sub--mobile { display: none; }

.arvis-nl__field {
  margin-top: 26px;
  padding: 12px 18px;
  background: var(--arvis-snow, #f3f4f6);
  border-radius: 16px;
  text-align: left;
}

.arvis-nl__label {
  display: block;
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--arvis-slate, #6b7280);
}

.arvis-nl__input {
  width: 100%;
  margin-top: 4px;
  padding: 2px 0 0;
  border: 0;
  background: transparent;
  font-family: inherit;
  font-size: 17px;
  color: var(--arvis-midnight, #111827);
  outline: none;
}

.arvis-nl__consent {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 20px;
  text-align: left;
  font-size: 14px;
  line-height: 1.4;
  color: var(--arvis-slate, #6b7280);
  cursor: pointer;
}

.arvis-nl__consent input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.arvis-nl__consent-box {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  border: 2px solid #d1d5db;
  background: var(--surface);
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.arvis-nl__consent-box svg { opacity: 0; transition: opacity 0.12s ease; }

.arvis-nl__consent input:checked + .arvis-nl__consent-box {
  background: var(--arvis-ember, #ff5c35);
  border-color: var(--arvis-ember, #ff5c35);
}

.arvis-nl__consent input:checked + .arvis-nl__consent-box svg { opacity: 1; }

.arvis-nl__consent input:focus-visible + .arvis-nl__consent-box {
  outline: 2px solid var(--arvis-ember, #ff5c35);
  outline-offset: 2px;
}

.arvis-nl__consent a,
.arvis-nl__consent strong {
  color: var(--arvis-midnight, #111827);
  text-decoration: underline;
  font-weight: 600;
}

.arvis-nl__submit {
  margin-top: 22px;
  width: 100%;
  padding: 16px 20px;
  border: 0;
  border-radius: 999px;
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  font-family: inherit;
  font-size: 17px;
  font-weight: 800;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.1s ease;
}

.arvis-nl__submit:hover { background: var(--arvis-ember-hover, #e64a24); }
.arvis-nl__submit:active { transform: scale(0.99); }

.arvis-nl__decline {
  margin-top: 14px;
  align-self: center;
  border: 0;
  background: none;
  color: var(--arvis-slate, #6b7280);
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}

.arvis-nl__decline:hover { color: var(--arvis-midnight, #111827); }

.arvis-nl__foot {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--arvis-line, #e5e7eb);
  font-size: 13px;
  line-height: 1.4;
  color: var(--arvis-slate, #6b7280);
}

.arvis-nl__foot svg { flex-shrink: 0; margin-top: 1px; }

/* --- Success state --- */
.arvis-nl__success {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 12px 0;
  margin: auto 0;
}

.arvis-nl__success-icon {
  width: 64px;
  height: 64px;
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.12);
  color: #16a34a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}

.arvis-nl__success .arvis-nl__title { padding-right: 0; }
.arvis-nl__success .arvis-nl__sub { margin-bottom: 4px; }

.arvis-nl__code {
  margin: 14px 0 10px;
  padding: 12px 22px;
  border: 2px dashed var(--arvis-ember, #ff5c35);
  border-radius: 12px;
  background: rgba(255, 92, 53, 0.06);
  color: var(--arvis-ember, #ff5c35);
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.arvis-nl__success-foot {
  margin: 0 0 18px;
  font-size: 13px;
  color: var(--arvis-slate, #6b7280);
}

.arvis-nl__success .arvis-nl__submit { margin-top: 8px; max-width: 280px; }

/* --- Mobile: bottom-sheet care intra din jos in sus, deasupra bottom nav-ului --- */
@media (max-width: 767px) {
  .arvis-nl-overlay {
    align-items: flex-end;
    justify-content: center;
    padding: 0;
  }

  .arvis-nl__dialog {
    flex-direction: column;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    /* bottom-sheet ca drawer-ul de filtre: lipit jos, doar sus rotunjit */
    border-radius: 22px 22px 0 0;
    /* intra de jos in sus (override pe scale-ul de desktop) */
    transform: translateY(100%);
  }

  .arvis-nl-overlay.is-open .arvis-nl__dialog { transform: translateY(0); }

  .arvis-nl__aside {
    flex: 0 0 auto;
    padding: 26px 24px;
    border-radius: 22px 22px 0 0;
  }

  .arvis-nl__aside-body { margin-top: 0; padding-top: 16px; }
  .arvis-nl__aside .arvis-nl__headline { font-size: 27px; }
  .arvis-nl__aside-sub,
  .arvis-nl__list { display: none; }

  .arvis-nl__panel { padding: 24px 24px 26px; }
  .arvis-nl__title { font-size: 25px; }
  .arvis-nl__sub--desktop { display: none; }
  .arvis-nl__sub--mobile { display: block; }
}

@media (prefers-reduced-motion: reduce) {
  .arvis-nl-overlay,
  .arvis-nl__dialog { transition: none; }
}
/* ==========================================================================
   DARK MODE — toggle segmented (light / sistem / dark)
   Injectat de custom.js in header (desktop) + footer drawer mobil.
   Token-urile sunt in 00-base.css (:root light + [data-theme="dark"]).
   ========================================================================== */
.arvis-theme-seg {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  /* DEFAULT (trust-bar + drawer mobil dark) = frosted translucid pe suprafata inchisa.
     Exceptie: mobil + light theme → pill deschis solid (override mai jos). */
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  vertical-align: middle;
  flex: 0 0 auto;
}

.arvis-theme-seg__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease;
}

.arvis-theme-seg__btn svg {
  width: 16px;
  height: 16px;
}

.arvis-theme-seg__btn:hover {
  color: var(--arvis-ember, #ff5c35);
}

/* Segment activ (default) — cerc alb + iconita midnight in light, ember-fill in dark */
.arvis-theme-seg__btn.is-on {
  background: var(--surface, #ffffff);
  color: var(--arvis-midnight, #111827);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}
[data-theme="dark"] .arvis-theme-seg__btn.is-on {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
}
[data-theme="dark"] .arvis-theme-seg__btn.is-on:hover {
  color: #ffffff;
}

/* EXCEPTIE: mobil (drawer) + LIGHT theme → pill deschis solid (frosted-ul alb
   ar fi invizibil pe drawer-ul alb). Scoped pe #iqitmegamenu-mobile + :not(dark). */
:root:not([data-theme="dark"]) #iqitmegamenu-mobile .arvis-theme-seg {
  background: #f0f2f5;
  border-color: rgba(0, 0, 0, 0.08);
}
:root:not([data-theme="dark"]) #iqitmegamenu-mobile .arvis-theme-seg .arvis-theme-seg__btn {
  color: #6b7280;
}
:root:not([data-theme="dark"]) #iqitmegamenu-mobile .arvis-theme-seg .arvis-theme-seg__btn.is-on {
  background: #ffffff;
  color: var(--arvis-ember, #ff5c35);
}

/* In footer-ul drawer-ului mobil — rand propriu, centrat */
#iqitmegamenu-mobile .arvis-theme-seg {
  margin: 4px 0;
}

/* ==========================================================================
   DARK — override structural pentru elemente din tema-parinte (theme.css) cu
   culori hardcodate (nu token-uri) care nu se comuta singure.
   ========================================================================== */
:root[data-theme="dark"] body,
:root[data-theme="dark"] #wrapper,
:root[data-theme="dark"] #content-wrapper,
:root[data-theme="dark"] .page-content,
:root[data-theme="dark"] #main {
  background-color: var(--page-bg) !important;
  color: var(--arvis-midnight);
}

/* Header rows + bara de meniu */
:root[data-theme="dark"] #header,
:root[data-theme="dark"] #desktop-header,
:root[data-theme="dark"] .header-top,
:root[data-theme="dark"] #iqitmegamenu-wrapper,
:root[data-theme="dark"] .iqit-megamenu-container,
:root[data-theme="dark"] .container-iqitmegamenu,
:root[data-theme="dark"] .sticky-desktop-wrapper,
:root[data-theme="dark"] #iqitmegamenu-horizontal {
  background-color: var(--surface) !important;
}

/* Header sticky (devenea alb la scroll) */
:root[data-theme="dark"] .sticky-desktop-wrapper.is-sticky,
:root[data-theme="dark"] .sticky-desktop-wrapper.iqit-sticky,
:root[data-theme="dark"] .sticky-desktop-wrapper.fixed,
:root[data-theme="dark"] body.iqit-sticky-active .sticky-desktop-wrapper,
:root[data-theme="dark"] #sticky-header,
:root[data-theme="dark"] .header-sticky {
  background-color: var(--surface) !important;
}

/* Footer — ramane inchis; border-top pt. separare (footer = page-bg in dark) */
:root[data-theme="dark"] #footer,
:root[data-theme="dark"] .js-footer,
:root[data-theme="dark"] .footer-container,
:root[data-theme="dark"] footer {
  background-color: var(--surface) !important; /* #111827 — putin mai deschis ca pagina #0b1018 */
  border-top: 1px solid var(--arvis-line) !important;
}

/* ==========================================================================
   DARK — override pentru elemente din theme.css (SCSS) / module cu alb hardcodat
   ========================================================================== */
/* Modale (login wishlist, share, zoom, etc.) — toate */
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .modal-header,
:root[data-theme="dark"] .modal-body,
:root[data-theme="dark"] .modal-footer {
  background-color: var(--surface) !important;
  color: var(--arvis-midnight);
  border-color: var(--arvis-line) !important;
}

/* Inputuri / form controls */
:root[data-theme="dark"] .form-control,
:root[data-theme="dark"] .form-select,
:root[data-theme="dark"] input[type="text"],
:root[data-theme="dark"] input[type="email"],
:root[data-theme="dark"] input[type="password"],
:root[data-theme="dark"] input[type="search"],
:root[data-theme="dark"] input[type="tel"],
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
  background-color: var(--surface-2) !important;
  color: var(--arvis-midnight) !important;
  border-color: var(--arvis-line) !important;
}

/* PDP — carduri principale (theme.css SCSS) */
:root[data-theme="dark"] .arvis-pdp__grid,
:root[data-theme="dark"] .arvis-pdp__tabs-card,
:root[data-theme="dark"] .arvis-pdp__summary,
:root[data-theme="dark"] .arvis-pdp__buybox,
:root[data-theme="dark"] .arvis-pdp__info,
:root[data-theme="dark"] .arvis-pdp-similar .arvis-pc,
:root[data-theme="dark"] .arvis-pdp__gallery-stage {
  background-color: var(--surface) !important;
}

/* Carduri produs (PLP, related, crosssell, "S-ar putea sa-ti placa") */
:root[data-theme="dark"] .arvis-pc,
:root[data-theme="dark"] .product-miniature,
:root[data-theme="dark"] .js-product-miniature,
:root[data-theme="dark"] .crossselling-product,
:root[data-theme="dark"] .featured-products .product {
  background-color: var(--surface) !important;
}

/* Header — randul secundar (wishlist / Cercul Arvis) */
:root[data-theme="dark"] .header-nav {
  background-color: var(--surface) !important;
}

/* Butoane header (cont / outline) — fundal transparent pe dark */
:root[data-theme="dark"] .header-btn,
:root[data-theme="dark"] #user_info .account {
  background-color: transparent !important;
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   DARK — cos lateral, checkout, breadcrumb, PDP trust (theme.css / Bootstrap)
   ========================================================================== */
/* Cos lateral / dropdown cos */
:root[data-theme="dark"] #blockcart-content,
:root[data-theme="dark"] .blockcart-content,
:root[data-theme="dark"] #_desktop_blockcart-content,
:root[data-theme="dark"] .cart-preview .dropdown-menu {
  background-color: var(--surface) !important;
  color: var(--arvis-midnight) !important;
}
/* Buton stergere din cos (trash) — invizibil pe dark; fortam slate deschis */
:root[data-theme="dark"] .remove-from-cart,
:root[data-theme="dark"] .remove-from-cart i,
:root[data-theme="dark"] .remove-from-cart .fa-trash-o {
  color: var(--arvis-slate) !important;
}
:root[data-theme="dark"] .remove-from-cart:hover,
:root[data-theme="dark"] .remove-from-cart:hover i,
:root[data-theme="dark"] .remove-from-cart:hover .fa-trash-o {
  color: var(--arvis-red, #dc2626) !important;
}

/* Pagina cos (/cos): stepper cantitate (+/-) + nr + trash linie — culoare temei
   parinte (link/buton) le facea inchise; fortam deschis pe dark. */
:root[data-theme="dark"] .arvis-cart__qty-btn,
:root[data-theme="dark"] .arvis-cart__qty-input {
  color: var(--arvis-midnight) !important;
}
:root[data-theme="dark"] .arvis-cart__line-trash {
  color: var(--arvis-slate) !important;
}
:root[data-theme="dark"] .arvis-cart__qty-btn:hover,
:root[data-theme="dark"] .arvis-cart__line-trash:hover {
  color: var(--arvis-ember) !important;
}

/* Checkout — carduri pasi + titluri/labels */
:root[data-theme="dark"] .checkout-step,
:root[data-theme="dark"] #checkout .card,
:root[data-theme="dark"] .js-checkout-step,
:root[data-theme="dark"] #content-hook_order_confirmation,
:root[data-theme="dark"] .order-confirmation-table,
:root[data-theme="dark"] #order-detail-content {
  background-color: var(--surface) !important;
  color: var(--arvis-midnight) !important;
}
:root[data-theme="dark"] .checkout-step .step-title,
:root[data-theme="dark"] .checkout-step h1,
:root[data-theme="dark"] .checkout-step h2,
:root[data-theme="dark"] .checkout-step h3,
:root[data-theme="dark"] #checkout label,
:root[data-theme="dark"] #checkout .h3,
:root[data-theme="dark"] #checkout .h6 {
  color: var(--arvis-midnight) !important;
}

/* Breadcrumb — bara alba → transparent, text deschis */
:root[data-theme="dark"] .breadcrumb,
:root[data-theme="dark"] nav.breadcrumb,
:root[data-theme="dark"] [class*="breadcrumb"] {
  background-color: transparent !important;
}
:root[data-theme="dark"] .breadcrumb a,
:root[data-theme="dark"] .breadcrumb li,
:root[data-theme="dark"] .breadcrumb span,
:root[data-theme="dark"] [class*="breadcrumb"] a,
:root[data-theme="dark"] [class*="breadcrumb"] li {
  color: var(--arvis-midnight) !important;
}

/* PDP — trust/livrare/specificatii: text deschis pe dark */
:root[data-theme="dark"] .arvis-pdp__trust,
:root[data-theme="dark"] .arvis-pdp__delivery,
:root[data-theme="dark"] .arvis-pdp__reassurance,
:root[data-theme="dark"] .arvis-pdp__meta,
:root[data-theme="dark"] [class*="arvis-pdp"] [class*="trust"],
:root[data-theme="dark"] [class*="arvis-pdp"] [class*="delivery"] {
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   PDP BUYBOX — texte secundare + chips (issue dark mode)
   ========================================================================== */
/* "Cu TVA inclus" — $arvis-slate compilat (gri inchis) → slate deschis */
:root[data-theme="dark"] .arvis-pdp__price-meta,
:root[data-theme="dark"] .arvis-pdp__price-meta > span {
  color: var(--arvis-slate) !important;
}

/* Chips ember (Pretul Sincer / Castigi Puncte) — text ember deschis + tint
   mai vizibil pe fundal inchis */
:root[data-theme="dark"] .arvis-pretulsincer-badge,
:root[data-theme="dark"] .arvis-pdp__scarcity,
:root[data-theme="dark"] .arvis-loy-pdp-earn {
  color: var(--arvis-ember-active) !important;
  background: rgba(255, 92, 53, 0.16) !important;
  border-color: rgba(255, 92, 53, 0.3) !important;
}

/* Reassurance PDP (Livrare/Retur/Plata/WhatsApp) — label-uri deschise.
   ATENTIE: blockreassurance pune `style="color:#111827"` INLINE pe `.col-11`
   → doar o regula `!important` cu selectorul corect `.blockreassurance_product`
   il bate (markup-ul NU e `#block-reassurance` aici). */
:root[data-theme="dark"] .blockreassurance_product .col-11,
:root[data-theme="dark"] .blockreassurance_product .block-title,
:root[data-theme="dark"] #block-reassurance .block-reassurance-item-title,
:root[data-theme="dark"] #block-reassurance span,
:root[data-theme="dark"] .block-reassurance span {
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   HEADER — butoane cont / wishlist / Cercul Arvis (text deschis pe dark)
   ========================================================================== */
/* Autentificare (#user_info a — markup-ul real NU are clasa .account) */
:root[data-theme="dark"] #user_info a,
:root[data-theme="dark"] #user_info a .fa,
:root[data-theme="dark"] #user_info a span {
  color: var(--arvis-midnight) !important;
}
/* Lista de dorinte (iqitwishlist) + Cercul Arvis chip — scris deschis */
:root[data-theme="dark"] a[href*="iqitwishlist"],
:root[data-theme="dark"] a[href*="iqitwishlist"] .fa,
:root[data-theme="dark"] .arvis-loy-chip,
:root[data-theme="dark"] .arvis-loy-chip__label {
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   HERO — CTA secundar "Intreaba pe WhatsApp" (hero e mereu inchis)
   In dark `var(--surface)` facea butonul sa se piarda in hero → ghost vizibil.
   ========================================================================== */
:root[data-theme="dark"] .arvis-hero__cta--secondary,
:root[data-theme="dark"] .arvis-hero__cta--secondary:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--arvis-midnight) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

/* ==========================================================================
   MOBIL — bara header alba → inchisa + iconite deschise
   ========================================================================== */
:root[data-theme="dark"] #mobile-header,
:root[data-theme="dark"] #mobile-header-sticky,
:root[data-theme="dark"] .mobile-main-bar,
:root[data-theme="dark"] .sticky-mobile-wrapper {
  background-color: var(--surface) !important;
}
:root[data-theme="dark"] #mobile-header .m-nav-btn,
:root[data-theme="dark"] #mobile-header .m-nav-btn .fa,
:root[data-theme="dark"] #mobile-header .m-nav-btn span {
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   MODAL Cercul Arvis — shell `#fff` hardcodat ramanea alb pe dark
   ========================================================================== */
:root[data-theme="dark"] .arvis-loy-modal {
  background: var(--surface) !important;
}

/* ==========================================================================
   CARD PRODUS — buton CTA "Vizualizeaza" / Adauga: text MEREU alb pe ember
   ========================================================================== */
:root[data-theme="dark"] .arvis-pc__cta .btn,
:root[data-theme="dark"] .product-miniature .arvis-pc__cta .btn,
:root[data-theme="dark"] .product-miniature-layout-1 .product-list-actions .btn,
:root[data-theme="dark"] .product-miniature-layout-1 .product-add-cart .btn {
  color: #ffffff !important;
}

/* ==========================================================================
   PDP "S-ar putea sa-ti placa" — carduri similare (bg #fff hardcodat SCSS)
   ========================================================================== */
:root[data-theme="dark"] .arvis-pdp-similar__card {
  background: var(--surface) !important;
  border-color: var(--arvis-line) !important;
}
:root[data-theme="dark"] .arvis-pdp-similar__card-name {
  color: var(--arvis-midnight) !important;
}
:root[data-theme="dark"] .arvis-pdp-similar__card-price-current {
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   SIDEBAR categorii (pagini categorie/cautare) — text deschis
   ========================================================================== */
:root[data-theme="dark"] .block-categories .block-title a,
:root[data-theme="dark"] .block-categories .category-sub-menu a,
:root[data-theme="dark"] .block-categories .category-sub-link,
:root[data-theme="dark"] .block-categories a {
  color: var(--arvis-midnight) !important;
}
:root[data-theme="dark"] .block-categories .collapse-icons .fa {
  color: var(--arvis-slate) !important;
}

/* ==========================================================================
   MEGAMENU ORIZONTAL — tab deschis avea fundal alb → inchis
   ========================================================================== */
:root[data-theme="dark"] #iqitmegamenu-horizontal .cbp-hrsub,
:root[data-theme="dark"] #iqitmegamenu-horizontal .cbp-hrsub-inner,
:root[data-theme="dark"] .cbp-hrmenu-tab.cbp-hropen > .nav-link,
:root[data-theme="dark"] .cbp-hrmenu-tab.cbp-hropen > a {
  background-color: var(--surface) !important;
}

/* ==========================================================================
   WhatsApp FAB tooltip — bg `--arvis-midnight` se inversa (deschis) → fix inchis
   ========================================================================== */
:root[data-theme="dark"] .arvis-wa-fab__label,
:root[data-theme="dark"] .arvis-wa-fab__label::after {
  background: var(--dark-surface) !important;
}

/* ==========================================================================
   MEGAMENU promo (Ghidul ...) — sa se distinga de panoul meniului (elevat)
   ========================================================================== */
:root[data-theme="dark"] .arvis-mm-promo {
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(255, 92, 53, 0.22), transparent 60%),
    var(--surface-2) !important;
  border: 1px solid var(--arvis-line) !important;
}

/* ==========================================================================
   MODAL Cercul Arvis — link "Cum functioneaza" deschis (nu doar pe hover)
   ========================================================================== */
:root[data-theme="dark"] .arvis-loy-modal__link {
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   PAGINA /cerc (modul arvisloyalty) — carduri #fff → suprafete inchise
   ========================================================================== */
:root[data-theme="dark"] .arvis-cerc__card,
:root[data-theme="dark"] .arvis-cerc__redeem,
:root[data-theme="dark"] .arvis-cerc__tier,
:root[data-theme="dark"] .arvis-cerc__faq,
:root[data-theme="dark"] .arvis-cerc__hist,
:root[data-theme="dark"] .arvis-cerc__related-card,
:root[data-theme="dark"] .arvis-cerc__btn--ghost {
  background: var(--surface) !important;
  border-color: var(--arvis-line) !important;
}
/* Sub-headere (erau snow) — un pas mai sus pt. ierarhie */
:root[data-theme="dark"] .arvis-cerc__redeem-head,
:root[data-theme="dark"] .arvis-cerc__tier-head,
:root[data-theme="dark"] .arvis-cerc__hist th {
  background: var(--surface-2) !important;
}
/* Tier "featured" (ARGINT) — head pe var(--arvis-midnight) se inversa (deschis) */
:root[data-theme="dark"] .arvis-cerc__tier--featured .arvis-cerc__tier-head {
  background: var(--dark-surface) !important;
}
/* Texte deschise unde foloseau token-uri inchise */
:root[data-theme="dark"] .arvis-cerc__btn--ghost {
  color: var(--arvis-midnight) !important;
}

/* ==========================================================================
   Pagina DESPRE — placeholder foto (CMS) prea deschis pe dark
   ========================================================================== */
:root[data-theme="dark"] .arvis-about__photo-placeholder,
:root[data-theme="dark"] .arvis-about__visual {
  background: var(--surface-2) !important;
}

/* ==========================================================================
   PAGINI CMS (.arvis-cms) — heading-uri de sectiune + boxuri inline #F8F9FA
   ========================================================================== */
:root[data-theme="dark"] .arvis-cms h2,
:root[data-theme="dark"] .arvis-cms h3,
:root[data-theme="dark"] .arvis-cms h4,
:root[data-theme="dark"] .arvis-cms h5,
:root[data-theme="dark"] .arvis-cms h6 {
  color: var(--arvis-midnight) !important;
}
/* Boxuri CMS cu fundal alb hardcodat inline (ex: ANPC/SAL/SOL pe livrare-plata) */
:root[data-theme="dark"] .arvis-cms [style*="#F8F9FA"],
:root[data-theme="dark"] .arvis-cms [style*="#f8f9fa"] {
  background: var(--surface) !important;
}
:root[data-theme="dark"] .arvis-cms [style*="#F8F9FA"] p,
:root[data-theme="dark"] .arvis-cms [style*="#F8F9FA"] strong,
:root[data-theme="dark"] .arvis-cms [style*="#f8f9fa"] p,
:root[data-theme="dark"] .arvis-cms [style*="#f8f9fa"] strong {
  color: var(--arvis-midnight) !important;
}
/* ==========================================================================
   30 — BLOG + EXTRAS (portat 2026-06-17 ca build-ul sa NU mai stearga)
   Acest bloc (blog ph_simpleblog + paginare + .js-carrier-extra-content/Sameday
   + helperi .page-*/.col-sm-*/.lead/.photo) era DIRECT in custom.css, neportat in
   partials → build-custom-css.sh il stergea (incident 2026-06-17, ca 2026-06-02).
   Acum e aici => build complet. Vezi feedback-arvis-css-two-sources.
   --------------------------------------------------------------------------
   BLOG (ph_simpleblog / PrestaHome) — Faza 1: CSS pe markup existent
   Tokenizat → dark mode merge prin :root[data-theme="dark"]. Vezi
   project-arvis-blog-ghiduri. Faza 2 (TOC/filtre/hero/stats) = template+JS.
   ========================================================================== */

/* ---- 1. Layout & latime de citire (fix #1: full-width → coloana lizibila) ---- */
.simpleblog__post {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 1px 2px rgba(var(--arvis-shadow-rgb), 0.04),
    0 10px 30px rgba(var(--arvis-shadow-rgb), 0.06);
  padding: clamp(1.25rem, 4vw, 3rem) clamp(1.25rem, 5vw, 3.5rem);
}
.simpleblog__listing {
  width: 100%;
}

/* ---- 2. Antet articol: titlu + deck + meta ---- */
.simpleblog__post h1,
.simpleblog__post .post-title:first-child {
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: var(--arvis-midnight);
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  margin-bottom: 0.75rem;
}
.simpleblog__post__content .lead,
.simpleblog__post > .lead {
  font-size: clamp(1.1rem, 2.2vw, 1.3rem);
  line-height: 1.5;
  font-weight: 400;
  color: var(--on-surface-faded);
  margin-bottom: 1.5rem;
}
.simpleblog__postInfo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 1.1rem;
  font-size: 0.875rem;
  color: var(--on-surface-faded);
  padding-bottom: 1.25rem;
  margin-bottom: 1.75rem;
  border-bottom: 1px solid var(--line);
}
.simpleblog__postInfo a {
  color: inherit;
}
.simpleblog__postInfo i,
.simpleblog__postInfo .material-icons {
  color: var(--arvis-ember);
}

/* ---- 3. Tipografie corp ---- */
.simpleblog__post__content {
  font-size: 1.075rem;
  line-height: 1.75;
  color: var(--arvis-slate-dark, #3f4754);
}
:root[data-theme="dark"] .simpleblog__post__content {
  color: var(--arvis-slate-dark);
}
.simpleblog__post__content > p {
  margin-bottom: 1.15rem;
}
.simpleblog__post__content h2 {
  font-weight: 800;
  letter-spacing: -0.015em;
  line-height: 1.2;
  color: var(--arvis-midnight);
  font-size: clamp(1.45rem, 2.6vw, 1.85rem);
  margin: 2.5rem 0 0.85rem;
}
.simpleblog__post__content h3 {
  font-weight: 700;
  color: var(--arvis-midnight);
  font-size: clamp(1.15rem, 2vw, 1.32rem);
  margin: 1.75rem 0 0.6rem;
}
.simpleblog__post__content strong {
  color: var(--arvis-midnight);
  font-weight: 700;
}
.simpleblog__post__content a {
  color: var(--arvis-ember) !important;
  text-decoration: none;
  border-bottom: 1px solid rgba(var(--arvis-ember-rgb), 0.35);
  transition: border-color 0.15s ease;
}
.simpleblog__post__content a:hover {
  border-bottom-color: var(--arvis-ember);
}
.simpleblog__post__content ul {
  padding-left: 1.25rem;
  margin-bottom: 1.15rem;
}
.simpleblog__post__content ul li {
  margin-bottom: 0.4rem;
}
.simpleblog__post__content ul li::marker {
  color: var(--arvis-ember);
}

/* ---- 4. Pasi numerotati (orice <ol> din corp = pasi cu cerc ember) ---- */
.simpleblog__post__content ol {
  list-style: none;
  counter-reset: arvstep;
  padding-left: 0;
  margin: 1.25rem 0 1.5rem;
}
.simpleblog__post__content ol > li {
  counter-increment: arvstep;
  position: relative;
  padding-left: 3rem;
  margin-bottom: 0.9rem;
  min-height: 2rem;
}
.simpleblog__post__content ol > li::before {
  content: counter(arvstep);
  position: absolute;
  left: 0;
  top: -0.1rem;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--arvis-ember);
  color: #fff;
  font-weight: 700;
  font-size: 0.95rem;
  border-radius: 50%;
}

/* ---- 5. Tabel comparativ ---- */
.simpleblog__post__content table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 1.5rem 0;
  font-size: 0.95rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.simpleblog__post__content thead th {
  background: var(--arvis-midnight);
  color: #fff;
  text-align: left;
  font-weight: 600;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.7rem 0.9rem;
}
:root[data-theme="dark"] .simpleblog__post__content thead th {
  background: var(--surface-3);
}
.simpleblog__post__content tbody td {
  padding: 0.7rem 0.9rem;
  border-top: 1px solid var(--line);
  vertical-align: top;
}
.simpleblog__post__content tbody tr:nth-child(even) {
  background: var(--surface-container);
}
.simpleblog__post__content tbody td:first-child {
  color: var(--arvis-midnight);
  font-weight: 600;
}
@media (max-width: 600px) {
  .simpleblog__post__content table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}

/* ---- 6. Callout-uri (adaugate in continut: .arvis-blog-tldr / .arvis-blog-tip) ---- */
.arvis-blog-tldr,
.arvis-blog-tip {
  background: var(--arvis-ember-soft);
  border-left: 3px solid var(--arvis-ember);
  border-radius: 10px;
  padding: 1.1rem 1.35rem;
  margin: 1.75rem 0;
}
.arvis-blog-tldr__label,
.arvis-blog-tip__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember);
  margin-bottom: 0.55rem;
}
.arvis-blog-tldr ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.arvis-blog-tldr ul li {
  position: relative;
  padding-left: 1.6rem;
  margin-bottom: 0.45rem;
}
.arvis-blog-tldr ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--arvis-ember);
  font-weight: 800;
}
.arvis-blog-tip p:last-child {
  margin-bottom: 0;
}

/* ---- 7. Carduri listare (/blog, autor) ---- */
.simpleblog__listing__post__wrapper {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(var(--arvis-shadow-rgb), 0.04),
    0 8px 24px rgba(var(--arvis-shadow-rgb), 0.05);
  padding: clamp(1.1rem, 2.5vw, 1.6rem);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.simpleblog__listing__post__wrapper:hover {
  transform: translateY(-3px);
  box-shadow: 0 2px 4px rgba(var(--arvis-shadow-rgb), 0.06),
    0 16px 40px rgba(var(--arvis-shadow-rgb), 0.1);
}
/* Imaginea de copertina a cardului: colturi rotunjite ca sa se incadreze in card */
.simpleblog__listing__post__wrapper > a:first-child,
.simpleblog__listing__post__wrapper > a:first-child img,
.simpleblog__listing__post__wrapper img.photo {
  display: block;
  width: 100%;
  border-radius: 12px;
  overflow: hidden;
}
.simpleblog__listing__post__wrapper__content__headline,
.simpleblog__listing__post__wrapper__content__headline a {
  font-weight: 700;
  color: var(--arvis-midnight) !important;
  font-size: 1.15rem;
  line-height: 1.3;
  text-decoration: none;
}
.simpleblog__listing__post__wrapper__content__readmore,
.simpleblog__listing__post__wrapper__content__readmore a {
  color: var(--arvis-ember) !important;
  font-weight: 600;
  text-decoration: none;
}
.simpleblog__listing__post__wrapper__footer {
  font-size: 0.85rem;
  color: var(--on-surface-faded);
  border-top: 1px solid var(--line);
}
.simpleblog__listing__post__wrapper__footer i,
.simpleblog__listing__post__wrapper__footer .material-icons {
  color: var(--arvis-ember);
}

/* ---- 8. Card autor (single + pagina autor) ---- */
.cardblog.author-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(1.25rem, 3vw, 1.85rem);
  margin: 2rem auto;
}
.cardblog.author-card .h3,
.cardblog.author-card h3 {
  color: var(--arvis-midnight);
  font-weight: 800;
}
.authorMiniature__links.blogsocial {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.85rem;
}
.authorMiniature__links.blogsocial a:not(.btn-blog-social) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--arvis-midnight) !important;
  transition: background 0.15s ease, color 0.15s ease;
}
.authorMiniature__links.blogsocial a:not(.btn-blog-social):hover {
  background: var(--arvis-ember);
  color: #fff !important;
}

/* ---- 9. Comentarii — stilizate complet in sectiunea 20 (override form+layout) ---- */

/* ---- 10. Pagination / load more ---- */
.simpleblog__listing__pagination {
  display: flex;
  justify-content: center;
  gap: 0.4rem;
  margin-top: 2rem;
}
.simpleblog__listing__pagination a,
.simpleblog__listing__pagination span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0.4rem 0.95rem;
  color: var(--arvis-midnight);
  text-decoration: none;
}
.simpleblog__listing__pagination .active,
.simpleblog__listing__pagination a:hover {
  background: var(--arvis-ember);
  color: #fff;
  border-color: var(--arvis-ember);
}

/* ---- 11. Fix-uri iteratia 1 (dark mode + social /authors) ---- */
/* Blogul umple latimea sectiunii temei (section#main ~1357px) ca restul site-ului.
   Coloana de citire e guvernata de grid-ul TOC (.arvis-article-grid). NU mai plafonam
   #content la 960 (lasa pagina ingusta/centrata = "partial"). */
/* Titlul paginii de blog: vizibil in dark (era hardcodat inchis) */
body[id^="module-ph_simpleblog"] .page-title,
body[id^="module-ph_simpleblog"] .page-title span,
body[id^="module-ph_simpleblog"] .page-title a {
  color: var(--arvis-midnight) !important;
}
/* Linkurile din randul de meta (autor/categorie/like/comentarii): vizibile light + dark */
.simpleblog__postInfo a {
  color: var(--on-surface-faded) !important;
}
/* Social pe /authors = butoane-text brand (.btn-blog-social): pastram pill auto-width */
.authorMiniature__links.blogsocial a.btn-blog-social {
  width: auto;
  height: auto;
  min-width: 0;
  display: inline-flex;
  align-items: center;
}

/* ---- 12. Cuprins (TOC) — layout 2-coloane (JS injecteaza .arvis-article-grid) ---- */
.arvis-article-grid {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 2.5rem;
  align-items: start;
}
.arvis-article-grid .simpleblog__post {
  max-width: none;
}
.arvis-toc {
  position: sticky;
  top: 90px;
  align-self: start;
  font-size: 0.875rem;
}
.arvis-toc__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember);
  margin-bottom: 0.75rem;
}
.arvis-toc ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border-left: 2px solid var(--line);
}
.arvis-toc li a {
  display: block;
  padding: 0.32rem 0 0.32rem 0.9rem;
  margin-left: -2px;
  border-left: 2px solid transparent;
  color: var(--on-surface-faded) !important;
  text-decoration: none;
  line-height: 1.35;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.arvis-toc li a:hover {
  color: var(--arvis-midnight) !important;
}
.arvis-toc li a.is-active {
  color: var(--arvis-ember) !important;
  border-left-color: var(--arvis-ember);
  font-weight: 600;
}
.arvis-toc__comments {
  display: inline-block;
  margin-top: 1rem;
  color: var(--arvis-ember) !important;
  text-decoration: none;
  font-weight: 600;
}
.simpleblog__post__content h2 {
  scroll-margin-top: 90px;
}
@media (max-width: 991px) {
  .arvis-article-grid {
    display: block;
  }
  .arvis-toc {
    display: none;
  }
}

/* ---- 13. Filtre categorii (pills) — din .blogSubcat__list (subcategorii) ---- */
.blogSubcat__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
}
.blogSubcat__item {
  margin: 0;
}
.blogSubcat__link.cardblog.btn,
.blogSubcat__link.btn {
  display: inline-flex;
  align-items: center;
  padding: 0.45rem 1.05rem;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--arvis-midnight);
  font-weight: 600;
  font-size: 0.9rem;
  box-shadow: none;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.blogSubcat__link.cardblog.btn:hover,
.blogSubcat__link.btn:hover {
  background: var(--arvis-ember);
  border-color: var(--arvis-ember);
  color: #fff;
}

/* ---- 14. Share bar Arvis (.arvis-share) — WhatsApp + Facebook + Copiaza link ----
   Inlocuieste vechiul .btn-blog-social (Twitter/FB/Pinterest text-only). Link-uri
   share construite server-side in single.tpl; copierea = initBlogShareCopy (custom.js).
   Pilule neutre, iconita colorata in culoarea retelei; hover = umplere brand. */
.simpleblog__share,
.arvis-share {
  margin: 2.5rem 0;
}
.arvis-share__title {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--on-surface-faded);
  margin: 0 0 0.85rem;
}
.arvis-share__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.arvis-share__list li {
  margin: 0;
}
.arvis-share__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 1.15rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: 0.9rem;
  font-family: inherit;
  line-height: 1;
  background: var(--surface-container);
  border: 1px solid var(--line);
  color: var(--arvis-midnight) !important;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.arvis-share__btn svg {
  flex: 0 0 auto;
  transition: color 0.15s ease;
}
.arvis-share__btn[data-net="whatsapp"] svg { color: #25d366; }
.arvis-share__btn[data-net="facebook"] svg { color: #1877f2; }
.arvis-share__btn[data-net="copy"] svg { color: var(--arvis-ember); }
.arvis-share__btn:hover,
.arvis-share__btn:focus-visible {
  transform: translateY(-1px);
  color: #fff !important;
}
.arvis-share__btn:hover svg,
.arvis-share__btn:focus-visible svg { color: #fff; }
.arvis-share__btn[data-net="whatsapp"]:hover,
.arvis-share__btn[data-net="whatsapp"]:focus-visible {
  background: #25d366; border-color: #25d366;
}
.arvis-share__btn[data-net="facebook"]:hover,
.arvis-share__btn[data-net="facebook"]:focus-visible {
  background: #1877f2; border-color: #1877f2;
}
.arvis-share__btn[data-net="copy"]:hover,
.arvis-share__btn[data-net="copy"]:focus-visible {
  background: var(--arvis-ember); border-color: var(--arvis-ember);
}
/* Feedback "Link copiat!" — pastreaza starea ember scurt timp */
.arvis-share__btn--copy.is-copied {
  background: var(--arvis-ember); border-color: var(--arvis-ember); color: #fff !important;
}
.arvis-share__btn--copy.is-copied svg { color: #fff; }
:root[data-theme="dark"] .arvis-share__btn {
  color: var(--on-surface) !important;
}
:root[data-theme="dark"] .arvis-share__btn:hover,
:root[data-theme="dark"] .arvis-share__btn:focus-visible {
  color: #fff !important;
}

/* ---- 15. Box "Despre autor" (override post-author.tpl) ---- */
.arvis-author-box {
  margin: 2.5rem 0;
}
.arvis-author-box__eyebrow {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember);
  margin-bottom: 1rem;
}
.arvis-author-box__row {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
}
.arvis-author-box__avatar {
  flex: 0 0 auto;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--arvis-midnight);
  display: flex;
  align-items: center;
  justify-content: center;
}
:root[data-theme="dark"] .arvis-author-box__avatar {
  background: var(--surface-3);
}
.arvis-author-box__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.arvis-author-box__initials {
  color: #fff;
  font-weight: 700;
  font-size: 1.5rem;
  letter-spacing: 0.02em;
}
:root[data-theme="dark"] .arvis-author-box__initials {
  color: var(--arvis-midnight);
}
.arvis-author-box__body {
  flex: 1 1 auto;
  min-width: 0;
}
.arvis-author-box__name {
  margin: 0 0 0.15rem;
  font-weight: 800;
  font-size: 1.35rem;
  color: var(--arvis-midnight);
}
.arvis-author-box__role {
  display: block;
  font-size: 0.85rem;
  color: var(--on-surface-faded);
  margin-bottom: 0.75rem;
}
.arvis-author-box__bio {
  color: var(--arvis-slate-dark);
  line-height: 1.65;
  margin-bottom: 1.1rem;
}
.arvis-author-box__bio p:last-child {
  margin-bottom: 0;
}
.arvis-author-box__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
}
.arvis-author-box__btn {
  display: inline-flex;
  align-items: center;
  background: var(--arvis-ember);
  color: #fff !important;
  border: none;
  border-radius: 999px;
  padding: 0.55rem 1.25rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease;
}
.arvis-author-box__btn:hover {
  background: var(--arvis-ember-hover);
  color: #fff !important;
}
.arvis-author-box__social {
  display: flex;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.arvis-author-box__social li {
  margin: 0;
}
.arvis-author-box__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--arvis-midnight) !important;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.arvis-author-box__social a:hover {
  background: var(--arvis-ember);
  border-color: var(--arvis-ember);
  color: #fff !important;
}
@media (max-width: 575px) {
  .arvis-author-box__row {
    flex-direction: column;
  }
}

/* ---- 16. Hero pagina autor (override author-posts-list.tpl) ---- */
.arvis-author-hero {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: clamp(1.5rem, 4vw, 2.75rem);
  margin-bottom: 2.5rem;
}
.arvis-author-hero__main {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  flex: 1 1 480px;
  min-width: 0;
}
.arvis-author-hero__avatar {
  flex: 0 0 auto;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--arvis-midnight);
  display: flex;
  align-items: center;
  justify-content: center;
}
:root[data-theme="dark"] .arvis-author-hero__avatar {
  background: var(--surface-3);
}
.arvis-author-hero__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.arvis-author-hero__initials {
  color: #fff;
  font-weight: 700;
  font-size: 2rem;
}
:root[data-theme="dark"] .arvis-author-hero__initials {
  color: var(--arvis-midnight);
}
.arvis-author-hero__body {
  min-width: 0;
}
.arvis-author-hero__eyebrow {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember);
  margin-bottom: 0.35rem;
}
.arvis-author-hero__name {
  margin: 0 0 0.6rem;
  font-weight: 800;
  font-size: clamp(1.6rem, 3vw, 2.1rem);
  color: var(--arvis-midnight);
}
.arvis-author-hero__bio {
  color: var(--arvis-slate-dark);
  line-height: 1.65;
  margin-bottom: 1.1rem;
  max-width: 60ch;
}
.arvis-author-hero__bio p:last-child {
  margin-bottom: 0;
}
.arvis-author-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
}
.arvis-author-hero__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: var(--arvis-ember);
  color: #fff !important;
  border: none;
  border-radius: 999px;
  padding: 0.6rem 1.4rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease;
}
.arvis-author-hero__btn:hover {
  background: var(--arvis-ember-hover);
  color: #fff !important;
}
.arvis-author-hero__stats {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  justify-content: center;
  text-align: right;
  flex: 0 0 auto;
  padding-left: 2rem;
  border-left: 1px solid var(--line);
}
.arvis-author-hero__stat-num {
  display: block;
  font-size: 2rem;
  font-weight: 800;
  color: var(--arvis-midnight);
  line-height: 1;
}
.arvis-author-hero__stat-label {
  display: block;
  font-size: 0.82rem;
  color: var(--on-surface-faded);
  margin-top: 0.2rem;
}
@media (max-width: 767px) {
  .arvis-author-hero__main {
    flex-direction: column;
  }
  .arvis-author-hero__stats {
    flex-direction: row;
    gap: 2rem;
    text-align: left;
    padding-left: 0;
    border-left: none;
    border-top: 1px solid var(--line);
    padding-top: 1.25rem;
    width: 100%;
  }
}

/* ---- 17. Lista blog: header + hero "Recomandat" + badges + newsletter ---- */
.arvis-blog-head__eyebrow {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember);
  margin-bottom: 0.4rem;
}
.arvis-blog-head__sub {
  color: var(--on-surface-faded);
  max-width: 62ch;
  margin: 0.5rem 0 0;
  font-size: 1.05rem;
}

.arvis-blog-hero {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  margin-bottom: 2.5rem;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(var(--arvis-shadow-rgb), 0.04),
    0 10px 30px rgba(var(--arvis-shadow-rgb), 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.arvis-blog-hero:hover {
  transform: translateY(-3px);
  box-shadow: 0 2px 4px rgba(var(--arvis-shadow-rgb), 0.06),
    0 18px 44px rgba(var(--arvis-shadow-rgb), 0.1);
}
.arvis-blog-hero--no-media {
  grid-template-columns: 1fr;
}
.arvis-blog-hero__media {
  background: var(--surface-container);
}
.arvis-blog-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}
.arvis-blog-hero__body {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
.arvis-blog-hero__badges {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.arvis-blog-hero__title {
  font-weight: 800;
  font-size: clamp(1.4rem, 2.6vw, 2rem);
  line-height: 1.15;
  color: var(--arvis-midnight);
  margin: 0 0 0.75rem;
}
.arvis-blog-hero__excerpt {
  color: var(--on-surface-faded);
  line-height: 1.6;
  margin: 0 0 1.1rem;
}
.arvis-blog-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 1rem;
  font-size: 0.85rem;
  color: var(--on-surface-faded);
  margin-bottom: 1.25rem;
}
.arvis-blog-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: var(--arvis-ember);
  color: #fff;
  border-radius: 999px;
  padding: 0.6rem 1.35rem;
  font-weight: 600;
  transition: background 0.15s ease;
}
.arvis-blog-hero:hover .arvis-blog-hero__cta {
  background: var(--arvis-ember-hover);
}
@media (max-width: 767px) {
  .arvis-blog-hero {
    grid-template-columns: 1fr;
  }
}

.arvis-blog-badge {
  display: inline-flex;
  align-items: center;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.3rem 0.7rem;
  border-radius: 999px;
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember);
}
.arvis-blog-badge--featured {
  background: var(--arvis-ember);
  color: #fff;
}

.arvis-blog-section-title {
  font-weight: 800;
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  color: var(--arvis-midnight);
  margin: 0 0 1.25rem;
}

.arvis-blog-newsletter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem 2.5rem;
  background: var(--dark-surface);
  border-radius: 18px;
  padding: clamp(1.5rem, 4vw, 2.75rem);
  margin: 3rem 0 1rem;
}
.arvis-blog-newsletter__text {
  flex: 1 1 320px;
  min-width: 0;
}
.arvis-blog-newsletter__eyebrow {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember);
  margin-bottom: 0.5rem;
}
.arvis-blog-newsletter__title {
  color: #fff;
  font-weight: 800;
  font-size: clamp(1.3rem, 2.6vw, 1.85rem);
  margin: 0 0 0.5rem;
  line-height: 1.15;
}
.arvis-blog-newsletter__sub {
  color: rgba(255, 255, 255, 0.7);
  margin: 0;
  max-width: 46ch;
}
.arvis-blog-newsletter__form {
  display: flex;
  gap: 0.5rem;
  flex: 1 1 320px;
  max-width: 460px;
}
.arvis-blog-newsletter__input {
  flex: 1 1 auto;
  min-width: 0;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 999px;
  padding: 0.7rem 1.1rem;
  color: #fff;
  font-size: 0.95rem;
}
.arvis-blog-newsletter__input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.arvis-blog-newsletter__input:focus {
  outline: none;
  border-color: var(--arvis-ember);
}
.arvis-blog-newsletter__btn {
  flex: 0 0 auto;
  background: var(--arvis-ember);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 0.7rem 1.5rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease;
}
.arvis-blog-newsletter__btn:hover {
  background: var(--arvis-ember-hover);
}
@media (max-width: 575px) {
  .arvis-blog-newsletter__form {
    flex-direction: column;
  }
  .arvis-blog-newsletter__btn {
    width: 100%;
  }
}

/* ---- 18. Fix lista iteratia 2: fundal transparent + header pe banda alba ---- */
/* Scoate cardul alb global (.page-content = #fff din tema) → cardurile stau pe page-bg gri */
body[id^="module-ph_simpleblog"] #content.page-content {
  background: transparent;
  padding: 0;
  border-radius: 0;
}
/* Header pe banda alba (design: header alb, continut gri cu carduri) */
body[id^="module-ph_simpleblog"] .page-heading.arvis-blog-head {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(1.4rem, 3vw, 2.25rem);
  margin-bottom: 1.5rem;
}
.arvis-blog-head .h1 {
  margin-bottom: 0.25rem;
  color: var(--arvis-midnight);
}
/* Pill-uri in banda de header (mutate din #content) */
.arvis-blog-head .blogSubcat {
  margin: 1.35rem 0 0;
}
.arvis-blog-head .blogSubcat__list {
  margin: 0;
}
.blogSubcat__link--active.cardblog.btn,
.blogSubcat__link--active.btn {
  background: var(--arvis-ember);
  border-color: var(--arvis-ember);
  color: #fff;
}

/* ---- 19. FAQ accordion (<details> generat de JS din "Întrebări frecvente") ---- */
.simpleblog__post__content .arvis-faq {
  border: 1px solid var(--line);
  border-radius: 12px;
  margin-bottom: 0.6rem;
  background: var(--surface);
}
.simpleblog__post__content .arvis-faq > summary {
  list-style: none;
  cursor: pointer;
  padding: 0.95rem 1.2rem;
  font-weight: 700;
  color: var(--arvis-midnight);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  transition: color 0.15s ease;
}
.simpleblog__post__content .arvis-faq > summary::-webkit-details-marker {
  display: none;
}
.simpleblog__post__content .arvis-faq > summary:hover {
  color: var(--arvis-ember);
}
.simpleblog__post__content .arvis-faq > summary::after {
  content: "";
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-right: 2px solid var(--arvis-ember);
  border-bottom: 2px solid var(--arvis-ember);
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.simpleblog__post__content .arvis-faq[open] > summary::after {
  transform: rotate(-135deg);
}
.simpleblog__post__content .arvis-faq[open] > summary {
  border-bottom: 1px solid var(--line);
}
.simpleblog__post__content .arvis-faq > p {
  margin: 0;
  padding: 0.9rem 1.2rem;
  color: var(--arvis-slate-dark);
  line-height: 1.65;
}

/* ---- 20. Comentarii: formular + lista (override form.tpl & layout.tpl) ---- */
/* Formular */
.arvis-comment-form {
  margin-top: 2rem;
}
.arvis-comment-form__card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(1.25rem, 3vw, 2rem);
}
.arvis-comment-form__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}
.arvis-comment-form__icon {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--arvis-midnight);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
:root[data-theme="dark"] .arvis-comment-form__icon {
  background: var(--surface-3);
  color: var(--arvis-midnight);
}
.arvis-comment-form__title {
  margin: 0;
  font-weight: 800;
  font-size: 1.2rem;
  color: var(--arvis-midnight);
}
.arvis-comment-form__replyinfo {
  display: none;
  background: var(--arvis-ember-soft);
  color: var(--arvis-ember);
  border-radius: 8px;
  padding: 0.5rem 0.85rem;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 1rem;
}
.arvis-comment-form__fields {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
.arvis-comment-form__input,
.arvis-comment-form__textarea {
  width: 100%;
  background: var(--surface-container);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0.85rem 1.1rem;
  color: var(--on-surface);
  font-size: 0.97rem;
  font-family: inherit;
}
.arvis-comment-form__input::placeholder,
.arvis-comment-form__textarea::placeholder {
  color: var(--on-surface-faded);
}
.arvis-comment-form__input:focus,
.arvis-comment-form__textarea:focus {
  outline: none;
  border-color: var(--arvis-ember);
  background: var(--surface);
}
.arvis-comment-form__textarea {
  resize: vertical;
  min-height: 120px;
}
.arvis-comment-form__recaptcha {
  margin-top: 1rem;
}
.arvis-comment-form__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1.25rem;
}
.arvis-comment-form__note {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.83rem;
  color: var(--on-surface-faded);
}
.arvis-comment-form__actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.arvis-comment-form__cancel {
  display: none;
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0.6rem 1.1rem;
  color: var(--on-surface-faded);
  font-weight: 600;
  cursor: pointer;
}
.arvis-comment-form__submit {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: var(--arvis-ember);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 0.7rem 1.5rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease;
}
.arvis-comment-form__submit:hover {
  background: var(--arvis-ember-hover);
}

/* Lista comentarii */
.arvis-comments {
  margin-top: 2.5rem;
}
.arvis-comments__title {
  font-weight: 800;
  font-size: 1.5rem;
  color: var(--arvis-midnight);
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0 0 1.5rem;
}
.arvis-comments__count {
  font-size: 0.85rem;
  font-weight: 700;
  background: var(--surface-container);
  color: var(--on-surface-faded);
  border-radius: 999px;
  padding: 0.15rem 0.6rem;
}
.arvis-comments__empty {
  color: var(--on-surface-faded);
  margin: 0 0 1.75rem;
}
.arvis-comments__list {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.arvis-comment {
  display: flex;
  gap: 0.9rem;
  align-items: flex-start;
}
.arvis-comment__avatar {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--arvis-midnight);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  text-transform: uppercase;
}
:root[data-theme="dark"] .arvis-comment__avatar {
  background: var(--surface-3);
  color: var(--arvis-midnight);
}
.arvis-comment__body {
  flex: 1 1 auto;
  min-width: 0;
}
.arvis-comment__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5rem;
  margin-bottom: 0.25rem;
}
.arvis-comment__author {
  font-weight: 700;
  color: var(--arvis-midnight);
}
.arvis-comment__date {
  font-size: 0.8rem;
  color: var(--on-surface-faded);
}
.arvis-comment__text {
  color: var(--arvis-slate-dark);
  line-height: 1.6;
}
.arvis-comment__reply {
  background: none;
  border: none;
  padding: 0;
  margin-top: 0.4rem;
  color: var(--on-surface-faded);
  font-weight: 600;
  font-size: 0.85rem;
  cursor: pointer;
}
.arvis-comment__reply:hover {
  color: var(--arvis-ember);
}
.arvis-comment__replies {
  list-style: none;
  padding: 0 0 0 1.25rem;
  margin: 1.25rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  border-left: 2px solid var(--line);
}
.arvis-comment.simpleblog_comments_highlighted > .arvis-comment__body {
  background: var(--arvis-ember-soft);
  border-radius: 12px;
  padding: 0.85rem 1.1rem;
}

/* ---- 21. Antet articol single (override single.tpl): banda alba + badge + titlu + deck + rand autor ---- */
.arvis-post-head {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  margin-bottom: 1.5rem;
}
.arvis-post-head__deck {
  font-size: clamp(1.1rem, 2.2vw, 1.3rem);
  line-height: 1.5;
  color: var(--on-surface-faded);
  margin: 1rem 0 0;
  max-width: 70ch;
}
.arvis-post-head__cat {
  display: inline-flex;
  align-items: center;
  background: var(--arvis-ember);
  color: #fff !important;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.32rem 0.8rem;
  border-radius: 999px;
  text-decoration: none;
  margin-bottom: 1rem;
}
.arvis-post-head__cat:hover {
  background: var(--arvis-ember-hover);
  color: #fff !important;
}
.arvis-post-head__title {
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--arvis-midnight);
  font-size: clamp(1.9rem, 4vw, 2.9rem);
  margin: 0;
}
.arvis-post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  padding-top: 1.25rem;
  margin-top: 1.5rem;
  border-top: 1px solid var(--line);
}
.arvis-post-meta__author {
  display: flex;
  align-items: center;
  gap: 0.7rem;
}
.arvis-post-meta__avatar {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--arvis-midnight);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.9rem;
  text-transform: uppercase;
}
:root[data-theme="dark"] .arvis-post-meta__avatar {
  background: var(--surface-3);
  color: var(--arvis-midnight);
}
.arvis-post-meta__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.arvis-post-meta__authorText {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}
.arvis-post-meta__name {
  font-weight: 700;
  color: var(--arvis-midnight);
}
.arvis-post-meta__name a {
  color: var(--arvis-midnight) !important;
  text-decoration: none;
}
.arvis-post-meta__role {
  font-size: 0.8rem;
  color: var(--on-surface-faded);
}
.arvis-post-meta__items {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1.25rem;
  font-size: 0.875rem;
  color: var(--on-surface-faded);
}
.arvis-post-meta__item {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.arvis-post-meta__item svg {
  color: var(--arvis-ember);
  flex: 0 0 auto;
}
.arvis-post-meta__item a {
  color: inherit !important;
  text-decoration: none;
}
@media (min-width: 768px) {
  .arvis-post-meta__author {
    padding-right: 1.5rem;
    border-right: 1px solid var(--line);
  }
}
/* Coperta articolului, mutata in header dupa banda meta (autor/data/vizualizari) */
.arvis-post-head__cover {
  display: block;
  margin-top: 1.5rem;
  border-radius: 14px;
  overflow: hidden;
}
.arvis-post-head__cover img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* ---- 22. Homepage: bloc editorial "De citit înainte să cumperi" (arvisextend) ---- */
.arvis-home-ghiduri {
  padding: clamp(2rem, 5vw, 3.5rem) 0;
}
.arvis-home-ghiduri__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: 1.75rem;
}
.arvis-home-ghiduri__eyebrow {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--arvis-ember);
  margin-bottom: 0.4rem;
}
.arvis-home-ghiduri__title {
  font-weight: 800;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  color: var(--arvis-midnight);
  margin: 0;
}
.arvis-home-ghiduri__title::after {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  background: var(--arvis-ember);
  border-radius: 2px;
  margin-top: 0.6rem;
}
.arvis-home-ghiduri__sub {
  color: var(--on-surface-faded);
  margin: 0.85rem 0 0;
  max-width: 60ch;
}
.arvis-home-ghiduri__all {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--arvis-ember) !important;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.arvis-home-ghiduri__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.arvis-home-ghiduri__card {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(var(--arvis-shadow-rgb), 0.04),
    0 8px 24px rgba(var(--arvis-shadow-rgb), 0.05);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.arvis-home-ghiduri__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 2px 4px rgba(var(--arvis-shadow-rgb), 0.06),
    0 16px 40px rgba(var(--arvis-shadow-rgb), 0.1);
}
.arvis-home-ghiduri__media {
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--surface-container);
}
.arvis-home-ghiduri__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.arvis-home-ghiduri__badge {
  position: absolute;
  top: 0.8rem;
  left: 0.8rem;
  background: var(--surface);
  color: var(--arvis-midnight);
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.3rem 0.7rem;
  border-radius: 999px;
  box-shadow: 0 1px 3px rgba(var(--arvis-shadow-rgb), 0.12);
}
.arvis-home-ghiduri__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 1.25rem;
}
.arvis-home-ghiduri__cardTitle {
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.3;
  color: var(--arvis-midnight);
  margin: 0 0 0.6rem;
}
.arvis-home-ghiduri__excerpt {
  color: var(--on-surface-faded);
  font-size: 0.92rem;
  line-height: 1.55;
  margin: 0 0 1rem;
}
.arvis-home-ghiduri__cta {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--arvis-ember);
  font-weight: 600;
  font-size: 0.9rem;
}
@media (max-width: 900px) {
  .arvis-home-ghiduri__grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 600px) {
  .arvis-home-ghiduri__grid {
    grid-template-columns: 1fr;
  }
}

/* ---- 23. Fix-uri articol: paginare prev/main/next + titlu "Produse asociate" ---- */
.simpleblog__post .pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  border: 0;
  padding: 0;
  margin-top: 1.5rem;
}
.simpleblog__post .pagination .page-item {
  margin: 0;
}
.simpleblog__post .pagination .page-link {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-container);
  color: var(--arvis-midnight) !important;
  padding: 0.5rem 1.1rem;
  font-weight: 600;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.simpleblog__post .pagination .page-link:hover {
  background: var(--arvis-ember);
  border-color: var(--arvis-ember);
  color: #fff !important;
}
.arvis-related {
  margin-top: 2.5rem;
}
.arvis-related__title {
  font-weight: 800;
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  color: var(--arvis-midnight);
  margin: 0 0 1.25rem;
}
.arvis-related__title::after {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  background: var(--arvis-ember);
  border-radius: 2px;
  margin-top: 0.6rem;
}

/* ===== Sameday easybox locker selector — Arvis ===== */
.js-carrier-extra-content:has(#showLockerMap) {
  padding: 14px 18px 6px;
}
.js-carrier-extra-content:has(#showLockerMap) .row,
.js-carrier-extra-content:has(#showLockerMap) .col-sm-12,
.js-carrier-extra-content:has(#showLockerMap) .col-sm-2,
.js-carrier-extra-content:has(#showLockerMap) .col-sm-10 {
  flex: 0 0 100%;
  max-width: 100%;
  width: 100%;
  margin: 0;
  padding-left: 0;
  padding-right: 0;
}
.js-carrier-extra-content:has(#showLockerMap) .col-sm-2 {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--arvis-midnight);
  margin-bottom: 6px;
}
/* Buton + card pe acelasi rand, aliniate vertical; cardul umple spatiul din dreapta */
.js-carrier-extra-content:has(#showLockerMap) .col-sm-10 {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.js-carrier-extra-content:has(#showLockerMap) #showLockerMap + div {
  display: block !important;
  flex: 1 1 240px;
  min-width: 0;
}
#showLockerMap,
#showLockerMap.btn,
#showLockerMap.btn-default {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  border: 1.5px solid #ff5c35;
  background: var(--surface);
  color: #ff5c35;
  font-weight: 600;
  font-size: 0.9rem;
  line-height: 1;
  padding: 10px 20px;
  box-shadow: none;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}
#showLockerMap:hover,
#showLockerMap:focus {
  background: #ff5c35;
  color: #fff;
  box-shadow: 0 6px 16px rgba(255, 92, 53, 0.25);
  outline: none;
}
#showLockerMap::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E")
    center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E")
    center/contain no-repeat;
}
#showLockerDetails {
  display: block;
  margin-top: 0;
  padding: 12px 14px 12px 42px;
  background: var(--surface-container);
  border: 1px solid var(--line);
  border-radius: 12px;
  position: relative;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  color: var(--arvis-midnight);
  width: 100%;
}
#showLockerDetails:empty {
  display: none !important;
}
#showLockerDetails::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 13px;
  width: 18px;
  height: 18px;
  background-color: #ff5c35;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7.5 4.27 9 5.15'/%3E%3Cpath d='M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z'/%3E%3Cpath d='m3.3 7 8.7 5 8.7-5'/%3E%3Cpath d='M12 22V12'/%3E%3C/svg%3E")
    center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7.5 4.27 9 5.15'/%3E%3Cpath d='M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z'/%3E%3Cpath d='m3.3 7 8.7 5 8.7-5'/%3E%3Cpath d='M12 22V12'/%3E%3C/svg%3E")
    center/contain no-repeat;
}
/* ============================================================
   COMPARE FLOATING (#iqitcompare-floating) — panou expandabil Arvis
   ============================================================
   Element <details> (expand/collapse nativ, fara JS), lipit de marginea
   STANGA + centrat vertical. Pastila "⤨ Compara (N)" → deschide lista de
   thumbnail-uri pe VERTICALA + buton CTA "Compara produsele".
   Markup: override in modules/iqitcompare/views/templates/hook/display-modal.tpl.
   100% brand: Inter + --surface / --arvis-midnight / --arvis-ember /
   --arvis-line (adapteaza si la dark mode).
   NB container: modulul dadea bara cu fundal/border-top propriu → resetam. */

#iqitcompare-floating.arvis-cmp {
  position: fixed !important;
  left: 0 !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;   /* centrat vertical = pe mijloc */
  z-index: 9988 !important;                  /* peste bottom-nav (9985), sub #back-to-top (9989) */
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  font-family: "Inter", system-ui, sans-serif !important;
}

/* ---- Pastila (summary) ---- */
.arvis-cmp__toggle {
  list-style: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 13px 9px 12px !important;
  background: var(--surface, #ffffff) !important;
  color: var(--arvis-midnight, #111827) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-left: 0 !important;                 /* lipit de marginea ecranului */
  border-radius: 0 999px 999px 0 !important;
  box-shadow: 0 6px 18px rgba(17, 24, 39, 0.16) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  transition: box-shadow 150ms, transform 150ms !important;
}
.arvis-cmp__toggle::-webkit-details-marker { display: none !important; }
.arvis-cmp__toggle::marker { content: "" !important; }

.arvis-cmp__toggle:hover,
.arvis-cmp__toggle:focus-visible {
  box-shadow: 0 8px 22px rgba(17, 24, 39, 0.20) !important;
  transform: translateX(2px) !important;
}

.arvis-cmp__icon { color: var(--arvis-ember, #ff5c35) !important; font-size: 14px !important; }
.arvis-cmp__label { color: inherit !important; }
.arvis-cmp__chevron {
  font-size: 11px !important;
  color: var(--arvis-midnight, #111827) !important;
  opacity: 0.5 !important;
  transition: transform 180ms ease !important;
}
#iqitcompare-floating[open] .arvis-cmp__chevron { transform: rotate(180deg) !important; }

/* ---- Corpul (card care coboara sub pastila) ---- */
.arvis-cmp__body {
  margin-top: 6px !important;
  width: 216px !important;
  max-width: 78vw !important;
  box-sizing: border-box !important;
  background: var(--surface, #ffffff) !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-left: 0 !important;
  border-radius: 0 14px 14px 0 !important;
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.18) !important;
  padding: 12px !important;
}

/* Lista thumbnails pe VERTICALA (una sub alta). */
.arvis-cmp__list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 12px !important;
  max-height: 46vh !important;
  overflow-y: auto !important;
}
.arvis-cmp__thumb {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 6px !important;
  background: #ffffff !important;
  border: 1px solid var(--arvis-line, #e5e7eb) !important;
  border-radius: 10px !important;
}
.arvis-cmp__thumb img {
  width: 54px !important;
  height: 54px !important;
  object-fit: contain !important;
  max-width: none !important;
}
.arvis-cmp__more {
  text-align: center !important;
  color: var(--arvis-midnight, #111827) !important;
  opacity: 0.6 !important;
  font-weight: 700 !important;
}

/* CTA Ember. */
.arvis-cmp__cta {
  display: block !important;
  text-align: center !important;
  padding: 10px 14px !important;
  background: var(--arvis-ember, #ff5c35) !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: background 150ms, transform 100ms !important;
}
.arvis-cmp__cta:hover,
.arvis-cmp__cta:focus-visible {
  background: var(--arvis-ember-dark, #e5502b) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* ---- Mobil ---- */
@media (max-width: 767px) {
  .arvis-cmp__toggle { padding: 8px 12px 8px 10px !important; font-size: 12px !important; }
  .arvis-cmp__body { width: 196px !important; }
  .arvis-cmp__thumb img { width: 48px !important; height: 48px !important; }
}

/* Cand cart drawer / dropdown / modal e deschis, ascundem (ca FAB + back-to-top). */
body.modal-open #iqitcompare-floating,
body.cart-open #iqitcompare-floating,
body:has([aria-expanded="true"][data-bs-toggle="dropdown"]) #iqitcompare-floating,
body:has(.dropdown-menu.show) #iqitcompare-floating {
  display: none !important;
}
/* ============================================================
   ORDER EXTRAS — bloc IBAN transfer + buton anulare comanda + alerta
   ============================================================
   Randate de arvisextend prin hookDisplayOrderDetail (pagina de comanda:
   cont + tracking guest). Design Arvis pe token-uri (adapteaza si dark mode). */

.arvis-order-alert {
  margin: 12px 0;
  padding: 12px 16px;
  border-radius: 12px;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 14px;
  font-weight: 600;
}
.arvis-order-alert--ok {
  background: var(--arvis-ember-soft, #fff3f0);
  color: var(--arvis-ember-dark, #e5502b);
  border: 1px solid var(--arvis-ember, #ff5c35);
}

.arvis-wire-box {
  margin: 16px 0;
  padding: 16px 18px;
  background: var(--surface-container, #f8f9fa);
  border: 1px solid var(--arvis-line, #e5e7eb);
  border-radius: 14px;
  font-family: "Inter", system-ui, sans-serif;
}
.arvis-wire-box__title {
  font-size: 15px;
  font-weight: 700;
  color: var(--arvis-midnight, #111827);
  margin-bottom: 4px;
}
.arvis-wire-box__hint {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--arvis-ink-soft, #6b7280);
}
.arvis-wire-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  padding: 8px 0;
  border-top: 1px solid var(--arvis-line-soft, #eef0f3);
  font-size: 14px;
}
.arvis-wire-row:first-of-type { border-top: 0; }
.arvis-wire-row > span:first-child {
  min-width: 72px;
  color: var(--arvis-ink-soft, #6b7280);
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.04em;
  align-self: center;
}
.arvis-wire-row strong { color: var(--arvis-midnight, #111827); }

.arvis-cancel-wrap { margin: 16px 0; }
.arvis-cancel-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  background: transparent;
  color: var(--arvis-ember-dark, #e5502b);
  border: 1px solid var(--arvis-ember, #ff5c35);
  border-radius: 999px;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 150ms, color 150ms, transform 100ms;
}
.arvis-cancel-btn:hover,
.arvis-cancel-btn:focus-visible {
  background: var(--arvis-ember, #ff5c35);
  color: #ffffff;
  transform: translateY(-1px);
}
/* ============================================================
   TURNSTILE — spatiere widget anti-bot in formulare
   ============================================================
   Widget-ul (.cf-turnstile) e injectat de arvisextend/views/js/arvis-turnstile.js
   in interiorul formularelor (registration/login/contact/newsletter). */

.arvis-turnstile,
.cf-turnstile {
  margin: 12px 0;
  width: 100%;          /* size:flexible → widget-ul se intinde cat formularul */
  max-width: 100%;
}

/* In footer-ul de newsletter (fundal Midnight) lasam widget-ul aliniat la stanga,
   pe latimea input-ului de email. */
.arvis-footer .arvis-turnstile,
.arvis-footer .cf-turnstile {
  margin: 10px 0 4px;
  max-width: 320px;
}