/* ==========================================================================
   ALLMEBLO. Nawigacja: panel "Blog" w menu glownym i pas "mapa sklepu"
   w stopce. 2026-08-12.

   DLACZEGO OSOBNY PLIK, a nie custom.css ani header-menu.css:
   custom.css idzie do paczki CCC, ktorej nazwe PrestaShop liczy ze SCIEZEK
   plikow, a nie z ich zawartosci, wiec sama zmiana tresci nie uniewaznia
   paczki u klienta. Ten arkusz jest wpiety w layouts/layout-both-columns.tpl
   przez <link ... ?v=N>, dokladnie tak jak product-card.css, mechanizm.css
   i alm-cms-tresc. Rownolegle nad strona glowna pracuje inny agent, wiec
   dopisywanie do wspolnego custom.css groziloby konfliktem.

   Arkusz jest wpinany PO header-menu.css i PO footer-polish.css, wiec przy
   rownej specyficznosci wygrywa. Zero !important.

   KONTRASTY (zmierzone wzgledem tla, ktore ma dany blok):
     #2a7c00 na #ffffff = 5,27:1  (panel menu ma biale tlo)
     #1f5c00 na #f5f5f5 = 7,44:1  (stopka ma tlo #f5f5f5)
     #e3ded6 to linia, element czysto dekoracyjny (nie niesie tresci)
   Kolory sa brane ze zmiennych zdefiniowanych w header-menu.css
   (--alm-hm-*) i footer-polish.css (--alm-fp-*), zeby nie mnozyc odcieni.
   ========================================================================== */


/* ==========================================================================
   1. PANEL "BLOG" W MENU GLOWNYM

   Panele Meble, Pomieszczenia i Kolekcje maja uklad col-md-9 (kolumny
   z linkami) + col-md-3 (kafel promocyjny ze zdjeciem). Panel bloga NIE ma
   kafla, bo nie ma dla niego zdjecia w /img/menu-*.jpg, a wstawienie
   przypadkowej fotografii byloby zgadywaniem. Zamiast tego trzy kolumny
   linkow zajmuja cala szerokosc (col-md-12).

   Skutek uboczny: regula z header-menu.css rysujaca dwie pionowe linie
   miedzy kolumnami celuje w `.cnav > .col-md-9 > .row` i tu nie trafia.
   Powtarzamy ja dla col-md-12, zeby panel bloga wygladal jak pozostale.
   Linie sa rysowane tlem wiersza na 33,33% i 66,66% szerokosci, a nie
   ramkami kolumn, bo grupy plywaja i przy roznych wysokosciach nie
   trzymaja sie kolejnosci nth-child.
   ========================================================================== */

@media (min-width: 992px) {
    #header .megamenu--blog .cnav > .col-md-12 > .row:first-child {
        background-image:
            linear-gradient(to right, transparent calc(33.3333% - 1px), #f2ece5 calc(33.3333% - 1px), #f2ece5 33.3333%, transparent 33.3333%),
            linear-gradient(to right, transparent calc(66.6666% - 1px), #f2ece5 calc(66.6666% - 1px), #f2ece5 66.6666%, transparent 66.6666%);
        background-repeat: no-repeat;
    }

    /* Panel bloga jest niski (siedem pozycji w najdluzszej kolumnie), wiec
       bez tego wiersz stopki panelu przykleja sie do ostatniego linku. */
    #header .megamenu--blog .alm-kol-wszystkie {
        margin-top: 18px;
        padding-top: 14px;
        border-top: 1px solid #f2ece5;
    }
}

/* Na telefonie pas dolny jest zwyklym linkiem w kolumnie panelu; menu-mobile.js
   zwija grupy .col-md-4, a tego bloku nie dotyka, wiec zostaje widoczny
   i pelni role wyjscia awaryjnego na /blog/. */
@media (max-width: 991.98px) {
    #header .megamenu--blog .alm-kol-wszystkie {
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid #f2ece5;
    }
}


/* ==========================================================================
   2. PAS "MAPA SKLEPU" W STOPCE

   Pas jest osobnym wierszem .row.ApRow.alm-mapa POD piecioma kolumnami
   stopki. Wszystkie style linkow, kropek i naglowkow dziedziczy z
   footer-polish.css (selektory .footer-center .block-toggler.ApBlockLink),
   bo uzywa dokladnie tych samych klas. Tutaj sa tylko rzeczy, ktorych tam
   nie ma: odciecie pasa od kolumn wyzej i szerokosc kolumn 3 x 1/3.
   ========================================================================== */

.footer-container .footer-center .alm-mapa {
    margin-top: 8px;
    padding-top: 28px;
    border-top: 1px solid var(--alm-fp-linia, #e3ded6);
}

/* Ponizej 768 px kolumny stopki sa akordeonami (styles.css modulu
   appagebuilder chowa .collapse i pokazuje .collapse.in). Pas dziedziczy
   ten mechanizm co do joty, wiec na telefonie nie ma tu nic do ustawiania
   poza mniejszym odstepem - pas ma wtedy trzy zamkniete naglowki. */
@media (max-width: 767.98px) {
    .footer-container .footer-center .alm-mapa {
        margin-top: 0;
        padding-top: 18px;
    }
}

/* Trzy kolumny pasa maja te sama liste co kolumny wyzej, ale sa szersze,
   wiec przy dlugich etykietach ("Kolekcje lozek tapicerowanych") tekst
   lamal sie w polowie szerokosci kolumny. Lamiemy dopiero na koncu. */
.footer-container .footer-center .alm-mapa .block-toggler.ApBlockLink ul li a {
    padding-right: 8px;
}