/* ============================================================
   Mobilní vysouvací panel pro #column-left (menu kategorií,
   filtr barev, značky) — čistě přídavný soubor.

   Nemění ani neřádkuje nic v existujícím stylesheet.css — jen
   přebíjí mobilní `display:none` u #column-left vlastní vyšší
   specificitou/pořadím načtení (+ !important jako pojistka).

   Nasazeno přes vqmod (mobile_filters.xml), viz <link> v hlavičce.
   ============================================================ */

/* Mimo mobilní media query musí tlačítko/overlay zůstat skryté.
   DŮLEŽITÉ: tohle pravidlo musí být PŘED media query níže, ne za ní —
   při stejné specificitě (jeden ID selektor) rozhoduje pořadí v
   souboru, a pravidlo napsané později vždy vyhraje bez ohledu na to,
   jestli je v media query, nebo ne. */
#column-left .mobile-filters-close,
#mobile-filters-toggle,
#mobile-filters-overlay {
    display: none;
}

@media only screen and (max-width: 759px) {

    #column-left {
        display: block !important;
        position: fixed;
        top: 0;
        left: 0;
        width: 85%;
        max-width: 320px;
        height: 100%;
        overflow-x: hidden;
				overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        background: #fff;
        z-index: 1001;
        transform: translateX(-105%);
        transition: transform 0.25s ease;
        box-shadow: 2px 0 10px rgba(0,0,0,0.25);
        padding: 15px;
        box-sizing: border-box;
    }

    #column-left.mobile-filters-open {
        transform: translateX(0);
    }

    /* Poslední box v column-left je "Info + bonusy" — na mobilu
       duplicitní se stejnými odkazy ve footeru (class="shown-phone"),
       proto se v panelu nezobrazuje. */
		/* #column-left > .box:last-of-type. */
		#column-left .sidebarmenu
		{
        display: none;
    }

    #mobile-filters-toggle {
        display: block;
        position: fixed;
        bottom: 15px;
        right: 15px;
        z-index: 998;
        background: #f3f3f3;
        border: solid 1px #cccccc;
        border-radius: 30px;
        color: #333333;
        font-size: 13px;
        font-weight: bold;
        padding: 10px 18px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.3);
        cursor: pointer;
    }

    #mobile-filters-overlay {
        position: fixed;
        top: 0; left: 0; right: 0; bottom: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1000;
    }

    #mobile-filters-overlay.active {
        display: block;
    }

    #column-left .mobile-filters-close {
        color: #ff3333;
				display: block;
        text-align: right;
        font-weight: bold;
        padding: 5px 0 15px;
        border-bottom: 1px solid #eee;
        margin: 0 15px 0 0;
        cursor: pointer;
    }
}