/* =========================================
       1. INPUT (Główny pasek)
       ========================================= */
    .bootstrap-select > .dropdown-toggle {
        background-color: #ffffff !important;
        border: 1px solid #ced4da !important;
        box-shadow: none !important;
        outline: none !important;
        color: #212529 !important;
        border-radius: 6px !important;
    }
    .bootstrap-select > .dropdown-toggle:focus {
        border-color: #C19A5B !important;
    }

    /* =========================================
       2. PASEK SELECT ALL / DESELECT ALL
       ========================================= */
    .bs-actionsbox {
        padding: 10px 15px !important;
        background-color: #fff !important;
        border-bottom: 1px solid #f0f0f0 !important;
    }
    .bs-actionsbox .btn-group {
        display: flex !important; 
        justify-content: space-between !important;
        width: 100% !important;
        box-shadow: none !important;
    }
    .bs-actionsbox .btn-group button {
        background: transparent !important;
        border: none !important;
        color: #C19A5B !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        text-transform: uppercase !important;
        padding: 0 !important;
        width: auto !important;
        margin: 0 !important;
        box-shadow: none !important;
    }

    /* =========================================
       3. LISTA ROZWIJANA (Menu)
       ========================================= */
    .dropdown-menu {
        border: none !important;
        border-radius: 0 0 8px 8px !important;
        box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
        margin-top: 0px !important;
        margin-bottom: -10px !important;
        padding: 0 !important;
        max-height: 332px;
        overflow: visible !important; 
    }

    .location .dropdown-menu {
        max-height: 285px;
    }

    .bootstrap-select .dropdown-menu .inner {
        min-height: 275px !important;        
    }

    /* =========================================
       4. TYPOGRAFIA I UKŁAD (Indentacja + Ptaszek po lewej)
       ========================================= */
    
    /* A. Nagłówki kategorii (Apartment, House) */
    .bootstrap-select .dropdown-menu .dropdown-header {
        font-size: 14px !important;
        color: #6c757d !important; /* Szary, subtelny */
        font-weight: 500 !important; /* Gruby font */
        /* text-transform: uppercase !important; */
        padding: 12px 20px 4px 20px !important; /* Mniejszy padding z dołu */
        letter-spacing: 0.5px;
    }

    /* B. Elementy listy (Duplex, etc.) */
    .bootstrap-select .dropdown-menu li a.dropdown-item {
        position: relative !important; /* Ważne dla pozycjonowania ptaszka */
        padding: 4px 20px 4px 45px !important; /* 45px z lewej robi miejsce na wcięcie i ptaszka */
        font-size: 16px !important;
        font-weight: 400 !important; /* Normalna waga czcionki */
        color: #252129 !important;
        line-height: 1.2 !important;
        background-color: white;
    }

    /* C. Przeniesienie ptaszka na LEWĄ stronę */
    .bootstrap-select .dropdown-menu li a.dropdown-item span.check-mark {
        position: absolute !important;
        left: 20px !important; /* Odległość od lewej krawędzi */
        top: 50% !important;
        transform: translateY(-50%) !important; /* Idealne centrowanie w pionie */
        margin: 0 !important;
        font-size: 14px !important; /* Rozmiar ikonki */
        right: auto !important; /* Resetujemy domyślne pozycjonowanie po prawej */

        color: #fff !important; 
        display: inline-block !important; 
    }  

    /* =========================================
       5. STANY AKTYWNE (Kolory)
       ========================================= */
    
    /* Tło aktywnego elementu */
    .bootstrap-select .dropdown-menu li a.dropdown-item.selected,
    .bootstrap-select .dropdown-menu li a.dropdown-item.active {
        background-color: #bc974e !important;
        color: #ffffff !important;
    }

    /* Kolor ptaszka */
    .bootstrap-select .dropdown-menu li a.dropdown-item span.check-mark {
        /* color: transparent !important; /* Ukryj ptaszka, gdy nie jest zaznaczony (opcjonalnie) */
        color: #f0f0f0 !important; 
        transition: color 0.2s ease;        
    }
    /* Pokaż biały ptaszek TYLKO gdy zaznaczony */
    .bootstrap-select .dropdown-menu li a.dropdown-item.selected span.check-mark,
    .bootstrap-select .dropdown-menu li a.dropdown-item.active span.check-mark {
        color: #ffffff !important;
    }

    .bootstrap-select .bs-select-clear-selected {
        align-items: center;
        flex-shrink: 0;
        width: 18px;
        height: 18px;
        background-color: #6c757d;
        color: white;
        border-radius: 50%;
        line-height: 18px;
        font-size: 12px;
        cursor: pointer;
        font-weight: bold;
        padding-top: 1px;
    }

    /* Efekt po najechaniu (Hover) */
    .bootstrap-select .bs-select-clear-selected:hover {
        background-color: #6c757d; /* Ciemniejszy szary */
        color: #ffffff;
    }
/*
li.no-results {
    display: none;
} */

