:root {
    --nx-font: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --nx-font-heading: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --nx-font-size: 15px;
    --nx-font-weight: 400;
    --nx-heading-weight: 650;
    --nx-radius-sm: 8px;
    --nx-radius: 12px;
    --nx-radius-lg: 18px;
    --nx-radius-xl: 26px;
    --nx-radius-btn: 12px;
    --nx-space-1: 6px;
    --nx-space-2: 10px;
    --nx-space-3: 16px;
    --nx-space-4: 22px;
    --nx-space-5: 30px;
    --nx-space-6: 42px;
    --nx-control-height: 44px;
    --nx-control-height-sm: 34px;
    --nx-header-height: 68px;
    --nx-sidebar-width: 220px;
    --nx-container: 100%;
    --nx-transition: 0.18s ease;
    --bs-border-radius: 12px;
    --bs-border-radius-sm: 8px;
    --bs-border-width: 1px;
    --nx-primary: #4285f4;
    --nx-primary-rgb: 66, 133, 244;
    --nx-primary-hover: #1f6ef2;
    --nx-primary-active: #0e61ea;
    --nx-on-primary: #111827;
    --nx-primary-solid: #4285f4;
    --nx-primary-readable: #1b6cf2;
    --nx-primary-glow: rgba(66, 133, 244, 0.24);
    --nx-primary-solid-hover: #1f6ef2;
    --nx-primary-soft: #ecf3fe;
    --nx-primary-soft-hover: #e1ebfd;
    --nx-on-primary-soft: #09409a;
    --nx-secondary: #2e5dab;
    --nx-secondary-rgb: 46, 93, 171;
    --nx-secondary-hover: #285296;
    --nx-on-secondary: #ffffff;
    --nx-secondary-solid: #2e5dab;
    --nx-secondary-soft: #eaeff7;
    --nx-gradient: linear-gradient(135deg, #2b70e2 0%, #2e5dab 100%);
    --nx-gradient-from: #2b70e2;
    --nx-gradient-to: #2e5dab;
    --nx-on-gradient: #ffffff;
    --nx-bg: #f7f9fd;
    --nx-surface: #ffffff;
    --nx-surface-2: #fafbfe;
    --nx-surface-3: #f7f9fd;
    --nx-surface-hover: #f6f9fe;
    --nx-header-bg: #ffffff;
    --nx-header-text: #182125;
    --nx-header-muted: #707578;
    --nx-text: #182125;
    --nx-text-muted: #62686b;
    --nx-text-faint: #95999b;
    --nx-heading: #151d21;
    --nx-border: rgba(15, 23, 42, 0.10);
    --nx-border-strong: rgba(15, 23, 42, 0.18);
    --nx-divider: rgba(15, 23, 42, 0.07);
    --nx-sheen: rgba(255, 255, 255, 0.7);
    --nx-success: #10b981;
    --nx-success-rgb: 16, 185, 129;
    --nx-on-success: #111827;
    --nx-success-solid: #10b981;
    --nx-success-soft: #e2f7f0;
    --nx-on-success-soft: #0a7552;
    --nx-success-border: #b7ead9;
    --nx-danger: #f43f5e;
    --nx-danger-rgb: 244, 63, 94;
    --nx-on-danger: #111827;
    --nx-danger-solid: #f43f5e;
    --nx-danger-soft: #fee8ec;
    --nx-on-danger-soft: #79071a;
    --nx-danger-border: #fcc5cf;
    --nx-warning: #f59e0b;
    --nx-warning-rgb: 245, 158, 11;
    --nx-on-warning: #111827;
    --nx-warning-solid: #f59e0b;
    --nx-warning-soft: #fef3e2;
    --nx-on-warning-soft: #7a4f05;
    --nx-warning-border: #fce2b6;
    --nx-info: #4285f4;
    --nx-info-rgb: 66, 133, 244;
    --nx-on-info: #111827;
    --nx-info-solid: #4285f4;
    --nx-info-soft: #e8f0fe;
    --nx-on-info-soft: #073278;
    --nx-info-border: #c6dafc;
    --nx-input-bg: #ffffff;
    --nx-input-border: rgba(15, 23, 42, 0.10);
    --nx-input-text: #182125;
    --nx-input-placeholder: #95999b;
    --nx-input-focus-ring: rgba(66, 133, 244, 0.18);
    --nx-input-disabled-bg: #f6f6f6;
    --nx-shadow-xs: 0 1px 2px rgba(22, 30, 33, 0.05);
    --nx-shadow-sm: 0 1px 3px rgba(22, 30, 33, 0.07), 0 1px 2px rgba(22, 30, 33, 0.04);
    --nx-shadow-md: 0 4px 12px rgba(22, 30, 33, 0.08);
    --nx-shadow-lg: 0 12px 32px rgba(22, 30, 33, 0.12);
    --nx-shadow-xl: 0 24px 56px rgba(22, 30, 33, 0.16);
    --nx-overlay: rgba(15, 23, 42, 0.45);
    --nx-skeleton: #ededee;
    --bg-primary: #ffffff;
    --bg-secondary: #fafbfe;
    --bg-tertiary: #f7f9fd;
    --text-primary: #182125;
    --text-secondary: #62686b;
    --text-muted: #62686b;
    --border-color: rgba(15, 23, 42, 0.10);
    --primary-color: #4285f4;
    --success-color: #10b981;
    --danger-color: #f43f5e;
    --warning-color: #f59e0b;
    --info-color: #4285f4;
    --bg-card: #ffffff;
    --accent-color: #4285f4;
    --accent-color-rgb: 66, 133, 244;
    --dark: #151d21;
    --light: #fafbfe;
    --secondary: #62686b;
    --success: #10b981;
    --info: #4285f4;
    --bs-body-bg: #ffffff;
    --bs-body-color: #182125;
    --bs-secondary-bg: #fafbfe;
    --bs-tertiary-bg: #f7f9fd;
    --bs-border-color: rgba(15, 23, 42, 0.10);
    --bs-border-color-translucent: rgba(15, 23, 42, 0.07);
    --bs-emphasis-color: #151d21;
    --bs-secondary-color: #62686b;
    --bs-dark: #151d21;
    --bs-primary: #4285f4;
    --bs-primary-rgb: 66, 133, 244;
    --bs-link-color: #1b6cf2;
    --bs-link-hover-color: #1f6ef2;
}

body#whmp-dark-mode {
    --nx-primary: #4285f4;
    --nx-primary-rgb: 66, 133, 244;
    --nx-primary-hover: #5994f5;
    --nx-primary-active: #689df6;
    --nx-on-primary: #111827;
    --nx-primary-solid: #4285f4;
    --nx-primary-readable: #4285f4;
    --nx-primary-glow: rgba(66, 133, 244, 0.32);
    --nx-primary-solid-hover: #5994f5;
    --nx-primary-soft: #203149;
    --nx-primary-soft-hover: #24395a;
    --nx-on-primary-soft: #95bbf9;
    --nx-secondary: #a1c2fa;
    --nx-secondary-rgb: 161, 194, 250;
    --nx-secondary-hover: #acc9fb;
    --nx-on-secondary: #111827;
    --nx-secondary-solid: #a1c2fa;
    --nx-secondary-soft: #333d4a;
    --nx-gradient: linear-gradient(135deg, #1d63d7 0%, #174eab 100%);
    --nx-gradient-from: #1d63d7;
    --nx-gradient-to: #174eab;
    --nx-on-gradient: #ffffff;
    --nx-bg: #0d0f11;
    --nx-surface: #181c1e;
    --nx-surface-2: #22282b;
    --nx-surface-3: #2c3437;
    --nx-surface-hover: #262d30;
    --nx-header-bg: #181c1e;
    --nx-header-text: #f9fafa;
    --nx-header-muted: #a4a6a6;
    --nx-text: #e6e6ea;
    --nx-text-muted: #98999c;
    --nx-text-faint: #77797c;
    --nx-heading: #e9e9ed;
    --nx-border: rgba(255, 255, 255, 0.09);
    --nx-border-strong: rgba(255, 255, 255, 0.16);
    --nx-divider: rgba(255, 255, 255, 0.06);
    --nx-sheen: rgba(255, 255, 255, 0.06);
    --nx-success: #3aeeb2;
    --nx-success-rgb: 58, 238, 178;
    --nx-on-success: #111827;
    --nx-success-solid: #3aeeb2;
    --nx-success-soft: #1e4239;
    --nx-on-success-soft: #aaf8de;
    --nx-success-border: #256c56;
    --nx-danger: #f44865;
    --nx-danger-rgb: 244, 72, 101;
    --nx-on-danger: #111827;
    --nx-danger-solid: #f44865;
    --nx-danger-soft: #40242b;
    --nx-on-danger-soft: #faa8b6;
    --nx-danger-border: #6c2d39;
    --nx-warning: #f7ad31;
    --nx-warning-rgb: 247, 173, 49;
    --nx-on-warning: #111827;
    --nx-warning-solid: #f7ad31;
    --nx-warning-soft: #403621;
    --nx-on-warning-soft: #fcdca7;
    --nx-warning-border: #6d5325;
    --nx-info: #4889f4;
    --nx-info-rgb: 72, 137, 244;
    --nx-on-info: #111827;
    --nx-info-solid: #4889f4;
    --nx-info-soft: #213045;
    --nx-on-info-soft: #a8c7fa;
    --nx-info-border: #2a456f;
    --nx-input-bg: #202528;
    --nx-input-border: rgba(255, 255, 255, 0.09);
    --nx-input-text: #e6e6ea;
    --nx-input-placeholder: #77797c;
    --nx-input-focus-ring: rgba(66, 133, 244, 0.35);
    --nx-input-disabled-bg: #1c2123;
    --nx-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
    --nx-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.45), 0 1px 2px rgba(0, 0, 0, 0.3);
    --nx-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
    --nx-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.55);
    --nx-shadow-xl: 0 24px 56px rgba(0, 0, 0, 0.6);
    --nx-overlay: rgba(0, 0, 0, 0.7);
    --nx-skeleton: #282f32;
    --bg-primary: #181c1e;
    --bg-secondary: #22282b;
    --bg-tertiary: #2c3437;
    --text-primary: #e6e6ea;
    --text-secondary: #98999c;
    --text-muted: #98999c;
    --border-color: rgba(255, 255, 255, 0.09);
    --primary-color: #4285f4;
    --success-color: #3aeeb2;
    --danger-color: #f44865;
    --warning-color: #f7ad31;
    --info-color: #4889f4;
    --bg-card: #181c1e;
    --accent-color: #4285f4;
    --accent-color-rgb: 66, 133, 244;
    --dark: #e9e9ed;
    --light: #22282b;
    --secondary: #98999c;
    --success: #3aeeb2;
    --info: #4889f4;
    --bs-body-bg: #181c1e;
    --bs-body-color: #e6e6ea;
    --bs-secondary-bg: #22282b;
    --bs-tertiary-bg: #2c3437;
    --bs-border-color: rgba(255, 255, 255, 0.09);
    --bs-border-color-translucent: rgba(255, 255, 255, 0.06);
    --bs-emphasis-color: #e9e9ed;
    --bs-secondary-color: #98999c;
    --bs-dark: #e9e9ed;
    --bs-primary: #4285f4;
    --bs-primary-rgb: 66, 133, 244;
    --bs-link-color: #4285f4;
    --bs-link-hover-color: #5994f5;
}

