/* Выпадающие меню в стиле GoAuth Panel: тонкая рамка, радиус 8px, мягкая тень,
   появление с масштабом и сдвигом (dropdownShow), скрытие за 75 мс. */
:root {
    --dd-bg: #fff;
    --dd-fg: #262626;
    --dd-muted: #737373;
    --dd-border: #e5e5e5;
    --dd-input-border: #d4d4d4;
    --dd-accent: #f4f4f5;
    --dd-accent-fg: #171717;
    --dd-ring: #6091fb;
    --dd-radius: .5rem;
    --dd-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
    --dd-ease: cubic-bezier(.16, 1, .3, 1);
}

html.dark {
    --dd-bg: #282828;
    --dd-fg: #f5f5f5;
    --dd-muted: #a3a3a3;
    --dd-border: #3b3b3b;
    --dd-input-border: #4d4d4d;
    --dd-accent: rgba(255, 255, 255, .07);
    --dd-accent-fg: #fff;
    --dd-shadow: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -4px rgba(0, 0, 0, .4);
}

@keyframes dd-show {
    from { opacity: 0; scale: .95; translate: 0 var(--dd-shift, -4px); }
    to { opacity: 1; scale: 1; translate: 0 0; }
}

@keyframes dd-hide {
    from { opacity: 1; scale: 1; }
    to { opacity: 0; scale: .95; }
}

/* Меню Bootstrap: фильтры, «…» у ссылок, доменов и т. д. */
.dropdown-menu {
    min-width: 12rem;
    margin-top: .5rem;
    padding: .25rem;
    font-size: .875rem;
    color: var(--dd-fg);
    background-color: var(--dd-bg);
    border: 1px solid var(--dd-border) !important;
    border-radius: var(--dd-radius);
    box-shadow: var(--dd-shadow) !important;
    transform-origin: top left;
}

.dropdown-menu-right { transform-origin: top right; }
.dropdown-menu[x-placement^="top"] { margin-top: 0; margin-bottom: .5rem; transform-origin: bottom left; --dd-shift: 4px; }
.dropdown-menu-right[x-placement^="top"] { transform-origin: bottom right; }
/* Îòêðûòîå ìåíþ ïîâåðõ ëèïêîé øàïêè ñàéòà (z-index 1025) */
.dropdown-menu.show { z-index: 1026; animation: dd-show .15s var(--dd-ease); }
.dropdown-menu.dd-closing { animation: dd-hide 75ms cubic-bezier(.4, 0, 1, 1) forwards; pointer-events: none; }

