/* Логотип светлый, боковая панель Tailadmin чёрная. */
.logo-on-dark { filter: brightness(0) invert(1); height: 46px; width: auto; }
[x-cloak] { display: none !important; }
.hint-bubble {
    width: 200px;
    font-size: 12px;
    padding: 10px 18px;
    pointer-events: none;
    transition: opacity 0.12s ease;
}
/* Клик/фокус по кнопке с вопросом тоже открывает подсказку. */
.group:focus-within .hint-bubble {
    opacity: 1;
}

/* Кружок подсказки «?»: явный класс вместо произвольного Tailwind-значения,
   которое не попало в собранный tailadmin.css. */
.hint-dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 9999px;
    background: #1c2434;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

/* Цвета графика задаются здесь, а не в JS: класс dark на <body> переключает переменные,
   и тема «наследуется» вниз по дереву через каскад CSS. */
body {
    --chart-axis: #64748b;
    --chart-grid: #e2e8f0;
}
body.dark {
    --chart-axis: #dee4ee;
    --chart-grid: #2e3a47;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover {
    background: #354175;
    border-color: #354175;
    color: #fff;
}
.dark .flatpickr-calendar {
    background: #24303f;
    color: #dee4ee;
    border-color: #2e3a47;
}