/* bundle construit offline */

/* === base.css === */
/* base.css: extras globale + utilitare. Mutăm treptat stiluri în module/*.css și reconstruim bundle.css. */
/* clean14: viteză + mobil curat + drawer îngust + thumbs corecte + usp band */
html {
  /* modern: păstrează șanțul scrollbar-ului chiar când nu e necesar */
  scrollbar-gutter: stable;
}

/* --- Sticky footer, fără CLS --- */
:root { scrollbar-gutter: stable both-edges; } /* previne „saltul” când apare scrollbarul */

html { height: 100%; }

body{
  min-height: 100dvh;           /* pe browsere moderne */
  min-height: 100vh;            /* fallback */
  display: flex;
  flex-direction: column;
}

.site-header{ flex: 0 0 auto; }
#content     { flex: 1 0 auto; } /* împinge footerul în jos când conținutul e puțin */
.site-footer { flex: 0 0 auto; margin-top: auto; position: static; }

/* opțional: pentru iPhone cu notch */
.site-footer { padding-bottom: env(safe-area-inset-bottom); }
/* fallback pentru browsere vechi */
@supports not (scrollbar-gutter: stable) {
  html { overflow-y: scroll; } /* forțează existența gutter-ului */
}

:root{ --bg:#fff; --text:#111; --muted:#6b7280; --primary:#0B7A75; --radius:14px; --radius-lg:18px; --shadow-sm:0 1px 6px rgba(0,0,0,.04); --shadow:0 4px 14px rgba(0,0,0,.06); --ease:cubic-bezier(.22,.61,.36,1); --t-fast:140ms var(--ease); --t-med:200ms var(--ease) }
*{ box-sizing:border-box } html,body{ margin:0; padding:0 }
body{ font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"; background:var(--bg); color:var(--text); line-height:1.55; font-size:clamp(15px,1.03vw,16px) }
a{ color:inherit; text-decoration:none } img{ max-width:100%; height:auto; display:block }
.container{ width:min(1120px,92vw); margin:0 auto } .glass{ background:rgba(255,255,255,.88); border:1px solid rgba(0,0,0,.06) } .no-scroll{ overflow:hidden }

/* Header */
.site-header{ position:sticky; top:0; z-index:1000; border-bottom:1px solid rgba(0,0,0,.06); box-shadow:var(--shadow-sm) }
.header-inner{ display:flex; align-items:center; gap:16px; padding:10px 0 }
.brand{ display:inline-flex; align-items:center; gap:10px } .brand img{ width:50px; height:50px } .brand-name{ font-weight:700; font-size:16px; }

/* Desktop */
.nav-desktop{ display:none } .search-desktop{ display:none }
@media (min-width:960px){
  .nav-desktop{ display:block }
  .nav-list{ display:flex; gap:16px; list-style:none; margin:0; padding:0; align-items:center }
  .nav-link{ padding:8px 10px; border-radius:10px; font-weight:600; background:transparent; border:0; cursor:pointer }
  .nav-item:hover .nav-link{ background:rgba(0,0,0,.05) }
  .search-desktop{ display:flex; gap:8px; margin-left:auto }
  .search-desktop input{ width:clamp(220px,28vw,320px); border:1px solid #e5e7eb; padding:10px 12px; border-radius:12px; height:40px }
  .search-desktop .btn{ height:40px }
}

/* Mobile controls */
.mobile-controls{ display:flex; gap:8px; align-items:center; margin-left:auto }
@media (min-width:960px){ .mobile-controls{ display:none } }
.search-toggle, .burger{ width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:12px; border:1px solid #e6e6e6; background:#fff; box-shadow:var(--shadow-sm) }
.burger{ position:relative } .burger span{ position:absolute; left:10px; right:10px; height:2px; background:var(--text); transition:transform var(--t-fast), opacity var(--t-fast), top var(--t-fast) }
.burger span:nth-child(1){ top:12px } .burger span:nth-child(2){ top:19px } .burger span:nth-child(3){ top:26px }
.burger.is-open span:nth-child(1){ top:19px; transform:rotate(45deg) } .burger.is-open span:nth-child(2){ opacity:0 } .burger.is-open span:nth-child(3){ top:19px; transform:rotate(-45deg) }

/* Search popover (mobil) */
.search-popover{ position:fixed; inset:0; background:rgba(0,0,0,.35); display:none; z-index:1400 }
.search-popover.open{ display:block }
.search-popover-form{ position:absolute; left:50%; top:10%; transform:translateX(-50%); width:min(560px,92vw); padding:12px; border-radius:var(--radius-lg); box-shadow:var(--shadow); display:grid; grid-template-columns:1fr auto; gap:8px; background:#fff; border:1px solid #eaeaea }
.search-popover-form input{ border:1px solid #e5e7eb; padding:10px 12px; border-radius:12px; height:44px; font-size:16px }
.search-close{ position:absolute; top:-12px; left:-12px; width:36px; height:36px; border-radius:999px; background:#fff; border:1px solid #e5e7eb; box-shadow:var(--shadow-sm); display:flex; align-items:center; justify-content:center; font-size:22px; line-height:1 }

/* Drawer mobil */
.mobile-drawer{ position:fixed; inset:0; z-index:1300; display:none }
.mobile-drawer.open{ display:block }
.mobile-drawer .drawer-overlay{ position:absolute; inset:0; background:rgba(0,0,0,.35) }
.mobile-drawer .drawer-panel{ position:absolute; right:0; top:0; height:100%; width:min(78vw,380px); background:#fff; box-shadow:var(--shadow); display:flex; flex-direction:column; transform:translateX(100%); transition:transform 160ms var(--ease); will-change:transform }
.mobile-drawer.open .drawer-panel{ transform:translateX(0) }
.drawer-header{ display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid #eee }
.drawer-close{ background:transparent; border:none; font-size:28px; line-height:1; cursor:pointer }
.drawer-body{ padding:10px 16px 24px; overflow-y:auto; -webkit-overflow-scrolling:touch }
.drawer-section{ margin-bottom:14px } .drawer-title{ font-weight:800; font-size:14px; color:#374151; margin:8px 4px }
.mobile-pages, .mobile-categories{ list-style:none; padding:0; margin:8px 0 0; display:grid; gap:8px } .mobile-pages li a, .mobile-categories li a{ display:block; padding:10px 12px; border-radius:10px; border:1px solid #f0f0f0; background:#fff }

/* Mega Desktop - Variantă Elegantă */
/* ===========================
   Header – Mega menu (scoped)
   =========================== */

/* 1) Normalize: link & button arată identic în nav */
.mod-header .nav-desktop .nav-link,
.mod-header .nav-desktop .nav-item > a.nav-link,
.mod-header .nav-desktop .nav-item > button.nav-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font: inherit;
  line-height: 1.2;
  color: inherit;
  text-decoration: none;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  background: transparent;
  border: 0;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

@media (hover:hover){
  .mod-header .nav-desktop .nav-item:hover > .nav-link {
    background: rgba(0,0,0,.05);
  }
}

/* 2) Containerul care deține mega-ul */
.mod-header .nav-desktop .nav-item.has-mega {
  position: relative;
}

/* 3) Panoul mega – invizibil implicit, fără „display: none” (tranziții mai fine) */
.mod-header .nav-desktop .has-mega .mega {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  width: min(720px, 92vw);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
  z-index: 2000; /* peste slider */
}

/* Deschidere: fie prin aria-expanded="true", fie prin clasa .open setată din JS */
.mod-header .nav-desktop .has-mega .nav-link[aria-expanded="true"] + .mega,
.mod-header .nav-desktop .has-mega.open .mega {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition: opacity .22s ease, transform .22s ease;
}

/* 4) Aspect panou */
.mod-header .mega .mega-content {
  position: relative;
  padding: 24px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow:
    0 18px 40px rgba(0,0,0,.10),
    0 0 0 1px rgba(0,0,0,.03);
}

.mod-header .mega h3 {
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #666;
  padding-bottom: 8px;
  border-bottom: 1px solid #eee;
}

/* 5) Grid categorii */
.mod-header .category-vertical {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr 1fr;
}
@media (min-width: 1200px){
  .mod-header .category-vertical { grid-template-columns: repeat(3, 1fr); }
}

/* 6) Item categorie */
.mod-header .category-vertical li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fafafa;
  border: 1px solid transparent;
  color: #444;
  font-size: 14px;
  font-weight: 500;
  transition: transform .18s var(--ease, ease), box-shadow .18s var(--ease, ease), border-color .18s var(--ease, ease), background .18s var(--ease, ease), color .18s var(--ease, ease);
}

.mod-header .category-vertical li a::after{
  content: '›';
  font-size: 16px;
  font-weight: 600;
  color: var(--primary, #0B7A75);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity .18s ease, transform .18s ease;
  flex-shrink: 0;
}

.mod-header .category-vertical li a:hover {
  background: #fff;
  border-color: var(--primary, #0B7A75);
  color: var(--primary, #0B7A75);
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.mod-header .category-vertical li a:hover::after {
  opacity: 1;
  transform: translateX(0);
}

/* 7) Starea butonului „Categorii” când mega-ul e deschis */
.mod-header .has-mega .nav-link::after{
  content: '⌄';
  margin-left: 8px;
  font-size: 14px;
  opacity: .7;
  transition: transform .2s ease, opacity .2s ease;
}
.mod-header .has-mega .nav-link[aria-expanded="true"],
.mod-header .has-mega.open .nav-link{
  color: var(--primary, #0B7A75);
  background: rgba(11,122,117,.06);
}
.mod-header .has-mega .nav-link[aria-expanded="true"]::after,
.mod-header .has-mega.open .nav-link::after{
  transform: rotate(180deg);
  opacity: 1;
}

/* 8) Aliniere opțională */
.mod-header .has-mega.left  .mega{ left: 0; right: auto; }
.mod-header .has-mega.right .mega{ left: auto; right: 0; }
.mod-header .has-mega.center .mega{ left: 50%; transform: translate(-50%, 8px); }
.mod-header .has-mega.center .nav-link[aria-expanded="true"] + .mega,
.mod-header .has-mega.center.open .mega{ transform: translate(-50%, 0); }

/* 9) Mobile: mega nu se folosește (avem drawer). Îl ascundem ferm. */
@media (max-width: 959.98px){
  .mod-header .nav-desktop .has-mega .mega{ display: none !important; }
}

/* 10) Slider layering când mega e deschis (opțional; dacă folosești body.mega-open din JS) */
.mega-open [data-slider-root],
.mega-open .hero,
.mega-open .hero-slider { position: relative; z-index: 1; }
.mega-open [data-slider-root] *,
.mega-open .hero *,
.mega-open .hero-slider * { animation-play-state: paused !important; }

/* 11) Focus accesibil pe item */
.mod-header .category-vertical li a:focus-visible{
  outline: 2px solid var(--primary, #0B7A75);
  outline-offset: 2px;
  background: #fff;
}

/* Box-uri */
.config-boxes{ margin:18px 0 24px } .box-row{ display:grid; gap:12px }
.box-row.cols-1{ grid-template-columns:1fr } .box-row.cols-2{ grid-template-columns:repeat(2,1fr) } .box-row.cols-3{ grid-template-columns:repeat(3,1fr) } .box-row.cols-4{ grid-template-columns:repeat(4,1fr) }
.box{ border-radius:18px; overflow:hidden; background:#fafafa; border:1px solid #f0f0f0; box-shadow:var(--shadow-sm) }
.box-img-text{ position:relative; display:block } .box-img-text .box-caption{ position:absolute; left:12px; bottom:12px; background:rgba(255,255,255,.9); padding:8px 10px; border-radius:12px }
.box-text-only{ display:block; padding:18px }

/* Categorii Homepage */
.category-boxes{ display:grid; gap:10px; grid-template-columns:1fr }
@media (min-width:780px){ .category-boxes{ grid-template-columns:repeat(3,1fr) } }
.category-box{ display:flex; align-items:center; justify-content:center; padding:16px; border:1px dashed #e5e7eb; border-radius:18px; background:#fff; box-shadow:var(--shadow-sm); transition:transform var(--t-fast), border-color var(--t-fast) }
.category-box:hover{ transform:translateY(-1px); border-color:var(--primary) } .cat-label{ font-weight:700 }

/* Produse grid */
.grid-products{ display:grid; gap:12px; grid-template-columns:repeat(2,1fr) }
@media (min-width:800px){ .grid-products{ grid-template-columns:repeat(4,1fr) } }
.product-card{ display:block; border-radius:18px; overflow:hidden; border:1px solid #f0f0f0; background:#fff; box-shadow:var(--shadow-sm) }
.pc-img-wrap{ background:#fbfbfb; aspect-ratio:1/1 } .pc-info{ padding:10px 12px } .pc-title{ font-size:16px; margin:0 0 4px } .pc-price{ color:var(--primary); font-weight:700 }

/* Căutare */
.search-form-enhanced{ grid-template-columns: 1fr auto auto; align-items:center }
.search-form-enhanced select{ border:1px solid #e5e7eb; padding:10px 12px; border-radius:12px; height:40px }
.search-card .snippet{ font-size:14px; color:#4b5563; margin-top:6px } mark{ background:#fff3bf }

/* Secțiuni & form & footer */
.page-title{ margin:12px 0 12px; font-size:clamp(22px,2.2vw,28px) } .page-section{ margin:16px 0 24px }
.form{ display:grid; gap:12px } .grid2{ display:grid; gap:12px; grid-template-columns:1fr } @media (min-width:700px){ .grid2{ grid-template-columns:1fr 1fr } }
.form input[type="text"], .form input[type="email"], .form input[type="number"], .form textarea{ width:100%; padding:10px 12px; border:1px solid #e5e7eb; border-radius:12px }
.alert{ padding:10px 12px; border-radius:12px } .alert.success{ background:#ecfdf5; border:1px solid #a7f3d0 } .alert.error{ background:#fef2f2; border:1px solid #fecaca }
.site-footer{ margin-top:32px; padding:18px 0; background:#fafafa; border-top:1px solid #eee } .footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:10px }

:focus-visible{ outline:2px solid var(--primary); outline-offset:2px }

@media (prefers-reduced-motion:reduce){ *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important } }

/* Breadcrumbs */
.breadcrumbs{ display:flex; align-items:center; gap:8px; color:#6b7280; font-size:14px; margin:6px 0 8px }
.breadcrumbs a{ color:inherit; text-decoration:none; border-bottom:1px dotted #cbd5e1 }
.breadcrumbs a:hover{ color:#111 }
.breadcrumbs .sep{ opacity:.6 }

/* ===== PDP CSS override (safe, CSS-only) ===== */
/* ===== End PDP CSS ===== */

/* PDP media-wrap align */

/* ===== PDP CSS (migrat din product.php) ===== */


/* Info cards (fără inline styles) */

/* Titluri secțiune */

/* Lightbox */
/* ===== END PDP CSS ===== */

/* ==== PDP fix30: aliniere & spacing rafinate ==== */
@media (max-width:979.98px){
}

/* fix32: media-wrap spacing */

/* fix34: media-wrap spacing & alignment */
@media (max-width:979.98px){
}

/* ===== PDP Tabs & Modal ===== */

/* Modal */
@media (max-width: 979.98px){
}
/* ===== END PDP Tabs & Modal ===== */

/* Header: buton căutare mai stilizat */
header .search button, header .btn-search, header .search .btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px; border:1px solid rgba(0,0,0,.08);
  background:rgba(255,255,255,.7); backdrop-filter:saturate(150%) blur(6px);
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
header .search button svg, header .btn-search svg { width:18px; height:18px; }
header .search input[type="search"]{ border-radius:999px; padding:10px 14px; border:1px solid rgba(0,0,0,.08); }

/* Mega meniu: categoriile mai compacte */
header .mega ul li { margin: 2px 0; }
header .mega ul a  { display:block; padding: 6px 10px; font-size: 14px; line-height: 1.25; border-radius: 8px; }
header .mega ul a:hover { background: rgba(0,0,0,0.04); }

/* === header.css === */
/* Modul: Header (scoped) — folosește doar selecții sub .mod-header pentru a evita conflicte globale */
.mod-header{}
.mod-header .nav{}
.mod-header .nav-item{}
/* Buton căutare stylizat (dacă nu e deja în base.css, îl poți muta aici) */
/*
.mod-header .btn-search{}
.mod-header .btn-search svg{ width:18px; height:18px; }
*/

/* === slider.css === */
/* Modul: Slider/Hero (scoped) */
.mod-hero{}
.mod-hero .slides{}
/* Marker folosit de JS pentru a nu închide meniul la autoplay */
.mod-hero[data-slider-root]{}

/* === card.css === */
/* Modul: Card produs (scoped) */
.mod-card{}
.mod-card .img{}
.mod-card .title{}
.mod-card .price{}

/* === order.css === */
/* Modul: Formular „Cere ofertă” (scoped) */
.mod-order{}
.mod-order .grid{}
.mod-order .btn{}

/* === footer.css === */
/* Modul: Footer (scoped) */
.mod-footer{}
.mod-footer .links{}

/* === usp.css === */
/* Modul: USP bar (scoped) */
.mod-usp{}
.mod-usp .item{}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1px solid rgba(0,0,0,.08);background:#fff;color:#111;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.06);transition:transform .08s ease, box-shadow .2s ease}
.btn.primary{background:var(--primary,#0f172a);color:#fff;border-color:transparent;box-shadow:0 8px 16px rgba(15,23,42,.18)}
.btn.primary:active{transform:translateY(1px);box-shadow:0 4px 10px rgba(15,23,42,.22)}

/* Category group heading and grid */
.cat-head{margin:2rem 0 1rem;font-size:1.25rem;font-weight:700}
.grid.prods{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}