.dropdown-item {
    padding: .5rem .75rem;
    font-size: .875rem;
    color: var(--dd-fg);
    border-radius: calc(var(--dd-radius) - 2px);
    transition: background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active,
.dropdown-item:active {
    color: var(--dd-accent-fg);
    background-color: var(--dd-accent);
    outline: none;
}

.dropdown-item.text-danger:hover,
.dropdown-item.text-danger:focus { background-color: rgba(239, 68, 68, .1); }

.dropdown-divider { margin: .25rem -.25rem; border-top-color: var(--dd-border); }
.dropdown-header { padding: .375rem .75rem; font-size: .75rem; color: var(--dd-muted); }

/* Окно фильтров */
#search-filters .dropdown-header.py-3 { padding: .625rem 1rem !important; }
#search-filters .dropdown-header .font-weight-medium { font-size: .875rem; font-weight: 600 !important; }
#search-filters .dropdown-header a { font-size: .8125rem; color: var(--dd-muted) !important; text-decoration: none; transition: color .15s; }
#search-filters .dropdown-header a:hover { color: var(--dd-fg) !important; }
#search-filters.p-0 .dropdown-divider { margin-left: 0; margin-right: 0; }
#search-filters .px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
#search-filters .pt-3 { padding-top: .625rem !important; }
#search-filters .px-4.py-3 { padding-top: .625rem !important; padding-bottom: .625rem !important; }
#search-filters .max-height-96 { scrollbar-width: thin; }

/* Компактная строка «название — список» */
#search-filters .form-group { display: flex; align-items: center; gap: .5rem; margin-bottom: .25rem; }
#search-filters .form-group label { flex: 1 1 auto; min-width: 0; margin: 0; font-size: .8125rem; font-weight: 400; line-height: 1.2; color: var(--dd-muted); }
#search-filters .form-group .dd-select { flex: 0 0 8.5rem; width: 8.5rem; height: 2rem; padding: 0 .625rem; font-size: .8125rem; }
#search-filters .btn-block { display: flex; align-items: center; justify-content: center; height: 2rem; padding-top: 0; padding-bottom: 0; font-size: .8125rem; font-weight: 500; border-radius: var(--dd-radius); }

/* Фильтр ссылок: популярные ссылки пунктами меню, сброс внизу */
.dd-filters .dropdown-header { padding: .5rem .75rem .25rem; font-size: .6875rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.dd-filters .dropdown-item { padding: .4375rem .75rem; }
.dd-filters .form-group { padding: 0 .75rem; }
.dd-filters .dd-actions { padding: .25rem .75rem; }
.dd-filters .max-height-96 { overflow-x: hidden; }
.dd-filters .max-height-96 .dropdown-divider { margin-left: 0; margin-right: 0; }
.dd-item-check { flex-shrink: 0; width: 1rem; height: 1rem; margin-inline-start: auto; padding-inline-start: .25rem; fill: var(--dd-ring); }
.dropdown-item.dd-reset { color: var(--dd-muted); }
.dropdown-item.dd-reset:hover,
.dropdown-item.dd-reset:focus { color: var(--dd-accent-fg); }

/* Свой список вместо стандартного <select> */
.dd-native { display: none !important; }

.dd-select {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    height: 2.25rem;
    padding: 0 .75rem;
    font-size: .875rem;
    line-height: 1.25rem;
    text-align: start;
    color: var(--dd-fg);
    background-color: transparent;
    border: 1px solid var(--dd-input-border);
    border-radius: var(--dd-radius);
    cursor: pointer;
    transition: border-color .15s cubic-bezier(.4, 0, .2, 1), box-shadow .15s cubic-bezier(.4, 0, .2, 1), background-color .15s cubic-bezier(.4, 0, .2, 1);
}

.dd-select:hover { background-color: var(--dd-accent); }
.dd-select:focus { outline: none; }
.dd-select:focus-visible,
.dd-select[aria-expanded="true"] { border-color: var(--dd-ring); box-shadow: 0 0 0 1px var(--dd-ring); }
.dd-select-value { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dd-select-chevron { flex-shrink: 0; width: .625rem; height: .625rem; fill: currentColor; opacity: .6; transition: transform .15s cubic-bezier(.4, 0, .2, 1); }
.dd-select[aria-expanded="true"] .dd-select-chevron { transform: rotate(180deg); }

.dd-list {
    position: fixed;
    z-index: 1062;
    min-width: 8rem;
    max-height: 16rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: .25rem;
    font-size: .875rem;
    color: var(--dd-fg);
    background-color: var(--dd-bg);
    border: 1px solid var(--dd-border);
    border-radius: var(--dd-radius);
    box-shadow: var(--dd-shadow);
    scrollbar-width: thin;
    transform-origin: top center;
    animation: dd-show .15s var(--dd-ease);
}

.dd-list.dd-up { transform-origin: bottom center; --dd-shift: 4px; }
.dd-list.dd-closing { animation: dd-hide 75ms cubic-bezier(.4, 0, 1, 1) forwards; pointer-events: none; }

.dd-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .5rem .75rem;
    white-space: nowrap;
    border-radius: calc(var(--dd-radius) - 2px);
    cursor: pointer;
    user-select: none;
    outline: none;
    transition: background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}

.dd-option:hover,
.dd-option:focus { color: var(--dd-accent-fg); background-color: var(--dd-accent); }
.dd-option[aria-selected="true"] { font-weight: 500; }
.dd-option[aria-disabled="true"] { opacity: .5; pointer-events: none; }
.dd-option-check { flex-shrink: 0; width: 1rem; height: 1rem; fill: var(--dd-ring); visibility: hidden; }
.dd-option[aria-selected="true"] .dd-option-check { visibility: visible; }

/* Выбор периода на странице статистики */
.daterangepicker {
    margin-top: .5rem;
    font-size: .875rem;
    background-color: var(--dd-bg);
    border: 1px solid var(--dd-border);
    border-radius: var(--dd-radius);
    box-shadow: var(--dd-shadow);
    transform-origin: top right;
    animation: dd-show .15s var(--dd-ease);
}

.daterangepicker.opensright { transform-origin: top left; }
.daterangepicker.drop-up { margin-top: -.5rem; transform-origin: bottom right; --dd-shift: 4px; }
.daterangepicker .ranges ul { padding: .25rem; }

.daterangepicker .ranges li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .5rem .75rem;
    font-size: .875rem;
    border-radius: calc(var(--dd-radius) - 2px);
    transition: background-color .15s cubic-bezier(.4, 0, .2, 1);
}

.daterangepicker .ranges li:hover,
.daterangepicker .ranges li:focus,
.daterangepicker .ranges li.active { color: var(--dd-fg); background-color: var(--dd-accent); }
.daterangepicker .ranges li.active { font-weight: 500; }

.daterangepicker .ranges li.active::after {
    content: "";
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    margin-left: .75rem;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236091fb' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center / 1rem no-repeat;
}

.daterangepicker .drp-buttons,
.daterangepicker.show-ranges.ltr .drp-calendar.left,
.daterangepicker.show-ranges.rtl .drp-calendar.left { border-color: var(--dd-border); }

#date-range-selector .d-flex > svg:last-child { transition: transform .15s cubic-bezier(.4, 0, .2, 1); }
#date-range-selector.active .d-flex > svg:last-child { transform: rotate(180deg); }

/* Телефоны: крупнее пункты, окно фильтров не шире экрана */
@media (max-width: 640px) {
    .dropdown-item,
    .dd-option,
    .daterangepicker .ranges li { padding: .625rem .75rem; }
    #search-filters { width: min(16rem, calc(100vw - 2rem)) !important; }
    #search-filters .max-height-96 { max-height: min(24rem, 60vh) !important; }
    .dd-list { max-height: 50vh; }
}

@media (prefers-reduced-motion: reduce) {
    .dropdown-menu.show,
    .dropdown-menu.dd-closing,
    .dd-list,
    .daterangepicker { animation: none !important; }
    .dd-select-chevron,
    #date-range-selector .d-flex > svg:last-child { transition: none; }
}
