/* ============================================================================
   Выпадающее меню — ОДИН вид на весь кабинет.
   ============================================================================

   ПРИЧИНА. Меню в кабинете четыре вида: под аватаром в шапке, сортировка в каталоге
   и избранном, подсказки поиска в корзине, панели фильтров в заказах и документах.
   Общего вида у них не было: каждое доставалось от Bootstrap как есть либо
   допиливалось на месте. В итоге меню под аватаром — прямоугольник с острыми углами
   и системной тенью посреди интерфейса, где всё остальное скруглено на 12–16 и лежит
   на мягкой тени. Разъехались они не потому, что кто-то забыл, а потому что забыть
   здесь было МОЖНО: единого источника вида не существовало. Этот файл его заводит.

   ДВА РОДА МЕНЮ, и путать их нельзя:
     СПИСОК  — строки-действия (аватар, сортировка). Ему нужен ритм строк и иконки.
     ПАНЕЛЬ  — форма внутри меню (.filter_menu, подсказки поиска). У неё своя ширина
               и свои отступы, навязывать ей шаг строк нельзя.
   Общее у них — оболочка: скругление, рамка, тень. Её и задаём всем; всё остальное
   получает только СПИСОК.

   ⚠️ Цвет проставлен НА КАЖДОМ элементе: в site.css:5 живёт `* { color:#0D1017 }`,
   из-за которого наследование цвета в этом проекте не работает, а в site.css:14 —
   `a { color:#0D1017 !important }`, который перебивает любую подпись-ссылку.
   ========================================================================= */

/* ── Оболочка: всем меню ────────────────────────────────────────────────── */
.dropdown-menu {
    border: 1px solid #eef1f6;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 12px 32px rgba(16, 24, 40, .10), 0 2px 6px rgba(16, 24, 40, .04);
}

/* ── Список: всё, КРОМЕ панелей ─────────────────────────────────────────── */
/* Помечаем ИСКЛЮЧЕНИЕ (`dd-panel` на панели фильтров и на подсказках поиска), а не
   каждое меню-список: списков в кабинете больше и будет больше. Правило должно быть
   верным по умолчанию, иначе новое меню появится без вида и об этом никто не узнает.
   Один класс в `:not()` — специфичность остаётся низкой и её легко перебить точечно. */
.dropdown-menu:not(.dd-panel) {
    min-width: 224px;
    padding: 6px;
    margin-top: 8px !important;   /* меню не должно липнуть к кнопке: зазор говорит,
                                     что это отдельный слой, а не продолжение шапки */
}

.dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 40px;
    padding: 0 12px;
    border-radius: 9px;
    color: #45484f !important;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    transition: background .13s ease, color .13s ease;
}
.dropdown-item .bi {
    flex: 0 0 16px;
    color: #98a1ad;
    font-size: 15px;
    line-height: 1;
    transition: color .13s ease;
}
.dropdown-item:hover,
.dropdown-item:focus {
    background: #f3f6fb;
    color: #0d1017 !important;
}
.dropdown-item:hover .bi,
.dropdown-item:focus .bi { color: #0d6efd; }

.dropdown-item.active,
.dropdown-item:active {
    background: #f2f7ff;
    color: #0d6efd !important;
}
.dropdown-item.active .bi { color: #0d6efd; }

/* Выход — единственное действие в кабинете, которое человек не хочет нажать случайно.
   Красным он подсвечивается только под курсором: постоянно красный пункт кричит там,
   где ничего не случилось. */
.dropdown-item--danger:hover,
.dropdown-item--danger:focus {
    background: #fef1f3;
    color: #d92d4b !important;
}
.dropdown-item--danger:hover .bi,
.dropdown-item--danger:focus .bi { color: #d92d4b; }

.dropdown-divider {
    margin: 6px 4px;
    border-top: 1px solid #f0f3f7;
    opacity: 1;
}

/* ── Шапка меню: кто вошёл ──────────────────────────────────────────────── */
/* В самом меню повторяем, под кем работаем. В шапке это подписано мелко и обрезано
   по ширине, а решение «выйти» или «сменить юрлицо» человек принимает именно здесь —
   и принимать его он должен, видя полное имя, а не «ЛУИС+ Компания г…». */
.dd-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px 12px;
    margin-bottom: 4px;
    border-bottom: 1px solid #f0f3f7;
}
.dd-head__pic {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dd-head__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dd-head__ini { color: #ffffff; font-size: 14px; font-weight: 600; }
.dd-head__text { min-width: 0; }
.dd-head__name {
    color: #0d1017;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.dd-head__org {
    color: #8a929e;
    font-size: 12.5px;
    line-height: 17px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 575px) {
    .dropdown-menu:not(.dd-panel) { min-width: 208px; }
    .dd-head { max-width: 260px; }
}