/* stilizari aditionale vetter */

.article__author-link {
  color: currentColor;
  text-decoration: none;
}

/* CLS: box fix pentru iconitele din meniul principal.
   Fara latime rezervata, iconitele cu alt raport (ex. 534x600) se randau la 35.6px
   si impingeau orizontal restul meniului la lazy-load. object-fit pastreaza aspectul. */
img.menu-mobile__image {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

/* Recenzii: ascunde stelele goale si contorul (0) pentru produsele fara review-uri.
   .product__rating este gol (fara .product__rating-fill) cand nu exista recenzii.
	    Contorul frate are display:inline-block inline, deci necesita !important. */
.product__rating:empty { display: none;  }
.product__rating:empty + div { display: none !important; }

/* Butoane flotante (WhatsApp, accesibilitate, scroll-to-top) pe homepage, desktop SI mobil:
   vizibile pe primul ecran si in zona footer, ascunse in zona cu carusele de produse,
   ca sa nu acopere butoanele "Adauga in cos" si inima de wishlist.
   Clasele vt-fab-js / vt-fab-show sunt adaugate de scriptul din layout/base.html.twig.
   Daca scriptul nu ruleaza, .vt-fab-js lipseste si butoanele raman vizibile permanent. */
html.vt-fab-js div.floating-wpp,
html.vt-fab-js .accessibility-button,
html.vt-fab-js .scroll-to-top-arrow {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .25s ease, visibility .25s ease;
}

html.vt-fab-js.vt-fab-show div.floating-wpp,
html.vt-fab-js.vt-fab-show .accessibility-button,
html.vt-fab-js.vt-fab-show .scroll-to-top-arrow {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* CLS: headerul temei trece din static in fixed la primul scroll, iar padding-ul
   compensator de pe body se aplica un frame mai tarziu, asa ca tot continutul urca
   ~240px o data. Este singurul shift mare de pe homepage: 0.24 din 0.38 masurat.
   Scriptul din snippets/sections/header.html.twig masoara headerul, pune padding-ul
   abia apoi adauga clasa de mai jos, in acelasi task, deci nu mai exista frame-ul
   intermediar. Fara script clasa lipseste si headerul se comporta ca inainte. */
html.vt-header-fixed #header.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1020;
}

/* Tema seteaza padding-top inline pe body, deci regula are nevoie de !important.
   Variabila e setata de acelasi script, din inaltimea reala a headerului. */
html.vt-header-fixed body {
  padding-top: var(--vt-header-h, 0px) !important;
}


/* A11y: contrast AA pentru textele custom de pe homepage.
   Culoarea #777 (4.48:1) pica pe alb la text mic; #666 (5.74:1) trece AA.
	    Vizeaza descrierile cardurilor de incarcare si kicker-ul trust-anchor. */
			.vetter-charging .vch-card-desc,
			.vetter-trust-anchor .vta-kicker {
			  color: #666 !important;
				}

				/* ===== Sectiune recenzii Google + Facebook (social proof) ===== */
				.vetter-reviews{padding:48px 16px;background:#fafafa;}
				.vetter-reviews .vr-inner{max-width:1100px;margin:0 auto;}
				.vetter-reviews .vr-title{font-size:26px;font-weight:700;text-align:center;margin:0 0 6px;color:#1a1a1a;}
				.vetter-reviews .vr-subtitle{font-size:15px;text-align:center;color:#666;margin:0 0 28px;}
				.vetter-reviews .vr-summary{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-bottom:28px;}
				.vetter-reviews .vr-summary-card{flex:1 1 260px;max-width:340px;background:#fff;border:1px solid #e6e6e6;border-radius:14px;padding:22px 24px;display:flex;align-items:center;gap:16px;box-shadow:0 1px 3px rgba(0,0,0,.04);}
				.vetter-reviews .vr-summary-card .vr-logo{width:40px;height:40px;flex:0 0 40px;}
				.vetter-reviews .vr-summary-card .vr-sc-body{display:flex;flex-direction:column;}
				.vetter-reviews .vr-score{font-size:24px;font-weight:700;color:#1a1a1a;line-height:1.1;}
				.vetter-reviews .vr-stars{color:#fbbc04;font-size:16px;letter-spacing:1px;}
				.vetter-reviews .vr-count{font-size:13px;color:#666;}
				.vetter-reviews .vr-count a{color:#1a73e8;text-decoration:none;}
				.vetter-reviews .vr-count a:hover{text-decoration:underline;}
				.vetter-reviews .vr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
				.vetter-reviews .vr-card{background:#fff;border:1px solid #e6e6e6;border-radius:14px;padding:20px;display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(0,0,0,.04);transition:box-shadow .2s ease,transform .2s ease;}
				.vetter-reviews .vr-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-2px);}
				.vetter-reviews .vr-card .vr-city{font-size:16px;font-weight:700;color:#1a1a1a;margin:0 0 2px;}
				.vetter-reviews .vr-card .vr-mall{font-size:13px;color:#666;margin:0 0 12px;}
				.vetter-reviews .vr-card .vr-rating{display:flex;align-items:baseline;gap:8px;margin-bottom:12px;}
				.vetter-reviews .vr-card .vr-rating .vr-num{font-size:22px;font-weight:700;color:#1a1a1a;}
				.vetter-reviews .vr-card .vr-link{margin-top:auto;font-size:14px;font-weight:600;color:#1a73e8;text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
				.vetter-reviews .vr-card .vr-link:hover{text-decoration:underline;}
				@media(max-width:900px){.vetter-reviews .vr-grid{grid-template-columns:repeat(2,1fr);}}
				@media(max-width:600px){.vetter-reviews .vr-grid{grid-template-columns:1fr;}.vetter-reviews .vr-summary-card{flex:1 1 100%;}}
				/* ===== end sectiune recenzii ===== */

/* Cos: ascunde butoanele flotante de accesibilitate si WhatsApp, ca sa nu
   acopere zona de finalizare comanda. Pagina de cos are clasa .site-cart pe
   <html>, deci regula nu afecteaza restul site-ului. */
html.site-cart .accessibility-button,
html.site-cart div.floating-wpp {
  display: none !important;
}

/* Header sticky desktop: la scroll ramane bara cu logo, cautare si cos,
   iar meniul principal se ascunde. Comportamentul pe mobil ramane neschimbat. */
@media (min-width: 992px) {
  .header--sticky .header__wrapper {
    max-height: 6rem !important;
    min-height: 4.5rem !important;
    overflow: visible !important;
  }
  .header--sticky .header__menu-wrapper {
    max-height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: all .2s ease-in-out;
  }
}


/* ==========================================================================
   VETTER HOMEPAGE HEADERE + FAMILIA BETTER PROTECTION  (2026-08-18)
   Perechea Twig: snippets/widgets/products_slider.html.twig (vt_headers)
                 snippets/widgets/content.html.twig (vt_care)
   Revert: sterge blocul de mai jos + cele doua modificari din Twig.
   ========================================================================== */
.vbh{--vb-blue:#0077C8;--vb-ink:#212529;--vb-mut:#5A6068;
     display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
     width:100%;flex:1 1 100%;max-width:1600px;margin-left:auto;margin-right:auto;padding:28px 0 18px;border-top:1px solid #E7E9EC;margin-top:8px}
.widget-header:has(.vbh),.widget-header:has(.vbp-h){display:block}
.vbh__kicker{margin:0 0 6px;font-family:Bonnie,sans-serif;font-size:12px;font-weight:700;
     letter-spacing:.14em;text-transform:uppercase;color:var(--vb-mut)}
.vbh__title{margin:0;font-family:Bonnie,sans-serif;font-size:40px;line-height:1.1;
     font-weight:700;letter-spacing:-.01em;color:var(--vb-ink)}
.vbh__title b{color:var(--vb-blue);font-weight:700}
.vbh__title span{font-weight:400;color:var(--vb-mut);font-size:.62em;letter-spacing:0}
.vbh__text{margin:8px 0 0;font-size:15px;line-height:1.5;color:var(--vb-mut);max-width:62ch}
.vbh__cta{flex:0 0 auto;font-size:14px;font-weight:700;color:var(--vb-blue);
     text-decoration:none;white-space:nowrap;padding-bottom:6px}
.vbh__cta::after{content:" \2192";display:inline-block;transition:transform .2s}
.vbh__cta:hover::after{transform:translateX(3px)}

/* --- familia Better Protection: titlu o singura data, deasupra benzii Extra Care --- */
#widget-1008205 .widget-header{padding-top:44px}
.vbp-h{margin:0 0 20px}
.vbp-h__title{margin:0;font-family:Bonnie,sans-serif;font-size:44px;line-height:1.05;
     font-weight:700;letter-spacing:-.02em;color:#212529}
.vbp-h__title b{color:#0077C8}
.vbp-h__text{margin:10px 0 0;font-size:15.5px;line-height:1.5;color:#5A6068;max-width:60ch}

/* --- banda Extra Care (structura-agnostica: merge si cu, si fara <section>) --- */
#widget-1008205 .widget-content__content{background:#F2F7FC;border-radius:16px;
     padding:20px 24px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
#widget-1008205 .widget-content__content section{display:contents}
#widget-1008205 .widget-content__content h2{display:none}
#widget-1008205 .widget-content__content p{flex:1 1 300px;margin:0 !important;
     font-size:14.5px;line-height:1.5;color:#41474E}
#widget-1008205 .widget-content__content p:has(a){flex:0 0 auto}
#widget-1008205 .widget-content__content p b,
#widget-1008205 .widget-content__content p strong{color:#212529}
#widget-1008205 .widget-content__content small{display:block;margin-top:3px;
     font-size:12.5px;line-height:1.45;color:#6B7178}
#widget-1008205 .widget-content__content a{flex:0 0 auto;margin:0 !important;
     display:inline-block;background:#DCEAF7;color:#0077C8;font-weight:700;font-size:14px;
     text-decoration:none;padding:13px 22px;border-radius:26px;white-space:nowrap;
     transition:background .2s}
#widget-1008205 .widget-content__content a:hover{background:#CBE0F4}
.vbp-lock{flex:0 0 auto;font-family:Bonnie,sans-serif;font-size:22px;line-height:1;
     font-weight:700;letter-spacing:-.01em;color:#212529;margin:0}
.vbp-lock b{color:#0077C8;font-weight:700}

/* --- sub-headerele familiei: fara linie, discrete --- */
.vbh--sub{border-top:0;padding:2px 0 16px;margin-top:0;align-items:baseline}
.vbh--sub .vbh__title{font-size:22px;letter-spacing:0}
.vbh--sub .vbh__title span{font-size:.8em}
.vbh--sub .vbh__text{font-size:14px;margin-top:4px}
.vbh--sub .vbh__cta{font-size:13.5px}
#widget-1007337{padding-bottom:28px}

@media (max-width:900px){
  .vbh{flex-direction:column;align-items:flex-start;gap:10px;padding:22px 0 14px}
  .vbh__title{font-size:26px}
  .vbh__title span{display:block;font-size:.7em;margin-top:4px}
  .vbp-h__title{font-size:29px}
  .vbh--sub .vbh__title{font-size:19px}
  #widget-1008205 .widget-header{padding-top:32px}
  #widget-1008205 .widget-content__content{padding:18px 16px;gap:14px}
  .vbp-lock{font-size:20px}
}

/* Hero v2.6 - social proof in coloana dreapta, sub banner.
   Se activeaza doar dupa ce .vh__trust e mutat in afara lui .vh__finder,
   ca al treilea copil direct al lui .vh__inner (widget VETTER HERO - MARKUP).
   Pana atunci regulile de plasare sunt inerte. */
@media (min-width:901px){
  .vh__inner:has(> .vh__trust){grid-template-rows:auto 1fr}
  .vh__inner:has(> .vh__trust) > .vh__finder{grid-area:1/1/3/2}
  .vh__inner:has(> .vh__trust) > .vh__visual{grid-area:1/2/2/3}
  .vh__inner > .vh__trust{grid-area:2/2/3/3;margin-top:0}
  .vh__inner > .vh__trust::after{content:"";flex:0 0 100%;height:0;order:2}
  .vh__inner > .vh__trust .vh__stores{order:3}
}

/* ============================================================
   CARD PRODUS 2026 - v3.0 SIGILAT (validat pe DOM real + preview live)
   INLOCUIESTE COMPLET blocul dintre marcajele START si END
   din assets/css/vetter_stilizari.css.

   FATA DE v1 (publicata acum):
   - revenire la blocul compact de pret (buton mic cu iconita si "+"),
     bara lata "ADAUGA IN COS" scoasa
   - pretul si butonul sunt ancorate la baza cardului -> preturile
     se aliniaza pe tot randul, indiferent de cate randuri are titlul,
     de existenta ratingului sau a optiunilor de culoare
   - ordinea: titlu > rating > stoc > optiuni > pret+buton > incredere
   - stoc si optiuni ca doua chip-uri distincte
   - rand de incredere compact pe o linie: "Livrare in 24H · Garantie
     24 luni" (Retur scos la cererea clientului, spatiul redus)
   - badge NOU pastila plina albastra, badge reducere pastila neagra
   - focus vizibil la tastatura, actiuni pe imagine fara click fantoma

   FATA DE v2 propusa initial - corectii:
   1. .product__line-options (optiunile de culoare) nu primea order
      si sarea DEASUPRA titlului. Acum toti copiii au order de baza.
   2. randul de rating primea display:flex pe wrapperul gresit, deci
      stelele si contorul ramaneau pe randuri diferite.
   3. min-height:47px pe randul de pret era sub inaltimea reala (58px),
      deci preturile ramaneau nealiniate. Alinierea se face acum prin
      ancorare la baza, nu prin inaltimi fixe.
   4. randul de incredere la 10px se rupea oricum in 2 randuri, cu
      "luni" orfan. Acum 11px, cu spatii insecabile intre segmente.
   5. escape-urile CSS \00b7 si \00a0 inghiteau caracterul urmator.


      VERIFICAT LIVE (preview injectat in site, homepage + /iphone-16-pro-2):
   - butonul compact revine de la sine dupa stergerea blocului v1
     (stilurile temei .product--slider/.product--grid .product__actions>.btn raman)
   - marcaj stoc epuizat confirmat: grid-image__badge--out-of-stock;
     regulile de culoare pe chip-ul de disponibilitate sunt ACTIVE
   - badge-urile necunoscute (--GP) si elementele extra (MagSafe/Qi2,
     product__data--badges) se aseaza corect cu order-ul de baza

   Sigilat cu clientul (preview live aprobat):
   - reducerea ca avantaj: pret promotional rosu #E0332B (comutator
     pentru albastrul de brand, comentat alaturi), pret vechi introdus
     cu "in loc de", chip "Economisesti X RON" / "-X%" (regula lui 100,
     creat de assets/js/vetter-economisesti.js)
   - varianta B de incredere: banda unica .vet-trust-strip sus,
     randul per card ascuns DOAR sub html.vet-js (fallback fara JS)
   - sloturi uniforme: rating/stoc/pret cu inaltimi rezervate,
     carduri egale indiferent de informatiile disponibile

   REVERT COMPLET: sterge tot intre START si END.
   ============================================================ */

/* ===== CARD 2026 START ===== */

/* ---------- 1. Cardul ---------- */
.product{
  height:100%;
  background:#fff;
  border:1px solid #E6E9EC;
  border-radius:10px;
  overflow:hidden;
  transition:box-shadow .22s ease, border-color .22s ease, transform .22s ease;
}
.product:hover{
  border-color:#CCE1F4;
  box-shadow:0 2px 4px rgba(0,0,0,.03), 0 16px 36px -20px rgba(0,0,0,.35);
  transform:translateY(-2px);
}
.product .slider-image,
.product .grid-image{ background:#F8FAFA; border-radius:8px; overflow:hidden; }

/* ---------- 2. Badge-uri ---------- */
.product .slider-image__badges--left,
.product .grid-image__badges--left{ top:12px; left:12px; }
.product .slider-image__badges--right,
.product .grid-image__badges--right{ top:12px; right:12px; }
.product .slider-image__badges,
.product .grid-image__badges{
  display:flex; flex-direction:column; align-items:flex-start; gap:6px;
}
.product .slider-image__badges--right,
.product .grid-image__badges--right{ align-items:flex-end; }

.product .slider-image__badge--price-discount,
.product .grid-image__badge--price-discount{
  background:#000; color:#fff;
  padding:5px 9px; border-radius:4px;
  font-size:11px; font-weight:700; line-height:1; letter-spacing:.02em;
  white-space:nowrap;
}
.product .slider-image__badge--new,
.product .grid-image__badge--new{
  background:#0077C8; color:#fff; border:0;
  padding:5px 9px; border-radius:4px;
  font-size:11px; font-weight:700; line-height:1; letter-spacing:.02em;
  box-shadow:0 1px 3px rgba(0,0,0,.18);
}

/* ---------- 3. Ritm vertical + ordinea informatiei ---------- */
.product .product__data{
  display:flex; flex-direction:column;
  flex:1 1 auto;
  gap:8px;
  padding-bottom:6px;
}
.product .product__data > *{ order:5; margin-top:0; margin-bottom:0; }
.product .product__data > a.product__name{ order:1; }
.product .product__data > div:has(.product__rating){ order:2; min-height:18px; }
.product .product__data > .product__stock{ order:3; }
.product .product__data > .product__line-options{ order:4; }
.product .product__data > div:has(> .product__actions){ order:6; margin-top:auto; }
.product .product__data > .product__attributes{ order:7; }

/* ---------- 4. Titlu: exact 2 randuri, cu taiere eleganta ---------- */
.product .product__name{
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:17px; line-height:1.32; font-weight:700;
  min-height:45px; max-height:68px;
}

/* ---------- 5. Rating ---------- */
.product .product__data > div > div:has(> .product__rating){
  display:flex; align-items:center; gap:6px;
  min-height:18px;
  font-size:12px; color:#666;
}
.product .product__rating:not(:empty){
  font-size:14px; line-height:1; letter-spacing:0; color:#DADEE1;
  display:inline-flex; align-items:center;
}
/* contorul de recenzii (parantezele le scoate vetter-economisesti.js) */
.product .product__rating + div{ line-height:1; position:relative; top:.5px; }
.product .product__rating .product__rating-fill{ color:#F2C230; }
/* Alternativa neagra, mai buna la contrast (#1A1A1A ~ 16:1 fata de 1,9:1):
   .product .product__rating .product__rating-fill{ color:#1A1A1A; } */

/* ---------- 6. Stoc si optiuni: chip-uri, nu text ---------- */
.product .product__stock{
  display:flex; flex-wrap:wrap; gap:6px;
  font-size:0; min-height:23px;
}
.product .product__stock > span{
  background:#F1F4F6; color:#4A5257;
  padding:4px 9px; border-radius:4px;
  font-size:11px; font-weight:600; line-height:1.3;
}
/* chip-ul de optiuni: secundar, ca sa nu concureze cu disponibilitatea */
.product .product__stock > span:not(:first-child){
  background:transparent; border:1px solid #E3E7EA; color:#6B7278; font-weight:500;
}
/* disponibilitate pe culoare - marcaj CONFIRMAT pe categorie:
   grid-image__badge--out-of-stock; produsele epuizate nu au chip "In Stoc". */
.product:not(:has([class*="badge--out-of-stock"])) .product__stock > span:first-child{
  background:#EAF9EF; color:#1E6B3A;
}
.product:has([class*="badge--out-of-stock"]) .product__stock > span:first-child{
  background:transparent; border:1px solid #E3E7EA; color:#6B7278; font-weight:500;
}

/* Optiunile de culoare: la stanga, aliniate cu chip-urile.
   Tema seteaza flex-direction:column si centreaza - se suprascrie explicit. */
.product .product__line-options{
  display:flex; flex-direction:row; flex-wrap:wrap; gap:6px;
  align-items:center; justify-content:flex-start;
}
.product .product__line-options .product__line-option{ margin:0; }

/* chip "Economisesti X RON" - element creat de vetter-economisesti.js
   (CSS-ul nu poate calcula diferenta de pret) */
.product .vet-eco{
  display:inline-block; background:#ADFFC7; color:#0B4223;
  font-size:11px; font-weight:700; line-height:1;
  padding:4px 8px; border-radius:4px; margin-top:4px; white-space:nowrap;
}

/* ---------- 7. Pret si buton: blocul compact, ancorat la baza cardului ---------- */
.product .product__data > div:has(> .product__actions){
  align-items:flex-end;
  justify-content:space-between;
}
.product .product__info--price-row{
  align-items:flex-start;
  justify-content:flex-end;
}
/* reducerea sta DEASUPRA pretului: ancora si beneficiul intai; linia
   pret+cos ramane ancorata jos, identica pe toate cardurile, fara
   inaltime rezervata cand nu exista reducere */
.product .product__info--price-row > .product__info--old-price-gross{ order:1; }
.product .product__info--price-row > .vet-eco{ order:2; margin:0 0 5px; }
.product .product__info--price-row > .product__info--price-gross{ order:3; }
.product .product__actions{ align-self:flex-end; flex:none; }
/* reducerea ca avantaj: pretul promotional in albastrul de brand,
   pretul vechi introdus cu "in loc de", taiat doar pe cifre */
/* pretul promotional: alege O SINGURA varianta de accent.
   Activ: rosu cald (salienta comerciala mai mare, de validat cu date).
   Alternativa on-brand: albastrul #0077C8 - comuta comentariul. */
.product .product__info--price-row:has(.product__info--old-price-gross) .product__info--price-gross{ color:#E0332B; }
/* .product .product__info--price-row:has(.product__info--old-price-gross) .product__info--price-gross{ color:#0077C8; } */
.product .product__info--old-price-gross{ text-decoration:none; }
.product .product__info--old-price-gross::before{ content:"in loc de "; color:#8A9096; }
.product .product__info--old-price-gross > span{ text-decoration:line-through; }

.product .product__info--price-gross,
.product .product__info--old-price-gross,
.product .product__info--price-gross > span,
.product .product__info--old-price-gross > span{ white-space:nowrap; }

/* ---------- 8. Randul de incredere ---------- */
.product .product__attributes{
  display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:5px;
  justify-content:flex-start; text-align:left;
  padding:0; border:0; margin:0;
  font-size:11px; line-height:1.3; color:#5A6166;
}
.product .product__attributes::before{
  content:"";
  width:13px; height:13px; flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230077C8' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 2.8 20.6 7v10L12 21.2 3.4 17V7L12 2.8Z'/%3E%3Cpath d='M3.4 7 12 11.2 20.6 7'/%3E%3Cpath d='M12 11.2v10'/%3E%3C/svg%3E") center / 13px 13px no-repeat;
}
.product .product__attributes::after{
  flex:none; white-space:nowrap;
  content:"Livrare\0000a0in\0000a024H\0000a0\0000b7  Garantie\0000a024\0000a0luni";
}

/* ---------- Banda unica de incredere (VARIANTA B - ACTIVA) ----------
   O singura banda deasupra primei sectiuni de produse, inserata de
   vetter-economisesti.js, care pune si clasa vet-js pe <html>
   (acelasi tipar ca vt-fab-js). Fara JS, clasa lipseste si randul
   de incredere per card ramane vizibil - degradare eleganta. */
html.vet-js .product .product__attributes{ display:none; }
.vet-trust-strip{
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:#EAF3FB; color:#2A3A42;
  font-size:13px; font-weight:600; line-height:1;
  padding:11px 16px; border-radius:8px; margin:0 0 18px;
}
.vet-trust-strip svg{ flex:none; }
@media (max-width:560px){
  .vet-trust-strip{ font-size:11px; padding:9px 10px; gap:6px; }
}

/* ---------- 9. Focus vizibil ---------- */
.product .product__name:focus-visible,
.product .product__add-to-cart:focus-visible,
.product .slider-image__link:focus-visible,
.product .grid-image__link:focus-visible{
  outline:2px solid #0077C8; outline-offset:2px; border-radius:4px;
}

/* ---------- 10. Actiunile de pe imagine ---------- */
@media (hover:hover) and (min-width:901px){
  .product .slider-image__quick-view,
  .product .slider-image__save-wishlist,
  .product .grid-image__quick-view,
  .product .grid-image__save-wishlist{
    opacity:0; pointer-events:none; transition:opacity .2s ease;
  }
  .product:hover .slider-image__quick-view,
  .product:hover .slider-image__save-wishlist,
  .product:hover .grid-image__quick-view,
  .product:hover .grid-image__save-wishlist,
  .product:focus-within .slider-image__quick-view,
  .product:focus-within .slider-image__save-wishlist,
  .product:focus-within .grid-image__quick-view,
  .product:focus-within .grid-image__save-wishlist{
    opacity:1; pointer-events:auto;
  }
}

/* ---------- 11. Mobil ---------- */
@media (max-width:560px){
  .product{ border-radius:8px; padding:10px; }
  .product .product__data{ gap:7px; padding-left:2px; padding-right:2px; padding-bottom:8px; }
  .product .product__name{ font-size:15px; min-height:40px; max-height:60px; }
  .product .product__stock > span{ font-size:10px; padding:3px 7px; }
  .product .product__rating{ font-size:12.5px; }
  .product .product__info--price-gross{ font-size:17px; }
  .product .product__info--old-price-gross{ font-size:11.5px; }
  .product .product__data > div:has(> .product__actions){ gap:6px; }
  .product .product__attributes{ font-size:10px; gap:4px; }
  .product .vet-eco{ font-size:10px; padding:3px 6px; }
  .product .product__attributes::before{ width:11px; height:11px; background-size:11px 11px; }
  .product .slider-image__badges--left,
  .product .grid-image__badges--left{ top:8px; left:8px; }
  .product .slider-image__badges--right,
  .product .grid-image__badges--right{ top:8px; right:8px; }
  .product .slider-image__quick-view,
  .product .slider-image__save-wishlist,
  .product .grid-image__quick-view,
  .product .grid-image__save-wishlist{ opacity:1; }
}

@media (prefers-reduced-motion:reduce){
  .product{ transition:none; }
  .product:hover{ transform:none; }
}
/* ===== CARD 2026 END ===== */

/* ============================================================
   PDP 2026 - pagina de produs (audit 22.08.2026)
   Reguli legate de clasa .site-buy (pusa de tema pe <html> doar
   pe paginile de produs) sau de clase care exista doar acolo.
   REVERT: sterge tot intre PDP 2026 START si PDP 2026 END.
   ============================================================ */
/* ===== PDP 2026 START ===== */

/* header pe PDP: bara neagra pica (informatia ei e langa CTA),
   meniul devine un singur rand zvelt */
html.site-buy .notification-bar{ display:none !important; }
@media (min-width:901px){
  html.site-buy .header__menu-wrapper{ height:auto !important; padding:0 !important; border-bottom:1px solid #EDF0F2; }
  html.site-buy .header__menu-list{ display:flex !important; align-items:center; justify-content:space-between; width:100%; margin:0; padding:0; }
  html.site-buy .header__menu-item{ margin:0 !important; }
  html.site-buy .header__menu-item > a{ display:flex !important; flex-direction:row !important; align-items:center !important; gap:9px; padding:12px 10px !important; font-size:15px !important; line-height:1 !important; white-space:nowrap; }
  html.site-buy .header__menu-item > a span{ display:inline-flex !important; align-items:center; margin:0 !important; }
  html.site-buy .header__menu img, html.site-buy .header__menu svg{ width:22px !important; height:22px !important; display:block; }
  html.site-buy .header__wrapper{ padding-top:8px !important; padding-bottom:8px !important; }
}
/* mobil: pretul si titlul putin mai mici pe PDP */
@media (max-width:560px){
  .product-summary__info--price-gross{ font-size:30px !important; }
  .product-summary__heading{ font-size:20px !important; }
}

/* FIX responsive: galeria cedeaza spatiu, railul de cumparare
   are latime garantata (inainte, sub ~1400px butonul de cumparare
   iesea in afara ecranului) */
@media (min-width:901px){
  .product-summary__images{ flex:1 1 55% !important; min-width:0 !important; max-width:58% !important; overflow:hidden; }
  .product-summary__images img{ max-width:100%; height:auto; }
  .product-summary__details{ flex:1 1 42% !important; min-width:300px !important; max-width:44% !important; }
}

/* primul ecran: titlu compact, pret mare dar nu urias,
   fara dublura de disponibilitate */
.product-summary__heading{ font-size:24px !important; line-height:1.2 !important; }
.product-summary__heading h1{ font-size:inherit !important; line-height:inherit !important; }
.product-summary__info--price-gross{ font-size:38px !important; line-height:1.15 !important; }
/* aceeasi conventie ca pe carduri: pretul redus in culoarea calda,
   pretul vechi gri, taiat */
.product-summary__info--price-row:has(.product-summary__info--old-price-gross) .product-summary__info--price-gross{ color:#E0332B !important; }
.product-summary__info--old-price-gross{ color:#8A9096 !important; font-size:16px !important; }
.product-summary__form .product-summary__info--availability{ display:none !important; }
/* SKU discret, in stilul Spigen: eticheta mica gri, valoarea normala */
.product-summary__info--sku{ font-size:14px !important; display:flex; flex-direction:column; gap:2px; }
.product-summary__info--sku .info-label{ font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#8A9096; }
.product-summary__info--sku .info-value{ font-size:14px; color:#4A5257; }
.product-summary__info--rating{ min-height:0 !important; height:auto !important; margin:2px 0 6px !important; cursor:pointer; }
.product-summary__info--rating:hover{ text-decoration:underline; text-decoration-color:#0077C8; }

/* stele de rating -20%; SKU si In stoc mutate sub Variante */
.product-summary__info--rating{ transform:scale(.8); transform-origin:left center; }
.product-summary__top-details-left{ display:flex !important; flex-direction:column !important; }
.product-summary__top-details-left > *{ order:3; }
.product-summary__top-details-left > .product-summary__heading{ order:1; }
.product-summary__top-details-left > .product-summary__info--rating{ order:2; }
.product-summary__top-details-left > .product-summary__info--price{ order:3 !important; }
.product-summary__top-details-left > .vet-rate{ order:4 !important; }
.product-summary__top-details-left > .product-summary__info--line-items{ order:5 !important; }
.product-summary__top-details-left > div:not([class]){ order:6 !important; margin-top:8px; }

/* variante: miniaturi compacte; pretul se vede la selectie */
/* pastila In stoc: acelasi limbaj vizual ca pe carduri */
.product-summary__info--in-stock{ background:#EAF9EF !important; color:#1E6B3A !important; border:0 !important; font-size:12px !important; font-weight:700 !important; padding:5px 11px !important; border-radius:5px !important; line-height:1.3 !important; }
/* variante: doar imagine si pret, fara chenar - simplu si clar */
.product-summary__info--line-items label{ padding:0 !important; margin:0 !important; }
.line-products__item{ width:auto !important; margin:0 !important; }
.line-products__item > a{ display:flex !important; flex-direction:column; align-items:center; gap:5px; padding:4px 6px !important; text-align:center; }
.line-products__item:not([class*="current"]):not([class*="active"]) > a{ border:0 !important; }
.line-products__item img{ max-height:72px !important; width:auto !important; }
.vet-var-name{ display:none !important; }
.line-products__item [class*="price"]{ display:block !important; font-size:12px !important; font-weight:700; color:#212529; }
.line-products__item [class*="price"] br{ display:none !important; }
.line-products__item [class*="price"] span{ font-size:11px !important; }
.line-products__item[class*="current"] [class*="price"], .line-products__item[class*="active"] [class*="price"]{ color:#0077C8; }
/* variantele stau impachetate la stanga, nu imprastiate de gridul temei */
.product-summary__info--line-items .line-products{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; justify-content:flex-start !important; }
.product-summary__info--line-items .line-products__item{ width:auto !important; margin:0 !important; }
.product-summary__info--avail{ margin:6px 0 4px !important; }
.product-summary__info--quantity, .product-summary__info--actions{ margin-top:8px !important; }

/* linia de incredere si rata PayPo (elemente create de
   vetter-economisesti.js pe PDP) */
.vet-pdp-trust{ display:flex; align-items:center; gap:7px; margin-top:12px; font-size:12.5px; line-height:1.4; color:#5A6166; }
.vet-pdp-trust svg{ flex:none; }
/* In stoc integrat in linia de incredere */
.vet-pdp-trust .product-summary__info--in-stock{ margin:0 !important; font-size:11px !important; padding:3px 8px !important; }
.vet-trust-sep{ color:#B7BEC4; }
/* tooltip pe Livrare in 24H (mesaj dinamic din vetter-economisesti.js) */
.vet-tip{ position:relative; cursor:help; border-bottom:1px dotted #0077C8; color:#0077C8; font-weight:600; }
.vet-tip::after{ content:attr(data-tip); position:absolute; left:0; bottom:calc(100% + 8px); z-index:50;
  background:#212529; color:#fff; font-size:12px; font-weight:500; line-height:1.45;
  padding:9px 12px; border-radius:7px; width:230px; white-space:normal;
  opacity:0; pointer-events:none; transform:translateY(4px); transition:opacity .15s ease, transform .15s ease;
  box-shadow:0 6px 20px -6px rgba(0,0,0,.35); }
.vet-tip::before{ content:""; position:absolute; left:16px; bottom:calc(100% + 2px); z-index:51;
  border:6px solid transparent; border-top-color:#212529; opacity:0; transition:opacity .15s ease; }
.vet-tip:hover::after, .vet-tip:focus::after{ opacity:1; transform:translateY(0); }
.vet-tip:hover::before, .vet-tip:focus::before{ opacity:1; }
/* SKU sub zona de cumparare: discret */
.vet-sku-moved{ margin-top:10px; opacity:.85; }
.vet-rate{ display:block; font-size:15.5px; color:#4A5257; margin-top:4px; margin-bottom:12px; }
/* suma in verdele PayPo - nuanta accesibila pe alb (brandul #36B587 nu
   trece contrastul AA la marimea asta de text) */
.vet-rate b{ color:#1E8A63; font-weight:700; }

/* beneficii: grila 2x2 compacta, iconita pe brand langa text */
.vtr_beneficii{ display:grid !important; grid-template-columns:1fr 1fr !important; grid-auto-flow:row !important; grid-auto-rows:1fr !important; gap:8px; margin-top:14px !important; }
.vtr_beneficii > div{ display:flex !important; align-items:center; gap:10px; width:auto !important; min-width:0; max-width:none !important; flex:none !important; background:#F8FAFA; border:1px solid #EEF1F3; border-radius:8px; padding:10px 12px; text-align:left !important; margin:0 !important; }
.vtr_beneficii > div > img{ width:26px !important; height:26px !important; object-fit:contain; flex:none; margin:0 !important; filter:brightness(0) saturate(100%) invert(30%) sepia(96%) saturate(1600%) hue-rotate(185deg) brightness(95%); }
.vtr_beneficii > div > div{ font-size:12px !important; line-height:1.35 !important; color:#4A5257 !important; text-align:left !important; }
.vtr_beneficii strong{ color:#212529; }
.vtr_beneficii br{ display:none !important; }

/* verifica stoc in magazine: buton secundar, nu concureaza CTA */
.vtr_stores_stock{ display:flex !important; justify-content:flex-start !important; margin-top:12px !important; }
.vtr_stores_stock .btn{ background:transparent !important; color:#0077C8 !important; border:1px solid #CCE1F4 !important; border-radius:6px !important; font-size:13px !important; box-shadow:none !important; }
.vtr_stores_stock .btn:hover{ background:#EAF3FB !important; }

/* navigarea de sectiuni: un singur rand */
#product_content_tabs{ display:flex !important; flex-wrap:nowrap !important; align-items:center; gap:4px; overflow-x:auto; border-bottom:1px solid #E6E9EC; margin:6px 0 18px; }
#product_content_tabs ul{ display:flex !important; flex-wrap:nowrap !important; gap:4px; margin:0; padding:0; list-style:none; width:auto !important; }
#product_content_tabs li{ margin:0 !important; flex:none; }
#product_content_tabs a{ display:block; padding:10px 14px !important; font-size:16px !important; line-height:1.2 !important; white-space:nowrap; color:#5A6166; border-bottom:2px solid transparent; margin:0 !important; }
#product_content_tabs a:hover{ color:#0077C8; }

/* complementare (Aqurate): carduri mai mici; un singur sistem de
   recomandari jos - "Vizualizate recent" e ascuns pe PDP de JS */
.products--complementary .product{ padding:8px !important; }
.products--complementary img{ max-height:72px; width:auto; }
.vet-hide-recent{ display:none !important; }

/* cardurile din caruselele PDP: fara rupere in mijlocul cuvantului,
   tipografie si dimensiuni care incap in cardul ingust de carusel */
.product .product__name{ overflow-wrap:break-word !important; word-break:normal !important; hyphens:none !important; }
html.site-buy .product-content__block .product,
html.site-buy .products--complementary .product{ padding:8px !important; }
html.site-buy .product-content__block .product .product__data,
html.site-buy .products--complementary .product .product__data{ gap:6px !important; padding-left:4px !important; padding-right:4px !important; }
html.site-buy .product-content__block .product .product__name,
html.site-buy .products--complementary .product .product__name{
  font-size:14px !important; line-height:1.35 !important;
  -webkit-line-clamp:3 !important; min-height:38px !important; max-height:57px !important; }
html.site-buy .product-content__block .product .product__info--price-gross,
html.site-buy .products--complementary .product .product__info--price-gross{ font-size:15px !important; line-height:1.2 !important; }
html.site-buy .product-content__block .product .product__stock{ min-height:0 !important; }
html.site-buy .product-content__block .product .product__data > div:has(> .product__actions),
html.site-buy .products--complementary .product .product__data > div:has(> .product__actions){ width:100% !important; }
html.site-buy .product-content__block .product .product__add-to-cart > span:last-child,
html.site-buy .products--complementary .product .product__add-to-cart > span:last-child{
  width:34px !important; height:34px !important; min-width:34px !important; }
html.site-buy .product-content__block .product .product__add-to-cart > span:last-child svg{ width:18px !important; height:18px !important; }
html.site-buy .product-content__block .product .product__add-to-cart > span:first-child{ font-size:11px !important; }

/* banda globala de incredere nu apare pe PDP (railul are linia proprie) */
html.site-buy .vet-trust-strip{ display:none !important; }

/* beneficiile cu link (retur, magazine) primesc afordanta de click -
   linkul e atasat de vetter-economisesti.js */
.vtr_beneficii > div[data-vet-link]{ cursor:pointer; }
.vtr_beneficii > div[data-vet-link]:hover{ border-color:#0077C8; }
/* ===== PDP 2026 END ===== */

/* cache-bump 22.08 */

/* bump v2 22.08 18:xx */


/* ===== MARTURII CLIENTI - Vetter 2026 ===== */
.widget-testimonials{ padding:24px 20px 14px; margin-top:26px; margin-bottom:26px; }
.widget-testimonials .widget-header{ margin-bottom:2px; }
.widget-testimonials .testimonial{ border-color:#CCE1F4; transition:border-color .18s ease, box-shadow .18s ease; }
.widget-testimonials .testimonial:hover{ border-color:#7CB7E4; box-shadow:0 2px 10px rgba(0,119,200,.10); }
.widget-testimonials .testimonial__acronym{ background:#0077C8; color:#FFFFFF; font-weight:600; }
.widget-testimonials .reviews-stars-fill{ color:#0077C8; }
.widget-testimonials .testimonial__info-group{ color:#666666; }
.vt-tst-hint{ color:#0077C8; font-weight:500; }
/* ===== MARTURII CLIENTI END ===== */

/* ===== OMNIBUS DISCLOSURE PDP ===== */
.vtr-review-disclosure{font-family:Roboto,Arial,Helvetica,sans-serif;font-size:13px;line-height:1.55;color:#666666;margin:-2px 0 20px;max-width:760px;padding-left:12px;border-left:3px solid #CCE1F4;}
