/* oopticshop, stratul v1 fidel: cardul de produs, filtrul si bara de listare (06_site/v1 components-v5.css .card,
   .badge, .filters, .pgrid; bancul Zona B pentru restul paginii). Tokens din tokens.css; !important peste CSS-ul inline Journal. */

/* fundalul paginilor de magazin pe os, ca in v1 */
html body, html body .site-wrapper { background:var(--background-light) !important; }

/* ---------- cardul (.card) ---------- */
.product-grid .product-layout .product-thumb {
  position:relative !important; display:flex !important; flex-direction:column !important; height:100%;
  background:var(--surface-placheta) !important; border:var(--line-hair) solid var(--border-default) !important;
  border-radius:var(--radius-m) !important; padding:var(--space-3) !important; box-shadow:none !important;
  transition:border-color .15s ease; overflow:visible !important; }
.product-grid .product-layout .product-thumb:hover { border-color:var(--text-secondary-on-light) !important; box-shadow:none !important; }
.product-grid .product-thumb .image { position:relative; aspect-ratio:4 / 3; display:grid !important; place-items:center;
  overflow:hidden; margin:0 !important; padding:0 !important; background:transparent !important; border:0 !important; }
.product-grid .product-thumb .image .product-img, .product-grid .product-thumb .image .product-img > div {
  display:grid !important; place-items:center; width:100%; height:100%; }
.product-grid .product-thumb .image img { mix-blend-mode:multiply; max-width:100% !important; max-height:100% !important;
  width:auto !important; height:auto !important; object-fit:contain; }
.product-grid .product-thumb .image .img-second { display:none !important; }

/* insignele: reducerea pe coral, "Nou" pe espresso, sus-stanga (v1 .badge); "Stoc epuizat" ramane vizibil (nu ascundem) */
.product-grid .product-thumb .product-labels { position:absolute !important; top:var(--space-3) !important; left:var(--space-3) !important;
  right:auto !important; bottom:auto !important; z-index:2; display:flex !important; flex-direction:column; align-items:flex-start;
  gap:var(--space-1); width:auto !important; height:auto !important; transform:none !important; }
.product-grid .product-thumb .product-label { position:static !important; transform:none !important; width:auto !important;
  height:auto !important; margin:0 !important; padding:0 !important; background:none !important; box-shadow:none !important; }
.product-grid .product-thumb .product-label::before, .product-grid .product-thumb .product-label::after { display:none !important; }
.product-grid .product-thumb .product-label b { display:inline-block !important; position:static !important; transform:none !important;
  width:auto !important; height:auto !important; min-width:0 !important; line-height:1.3 !important;
  padding:var(--space-1) var(--space-2) !important; border-radius:var(--radius-s) !important;
  background:var(--text-on-light) !important; color:var(--text-on-dark) !important; border:0 !important;
  font-family:var(--type-family-body), system-ui, sans-serif !important; font-size:var(--type-size-micro) !important;
  font-weight:700 !important; text-transform:none !important; letter-spacing:0 !important; font-variant-numeric:tabular-nums; }
.product-grid .product-thumb .product-label-28 b { background:var(--accent-primary) !important; color:var(--text-on-light) !important; }

/* inima de favorite pe imagine, sus-dreapta (v1 .card .wish) */
.product-grid .product-thumb .wish-group { position:absolute !important; top:var(--space-3) !important; right:var(--space-3) !important;
  z-index:2; margin:0 !important; padding:0 !important; width:auto !important; }
.product-grid .product-thumb .btn-wishlist { display:inline-flex !important; align-items:center; justify-content:center;
  width:auto !important; height:auto !important; min-width:0 !important; padding:var(--space-1) !important; border:0 !important;
  border-radius:var(--radius-m) !important; background:transparent !important; box-shadow:none !important; }
.product-grid .product-thumb .btn-wishlist .btn-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.product-grid .product-thumb .btn-wishlist::before { color:var(--text-secondary-on-light) !important; font-size:var(--space-5) !important;
  margin:0 !important; transition:color .15s ease; }
.product-grid .product-thumb .btn-wishlist:hover { background:transparent !important; }
.product-grid .product-thumb .btn-wishlist:hover::before { color:var(--accent-primary) !important; }
.product-grid .product-thumb .btn-wishlist:active { transform:translateY(var(--line-hair)); }

/* textul: brand 12 grafit, nume 13/600, descriere 12 grafit (v1 .card .meta) */
.product-grid .product-thumb .caption { display:flex !important; flex-direction:column !important; flex:1 1 auto;
  position:static !important; /* inima se ancoreaza de card, nu de caption */
  padding:0 !important; margin:var(--space-2) 0 0 !important; text-align:left !important; background:none !important; }
