/* ============================================================
   CMS Intranet   Stylesheet v2.0
   Umstrukturiert Juli 2026: global -> layout -> komponenten ->
   sonderformate -> seiten-spezifisch -> dark-mode-uebersteuerung.
   Reine Umsortierung + Kommentare, keine Werte veraendert.
   ============================================================ */

/* Aufgeteilt Sept 2026: Plugin-CSS -> plugins/css/*.css,
   Themes -> assets/css/themes/*.css (geladen via includes/theme.php).
   Werte unveraendert uebernommen, Ausnahmen siehe DEPLOY.md. */

/* ============================================================
   1. GLOBALE VARIABLEN
   ============================================================ */

/* -- 1.1 Farben, Radien, Schatten (Light) -- */
:root {
  --sidebar-w:     240px;
  --topbar-h:      56px;
  --sidebar-bg:    #1a1f36;
  --sidebar-hover: #2d3561;
  --sidebar-active:#4a6cf7;
  --accent:        #4a6cf7;
  --accent-dark:   #3a5ce5;
  --text:          #1e2025;
  --text-muted:    #6b7280;
  --bg:            #f4f6fb;
  --card-bg:       #ffffff;
  --border:        #e2e8f0;
  --radius:        8px;
  --shadow:        0 1px 4px rgba(0,0,0,.08);
  --danger:        #ef4444;
  --success:       #22c55e;
  --warning:       #f59e0b;

  /* -- Neu (Theme-System v1): Basis-Schrift + Alias-Variablen. Die Aliase
     wurden im Bestand bereits referenziert (var(--card), var(--hover),
     var(--topbar-bg), var(--primary), var(--danger-bg)), waren aber nie
     definiert -- betroffene Deklarationen greifen ab jetzt. -- */
  --font-base:     -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --topbar-bg:     #ffffff;
  --primary:       var(--accent);
  --card:          var(--card-bg);
  --hover:         #f8fafc;
  --hover-bg:      rgba(0,0,0,.03);
  --danger-bg:     #fef2f2;
}

/* -- 1.2 Farben (Dark-Mode-Variante der Variablen) -- */
/* -- ECHTER DARKMODE F R DAS INTRANET -- */
body.dark-mode, html[data-theme="dark"] {
  --bg: #111827;       /* Sehr dunkles Grau f r den Haupt-Hintergrund */
  --card-bg: #1f2937;  /* Dunkleres Grau f r die Inhalts-Boxen */
  --text: #f9fafb;     /* Fast Wei  f r den Text */
  --border: #374151;   /* Dunklere Trennlinien */
  --text-muted: #9ca3af;
  --topbar-bg: #1f2937;
  --hover:     #374151;
  --hover-bg:  rgba(255,255,255,.04);
  --danger-bg: #450a0a;
}

/* ============================================================
   2. RESET & BASIS-TYPOGRAFIE
   ============================================================ */

/* -- 2.1 Universeller Reset -- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}


/* -- BASIS-ELEMENTE TYPO & LINKS -- */
html{font-size:15px;}
body{font-family:var(--font-base);background:var(--bg);color:var(--text);line-height:1.6;}
a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;}
code{background:#f1f5f9;padding:2px 6px;border-radius:4px;font-size:.88em;}
pre{white-space:pre-wrap;word-break:break-word;}

/* -- LEGO-RASTER BILDER-SCHUTZ -- */
.cms-content img, 
.page-body img {
    max-width: 100% !important;
    height: auto !important;
}

/* ============================================================
   3. LAYOUT-GRUNDGERUEST (Topbar, Sidebar, Main, Footer)
   ============================================================ */

/* -- 3.1 Topbar -- */
/* -- TOPBAR ------------------------------------------------ */
.topbar{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--topbar-h);background:var(--topbar-bg);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 16px;gap:12px;box-shadow:var(--shadow);overflow:visible;}
.topbar-left{display:flex;align-items:center;gap:12px;min-width:var(--sidebar-w);}
.topbar-center{flex:1;display:flex;justify-content:center;align-items:center;font-weight:600;font-size:1rem;}
.topbar-right{display:flex;align-items:center;gap:10px;overflow:visible;position:relative;}

/* Suche in Topbar */
.topbar-search{display:flex;align-items:center;}
.topbar-search-input{height:32px;padding:0 16px 0 36px;border:1px solid var(--border);border-radius:99px;font-size:.88rem;background:var(--bg);color:var(--text);width:240px;outline:none;transition:border-color .15s,box-shadow .15s,width .2s;}
.topbar-search-wrap{position:relative;display:flex;align-items:center;}
.topbar-search-icon{position:absolute;left:11px;font-size:.9rem;color:var(--text-muted);pointer-events:none;}
.topbar-search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(74,108,247,.1);width:300px;}
.topbar-search-input::placeholder{color:var(--text-muted);}

