:root {
    --filters_ak1-bg: #f9f9f9;
    --filters_ak1-border: #ddd;
    --filters_ak1-padding: 10px;
    --filters_ak1-gap: 10px;

    --cityfilter_ak1-bg: #fff;
    --cityfilter_ak1-border: #ccc;
    --cityfilter_ak1-color: #333;
    --cityfilter_ak1-padding: 8px;
    --cityfilter_ak1-radius: 5px;

    --categoryfilter_ak1-bg: #fff;
    --categoryfilter_ak1-border: #ccc;
    --categoryfilter_ak1-color: #333;
    --categoryfilter_ak1-padding: 8px;
    --categoryfilter_ak1-radius: 5px;

    --clearbtn_ak1-bg: #007bff;
    --clearbtn_ak1-color: #fff;
    --clearbtn_ak1-padding: 8px 15px;
    --clearbtn_ak1-border: none;
    --clearbtn_ak1-radius: 5px;
    --clearbtn_ak1-cursor: pointer;
    --clearbtn_ak1-hover-bg: #0056b3;
}

.filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--filters_ak1-gap);
    background: var(--filters_ak1-bg);
    padding: var(--filters_ak1-padding);
    border: 1px solid var(--filters_ak1-border);
    border-radius: 8px;
    margin-bottom: 20px;
}

#city-filter {
    background: var(--cityfilter_ak1-bg);
    border: 1px solid var(--cityfilter_ak1-border);
    color: var(--cityfilter_ak1-color);
    padding: var(--cityfilter_ak1-padding);
    border-radius: var(--cityfilter_ak1-radius);
}

#category-filter {
    background: var(--categoryfilter_ak1-bg);
    border: 1px solid var(--categoryfilter_ak1-border);
    color: var(--categoryfilter_ak1-color);
    padding: var(--categoryfilter_ak1-padding);
    border-radius: var(--categoryfilter_ak1-radius);
}

#clear-filters {
    background: var(--clearbtn_ak1-bg);
    color: var(--clearbtn_ak1-color);
    padding: var(--clearbtn_ak1-padding);
    border: var(--clearbtn_ak1-border);
    border-radius: var(--clearbtn_ak1-radius);
    cursor: var(--clearbtn_ak1-cursor);
    transition: background 0.3s;
}

#clear-filters:hover {
    background: var(--clearbtn_ak1-hover-bg);
}