/* Custom CSS */
/* Gesetzt von portalfarben-setzen.php am 26.09.2026. Nicht von Hand
   aendern -- der naechste Lauf ueberschreibt es. Hergang in
   PRODUKTIV-ABLAUF.md und STATUS.md. */
:root {
    --nx-on-primary: #ffffff;
    --nx-on-primary-soft: #182125;
    --nx-on-info-soft: #182125;
    --nx-surface-2: #eef0f3;
}
body#whmp-dark-mode {
    --nx-on-primary: #ffffff;
    --nx-on-primary-soft: #e6e9ea;
    --nx-on-info-soft: #e6e9ea;
}

/* Weisse Schrift erreicht auf #4285f4 nur 3.56:1.
   Die Initialen im Kopf bekommen deshalb den dunkleren Markenton. */
.nx-avatar { background: #2e5dab !important; color: #fff !important; }

/* Listen einheitlich ohne Streifen -- wie die Diensteliste. */
.table-striped tbody tr:not(:hover),
.table-striped-alt tbody tr:not(:hover) { background: transparent !important; }

/* Die Zaehler neben den Statusreitern. Das Theme setzt dafuer
   --nx-surface-3 und --nx-text-muted ein, definiert aber keine der
   beiden -- die Ziffern erben dadurch die Schriftfarbe des Reiters
   und verschwinden auf hellem Grund. */
.card-links .badge,
.lagom-status-count {
    background: #ecf3fe !important;
    color: #244986 !important;
}
.card-links a:hover .badge,
.lagom-status-item.active .lagom-status-count,
.lagom-status-item:hover .lagom-status-count {
    background: #2e5dab !important;
    color: #ffffff !important;
}

/* Abgemeldete Seiten geben keine Seitenleiste aus, `nx-nav-sidebar` bleibt
   trotzdem am body -- ohne das hier steht das Anmeldefenster nach rechts
   versetzt. Zwei Regeln: `:has()` darf nicht in dieselbe Liste. */
body[class*="client-client_login-"].nx-nav-sidebar .nx-shell {
    margin-left: 0;
    max-width: 100%;
}
body.nx-nav-sidebar:not(:has(.nx-sidebar)) .nx-shell {
    margin-left: 0;
    max-width: 100%;
}