.product-grid .product-thumb .stats { order:0 !important; display:block !important; margin:0 0 var(--space-1) !important; padding:0 !important;
  border:0 !important; text-align:left !important; background:none !important; }
.product-grid .product-thumb .stats .stats-label { display:none !important; }
.product-grid .product-thumb .stats, .product-grid .product-thumb .stats a, .product-grid .product-thumb .stats span {
  font-family:var(--type-family-body), system-ui, sans-serif !important; font-size:var(--type-size-legenda) !important;
  font-weight:400 !important; color:var(--text-secondary-on-light) !important; text-transform:none !important; text-decoration:none !important; }
.product-grid .product-thumb .name { order:1 !important; margin:0 !important; padding:0 !important; text-align:left !important; }
.product-grid .product-thumb .name a { display:block; font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-weight:600 !important; font-size:var(--type-size-interfata) !important; line-height:1.35 !important; letter-spacing:0 !important;
  color:var(--text-on-light) !important; text-transform:none !important; white-space:normal !important; overflow:visible !important; }
.product-grid .product-thumb .name a:hover { text-decoration:underline !important; text-underline-offset:var(--space-1); }
.product-grid .product-thumb .description { order:2 !important; display:block !important; margin:var(--space-1) 0 0 !important; padding:0 !important;
  min-height:calc(var(--space-5) + var(--space-3)); font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-size:var(--type-size-legenda) !important; line-height:1.4 !important; color:var(--text-secondary-on-light) !important; text-align:left !important; }

/* linia de pret: nou 700, vechi taiat 12 grafit, "In stoc" 11/600 majuscule in dreapta (v1 .priceline) */
.product-grid .product-thumb .price { order:3 !important; display:flex !important; flex-wrap:wrap; align-items:baseline; gap:var(--space-1) var(--space-2);
  margin:var(--space-2) 0 0 !important; padding:0 !important; text-align:left !important; justify-content:flex-start !important; }
.product-grid .product-thumb .price > div { display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--space-1) var(--space-2); }
.product-grid .product-thumb .price-new, .product-grid .product-thumb .price-normal {
  font-family:var(--type-family-body), system-ui, sans-serif !important; font-weight:700 !important; font-size:var(--type-size-corp) !important;
  color:var(--text-on-light) !important; font-variant-numeric:tabular-nums; }
.product-grid .product-thumb .price-old { font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-size:var(--type-size-legenda) !important; font-weight:400 !important; color:var(--text-secondary-on-light) !important;
  text-decoration:line-through !important; font-variant-numeric:tabular-nums; margin:0 !important; }
.product-grid .product-thumb .price-tax { display:none !important; }
.product-grid .product-layout:not(.out-of-stock) .product-thumb .price::after { content:"În stoc"; margin-left:auto;
  font-family:var(--type-family-body), system-ui, sans-serif; font-size:var(--type-size-micro); font-weight:600;
  letter-spacing:0.08em; text-transform:uppercase; color:var(--text-on-light); }
.product-grid .product-thumb .rating, .product-grid .product-thumb .countdown, .product-grid .product-thumb .extra-group,
.product-grid .product-thumb .quickview-button, .product-grid .product-thumb .stepper, .product-grid .product-thumb .btn-compare { display:none !important; }

/* butonul: coral pe toata latimea, text espresso 13/700 (v1 .buy button) */
.product-grid .product-thumb .buttons-wrapper { order:4 !important; margin:auto 0 0 !important; padding:var(--space-2) 0 0 !important;
  position:static !important; opacity:1 !important; visibility:visible !important; transform:none !important; background:none !important; }
.product-grid .product-thumb .button-group { display:block !important; padding:0 !important; margin:0 !important; background:none !important; border:0 !important; }
.product-grid .product-thumb .cart-group { display:block !important; width:100% !important; margin:0 !important; }
.product-grid .product-thumb .btn-cart { display:flex !important; align-items:center; justify-content:center; width:100% !important;
  height:auto !important; min-height:0 !important; margin:0 !important; padding:var(--space-2) var(--space-3) !important;
  border:0 !important; border-radius:var(--radius-m) !important; background:var(--accent-primary) !important;
  color:var(--text-on-light) !important; box-shadow:none !important; transition:filter .15s ease; }
.product-grid .product-thumb .btn-cart::before, .product-grid .product-thumb .btn-cart::after { display:none !important; }
.product-grid .product-thumb .btn-cart .btn-text { display:inline !important; font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-size:var(--type-size-interfata) !important; font-weight:700 !important; text-transform:none !important; letter-spacing:0 !important;
  color:var(--text-on-light) !important; }
