.applied-filters {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa; /* پس‌زمینه سبک */
    border-radius: 5px;
}

.filter-title {
    font-weight: bold;
    margin-right: 10px;
    color: #333;
}

.filter-badge {
    display: inline-block;
    padding: 5px 10px;
   /*  background-color:  rgb(204, 255, 204); رنگ خاکستری به جای آبی */
    color: #FF1F00;/* #333; متن تیره */
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-right: 5px;
    font-size: 14px;
}

    .filter-badge a {
        color: #333;
        margin-left: 5px;
        text-decoration: none;
        font-weight: bold;
    }

        .filter-badge a:hover {
            color: #ff0000;
        }



body.dark-mode .applied-filters {
    margin-top: 10px;
    padding: 10px;
    background-color: #212529; /* پس‌زمینه تیره */
    border-radius: 5px;
}

body.dark-mode .filter-title {
    font-weight: bold;
    margin-right: 10px;
    color: #e0e0e0; /* رنگ متن روشن */
}

body.dark-mode .filter-badge {
    display: inline-block;
    padding: 5px 10px;
    background-color: #2a2a2a; /* پس‌زمینه تیره برای badge */
    color: #FFDF00; /* متن روشن */
    border: 1px solid #444; /* حاشیه تیره */
    border-radius: 3px;
    margin-right: 5px;
    font-size: 14px;
}

    body.dark-mode .filter-badge a {
        color: #e0e0e0;
        margin-left: 5px;
        text-decoration: none;
        font-weight: bold;
    }

        body.dark-mode .filter-badge a:hover {
            color: #ff7070; /* رنگ تغییر یافته در حالت هاور */
        }