/* Szuflada kategorii na telefonie i tablecie (≤ 860 px) — akordeon 3 poziomów (869f7deet, Szymon 6.11 „kategorie przerób jak tu”).
   Markup: _PkiCategoryTree (.mg-list), przełączanie: pkieu-v3.js pkt 9 (.open + aria-expanded). Po pkieu-v3.css — nadpisuje
   blok „drzewo → szuflada”. Zasady: nazwa = link, osobny przycisk (.arr jak strzałki karuzeli) = rozwiń;
   wcięcie per poziom; otwarta gałąź = tło --wash + czerwony pasek z lewej. Tylko tokeny V3. */
@media (max-width:860px){
  .mg-c{align-items:stretch;}
  .mg-c > .mg-h{flex:1 1 0;min-width:0;display:flex;align-items:center;min-height:var(--h-touch);}
  /* przełącznik = TEN SAM przycisk co strzałki karuzeli banera i raili (Szymon 6.11, zrzuty 545/546: „inaczej te guziki zrób,
     bardziej jak to”): klasa .arr, wygląd i tokeny (--arr-w/--arr-a/--arr-c, --card-bg, ramka --line, kątownik --pki-corner-w,
     hover, fokus, wysoki kontrast) z jednego bloku w pkieu-v3.css (.hrail-wrap .arr, .car .carr .arr, .mg-list .arr) — tu tylko
     miejsce w wierszu i kierunek symbolu: ˅ = rozwiń, ˄ = zwiń (kątownik obrócony w dół / w górę, przesunięty jak w karuzeli
     o 0,35·a wstecz, żeby środek tuszu wypadł w środku przycisku). Pole dotyku = --arr-w (≤ 860 px: 44 px). */
  /* z-index:auto — wspólne .arr ma z-index:3 (nad railem), w szufladzie wjeżdżałoby nad przyklejony nagłówek .oc-head (z-index:1) */
  .mg-c > .mg-tg.arr{position:relative;z-index:auto;flex:none;align-self:center;margin:0 var(--sp-2) 0 var(--sp-1);}
  .mg-c > .mg-tg.arr::before{transform:translate(-50%,-50%) translateY(calc(var(--arr-a) * -.35)) rotate(135deg);}
  .mg-c.open > .mg-tg.arr::before{transform:translate(-50%,-50%) translateY(calc(var(--arr-a) * .35)) rotate(-45deg);}
  .mg-list > .mg-c.open{box-shadow:inset 3px 0 0 var(--red);}
  .mg-sub{padding:0;border-top:1px solid var(--line);}
  /* poziom 2 */
  .mg-sub .mg-l2{border-bottom:1px solid var(--line);background:none;}
  .mg-sub .mg-l2:last-child{border-bottom:0;}
  .mg-sub .mg-l2 > .mg-h{padding:10px 18px 10px 32px;font-size:var(--fs-md);color:var(--body);}
  .mg-sub .mg-l2.open{background:var(--wash2);box-shadow:inset 3px 0 0 var(--red);}  /* tło gałęzi przykryłoby pasek rodzica */
  .mg-sub .mg-l2.open > .mg-h,.mg-sub .mg-l2 > .mg-h.cur,.mg-sub .mg-l2 > .mg-h:hover{color:var(--red);}
  /* poziom 3 */
  .mg-l3 li a{display:flex;align-items:center;min-height:40px;padding:8px 18px 8px 46px;font-size:var(--fs-md);color:var(--muted);}
  .mg-l3 li a:hover,.mg-l3 li a[aria-current="page"]{color:var(--red);}
  .mg-sub a:focus-visible{outline:2px solid var(--red);outline-offset:-2px;}
}