.product-grid .product-thumb .btn-cart:hover { filter:brightness(96%); background:var(--accent-primary) !important; }
.product-grid .product-thumb .btn-cart:active { filter:brightness(90%); }
.product-grid .product-thumb a:focus-visible, .product-grid .product-thumb .btn:focus-visible {
  outline:var(--line-rule) solid var(--text-on-light) !important; outline-offset:var(--line-rule) !important; }
.product-grid .product-layout.out-of-stock .product-thumb .btn-cart { background:var(--border-default) !important; }

/* ---------- filtrul (v1 .filters): placheta alba, "Filtru" + "Sterge", grupuri pe fileturi, casute espresso ---------- */
.module-filter { background:var(--surface-placheta) !important; border:var(--line-hair) solid var(--border-default) !important;
  border-radius:var(--radius-m) !important; padding:var(--space-4) !important; box-shadow:none !important; }
.module-filter > .module-title { display:flex !important; justify-content:space-between; align-items:baseline; margin:0 0 var(--space-3) !important;
  padding:0 !important; border:0 !important; background:none !important; font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-size:var(--type-size-interfata) !important; font-weight:700 !important; color:var(--text-on-light) !important; text-transform:none !important; }
.module-filter > .module-title::after { display:none !important; }
.module-filter > .module-title .reset-filter { order:2; margin-left:auto !important; padding:0 !important; min-height:0 !important; height:auto !important;
  border:0 !important; background:none !important; box-shadow:none !important; font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-size:0 !important; color:var(--text-secondary-on-light) !important; text-decoration:underline; text-underline-offset:var(--space-1); }
.module-filter > .module-title .reset-filter::before { content:"Șterge" !important; font-size:var(--type-size-legenda) !important;
  font-weight:500; font-family:inherit; color:var(--text-secondary-on-light); }
.module-filter > .module-title .reset-filter:hover::before { color:var(--text-on-light); }
.module-filter .panel { border:0 !important; border-top:var(--line-hair) solid var(--border-default) !important; border-radius:0 !important;
  background:none !important; box-shadow:none !important; margin:0 !important; padding:var(--space-3) 0 !important; }
.module-filter .panel-heading, .module-filter .panel-title { padding:0 !important; margin:0 !important; background:none !important; border:0 !important; }
.module-filter .panel-title a { display:flex !important; justify-content:space-between; align-items:center; padding:0 0 var(--space-2) !important;
  font-family:var(--type-family-body), system-ui, sans-serif !important; font-size:var(--type-size-interfata) !important; font-weight:600 !important;
  color:var(--text-on-light) !important; text-transform:none !important; letter-spacing:0 !important; background:none !important; }
.module-filter .panel-title a .fa, .module-filter .panel-title a::before, .module-filter .panel-title a::after { color:var(--text-secondary-on-light) !important; }
.module-filter .panel-body { padding:0 !important; }
.module-filter .filter-checkbox label, .module-filter .filter-radio label { display:flex !important; align-items:center; gap:var(--space-2);
  padding:var(--space-1) 0 !important; margin:0 !important; cursor:pointer; font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-size:var(--type-size-interfata) !important; font-weight:400 !important; color:var(--text-on-light) !important; }
.module-filter .filter-checkbox input[type=checkbox], .module-filter .filter-radio input[type=radio] {
  appearance:none; -webkit-appearance:none; flex:none; width:var(--space-4) !important; height:var(--space-4) !important; margin:0 !important;
  border:var(--line-rule) solid var(--text-secondary-on-light); border-radius:var(--radius-s); background:var(--surface-placheta);
  cursor:pointer; transition:background .15s ease, border-color .15s ease; }
.module-filter .filter-checkbox label:hover input { border-color:var(--text-on-light); }
.module-filter .filter-checkbox input:checked, .module-filter .filter-radio input:checked { background:var(--text-on-light);
  border-color:var(--text-on-light); background-clip:content-box; padding:var(--line-rule); }
.module-filter .filter-checkbox input:focus-visible { outline:var(--line-rule) solid var(--text-on-light); outline-offset:var(--line-rule); }
.module-filter .count-badge { position:static !important; margin-left:auto !important; background:none !important; padding:0 !important;
  font-size:var(--type-size-micro) !important; color:var(--text-secondary-on-light) !important; font-weight:400 !important; }