/* -- 3.2 Topbar: Glocke / News-Dropdown -- */
/* Glocke / News-Dropdown */
.bell-wrap{position:relative;}
.bell-btn{width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--text-muted);transition:background .12s,border-color .12s;}
.bell-btn:hover{background:var(--card);border-color:var(--accent);color:var(--accent);}
.bell-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;}
.bell-badge{position:absolute;top:2px;right:2px;width:8px;height:8px;border-radius:50%;background:#ef4444;border:2px solid #fff;}
.bell-dropdown{display:none;position:absolute;top:42px;right:0;width:300px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:200;overflow:hidden;}
.bell-dropdown.open{display:block;}
.bell-dd-header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--border);}
.bell-dd-title{font-size:.85rem;font-weight:600;color:var(--text);}
.bell-dd-count{font-size:.75rem;color:var(--text-muted);background:var(--bg);padding:2px 8px;border-radius:99px;border:1px solid var(--border);}
.bell-dd-item{display:flex;align-items:center;gap:10px;padding:9px 14px;border-bottom:1px solid var(--border);text-decoration:none;color:var(--text);transition:background .1s;}
.bell-dd-item:last-of-type{border-bottom:none;}
.bell-dd-item:hover{background:var(--hover);}
.bell-dd-icon{width:28px;height:28px;border-radius:6px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;}
.bell-dd-body{flex:1;min-width:0;}
.bell-dd-name{font-size:.83rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bell-dd-meta{font-size:.73rem;color:var(--text-muted);margin-top:2px;}
.bell-dd-arrow{font-size:1.1rem;color:var(--text-muted);opacity:.4;flex-shrink:0;}
.bell-dd-item:hover .bell-dd-arrow{opacity:1;color:var(--accent);}
.bell-dd-footer{padding:8px 14px;text-align:center;font-size:.8rem;color:var(--accent);cursor:pointer;border-top:1px solid var(--border);text-decoration:none;display:block;}
.bell-dd-footer:hover{background:var(--hover);}

/* Dark mode Glocke + Suche */
body.dark-mode .bell-btn{background:#1f2937;border-color:#374151;color:#9ca3af;}
body.dark-mode .bell-btn:hover{border-color:var(--accent);color:var(--accent);}
body.dark-mode .bell-btn.active{background:var(--accent);color:#fff;}
body.dark-mode .bell-badge{border-color:#1f2937;}
body.dark-mode .bell-dropdown{background:#1f2937;border-color:#374151;box-shadow:0 8px 24px rgba(0,0,0,.4);}
body.dark-mode .bell-dd-header{border-bottom-color:#374151;}
body.dark-mode .bell-dd-title{color:#f9fafb;}
body.dark-mode .bell-dd-count{background:#111827;border-color:#4b5563;color:#9ca3af;}
body.dark-mode .bell-dd-item{border-bottom-color:#374151;color:#f9fafb;}
body.dark-mode .bell-dd-item:hover{background:#374151;}
body.dark-mode .bell-dd-icon{background:#111827;}
body.dark-mode .bell-dd-meta{color:#9ca3af;}
body.dark-mode .bell-dd-footer{border-top-color:#374151;color:#93c5fd;}
body.dark-mode .bell-dd-footer:hover{background:#374151;}
body.dark-mode .topbar-search-input{background:#111827;border-color:#4b5563;color:#f9fafb;}
body.dark-mode .topbar-search-input:focus{border-color:var(--accent);}

/* -- 3.3 Topbar: News-Bell (news_bell.php) -- */
/* -- News-Bell (news_bell.php) -------------------------------- */
.news-bell-wrap{position:relative;display:inline-block;}
.news-bell-btn{width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--text-muted);transition:background .12s,border-color .12s;position:relative;}
.news-bell-btn:hover{background:var(--card);border-color:var(--accent);color:var(--accent);}
.news-bell-badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;border-radius:8px;background:#ef4444;border:2px solid var(--topbar-bg,#fff);color:#fff;font-size:.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 3px;}
.news-bell-badge.badge-critical{background:#b91c1c;animation:bellpulse 1s infinite;}
@keyframes bellpulse{0%,100%{transform:scale(1);}50%{transform:scale(1.2);}}
.news-bell-dropdown{display:none;position:absolute;top:42px;right:0;width:320px;background:var(--card-bg,#fff);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:200;overflow:hidden;}
.news-bell-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid var(--border);font-weight:600;font-size:.85em;}
.news-bell-empty{padding:16px;text-align:center;color:var(--text-muted);font-size:.85em;}
.news-bell-item{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border);text-decoration:none;color:var(--text);transition:background .12s;}
.news-bell-item:last-of-type{border-bottom:none;}
.news-bell-item:hover{background:var(--hover-bg,rgba(0,0,0,.03));}
.news-bell-item.bell-item-critical{border-left:3px solid #ef4444;}
.news-bell-item-dot{width:8px;height:8px;border-radius:50%;background:var(--accent,#2563eb);flex-shrink:0;margin-top:5px;}
.news-bell-item-text{display:flex;flex-direction:column;gap:2px;}
.news-bell-item-text strong{font-size:.88em;}
.news-bell-item-text small{font-size:.75em;color:var(--text-muted);}
.news-bell-footer{padding:8px 14px;border-top:1px solid var(--border);text-align:center;}
.news-bell-footer a{font-size:.82em;color:var(--accent,#2563eb);text-decoration:none;}
.news-bell-footer a:hover{text-decoration:underline;}
body.dark-mode .news-bell-btn{background:#1f2937;border-color:#374151;color:#9ca3af;}
body.dark-mode .news-bell-btn:hover{border-color:var(--accent);color:var(--accent);}
body.dark-mode .news-bell-badge{border-color:#1f2937;}
body.dark-mode .news-bell-dropdown{background:#1f2937;border-color:#374151;box-shadow:0 8px 24px rgba(0,0,0,.4);}
body.dark-mode .news-bell-header{border-color:#374151;color:#f9fafb;}
body.dark-mode .news-bell-item{border-color:#374151;color:#f9fafb;}
body.dark-mode .news-bell-item:hover{background:rgba(255,255,255,.04);}
body.dark-mode .news-bell-footer{border-color:#374151;}
body.dark-mode .news-bell-footer a{color:#93c5fd;}

/* -- 3.4 Topbar: User-Info, Logo, Sidebar-Toggle -- */
.sidebar-toggle{background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--text-muted);padding:4px 8px;border-radius:var(--radius);}
.sidebar-toggle:hover{background:var(--bg);}
.topbar-logo{font-weight:700;font-size:1.05rem;color:var(--text);white-space:nowrap;}
.topbar-logo:hover{text-decoration:none;color:var(--accent);}
.user-info{display:flex;align-items:center;gap:8px;}
.user-avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;}
.user-name{font-weight:600;font-size:.88rem;}
.user-dept{font-size:.78rem;color:var(--text-muted);}

/* -- 3.5 Sidebar & Menue -- */
/* -- LAYOUT & SIDEBAR --------------------------------------- */
.layout{display:flex;margin-top:var(--topbar-h);min-height:calc(100vh - var(--topbar-h) - 44px);}
.sidebar{width:var(--sidebar-w);background:var(--sidebar-bg);display:flex;flex-direction:column;position:fixed;top:var(--topbar-h);bottom:0;left:0;z-index:50;transition:transform .25s ease;overflow:hidden;}
.sidebar.hidden{transform:translateX(-100%);}
.sidebar-nav{flex:1;padding:12px 0;overflow-y:auto;min-height:0;}
.sidebar-footer{padding:12px 16px;font-size:.75rem;color:#6b7280;border-top:1px solid rgba(255,255,255,.07);}
.sidebar-footer a{color:#8892a4;}

.sidebar-menu{list-style:none;}
.menu-item>.menu-link{display:flex;align-items:center;gap:10px;padding:10px 16px;color:#c8cdd8;transition:background .15s,color .15s;cursor:pointer;position:relative;}
.menu-item>.menu-link:hover{background:var(--sidebar-hover);color:#fff;text-decoration:none;}
.menu-item>.menu-link.current,.menu-item.active-parent>.menu-link{background:var(--accent);color:#fff;}
.menu-icon{font-size:1em;min-width:20px;text-align:center;}
.menu-label{flex:1;font-size:.9rem;}
.menu-arrow{font-size:.75rem;color:#8892a4;transition:transform .2s;}
.menu-arrow::after{content:'\25BE';}
.menu-item.open>.menu-link .menu-arrow{transform:rotate(180deg);}
.submenu{list-style:none;max-height:0;overflow:hidden;transition:max-height .25s ease;background:rgba(0,0,0,.25);border-left:3px solid var(--accent);}
.submenu.open{max-height:2000px;}
.submenu-item .submenu-link{display:flex;align-items:center;gap:8px;padding:8px 16px 8px 44px;color:#a0a9be;font-size:.86rem;transition:background .15s,color .15s;}
.submenu-item .submenu-link:hover{background:var(--sidebar-hover);color:#fff;text-decoration:none;}
.submenu-item .submenu-link.current{color:#fff;font-weight:600;}

/* -- 3.6 Main Content & Breadcrumb -- */
/* -- MAIN CONTENT & BREADCRUMB ----------------------------- */
.main-content{margin-left:var(--sidebar-w);flex:1;padding:24px;transition:margin-left .25s;max-width:1200px;min-width:0;}
body.sidebar-collapsed .main-content{margin-left:0;}
.breadcrumb{display:flex;align-items:center;gap:6px;font-size:.83rem;color:var(--text-muted);margin-bottom:16px;}
.breadcrumb a{color:var(--accent);}
.bc-sep{color:#d1d5db;}
.bc-item{color:var(--text);font-weight:500;}

/* -- 3.7 Footer -- */
.site-footer{margin-left:var(--sidebar-w);padding:14px 24px;border-top:1px solid var(--border);font-size:.8rem;color:var(--text-muted);display:flex;gap:12px;align-items:center;flex-wrap:wrap;transition:margin-left .25s;}
body.sidebar-collapsed .site-footer{margin-left:0;}
.footer-sep{color:var(--border);}

/* -- 3.8 Sidebar Ebene 3 & Responsive -- */
/* -- SIDEBAR LEVEL 3 & RESPONSIVE -------------------------- */
.submenu-level-2 { background: rgba(0,0,0,.1); }
.submenu-level-2 .menu-item { padding-left: 0; }
.submenu-level-2 .menu-link { padding: 7px 16px 7px 56px; font-size: .82rem; color: #8892a4; }
.submenu-level-2 .menu-link:hover { background: var(--sidebar-hover); color: #fff; text-decoration: none; }
.submenu-level-2 .menu-link.current { color: #fff; font-weight: 600; }
.sub2-bullet { font-size: 1.4em; line-height: 1; min-width: 16px; color: #6b7280; margin-right: 4px; }
.submenu-level-2 .submenu { background: rgba(0,0,0,.08); }
.submenu-level-2 .submenu .menu-link { padding-left: 72px; }

@media(max-width:768px){
  .sidebar{transform:translateX(-100%);width:260px;}
  .sidebar.mobile-open{transform:none;}
  .main-content,.site-footer{margin-left:0;}
  .topbar-center{display:none;}
  .user-dept{display:none;}
  /* Sidebar ist auf Mobile eingeklappt -- topbar-left braucht die volle
     Sidebar-Breite hier nicht zu reservieren. Das war die Ursache dafuer,
     dass topbar-right (Glocke, Dark-Mode, Abmelden) ueber den rechten
     Bildschirmrand hinauslief und dort unsichtbar/unerreichbar wurde. */
  .topbar-left{min-width:auto;}
  /* topbar-right: Textbeschriftungen waren der eigentliche Platzfresser,
     nicht die von topbar-left reservierte Breite allein. Nur Icons/Avatar
     bleiben auf Mobile sichtbar -- Funktion bleibt identisch, nur kompakter. */
  .user-name{display:none;}
  .btn-label{display:none;}
}

/* ============================================================
   4. WIEDERVERWENDBARE KOMPONENTEN
   ============================================================ */

/* -- 4.1 Formulare -- */
/* -- FORMS (STANDARD HELLER MODUS) -- */
.form-group{margin-bottom:18px;}
.form-group label{display:block;font-size:.85rem;font-weight:600;margin-bottom:6px;color:var(--text);}
.form-group input[type="text"],.form-group input[type="number"],.form-group input[type="password"],
.form-group input[type="email"],.form-group select,.form-group textarea{width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:var(--radius);font-size:.9rem;color:#1e2025 !important;background-color:#ffffff !important;transition:border-color .15s;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(74,108,247,.12);}
.form-row{display:flex;gap:16px;flex-wrap:wrap;}
.form-row .form-group{flex:1;min-width:180px;}
.form-check{display:flex;align-items:center;gap:8px;font-size:.9rem;}
.form-check input[type="checkbox"]{width:16px;height:16px;cursor:pointer;}
.form-actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap;}
.form-hint{font-size:.8rem;color:var(--text-muted);background:#fffbeb;border:1px solid #fde68a;padding:10px 14px;border-radius:var(--radius);margin-bottom:16px;line-height:1.5;}
.input-icon-wrap{position:relative;}
.input-icon-wrap input{padding-left:38px;}
.input-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);pointer-events:none;}

/* -- 4.1b Seiten-Layout & CMS-Content-Typografie -- */
/* -- PAGE LAYOUT & TYPO ------------------------------------ */
.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;gap:16px;flex-wrap:wrap;}
.page-title{font-size:1.6rem;font-weight:700;display:flex;align-items:center;gap:10px;}
.page-icon{font-size:1.4rem;}
.page-header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:4px;}
.page-meta-inline{font-size:.78rem;color:var(--text-muted);}
.page-body{background:var(--card-bg);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);}

.cms-content h1,.cms-content h2,.cms-content h3{margin:1.2em 0 .5em;}
.cms-content h2{font-size:1.35rem;border-bottom:2px solid var(--border);padding-bottom:6px;}
.cms-content p{margin:.8em 0;}
.cms-content ul,.cms-content ol{padding-left:24px;margin:.8em 0;}
.cms-content li{margin:.3em 0;}
.cms-content table{width:100%;border-collapse:collapse;margin:1em 0;}
.cms-content th,.cms-content td{border:1px solid var(--border);padding:8px 12px;text-align:left;}
.cms-content th{background:#f8fafc;font-weight:600;}
.cms-content tr:hover td{background:#f8fafc;}
.cms-content .info-box{background:#eff6ff;border-left:4px solid var(--accent);padding:12px 16px;border-radius:0 var(--radius) var(--radius) 0;margin:12px 0;}
.cms-content .warning-box{background:#fffbeb;border-left:4px solid var(--warning);padding:12px 16px;border-radius:0 var(--radius) var(--radius) 0;margin:12px 0;}

/* -- 4.1c Seiten-Register-Tabs -- */
/* -- PAGE REGISTER TABS ------------------------------------ */
.page-tabs{display:flex;flex-wrap:wrap;gap:0;margin-top:8px;border-bottom:2.5px solid var(--accent);}
.page-tab{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 18px;
  font-size:.84rem;
  font-weight:500;
  text-decoration:none;
  white-space:nowrap;
  position:relative;
  bottom:-2.5px;
  background: var(--bg) !important; 
  color:var(--text-muted);
  border:1px solid var(--border);
  border-bottom:none;
  transition:background .15s,color .15s;
}
.page-tab:first-child{border-radius:7px 0 0 0;}
.page-tab:last-child{border-right:1px solid var(--border);border-radius:0 7px 0 0;}
.page-tab:only-child{border-radius:7px 7px 0 0;border-right:1px solid var(--border);}
.page-tab+.page-tab{border-left:none;}
.page-tab:hover{
  background: var(--border) !important; 
  color:var(--accent);
  text-decoration:none;
}
.page-tab-active{
  background: var(--card-bg) !important; 
  color:var(--accent);
  font-weight:700;
  border-color:var(--accent);
  border-bottom:2.5px solid var(--card-bg) !important; 
  z-index:1;
}

/* -- 4.1d Alerts & Empty-Page -- */
/* -- ALERTS & EMPTY PAGES ---------------------------------- */
.empty-page{text-align:center;padding:60px 20px;color:var(--text-muted);}
.empty-icon{font-size:3rem;margin-bottom:12px;}
.empty-page h2{font-size:1.3rem;margin-bottom:8px;color:var(--text);}
.alert{padding:12px 16px;border-radius:var(--radius);margin-bottom:16px;display:flex;align-items:center;gap:10px;font-size:.9rem;}
.alert-icon{font-weight:700;}
.alert-success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0;}
.alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca;}
.alert-warning{background:#fffbeb;color:#92400e;border:1px solid #fde68a;}
.alert-info{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe;}

/* -- 4.2 Buttons -- */
/* -- BUTTONS ----------------------------------------------- */
.btn{display:inline-flex;align-items:center;gap:5px;padding:8px 16px;border-radius:var(--radius);border:1px solid var(--border);background:var(--card-bg);color:var(--text);font-size:.88rem;font-weight:500;cursor:pointer;transition:all .15s;text-decoration:none;white-space:nowrap;}
.btn:hover{background:#f1f5f9;text-decoration:none;}
.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn-primary:hover{background:var(--accent-dark);}
.btn-danger{background:var(--danger);color:#fff;border-color:var(--danger);}
.btn-danger:hover{background:#dc2626;}
.btn-sm{padding:4px 10px;font-size:.8rem;}
.btn-block{width:100%;justify-content:center;}
.btn-admin{background:#7c3aed;color:#fff;border-color:#7c3aed;}
.btn-admin:hover{background:#6d28d9;}
.btn-logout{background:#f1f5f9;}

/* -- 4.3 Dark-Toggle, Edit-Button -- */
/* Hinweis: bell-badge-critical/@keyframes/bell-item-critical hier
   scheinen Duplikate der Werte bei .bell-badge / .news-bell-badge
   weiter oben zu sein -- unveraendert uebernommen, nicht geprueft. */
/* Dark-Mode-Toggle   Variante A (rund) aktiv, D (quadratisch) auskommentiert */
.dark-toggle{width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--text-muted);transition:border-color .15s,color .15s;position:relative;}
.dark-toggle:hover{border-color:var(--accent);color:var(--accent);}
body.dark-mode .dark-toggle{background:#1e293b;border-color:#334155;color:#fbbf24;}
body.dark-mode .dark-toggle:hover{border-color:#fbbf24;}
.bell-badge-critical{background:#b91c1c !important;animation:bellpulse 1s infinite;}
@keyframes bellpulse{0%,100%{transform:scale(1);}50%{transform:scale(1.25);}}
.bell-item-critical{border-left:3px solid #ef4444;}

/* Variante D (quadratisch)   Variante A oben auskommentieren und diese einkommentieren:
.dark-toggle{width:34px;height:34px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--text-muted);transition:border-color .15s,color .15s;}
.dark-toggle:hover{border-color:var(--accent);color:var(--accent);}
body.dark-mode .dark-toggle{background:#1e293b;border-color:#334155;color:#fbbf24;}
body.dark-mode .dark-toggle:hover{border-color:#fbbf24;}
*/
.btn-edit{background:transparent;border-color:var(--accent);color:var(--accent);}


/* -- 4.4 Cards & Admin-Komponenten -- */
/* -- CARDS & ADMIN COMPONENTS ------------------------------ */
.form-card{background:var(--card-bg);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);margin-bottom:24px;}
.form-card h2,.form-card h3{margin-bottom:16px;}
.form-card-full{max-width:100%;}

.admin-wrapper{max-width:1100px;}
.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:12px;}
.admin-header h1{font-size:1.5rem;}
.admin-header p{color:var(--text-muted);font-size:.9rem;margin-top:4px;}
.admin-section{background:var(--card-bg);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);margin-bottom:20px;}
.admin-section h2{font-size:1.05rem;margin-bottom:16px;}

.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-bottom:24px;}
.stat-card{background:var(--card-bg);border-radius:var(--radius);padding:20px;text-align:center;box-shadow:var(--shadow);border-top:3px solid var(--accent);min-width:0;}
.stat-num{font-size:2.2rem;font-weight:700;color:var(--accent);}
.stat-label{font-size:.82rem;color:var(--text-muted);margin-top:4px;overflow-wrap:break-word;}
.stat-card-warning{border-top-color:var(--warning);}
.stat-card-danger{border-top-color:var(--danger);}
.stat-card-success{border-top-color:var(--success);}

.admin-quick{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px;}
.quick-card{background:var(--card-bg);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:6px;border:1px solid var(--border);transition:border-color .15s,box-shadow .15s;min-width:0;}
.quick-card:hover{border-color:var(--accent);box-shadow:0 4px 12px rgba(74,108,247,.12);text-decoration:none;}
.quick-icon{font-size:1.8rem;}
.quick-label{font-weight:600;color:var(--text);font-size:.95rem;}
.quick-desc{font-size:.8rem;color:var(--text-muted);overflow-wrap:break-word;}

@media(max-width:768px){
  /* Admin-Kacheln: kleinere Mindestbreite, damit auf Mobile zuverl ssig
     2 Spalten passen (analog .dash-widget-tile auf der Startseite,
     die mit min-width:130px arbeitet) -- Desktop bleibt unveraendert.
     WICHTIG: Muss NACH den Basis-Deklarationen stehen (Zeile ~382),
     sonst gewinnt bei gleicher Spezifitaet die spaeter im Quelltext
     stehende Basis-Regel, unabhaengig von der Media-Query. */
  .stat-grid{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));}
  .admin-quick{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));}
}

/* -- 4.5 Daten-Tabellen & Badges -- */
/* -- DATA TABLES & BADGES ---------------------------------- */
.data-table{width:100%;border-collapse:collapse;font-size:.88rem;}
.data-table th{text-align:left;padding:8px 12px;border-bottom:2px solid var(--border);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);}
.data-table td{padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:top;}
.data-table tr:last-child td{border-bottom:none;}
.data-table tr:hover td{background:#f8fafc;}
.data-table .actions{display:flex;gap:6px;flex-wrap:wrap;}

.badge{display:inline-block;padding:2px 8px;border-radius:20px;font-size:.75rem;font-weight:600;}
.badge-ok{background:#dcfce7;color:#166534;}
.badge-off{background:#fee2e2;color:#991b1b;}
.badge-top{background:#dbeafe;color:#1e40af;}
.badge-sub{background:#f3e8ff;color:#6b21a8;}

/* -- 4.6 AD-Benutzer-Layout & Gruppen-Autocomplete -- */
/* -- AD USER LAYOUT & AUTOCOMPLETE -------------------------- */
.ad-user-layout{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:start;}
@media(max-width:900px){.ad-user-layout{grid-template-columns:1fr;}}
.ad-side-cards{display:flex;flex-direction:column;gap:16px;}
.ad-side-cards .form-card{margin-bottom:0;}
.group-member-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid var(--border);font-size:.88rem;}
.group-member-row:last-of-type{border-bottom:none;}

.group-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;max-height:200px;overflow-y:auto;padding:8px;background:#f8fafc;border-radius:var(--radius);}
.group-chip{padding:3px 10px;background:#e0e7ff;color:#3730a3;border-radius:20px;font-size:.78rem;cursor:pointer;transition:background .15s;}
.group-chip:hover{background:var(--accent);color:#fff;}

.group-autocomplete-wrap { position: relative; border: 1px solid var(--border); border-radius: var(--radius); background: #fff; padding: 6px 8px; cursor: text; transition: border-color .15s; min-height: 42px; }
.group-autocomplete-wrap:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(74,108,247,.12); }
.group-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 4px; }
.group-tag { display: inline-flex; align-items: center; gap: 4px; background: #e0e7ff; color: #3730a3; border-radius: 20px; padding: 3px 10px 3px 12px; font-size: .82rem; font-weight: 500; }
.group-tag button { background: none; border: none; color: #6366f1; cursor: pointer; font-size: 1rem; line-height: 1; padding: 0 2px; border-radius: 50%; display: flex; align-items: center; }
.group-tag button:hover { background: #c7d2fe; color: #3730a3; }
.group-autocomplete-input { border: none !important; outline: none !important; box-shadow: none !important; padding: 2px 4px !important; font-size: .9rem; width: 220px; background: transparent; }
.group-dropdown { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid var(--border); border-top: none; border-radius: 0 0 var(--radius) var(--radius); box-shadow: 0 8px 24px rgba(0,0,0,.1); z-index: 200; max-height: 280px; overflow-y: auto; }
.group-drop-item { display: flex; align-items: center; justify-content: space-between; padding: 9px 14px; cursor: pointer; font-size: .88rem; border-bottom: 1px solid #f1f5f9; transition: background .1s; }
.group-drop-item:last-child { border-bottom: none; }
.group-drop-item:hover, .group-drop-item.focused { background: #eff6ff; }
.gdi-name { font-weight: 500; color: var(--text); }
.gdi-ou   { font-size: .75rem; color: var(--text-muted); margin-left: 8px; }

/* -- 4.7 Dropdown-Suggest (data/lists/-Vorschlagsfelder) -- */
/* -- DROPDOWN-SUGGEST (data/lists/-gestuetzte Vorschlagsfelder) ---- */
.dropdown-suggest{position:relative;}
.dropdown-suggest-toggle{padding:8px 10px;}
.dropdown-suggest-list{display:none;position:absolute;z-index:20;top:100%;left:0;right:0;
    background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);
    max-height:200px;overflow-y:auto;box-shadow:var(--shadow);margin-top:2px;}
.dropdown-suggest-list.open{display:block;}
.dropdown-suggest-item{padding:6px 10px;cursor:pointer;font-size:.85em;color:var(--text);}
.dropdown-suggest-item:hover{background:rgba(128,128,128,.15);}

/* -- 4.8 Dynamisches Verzeichnis -- */
/* -- DYNAMISCHES VERZEICHNIS ------------------------------- */
.dir-layout { display: grid; grid-template-columns: 220px 1fr; gap: 16px; align-items: start; }
.dir-layout-full { grid-template-columns: 1fr; }
@media(max-width:700px) { .dir-layout { grid-template-columns: 1fr; } }

.dir-tree { background: var(--card-bg); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; position: sticky; top: calc(var(--topbar-h) + 16px); }
.dir-tree-title { padding: 10px 14px; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); border-bottom: 1px solid var(--border); background: #f8fafc; }
.dir-tree-list { list-style: none; padding: 6px 0; margin: 0; }
.dir-tree-list .dir-tree-list { padding-left: 12px; border-left: 2px solid var(--border); margin-left: 16px; }
.dir-tree-link { display: flex; align-items: center; gap: 7px; padding: 7px 14px; font-size: .86rem; color: var(--text); text-decoration: none; transition: background .12s; border-radius: 0; }
.dir-tree-link:hover { background: #f1f5f9; text-decoration: none; }
.dir-tree-link.current { background: #eff6ff; color: var(--accent); font-weight: 600; }
.dir-tree-icon { font-size: .95em; min-width: 18px; }

.dir-content { background: var(--card-bg); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; min-height: 200px; }
.dir-file-grid { display: flex; flex-direction: column; gap: 4px; }
.dir-file-card { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 6px; border: 1px solid transparent; transition: background .12s, border-color .12s; }
.dir-file-card:hover { background: #f8fafc; border-color: var(--border); }
.dir-file-icon { font-size: 1.4rem; min-width: 28px; text-align: center; }
.dir-file-info { flex: 1; min-width: 0; }
.dir-file-name { font-size: .9rem; font-weight: 500; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dir-file-meta { font-size: .76rem; color: var(--text-muted); margin-top: 2px; }
.dir-file-actions { display: flex; gap: 6px; flex-shrink: 0; }

.dir-modal { position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 500; display: flex; align-items: center; justify-content: center; padding: 20px; }
.dir-modal-inner { background: #fff; border-radius: var(--radius); width: 100%; max-width: 960px; max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,.3); overflow: hidden; }
.dir-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--border); font-weight: 600; font-size: .9rem; flex-shrink: 0; }
.dir-modal-body { flex: 1; overflow: auto; padding: 0; display: flex; align-items: center; justify-content: center; background: #f8fafc; }

/* -- 15. DYNAMISCHES VERZEICHNIS   DARK MODE --------------- */
body.dark-mode .dir-tree { background: #1f2937; box-shadow: none; border: 1px solid #374151; }
body.dark-mode .dir-tree-title { background: #111827; color: #9ca3af; border-bottom-color: #374151; }
body.dark-mode .dir-tree-link { color: #d1d5db; }
body.dark-mode .dir-tree-link:hover { background: #374151; }
body.dark-mode .dir-tree-link.current { background: #1e3a5f; color: #93c5fd; }
body.dark-mode .dir-tree-list .dir-tree-list { border-left-color: #374151; }
body.dark-mode .dir-file-card { background: #1f2937; border-color: #374151; }
body.dark-mode .dir-file-card:hover { border-color: #4b5563; background: #263547; }
body.dark-mode .dir-file-name { color: #f9fafb; }
body.dark-mode .dir-file-meta { color: #9ca3af; }
body.dark-mode .dir-modal-inner { background: #1f2937; border-color: #374151; }
body.dark-mode .dir-modal-header { background: #111827; border-bottom-color: #374151; color: #f9fafb; }

/* -- 4.9 Volltextsuche -- ausgelagert nach plugins/css/suche.css -- */

/* -- 4.9b Instant-Search Dropdown (Topbar) -- */
.search-instant-wrap {
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  width: 480px;
  max-width: calc(100vw - 32px);
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  z-index: 500;
  overflow: hidden;
  display: none;
}
.search-instant-wrap.open { display: block; }
.search-instant-section {
  padding: 6px 12px 4px;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border);
  background: var(--bg);
}
.search-instant-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  text-decoration: none;
  color: var(--text);
  font-size: .88rem;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background .1s;
}
.search-instant-item:last-child { border-bottom: none; }
.search-instant-item:hover,
.search-instant-item.focused { background: var(--bg); }
.search-instant-item-icon { font-size: 1rem; width: 22px; text-align: center; flex-shrink: 0; color: var(--text-muted); }
.search-instant-item-body { flex: 1; min-width: 0; }
.search-instant-item-title { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-instant-item-meta { font-size: .74rem; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-instant-footer {
  padding: 8px 14px;
  text-align: center;
  font-size: .8rem;
  color: var(--accent);
  cursor: pointer;
  border-top: 1px solid var(--border);
  background: var(--bg);
  transition: background .1s;
}
.search-instant-footer:hover { background: var(--border); }
.search-instant-empty {
  padding: 16px 14px;
  text-align: center;
  color: var(--text-muted);
  font-size: .86rem;
}
.search-instant-spinner {
  padding: 14px;
  text-align: center;
  color: var(--text-muted);
  font-size: .82rem;
}

/* Dark mode Instant-Search */
body.dark-mode .search-instant-wrap { background: #1f2937; border-color: #374151; box-shadow: 0 8px 32px rgba(0,0,0,.5); }
body.dark-mode .search-instant-section { background: #111827; color: #6b7280; border-bottom-color: #374151; }
body.dark-mode .search-instant-item { color: #f9fafb; border-bottom-color: #374151; }
body.dark-mode .search-instant-item:hover,
body.dark-mode .search-instant-item.focused { background: #374151; }
body.dark-mode .search-instant-footer { background: #111827; border-top-color: #374151; color: #93c5fd; }
body.dark-mode .search-instant-footer:hover { background: #374151; }

/* -- 4.10 News-Widget -- */
/* -- 13. NEWS-WIDGET ---------------------------------------- */
.news-widget {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  margin-bottom: 24px;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.news-widget-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: var(--accent);
  color: #fff;
  font-weight: 600;
  font-size: .92rem;
  letter-spacing: .01em;
}
.news-widget-icon { font-size: 1.1rem; }
.news-widget-list { display: flex; flex-direction: column; }
.news-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  text-decoration: none;
  color: var(--text);
  border-bottom: 1px solid var(--border);
  transition: background .12s;
}
.news-item:last-child { border-bottom: none; }
.news-item:hover { background: var(--hover); }
.news-item-icon {
  font-size: 1.2rem;
  width: 28px;
  text-align: center;
  flex-shrink: 0;
  opacity: .8;
}
.news-item-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.news-item-title {
  font-size: .9rem;
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.news-item-meta {
  font-size: .76rem;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 5px;
}
.news-item-dot { opacity: .5; }
.news-item-arrow {
  color: var(--text-muted);
  font-size: 1.2rem;
  flex-shrink: 0;
  opacity: .5;
}
.news-item:hover .news-item-arrow { opacity: 1; color: var(--accent); }

/* Dark mode */
body.dark-mode .news-widget { background: #1f2937; border-color: #374151; }
body.dark-mode .news-widget-header { background: #1e3a8a; }
body.dark-mode .news-item { color: #f9fafb; border-bottom-color: #374151; }
body.dark-mode .news-item:hover { background: #374151; }
body.dark-mode .news-item-title { color: #f9fafb; }
body.dark-mode .news-item-meta { color: #9ca3af; }

/* -- 4.11 News-System (v2.7) -- */
/* ============================================================
   NEWS-SYSTEM (v2.7)
   ============================================================ */

/* --- Badges --- */
.news-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.6;
}
.news-cat-allgemein  { background: #f3f4f6; color: #374151; }
.news-cat-info       { background: #dbeafe; color: #1d4ed8; }
.news-cat-wartung    { background: #fef3c7; color: #92400e; }
.news-cat-sicherheit { background: #fee2e2; color: #991b1b; }
.news-prio-niedrig   { background: #f0fdf4; color: #166534; }
.news-prio-normal    { background: #f3f4f6; color: #374151; }
.news-prio-hoch      { background: #fff7ed; color: #9a3412; }
.news-prio-kritisch  { background: #fee2e2; color: #991b1b; }

/* --- Banner --- */
.news-banner {
    padding: .6rem 1.2rem;
    font-size: .9rem;
    border-left: 4px solid;
    margin-bottom: 8px;
}
.banner-yellow { background: #fefce8; border-color: #eab308; color: #713f12; }
.banner-orange { background: #fff7ed; border-color: #f97316; color: #7c2d12; }
.banner-red    { background: #fef2f2; border-color: #ef4444; color: #7f1d1d; }

/* --- Modal --- */
.news-modal-overlay {
    display: none;
    position: fixed; inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 9000;
    align-items: center;
    justify-content: center;
}
.news-modal {
    background: var(--card-bg, #fff);
    border-radius: 10px;
    padding: 24px;
    max-width: 520px;
    width: 90%;
    box-shadow: 0 20px 60px rgba(0,0,0,.3);
}
.news-modal-critical { border-top: 4px solid #ef4444; }
.news-modal-header   { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.news-modal-body     { margin-bottom: 20px; line-height: 1.6; font-size: .95rem; }
.news-modal-footer   { display: flex; justify-content: flex-end; }

/* --- Newsseite --- */
.newsseite-wrap { max-width: 860px; margin: 0 auto; padding: 1.5rem; }
.newsseite-header { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; }
.newsseite-header h1 { margin: 0; font-size: 1.5rem; }
.newsseite-filter { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin-left: auto; }

.news-card {
    background: var(--card-bg, #fff);
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 10px;
    padding: 1rem 1.2rem;
    margin-bottom: 1rem;
    transition: box-shadow .15s;
}
.news-card:hover       { box-shadow: 0 2px 12px rgba(0,0,0,.08); }
.news-card-critical    { border-left: 4px solid #ef4444; }
.news-card-unread      { border-left: 4px solid #3b82f6; }
.news-card-header      { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; flex-wrap: wrap; }
.news-body             { line-height: 1.7; }

/* --- Dark Mode --- */
body.dark-mode .news-modal         { background: #1f2937; color: #f9fafb; }
body.dark-mode .news-card          { background: #1f2937; border-color: #374151; }
body.dark-mode .banner-yellow      { background: #422006; color: #fef3c7; }
body.dark-mode .banner-orange      { background: #431407; color: #ffedd5; }
body.dark-mode .banner-red         { background: #450a0a; color: #fee2e2; }

/* Neu-Badge */
.news-badge-new { background: #dbeafe; color: #1d4ed8; }
body.dark-mode .news-badge-new { background: #1e3a5f; color: #93c5fd; }

/* Badges Dark Mode - Schrift muss lesbar bleiben */
body.dark-mode .news-cat-allgemein  { background: #374151; color: #e5e7eb; }
body.dark-mode .news-cat-info       { background: #1e3a5f; color: #93c5fd; }
body.dark-mode .news-cat-wartung    { background: #422006; color: #fcd34d; }
body.dark-mode .news-cat-sicherheit { background: #450a0a; color: #fca5a5; }
body.dark-mode .news-prio-niedrig   { background: #14532d; color: #86efac; }
body.dark-mode .news-prio-normal    { background: #374151; color: #e5e7eb; }
body.dark-mode .news-prio-hoch      { background: #431407; color: #fdba74; }
body.dark-mode .news-prio-kritisch  { background: #450a0a; color: #fca5a5; }


/* ============================================================
   5. SONDERFORMATE (Lego-Baukasten Links/Buttons)
   ============================================================ */

/* -- COOLE LEGO-BAUKASTEN LINKS & CUSTOM FORMATS ----------- */
a[class^="mix-"] { transition: all 0.2s ease-in-out !important; }
a.mix-link-text { text-decoration: none !important; font-weight: 500; border-bottom: 2px solid currentColor; padding: 2px 4px; }
a.mix-btn { display: inline-block !important; padding: 8px 18px; margin: 4px 0; font-weight: 600; text-decoration: none !important; border-radius: 6px; text-align: center; }
a.mix-pill { display: inline-block !important; padding: 6px 18px; margin: 4px 0; font-weight: 500; text-decoration: none !important; border-radius: 20px; text-align: center; }

a.mix-navy { color: #1e3a8a !important; }
a.mix-btn.mix-navy, a.mix-pill.mix-navy { background-color: #1e3a8a !important; color: #ffffff !important; }
a.mix-btn.mix-navy:hover, a.mix-pill.mix-navy:hover { background-color: #172554 !important; }

a.mix-orange { color: #ea580c !important; }
a.mix-btn.mix-orange, a.mix-pill.mix-orange { background-color: #ea580c !important; color: #ffffff !important; }
a.mix-btn.mix-orange:hover, a.mix-pill.mix-orange:hover { background-color: #c2410c !important; }

a.mix-dark { color: #374151 !important; }
a.mix-btn.mix-dark, a.mix-pill.mix-dark { background-color: #374151 !important; color: #ffffff !important; }
a.mix-btn.mix-dark:hover, a.mix-pill.mix-dark:hover { background-color: #1f2937 !important; }

a.mix-blue { color: #2563eb !important; }
a.mix-btn.mix-blue, a.mix-pill.mix-blue { background-color: #2563eb !important; color: #ffffff !important; }
a.mix-btn.mix-blue:hover, a.mix-pill.mix-blue:hover { background-color: #1d4ed8 !important; }

a.mix-green { color: #16a34a !important; }
a.mix-btn.mix-green, a.mix-pill.mix-green { background-color: #16a34a !important; color: #ffffff !important; }
a.mix-btn.mix-green:hover, a.mix-pill.mix-green:hover { background-color: #15803d !important; }

a.mix-purple { color: #7c3aed !important; }
a.mix-btn.mix-purple, a.mix-pill.mix-purple { background-color: #7c3aed !important; color: #ffffff !important; }
a.mix-btn.mix-purple:hover, a.mix-pill.mix-purple:hover { background-color: #6d28d9 !important; }

a.mix-effect-telephone::before { content: '📞 '; }
a.mix-effect-launch::before { content: '🚀 '; }
a.mix-effect-secure::before { content: '🔒 '; }
a.mix-effect-idea::before { content: '💡 '; }
a.mix-effect-hot::before { content: '🔥 '; }
a.mix-effect-arrow::after { content: ' ↗'; font-size: 0.85em; opacity: 0.7; }

a.mix-hover-lift:hover { transform: translateY(-3px) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important; }
a.mix-hover-pulse:hover { animation: mix-wobble 0.3s ease-in-out infinite alternate; }

a.mix-modern-underline { text-decoration: none !important; font-weight: 600; padding-bottom: 2px; border-bottom: 2px solid #e5e7eb; color: inherit; }
a.mix-modern-underline:hover { border-bottom-color: currentColor; }

a.mix-card { display: block !important; padding: 20px !important; margin: 10px 0 !important; text-decoration: none !important; border-radius: 12px !important; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03) !important; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; border: 1px solid transparent !important; box-sizing: border-box !important; }
a.mix-card.card-standard { background-color: #ffffff !important; border-color: #e5e7eb !important; color: #1f2937 !important; }
a.mix-card.card-standard:hover { border-color: #3b82f6 !important; transform: translateY(-4px) !important; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1) !important; }

a.mix-card.card-premium { background-color: #ffffff !important; border-left: 5px solid #7c3aed !important; border-top: 1px solid #e5e7eb !important; border-right: 1px solid #e5e7eb !important; border-bottom: 1px solid #e5e7eb !important; color: #1f2937 !important; }
a.mix-card.card-premium:hover { background-color: #f5f3ff !important; transform: translateY(-4px) !important; box-shadow: 0 10px 15px -3px rgba(124, 58, 237, 0.1) !important; }

a.mix-card.card-dark { background-color: #1f2937 !important; color: #f9fafb !important; }
a.mix-card.card-dark:hover { background-color: #111827 !important; transform: translateY(-4px) !important; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3) !important; }

a.mix-card.card-mini { background-color: #f9fafb !important; border-color: #e5e7eb !important; padding: 10px 14px !important; font-size: 0.9em !important; border-radius: 8px !important; }
a.mix-card.card-mini:hover { background-color: #f3f4f6 !important; border-color: #9ca3af !important; }

@keyframes mix-wobble { 0% { transform: scale(1); } 100% { transform: scale(1.04); } }

/* ============================================================
   6. SEITEN-SPEZIFISCH
   ============================================================ */

/* -- 6.1 Login-Seite -- */
/* Konsolidiert: Basis-Definition + school-style-!important-Fix (frueher am
   Dateiende) zu einem Block zusammengefuehrt. Werte = bisheriges gerendertes
   Endergebnis, !important entfernt. */
.login-body{background:linear-gradient(135deg,#1a1f36 0%,#2d3561 100%);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;}
.login-wrapper{width:100%;max-width:420px;padding:20px;margin:0 auto;}
.login-card{background:var(--card-bg,#ffffff);border-radius:12px;padding:40px;box-shadow:0 20px 60px rgba(0,0,0,.3);width:100%;box-sizing:border-box;}
.login-logo{font-size:2.5rem;text-align:center;margin-bottom:8px;}
.login-title{text-align:center;font-size:1.4rem;font-weight:700;margin-bottom:6px;}
.login-subtitle{text-align:center;color:var(--text-muted);font-size:.85rem;margin-bottom:24px;}
.login-hint{text-align:center;font-size:.78rem;color:var(--text-muted);margin-top:20px;}


/* -- 6.2 Dezentes Spalten-Design (Frontend) -- */
/* -- DEZENTES SPALTEN-DESIGN (FRONTEND) -- */
.layout-col {
    background-color: rgba(0, 0, 0, 0.02) !important; /* Extrem helles Grau/Transparenz im Light-Mode */
    border: 1px solid rgba(0, 0, 0, 0.08) !important;  /* Hauchd nner, weicher Rahmen */
    border-radius: 8px !important;                     /* Sch ne runde Ecken */
    padding: 20px !important;                          /* Gen gend Luft zum Rand */
    transition: all 0.2s ease;
}

/* Anpassung f r den Dark-Mode (falls du eine .dark Klasse auf dem body hast) */
body.dark .layout-col {
    background-color: rgba(255, 255, 255, 0.03) !important; /* Feines, dunkles Schimmern im Dark-Mode */
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* ============================================================
   7. GLOBALE DARK-MODE-UEBERSTEUERUNG
   (uebergreifende Overrides fuer viele Komponenten gleichzeitig;
   bewusst als ein Block belassen statt aufgeteilt, da intern
   bereits 1-12 durchnummeriert und in sich geschlossen)
   ============================================================ */

/* ==========================================================================
   ?? UNIVERSELLE CORE-DARKMODE STEUERUNG (ZENTRAL F R DAS GESAMTE CMS)
   ========================================================================== */
body.dark-mode {
  --shadow: 0 4px 20px rgba(0,0,0,0.4);
}

/* 1. KERN-INTERFACES */
body.dark-mode .topbar { background: var(--topbar-bg) !important; border-bottom-color: var(--border) !important; }
body.dark-mode .topbar-logo, body.dark-mode .user-name { color: #fff !important; }
body.dark-mode .tox .tox-edit-area__iframe { background-color: #111827 !important; }

/* 2. TEXTE &  BERSCHRIFTEN (Greift  berall automatisch) */
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, 
body.dark-mode h4, body.dark-mode h5, body.dark-mode h6 { color: #f9fafb !important; }
body.dark-mode p, body.dark-mode li, body.dark-mode span, 
body.dark-mode small, body.dark-mode strong { color: #f3f4f6 !important; }

/* 3. CORE INPUTS & TEXTAREAS (Alle normalen Such- und Formularfelder) */
body.dark-mode input[type="text"],
body.dark-mode input[type="number"],
body.dark-mode input[type="password"],
body.dark-mode input[type="email"],
body.dark-mode input[type="datetime-local"],
body.dark-mode textarea,
body.dark-mode select {
  background-color: #111827 !important;
  color: #f9fafb !important;
  border: 1px solid #4b5563 !important;
}
body.dark-mode select option { background-color: #111827 !important; color: #f9fafb !important; }
body.dark-mode .form-group label { color: #f9fafb !important; }
body.dark-mode input::placeholder { color: #9ca3af !important; }

/* Obere Filter-Leisten  ber Tabellen (z.B. Kammer-Suche) */
body.dark-mode .editor-toolbar {
  background: #111827 !important;
  border-color: #374151 !important;
  color: #f9fafb !important;
}
body.dark-mode .editor-toolbar input.search-input {
  background-color: #1f2937 !important; /* Hebt das Suchfeld edel ab */
}

/* 4. CORE CMS-TABELLEN (Gilt global f r .admin-table, .data-table & .phone-table) */
body.dark-mode table, 
body.dark-mode .admin-table, 
body.dark-mode .phone-table,
body.dark-mode .data-table { 
  background: #1f2937 !important; 
  border-color: #4b5563 !important;
}
body.dark-mode table th, 
body.dark-mode .admin-table th, 
body.dark-mode .phone-table th,
body.dark-mode .data-table th { 
  background: #374151 !important; 
  color: #ffffff !important; 
  border-color: #4b5563 !important; 
}
body.dark-mode table td, 
body.dark-mode .admin-table td, 
body.dark-mode .phone-table td,
body.dark-mode .data-table td { 
  background: #1f2937 !important; 
  color: #f9fafb !important; 
  border-color: #4b5563 !important; 
}
body.dark-mode table tr:nth-child(even), 
body.dark-mode .admin-table tr:nth-child(even), 
body.dark-mode .phone-table tr:nth-child(even),
body.dark-mode .data-table tr:nth-child(even) { 
  background-color: #111827 !important; /* Automatisches Zebra-Muster */
}
body.dark-mode table tr:hover td,
body.dark-mode .data-table tr:hover td {
  background-color: #374151 !important; 
}

/* ?? ZELLEN-INPUTS: Entfernt Rahmen NUR wenn ein Input direkt in einer Tabellenzelle (td) liegt! */
body.dark-mode table td input,
body.dark-mode table td textarea {
  background: transparent !important; 
  color: #f9fafb !important;
  border: none !important;            
  box-shadow: none !important;
  padding: 6px !important;
}

/* 5. INTERAKTIVE ACCORDIONS & STRUKTUREN (z.B. Rechtematrix, IT-Akten) */
body.dark-mode .audit-container,
body.dark-mode .admin-table-wrapper,
body.dark-mode .it-akte-box {
  background: #1f2937 !important;
  border-color: #374151 !important;
}
body.dark-mode .top-folder, body.dark-mode .child-row { background: #111827 !important; color: #f9fafb !important; }
body.dark-mode .top-folder:hover { background: #374151 !important; }
body.dark-mode .top-folder.active-folder { background-color: #1e3a8a !important; color: #ffffff !important; border-left: 4px solid #60a5fa !important; }
body.dark-mode .tree-line { color: #4b5563 !important; }
body.dark-mode .it-akte-row { background: #111827 !important; }

/* 6. CO RE PORTAL WIDGETS (Badges, Dropdowns, Verteiler) */
body.dark-mode .role-pill { background: #111827 !important; color: #60a5fa !important; border: 1px solid #1e3a8a !important; }
body.dark-mode .more-pill, body.dark-mode .badge { background: #374151 !important; color: #f9fafb !important; border-color: #4b5563 !important; }
body.dark-mode .ad-dropdown { background: #111827 !important; border-color: #60a5fa !important; box-shadow: 0 4px 15px rgba(0,0,0,0.5) !important; }
body.dark-mode .ad-item { color: #f3f4f6 !important; border-bottom-color: #374151 !important; }
body.dark-mode .ad-item:hover { background: #374151 !important; }
body.dark-mode .mail-icon { filter: grayscale(1) invert(1) !important; }

/* Spezifische IT-Portal Badges */
body.dark-mode .room-badge { background: #1e3a8a !important; color: #60a5fa !important; }
body.dark-mode .phone-badge { background: #374151 !important; color: #f9fafb !important; border-color: #4b5563 !important; }
body.dark-mode .date-badge { background: #22c55e22 !important; color: #22c55e !important; border-color: #22c55e44 !important; }
body.dark-mode .group-tag { background: #374151 !important; color: #d1d5db !important; border-color: #4b5563 !important; }
body.dark-mode .quick-edit-input { background: #7f1d1d !important; color: #fca5a5 !important; border-color: #991b1b !important; }

/* 7. ALARM-KATEGORIEN FOR SONDERLISTEN */
body.dark-mode tr.cat-standard { background: transparent !important; }
body.dark-mode tr.cat-security { background: #5c2b2b !important; color: #fca5a5 !important; }
body.dark-mode tr.cat-notfall  { background: #990000 !important; color: #ffffff !important; }

/* 9. PAGE TABS & NAVIGATION */
body.dark-mode .page-tab:hover { color: #60a5fa !important; }
body.dark-mode .page-tab-active { color: #60a5fa !important; border-color: #4a6cf7 !important; border-bottom-color: var(--card-bg) !important; }
/* 10. FORM-CARDS & CODE-ELEMENTE IM DARK MODE */
body.dark-mode .form-card {
  background: #1f2937 !important;
  border-color: #374151 !important;
  color: #f9fafb !important;
}
body.dark-mode .form-card h2,
body.dark-mode .form-card h3 { color: #f9fafb !important; }
body.dark-mode code {
  background: #374151 !important;
  color: #93c5fd !important;
}
body.dark-mode .form-hint {
  background: #1e3a1e !important;
  border-color: #374151 !important;
  color: #d1d5db !important;
}
body.dark-mode .admin-wrapper { background: var(--bg) !important; }
body.dark-mode .admin-header { color: #f9fafb !important; }
/* 11. ABMELDE-BUTTON & ALLGEMEINE BUTTONS IM DARK MODE */
body.dark-mode .btn-logout {
  background: #374151 !important;
  color: #f9fafb !important;
  border-color: #4b5563 !important;
}
body.dark-mode .btn-logout:hover {
  background: #4b5563 !important;
  color: #ffffff !important;
}
body.dark-mode .btn {
  background: #374151 !important;
  color: #f9fafb !important;
  border-color: #4b5563 !important;
}
body.dark-mode .btn:hover {
  background: #4b5563 !important;
  color: #ffffff !important;
}
body.dark-mode .btn-primary {
  background: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}
body.dark-mode .btn-primary:hover {
  background: var(--accent-dark) !important;
}
body.dark-mode .btn-danger {
  background: var(--danger) !important;
  border-color: var(--danger) !important;
  color: #ffffff !important;
}
body.dark-mode .btn-danger:hover {
  background: #dc2626 !important;
  color: #ffffff !important;
}
/* 12. GRUPPEN-AUTOCOMPLETE WIDGET IM DARK MODE */
body.dark-mode .group-autocomplete-wrap {
  background: #111827 !important;
  border-color: #4b5563 !important;
}
body.dark-mode .group-autocomplete-input {
  background: #111827 !important;
  color: #f9fafb !important;
  border-color: #4b5563 !important;
}
body.dark-mode .group-tags {
  background: transparent !important;
}
body.dark-mode .group-tag {
  background: #1e3a8a !important;
  color: #93c5fd !important;
  border-color: #1e40af !important;
}
body.dark-mode .group-dropdown {
  background: #1f2937 !important;
  border-color: #4b5563 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important;
}
body.dark-mode .group-drop-item {
  color: #f9fafb !important;
  border-bottom-color: #374151 !important;
}
body.dark-mode .group-drop-item:hover,
body.dark-mode .group-drop-item.focused {
  background: #374151 !important;
  color: #ffffff !important;
}
body.dark-mode .gdi-name {
  color: #f9fafb !important;
}
body.dark-mode .gdi-ou {
  color: #9ca3af !important;
}

/* ============================================================
   STUNDENPLAN (Baldri School) -- ausgelagert nach plugins/css/stundenplan.css
   LOGIN-CARD-Fix -- in Abschnitt 6.1 konsolidiert
   ============================================================ */