/*
Theme Name: OZ Export Child
Theme URI: https://shop.ozexport.nl/
Description: Child theme che replica il design dello shop B2B OZ Export. Da usare con Elementor Pro + WooCommerce + WooCommerce Product Filter.
Author: Generated
Template: hello-elementor
Version: 1.0.0
*/

/* =========================================================
   VARIABILI GLOBALI
   ========================================================= */
:root{
  /* valori rilevati dal sito live (utente loggato) */
  --oz-orange:      #ff6c2c;    /* segmento "x N" unità (255,108,44) */
  --oz-orange-dk:   #e85a1c;
  --oz-promo:       #ed6a12;    /* badge Promo (237,106,18) */
  --oz-blue:        #00a3fe;    /* badge Stock (0,163,254) */
  --oz-preorder:    #993366;    /* badge Pre-order (153,51,102) */
  --oz-dark:        #161616;    /* testo nome/prezzo (22,22,22) */
  --oz-grey:        #f4f4f4;
  --oz-grey-bd:     #dedede;    /* bordo card e wrapper input (222,222,222) */
  --oz-text-mut:    #888888;
}

/* =========================================================
   1. TOPBAR ARANCIONE  (Departure date | Order before)
   ========================================================= */
.oz-topbar{
  background: var(--oz-orange);
  color:#fff;
  font-size:12px;
  font-weight:600;
  display:flex;
  justify-content:flex-end;
  gap:24px;
  padding:5px 18px;
  letter-spacing:.2px;
}
.oz-topbar .oz-topbar-label{ opacity:.85; font-weight:400; }

/* =========================================================
   2. BARRA ALFABETICA A–Z + PROMOTION
   ========================================================= */
