/* ============================================================
   Dark-Mode für Cheems
   - Aktiviert wenn body.theme-dark gesetzt ist
   - Header-Bar bleibt unverändert (ist sowieso schon dunkelblau)
   ============================================================ */

/* --- Toggle in der Kopfzeile (immer sichtbar, oben rechts) --- */
.theme-toggle {
    position: absolute;
    top: 8px;
    right: 12px;
    z-index: 1000010; /* über Header (1000000) und Navigation */
    line-height: 1;
}
.theme-toggle .theme-toggle-btn {
    color: #ffffff;
    text-decoration: none;
    padding: 2px 6px;
    opacity: 0.6;
    font-size: 20px;
    display: inline-block;
}
.theme-toggle .theme-toggle-btn:hover { opacity: 0.9; text-decoration: none; }
.theme-toggle .theme-toggle-btn.active { color: #f6c700; opacity: 1; }
.theme-toggle .theme-toggle-sep { color: #fff; opacity: 0.6; padding: 0 2px; font-size: 18px; }

/* "Willkommen, ..."-Zeile weiter unten, damit der Toggle oben rechts daneben Platz hat.
   WICHTIG: Box-Höhe darf 50px nicht überschreiten (= Container .header_logout Höhe).
   Original .loggedInAs war height:35px + padding-top:15px = 50px. Wenn padding auf 36px
   wächst und height bei 35px bleibt, wird die Box 71px hoch und überlappt VISUELL und
   KLICKEND die darunter liegende Hauptnavigation (Reiter werden unanklickbar).
   pointer-events:none lässt evtl. überstehenden Text Klicks durchlassen — der Logout-
   Link bleibt klickbar dank Override unten. */
.header .loggedInAs {
    padding-top: 36px !important;
    height: 14px !important;
    box-sizing: content-box !important;
    pointer-events: none;
}
.header .loggedInAs a,
.header .loggedInAs a:link,
.header .loggedInAs a:visited {
    pointer-events: auto;
}

/* Aktiven Reiter in der Hauptnavigation hervorheben.
   !important nötig, weil Bootstrap-Regeln auf .navbar-nav li sehr breit greifen. */
.header .navbar-nav > li.active-nav,
ul.nav > li.active-nav {
    background: rgba(255, 255, 255, 0.18) !important;
    box-shadow: inset 0 -3px 0 #f6c700 !important;   /* gelber Unterstrich */
    border-radius: 0 !important;
}
.header .navbar-nav > li.active-nav > a.navbar-brand,
ul.nav > li.active-nav > a.navbar-brand {
    color: #ffffff !important;
    font-weight: bold !important;
}
body.theme-dark .header .navbar-nav > li.active-nav,
body.theme-dark ul.nav > li.active-nav {
    background: rgba(255, 255, 255, 0.10) !important;
}


/* ============================================================
   Dark-Mode-Regeln (greifen nur unter body.theme-dark)
   ============================================================ */
body.theme-dark {
    background: #1f2329 !important;
    color: #e2e2e2;
}

/* Allgemeiner Fließtext */
body.theme-dark p,
body.theme-dark span,
body.theme-dark div,
body.theme-dark label,
body.theme-dark dt,
body.theme-dark dd,
body.theme-dark li,
body.theme-dark td,
body.theme-dark th { color: inherit; }

/* Überschriften */
body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3,
body.theme-dark h4,
body.theme-dark h5 { color: #e2e2e2; }

/* Hauptcontainer / Karten */
body.theme-dark #container,
body.theme-dark .container,
body.theme-dark .container-fluid,
body.theme-dark .panel,
body.theme-dark .well {
    background-color: #2a2f37 !important;
    color: #e2e2e2;
}

/* Tabellen
   ACHTUNG :not(.cke_colordialog_table) — der CKEditor-Farbwaehler baut seine
   Palette als Tabelle, in der jede Zelle ihre Farbe per style-Attribut traegt.
   Ein "background-color: ... !important" hier schlaegt sogar Inline-Styles und
   faerbt damit die komplette Palette einheitlich dunkel ein: das Farbraster ist
   dann unsichtbar. Deshalb diese eine Tabelle ausnehmen. */
body.theme-dark .table,
body.theme-dark table:not(.cke_colordialog_table) {
    background-color: #2a2f37 !important;
    color: #e2e2e2 !important;
}
body.theme-dark .table thead th,
body.theme-dark table thead th,
body.theme-dark table.table-striped thead tr th {
    background-color: #3a4150 !important;
    color: #ffffff !important;
    border-color: #444b56 !important;
}

/* Alle Zellen (gerade UND ungerade) in dunkler Variante; striping kommt darunter */
/* Der Ausschluss haengt bewusst an der ZELLE, nicht an der Tabelle: der
   CKEditor-Dialog ist seinerseits aus Tabellen gebaut, die Palette ist also
   verschachtelt - ein :not() auf Tabellenebene wuerde die Zellen ueber den
   aeusseren Container trotzdem wieder einfangen. */
body.theme-dark .table tbody > tr > td:not(.cke_colordialog_colorcell),
body.theme-dark .table tbody > tr > th,
body.theme-dark table tbody > tr > td:not(.cke_colordialog_colorcell),
body.theme-dark table tbody > tr > th {
    background-color: #2a2f37 !important;
    color: #e2e2e2 !important;
    border-color: #3a4150 !important;
}

/* Striping über nth-child (Bootstrap) UND tr.odd (jquery.tablesorter / naturalsort) */
body.theme-dark .table-striped tbody > tr:nth-child(odd) > td,
body.theme-dark .table-striped tbody > tr:nth-child(odd) > th,
body.theme-dark table.table-striped tbody tr.odd td,
body.theme-dark table tbody tr.odd td {
    background-color: #313740 !important;
}

/* Hover */
body.theme-dark .table tbody > tr:hover > td,
body.theme-dark .table tbody > tr:hover > th {
    background-color: #3d434d !important;
}

/* Bootstrap-Status-Zeilen */
body.theme-dark .table tr.info td,
body.theme-dark .table-striped tr.info td       { background-color: #2c3441 !important; }
body.theme-dark .table tr.warning td,
body.theme-dark .table tr.current td             { background-color: #4a4530 !important; }
body.theme-dark .table tr.success td             { background-color: #2c4030 !important; }
body.theme-dark .table tr.error td,
body.theme-dark .table tr.danger td              { background-color: #4a2c2c !important; }

/* Forms */
body.theme-dark input[type="text"],
body.theme-dark input[type="password"],
body.theme-dark input[type="email"],
body.theme-dark input[type="number"],
body.theme-dark input[type="search"],
body.theme-dark input[type="tel"],
body.theme-dark input[type="url"],
body.theme-dark input[type="date"],
body.theme-dark input[type="datetime-local"],
body.theme-dark textarea,
body.theme-dark select,
body.theme-dark .form-control {
    background-color: #2a2f37 !important;
    color: #e2e2e2 !important;
    border: 1px solid #444b56 !important;
}
body.theme-dark input::placeholder,
body.theme-dark textarea::placeholder { color: #8a929c !important; }
body.theme-dark input[disabled],
body.theme-dark textarea[disabled],
body.theme-dark select[disabled] { background-color: #20242a !important; color: #888 !important; }

/* Buttons — Bootstrap default (.btn) ohne Farb-Modifier ist hellgrau auf weiß → in Dark unleserlich */
body.theme-dark .btn {
    box-shadow: none;
    text-shadow: none !important;
}
body.theme-dark .btn:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-inverse):not(.btn-link) {
    background-color: #4a525e !important;
    background-image: none !important;
    color: #f0f0f0 !important;
    border-color: #5a6270 !important;
}
body.theme-dark .btn:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-inverse):not(.btn-link):hover {
    background-color: #5a6270 !important;
    color: #ffffff !important;
}

/* Farbige Buttons: weiße Schrift erzwingen, kein text-shadow (sonst muddy) */
body.theme-dark .btn-primary,
body.theme-dark .btn-info,
body.theme-dark .btn-success,
body.theme-dark .btn-warning,
body.theme-dark .btn-danger,
body.theme-dark .btn-inverse,
body.theme-dark .btn-primary:hover, body.theme-dark .btn-primary:focus,
body.theme-dark .btn-info:hover,    body.theme-dark .btn-info:focus,
body.theme-dark .btn-success:hover, body.theme-dark .btn-success:focus,
body.theme-dark .btn-warning:hover, body.theme-dark .btn-warning:focus,
body.theme-dark .btn-danger:hover,  body.theme-dark .btn-danger:focus,
body.theme-dark .btn-inverse:hover, body.theme-dark .btn-inverse:focus {
    color: #ffffff !important;
    text-shadow: none !important;
}

/* btn-link bleibt textartig, aber sichtbar */
body.theme-dark .btn-link { color: #62b5ff !important; }

/* Disabled */
body.theme-dark .btn[disabled],
body.theme-dark .btn.disabled {
    opacity: 0.45;
}

/* Bootstrap "well" / Karten / div.letter (PDF-Layout-Vorschau) */
body.theme-dark div.letter {
    background: #2a2f37 !important;
    border-color: #3a4150 !important;
    box-shadow: 0 0 8px rgba(0,0,0,0.4);
    color: #e2e2e2;
}

/* infoWin (Filter-/Info-Box) — selbe Farbe wie Tab-Pane, damit es nicht erdrückt */
body.theme-dark .infoWin {
    background-color: #3a4150 !important;
    color: #e2e2e2 !important;
    border-color: #4a525e !important;
    text-shadow: none !important;
}
body.theme-dark .infoWinHeadline { color: #ffffff !important; }

/* Tabelle innerhalb infoWin transparent — Striping/dunkler BG entfällt, sieht aus wie eine Karte */
body.theme-dark .infoWin table,
body.theme-dark .infoWin .table {
    background-color: transparent !important;
}
body.theme-dark .infoWin table tbody > tr > td,
body.theme-dark .infoWin table tbody > tr > th,
body.theme-dark .infoWin .table tbody > tr > td,
body.theme-dark .infoWin .table tbody > tr > th,
body.theme-dark .infoWin table.table-striped tbody > tr:nth-child(odd) > td,
body.theme-dark .infoWin table tbody tr.odd td {
    background-color: transparent !important;
    color: #e2e2e2 !important;
    border-color: transparent !important;
}

/* Tablefilter-Inputs: original mit weißem Hintergrund */
body.theme-dark .flt {
    background: #2a2f37 !important;
    color: #e2e2e2 !important;
    border-color: #444b56 !important;
}

/* trigger_object — Klick-Trigger (z.B. ausklappbare Sektionen). Original: #eee BG */
body.theme-dark .trigger_object {
    background: #3a4150 !important;
    color: #e2e2e2 !important;
    border-color: #4a525e !important;
}
body.theme-dark .trigger_object .title_small,
body.theme-dark .trigger_object .title_small h2,
body.theme-dark .trigger_object .button_small {
    color: #e2e2e2 !important;
}

/* Glyphicons (Bootstrap-Sprite) — schwarze Variante ist auf dunklem BG unsichtbar.
   Alle Icons im Dark Mode auf das weiße Sprite umstellen. */
body.theme-dark [class^="icon-"],
body.theme-dark [class*=" icon-"] {
    background-image: url("../bootstrap/img/glyphicons-halflings-white.png") !important;
}

/* input-append / input-prepend Add-on (Original: #eee BG mit weißem text-shadow) */
body.theme-dark .input-append .add-on,
body.theme-dark .input-prepend .add-on {
    background-color: #4a525e !important;
    color: #e2e2e2 !important;
    border-color: #5a6270 !important;
    text-shadow: none !important;
}

/* Modals */
body.theme-dark .modal {
    background-color: #2a2f37 !important;
    color: #e2e2e2;
    border-color: #3a4150;
    box-shadow: 0 0 20px rgba(0,0,0,0.6);
}
body.theme-dark .modal-header,
body.theme-dark .modal-body,
body.theme-dark .modal-footer {
    background-color: #2a2f37 !important;
    color: #e2e2e2;
    border-color: #3a4150 !important;
}
body.theme-dark .modal-backdrop { background-color: #000; }

/* Tabs */
body.theme-dark .nav-tabs { border-color: #3a4150; }
body.theme-dark .nav-tabs > li > a,
body.theme-dark .nav-tabs > li > a span {
    color: #e2e2e2 !important;
    background-color: #232830;
    border-color: #3a4150;
}
body.theme-dark .nav-tabs > li.active > a,
body.theme-dark .nav-tabs > li.active > a:hover,
body.theme-dark .nav-tabs > li.active > a span,
body.theme-dark .nav-tabs > li.active > a:hover span {
    /* Aktiver Tab in derselben Farbe wie der Pane darunter, damit beides als eine
       Karte wirkt - muss mit der Pane-Farbe unten uebereinstimmen (#2a2f37). */
    background-color: #2a2f37 !important;
    color: #ffffff !important;
    border-color: #444b56 #444b56 #2a2f37 !important;
}
body.theme-dark .nav-tabs > li > a:hover,
body.theme-dark .nav-tabs > li > a:hover span { background-color: #313740 !important; color: #ffffff !important; }

/* Tab-Pane (Inhaltsbereich unter den Tabs) — Original ist #eee/#333
   WICHTIG: dieselbe Flaechenfarbe wie die Inhaltsbloecke darin (#2a2f37).
   Mit einem helleren Ton (#3a4150) blitzte oben das Innenabstands-Band der
   Pane zwischen Reitern und Inhalt durch - z.B. bei "Rechnung/KV erstellen"
   ueber "Allgemeines" und "Objekte". */
body.theme-dark .content_right .tab-content .tab-pane,
body.theme-dark .content_left .tab-content .tab-pane,
body.theme-dark .main .tab-content .tab-pane,
body.theme-dark .tab-content .tab-pane {
    background: #2a2f37 !important;
    color: #e2e2e2 !important;
    border-color: #444b56 !important;
}

/* tr.fltrow (Tablefilter-Zeile, Original blau #2670b0) */
body.theme-dark tr.fltrow td {
    background: #2c3a4d !important;
    border-color: #3a4150 !important;
}
body.theme-dark tr.fltrow td select,
body.theme-dark tr.fltrow td input {
    color: #ffffff !important;
    background: transparent !important;
}

/* Pagination */
body.theme-dark .pagination ul > li > a,
body.theme-dark .pagination ul > li > span {
    background-color: #2a2f37 !important;
    color: #e2e2e2 !important;
    border-color: #444b56 !important;
}
body.theme-dark .pagination ul > li > a:hover,
body.theme-dark .pagination ul > li > a:focus {
    background-color: #3a4150 !important;
    color: #ffffff !important;
}
body.theme-dark .pagination ul > .active > a,
body.theme-dark .pagination ul > .active > span {
    background-color: #4a525e !important;
    color: #ffffff !important;
}
body.theme-dark .pagination ul > .disabled > span,
body.theme-dark .pagination ul > .disabled > a,
body.theme-dark .pagination ul > .disabled > a:hover,
body.theme-dark .pagination ul > .disabled > a:focus {
    background-color: #232830 !important;
    color: #6d7480 !important;
}

/* Links */
body.theme-dark a              { color: #62b5ff; }
body.theme-dark a:hover        { color: #8ec9ff; }
body.theme-dark a:visited      { color: #b890ff; }

/* Header-Bereich von obigen Link-Farben ausnehmen — Logo, Navigation, Login-Zeile bleiben weiß */
body.theme-dark .header a,
body.theme-dark .header a:link,
body.theme-dark .header a:visited,
body.theme-dark .header a:hover,
body.theme-dark .header .logo,
body.theme-dark .header .logo:visited,
body.theme-dark .header .logo:hover,
body.theme-dark .header .navbar-brand,
body.theme-dark .header .navbar-brand:visited,
body.theme-dark .header .loggedInAs a,
body.theme-dark .header .loggedInAs a:visited {
    color: #ffffff !important;
}

/* Wells, alerts */
body.theme-dark .alert {
    background-color: #2c3441;
    color: #e2e2e2;
    border-color: #3a4150;
}

/* Dropdowns */
body.theme-dark .dropdown-menu {
    background-color: #2a2f37;
    color: #e2e2e2;
    border-color: #3a4150;
}
body.theme-dark .dropdown-menu > li > a { color: #e2e2e2; }
body.theme-dark .dropdown-menu > li > a:hover {
    background-color: #3a4150;
    color: #ffffff;
}

/* Tooltip / Popover Inhalt lassen Bootstrap-Defaults */

/* Badges / Labels */
body.theme-dark .label { color: #fff; }

/* Datepicker (jQuery UI) */
body.theme-dark .ui-datepicker {
    background-color: #2a2f37;
    color: #e2e2e2;
    border-color: #3a4150;
}
body.theme-dark .ui-datepicker .ui-datepicker-header { background: #3a4150; color: #fff; }
body.theme-dark .ui-datepicker td a { color: #e2e2e2; background: #2a2f37; }
body.theme-dark .ui-datepicker td a.ui-state-hover { background: #3a4150; }
body.theme-dark .ui-datepicker td a.ui-state-active { background: #f6c700; color: #1f2329; }

/* Code / Pre */
body.theme-dark pre, body.theme-dark code {
    background-color: #1a1d22;
    color: #e2e2e2;
    border-color: #3a4150;
}

/* ------------------------------------------------------------------
   CKEditor

   Die Symbole der Werkzeugleiste sind eine Bild-Sprite mit dunklen
   Glyphen auf transparentem Grund. Auf dunklem Untergrund verschwinden
   sie fast vollstaendig - es half auch nicht, nur die Textfarben zu
   aendern. Deshalb bleibt die Bedienoberflaeche des Editors bewusst
   hell; der Inhaltsbereich ist ohnehin ein weisses Dokument.
   ------------------------------------------------------------------ */
body.theme-dark .cke_inner,
body.theme-dark .cke_contents          { background: #ffffff; }
body.theme-dark .cke_chrome            { border-color: #444b56; }
body.theme-dark .cke_top,
body.theme-dark .cke_bottom            { background: #f0f0f0; border-color: #c4c4c4; }

/* Beschriftungen der Leiste: Stil, Format, Schriftart, Groesse, Pfadanzeige */
body.theme-dark .cke_button_label,
body.theme-dark .cke_combo_text,
body.theme-dark .cke_combo_inlinelabel,
body.theme-dark .cke_toolbar_text,
body.theme-dark .cke_path_item,
body.theme-dark .cke_path_empty        { color: #333333 !important; }

body.theme-dark .cke_button:hover,
body.theme-dark .cke_button__on,
body.theme-dark .cke_combo_button:hover { background: #e0e0e0; }

/* Aufklapplisten (Format, Schriftart, Farbwaehler) */
body.theme-dark .cke_panel,
body.theme-dark .cke_panel_block,
body.theme-dark .cke_panel_list,
body.theme-dark .cke_colorblock        { background: #ffffff; color: #333333; }
body.theme-dark .cke_panel_listItem a,
body.theme-dark .cke_panel_grouptitle  { color: #333333 !important; }
body.theme-dark .cke_panel_listItem a:hover { background: #e8e8e8; color: #000 !important; }

/* Dialoge des Editors, z.B. "Farbe auswaehlen" */
body.theme-dark .cke_dialog,
body.theme-dark .cke_dialog_body,
body.theme-dark .cke_dialog_contents,
body.theme-dark .cke_dialog_contents_body,
body.theme-dark .cke_dialog_page_contents,
body.theme-dark .cke_dialog_footer     { background: #ffffff; color: #333333; }
body.theme-dark .cke_dialog_title,
body.theme-dark .cke_dialog_tab        { background: #f0f0f0; color: #333333 !important; }
body.theme-dark .cke_dialog_ui_labeled_label,
body.theme-dark .cke_dialog_ui_labeled_content,
body.theme-dark .cke_dialog_ui_text,
body.theme-dark .cke_dialog_ui_hbox_child { color: #333333 !important; }
body.theme-dark .cke_dialog_ui_input_text,
body.theme-dark .cke_dialog_ui_input_textarea {
    background: #ffffff;
    color: #333333;
    border-color: #c4c4c4;
}

/* ------------------------------------------------------------------
   Formular-Legenden ("Allgemeines", "Objekte" bei Rechnung/KV erstellen)
   Standardfarbe ist dunkelgrau und damit auf dunklem Grund unlesbar.
   ------------------------------------------------------------------ */
body.theme-dark legend {
    color: #e2e2e2;
    border-bottom-color: #444b56;
}

/* ------------------------------------------------------------------
   Kalender: Termintexte
   Die globale Link-Farbe (#62b5ff) schlaegt auf die Eintraege durch und
   ist auf Orange/Gruen kaum lesbar - hier immer weiss zeichnen.
   ------------------------------------------------------------------ */
body.theme-dark .fc-event,
body.theme-dark .fc-event a,
body.theme-dark .fc-event .fc-title,
body.theme-dark .fc-event .fc-time,
body.theme-dark .fc-event-container a { color: #ffffff !important; }

/* ------------------------------------------------------------------
   E-Mail-Auswahl (Termin > Hinterlegte Dokumente)
   ------------------------------------------------------------------ */
body.theme-dark .email-choice-list {
    background: #2a2f37;
    border-color: #444b56;
}
body.theme-dark .email-choice:hover      { background: #3a4150; }
body.theme-dark .email-choice-addr       { color: #c9c9c9; }
body.theme-dark .email-choice input[type="checkbox"]:checked ~ .email-choice-addr {
    color: #8ab8e8;
}
body.theme-dark .email-choice-src        { color: #9aa3af; }

/* ------------------------------------------------------------------
   Kalender: "Heute"-Markierung
   Das helle Gelb (style.css / fullcalendar.css) blendet im Dark Mode und
   uebertoent die Termine. Beide Quellregeln arbeiten mit !important und
   einem base64-Gradienten als background-image - deshalb hier ebenfalls
   !important und die Kurzform "background", die das Bild mit zuruecksetzt.
   Der warme Ton bleibt erhalten, nur stark abgedunkelt.
   ------------------------------------------------------------------ */
body.theme-dark .fc-unthemed .fc-today,
body.theme-dark .fc-unthemed .fc-bg .fc-today,
body.theme-dark .fc td.fc-today,
body.theme-dark .fc-state-highlight {
    background: #3a352a !important;
}
/* Der "Heute"-Spaltenkopf darf ruhig etwas kraeftiger sein. */
body.theme-dark .fc th.fc-today,
body.theme-dark .fc-day-number.fc-today {
    background: #4a4436 !important;
    color: #ffd98a !important;
}

/* ------------------------------------------------------------------
   E-Mail-versenden-Dialog (Termin)
   terminMail.phtml bringt ein eigenes <style> mit "color:#333" auf den
   Labels mit. Das schlaegt die generische Regel weiter oben (die nur
   "body.theme-dark label" ist) per Spezifitaet - daher hier explizit
   mit dem gleichen Selektorpfad dagegenhalten.
   ------------------------------------------------------------------ */
body.theme-dark .termin-mail-form .form-row > label {
    color: #e2e5ea;
}
body.theme-dark .termin-mail-form .form-field input[type="text"] {
    background: #2a2f37;
    border-color: #444b56;
    color: #e2e5ea;
}
body.theme-dark .termin-mail-form .form-field .attach-list a {
    color: #7fbcec;
}

/* ------------------------------------------------------------------
   Textbaustein-Popup (.popupBox) - eigenes Popup, kein Bootstrap-Modal,
   hat daher von den Modal-Regeln nichts abbekommen.
   ------------------------------------------------------------------ */
body.theme-dark .popupBox,
body.theme-dark .popupBox > .boxbody,
body.theme-dark .popupBox > .boxfooter {
    background-color: #2a2f37 !important;
    border-color: #444b56 !important;
    color: #e2e2e2 !important;
}
body.theme-dark .popupBox h2,
body.theme-dark .popupBox h2 > span,
body.theme-dark .popupBox section > h2 {
    color: #ffffff !important;
}
/* Filterleiste von setFilterGrid (Zaehler, Reset-Link, Filterfelder) */
body.theme-dark .popupBox .inf,
body.theme-dark .popupBox .tot,
body.theme-dark .popupBox .rspan {
    background-color: #2a2f37 !important;
    color: #c9d1d9 !important;
}
body.theme-dark .popupBox a.reset,
body.theme-dark .popupBox .reset {
    color: #7fbcec !important;
}
/* Die Bausteintexte selbst: das Standardblau ist auf Dunkel zu dumpf. */
body.theme-dark .popupBox table a {
    color: #8ab8e8 !important;
}

/* ------------------------------------------------------------------
   CKEditor "Farbe auswaehlen": Raster wieder als Raster erkennbar.
   Die Zellfarben kommen per style-Attribut (siehe :not(...) oben), hier
   nur noch Rahmen und Fokusmarkierung.
   ------------------------------------------------------------------ */
body.theme-dark table.cke_colordialog_table,
body.theme-dark table.cke_colordialog_table td {
    border: 1px solid #5a616d !important;
    border-collapse: separate !important;
}
body.theme-dark .cke_colordialog_focused_dark,
body.theme-dark .cke_colordialog_focused_light,
body.theme-dark .cke_colordialog_selected {
    outline: 2px solid #ffd98a !important;
}

/* ------------------------------------------------------------------
   E-Mail-versenden-Dialog: die Labels kommen aus einem <style>-Block
   direkt in terminMail.phtml. Gegen einen komponenteneigenen Style hilft
   nur !important zuverlaessig - sonst haengt es an der Reihenfolge, in
   der das per AJAX nachgeladene Markup eingefuegt wird.
   ------------------------------------------------------------------ */
body.theme-dark .termin-mail-form label,
body.theme-dark .termin-mail-form .form-row > label,
body.theme-dark .termin-mail-form .form-row.editor-row > label {
    color: #e2e5ea !important;
}