/**
 * ME-Control CI — zentrale Farb-Tokens für alle Layouts.
 *
 * Regeln:
 * - Orange (--au-accent) ist die einzige Markenfarbe: Hauptaktion, aktiver Zustand, Hinweis.
 * - Alles andere ist neutral (Grautöne).
 * - Grün nur für Erfolg/erledigt, Rot nur für Fehler/Löschen.
 * - Kein Blau, Lila, Türkis, Pink; keine Verläufe.
 * - In Templates keine Hex-Farben, sondern var(--au-*).
 *
 * Bootstrap/AdminLTE-Farbklassen werden unten auf diese Tokens abgebildet,
 * damit bestehende Seiten (btn-info, bg-purple, badge-primary …) automatisch im CI erscheinen.
 */
:root {
    --au-accent: #fd900b;
    --au-accent-hover: #e68109;
    --au-accent-light: #ffe4c8;
    --au-accent-text: #b45f00;
    --au-on-accent: #ffffff;
    --au-text: #1f2937;
    --au-text-muted: #6b7280;
    --au-neutral: #4b5563;
    --au-border: #e5e7eb;
    --au-border-strong: #d1d5db;
    --au-bg: #ffffff;
    --au-bg-subtle: #f9fafb;
    --au-bg-muted: #f3f4f6;
    --au-danger: #dc2626;
    --au-danger-light: #fee2e2;
    --au-success: #16a34a;
    --au-success-light: #dcfce7;
    --au-radius: 10px;
    --au-shadow: 0 1px 3px rgba(0, 0, 0, .08);
    --au-focus: 0 0 0 .2rem rgba(253, 144, 11, .25);

    /* Bootstrap-4-Variablen, die AdminLTE-Komponenten zur Laufzeit lesen */
    --primary: #fd900b;
    --secondary: #6b7280;
    --success: #16a34a;
    --info: #4b5563;
    --warning: #fd900b;
    --danger: #dc2626;
    --blue: #fd900b;
    --indigo: #4b5563;
    --purple: #4b5563;
    --pink: #4b5563;
    --teal: #4b5563;
    --cyan: #4b5563;
}

