/* ================================================
   GRDU Cockpit – Custom Theme
   Dark & Premium + Clean Light Mode
   Violet Accent, Inter Font
   ================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ------------------------------------------------
   Basis (beide Modi)
   ------------------------------------------------ */
body,
.fi-body {
    font-family: 'Inter', sans-serif !important;
}

.fi-header-heading {
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.03em !important;
}

.fi-badge {
    border-radius: 8px !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em !important;
}

.fi-sidebar-item-button {
    border-radius: 10px !important;
    transition: all 0.2s ease !important;
}

.fi-ta-header-cell {
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

.fi-btn-primary {
    background: linear-gradient(135deg, #7c3aed, #6366f1) !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.35) !important;
    transition: all 0.2s ease !important;
}

.fi-btn-primary:hover {
    background: linear-gradient(135deg, #8b5cf6, #818cf8) !important;
    box-shadow: 0 6px 24px rgba(124, 58, 237, 0.55) !important;
    transform: translateY(-1px) !important;
}

/* Scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(139, 92, 246, 0.45); }


/* ================================================
   DARK MODE
   ================================================ */
.dark ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); }

/* Hintergrund */
.dark .fi-body.fi-panel-admin {
    background-color: #0a0c12 !important;
}

.dark .fi-main {
    background-color: transparent !important;
    position: relative !important;
}

/* Atmosphärische Orbs */
.dark .fi-main::before,
.dark .fi-main::after {
    content: '' !important;
    position: fixed !important;
    border-radius: 50% !important;
    filter: blur(120px) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}
.dark .fi-main::before {
    width: 600px !important; height: 600px !important;
    background: radial-gradient(circle, rgba(109,40,217,0.12) 0%, transparent 70%) !important;
    top: -100px !important; right: 10% !important;
}
.dark .fi-main::after {
    width: 500px !important; height: 500px !important;
    background: radial-gradient(circle, rgba(59,130,246,0.08) 0%, transparent 70%) !important;
    bottom: 10% !important; left: 5% !important;
}
.dark .fi-main > * { position: relative !important; z-index: 1 !important; }

/* Sidebar */
.dark .fi-sidebar {
    background: linear-gradient(180deg, #0e1018 0%, #0c0e16 100%) !important;
    border-right: 1px solid rgba(255,255,255,0.06) !important;
}
.dark .fi-sidebar-nav-groups { padding: 0.5rem 0.75rem !important; }
.dark .fi-sidebar-item-button:hover { background: rgba(255,255,255,0.05) !important; }
.dark .fi-sidebar-item-active > .fi-sidebar-item-button {
    background: linear-gradient(135deg, rgba(139,92,246,0.2), rgba(99,102,241,0.1)) !important;
    border: 1px solid rgba(139,92,246,0.25) !important;
    box-shadow: 0 0 20px rgba(139,92,246,0.1) !important;
}
.dark .fi-sidebar-group-label {
    font-size: 0.65rem !important; font-weight: 700 !important;
    letter-spacing: 0.12em !important; text-transform: uppercase !important;
    color: rgba(255,255,255,0.25) !important;
}

/* Topbar */
.dark .fi-topbar {
    background: rgba(10,12,18,0.75) !important;
    backdrop-filter: blur(16px) !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

/* Stats Widgets */
.dark .fi-wi-stats-overview {
    background: transparent !important; border: none !important;
    box-shadow: none !important; padding: 0 !important;
}
.dark .fi-wi-stats-overview-stat {
    background: linear-gradient(145deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255,255,255,0.09) !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.08) !important;
    position: relative !important; overflow: hidden !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.dark .fi-wi-stats-overview-stat::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(139,92,246,0.4), transparent) !important;
    z-index: 2 !important;
}
.dark .fi-wi-stats-overview-stat:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(139,92,246,0.2) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.1) !important;
}
.dark .fi-wi-stats-overview-stat-label {
    font-size: 0.7rem !important; font-weight: 600 !important;
    letter-spacing: 0.07em !important; text-transform: uppercase !important;
    color: rgba(255,255,255,0.4) !important;
}
.dark .fi-wi-stats-overview-stat-value {
    font-size: 2rem !important; font-weight: 700 !important; letter-spacing: -0.02em !important;
}