.oz-alpha-nav{
  display:flex;
  align-items:center;
  gap:2px;
  flex-wrap:wrap;
  margin:0 0 18px;
  padding:0;
  list-style:none;
}
.oz-alpha-nav a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:22px;
  padding:0 5px;
  font-size:12px;
  font-weight:600;
  color:var(--oz-dark);
  text-decoration:none;
  border-radius:2px;
  transition:.15s;
}
.oz-alpha-nav a:hover,
.oz-alpha-nav a.active{ color:var(--oz-orange); }
.oz-alpha-nav a.oz-promotion{
  background:var(--oz-orange);
  color:#fff;
  padding:0 10px;
  margin-left:6px;
  height:22px;
  border-radius:3px;
}
.oz-alpha-nav a.oz-promotion:hover{ background:var(--oz-orange-dk); color:#fff; }

/* =========================================================
   3. GRIGLIA PRODOTTI  (5 col desktop)
   ========================================================= */
.oz-shop .products,
ul.products.oz-grid{
  display:grid !important;
  grid-template-columns:repeat(5, 1fr);
  gap:10px;
  margin:0 !important;
  padding:0 !important;
  list-style:none;
}
@media (max-width:1200px){ .oz-shop .products, ul.products.oz-grid{ grid-template-columns:repeat(4,1fr);} }
@media (max-width:992px){  .oz-shop .products, ul.products.oz-grid{ grid-template-columns:repeat(3,1fr);} }
@media (max-width:680px){  .oz-shop .products, ul.products.oz-grid{ grid-template-columns:repeat(2,1fr);} }

/* =========================================================
   4. CARD PRODOTTO
   ========================================================= */
.oz-card,
ul.products li.product{
  position:relative;
  background:#fff;
  border:1px solid var(--oz-grey-bd);
  border-radius:2px;
  padding:8px 8px 10px;
  display:flex;
  flex-direction:column;
  font-size:11px;
  color:var(--oz-dark);
  margin:0 !important;
  width:auto !important;
}
.oz-card:hover{ box-shadow:0 2px 10px rgba(0,0,0,.08); }

/* immagine */
.oz-card .oz-thumb,
ul.products li.product img{
  width:100%;
  height:130px;
  object-fit:cover;
  background:var(--oz-grey);
  margin:0 0 6px !important;
}

/* badge stock (in alto a sinistra) — valori esatti dal sito live */
.oz-badge{
  position:absolute;
  top:8px; left:8px;
  z-index:3;
  font-size:10px;
  font-weight:400;
  color:#fff;
  padding:0 5px;
  line-height:16px;
  border-radius:3px;
}
.oz-badge-stock   { background:var(--oz-blue); }
.oz-badge-preorder{ background:var(--oz-preorder); }
.oz-badge-promo   { background:var(--oz-promo); }

/* cuore preferiti (in alto a destra) */
.oz-fav{
  position:absolute;
  top:6px; right:8px;
  z-index:3;
  width:20px; height:20px;
  border:1px solid var(--oz-grey-bd);
  border-radius:50%;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  color:var(--oz-text-mut);
  font-size:11px;
  cursor:pointer;
}
.oz-fav:hover{ color:var(--oz-orange); border-color:var(--oz-orange); }

/* nome prodotto */
.oz-card .oz-name,
ul.products li.product .woocommerce-loop-product__title{
  font-size:13px !important;
  font-weight:700;
  color:var(--oz-dark);
  margin:2px 0 6px !important;
  padding:0 !important;
  line-height:1.2;
  min-height:32px;
}

/* riga pill specs (stem · grade · certified) */
.oz-specs{
  display:flex;
  align-items:center;
  gap:10px;
  border-top:1px solid var(--oz-grey-bd);
  border-bottom:1px solid var(--oz-grey-bd);
  padding:5px 0;
  margin:0 0 6px;
  color:var(--oz-text-mut);
  font-size:10px;
}
.oz-specs .oz-spec{ display:flex; align-items:center; gap:3px; }
.oz-specs .oz-spec svg,
.oz-specs .oz-spec i{ width:11px; height:11px; opacity:.6; }
.oz-specs .oz-spec.oz-certified{ color:var(--oz-green); }

/* riga info testuale (color · grower · packaging) */
.oz-info{
  font-size:10px;
  color:var(--oz-text-mut);
  line-height:1.35;
  margin:0 0 8px;
  min-height:42px;
}
.oz-info b{ color:var(--oz-dark); font-weight:600; }

/* unità (Bucket / numero) */
.oz-unit{
  font-size:10px;
  color:var(--oz-text-mut);
  margin:0 0 6px;
}
.oz-unit .oz-unit-name{ display:block; color:var(--oz-dark); font-weight:600; }

/* =========================================================
   5. RIGA ACQUISTO  (2 colonne: info-secchio sx | prezzo+input dx)
   replica struttura reale .new_layout_spi_section
   ========================================================= */
.oz-buy{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  margin-top:auto;
  border-top:1px solid var(--oz-grey-bd);
  padding-top:6px;
}

/* colonna sinistra: stock disponibile + Bucket(code) + paese */
.oz-buy-left{ font-size:10px; color:var(--oz-text-mut); line-height:1.3; }
.oz-buy-left .oz-stockqty{ font-weight:700; color:var(--oz-dark); font-size:11px; }
.oz-buy-left .oz-bucket{ display:block; }
.oz-buy-left .oz-bucket b{ color:var(--oz-dark); font-weight:700; }
.oz-flag{ display:inline-flex; align-items:center; gap:4px; margin-top:2px; font-size:10px; color:var(--oz-text-mut);}
.oz-flag img{ width:16px; height:11px; }

/* colonna destra: prezzo sopra, input+unità sotto */
.oz-buy-right{ display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.oz-price{
  font-size:15px;
  font-weight:700;
  color:var(--oz-dark);
  white-space:nowrap;
}

/* wrapper input: bordo grigio chiaro, radius 4px (come .input-outer reale) */
.oz-input-outer{
  display:inline-flex;
  align-items:stretch;
  border:1px solid var(--oz-grey-bd);
  border-radius:4px;
  overflow:hidden;
  height:26px;
}
.oz-qty-input{
  width:48px;
  border:none;
  outline:none;
  text-align:center;
  font-size:15px;
  color:var(--oz-dark);
  padding:0 4px;
  -moz-appearance:textfield;
}
.oz-qty-input::-webkit-outer-spin-button,
.oz-qty-input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.oz-qty-input::placeholder{ color:#bbb; }

/* segmento arancione "x N" attaccato a destra (etichetta moltiplicatore) */
.oz-unit-mult{
  background:var(--oz-orange);
  color:#fff;
  font-size:10px;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  padding:0 6px;
  border-radius:0 3px 3px 0;
  cursor:pointer;
  white-space:nowrap;
}
.oz-unit-mult:hover{ background:var(--oz-orange-dk); }

/* =========================================================
   6. SIDEBAR FILTRI  (WooCommerce Product Filter - WooBeWoo)
   ========================================================= */
.oz-sidebar{
  font-size:12px;
  color:var(--oz-dark);
}
.oz-sidebar .wpf-filter,
.oz-sidebar .widget{
  border-bottom:1px solid var(--oz-grey-bd);
  padding:0;
  margin:0;
}
.oz-sidebar .wpf-filter-title,
.oz-sidebar .widgettitle,
.oz-sidebar .oz-filter-title{
  font-size:12px;
  font-weight:700;
  color:var(--oz-dark);
  padding:11px 4px;
  margin:0;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.oz-sidebar .oz-filter-title::after{ content:"\25BE"; color:var(--oz-text-mut); font-size:10px; }
.oz-sidebar .wpf-checkbox label,
.oz-sidebar label{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:12px;
  color:#555;
  padding:3px 4px;
  cursor:pointer;
}
.oz-sidebar input[type=checkbox]{ accent-color:var(--oz-orange); width:14px; height:14px; }
.oz-sidebar .wpf-count,
.oz-sidebar .count{ color:var(--oz-text-mut); margin-left:auto; font-size:11px; }

/* dot colore accanto a "Main colour" */
.oz-color-dot{ width:11px; height:11px; border-radius:50%; border:1px solid #ccc; display:inline-block; }

/* =========================================================
   7. TOOLBAR ELENCO (count prodotti + vista griglia/lista + sort)
   ========================================================= */
.oz-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 0 14px;
}
.oz-toolbar .oz-count{ font-size:12px; color:var(--oz-text-mut); }
.oz-toolbar .oz-cat-title{ font-size:22px; font-weight:700; color:var(--oz-dark); margin:0; }

/* =========================================================
   8. SINGLE PRODUCT
   ========================================================= */
.oz-single{ display:grid; grid-template-columns:minmax(0,420px) 1fr; gap:34px; }
@media (max-width:768px){ .oz-single{ grid-template-columns:1fr; } }
.oz-single .oz-single-title{ font-size:26px; font-weight:700; color:var(--oz-dark); margin:0 0 10px; }
.oz-single .oz-single-price{ font-size:24px; font-weight:700; color:var(--oz-dark); margin:12px 0; }
.oz-single .oz-attr-table{ width:100%; border-collapse:collapse; margin:16px 0; font-size:13px; }
.oz-single .oz-attr-table th{ text-align:left; color:var(--oz-text-mut); font-weight:600; padding:7px 12px 7px 0; width:170px; }
.oz-single .oz-attr-table td{ color:var(--oz-dark); padding:7px 0; border-bottom:1px solid var(--oz-grey-bd); }
.oz-single .oz-single-buy{ display:flex; align-items:center; gap:0; margin-top:18px; }
.oz-single .oz-single-buy .oz-qty-input{ width:60px; height:40px; font-size:15px; }
.oz-single .oz-single-buy .oz-add-btn{ height:40px; font-size:14px; padding:0 22px; }

/* =========================================================
   9. HEADER NAV
   ========================================================= */
.oz-header{ display:flex; align-items:center; gap:26px; padding:10px 18px; border-bottom:1px solid var(--oz-grey-bd); background:#fff; }
.oz-header .oz-logo img{ height:34px; }
.oz-nav{ display:flex; gap:18px; list-style:none; margin:0; padding:0; }
.oz-nav a{ font-size:13px; font-weight:600; color:var(--oz-dark); text-decoration:none; }
.oz-nav a:hover{ color:var(--oz-orange); }
.oz-search{ margin-left:auto; display:flex; align-items:center; }
.oz-search input{ height:32px; border:1px solid var(--oz-grey-bd); border-radius:3px; padding:0 12px; width:240px; font-size:12px; }
.oz-cart{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--oz-dark); }
.oz-cart .oz-cart-ico{ color:var(--oz-orange); font-size:18px; }