﻿:root {
    /* Граници и радиус */
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.2rem;
    --bs-border-radius-lg: 0.5rem;
    /* Цветове за фокус и състояния */
    --bs-primary: #0d6efd;
    --bs-primary-rgb: 13, 110, 253;
    --bs-body-bg: #fff;
    --bs-body-color: #212529;
    /* Специфично за формите */
    --bs-input-focus-border-color: #86b7fe;
    --bs-input-btn-focus-shadow-rgb: 13, 110, 253;
}

.choices {
    margin-bottom: unset;
    min-width: 100px;
    background: var(--bs-body-bg);
}

    .choices[data-type*='select'] > .choices__inner {
        display: block;
        width: 100%;
        font-size: 1rem;
        font-weight: 400;
        /* 1. Намаляваме line-height, за да не заема излишно място */
        line-height: 1;
        background-color: unset;
        background-clip: padding-box;
        border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
        border-radius: var(--bs-border-radius);
        transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
        min-height: 45px !important;
        /* 2. Нагласяме паддинга така, че текстът да падне точно в средата */
        padding: 13px 0.75rem !important;
    }

    /* Фокус състояние - добавяме го за Bootstrap визия */
    .choices.is-focused .choices__inner {
        border-color: #000;
        box-shadow: none;
    }

/* Оправяме текста вътре да не бяга нагоре */
.choices__list--single {
    padding: 0 !important;
}

/* Мултиселект елементи (тагове) */
.choices__list--multiple .choices__item {
    margin-top: 0;
    margin-bottom: 0;
    background-color: var(--bs-primary);
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    padding: 2px 8px;
}

/* Входното поле за търсене */
.choices__input {
    margin-bottom: 0;
    padding: 0;
    background-color: transparent;
    font-size: 1rem;
}

/* Премахваме старата дебела стрелка на Choices */
.choices[data-type*='select']::after {
    border-color: #6c757d transparent transparent transparent !important;
    border-width: 5px !important;
    right: 15px !important;
}

/* Направи фона на падащото меню тъмен, за да пасне на темата */
.dark-theme .choices__list--dropdown {
    background-color: #1a1a1a !important; /* Тъмен фон */
    border-color: #444444 !important; /* Тъмна рамка */
}

    /* Направи полето за търсене тъмно, ако го ползваш */
    .dark-theme .choices__list--dropdown .choices__input {
        background-color: #222222 !important;
        color: #ffffff !important;
        border-color: #444444 !important;
    }

    /* Оправи текста на елементите в списъка */
    .dark-theme .choices__list--dropdown .choices__item {
        color: #ffffff !important; /* Бял текст на тъмен фон */
    }

/* 1. Тъмен фон за цялото меню */
.dark-theme .choices__list--dropdown {
    background-color: #1a1a1a !important;
    border-color: #444 !important;
}

    /* 2. Бял текст по подразбиране */
    .dark-theme .choices__list--dropdown .choices__item {
        color: #ffffff !important;
    }

    /* 3. HOVER ефект върху тъмното меню */
    .dark-theme .choices__list--dropdown .choices__item--selectable.is-highlighted {
        background-color: #333333 !important; /* Малко по-светло сиво при посочване */
        color: #ffffff !important;
    }
.dark-theme .choices {
    background: #1a1a1a !important;    
}