/* Tabellen-Widgets */
.dark .fi-wi-table,
.dark .fi-wi-widget.fi-wi-table {
    background: linear-gradient(145deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.07) !important;
    overflow: hidden !important; position: relative !important;
}
.dark .fi-wi-table::before {
    content: '' !important; position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(139,92,246,0.4), transparent) !important;
    z-index: 2 !important;
}
.dark .fi-wi-table .fi-ta-ctn {
    background: transparent !important; box-shadow: none !important; border-radius: 0 !important;
}

/* Tabellen-Container */
.dark .fi-ta-ctn:not(.fi-wi-table .fi-ta-ctn) {
    background: linear-gradient(145deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.07) !important;
    overflow: hidden !important; position: relative !important;
}
.dark .fi-ta-ctn:not(.fi-wi-table .fi-ta-ctn)::before {
    content: '' !important; position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(139,92,246,0.4), transparent) !important;
    z-index: 2 !important;
}

.dark .fi-ta-header, .dark .fi-ta-toolbar {
    background: transparent !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
.dark .fi-ta-table thead tr {
    background: rgba(255,255,255,0.03) !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}
.dark .fi-ta-table thead tr th { background: rgba(255,255,255,0.03) !important; }
.dark .fi-ta-table { border-radius: 0 !important; overflow: hidden !important; }
.dark .fi-ta-table th, .dark .fi-ta-table td { background-color: transparent !important; }
.dark .fi-ta-cell, .dark td { border-color: rgba(255,255,255,0.04) !important; }
.dark .fi-ta-table tbody tr:hover td { background-color: rgba(139,92,246,0.07) !important; }
.dark .fi-ta-footer { background: transparent !important; border-top: 1px solid rgba(255,255,255,0.06) !important; }
.dark .fi-ta-header-cell { color: rgba(255,255,255,0.35) !important; }

.dark .fi-ta-col-toggle-trigger-btn, .dark .fi-dropdown-trigger {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 8px !important;
}
.dark .fi-ta-col-toggle-trigger-btn:hover, .dark .fi-dropdown-trigger:hover {
    background: rgba(139,92,246,0.15) !important;
    border-color: rgba(139,92,246,0.3) !important;
}

/* Grid-Karten */
.dark .fi-ta-record {
    background: linear-gradient(145deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.4) !important;
    position: relative !important; overflow: hidden !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.dark .fi-ta-record::before {
    content: '' !important; position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; height: 2px !important;
    background: linear-gradient(90deg, transparent, rgba(139,92,246,0.8), transparent) !important;
    opacity: 0 !important; transition: opacity 0.25s ease !important; z-index: 2 !important;
}
.dark .fi-ta-record:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(139,92,246,0.25) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
.dark .fi-ta-record:hover::before { opacity: 1 !important; }

/* Form Sections */
.dark .fi-sc-section { background: transparent !important; border-radius: 18px !important; overflow: hidden !important; position: relative !important; }
.dark .fi-sc-section > .fi-section,
.dark .fi-section {
    background: linear-gradient(145deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255,255,255,0.07) !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.05) !important;
    overflow: hidden !important; position: relative !important;
}
.dark .fi-sc-section > .fi-section::before,
.dark .fi-section::before {
    content: '' !important; position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(139,92,246,0.4), transparent) !important;
    z-index: 2 !important;
}
.dark .fi-section-header {
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    background: rgba(255,255,255,0.02) !important;
}
.dark .fi-section-content-ctn, .dark .fi-section-content { background: transparent !important; }

/* fi-section innerhalb der Stats-Overview: keine eigene Box */
.dark .fi-wi-stats-overview .fi-section {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    padding: 0 !important;
}
.dark .fi-wi-stats-overview .fi-section::before {
    content: none !important;
}

