/* ===================== v7: practic pe telefon, raioane la un gest distanță ===================== */
::view-transition-old(root),::view-transition-new(root){animation-duration:.22s}

/* mega-meniu (desktop) */
.mega{position:fixed;z-index:39;top:70px;left:0;right:0;background:var(--bg2);border-bottom:1px solid var(--line2);box-shadow:0 40px 80px rgb(0 0 0 / .35);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s,transform .25s var(--ease),visibility .2s}
.mega.on{opacity:1;visibility:visible;transform:none}
.mega-in{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:26px 22px;padding:26px var(--gut) 30px;max-height:min(78vh,720px);overflow:auto}
.mg-col{display:flex;flex-direction:column;gap:2px;min-width:0}
.mg-col button{text-align:left;font:500 14px/1.3 var(--body);color:var(--mute);padding:5px 0;display:flex;justify-content:space-between;gap:10px}
.mg-col button:hover{color:var(--ink)}
.mg-col button i{font:500 11px var(--mono);font-style:normal;color:var(--dim)}
.mg-col .mg-h{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:center;padding:0 0 10px;margin-bottom:6px;border-bottom:1px solid var(--line);color:var(--ink)}
.mg-h .pl{width:48px;height:48px;background:var(--paper)}
.mg-h b{font:600 16px/1.2 var(--body);display:block}
.mg-h small{font:500 11px var(--mono);color:var(--lime-ink)}
.mg-col .mg-all{color:var(--lime-ink);font-size:13px}
.nav .mega-btn[aria-expanded=true]{color:var(--ink)}
.nav-cats{display:none}

/* cantitatea direct pe card */
.cqw{display:contents}
.cq{display:inline-flex;align-items:center;border:1.5px solid var(--lime-ink);background:rgb(var(--lime-rgb) / .1);height:40px}
.cq button{width:34px;height:100%;display:grid;place-items:center;color:var(--lime-ink)}
.cq button svg{width:16px;height:16px}
.cq b{min-width:26px;text-align:center;font:700 15px var(--mono)}
.flyer{position:fixed;z-index:130;object-fit:contain;background:var(--paper);pointer-events:none;border:1px solid var(--line2)}

/* toast cu acțiune */
.toast{display:flex;align-items:center;gap:14px}
.toast.on{pointer-events:auto}
.toast button{flex:none;font:700 14px var(--body);color:inherit;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}

/* fișa produsului */
.sh-incart{font:500 13px var(--mono);color:var(--lime-ink);margin-top:-6px}
.sh-incart:empty{display:none}

/* grilă sau listă */
.cv-view{width:48px;height:48px;border:1.5px solid var(--line2);background:var(--bg2);display:grid;place-items:center;flex:none}
.cv-view svg{width:20px;height:20px}
.cv-view [data-ic-grid],.cv-view.on [data-ic-list]{display:none}
.cv-view.on [data-ic-grid]{display:block}
.cv-view:hover{border-color:var(--ink)}
.prods.list{grid-template-columns:1fr;gap:8px}
.prods.list .pc{display:grid;grid-template-columns:120px 1fr;animation:none}
.prods.list .pc>button[data-open]{display:block}
.prods.list .pc .pl{aspect-ratio:auto;height:100%;min-height:120px}
.prods.list .pc-b{padding:12px 54px 12px 14px;gap:4px}
.prods.list .pc-b b{-webkit-line-clamp:2}
.prods.list .pc-f{padding-top:4px}
.prods.list .disc-tag{left:6px;top:6px}

