/* GLOBAL VARIABLES (scoped in wrapper) */
.filters-menu {
    --border: #e5e5e5;
    --text: #333;
    --muted: #666;
    --radius: 8px;
    --highlight: #000;
    font-family: Arial, sans-serif;
}

    /* BASE SPACING FOR BLOCKS */
    .filters-menu .filter-block {
        margin-bottom: 28px;
    }

    /*---------- HEADERS (collapsible sections) ----------*/
    .filters-menu .filter-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        cursor: pointer;
        margin-bottom: 10px;
    }

        .filters-menu .filter-header h3 {
            margin: 0;
            font-size: 1rem;
            font-weight: bold;
            color: var(--muted);
        }

    /* Chevron icon (pure CSS) */
    .filters-menu .chevron {
        width: 10px;
        height: 10px;
        border-right: 2px solid #666;
        border-bottom: 2px solid #666;
        transform: rotate(45deg);
        transition: 0.25s ease;
    }

        .filters-menu .chevron.small {
            transform: rotate(-45deg);
        }

        .filters-menu .chevron.rotated {
            transform: rotate(-135deg);
        }

    /* Section body collapsible container */
    .filters-menu .section-body {
        display: none;
        transition: 0.3s ease;
    }

        .filters-menu .section-body.open {
            display: block;
        }

    /* ---------- INPUTS ---------- */
    .filters-menu .input {
        width: 100%;
        padding: 10px;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        font-size: 0.9rem;
    }

    /* ---------- SELECTABLE LIST (Brands) ---------- */
    .filters-menu .select-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .filters-menu .select-list li {
            padding: 10px 12px;
            font-size: 0.95rem;
            border: 1px solid var(--border);
            border-radius: var(--radius);
            margin-bottom: 8px;
            cursor: pointer;
            transition: 0.25s;
        }

            .filters-menu .select-list li:hover {
                background: #f4f4f4;
            }

            .filters-menu .select-list li.active {
                background: var(--highlight);
                color: #fff;
                border-color: var(--highlight);
            }

    /* ---------- CATEGORY SYSTEM ---------- */

    /* Category container */
    .filters-menu .category-filter-list {
        margin-top: 5px;
    }

    /* Parent Category Row */
    .filters-menu .category-parent {
        padding: 10px 12px;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        font-size: 0.95rem;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
        transition: 0.25s;
        background: #fff;
        margin-bottom:5px;
    }

        .filters-menu .category-parent:hover {
            background: #f5f5f5;
        }

    /* Child Categories */
    .filters-menu .category-children {
        margin-left: 12px;
        margin-top: 6px;
        display: none;
    }

        .filters-menu .category-children.open {
            display: block;
        }

    /* Child category item */
    .filters-menu .category-child {
        padding: 8px 12px;
        border-radius: 6px;
        margin-bottom: 4px;
        font-size: 0.85rem;
        cursor: pointer;
        color: #555;
    }

        .filters-menu .category-child:hover {
            background: #f4f4f4;
        }

    /* ---------- APPLY BUTTON ---------- */
    .filters-menu .apply-btn {
        width: 100%;
        background: black;
        color: white;
        padding: 12px;
        border-radius: var(--radius);
        font-size: 1rem;
        cursor: pointer;
        border: none;
        transition: 0.25s;
    }

        .filters-menu .apply-btn:hover {
            opacity: 0.85;
        }