/* Modal */
.dark .fi-modal-window {
    background: linear-gradient(145deg, #141820, #0f1219) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 80px rgba(0,0,0,0.7) !important;
}

/* Formularfelder */
.dark .fi-fo-field-wrp .fi-input-wrp {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 10px !important;
}
.dark .fi-fo-field-wrp .fi-input-wrp:focus-within {
    border-color: rgba(139,92,246,0.5) !important;
    box-shadow: 0 0 0 3px rgba(139,92,246,0.1) !important;
}
.dark .fi-fo-field-wrp .fi-input { background: transparent !important; border: none !important; box-shadow: none !important; }

/* Suchfelder */
.dark .fi-global-search-field .fi-input-wrp,
.dark .fi-ta-search-field .fi-input-wrp {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 10px !important;
}
.dark .fi-global-search-field .fi-input-wrp:focus-within,
.dark .fi-ta-search-field .fi-input-wrp:focus-within {
    border-color: rgba(139,92,246,0.5) !important;
    box-shadow: 0 0 0 3px rgba(139,92,246,0.1) !important;
}
.dark .fi-global-search-field .fi-input,
.dark .fi-ta-search-field .fi-input { background: transparent !important; border: none !important; }


/* ================================================
   LIGHT MODE
   ================================================ */

/* Hintergrund */
.fi-body.fi-panel-admin:not(.dark .fi-body) {
    background-color: #f1f4f9 !important;
}

html:not(.dark) .fi-body.fi-panel-admin {
    background-color: #f1f4f9 !important;
}

/* Sidebar */
html:not(.dark) .fi-sidebar {
    background: #ffffff !important;
    border-right: 1px solid rgba(0,0,0,0.08) !important;
    box-shadow: 2px 0 12px rgba(0,0,0,0.05) !important;
}
html:not(.dark) .fi-sidebar-item-button:hover {
    background: rgba(124,58,237,0.07) !important;
}
html:not(.dark) .fi-sidebar-item-active > .fi-sidebar-item-button {
    background: linear-gradient(135deg, rgba(124,58,237,0.12), rgba(99,102,241,0.08)) !important;
    border: 1px solid rgba(124,58,237,0.2) !important;
}
html:not(.dark) .fi-sidebar-group-label {
    font-size: 0.65rem !important; font-weight: 700 !important;
    letter-spacing: 0.12em !important; text-transform: uppercase !important;
    color: rgba(0,0,0,0.35) !important;
}

/* Topbar */
html:not(.dark) .fi-topbar {
    background: rgba(255,255,255,0.85) !important;
    backdrop-filter: blur(16px) !important;
    border-bottom: 1px solid rgba(0,0,0,0.08) !important;
    box-shadow: 0 1px 8px rgba(0,0,0,0.06) !important;
}

/* Stats Widgets */
html:not(.dark) .fi-wi-stats-overview {
    background: transparent !important; border: none !important; box-shadow: none !important;
}
html:not(.dark) .fi-wi-stats-overview-stat {
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
}
html:not(.dark) .fi-wi-stats-overview-stat-label {
    font-size: 0.7rem !important; font-weight: 600 !important;
    letter-spacing: 0.07em !important; text-transform: uppercase !important;
    color: rgba(0,0,0,0.4) !important;
}
html:not(.dark) .fi-wi-stats-overview-stat-value {
    font-size: 2rem !important; font-weight: 700 !important;
}

/* Tabellen-Container */
html:not(.dark) .fi-ta-ctn {
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
    overflow: hidden !important;
}
html:not(.dark) .fi-ta-header, html:not(.dark) .fi-ta-toolbar {
    background: transparent !important;
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}
html:not(.dark) .fi-ta-table thead tr {
    background: rgba(0,0,0,0.02) !important;
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}
html:not(.dark) .fi-ta-table th, html:not(.dark) .fi-ta-table td { background-color: transparent !important; }
html:not(.dark) .fi-ta-cell, html:not(.dark) td { border-color: rgba(0,0,0,0.05) !important; }
html:not(.dark) .fi-ta-table tbody tr:hover td { background-color: rgba(124,58,237,0.04) !important; }
html:not(.dark) .fi-ta-footer { background: transparent !important; border-top: 1px solid rgba(0,0,0,0.06) !important; }
html:not(.dark) .fi-ta-header-cell { color: rgba(0,0,0,0.4) !important; }

html:not(.dark) .fi-ta-col-toggle-trigger-btn,
html:not(.dark) .fi-dropdown-trigger {
    background: rgba(0,0,0,0.04) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    border-radius: 8px !important;
}
html:not(.dark) .fi-ta-col-toggle-trigger-btn:hover,
html:not(.dark) .fi-dropdown-trigger:hover {
    background: rgba(124,58,237,0.08) !important;
    border-color: rgba(124,58,237,0.25) !important;
}

/* Tabellen-Widgets */
html:not(.dark) .fi-wi-table,
html:not(.dark) .fi-wi-widget.fi-wi-table {
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
    overflow: hidden !important;
}
html:not(.dark) .fi-wi-table .fi-ta-ctn {
    background: transparent !important; box-shadow: none !important;
    border: none !important; border-radius: 0 !important;
}

/* Grid-Karten */
html:not(.dark) .fi-ta-record {
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
html:not(.dark) .fi-ta-record:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(124,58,237,0.2) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important;
}

/* Form Sections */
html:not(.dark) .fi-sc-section { background: transparent !important; border-radius: 18px !important; overflow: hidden !important; }
html:not(.dark) .fi-sc-section > .fi-section,
html:not(.dark) .fi-section {
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
    overflow: hidden !important;
}
html:not(.dark) .fi-section-header {
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
    background: rgba(0,0,0,0.01) !important;
}
html:not(.dark) .fi-section-content-ctn,
html:not(.dark) .fi-section-content { background: transparent !important; }

/* Modal */
html:not(.dark) .fi-modal-window {
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 20px !important;
    box-shadow: 0 16px 60px rgba(0,0,0,0.15) !important;
}

/* Formularfelder */
html:not(.dark) .fi-fo-field-wrp .fi-input-wrp {
    background: #f8fafc !important;
    border: 1px solid rgba(0,0,0,0.12) !important;
    border-radius: 10px !important;
}
html:not(.dark) .fi-fo-field-wrp .fi-input-wrp:focus-within {
    border-color: rgba(124,58,237,0.5) !important;
    box-shadow: 0 0 0 3px rgba(124,58,237,0.1) !important;
}
html:not(.dark) .fi-fo-field-wrp .fi-input { background: transparent !important; border: none !important; box-shadow: none !important; }

/* Suchfelder */
html:not(.dark) .fi-global-search-field .fi-input-wrp,
html:not(.dark) .fi-ta-search-field .fi-input-wrp {
    background: rgba(0,0,0,0.04) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    border-radius: 10px !important;
}
html:not(.dark) .fi-global-search-field .fi-input-wrp:focus-within,
html:not(.dark) .fi-ta-search-field .fi-input-wrp:focus-within {
    border-color: rgba(124,58,237,0.4) !important;
    box-shadow: 0 0 0 3px rgba(124,58,237,0.08) !important;
}
html:not(.dark) .fi-global-search-field .fi-input,
html:not(.dark) .fi-ta-search-field .fi-input { background: transparent !important; border: none !important; }

/* ------------------------------------------------
   Light Mode – hardcodierte weiße Farben in Blade-Views
   ------------------------------------------------ */

/* date inputs & selects in Filterleiste */
html:not(.dark) input[type="date"] {
    color: #1e293b !important;
    color-scheme: light !important;
}
html:not(.dark) select option {
    background: #ffffff !important;
    color: #1e293b !important;
}

/* Alle inline-style Texte die weiß sind → dunkel */
html:not(.dark) [style*="color: rgba(255,255,255,0.4)"] { color: rgba(0,0,0,0.45) !important; }
html:not(.dark) [style*="color: rgba(255,255,255,0.35)"] { color: rgba(0,0,0,0.4) !important; }
html:not(.dark) [style*="color: rgba(255,255,255,0.3)"] { color: rgba(0,0,0,0.35) !important; }
html:not(.dark) [style*="color: rgba(255,255,255,0.2)"] { color: rgba(0,0,0,0.25) !important; }
html:not(.dark) [style*="color: white"] { color: #1e293b !important; }

/* Inline-Hintergründe die dunkel sind → hell */
html:not(.dark) [style*="background: rgba(255,255,255,0.06)"] { background: rgba(0,0,0,0.05) !important; }
html:not(.dark) [style*="background: rgba(255,255,255,0.04)"] { background: rgba(0,0,0,0.03) !important; }
html:not(.dark) [style*="border: 1px solid rgba(255,255,255,0.1)"] { border-color: rgba(0,0,0,0.12) !important; }
html:not(.dark) [style*="border: 1px solid rgba(255,255,255,0.07)"] { border-color: rgba(0,0,0,0.08) !important; }
html:not(.dark) [style*="width: 1px"][style*="background: rgba(255,255,255,0.1)"] { background: rgba(0,0,0,0.1) !important; }

/* Tabellen-Header in custom Blade-Tabellen */
html:not(.dark) [style*="background: rgba(255,255,255,0.04)"] { background: rgba(0,0,0,0.03) !important; }
html:not(.dark) [style*="border-bottom: 1px solid rgba(255,255,255,0.07)"] { border-color: rgba(0,0,0,0.07) !important; }
html:not(.dark) [style*="border-bottom: 1px solid rgba(255,255,255,0.04)"] { border-color: rgba(0,0,0,0.05) !important; }

/* ------------------------------------------------
   Topbar Layout
   ------------------------------------------------ */

/* Mehr Luft in der Topbar */
.fi-topbar {
    padding-inline: 1.25rem !important;
    height: 3.75rem !important;
}

/* End-Bereich nach rechts */
.fi-topbar-end {
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

/* Suche zentriert */
.fi-topbar { position: relative !important; }
.fi-global-search-ctn {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 320px !important;
    margin: 0 !important;
    z-index: 1 !important;
}

/* Quick-Create, Bell, Avatar eng zusammen */
.fi-topbar-end > div:has(button) { margin-left: 0 !important; }
.fi-topbar-end > [wire\:id]:has(.fi-no-database) { margin-left: 0.75rem !important; }
.fi-no-database { margin-right: 20px !important; }
.fi-user-menu { margin-left: 0.6rem !important; }

/* Global Search abgerundeter */
.fi-global-search-field {
    border-radius: 0.6rem !important;
}

/* ------------------------------------------------
   Notification Bell
   ------------------------------------------------ */

/* Badge (Anzahl ungelesener) */
.fi-no-database .fi-badge {
    background: #7c3aed !important;
    color: white !important;
    font-weight: 700 !important;
    box-shadow: 0 0 8px rgba(124,58,237,0.7) !important;
    animation: badge-pulse 2s ease-in-out infinite !important;
}

@keyframes badge-pulse {
    0%, 100% { box-shadow: 0 0 6px rgba(124,58,237,0.6); }
    50%       { box-shadow: 0 0 14px rgba(124,58,237,0.9); }
}

/* Glocken-Button selbst hervorheben wenn ungelesene vorhanden */
.fi-no-database-trigger-btn {
    position: relative;
}

/* Ungelesene Notification in der Liste */
.fi-no-notification-unread-ctn {
    border-left: 3px solid #7c3aed !important;
    background: rgba(124,58,237,0.06) !important;
}

/* Notification-Icon Farbe */
.fi-no-notification-unread-ctn .fi-no-notification-icon {
    color: #a78bfa !important;
}