/* văzute recent */
.recent{padding-top:34px;padding-bottom:0}
.recent[hidden]{display:none}
.rc-h{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:14px}
.rc-h h2{font-size:clamp(30px,3vw,44px)}
.rc-row{display:flex;gap:10px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x mandatory}
.rc{flex:0 0 158px;border:1px solid var(--line);background:var(--bg2);text-align:left;scroll-snap-align:start;display:flex;flex-direction:column;transition:border-color .2s}
.rc:hover{border-color:var(--lime-ink)}
.rc .pl{aspect-ratio:1}
.rc span{padding:8px 10px 10px;display:grid;gap:4px}
.rc b{font:500 13px/1.3 var(--body);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rc small{font:700 13px var(--mono);color:var(--lime-ink)}

/* căutarea mare, înainte să scrii */
.seek-empty h5{font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:26px 0 10px}
.seek-res.on~.seek-empty{display:none}
.seek-empty .chips-q{margin:0}
.se-cats{display:flex;flex-wrap:wrap;gap:8px}
.se-cats button{font:600 14px var(--body);padding:10px 14px;border:1px solid var(--line2)}
.se-cats button:hover{border-color:var(--lime-ink)}

/* filtre: ordinea și prețul (în foaia de pe telefon) */
.f-top h5{font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:6px 0 10px}
.f-sort{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.f-sort button{font:600 14px var(--body);padding:10px 12px;border:1.5px solid var(--line2)}
.f-sort button.on{border-color:var(--lime-ink);color:var(--lime-ink);background:rgb(var(--lime-rgb) / .08)}
.f-price{display:flex;gap:8px;align-items:center;margin-bottom:22px;color:var(--mute)}
.f-price input{flex:1;min-width:0;border:1.5px solid var(--line2);background:var(--bg);padding:12px;font:500 15px var(--mono)}
.f-btn{gap:8px;align-items:center}
.f-btn svg{width:18px;height:18px}

.calc-teaser{display:none}

@media (max-width:900px){
  /* meniul de pe telefon: raioanele întâi */
  .nav.open{max-height:calc(100vh - 70px);overflow:auto;padding-bottom:20px;box-shadow:0 30px 60px rgb(0 0 0 / .4)}
  .nav .mega-btn{display:none}
  .nav.open .nav-cats{display:block}
  .nav-cats h5{font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:14px 0 4px}
  .nav-cats details{border-bottom:1px solid var(--line)}
  .nav-cats summary,.nav.open .nav-cats .nc-all{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:14px 0;font:600 18px var(--body);color:var(--ink);border-bottom:1px solid var(--line);width:100%}
  .nav-cats details summary{border:0}
  .nav-cats summary::-webkit-details-marker{display:none}
  .nav-cats summary::after{content:"+";font:400 24px var(--body);color:var(--lime-ink);margin-left:12px;transition:transform .25s}
  .nav-cats details[open] summary::after{transform:rotate(45deg)}
  .nav-cats i{font:500 12px var(--mono);font-style:normal;color:var(--dim);margin-left:auto}
  .nav-cats details>div{display:grid;padding:0 0 12px 12px;border-left:2px solid var(--lime-ink);margin:0 0 12px 2px}
  .nav.open .nav-cats details button{display:flex;justify-content:space-between;gap:12px;padding:10px 0;font-size:16px;border:0;color:var(--mute)}

  /* catalog: produsele apar din primul ecran */
  .cat-view{padding-top:14px}
  .cv-head{margin-bottom:8px}
  .cv-head h1{font-size:40px}
  .cv-head .kick{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}
  .chiprow{padding-bottom:6px;margin-bottom:2px}
  .chiprow button{padding:8px 12px;font-size:13.5px}
  .cv-bar{grid-template-columns:minmax(0,1fr) auto auto;gap:8px;margin-bottom:10px}
  .cv-bar .seek-box{grid-column:auto}
  .cv-bar .sel,.cv-bar .price-f{display:none}
  .f-btn{grid-column:auto;height:48px;padding:0 14px}
  .guide{padding:10px 10px 8px;margin-bottom:10px}
  .guide h4{font-size:14px;margin-bottom:8px;line-height:1.35}
  .g-opts{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .g-opts button{grid-template-columns:1fr;justify-items:center;text-align:center;padding:8px 4px;gap:2px}
  .g-opts svg{width:30px;height:28px;grid-row:auto}
  .g-opts b{font-size:13.5px}
  .g-opts small{display:none}
  .count{margin-bottom:10px}
  .cq{height:36px}
  .cq button{width:30px}
  .cq b{min-width:22px;font-size:14px}
  .prods.list .pc{grid-template-columns:92px 1fr}
  .prods.list .pc .pl{min-height:104px}
  .prods.list .pc-b{padding:10px 44px 10px 12px}

  /* fișa: imaginea mai mică, prețul și coșul la vedere; o tragi în jos ca s-o închizi */
  .sh-gal .pl{flex:none;height:min(32vh,280px);min-height:0}
  .sh-gal::before{content:"";position:absolute;top:8px;left:50%;width:44px;height:5px;border-radius:3px;background:rgb(0 0 0 / .28);transform:translateX(-50%);z-index:3}
  .sh-info{gap:14px}
  .sh-info h3{font-size:21px}
  .sh-actions{flex-wrap:nowrap;gap:8px}
  .sh-actions .qty button{width:36px}
  .sh-actions .qty input{width:42px}
  .sh-actions .btn{white-space:nowrap;padding-inline:12px;gap:8px}
  .prods:not(.list) .pc-f:has(.cq){flex-wrap:wrap;gap:8px}
  .prods:not(.list) .pc-f .cq{width:100%;justify-content:space-between}

  /* toastul sus, ca să nu acopere butoanele de jos */
  .toast{top:12px;bottom:auto;transform:translate(-50%,-180%);width:calc(100vw - 24px);justify-content:space-between}

  /* acasă: mai scurt, la fel de complet */
  .sec{padding:56px 16px}
  .recent{padding-top:28px;padding-bottom:0}
  .rc{flex-basis:136px}
  .cat,.cat:nth-child(1),.cat:nth-child(3){min-height:0;padding:12px;gap:10px;justify-content:flex-start}
  .cat:nth-child(1){grid-column:span 2}
  .fan,.cat:nth-child(1) .fan{position:relative;right:auto;top:auto;width:100%;height:auto;display:flex;gap:4px}
  .fan .pl{position:relative;flex:1;width:auto;right:auto!important;top:auto!important;transform:none!important;box-shadow:none}
  .cat h3{font-size:22px;max-width:none}
  .cat:nth-child(1) h3{font-size:28px}
  .cat .arrow{display:none}
  #calculator:not(.open) .calc{display:none}
  #calculator:not(.open) .calc-teaser{display:grid}
  .calc-teaser{gap:16px;width:100%;text-align:left;border:1.5px solid var(--lime-ink);background:var(--bg2);padding:18px}
  .ct-steps{display:grid;grid-template-columns:28px 1fr;gap:10px 12px;align-items:center;font:500 16px var(--body);color:var(--ink)}
  .ct-steps i{width:28px;height:28px;display:grid;place-items:center;font:700 13px var(--mono);font-style:normal;background:var(--lime);color:var(--bg)}
  .calc-teaser b{display:block;text-align:center;font:600 16px var(--body);background:var(--lime);color:var(--bg);padding:15px}
  .saw{display:none}
  .serv{gap:0}
  .map,.map iframe{min-height:240px}
  .sec-head{margin-bottom:24px}
}
@media (min-width:901px){.f-top{display:none}}
@media print{.mega,.recent,.cv-view{display:none!important}}
@media (max-width:900px){.seek-box kbd{display:none}}
