:root {
            --sidebar-collapsed-width: 84px;
            --sidebar-expanded-width: 270px;
            --topbar-height: 66px;

            --aixserv-blue: #1d4f7a;
            --aixserv-blue-dark: #153b5d;
            --aixserv-blue-light: #e8f0f7;
            --aixserv-silver: #d7dee5;
            --aixserv-border: #c2ccd6;
            --aixserv-accent: #ef9b21;

            --app-bg: #edf1f4;
            --panel-bg: #ffffff;
            --panel-header-bg: linear-gradient(180deg, #f8fafc 0%, #e8edf2 100%);
            --text-main: #243442;
            --text-muted: #657482;
            --sidebar-bg: #173f62;
            --sidebar-border: rgba(255, 255, 255, .12);
            --sidebar-text: #dce8f2;
            --sidebar-hover: rgba(255, 255, 255, .10);
            --sidebar-active: #ffffff;
            --shadow-soft: 0 8px 24px rgba(29, 54, 76, .08);
        }

        [data-bs-theme="dark"] {
            --aixserv-blue: #4c91c8;
            --aixserv-blue-dark: #0b2133;
            --aixserv-blue-light: #183449;
            --aixserv-silver: #344654;
            --aixserv-border: #3b4d5b;
            --app-bg: #0f1921;
            --panel-bg: #18252f;
            --panel-header-bg: linear-gradient(180deg, #22333f 0%, #1a2933 100%);
            --text-main: #e5edf3;
            --text-muted: #9fb0bd;
            --sidebar-bg: #0b2133;
            --sidebar-border: rgba(255, 255, 255, .09);
            --sidebar-text: #c4d6e4;
            --sidebar-hover: rgba(255, 255, 255, .08);
            --sidebar-active: #ffffff;
            --shadow-soft: 0 10px 28px rgba(0, 0, 0, .24);
        }

        * {
            scrollbar-width: thin;
            scrollbar-color: var(--aixserv-border) transparent;
        }

        body {
            min-height: 100vh;
            overflow-x: hidden;
            color: var(--text-main);
            background:
                linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px),
                var(--app-bg);
            background-size: 24px 24px;
            font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
        }

        a {
            text-decoration: none;
        }

        /* Eingeklappte Sidebar: Icons weiß, erst bei Hover/Aktiv orange. */
        .sidebar-collapsed .app-sidebar .sidebar-link,
        .sidebar-collapsed .app-sidebar .sidebar-action-btn {
            color: rgba(255, 255, 255, .96);
        }

        .sidebar-collapsed .app-sidebar .sidebar-link i,
        .sidebar-collapsed .app-sidebar .sidebar-action-btn i {
            color: inherit;
            transition: color .18s ease;
        }

        .sidebar-collapsed .app-sidebar .sidebar-link:hover,
        .sidebar-collapsed .app-sidebar .sidebar-link:focus-visible,
        .sidebar-collapsed .app-sidebar .sidebar-link.active,
        .sidebar-collapsed .app-sidebar .sidebar-action-btn:hover,
        .sidebar-collapsed .app-sidebar .sidebar-action-btn:focus-visible,
        .sidebar-collapsed .app-sidebar .sidebar-action-btn.active {
            color: var(--aixserv-accent);
        }

        .app-topbar {
            position: fixed;
            inset: 0 0 auto 0;
            z-index: 1040;
            min-height: var(--topbar-height);
            color: #fff;
            background:
                linear-gradient(90deg, var(--aixserv-blue-dark), var(--aixserv-blue));
            border-bottom: 1px solid rgba(255, 255, 255, .18);
            box-shadow: 0 4px 18px rgba(13, 37, 56, .18);
        }

        .brand-mark {
            display: inline-grid;
            width: 38px;
            height: 38px;
            place-items: center;
            color: #fff;
            background: linear-gradient(145deg, #f4aa3b, #d98208);
            border: 1px solid rgba(255, 255, 255, .45);
            border-radius: 9px;
            box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, .35),
                0 4px 10px rgba(0, 0, 0, .15);
        }

        .brand-title {
            font-size: 1.05rem;
            font-weight: 700;
            letter-spacing: .02em;
            line-height: 1.05;
        }

        .brand-subtitle {
            display: block;
            margin-top: 3px;
            color: rgba(255, 255, 255, .68);
            font-size: .68rem;
            font-weight: 500;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .topbar-icon-btn {
            display: inline-grid;
            width: 40px;
            height: 40px;
            place-items: center;
            color: #fff;
            background: rgba(255, 255, 255, .08);
            border: 1px solid rgba(255, 255, 255, .18);
            border-radius: 8px;
        }

        .topbar-icon-btn:hover,
        .topbar-icon-btn:focus {
            color: #fff;
            background: rgba(255, 255, 255, .16);
        }

        .app-sidebar {
            position: fixed;
            top: var(--topbar-height);
            bottom: 0;
            left: 0;
            z-index: 1035;
            display: none;
            width: var(--sidebar-collapsed-width);
            overflow-x: hidden;
            overflow-y: auto;
            color: var(--sidebar-text);
            background: var(--sidebar-bg);
            border-right: 1px solid var(--sidebar-border);
            box-shadow: 5px 0 18px rgba(10, 30, 45, .12);
            transition: width .24s ease;
        }

        .sidebar-expanded .app-sidebar {
            width: var(--sidebar-expanded-width);
        }

        .sidebar-nav {
            padding: 14px 10px 28px;
        }

        .sidebar-section-label {
            height: 24px;
            margin: 13px 12px 5px;
            overflow: hidden;
            color: rgba(255, 255, 255, .45);
            font-size: .68rem;
            font-weight: 700;
            letter-spacing: .12em;
            opacity: 0;
            text-transform: uppercase;
            white-space: nowrap;
            transition: opacity .15s ease;
        }

        .sidebar-expanded .sidebar-section-label {
            opacity: 1;
        }

        .sidebar-link {
            position: relative;
            display: flex;
            min-height: 48px;
            margin-bottom: 5px;
            padding: 8px 13px;
            align-items: center;
            gap: 14px;
            color: var(--sidebar-text);
            border: 1px solid transparent;
            border-radius: 8px;
            white-space: nowrap;
            transition:
                background-color .15s ease,
                border-color .15s ease,
                color .15s ease;
        }

        .sidebar-link:hover {
            color: #fff;
            background: var(--sidebar-hover);
            border-color: var(--sidebar-border);
        }

        .sidebar-link.active {
            color: #fff;
            background: linear-gradient(90deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .07));
            border-color: rgba(255, 255, 255, .16);
            box-shadow: inset 3px 0 0 var(--aixserv-accent);
        }

        .sidebar-link .nav-icon {
            display: inline-grid;
            min-width: 36px;
            height: 34px;
            place-items: center;
            font-size: 1.14rem;
        }

        .sidebar-link .nav-label {
            overflow: hidden;
            opacity: 0;
            transform: translateX(-5px);
            transition:
                opacity .16s ease,
                transform .16s ease;
        }

        .sidebar-expanded .sidebar-link .nav-label {
            opacity: 1;
            transform: translateX(0);
        }

        .sidebar-link .nav-badge {
            margin-left: auto;
            opacity: 0;
            transition: opacity .15s ease;
        }

        .sidebar-expanded .sidebar-link .nav-badge {
            opacity: 1;
        }

        .app-content {
            min-height: 100vh;
            padding-top: calc(var(--topbar-height) + 22px);
            transition: margin-left .24s ease;
        }

        .content-inner {
            width: min(1600px, 100%);
            margin-inline: auto;
            padding: 0 14px 32px;
        }

        .classic-breadcrumb {
            color: var(--text-muted);
            font-size: .82rem;
        }

        .page-title {
            margin: 0;
            font-size: clamp(1.35rem, 2vw, 1.9rem);
            font-weight: 700;
            letter-spacing: -.02em;
        }

        .page-subtitle {
            margin: 5px 0 0;
            color: var(--text-muted);
            font-size: .9rem;
        }

        .classic-panel {
            overflow: hidden;
            background: var(--panel-bg);
            border: 1px solid var(--aixserv-border);
            border-radius: 8px;
            box-shadow: var(--shadow-soft);
        }

        .classic-panel-header {
            display: flex;
            min-height: 48px;
            padding: 10px 15px;
            align-items: center;
            justify-content: space-between;
            background: var(--panel-header-bg);
            border-bottom: 1px solid var(--aixserv-border);
        }

        .classic-panel-title {
            display: flex;
            margin: 0;
            align-items: center;
            gap: 9px;
            font-size: .92rem;
            font-weight: 700;
        }

        .classic-panel-title i {
            color: var(--aixserv-blue);
        }

        .classic-panel-body {
            padding: 16px;
        }

        .status-card {
            position: relative;
            height: 100%;
            overflow: hidden;
            background: var(--panel-bg);
            border: 1px solid var(--aixserv-border);
            border-radius: 8px;
            box-shadow: var(--shadow-soft);
        }

        .status-card::before {
            position: absolute;
            inset: 0 auto 0 0;
            width: 4px;
            content: "";
            background: var(--status-color, var(--aixserv-blue));
        }

        .status-card-body {
            display: flex;
            min-height: 118px;
            padding: 18px 16px 17px 20px;
            align-items: flex-start;
            gap: 15px;
        }

        .status-icon {
            display: inline-grid;
            width: 46px;
            height: 46px;
            flex: 0 0 auto;
            place-items: center;
            color: var(--status-color, var(--aixserv-blue));
            background: color-mix(in srgb, var(--status-color, var(--aixserv-blue)) 13%, transparent);
            border: 1px solid color-mix(in srgb, var(--status-color, var(--aixserv-blue)) 26%, transparent);
            border-radius: 8px;
            font-size: 1.3rem;
        }

        .status-label {
            color: var(--text-muted);
            font-size: .73rem;
            font-weight: 700;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .status-value {
            margin-top: 2px;
            font-size: 1.55rem;
            font-weight: 750;
            line-height: 1.15;
        }

        .status-meta {
            margin-top: 7px;
            color: var(--text-muted);
            font-size: .78rem;
        }

        .progress {
            --bs-progress-bg: color-mix(in srgb, var(--aixserv-border) 55%, transparent);
            height: 7px;
            border-radius: 3px;
        }

        .quick-action {
            display: flex;
            min-height: 78px;
            padding: 12px;
            align-items: center;
            gap: 12px;
            color: var(--text-main);
            background: color-mix(in srgb, var(--panel-bg) 88%, var(--aixserv-blue-light));
            border: 1px solid var(--aixserv-border);
            border-radius: 7px;
            transition:
                transform .15s ease,
                border-color .15s ease,
                box-shadow .15s ease;
        }

        .quick-action:hover {
            color: var(--text-main);
            border-color: color-mix(in srgb, var(--aixserv-blue) 65%, var(--aixserv-border));
            box-shadow: 0 7px 18px rgba(23, 66, 99, .12);
            transform: translateY(-2px);
        }

        .quick-action-icon {
            display: inline-grid;
            width: 42px;
            height: 42px;
            flex: 0 0 auto;
            place-items: center;
            color: #fff;
            background: linear-gradient(145deg, var(--aixserv-blue), var(--aixserv-blue-dark));
            border-radius: 7px;
            font-size: 1.12rem;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22);
        }

        .quick-action-title {
            font-size: .86rem;
            font-weight: 700;
        }

        .quick-action-text {
            margin-top: 2px;
            color: var(--text-muted);
            font-size: .73rem;
        }

        .classic-table {
            --bs-table-bg: transparent;
            --bs-table-color: var(--text-main);
            --bs-table-border-color: var(--aixserv-border);
            margin-bottom: 0;
            font-size: .84rem;
        }

        .classic-table > :not(caption) > * > * {
            padding: .75rem .85rem;
            vertical-align: middle;
        }

        .classic-table thead th {
            color: var(--text-muted);
            background: color-mix(in srgb, var(--panel-bg) 75%, var(--aixserv-blue-light));
            font-size: .7rem;
            font-weight: 800;
            letter-spacing: .07em;
            text-transform: uppercase;
        }

        .server-state {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            font-size: .78rem;
            font-weight: 650;
        }

        .server-state-dot {
            width: 8px;
            height: 8px;
            background: #2aa765;
            border-radius: 50%;
            box-shadow: 0 0 0 4px rgba(42, 167, 101, .13);
        }

        .activity-item {
            display: flex;
            padding: 11px 0;
            align-items: flex-start;
            gap: 11px;
            border-bottom: 1px solid var(--aixserv-border);
        }

        .activity-item:last-child {
            padding-bottom: 0;
            border-bottom: 0;
        }

        .activity-icon {
            display: inline-grid;
            width: 34px;
            height: 34px;
            flex: 0 0 auto;
            place-items: center;
            color: var(--aixserv-blue);
            background: var(--aixserv-blue-light);
            border: 1px solid color-mix(in srgb, var(--aixserv-blue) 22%, transparent);
            border-radius: 7px;
        }

        .activity-title {
            font-size: .82rem;
            font-weight: 650;
        }

        .activity-meta {
            margin-top: 3px;
            color: var(--text-muted);
            font-size: .72rem;
        }

        .classic-alert {
            color: var(--text-main);
            background:
                linear-gradient(90deg, rgba(239, 155, 33, .14), transparent 70%),
                var(--panel-bg);
            border: 1px solid color-mix(in srgb, var(--aixserv-accent) 50%, var(--aixserv-border));
            border-left: 4px solid var(--aixserv-accent);
            border-radius: 7px;
        }

        .top-status {
            display: none;
            align-items: center;
            gap: 18px;
            color: rgba(255, 255, 255, .78);
            font-size: .74rem;
        }

        .top-status-item {
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .offcanvas {
            --bs-offcanvas-width: 290px;
            color: var(--sidebar-text);
            background: var(--sidebar-bg);
        }

        .offcanvas .sidebar-section-label,
        .offcanvas .sidebar-link .nav-label,
        .offcanvas .sidebar-link .nav-badge {
            opacity: 1;
            transform: none;
        }

        .offcanvas .sidebar-section-label {
            height: auto;
        }

        .offcanvas .sidebar-link {
            color: var(--sidebar-text);
        }

        .btn-aixserv {
            --bs-btn-color: #fff;
            --bs-btn-bg: var(--aixserv-blue);
            --bs-btn-border-color: var(--aixserv-blue-dark);
            --bs-btn-hover-color: #fff;
            --bs-btn-hover-bg: var(--aixserv-blue-dark);
            --bs-btn-hover-border-color: var(--aixserv-blue-dark);
        }

        .dropdown-menu {
            --bs-dropdown-bg: var(--panel-bg);
            --bs-dropdown-color: var(--text-main);
            --bs-dropdown-border-color: var(--aixserv-border);
            --bs-dropdown-link-color: var(--text-main);
            --bs-dropdown-link-hover-bg: var(--aixserv-blue-light);
            box-shadow: var(--shadow-soft);
        }

        .form-control,
        .form-select {
            background-color: var(--panel-bg);
            border-color: var(--aixserv-border);
        }

        .modal-content {
            background: var(--panel-bg);
            border-color: var(--aixserv-border);
        }

        .legacy-caption {
            display: inline-flex;
            padding: 4px 8px;
            align-items: center;
            color: var(--text-muted);
            background: color-mix(in srgb, var(--panel-bg) 74%, var(--aixserv-silver));
            border: 1px solid var(--aixserv-border);
            border-radius: 4px;
            font-size: .7rem;
            font-weight: 650;
            letter-spacing: .03em;
        }

        @media (min-width: 992px) {
            .app-sidebar {
                display: block;
            }

            .app-content {
                margin-left: var(--sidebar-collapsed-width);
            }

            .sidebar-expanded .app-content {
                margin-left: var(--sidebar-expanded-width);
            }

            .content-inner {
                padding-inline: 24px;
            }

            .top-status {
                display: flex;
            }
        }

        @media (max-width: 575.98px) {
            .brand-subtitle,
            .desktop-user-label {
                display: none;
            }

            .content-inner {
                padding-inline: 10px;
            }

            .classic-panel-body {
                padding: 12px;
            }

            .status-card-body {
                min-height: 104px;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            *,
            *::before,
            *::after {
                scroll-behavior: auto !important;
                transition-duration: .01ms !important;
                animation-duration: .01ms !important;
                animation-iteration-count: 1 !important;
            }
        }


        /* ================================================================
         * Aixserv Backend Shell – Standard nach AixSCP
         * ================================================================ */
        :root {
            --sidebar-expanded-width: 252px;
            --sidebar-collapsed-width: 58px;
            --topbar-height: 62px;
            --aixserv-topbar-bg: #1d4f7a;
        }

        .app-sidebar {
            top: 0;
            width: var(--sidebar-expanded-width);
            height: 100vh;
            display: none;
            flex-direction: column;
            overflow: hidden;
            box-shadow: none;
            transition: width .25s ease;
        }

        .sidebar-collapsed .app-sidebar {
            width: var(--sidebar-collapsed-width);
        }

        .sidebar-brand {
            display: flex;
            height: var(--topbar-height);
            min-height: var(--topbar-height);
            padding: 0 .55rem 0 1rem;
            align-items: center;
            gap: .6rem;
            border-bottom: 1px solid rgba(255, 255, 255, .08);
            white-space: nowrap;
        }

        .sidebar-brand-link {
            display: flex;
            min-width: 0;
            flex: 1;
            align-items: center;
            gap: .5rem;
            overflow: hidden;
            color: #fff;
            font-size: .9rem;
            font-weight: 750;
            text-overflow: ellipsis;
        }

        .sidebar-brand-link:hover,
        .sidebar-brand-link:focus {
            color: #fff;
        }

        .sidebar-brand-icon {
            flex: 0 0 auto;
            color: var(--aixserv-accent);
            font-size: 1.05rem;
        }

        .sidebar-brand-name {
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .sidebar-toggle-btn {
            display: inline-flex;
            width: 32px;
            height: 32px;
            flex: 0 0 auto;
            margin-left: auto;
            align-items: center;
            justify-content: center;
            color: rgba(255, 255, 255, .55);
            background: transparent;
            border: 0;
            border-radius: 6px;
            transition: background-color .15s ease, color .15s ease;
        }

        .sidebar-toggle-btn:hover,
        .sidebar-toggle-btn:focus {
            color: #fff;
            background: rgba(255, 255, 255, .08);
        }

        .sidebar-nav {
            flex: 1;
            min-height: 0;
            padding: .55rem .5rem;
            overflow-x: hidden;
            overflow-y: auto;
        }

        .sidebar-section-label {
            height: auto;
            margin: 0;
            padding: .72rem .55rem .3rem;
            color: rgba(255, 255, 255, .35);
            font-size: .61rem;
            letter-spacing: .1em;
            opacity: 1;
        }

        .sidebar-link {
            min-height: 44px;
            margin-bottom: 3px;
            padding: .5rem .55rem;
            gap: .55rem;
            border-radius: 7px;
        }

        .sidebar-link .nav-icon {
            width: 1.35rem;
            min-width: 1.35rem;
            height: auto;
            color: rgba(255, 255, 255, .5);
            font-size: 1rem;
        }

        .sidebar-link .nav-label,
        .sidebar-link .nav-badge {
            opacity: 1;
            transform: none;
        }

        /*
         * AixSCP-Verhalten: Texte fahren weich ein/aus, Icons bleiben
         * im eingeklappten Zustand vollständig bedienbar.
         */
        .app-sidebar .sidebar-label {
            display: inline-block;
            max-width: 190px;
            overflow: hidden;
            opacity: 1;
            white-space: nowrap;
            transition: max-width .22s ease, opacity .16s ease;
        }

        .sidebar-link:hover .nav-icon,
        .sidebar-link.active .nav-icon {
            color: var(--aixserv-accent);
        }

        .sidebar-link.active {
            background: rgba(255, 255, 255, .11);
            border-color: rgba(255, 255, 255, .2);
            box-shadow: inset 3px 0 0 var(--aixserv-accent);
        }

        .sidebar-actions {
            flex: 0 0 auto;
            margin-top: auto;
            padding: .35rem .5rem;
            border-top: 1px solid rgba(255, 255, 255, .08);
        }

        .sidebar-action-btn {
            display: flex;
            width: 100%;
            padding: .5rem .55rem;
            align-items: center;
            gap: .55rem;
            color: rgba(255, 255, 255, .82);
            background: transparent;
            border: 0;
            border-radius: 7px;
            font-size: .875rem;
            font-weight: 500;
            text-align: left;
            white-space: nowrap;
            transition: background-color .15s ease, color .15s ease;
        }

        .sidebar-action-btn i {
            width: 1.35rem;
            flex: 0 0 auto;
            color: rgba(255, 255, 255, .5);
            text-align: center;
        }

        .sidebar-action-btn:hover,
        .sidebar-action-btn:focus {
            color: #fff;
            background: rgba(255, 255, 255, .08);
        }

        .sidebar-action-btn:hover i,
        .sidebar-action-btn:focus i {
            color: var(--aixserv-accent);
        }

        .sidebar-action-danger {
            color: #ff7770;
        }

        .sidebar-action-danger i {
            color: rgba(255, 105, 95, .7);
        }

        .sidebar-action-danger:hover,
        .sidebar-action-danger:focus {
            color: #ff8c85;
            background: rgba(220, 53, 69, .12);
        }

        .sidebar-action-danger:hover i,
        .sidebar-action-danger:focus i {
            color: #ff8c85;
        }

        .sidebar-collapsed .app-sidebar .sidebar-label {
            width: auto;
            max-width: 0;
            opacity: 0;
            pointer-events: none;
        }

        .sidebar-collapsed .sidebar-brand {
            padding: 0;
            justify-content: center;
            gap: 0;
        }

        .sidebar-collapsed .sidebar-brand-link {
            display: none;
        }

        .sidebar-collapsed .sidebar-toggle-btn {
            margin-left: 0;
        }

        .sidebar-collapsed .sidebar-section-label {
            height: 0;
            padding: 0;
            overflow: hidden;
        }

        .sidebar-collapsed .sidebar-link,
        .sidebar-collapsed .sidebar-action-btn {
            justify-content: center;
            gap: 0;
            padding-right: 0;
            padding-left: 0;
        }

        .sidebar-collapsed .sidebar-link .nav-icon,
        .sidebar-collapsed .sidebar-action-btn i {
            color: rgba(255, 255, 255, .96);
        }

        .sidebar-collapsed .sidebar-link:hover .nav-icon,
        .sidebar-collapsed .sidebar-link:focus-visible .nav-icon,
        .sidebar-collapsed .sidebar-link.active .nav-icon,
        .sidebar-collapsed .sidebar-action-btn:hover i,
        .sidebar-collapsed .sidebar-action-btn:focus-visible i,
        .sidebar-collapsed .sidebar-action-btn.active i {
            color: var(--aixserv-accent);
        }

        .sidebar-collapsed .sidebar-link .nav-badge {
            display: none;
        }

        /*
         * Dezente Sidebar-Tooltips im Aixserv-Look.
         * Sie werden per JavaScript ausschließlich bei eingeklappter
         * Desktop-Sidebar aktiviert.
         */
        .aixserv-sidebar-tooltip {
            --bs-tooltip-opacity: 1;
            --bs-tooltip-bg: #173f62;
            --bs-tooltip-color: #fff;
        }

        .aixserv-sidebar-tooltip .tooltip-inner {
            padding: .42rem .68rem;
            color: #fff;
            background: #173f62;
            border: 1px solid rgba(255, 255, 255, .16);
            border-radius: 6px;
            box-shadow: 0 5px 14px rgba(10, 30, 45, .22);
            font-size: .78rem;
            font-weight: 600;
            letter-spacing: .01em;
        }

        .aixserv-sidebar-tooltip.bs-tooltip-end .tooltip-arrow::before,
        .aixserv-sidebar-tooltip.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before {
            border-right-color: #ffffff;
        }

        .aixserv-sidebar-tooltip.bs-tooltip-start .tooltip-arrow::before,
        .aixserv-sidebar-tooltip.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before {
            border-left-color: #ffffff;
        }

        .aixserv-sidebar-tooltip.bs-tooltip-top .tooltip-arrow::before,
        .aixserv-sidebar-tooltip.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before {
            border-top-color: #ffffff;
        }

        .aixserv-sidebar-tooltip.bs-tooltip-bottom .tooltip-arrow::before,
        .aixserv-sidebar-tooltip.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before {
            border-bottom-color: #ffffff;
        }

        .app-topbar {
            min-height: var(--topbar-height);
            height: var(--topbar-height);
            background: var(--aixserv-topbar-bg);
            border-bottom: 1px solid rgba(255, 255, 255, .12);
            box-shadow: none;
            transition: left .25s ease;
        }

        .navbar-user-toggle {
            padding: .3rem .55rem;
            color: #fff;
            background: rgba(255, 255, 255, .06);
            border: 1px solid rgba(255, 255, 255, .16);
            border-radius: 9px;
        }

        .navbar-user-toggle:hover,
        .navbar-user-toggle:focus,
        .navbar-user-toggle.show {
            color: #fff;
            background: rgba(255, 255, 255, .11);
            border-color: rgba(255, 255, 255, .24);
        }

        .navbar-user-avatar {
            display: inline-flex;
            width: 30px;
            height: 30px;
            flex: 0 0 auto;
            align-items: center;
            justify-content: center;
            color: #fff;
            background: linear-gradient(145deg, #f4aa3b, #d98208);
            border-radius: 50%;
            font-size: .78rem;
            font-weight: 750;
        }

        .navbar-user-name {
            font-size: .82rem;
            font-weight: 600;
        }

        .navbar-user-action-icon {
            color: rgba(255, 255, 255, .48);
            font-size: .9rem;
        }

        .sidebar-mobile-brand {
            min-height: var(--topbar-height);
            border-bottom: 1px solid rgba(255, 255, 255, .08);
        }

        /* Bewusst entfernt: Branding, Hostname, Uhrzeit und Theme-Button in der Topbar. */
        .top-status,
        .brand-title,
        .brand-subtitle {
            display: none !important;
        }

        @media (min-width: 992px) {
            .app-sidebar {
                display: flex;
            }

            .app-topbar {
                left: var(--sidebar-expanded-width);
            }

            .app-content {
                margin-left: var(--sidebar-expanded-width);
            }

            .sidebar-collapsed .app-topbar {
                left: var(--sidebar-collapsed-width);
            }

            .sidebar-collapsed .app-content {
                margin-left: var(--sidebar-collapsed-width);
            }
        }

        @media (max-width: 991.98px) {
            .app-topbar {
                left: 0;
            }

            .app-content {
                margin-left: 0;
            }

            .offcanvas .sidebar-section-label,
            .offcanvas .sidebar-link .nav-label,
            .offcanvas .sidebar-link .nav-badge {
                width: auto;
                opacity: 1;
                transform: none;
            }
        }


        /* ================================================================
         * Aixserv Accessibility Center
         * Ein dezenter Einstiegspunkt, Einstellungen dauerhaft im Browser.
         * ================================================================ */
        :focus-visible {
            outline: 3px solid #ffb000;
            outline-offset: 3px;
        }

        .a11y-trigger-icon {
            color: rgba(255, 255, 255, .62) !important;
        }

        .sidebar-action-btn:hover .a11y-trigger-icon,
        .sidebar-action-btn:focus .a11y-trigger-icon {
            color: var(--aixserv-accent) !important;
        }

        .a11y-modal .modal-dialog {
            max-width: 760px;
        }

        .a11y-modal .modal-header {
            align-items: flex-start;
        }

        .a11y-modal-title-icon {
            display: inline-grid;
            width: 40px;
            height: 40px;
            flex: 0 0 auto;
            place-items: center;
            color: var(--aixserv-blue);
            background: var(--aixserv-blue-light);
            border: 1px solid color-mix(in srgb, var(--aixserv-blue) 28%, transparent);
            border-radius: 9px;
        }

        .a11y-section {
            padding: 1rem;
            background: color-mix(in srgb, var(--panel-bg) 94%, var(--aixserv-blue-light));
            border: 1px solid var(--aixserv-border);
            border-radius: 9px;
        }

        .a11y-section-title {
            margin: 0 0 .25rem;
            font-size: .9rem;
            font-weight: 750;
        }

        .a11y-section-text {
            margin: 0;
            color: var(--text-muted);
            font-size: .78rem;
        }

        .a11y-text-controls {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
            align-items: center;
        }

        .a11y-text-value {
            min-width: 64px;
            font-variant-numeric: tabular-nums;
            text-align: center;
        }

        .a11y-option {
            display: flex;
            min-height: 74px;
            padding: .8rem .9rem;
            align-items: center;
            gap: .8rem;
            background: var(--panel-bg);
            border: 1px solid var(--aixserv-border);
            border-radius: 8px;
        }

        .a11y-option-icon {
            display: inline-grid;
            width: 36px;
            height: 36px;
            flex: 0 0 auto;
            place-items: center;
            color: var(--aixserv-blue);
            background: var(--aixserv-blue-light);
            border-radius: 8px;
        }

        .a11y-option-copy {
            min-width: 0;
            flex: 1;
        }

        .a11y-option-title {
            display: block;
            font-size: .84rem;
            font-weight: 700;
        }

        .a11y-option-description {
            display: block;
            margin-top: .12rem;
            color: var(--text-muted);
            font-size: .72rem;
            line-height: 1.35;
        }

        .a11y-option .form-check-input {
            width: 2.4rem;
            height: 1.25rem;
            flex: 0 0 auto;
            margin: 0;
            cursor: pointer;
        }

        .a11y-preview {
            padding: .9rem 1rem;
            color: var(--text-main);
            background: var(--panel-bg);
            border: 1px dashed var(--aixserv-border);
            border-radius: 8px;
        }

        /* Hoher Kontrast: funktioniert unabhängig von Hell-/Darkmode. */
        html.a11y-high-contrast {
            --app-bg: #ffffff;
            --panel-bg: #ffffff;
            --panel-header-bg: #ffffff;
            --text-main: #000000;
            --text-muted: #202020;
            --aixserv-border: #000000;
            --aixserv-blue: #003f75;
            --aixserv-blue-dark: #002b50;
            --aixserv-blue-light: #e6f2ff;
            --aixserv-accent: #b85c00;
        }

        html.a11y-high-contrast[data-bs-theme="dark"] {
            --app-bg: #000000;
            --panel-bg: #000000;
            --panel-header-bg: #000000;
            --text-main: #ffffff;
            --text-muted: #f0f0f0;
            --aixserv-border: #ffffff;
            --aixserv-blue: #8ecbff;
            --aixserv-blue-dark: #002b50;
            --aixserv-blue-light: #112b3d;
            --aixserv-accent: #ffc14d;
        }

        html.a11y-high-contrast .classic-panel,
        html.a11y-high-contrast .status-card,
        html.a11y-high-contrast .a11y-option,
        html.a11y-high-contrast .a11y-section,
        html.a11y-high-contrast .dropdown-menu,
        html.a11y-high-contrast .modal-content,
        html.a11y-high-contrast .form-control,
        html.a11y-high-contrast .form-select {
            border-width: 2px;
        }

        /* Textabstände nach einem gut lesbaren, großzügigen Profil. */
        html.a11y-readable-spacing main,
        html.a11y-readable-spacing .modal-body,
        html.a11y-readable-spacing .dropdown-menu {
            line-height: 1.65;
            letter-spacing: .035em;
            word-spacing: .08em;
        }

        html.a11y-readable-spacing p {
            margin-bottom: 1.4em;
        }

        /* Links im Inhaltsbereich nicht allein über Farbe kenntlich machen. */
        html.a11y-underline-links main a:not(.btn):not(.quick-action),
        html.a11y-underline-links .modal-body a:not(.btn) {
            text-decoration: underline !important;
            text-decoration-thickness: .12em;
            text-underline-offset: .18em;
        }

        html.a11y-strong-focus :focus-visible {
            outline: 4px solid #ffb000 !important;
            outline-offset: 4px !important;
            box-shadow: 0 0 0 2px #000 !important;
        }

        html.a11y-large-targets .btn,
        html.a11y-large-targets button,
        html.a11y-large-targets input:not([type="hidden"]),
        html.a11y-large-targets select,
        html.a11y-large-targets textarea,
        html.a11y-large-targets .dropdown-item,
        html.a11y-large-targets .sidebar-link,
        html.a11y-large-targets .sidebar-action-btn {
            min-height: 44px;
        }

        html.a11y-reduced-motion *,
        html.a11y-reduced-motion *::before,
        html.a11y-reduced-motion *::after {
            scroll-behavior: auto !important;
            transition-duration: .01ms !important;
            transition-delay: 0s !important;
            animation-duration: .01ms !important;
            animation-iteration-count: 1 !important;
        }

        @media (max-width: 575.98px) {
            .a11y-option {
                align-items: flex-start;
            }
        }

/* AixServ PHP Security Base additions */
body.login-page { display:grid; min-height:100vh; place-items:center; padding:1rem; }
.login-shell { width:min(440px,100%); }
.login-brand { display:flex; align-items:center; gap:.75rem; margin-bottom:1rem; }
.login-brand-icon { display:inline-grid; width:46px; height:46px; place-items:center; color:#fff; background:linear-gradient(145deg,#f4aa3b,#d98208); border-radius:10px; font-size:1.25rem; }
.aixserv-honeypot { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.status-security { --status-color:#2aa765; }
.status-php { --status-color:#287bb5; }
.status-user { --status-color:#7658b8; }
.status-session { --status-color:#d98208; }
.code-inline { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size:.78rem; }
.break-anywhere { overflow-wrap:anywhere; }