.text-center { text-align: center; }
.w-100 { width: 100%; }
.topbar-search { padding: 0.5rem 1rem; width: 350px; border: 1px solid var(--c-beige-light); border-radius: 2px; font-family: 'Lato', sans-serif; }
.sidebar-separator { margin-top: 2rem; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1rem; }

/* Dashboard & Topbar */
.notif-btn { position: relative; background: transparent; border: none; cursor: pointer; padding: 8px; color: var(--c-blue-grey); outline: none; transition: color var(--trans-fast); }
.notif-btn:hover { color: var(--c-marine); }
.notif-indicator { position: absolute; top: 6px; right: 8px; width: 10px; height: 10px; background-color: var(--c-danger); border-radius: 50%; border: 2px solid #fff; }
.notif-dropdown { width: 320px; padding: 0; }
.notif-dropdown-header { padding: 16px 20px; border-bottom: 1px solid var(--c-beige-light); display: flex; justify-content: space-between; align-items: center; }
.notif-dropdown-body { max-height: 350px; overflow-y: auto; }
.notif-item { display: flex; gap: 16px; padding: 16px 20px; border-bottom: 1px solid rgba(234, 226, 215, 0.4); text-decoration: none; color: inherit; transition: background var(--trans-fast); }
.notif-item:hover { background-color: var(--c-beige-bg); }
.notif-item-icon { width: 36px; height: 36px; background: var(--c-danger-bg); color: var(--c-danger); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.user-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--c-gold); color: white; display: flex; align-items: center; justify-content: center; font-family: 'Playfair Display', serif; font-size: 14px; margin-left: 8px; font-weight: bold; }
.activity-feed-list { list-style: none; padding: 0; margin: 0; }
.activity-item a { display: flex; gap: 16px; padding: 16px 25px; border-bottom: 1px solid rgba(234, 226, 215, 0.4); text-decoration: none; color: inherit; transition: background var(--trans-fast); }
.activity-item a:hover { background-color: var(--c-beige-bg); }
.activity-icon-wrapper { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border-radius: 50%; flex-shrink: 0; font-size: 1.2rem; }
.activity-details { flex-grow: 1; overflow: hidden; }