/* pretul: bara espresso, cifrele 11 px grafit */
.module-filter .irs-bar, .module-filter .irs-slider { background:var(--text-on-light) !important; border-color:var(--text-on-light) !important; }
.module-filter .irs-line { background:var(--border-default) !important; }
.module-filter .irs-from, .module-filter .irs-to, .module-filter .irs-single { display:none !important; }
.module-filter .extra-controls { display:flex; align-items:center; gap:var(--space-1); margin-top:var(--space-2); }
.module-filter .extra-controls input { width:var(--space-8) !important; height:auto !important; padding:var(--space-1) var(--space-2) !important;
  border:var(--line-hair) solid var(--border-default) !important; border-radius:var(--radius-s) !important; background:var(--surface-placheta) !important;
  font-size:var(--type-size-micro) !important; color:var(--text-on-light) !important; font-variant-numeric:tabular-nums; }
.module-filter .extra-controls .currency-symbol { font-size:var(--type-size-micro); color:var(--text-secondary-on-light); }

/* ---------- bara de listare: grila/lista, sortare, afisare ---------- */
.products-filter { background:var(--surface-placheta) !important; border:var(--line-hair) solid var(--border-default) !important;
  border-radius:var(--radius-m) !important; padding:var(--space-2) var(--space-3) !important; box-shadow:none !important; }
.products-filter .compare-btn { display:none !important; }
.products-filter label, .products-filter .input-group-addon { background:none !important; border:0 !important;
  font-family:var(--type-family-body), system-ui, sans-serif !important; font-size:var(--type-size-legenda) !important;
  color:var(--text-secondary-on-light) !important; text-transform:none !important; }
.products-filter select.form-control { border:var(--line-hair) solid var(--border-default) !important; border-radius:var(--radius-s) !important;
  background-color:var(--surface-placheta) !important; font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-size:var(--type-size-legenda) !important; color:var(--text-on-light) !important; height:auto !important; padding:var(--space-1) var(--space-2) !important; }
.products-filter .view-btn::before { color:var(--text-secondary-on-light) !important; }
.products-filter .view-btn.active::before { color:var(--text-on-light) !important; }

/* titlurile de pagina din magazin (categorie, cautare, oferte): Familjen, pe v1 */
.route-product-category .page-title, .route-product-special .page-title, .route-product-search .page-title,
.route-product-manufacturer-info .page-title { font-family:var(--type-family-display), Arial, sans-serif !important; font-weight:700 !important;
  letter-spacing:-0.02em !important; }

/* "Adauga in Cos" vine din fisierul de limba OpenCart (nu-l suprascriem): v1 scrie "Adauga in cos" */
.product-grid .product-thumb .btn-cart .btn-text { text-transform:lowercase !important; }
.product-grid .product-thumb .btn-cart .btn-text::first-letter { text-transform:uppercase; }
/* spatiul dintre carduri: 12 px ca .pgrid din v1 (Journal pune 20) */
.main-products.product-grid { margin-inline:calc(var(--space-3) / -2) !important; }
.main-products.product-grid > .product-layout { padding:calc(var(--space-3) / 2) !important; }

/* telefon/tableta: butonul de filtre (creat de journal.js) ca buton fantoma v1, nu rosu; panoul mobil cu "Sterge" */
.mobile-filter-trigger.btn { background:var(--surface-placheta) !important; color:var(--text-on-light) !important;
  border:var(--line-rule) solid var(--text-on-light) !important; border-radius:var(--radius-pill) !important; box-shadow:none !important;
  font-family:var(--type-family-body), system-ui, sans-serif !important; font-size:var(--type-size-interfata) !important;
  font-weight:700 !important; text-transform:none !important; letter-spacing:0 !important;
  padding:var(--space-2) var(--space-4) !important; height:auto !important; }
.mobile-filter-trigger.btn::before { color:var(--text-on-light) !important; }
.mobile-filter-trigger.btn:hover { background:var(--background-light) !important; }
.mobile-filter-trigger.btn:active { transform:translateY(var(--line-hair)); }
.mobile-filter-container .mobile-wrapper-header { background:var(--surface-placheta) !important; color:var(--text-on-light) !important;
  border-bottom:var(--line-hair) solid var(--border-default) !important; font-family:var(--type-family-body), system-ui, sans-serif !important;
  font-weight:700 !important; font-size:var(--type-size-interfata) !important; text-transform:none !important; }
.mobile-filter-container .mobile-wrapper-header .reset-filter { background:none !important; border:0 !important; box-shadow:none !important;
  font-size:0 !important; padding:0 !important; margin-left:auto; }
.mobile-filter-container .mobile-wrapper-header .reset-filter::before { content:"Șterge" !important; font-size:var(--type-size-legenda);
  font-weight:500; color:var(--text-secondary-on-light); text-decoration:underline; text-underline-offset:var(--space-1); }
.mobile-filter-container .module-filter { border:0 !important; border-radius:0 !important; }
