/* FRONT 30.10 — menu D4 + lewe drzewo (podzial etap 1, zapis 03.11). Zrodlo: makieta
   decyzje/2026-10-30_FRONT_menu-warianty (gen_warianty.py, stan „po”: P1 P2 P4 P7 + D4 + telefon + drzewo).
   Tekst regul przeniesiony 1:1 (7 blokow <style> makiety w tej samej kolejnosci) — kontrola: wyciag_makiety.py.
   Ladowany na koncu <head> (wp_head 999), jak w makiecie. Wlacza go inc/menu-d2.php, gdy mmk_d2_wlaczone(). */
/* WARIANTY MENU 30.10 — tylko układ. Kolory/czcionki: tokeny sklepu. Kolor drugorzędny: #6B6255 */
:root{--wv-k2:#6B6255}
@media (min-width:901px){
  .mk-hdr .menu{position:relative}
  .mk-hdr .menu .in{position:static;overflow:visible}
  .wv-bar{display:flex;align-items:stretch;align-self:stretch;flex:1 1 auto;gap:4px;justify-content:space-between;min-width:0}
  .wv-bar > .mitem,.wv-it > .mitem{border:0;background-color:transparent;cursor:pointer;font-family:var(--font-nav);padding-left:6px;padding-right:6px}
  .wv-bar > .mitem{align-self:center}
  .wv-trig[aria-expanded="true"]{background-size:100% 50%}
  .wv-trig--all[aria-expanded="true"],.wv-trig--all:hover{background:var(--mameko-ivory);border-radius:999px;padding-left:12px;padding-right:12px}
  .wv-trig--all{padding-left:12px;padding-right:12px}
  /* D1: każda grupa ma swój mały panel */
  .wv-it{position:relative;display:flex;align-items:center}
  .wv-pan{position:absolute;top:100%;left:-10px;min-width:260px;background:#fff;border:1px solid var(--mameko-line);border-top:0;
    border-radius:0 0 12px 12px;box-shadow:0 18px 50px rgba(58,43,51,.18);padding:8px;display:none;z-index:61}
  .wv-it:nth-last-child(-n+2) .wv-pan{left:auto;right:-10px}
  .wv-pan.is-open{display:block}
  .wv-dz{display:flex;align-items:center;min-height:40px;padding:0 14px;border-radius:9px;font-family:var(--font-nav);font-size:15px;font-weight:600;color:var(--mameko-fig);text-decoration:none}
  .wv-dz:hover,.wv-dz:focus-visible{background:var(--mameko-ivory);color:var(--mameko-cta-dark)}
  /* D2/D3: jeden panel pod paskiem */
  .wv-pnl{position:absolute;left:30px;right:30px;top:100%;background:#fff;border:1px solid var(--mameko-line);border-top:0;border-radius:0 0 14px 14px;
    box-shadow:0 18px 50px rgba(58,43,51,.18);z-index:60;display:none;font-family:var(--font-nav)}
  .wv-pnl.is-open{display:flex}
  .wv-dz-t{color:var(--mameko-fig);font-weight:700;font-size:15px;text-decoration:none}
  .wv-dz-t:hover,.wv-typ:hover{color:var(--mameko-cta-dark)}
  .wv-typ{color:var(--wv-k2);font-size:13px;text-decoration:none}
  /* D2: szyna grup (dzisiejsza szyna, ale 7 grup) + działy z rodzajami */
  .wv-rail{flex:0 0 250px;background:var(--mameko-ivory);border-right:1px solid var(--mameko-line);padding:12px 8px;border-radius:0 0 0 14px}
  .wv-rail-b{display:flex;width:100%;align-items:center;justify-content:space-between;min-height:44px;padding:0 14px;border:0;border-radius:10px;background:transparent;
    font:600 15px/1.2 var(--font-nav);color:var(--mameko-fig);cursor:pointer;text-align:left}
  .wv-rail-b i{font-style:normal;opacity:0;color:var(--mameko-cta)}
  .wv-rail-b.is-akt{background:#fff;color:var(--mameko-cta-dark);font-weight:700;box-shadow:0 1px 0 rgba(58,43,51,.07)}
  .wv-rail-b.is-akt i{opacity:1}
  .wv-panes{flex:1 1 auto;min-width:0;padding:18px 26px 22px}
  .wv-pane{display:none}.wv-pane.is-akt{display:block}
  .wv-pane-t{font-family:var(--font-display);font-size:23px;line-height:1.1;color:var(--mameko-fig);margin:0 0 14px}
  .wv-pane-grid{column-count:3;column-gap:28px}
  .wv-kol{break-inside:avoid;margin:0 0 16px;display:flex;flex-direction:column;gap:2px}
  .wv-kol .wv-dz-t{padding:3px 0}
  .wv-kol .wv-typ{padding:2px 0;line-height:1.4}
  /* D3: mapa — wszystkie grupy i działy naraz, przy dziale 2–3 najpopularniejsze rodzaje */
  .wv-pnl--d3{display:none;grid-template-columns:repeat(7,minmax(0,1fr));gap:0 18px;padding:18px 24px 22px}
  .wv-pnl--d3.is-open{display:grid}
  .wv-col{min-width:0;padding:6px 8px 8px;border-radius:12px}
  .wv-col.is-akt{background:var(--mameko-ivory);outline:1px solid var(--mameko-line);outline-offset:-1px}
  .wv-sek{margin:4px 0 8px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--wv-k2)}
  .wv-dzb{margin:0 0 10px}
  .wv-dzb .wv-dz-t{display:block;padding:2px 0;line-height:1.3}
  .wv-typy{display:block;line-height:1.45}
  .wv-typy .wv-typ{font-size:12.5px}
  .wv-typy .wv-typ + .wv-typ::before{content:" · ";color:var(--wv-k2)}
}
@media (min-width:901px) and (max-width:1199px){
  .wv-pnl{left:16px;right:16px}
  .wv-pnl--d3{grid-template-columns:repeat(4,minmax(0,1fr))}
  .wv-rail{flex-basis:220px}
}
@media (max-width:900px){
  .wv-bar,.wv-pnl{display:none!important}
  html body .mk-mkat{background:#fff}
  .wv-acc-b{font-weight:700;font-size:17px;min-height:52px}
  .wv-acc .mk-mkat-pod{background:var(--mameko-ivory)}
  .wv-acc .mk-mkat-pod a{font-size:16px;min-height:48px}
  /* T2 */
  .wv-s1-b{display:grid;grid-template-columns:1fr auto;gap:2px 10px;width:100%;padding:12px 16px;border:0;border-bottom:1px solid var(--mameko-line);background:#fff;text-align:left;cursor:pointer;min-height:56px;font-family:var(--font-nav)}
  .wv-s1-n{grid-column:1;font-weight:700;font-size:17px;color:var(--mameko-fig)}
  .wv-opis{grid-column:1;font-size:14px;line-height:1.35;color:var(--wv-k2)}
  .wv-s1-b i{grid-column:2;grid-row:1 / span 2;align-self:center;font-style:normal;font-size:20px;color:var(--wv-k2)}
  .wv-s2[hidden],.wv-s1[hidden]{display:none}
  .wv-wstecz{display:flex;align-items:center;min-height:48px;width:100%;padding:0 16px;border:0;border-bottom:1px solid var(--mameko-line);background:var(--mameko-ivory);
    font:700 16px var(--font-nav);color:var(--mameko-green-dark);cursor:pointer;text-align:left}
  .wv-s2-t{margin:16px 16px 6px;font-family:var(--font-display);font-size:22px;color:var(--mameko-fig)}
  .wv-s2 .mk-mkat-dz i{font-style:normal}
  /* T3 */
  .wv-skok{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 16px 14px;border-bottom:1px solid var(--mameko-line)}
  .wv-chip{display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;padding:4px 10px;border:1px solid var(--mameko-line);border-radius:999px;background:#fff;
    font:700 14.5px/1.2 var(--font-nav);color:var(--mameko-fig);text-decoration:none}
  .wv-chip:last-child{grid-column:1 / -1}
  .wv-sekcja .mk-mkat-sek{margin-top:18px}
}

@media (min-width:901px){ .wv-typ--3{display:none} }
@media (min-width:901px) and (max-width:1399px){
  .wv-pnl--d3{grid-template-columns:repeat(7,minmax(0,1fr));gap:0 8px;padding:14px 12px 16px}
  .wv-col{padding:4px 6px 6px}
  .wv-pnl--d3 .wv-typy{display:none!important}
  .wv-sek{letter-spacing:.05em}
}

@media (min-width:901px){
  .wv-kol .wv-dz-t,.wv-dzb .wv-dz-t{display:flex;align-items:center;min-height:32px;padding:0}
  .wv-kol .wv-typ{display:flex;align-items:center;min-height:28px;padding:0}
  .wv-typy{display:flex;flex-wrap:wrap;column-gap:14px}
  .wv-typy .wv-typ{display:inline-flex;align-items:center;min-height:28px}
  /* 2. iteracja: w układzie flex spacja w " · " znikała (kropki przyklejone) — odstęp zamiast kropki;
     3. rodzaj ukrywany selektorem mocniejszym niż powyższy display:inline-flex */
  .wv-typy .wv-typ + .wv-typ::before{content:none}
  .wv-typy .wv-typ.wv-typ--3{display:none}
}

@media (max-width:900px){ .wv-acc-b[aria-expanded="true"]{color:var(--mameko-fig)} }

@media (min-width:901px){
  .wv-bar--d4{justify-content:space-between;gap:4px}
  .wv-bar--d4 .wv-sep{flex:0 0 1px;background:var(--mameko-line);margin:14px 0;align-self:stretch}
  .wv-bar--d4 .wv-trig--dieta{color:var(--mameko-green-dark)}
  .wv-bar--d4 .wv-it:last-child{margin-left:0}
  .wv-pnl--d4{grid-template-columns:repeat(6,minmax(0,1fr)) minmax(0,1.15fr)!important;gap:0 14px;padding:20px 24px 22px}
  .wv-pnl--d4 .wv-col--dieta{border-left:1px solid var(--mameko-line);border-radius:0;padding-left:22px;margin-left:6px}
  .wv-pnl--d4 .wv-col--dieta .wv-sek{color:var(--mameko-green-dark)}
  .wv-pnl--d4 .wv-dzb{margin:0 0 4px}
  /* 29.10 Wiktor: bez boldu, delikatniej; tło cieliste, kafelki kategorii białe */
  .wv-pnl--d4{background:var(--mameko-ivory)}
  .wv-pnl--d4 .wv-dzb{margin:0 0 8px}
  .wv-pnl--d4 .wv-dz-t{display:flex;align-items:center;min-height:40px;padding:6px 12px;background:#fff;border:1px solid var(--mameko-line);border-radius:10px;
    font-weight:400;font-size:14.5px;line-height:1.25}
  .wv-pnl--d4 .wv-dz-t:hover{border-color:var(--mameko-cta-dark);color:var(--mameko-cta-dark)}
  .wv-pnl--d4 .wv-sek{font-weight:600;letter-spacing:.1em}
  .wv-bar--d4 .wv-pan{background:var(--mameko-ivory);display:none;padding:10px}
  .wv-bar--d4 .wv-pan.is-open{display:flex;flex-direction:column;gap:6px}
  .wv-bar--d4 .wv-dz{background:#fff;border:1px solid var(--mameko-line);font-weight:400;font-size:14.5px}
  .wv-bar--d4 .wv-dz:hover{background:#fff;border-color:var(--mameko-cta-dark)}
  .wv-bar--d4 .mitem{font-weight:400}
  .wv-pnl--d4{gap:0 10px!important;padding:20px 20px 22px!important}
  .wv-pnl--d4 .wv-col{padding:4px 0}
  .wv-pnl--d4 .wv-dz-t{padding:6px 10px;font-size:14px}
  .wv-pnl--d4 .wv-col--dieta{padding-left:16px;margin-left:4px}
  /* 29.10 Wiktor: mniejsze kafelki, schludniej */
  .wv-pnl--d4 .wv-dzb{margin:0 0 5px}
  .wv-pnl--d4 .wv-dz-t{min-height:30px;padding:4px 10px;font-size:13.5px;border-radius:7px;border-color:rgba(58,43,51,.08)}
  .wv-pnl--d4 .wv-sek{margin:2px 0 8px}
  .wv-bar--d4 .wv-pan{gap:5px}
  .wv-bar--d4 .wv-dz{min-height:30px;padding:4px 10px;font-size:13.5px;border-radius:7px;border-color:rgba(58,43,51,.08)}
  /* 29.10 Wiktor: większe przerwy między kategoriami, bledsze kafelki */
  .wv-pnl--d4{gap:0 30px!important;padding:24px 32px 26px!important}
  .wv-pnl--d4 .wv-dzb{margin:0 0 10px}
  .wv-pnl--d4 .wv-dz-t{background:rgba(255,255,255,.55);border-color:rgba(58,43,51,.05)}
  .wv-pnl--d4 .wv-dz-t:hover{background:#fff}
  .wv-pnl--d4 .wv-col--dieta{padding-left:28px;margin-left:0}
  .wv-bar--d4 .wv-pan{gap:10px;padding:14px}
  .wv-bar--d4 .wv-dz{background:rgba(255,255,255,.55);border-color:rgba(58,43,51,.05)}
  .wv-bar--d4 .wv-dz:hover{background:#fff}
  /* 29.10 Wiktor: bez kafelków (napisy równo pod nagłówkiem grupy) */
  .wv-pnl--d4 .wv-dz-t{background:transparent;border:0;padding:4px 0;min-height:30px}
  .wv-pnl--d4 .wv-dz-t:hover{background:transparent;color:var(--mameko-cta-dark)}
  .wv-pnl--d4 .wv-dzb{margin:0 0 6px}
  .wv-bar--d4 .wv-dz{background:transparent;border:0;padding:4px 6px}
  .wv-bar--d4 .wv-dz:hover{background:transparent;color:var(--mameko-cta-dark)}
  /* 2 grupy pod sobą, więcej miejsca */
  .wv-pnl--d4{grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1fr)!important;gap:0 40px!important;padding:30px 48px 32px!important}
  .wv-pnl--d4 .wv-kol2{display:flex;flex-direction:column;gap:28px;min-width:0}
  .wv-pnl--d4 .wv-col{padding:0}
  .wv-pnl--d4 .wv-sek{margin:0 0 10px}
  .wv-pnl--d4 .wv-dz-t{font-size:15px;min-height:32px;padding:5px 0}
  .wv-pnl--d4 .wv-dzb{margin:0 0 2px}
  .wv-pnl--d4 .wv-col--dieta{padding-left:40px;border-left:1px solid var(--mameko-line)}
  .wv-pnl--d4 .wv-kol2 > .wv-col:first-child{min-height:196px}   /* drugi rząd grup na jednej wysokości */
  /* 29.10 Wiktor: mniejsza czcionka, bliżej siebie, delikatniej, cieplej */
  .wv-pnl--d4{padding:26px 48px 26px!important}
  .wv-pnl--d4 .wv-kol2{gap:22px}
  .wv-pnl--d4 .wv-sek{margin:0 0 6px;font-size:10px;color:#9a7f63}
  .wv-pnl--d4 .wv-col--dieta .wv-sek{color:#6f8a4e}
  .wv-pnl--d4 .wv-dz-t{font-size:13.5px;min-height:26px;padding:2px 0;color:#5c4636;font-weight:400}
  .wv-pnl--d4 .wv-dz-t:hover{color:var(--mameko-cta-dark)}
  .wv-pnl--d4 .wv-dzb{margin:0}
  .wv-pnl--d4 .wv-kol2 > .wv-col:first-child{min-height:160px}
  .wv-bar--d4 .wv-dz{font-size:13.5px;color:#5c4636;min-height:28px}
  /* 29.10 Wiktor: wyraziste nagłówki, bez nierównych „kafelków” w pasku, ładniejsza czcionka menu */
  .wv-bar--d4 .mitem{font-family:var(--font-body);font-size:14.5px;font-weight:500;color:#3A2B33;background-image:none!important;border-radius:0!important;padding-left:2px!important;padding-right:2px!important;
    transition:none}
  .wv-bar--d4 .mitem:hover,.wv-bar--d4 .mitem[aria-expanded="true"]{background:none!important;box-shadow:inset 0 -3px 0 #CC5019!important;color:#A8401A!important}
  .wv-bar--d4 .wv-trig--dieta{color:#4f7a35}
  .wv-bar--d4 .wv-trig--dieta:hover,.wv-bar--d4 .wv-trig--dieta[aria-expanded="true"]{box-shadow:inset 0 -3px 0 #4f7a35!important;color:#3f6a28!important}
  .wv-bar--d4 .mitem .car{display:none}
  .wv-bar--d4 .wv-it{align-self:stretch}
  .wv-bar--d4 .wv-it > .mitem{align-self:stretch}
  .wv-pnl--d4 .wv-sek{font-family:var(--font-display);font-size:18px;font-weight:400;letter-spacing:0;text-transform:none;color:#3A2B33;margin:0 0 8px}
  .wv-pnl--d4 .wv-col--dieta .wv-sek{color:#4f7a35}
  .wv-pnl--d4 .wv-dz-t{font-family:var(--font-body);font-size:14px;color:#5c4636}
  .wv-pnl--d4 .wv-kol2 > .wv-col:first-child{min-height:178px}
  .wv-bar--d4 .wv-pan{border-radius:0 0 12px 12px;padding:12px 18px;min-width:230px}
  .wv-bar--d4 .wv-dz{font-family:var(--font-body);font-size:14px;padding:4px 0}
  /* 29.10: Kategorie = całe menu (ikona), nagłówek w małym panelu */
  .wv-bar--d4 .wv-trig--all{font-weight:600;gap:9px}
  .wv-ham{display:inline-flex;flex-direction:column;justify-content:center;gap:3px;width:15px}
  .wv-ham i{display:block;height:1.6px;border-radius:2px;background:currentColor}
  .wv-bar--d4 .wv-pan-h{font-family:var(--font-display);font-size:17px;color:#3A2B33;margin:2px 0 6px}
  .wv-bar--d4 .wv-trig--dieta + .wv-pan .wv-pan-h{color:#4f7a35}
}

@media (max-width:900px){
  /* 29.10: telefon w stylu panelu komputera — nagłówki grup szeryfowe, ciepłe kolory, Dieta oddzielona */
  html[data-wv="D4"] #wv-mkat{box-sizing:border-box;width:100%;max-width:100vw;overflow-x:hidden}
  html[data-wv="D4"] #wv-mkat *{box-sizing:border-box}
  html[data-wv="D4"] .wv-acc-b{font-family:var(--font-display);font-weight:400;font-size:19px;color:#3A2B33;min-height:56px;padding:0 18px;width:100%}
  html[data-wv="D4"] .wv-acc-b[aria-expanded="true"]{background:var(--mameko-ivory);color:#3A2B33}
  html[data-wv="D4"] .wv-acc .mk-mkat-pod a{font-family:var(--font-body);font-size:15px;color:#5c4636;min-height:46px;padding-left:22px}
  html[data-wv="D4"] .wv-acc[data-g="6"]{margin-top:14px;border-top:6px solid var(--mameko-ivory)}
  html[data-wv="D4"] .wv-acc[data-g="6"] .wv-acc-b{color:#4f7a35}
  html[data-wv="D4"] .mk-mkat-x--dol{width:calc(100% - 32px);margin:18px 16px 24px}
}

  /* 29.10: lewe drzewo w stylu panelu D4 */
  html[data-wv="D4"] .wv-drzewo .mk-drzewo-sek{font-family:var(--font-display);font-size:16px;font-weight:400;letter-spacing:0;text-transform:none;color:#3A2B33;margin:18px 0 6px}
  html[data-wv="D4"] .wv-drzewo .mk-drzewo-sek:first-child{margin-top:0}
  html[data-wv="D4"] .wv-drzewo .mk-drzewo-sek.wv-drz-dieta{color:#4f7a35;border-top:1px solid var(--mameko-line);padding-top:16px;margin-top:20px}
  html[data-wv="D4"] .wv-drzewo .mk-dz{font-family:var(--font-body);font-size:14px;font-weight:400;color:#5c4636}
  html[data-wv="D4"] .wv-drzewo .mk-dz:hover{color:var(--mameko-cta-dark)}
  html[data-wv="D4"] .wv-drzewo .mk-dz.is-akt{color:var(--mameko-cta-dark);font-weight:600}
  html[data-wv="D4"] .wv-drzewo .mk-pk{font-family:var(--font-body);font-size:13.5px;color:#7a6250}