.dropdown-divider {
    display: none;
}

    /* --- Wygląd grupy inputów --- */
    .price-group {
        /* width: 193px; */
    }

    /* Ikona Euro (szara, ładnie sklejona) */
    .currency-addon {
        background-color: #e9ecef;
        border: 1px solid #ced4da;
        border-left: 0;
        color: #495057;
        font-weight: 300;
        border-radius: 0 6px 6px 0;
    }

    /* Input text formatting */
    .price-input {
        border-right: 0; /* Żeby połączyć wizualnie z € */
        border-top-right-radius: 0; 
        border-bottom-right-radius: 0;
        padding-right: 35px; /* Miejsce na ikonki */
        color: #212529;
        border-radius: 6px 0 0 6px;
        width: 156px;
    }

    /* ZŁOTA RAMKA FOCUS (Symulowana na wrapperze, nie na inpucie) */
    /* Wyłączamy domyślny outline bootstrapa na inpucie */
    .price-input:focus {
        box-shadow: none;
        border-color: #ced4da; /* Zostawiamy szarą, bo złoto dodamy "z zewnątrz" */
    }

    /* Kiedy input w środku ma focus, kolorujemy cały wrapper */
    .price-wrapper.focused {
        box-shadow: 0 0 0 4px rgba(193, 154, 91, 0.2); /* Złota poświata */
        border-radius: 6px;
        z-index: 5;
    }
    .price-wrapper.focused .price-input {
        border-color: #C19A5B; /* Złota ramka */
    }

    /* --- Kontrolki (Pozycjonowanie) --- */
    .price-controls {
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        width: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 10;
    }

    /* --- Strzałki (Spinners) --- */
    .spinners {
        display: flex;
        flex-direction: column;
        height: 100%;
        width: 100%;
        border-left: 1px solid #dee2e6; /* Linia oddzielająca od liczb */
    }

    .spin-btn {
        flex: 1; /* Każda strzałka zajmuje połowę wysokości */
        border: none;
        background: white;
        padding: 0;
        margin: 0;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #adb5bd;
        font-size: 10px; /* Małe strzałki */
        transition: background 0.2s;
    }
    
    .spin-btn:first-child {
        border-bottom: 1px solid #f0f0f0; /* Linia między strzałkami */
        border-top-right-radius: 0.375rem; /* Zaokrąglenie w rogu */
    }
    
    .spin-btn:hover {
        background-color: #f8f9fa;
        color: #C19A5B; /* Złoty kolor po najechaniu */
    }

    /* --- Przycisk X --- */
    .clear-btn-wrapper {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .clear-price-btn {
        width: 18px;
        height: 18px;
        background-color: #6c757d; /* Szare tło */
        color: white;
        border-radius: 50%;
        text-align: center;
        line-height: 18px;
        font-size: 12px; /* Rozmiar krzyżyka */
        cursor: pointer;
        font-weight: bold;
    }
    
    .clear-price-btn:hover {
        background-color: #495057;
    }


    /* BUTTON */


    .btn-gold {
        /* Typografia */
        font-weight: 700; /* Lekko pogrubiona czcionka */
        font-size: 16px;
        color: #ffffff;

        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 6px 12px;
        gap: 8px;

        width: 261.33px;
        height: 38px;

        background: linear-gradient(90deg, #DDCE89 0%, #BC974E 100%);
        border: 1px solid #BC974E;
        border-radius: 6px;

        &:hover {
            background: #AE8644;
            border: 1px solid #AF8540;
        }
    }


/* SHOW FAVORITES */

    .fixed-floating-buttons {
        position: fixed;
        bottom: 30px; 
        right: 20px; 
        display: flex;
        align-items: center;
        gap: 12px; 
        z-index: 1050; 
    }

    .btn-floating-fav {

        @media (max-width: 1295px) {
            width: 38px;
            padding-right: 0px !important;
            .text {
                display: none;
            }
        }
        @media (min-width: 1296px) {
            width: 125px;
        }

        display: block;
        padding: 8px 12px 6px 34px;

        height: 42px;

        background: #FFFFFF;
        border: 1px solid #BC974E;
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.075);
        border-radius: 6px;

        font-weight: 700;
        font-size: 16px;
        color: #BC974E;
        line-height: 1.5;
        text-decoration: none;

        &:hover {
            background: #BC974E;
            border: 1px solid #BC974E;
            color: white;
            img.hov0 {
                opacity: 0;
            }
            img.hov1 {
                opacity: 1;
            }
        }

        position: relative;

        img {
            position: absolute;
            left: 10px;
            top: 12px;
        }

        img.hov0 {
            opacity: 1;
        }
        img.hov1 {
            opacity: 0;
        }
    }

    .btn-scroll-top {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 12px;
        gap: 8px;

        width: 42px;
        height: 42px;

        background: linear-gradient(90deg, #DDCE89 0%, #BC974E 100%);
        border: 1px solid #BC974E;
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.075);
        border-radius: 6px;

        &:hover {
            background: #AE8644;
            border: 1px solid #AF8540;
        }
    }