/*Write your custom css in this file.*/

/* Active filter styling - Direct CSS approach */
/* Target Select2 containers that don't have default placeholder text */
.filter-section-container .select2-container:not([class*="select2-container-disabled"]) .select2-choice:not(:contains("- Περιφέρεια -")):not(:contains("- Περιφερειακή ενότητα -")):not(:contains("- MIS -")):not(:contains("- Τύπος έργου -")):not(:contains("- Ετικέτα -")) {
    background: #e3f2fd !important;
    border-color: #2196f3 !important;
    color: #1976d2 !important;
    box-shadow: 0 0 0 2px rgba(33, 150, 243, 0.2) !important;
}

.filter-section-container .select2-container:not([class*="select2-container-disabled"]) .select2-choice:not(:contains("- Περιφέρεια -")):not(:contains("- Περιφερειακή ενότητα -")):not(:contains("- MIS -")):not(:contains("- Τύπος έργου -")):not(:contains("- Ετικέτα -")) .select2-arrow {
    color: #1976d2 !important;
}

/* Alternative approach - target by specific text content */
.filter-section-container .select2-container .select2-choice:has(.select2-chosen:not(:contains("- Περιφέρεια -")):not(:contains("- Περιφερειακή ενότητα -")):not(:contains("- MIS -")):not(:contains("- Τύπος έργου -")):not(:contains("- Ετικέτα -"))) {
    background: #e3f2fd !important;
    border-color: #2196f3 !important;
    color: #1976d2 !important;
    box-shadow: 0 0 0 2px rgba(33, 150, 243, 0.2) !important;
}

/* JavaScript-based approach - class-based styling */
.filter-section-container .select2-container.filter-active .select2-choice {
    background: #e3f2fd !important;
    border-color: #2196f3 !important;
    color: #1976d2 !important;
    box-shadow: 0 0 0 2px rgba(33, 150, 243, 0.2) !important;
}

.filter-section-container .select2-container.filter-active .select2-choice .select2-arrow {
    color: #1976d2 !important;
}

/* Dark theme support for active filters */
body.dark-theme .filter-section-container .select2-container.filter-active .select2-choice {
    background: #1e3a5f !important;
    border-color: #4fc3f7 !important;
    color: #81d4fa !important;
    box-shadow: 0 0 0 2px rgba(79, 195, 247, 0.3) !important;
}

body.dark-theme .filter-section-container .select2-container.filter-active .select2-choice .select2-arrow {
    color: #81d4fa !important;
}