/* ---------------------------------------------------------------------
   MINI-MAPA -> MAPA NA CALY EKRAN (pozycje 34 i 36, 27.10).
   Arkusz tylko na stronach z pudlem `data-mapa-mini` (@pushOnce w
   `parts._mapa-mini`). Pudlo zostaje swoje (b3-gdzie, b12-mapa, b5-us-mapa,
   b13-mapa) - tu tylko zywa mapa na rysunku i okno na caly ekran. Barwy
   wlasne (strony maja rozne zmienne): ciemny - czern + zloto, jasny - biel + zloto.
--------------------------------------------------------------------- */
[data-mapa-mini] .mm-gl{position:absolute;inset:0;z-index:0;opacity:0;transition:opacity .5s ease;pointer-events:none}
.mm-gl canvas{outline:none}
.mm-zywa{cursor:pointer;-webkit-tap-highlight-color:transparent}
[data-mapa-mini].mm-zywa .mm-gl{opacity:1}
/* Rysunek pod spodem znika, napis z miejscem zostaje nad mapa */
.mm-zywa > :not(.mm-gl):not([data-mm-zostaw]){visibility:hidden}
.mm-zywa > [data-mm-zostaw]{z-index:2}
.mm-zywa:focus-visible{outline:2px solid #D9B64A;outline-offset:2px}
.mm-zywa::after{content:"";position:absolute;inset:auto 0 0 0;height:62%;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(8,8,10,.86),rgba(8,8,10,0))}
:root[data-theme="light"] .mm-zywa::after{background:linear-gradient(to top,rgba(255,255,255,.92),rgba(255,255,255,0))}
.mm-zywa.mm-bez-cienia::after{display:none}

/* Pinezka: zlota kropla z ciemnym srodkiem (jak w formularzu punktu) */
.mm-pin{width:30px;height:36px;pointer-events:none}
.mm-pin::before{content:"";position:absolute;left:2px;top:2px;width:26px;height:26px;box-sizing:border-box;border-radius:50% 50% 50% 0;background:#D9B64A;border:2px solid #FBEFC2;transform:rotate(-45deg);box-shadow:0 6px 14px rgba(0,0,0,.45)}
.mm-pin::after{content:"";position:absolute;left:11px;top:11px;width:8px;height:8px;border-radius:50%;background:#15120A}
.mm-pin-zlecenie::after,.mm-pin-usluga::after,.mm-pin-sklep::after{border-radius:2px}
:root[data-theme="light"] .mm-pin::before{background:#B08A24;border-color:#FFFFFF;box-shadow:0 6px 14px rgba(40,32,10,.3)}
.mm-kropka{width:12px;height:12px;border-radius:50%;background:#D9B64A;border:2px solid #FBEFC2;box-shadow:0 2px 8px rgba(0,0,0,.45)}
.mm-kropka.on{width:16px;height:16px}
:root[data-theme="light"] .mm-kropka{background:#B08A24;border-color:#FFFFFF}

/* Okno na caly ekran: od dolu, gorny pasek z uchwytem (gest w dol) i X */
html.mm-otwarta,html.mm-otwarta body{overflow:hidden}
.mm-pelny{position:fixed;inset:0;z-index:2000;display:flex;flex-direction:column;background:#08080A;transform:translateY(100%);visibility:hidden;transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s linear .26s}
.mm-pelny.on{transform:translateY(0);visibility:visible;transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s}
:root[data-theme="light"] .mm-pelny{background:#F3EFE6}
.mm-p-gora{position:relative;flex:none;display:flex;align-items:center;gap:10px;min-height:58px;padding:12px 12px 8px 18px;padding-top:max(12px,env(safe-area-inset-top));background:#101014;border-bottom:1px solid #26262D;touch-action:none}
:root[data-theme="light"] .mm-p-gora{background:#FFFFFF;border-bottom-color:#E7E1D3}
.mm-p-uchwyt{position:absolute;left:50%;top:5px;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:#3A3A42}
:root[data-theme="light"] .mm-p-uchwyt{background:#D2CCC0}
.mm-p-t{flex:1;min-width:0;font:800 17px/1.25 Manrope,system-ui,sans-serif;color:#F2EBDA;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root[data-theme="light"] .mm-p-t{color:#1C1A16}
.mm-p-x{flex:none;width:44px;height:44px;border-radius:12px;border:1px solid #3A3A42;background:#16161B;color:#F2EBDA;display:flex;align-items:center;justify-content:center;cursor:pointer}
.mm-p-x svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
:root[data-theme="light"] .mm-p-x{background:#FFFFFF;border-color:#E2DBCB;color:#1C1A16}
.mm-p-x:focus-visible{outline:2px solid #D9B64A;outline-offset:2px}
.mm-p-mapa{position:relative;flex:1;min-height:0}
.mm-p-atr{position:absolute;right:8px;bottom:max(4px,env(safe-area-inset-bottom));z-index:3;padding:0 6px;border-radius:6px;background:rgba(9,9,11,.72);font:700 10px/16px Manrope,system-ui,sans-serif;color:#A9A49A;pointer-events:none}
:root[data-theme="light"] .mm-p-atr{background:rgba(255,255,255,.8);color:#6A645A}

/* Metki na mapie pelnej: glowna zlota, inne w poblizu przygaszone */
.mm-m{position:relative;display:block;max-width:150px;height:30px;padding:0 10px;border-radius:10px;border:1px solid #5A4A1C;background:#16161B;color:#F2EBDA;font:800 12.5px/28px Manrope,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.45)}
.mm-m.pusta{width:14px;height:14px;padding:0;border-radius:50%;background:#D9B64A}
.mm-m.on{background:linear-gradient(135deg,#F2D98A,#C9A13A);color:#15120A;border-color:transparent}
.mm-m-w.obok .mm-m:not(.on){opacity:.82}
.mm-m-zlecenie,.mm-m-usluga,.mm-m-sklep{border-radius:8px}
:root[data-theme="light"] .mm-m{background:#FFFFFF;color:#1C1A16;border-color:#D9C27A;box-shadow:0 6px 16px rgba(40,32,10,.18)}
:root[data-theme="light"] .mm-m.on{background:linear-gradient(135deg,#E9CD74,#B08A24);color:#15120A}

/* Karta na dole po dotknieciu metki */
.mm-p-karta{position:absolute;z-index:4;left:12px;right:12px;bottom:calc(26px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:16px;background:#101014;border:1px solid #3A3A42;box-shadow:0 14px 30px rgba(0,0,0,.5)}
.mm-p-karta[hidden]{display:none}
.mm-p-karta b{font:800 15px/1.3 Manrope,system-ui,sans-serif;color:#F2EBDA;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mm-p-karta span{font:700 13px/1.3 Manrope,system-ui,sans-serif;color:#A9A49A}
.mm-p-zobacz{margin-top:10px;display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:12px;background:linear-gradient(135deg,#F2D98A,#C9A13A);color:#15120A;font:800 14px Manrope,system-ui,sans-serif;text-decoration:none}
:root[data-theme="light"] .mm-p-karta{background:#FFFFFF;border-color:#E2DBCB;box-shadow:0 14px 30px rgba(40,32,10,.18)}
:root[data-theme="light"] .mm-p-karta b{color:#1C1A16}
:root[data-theme="light"] .mm-p-karta span{color:#6A645A}

@media (min-width:1024px){
  .mm-p-karta{left:auto;right:24px;width:360px;bottom:28px}
}
@media (prefers-reduced-motion:reduce){
  .mm-gl,.mm-pelny,.mm-pelny.on{transition:none}
}