/* ---------- Hintergründe ---------- */
.bg-primary, .bg-warning, .bg-orange, .bg-gradient-primary, .bg-gradient-warning, .bg-gradient-orange {
    background: var(--au-accent) !important; color: var(--au-on-accent) !important;
}
.bg-info, .bg-secondary, .bg-dark, .bg-blue, .bg-lightblue, .bg-navy, .bg-indigo, .bg-purple, .bg-fuchsia,
.bg-pink, .bg-maroon, .bg-teal, .bg-cyan, .bg-olive, .bg-lime, .bg-yellow, .bg-gray, .bg-gray-dark,
.bg-gradient-info, .bg-gradient-secondary, .bg-gradient-dark, .bg-gradient-blue, .bg-gradient-lightblue,
.bg-gradient-navy, .bg-gradient-indigo, .bg-gradient-purple, .bg-gradient-fuchsia, .bg-gradient-pink,
.bg-gradient-maroon, .bg-gradient-teal, .bg-gradient-cyan, .bg-gradient-olive, .bg-gradient-lime {
    background: var(--au-neutral) !important; color: #fff !important;
}
.bg-success, .bg-green, .bg-gradient-success, .bg-gradient-green { background: var(--au-success) !important; color: #fff !important; }
.bg-danger, .bg-red, .bg-gradient-danger, .bg-gradient-red { background: var(--au-danger) !important; color: #fff !important; }
.bg-light { background: var(--au-bg-subtle) !important; }

/* ---------- Text ---------- */
.text-primary, .text-warning, .text-orange { color: var(--au-accent) !important; }
.text-info, .text-secondary, .text-blue, .text-lightblue, .text-navy, .text-indigo, .text-purple, .text-fuchsia,
.text-pink, .text-maroon, .text-teal, .text-cyan, .text-olive, .text-lime, .text-yellow { color: var(--au-neutral) !important; }
.text-muted { color: var(--au-text-muted) !important; }
.text-success, .text-green { color: var(--au-success) !important; }
.text-danger, .text-red { color: var(--au-danger) !important; }

/* ---------- Buttons ---------- */
.btn-primary, .btn-warning {
    background-color: var(--au-accent) !important; border-color: var(--au-accent) !important; color: var(--au-on-accent) !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active,
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active {
    background-color: var(--au-accent-hover) !important; border-color: var(--au-accent-hover) !important; color: var(--au-on-accent) !important;
}
.btn-info, .btn-secondary, .btn-dark, .btn-purple, .btn-indigo, .btn-teal, .btn-pink, .btn-navy, .btn-lightblue, .btn-maroon, .btn-olive {
    background-color: var(--au-neutral) !important; border-color: var(--au-neutral) !important; color: #fff !important;
}
.btn-info:hover, .btn-secondary:hover, .btn-dark:hover, .btn-info:focus, .btn-secondary:focus, .btn-dark:focus {
    background-color: var(--au-text) !important; border-color: var(--au-text) !important; color: #fff !important;
}
.btn-success { background-color: var(--au-success) !important; border-color: var(--au-success) !important; color: #fff !important; }
.btn-danger { background-color: var(--au-danger) !important; border-color: var(--au-danger) !important; color: #fff !important; }
.btn-success:hover, .btn-danger:hover { filter: brightness(.92); }
.btn-light { background-color: var(--au-bg) !important; border-color: var(--au-border-strong) !important; color: var(--au-text) !important; }

.btn-outline-primary, .btn-outline-warning { color: var(--au-accent-text) !important; border-color: var(--au-accent) !important; background: transparent !important; }
.btn-outline-primary:hover, .btn-outline-warning:hover { background: var(--au-accent) !important; color: var(--au-on-accent) !important; }
.btn-outline-info, .btn-outline-secondary, .btn-outline-dark { color: var(--au-neutral) !important; border-color: var(--au-border-strong) !important; background: transparent !important; }
.btn-outline-info:hover, .btn-outline-secondary:hover, .btn-outline-dark:hover { background: var(--au-bg-muted) !important; color: var(--au-text) !important; }
.btn-outline-success { color: var(--au-success) !important; border-color: var(--au-success) !important; }
.btn-outline-success:hover { background: var(--au-success) !important; color: #fff !important; }
.btn-outline-danger { color: var(--au-danger) !important; border-color: var(--au-danger) !important; }
.btn-outline-danger:hover { background: var(--au-danger) !important; color: #fff !important; }
.btn-link { color: var(--au-accent-text); }

/* ---------- Badges ---------- */
.badge-primary, .badge-warning { background: var(--au-accent-light) !important; color: var(--au-accent-text) !important; }
.badge-info, .badge-secondary, .badge-dark, .badge-light { background: var(--au-bg-muted) !important; color: var(--au-neutral) !important; }
.badge-success { background: var(--au-success-light) !important; color: var(--au-success) !important; }
.badge-danger { background: var(--au-danger-light) !important; color: var(--au-danger) !important; }

/* ---------- Hinweise ---------- */
.alert-info, .alert-primary, .alert-secondary, .alert-light {
    background: var(--au-bg-subtle) !important; border: 1px solid var(--au-border) !important;
    border-left: 4px solid var(--au-neutral) !important; color: var(--au-text) !important;
}
.alert-warning { background: var(--au-bg-subtle) !important; border: 1px solid var(--au-border) !important; border-left: 4px solid var(--au-accent) !important; color: var(--au-text) !important; }
.alert-success { background: var(--au-bg-subtle) !important; border: 1px solid var(--au-border) !important; border-left: 4px solid var(--au-success) !important; color: var(--au-text) !important; }
.alert-danger { background: var(--au-bg-subtle) !important; border: 1px solid var(--au-border) !important; border-left: 4px solid var(--au-danger) !important; color: var(--au-text) !important; }
.callout.callout-info, .callout.callout-secondary { border-left-color: var(--au-neutral) !important; }
.callout.callout-primary, .callout.callout-warning { border-left-color: var(--au-accent) !important; }

/* ---------- Karten ---------- */
.card-primary.card-outline, .card-warning.card-outline { border-top: 3px solid var(--au-accent) !important; }
.card-info.card-outline, .card-secondary.card-outline, .card-dark.card-outline,
.card-success.card-outline, .card-danger.card-outline { border-top: 3px solid var(--au-border-strong) !important; }
.card-primary:not(.card-outline) > .card-header, .card-info:not(.card-outline) > .card-header,
.card-secondary:not(.card-outline) > .card-header, .card-dark:not(.card-outline) > .card-header,
.card-warning:not(.card-outline) > .card-header, .card-success:not(.card-outline) > .card-header,
.card-danger:not(.card-outline) > .card-header {
    background: var(--au-bg-subtle) !important; color: var(--au-text) !important;
    border-bottom: 1px solid var(--au-border) !important; border-top: 3px solid var(--au-accent);
}
.card-danger:not(.card-outline) > .card-header { border-top-color: var(--au-danger); }
.card-primary:not(.card-outline) > .card-header a, .card-info:not(.card-outline) > .card-header a,
.card-primary:not(.card-outline) > .card-header .btn-tool, .card-info:not(.card-outline) > .card-header .btn-tool { color: var(--au-text-muted) !important; }

/* ---------- Kennzahlen-Kacheln (AdminLTE small-box / info-box) ---------- */
.small-box.bg-info, .small-box.bg-primary, .small-box.bg-success, .small-box.bg-warning, .small-box.bg-danger,
.small-box.bg-secondary, .small-box.bg-purple, .small-box.bg-teal, .small-box.bg-indigo, .small-box.bg-navy,
.small-box.bg-lightblue, .small-box.bg-pink, .small-box.bg-maroon, .small-box.bg-olive, .small-box.bg-cyan {
    background: var(--au-bg) !important; color: var(--au-text) !important;
    border: 1px solid var(--au-border); border-top: 3px solid var(--au-accent); box-shadow: var(--au-shadow);
}
.small-box.bg-success { border-top-color: var(--au-success); }
.small-box.bg-danger { border-top-color: var(--au-danger); }
.small-box .icon { color: var(--au-border-strong) !important; }
.small-box .small-box-footer { background: var(--au-bg-subtle) !important; color: var(--au-text-muted) !important; }
.small-box .small-box-footer:hover { color: var(--au-accent-text) !important; }
.info-box .info-box-icon.bg-info, .info-box .info-box-icon.bg-primary, .info-box .info-box-icon.bg-warning,
.info-box .info-box-icon.bg-secondary, .info-box .info-box-icon.bg-purple, .info-box .info-box-icon.bg-teal,
.info-box .info-box-icon.bg-indigo, .info-box .info-box-icon.bg-navy, .info-box .info-box-icon.bg-lightblue,
.info-box .info-box-icon.bg-pink, .info-box .info-box-icon.bg-cyan {
    background: var(--au-accent-light) !important; color: var(--au-accent-text) !important;
}
.info-box .info-box-icon.bg-success { background: var(--au-success-light) !important; color: var(--au-success) !important; }
.info-box .info-box-icon.bg-danger { background: var(--au-danger-light) !important; color: var(--au-danger) !important; }

/* ---------- Bedienelemente ---------- */
a { color: var(--au-accent-text); }
a:hover, a:focus { color: var(--au-accent-hover); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link,
.list-group-item.active, .dropdown-item.active, .dropdown-item:active,
.page-item.active .page-link, .progress-bar {
    background-color: var(--au-accent) !important; border-color: var(--au-accent) !important; color: var(--au-on-accent) !important;
}
.page-link { color: var(--au-text); }
.page-link:hover { color: var(--au-accent-text) !important; }
.form-control:focus, .custom-select:focus, .form-select:focus {
    border-color: var(--au-accent) !important; box-shadow: var(--au-focus) !important;
}
.custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--au-accent) !important; border-color: var(--au-accent) !important;
}
.custom-control-input:focus ~ .custom-control-label::before { box-shadow: var(--au-focus) !important; }
input[type=checkbox], input[type=radio], input[type=range], progress { accent-color: var(--au-accent); }
.nav-tabs .nav-link.active { border-top: 2px solid var(--au-accent); color: var(--au-text); }
.table-info, .table-info > td, .table-info > th, .table-primary, .table-primary > td, .table-primary > th { background-color: var(--au-accent-light) !important; }

.brand-powered { padding: 12px 16px; font-size: .75rem; color: var(--au-text-muted); }

/* Mandanten-Einstellung: Vorschau des Erscheinungsbilds */
.tb-row > * { margin-right: 8px; }
.tb-color-input { max-width: 140px; }
.tb-icon-thumb { border-radius: 13px; border: 1px solid var(--au-border); }
.tb-preview { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 14px; border: 1px solid var(--au-border); border-radius: var(--au-radius); background: var(--au-bg-subtle); }
.tb-btn { padding: 8px 16px; border-radius: var(--au-radius); background: var(--tb-accent, var(--au-accent)); color: var(--tb-on, var(--au-on-accent)); font-weight: 600; }
.tb-link { color: var(--tb-text, var(--au-accent-text)); text-decoration: underline; }
.tb-badge { padding: 2px 10px; border-radius: 999px; background: var(--tb-light, var(--au-accent-light)); color: var(--tb-text, var(--au-accent-text)); font-size: .8rem; font-weight: 600; }
.tb-app { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; font-size: .75rem; }
.tb-app-icon { width: 48px; height: 48px; border-radius: 11px; background: var(--tb-accent, var(--au-accent)); }