/* Klick-Dropdowns & Selects */
.dropdown-wrapper { position: relative; display: inline-block; }
.dropdown-menu { display: none; position: absolute; top: calc(100% + 8px); right: 0; left: auto; background: #fff; min-width: 240px; box-shadow: 0 10px 25px rgba(26,58,83,0.15); border: 1px solid var(--c-beige-light); border-radius: var(--radius-md); z-index: 1000; padding: 0.5rem 0; }
.dropdown-menu.show { display: block; animation: dropFade 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
@keyframes dropFade { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }
.dropdown-menu button { width: 100%; text-align: left; background: none; border: none; padding: 0.6rem 1.2rem; font-size: 0.85rem; color: var(--c-text); cursor: pointer; display: flex; align-items: center; gap: 0.5rem; font-family: inherit; transition: background var(--trans-fast); }
.dropdown-menu button:hover { background: var(--c-beige-bg); color: var(--c-marine); }
.dropdown-menu button i, .dropdown-menu button svg { color: var(--c-blue-grey); width: 16px; transition: color 0.2s; }
.dropdown-menu button:hover i, .dropdown-menu button:hover svg { color: var(--c-marine); }

.actionbar-select { appearance: none; -webkit-appearance: none; background: var(--c-beige-bg) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%231A3A53" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>') no-repeat right 10px center; padding: 6px 32px 6px 12px; border: 1px solid var(--c-beige-light); border-radius: 20px; font-weight: 700; color: var(--c-marine); cursor: pointer; font-family: inherit; font-size: 0.85rem; transition: all var(--trans-fast); outline: none; box-shadow: 0 1px 3px rgba(0,0,0,0.02); }
.actionbar-select:hover, .actionbar-select:focus { background-color: #fff; border-color: var(--c-blue-grey); box-shadow: 0 3px 6px rgba(0,0,0,0.05); }

/* Hover Dropdowns (Makros) */
.hover-dropdown-content { display: none; position: absolute; background-color: #fff; min-width: 240px; box-shadow: var(--shadow-hover); border-radius: var(--radius-sm); z-index: 200; top: 100%; right: 0; border: 1px solid var(--c-beige-light); padding: 0.5rem 0; overflow: hidden; }
.hover-dropdown:hover .hover-dropdown-content { display: block; animation: fadeIn 0.2s ease; }
.hover-dropdown-content button { width: 100%; text-align: left; background: none !important; border: none !important; padding: 0.6rem 1rem; font-size: 0.85rem; color: var(--c-text); cursor: pointer; display: flex; align-items: center; gap: 0.5rem; font-family: inherit; transition: all var(--trans-fast); }
.hover-dropdown-content button:hover { background-color: var(--c-beige-bg) !important; color: var(--c-marine); padding-left: 1.2rem; }
.hover-dropdown-content button i, .hover-dropdown-content button svg { color: var(--c-blue-grey); transition: color var(--trans-fast); }
.hover-dropdown-content button:hover i, .hover-dropdown-content button:hover svg { color: var(--c-marine); }

/* Omni Search & Modals */
.omni-search-results { position: absolute; top: calc(100% + 10px); left: 0; width: 100%; min-width: 500px; background: #fff; border-radius: var(--radius-md); box-shadow: 0 15px 35px rgba(26, 58, 83, 0.2); border: 1px solid var(--c-beige-light); z-index: 2000; overflow: hidden; display: none; }
.omni-search-results.active { display: block; animation: dropFade 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
.omni-search-group { padding: 0.5rem 0; border-bottom: 1px solid var(--c-beige-light); }
.omni-search-group:last-child { border-bottom: none; }
.omni-search-title { font-size: 0.7rem; text-transform: uppercase; font-weight: 800; color: var(--c-blue-grey); padding: 0.5rem 1.2rem; letter-spacing: 0.5px; }
.omni-search-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 1.2rem; color: var(--c-text); text-decoration: none; transition: background var(--trans-fast); cursor: pointer; }
.omni-search-item:hover { background: var(--c-beige-bg); color: var(--c-marine); }
.omni-search-item i, .omni-search-item svg { width: 16px; color: var(--c-blue-grey); }
.omni-search-empty { padding: 2rem; text-align: center; color: var(--c-blue-grey); font-size: 0.85rem; }

.modal-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(26, 58, 83, 0.4); backdrop-filter: blur(2px); display: flex; align-items: center; justify-content: center; z-index: 9999; opacity: 0; visibility: hidden; transition: all 0.2s ease-out; }
.modal-overlay.active { opacity: 1; visibility: visible; }
.modal-content { background: #fff; width: 100%; max-width: 500px; border-radius: var(--radius-md); padding: 2rem; box-shadow: var(--shadow-panel); transform: translateY(-20px) scale(0.98); transition: all 0.2s ease-out; border-top: 4px solid var(--c-marine); position: relative; }
.modal-overlay.active .modal-content { transform: translateY(0) scale(1); }
.modal-input { padding: 8px; box-sizing: border-box; }

/* --- MOBILE WEICHE: GLOBALE KOMPONENTEN --- */
@media (max-width: 768px) {
    /* 1. Dashboard Grids (KPIs) untereinander stapeln */
    .grid-2, .grid-4, .grid-profile { display: grid !important; grid-template-columns: 1fr !important; gap: 15px !important; }
    
    /* 2. Tabellen wischbar machen, Texte umbrechen lassen */
    .table-responsive { display: block !important; width: 100% !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
    .table th, .table td { white-space: normal !important; min-width: 120px !important; padding: 12px 10px !important; }
    
    /* 3. Modals & Popups optimieren */
    .modal-content { width: 95vw !important; max-width: 100% !important; padding: 20px !important; margin: 10px auto !important; max-height: 90vh !important; overflow-y: auto !important; }
    
    /* 4. Dropdowns als Apple Bottom-Sheet (Slidet von unten rein) */
    .dropdown-menu { position: fixed !important; top: auto !important; bottom: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; min-width: 100% !important; border-radius: 20px 20px 0 0 !important; padding: 20px 10px 30px 10px !important; max-height: 85vh !important; overflow-y: auto !important; box-shadow: 0 -10px 40px rgba(0,0,0,0.2) !important; }
}