/* =========================
   SIDEBAR BASE
========================= */

.fi-sidebar {
    background-color: #071b25;
    /* The sidebar is always dark, so its native scrollbar follows it in light mode too. */
    color-scheme: dark;
}

.fi-sidebar .fi-sidebar-nav {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
}

.fi-sidebar-header {
    background-color: transparent;
}

/* =========================
   NAVIGATION GROUP
========================= */

.fi-sidebar .fi-navigation-group-items {
    padding-left: 0;
    padding-right: 0;
}

/* =========================
   SIDEBAR ITEMS
========================= */

.fi-sidebar .fi-sidebar-item {
    padding-left: 0;
    padding-right: 0;
}

.fi-sidebar .fi-sidebar-item-btn {
    width: 100%;
    margin: 0;
    border-radius: 0;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    position: relative;
}

/* =========================
   CHILD ENTRIES — under Recenzii, Pagini, Jurnale: indented, with their own icon
========================= */

.fi-sidebar .fi-sidebar-sub-group-items .fi-sidebar-item-btn {
    padding-left: 2.5rem;
}

/* =========================
   TEXT & ICONS
========================= */

.fi-sidebar .fi-sidebar-item-label {
    color: rgba(255, 255, 255, 0.92);
}

.fi-sidebar .fi-sidebar-item-btn .fi-icon {
    color: rgba(255, 255, 255, 0.6);
}

/* =========================
   HOVER
========================= */

.fi-sidebar .fi-sidebar-item-btn:hover {
    background-color: rgba(255, 255, 255, 0.03);
}

/* =========================
   ACTIVE STATE
========================= */

.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background-color: rgba(255, 255, 255, 0.07);
}

/* 🔥 ВЕРТИКАЛЬНАЯ ЛИНИЯ СЛЕВА */
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    bottom: 8px;
    width: 3px;
    background-color: #c4a97d; /* gold accent */
    border-radius: 0 2px 2px 0;
}

/* Активная иконка */
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon {
    color: #ffffff;
}

/* =========================
   GLOBAL SEARCH — the sidebar is dark in both themes, so is its search box
========================= */

.fi-sidebar .fi-global-search-field .fi-input-wrp {
    background-color: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

.fi-sidebar .fi-global-search-field input.fi-input {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

/* One class more than filament-global's prefix rule, which loads later with the same weight. */
.fi-sidebar .fi-global-search-field .fi-input-wrp .fi-input-wrp-prefix,
.fi-sidebar .fi-global-search-field .fi-input-wrp .fi-input-wrp-suffix {
    background-color: transparent !important;
}

.fi-sidebar .fi-global-search-field input.fi-input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.fi-sidebar .fi-global-search-field .fi-icon {
    color: rgba(255, 255, 255, 0.6);
}

/* =========================
   NOTIFICATIONS TRIGGER — same colours as the items above it
========================= */

.fi-sidebar .fi-sidebar-database-notifications-btn > .fi-sidebar-database-notifications-btn-label {
    color: rgba(255, 255, 255, 0.92);
}

.fi-sidebar .fi-sidebar-database-notifications-btn > .fi-icon {
    color: rgba(255, 255, 255, 0.6);
}

.fi-sidebar .fi-sidebar-database-notifications-btn:hover {
    background-color: rgba(255, 255, 255, 0.03);
}

/* =========================
   LOGO
========================= */

.fi-sidebar .fi-logo img,
.fi-sidebar .fi-logo svg {
    filter: brightness(0) invert(1) contrast(1.1);
}

.fi-sidebar .fi-sidebar-item-btn::before {
    transition: all .2s ease;
}

.fi-sidebar .fi-sidebar-item-btn:hover::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background-color: #c4a97d;
}
.fi-sidebar .fi-navigation-group {
    margin-bottom: .75rem;
}

.fi-sidebar .fi-sidebar-item-btn-inner {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.fi-sidebar .fi-sidebar-item-btn {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

/* ===== FIX: GROUP LABEL FULL WIDTH ===== */

.fi-sidebar .fi-navigation-group {
    position: relative;
    padding-left: 0;
    padding-right: 0;
}

/* Визуальный фон на всю ширину sidebar */
.fi-sidebar .fi-navigation-group-label {
    position: relative;
    padding: 0.75rem 1.25rem;
    z-index: 1;
}

/* Фон, который ВЫХОДИТ за контейнер */
.fi-sidebar .fi-navigation-group-label::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: -9999px;
    right: -9999px;
    background-color: rgba(255, 255, 255, 0.04);
    z-index: -1;
}

/* Левая вертикальная линия */
.fi-sidebar .fi-navigation-group-label::before {
    content: '';
    position: absolute;
    left: -9999px;
    top: 6px;
    bottom: 6px;
    width: 3px;
    background-color: #c4a97d;
}

.fi-sidebar .fi-navigation {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.fi-sidebar .fi-sidebar-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.fi-sidebar .fi-sidebar-item.fi-active .fi-icon svg {
    color: #ffffff;
    filter: drop-shadow(0 0 4px rgba(198, 166, 106, 0.4));
}

/* Контейнер табов */
.subscription-days-tabs .fi-tabs {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr);
    gap: 12px;
}

/* Каждый день */
.subscription-days-tabs .fi-tabs-item {
    height: 90px;                 /* ВЫСОТА */
    border-radius: 16px;
    justify-content: center;
    align-items: center;
    padding: 12px;
}

/* Текст внутри */
.subscription-days-tabs .fi-tabs-item-label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
}

/* Активный день */
.subscription-days-tabs .fi-tabs-item.fi-active {
    background-color: #e9f9ee !important;
    border: 1px solid #b6e2c2;
}

/* Hover */
.subscription-days-tabs .fi-tabs-item:hover {
    background-color: #f5f5f5;
}
