/*!
 * aslh-lexyhost – Basis + Bootstrap-4/WHMCS-Abbildung auf die Tokens
 * Lädt nach all.min.css / theme.min.css (twenty-one-Gerüst) und überschreibt deren feste Farben,
 * damit jede Client-Area-Seite in hell UND dunkel funktioniert.
 */

/* ============ Basis & Browser-Oberflächen ============ */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 6rem; }
body {
  background: var(--aslh-color-bg);
  color: var(--aslh-color-text);
  font-family: var(--aslh-font-body);
  font-size: var(--aslh-text-base);
  line-height: var(--aslh-leading-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-variant-numeric: tabular-nums;
}
body.primary-bg-color { background: var(--aslh-color-bg); }

html.aslh-theme-anim body,
html.aslh-theme-anim body *:not(.aslh-island__glow) {
  transition: background-color var(--aslh-dur-theme) var(--aslh-ease-out),
              border-color var(--aslh-dur-theme) var(--aslh-ease-out),
              color var(--aslh-dur-theme) var(--aslh-ease-out),
              fill var(--aslh-dur-theme) var(--aslh-ease-out) !important;
}

::selection { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }
* { scrollbar-color: var(--aslh-color-border-strong) transparent; scrollbar-width: thin; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--aslh-color-border-strong); border-radius: 0; border: 2px solid var(--aslh-color-bg); }
::-webkit-scrollbar-track { background: transparent; }
input, textarea { caret-color: var(--aslh-color-brand-text); }

:focus { outline: none; }
:focus-visible,
.btn:focus-visible,
.form-control:focus-visible {
  outline: 2px solid var(--aslh-color-focus);
  outline-offset: 2px;
  box-shadow: none;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--aslh-font-display);
  font-weight: 600;
  letter-spacing: -0.015em;
  line-height: var(--aslh-leading-snug);
  color: var(--aslh-color-text);
  text-wrap: balance;
  margin-top: 0;
}
h1, .h1 { font-size: var(--aslh-text-3xl); letter-spacing: var(--aslh-tracking-display); line-height: var(--aslh-leading-tight); font-weight: 700; }
h2, .h2 { font-size: var(--aslh-text-2xl); }
h3, .h3 { font-size: var(--aslh-text-xl); }
h4, .h4 { font-size: var(--aslh-text-lg); }
h5, .h5, h6, .h6 { font-size: var(--aslh-text-base); }
p { text-wrap: pretty; }

a { color: var(--aslh-color-brand-text); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
a:hover, a:focus { color: var(--aslh-color-text); text-decoration-color: var(--aslh-color-brand); }
hr { border-top-color: var(--aslh-color-border); }
small, .small, .text-muted, .text-secondary { color: var(--aslh-color-text-muted) !important; }
.text-primary { color: var(--aslh-color-brand-text) !important; }
.text-success { color: var(--aslh-color-success) !important; }
.text-danger { color: var(--aslh-color-danger) !important; }
.text-warning { color: var(--aslh-color-warning) !important; }
.text-info { color: var(--aslh-color-info) !important; }
.text-dark, .text-body { color: var(--aslh-color-text) !important; }
.bg-white, .bg-light { background-color: var(--aslh-color-surface-raised) !important; }
.bg-default, .bg-secondary { background-color: var(--aslh-color-surface) !important; }
.border, .border-top, .border-bottom, .border-left, .border-right { border-color: var(--aslh-color-border) !important; }
code, kbd, pre { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; }
code { color: var(--aslh-color-brand-text); }
pre { background: var(--aslh-color-surface-sunken); color: var(--aslh-color-text); border-radius: 0; padding: var(--aslh-space-4); }
blockquote { border-left: 1px solid var(--aslh-color-border-strong); padding-left: var(--aslh-space-4); color: var(--aslh-color-text-muted); }

.sr-only-focusable:focus { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); padding: var(--aslh-space-2) var(--aslh-space-4); border-radius: 0; z-index: 2000; }

/* ============ Seitenrahmen ============ */
.container, .container-fluid { padding-left: var(--aslh-gutter); padding-right: var(--aslh-gutter); }
@media (min-width: 1200px) { .container { max-width: var(--aslh-page-max); } }

#main-body { background: transparent; min-height: 60vh; } /* Abstände: css/aslh-nav.css (.aslh-top) */
/* Mehr senkrechte Luft (Nutzerwunsch 2026-10-08): Überschriftenblock, Karten, Seitenleiste und Hinweise weiter auseinander */
.primary-content > h1:first-child,
.primary-content > .header-lined h1 { margin-bottom: var(--aslh-space-4); }
.header-lined { border: 0; margin-bottom: clamp(2rem, 1.5rem + 1.5vw, 3rem); }
#main-body .card:not(.card .card) { margin-bottom: 2rem; }
.sidebar .card, .card-sidebar { margin-bottom: 2rem; }
.tiles { margin-bottom: 2.5rem !important; }
#main-body .alert { margin-bottom: 1.5rem; }
.header-lined h1 { font-size: var(--aslh-text-2xl); }

/* Brotkrumen */
.master-breadcrumb { background: transparent; border: 0; }
.breadcrumb { background: transparent; padding: 0; margin: 0; font-size: var(--aslh-text-sm); }
.breadcrumb-item, .breadcrumb-item a { color: var(--aslh-color-text-muted); }
.breadcrumb-item a:hover { color: var(--aslh-color-text); }
.breadcrumb-item.active { color: var(--aslh-color-text); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--aslh-color-border-strong); content: "/"; }

/* ============ Buttons: Cart-Tasten ============ */
.btn {
  font-family: var(--aslh-font-display);
  font-weight: 600;
  font-size: var(--aslh-text-sm);
  letter-spacing: 0.01em;
  border-radius: 0;
  padding: 0.6rem 1.15rem;
  border-width: 1px;
  transition: transform var(--aslh-dur-fast) var(--aslh-ease-out),
              background-color var(--aslh-dur-fast) var(--aslh-ease-out),
              border-color var(--aslh-dur-fast) var(--aslh-ease-out),
              box-shadow var(--aslh-dur-fast) var(--aslh-ease-out),
              color var(--aslh-dur-fast) var(--aslh-ease-out);
}
.btn:active:not(:disabled):not(.disabled) { transform: translateY(1px); }
.btn-lg { padding: 0.85rem 1.6rem; font-size: var(--aslh-text-base); border-radius: 0; }
.btn-sm { padding: 0.35rem 0.75rem; font-size: var(--aslh-text-xs); border-radius: 0; }
.btn.disabled, .btn:disabled { opacity: 0.45; cursor: not-allowed; }

.btn-primary, .btn-success, .btn-checkout, .btn-order-now {
  background: var(--aslh-color-brand);
  border-color: var(--aslh-color-brand);
  color: var(--aslh-color-on-brand);
  box-shadow: var(--aslh-key-bevel), var(--aslh-shadow-sm);
}
.btn-primary:hover, .btn-primary:focus, .btn-success:hover, .btn-success:focus,
.btn-checkout:hover, .btn-order-now:hover,
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active {
  /* Hover wird zum LH-Logo: Graphit-Quadrat, oranger Rahmen, orange Schrift */
  background: var(--aslh-color-mark);
  border-color: var(--aslh-color-brand);
  color: var(--aslh-color-brand);
  box-shadow: inset 0 0 0 1px var(--aslh-color-brand), var(--aslh-shadow-md);
}
.btn-default, .btn-secondary, .btn-light, .btn-outline-secondary, .btn-outline-default, .btn-outline-light {
  background: var(--aslh-color-surface-raised);
  border-color: var(--aslh-color-border);
  color: var(--aslh-color-text);
  box-shadow: var(--aslh-shadow-sm);
}
.btn-default:hover, .btn-secondary:hover, .btn-light:hover, .btn-outline-secondary:hover, .btn-outline-default:hover, .btn-outline-light:hover,
.btn-default:focus, .btn-secondary:focus {
  background: var(--aslh-color-surface);
  border-color: var(--aslh-color-border-strong);
  color: var(--aslh-color-text);
}
.btn-outline-primary {
  background: transparent;
  border-color: var(--aslh-color-brand);
  color: var(--aslh-color-brand-text);
}
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary.active {
  background: var(--aslh-color-brand);
  border-color: var(--aslh-color-brand);
  color: var(--aslh-color-on-brand);
}
.btn-info, .btn-outline-info:hover { background: var(--aslh-color-info-bg); border-color: var(--aslh-color-info); color: var(--aslh-color-info); }
.btn-info:hover { background: var(--aslh-color-info); color: var(--aslh-color-surface-raised); }
.btn-outline-info { border-color: var(--aslh-color-info); color: var(--aslh-color-info); background: transparent; }
.btn-danger, .btn-outline-danger:hover { background: var(--aslh-color-danger); border-color: var(--aslh-color-danger); color: #FFFFFF; }
.btn-outline-danger { border-color: var(--aslh-color-danger); color: var(--aslh-color-danger); background: transparent; }
.btn-warning { background: var(--aslh-color-warning-bg); border-color: var(--aslh-color-warning); color: var(--aslh-color-warning); }
.btn-outline-success { border-color: var(--aslh-color-success); color: var(--aslh-color-success); background: transparent; }
.btn-outline-success:hover { background: var(--aslh-color-success); color: var(--aslh-color-bg); }
.btn-link { color: var(--aslh-color-brand-text); font-weight: 600; }
.btn-link:hover { color: var(--aslh-color-text); }
.btn-group > .btn { box-shadow: none; }

/* ============ Formulare ============ */
label, .col-form-label { font-weight: 600; font-size: var(--aslh-text-sm); color: var(--aslh-color-text); }
.form-control, .custom-select, select.form-control, .input-group-text, .custom-file-label, .bootstrap-select .btn {
  background-color: var(--aslh-color-surface-raised);
  border: 1px solid var(--aslh-color-border);
  color: var(--aslh-color-text);
  border-radius: 0;
  min-height: 2.75rem;
  transition: border-color var(--aslh-dur-fast) var(--aslh-ease-out), box-shadow var(--aslh-dur-fast) var(--aslh-ease-out);
}
.form-control::placeholder { color: var(--aslh-color-text-muted); opacity: 1; }
.form-control:focus, .custom-select:focus {
  background-color: var(--aslh-color-surface-raised);
  border-color: var(--aslh-color-brand);
  color: var(--aslh-color-text);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--aslh-color-brand) 30%, transparent);
}
.form-control:disabled, .form-control[readonly] { background-color: var(--aslh-color-surface-sunken); color: var(--aslh-color-text-muted); }
.input-group-text { background: var(--aslh-color-surface); color: var(--aslh-color-text-muted); }
.input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .form-control:not(:first-child), .input-group > .custom-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--aslh-color-brand); border-color: var(--aslh-color-brand); }
.custom-control-label::before { background-color: var(--aslh-color-surface-raised); border-color: var(--aslh-color-border-strong); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--aslh-color-brand); }
.is-invalid, .was-validated .form-control:invalid { border-color: var(--aslh-color-danger) !important; }
.invalid-feedback, .field-error-msg { color: var(--aslh-color-danger); }
.is-valid { border-color: var(--aslh-color-success) !important; }
.form-text { color: var(--aslh-color-text-muted); }

/* Markdown-Editor (Ticket eröffnen/beantworten): twenty-one färbt Werkzeugleiste, Textfeld und Vorschau mit !important weiß.
   Hier wie die übrigen Eingabefelder: im Dunkelmodus dunkel, im hellen Modus weiß (Nutzerwunsch 2026-10-08). */
.md-editor, div.md-editor.active { border: 1px solid var(--aslh-color-input-border); border-radius: 0; background: var(--aslh-color-surface-raised); }
div.md-editor.active { border-color: var(--aslh-color-brand); box-shadow: 0 0 0 3px color-mix(in srgb, var(--aslh-color-brand) 30%, transparent); }
.md-editor > .btn-toolbar, .md-editor > .md-header {
  background-color: var(--aslh-color-surface) !important; margin: 0; padding: 0.4rem;
  border-bottom: 1px solid var(--aslh-color-border);
}
.md-editor > .btn-toolbar .btn { padding: 0.3rem 0.55rem; font-size: var(--aslh-text-xs); box-shadow: none; }
.md-editor > textarea.markdown-editor, .md-editor > .md-preview, .md-editor > textarea {
  background-color: var(--aslh-color-surface-raised) !important; color: var(--aslh-color-text);
  border-top: 0 !important; border-bottom: 0 !important;
  font-family: var(--aslh-font-body); font-size: var(--aslh-text-base); line-height: 1.6;
}
.md-editor > textarea::placeholder { color: var(--aslh-color-text-muted); }
/* Fokus zeigt der Editor-Rahmen (div.md-editor.active); kein zweiter Rahmen am Textfeld selbst */
.md-editor > textarea:focus, .md-editor > textarea:focus-visible { outline: none; box-shadow: none !important; }
.md-editor .md-footer { background: var(--aslh-color-surface); border-top: 1px solid var(--aslh-color-border); }
.markdown-editor-status { color: var(--aslh-color-text-muted); }
.md-preview h1, .md-preview h2, .md-preview h3, .md-preview h4,
.markdown-content h1, .markdown-content h2, .markdown-content h3, .markdown-content h4 { color: var(--aslh-color-text); }
.md-editor.md-fullscreen-mode, .md-editor.md-fullscreen-mode .md-input, .md-editor.md-fullscreen-mode .md-preview { background: var(--aslh-color-bg) !important; color: var(--aslh-color-text) !important; }

/* ============ Karten & Sidebar ============ */
.card, .panel, .list-group-item, .modal-content, .popover, .dropdown-menu, .tiles .tile, .client-home-cards .card {
  background-color: var(--aslh-color-surface-raised);
  border-color: var(--aslh-color-border);
  color: var(--aslh-color-text);
}
/* Kein overflow: hidden mehr – die Eckmarken (aslh-surfaces.css) sitzen außerhalb der Karte */
.card { border-radius: 0; box-shadow: var(--aslh-shadow-sm); }
/* Kartenkopf und -fuß wie die Titelleiste eines App-Panels: transparent, feine Linie */
.card-header, .card-footer {
  background: transparent;
  border-color: var(--aslh-island-border);
  color: var(--aslh-color-text);
}
.card-header { font-family: var(--aslh-font-display); font-weight: 600; }
.card-title { color: var(--aslh-color-text); }
.card .card .card, .card .card { box-shadow: none; }

.sidebar .card, .card-sidebar { border-radius: 0; }
.sidebar .card-header, .card-sidebar .card-header { background: transparent; border-bottom: 1px solid var(--aslh-color-border); }
.sidebar .card-title, .card-sidebar .card-title { font-size: var(--aslh-text-base); margin: 0; }
.list-group-item { border-color: var(--aslh-color-border); }
.list-group-item-action { color: var(--aslh-color-text); }
.list-group-item-action:hover, .list-group-item-action:focus { background: var(--aslh-color-surface); color: var(--aslh-color-text); }
/* Aktiver Menüpunkt: orange Tönung wie der aktuelle Punkt im Dock, keine große orange Fläche (One Voice Rule) */
.list-group-item.active {
  background: color-mix(in srgb, var(--aslh-color-brand) 18%, transparent);
  border-color: var(--aslh-island-border);
  color: var(--aslh-color-text);
  font-weight: 600;
}
.list-group-item.active i { color: var(--aslh-color-brand-text); }
.list-group-item.active .badge { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }

/* Client-Home-Widgets („Ihre aktiven Produkte/Dienste“, „Neueste Neuigkeiten“ …): das twenty-one-Gerüst setzt mit stärkeren
   Selektoren einen weißen Kartenkopf, eine farbige 3px-Linie oben je Widget, bunte „Mehr ansehen“-Knöpfe und #ddd-Linien.
   Hier auf die Startseiten-Sprache gebracht (Panel-Material + Eckmarken kommen aus aslh-surfaces.css, Nutzerwunsch 2026-10-08). */
.client-home-cards .card[class*="card-accent-"] { border-top: 1px solid var(--aslh-island-border); }
.client-home-cards .card-header {
  display: block; padding: 0.95rem 1.15rem;
  background: transparent; border-bottom: 1px solid var(--aslh-island-border);
  font-family: var(--aslh-font-display); font-weight: 600; color: var(--aslh-color-text);
}
.client-home-cards .card-title { font-size: 1rem; line-height: 1.6; color: var(--aslh-color-text); }
.client-home-cards .card-title > i { color: var(--aslh-color-brand-text); }
.client-home-cards .card-header .btn,
.client-home-cards .card-header .btn[class*="bg-color-"] {
  padding: 0.25rem 0.65rem; font-size: var(--aslh-text-xs);
  background: transparent !important; color: var(--aslh-color-text);
  border: 1px solid var(--aslh-color-input-border); box-shadow: none;
}
.client-home-cards .card-header .btn:hover, .client-home-cards .card-header .btn:focus-visible {
  background: var(--aslh-color-mark) !important; color: var(--aslh-color-brand); border-color: var(--aslh-color-brand);
}
.client-home-cards .card-body { color: var(--aslh-color-text-muted); }
.client-home-cards .card-body p { margin: 0; padding: 0.9rem 1.15rem; }
.client-home-cards .list-group { border-top: 1px solid var(--aslh-island-border) !important; border-bottom: 0 !important; }
.client-home-cards .list-group .list-group-item {
  padding: 0.6rem 1.15rem; background: transparent; color: var(--aslh-color-text);
  border: 0; border-bottom: 1px solid var(--aslh-island-border);
}
.client-home-cards .list-group .list-group-item:hover { background: color-mix(in srgb, var(--aslh-color-text) 6%, transparent); }
.client-home-cards .list-group .list-group-item i { color: var(--aslh-color-brand-text); }
.client-home-cards small { color: var(--aslh-color-text-muted); }
.client-home-cards .card-footer { padding: 0; min-height: 0; border: 0; background: transparent; }
.client-home-cards .card-footer:not(:empty) { padding: 0.75rem 1.15rem; border-top: 1px solid var(--aslh-island-border); }

/* Client-Home-Kacheln: Panel-Material (aslh-surfaces.css), Logo-Icon statt grauem Symbol, keine bunten Linien */
.tiles { background: transparent; border: 0; }
.tiles .tile { margin: 0.5rem; padding: 1.25rem 1.35rem 1.35rem; }
/* Hover: das twenty-one-Gerüst färbt die Kachel hellgrau und bläst das Icon auf 70px grau auf – hier abgeschaltet.
   Die Kachel bleibt Panel (Eckmarken + Lichtlauf aus aslh-surfaces.css), das Logo-Icon hebt sich nur leicht an. */
.tiles .tile:hover, .tiles .tile:focus-visible { transform: none; filter: none; background-color: var(--aslh-island-bg); text-decoration: none; }
/* Icon-Selektor: jedes Icon direkt in der Kachel (echtes WHMCS-Markup <i class="fas fa-…"> ohne Klasse) und .icon */
.tiles .tile:hover > i, .tiles .tile:hover .icon, .tiles .tile:focus-visible > i, .tiles .tile:focus-visible .icon { font-size: 1.1rem; color: var(--aslh-color-brand); }
.tiles .tile > i, .tiles .tile .icon { transition: transform var(--aslh-dur-spring) var(--aslh-ease-spring); }
.tiles .tile:hover > i, .tiles .tile:hover .icon, .tiles .tile:focus-visible > i, .tiles .tile:focus-visible .icon { transform: translateY(-2px) scale(1.08); }
@media (prefers-reduced-motion: reduce) { .tiles .tile > i, .tiles .tile .icon { transition: none; } .tiles .tile:hover > i, .tiles .tile:hover .icon { transform: none; } }
.tiles .tile .stat { font-family: var(--aslh-font-display); font-weight: 700; font-size: 2.2rem; line-height: 1; color: var(--aslh-color-text); font-variant-numeric: tabular-nums; }
.tiles .tile .title { margin-top: 0.35rem; font-family: var(--aslh-font-display); font-weight: 600; font-size: var(--aslh-text-sm); color: var(--aslh-color-text-muted); }
.tiles .tile .highlight { display: none; }
.tiles .tile > i, .tiles .tile .icon {
  position: absolute; top: 1.15rem; right: 1.15rem;
  display: grid; place-items: center; width: 2.6rem; height: 2.6rem;
  background: var(--aslh-color-mark); box-shadow: inset 0 0 0 2px var(--aslh-color-brand);
  color: var(--aslh-color-brand); font-size: 1.1rem; opacity: 1;
}

/* ============ DataTables-Listen (Dienste, Domains, Rechnungen, Tickets …) ============
   twenty-one färbt Kopf, Zellen und Suchfeld weiß (#fff), setzt eine 4px-Linie unter den Kopf, runde Ecken und graue Hover-Farben.
   Hier auf die Startseiten-Sprache gebracht: Liste liegt im Panel (.table-container, aslh-surfaces.css), innen Luft, feine Linien,
   Suchfeld und Längenauswahl wie Formularfelder, „Zurück/Weiter“ als ruhige Knöpfe (Nutzerwunsch 2026-10-08). */
.table-container { padding: 1rem 1.25rem 1.1rem; }
/* zu breite Tabellen scrollen im Panel seitlich statt abgeschnitten zu werden oder die Seite zu verbreitern */
.dataTables_wrapper .listtable { overflow-x: auto; }
.dataTables_wrapper .dataTables_info { padding: 0.55rem 0 0; color: var(--aslh-color-text-muted); font-size: var(--aslh-text-sm); }
.dataTables_wrapper .dataTables_filter label { margin: 0; }
.dataTables_wrapper .dataTables_filter label .form-control,
.dataTables_wrapper .dataTables_filter input {
  background-color: var(--aslh-color-surface-raised) !important; color: var(--aslh-color-text);
  border: 1px solid var(--aslh-color-input-border); border-radius: 0; min-height: 2.5rem;
  /* eigene Lupe statt search.png (das PNG hat einen weißen Grund und wird im Dunkelmodus zum hellen Kästchen); Grau passt zu hell und dunkel */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239AA1AD' stroke-width='2' stroke-linecap='square'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5 21 21'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-size: 16px 16px !important; background-position: 14px 50% !important;
}
.dataTables_wrapper table.table-list {
  margin: 1rem 0 !important; background: transparent; border: 1px solid var(--aslh-island-border); border-radius: 0;
}
.dataTables_wrapper table.table-list thead th,
table.table-list thead th {
  background: transparent !important; color: var(--aslh-color-text-muted);
  border-bottom: 1px solid var(--aslh-island-border); border-radius: 0 !important;
}
.dataTables_wrapper table.table-list thead th.sorting_asc,
.dataTables_wrapper table.table-list thead th.sorting_desc { background: color-mix(in srgb, var(--aslh-color-brand) 8%, transparent) !important; color: var(--aslh-color-text); }
.table-list > tbody > tr > td, table.table-list tbody td {
  background-color: transparent; color: var(--aslh-color-text); border-color: var(--aslh-island-border); border-radius: 0 !important;
}
.table-list > tbody > tr:hover > td { background-color: color-mix(in srgb, var(--aslh-color-text) 5%, transparent); }
.table-list td.dataTables_empty { padding: 2rem 1rem !important; color: var(--aslh-color-text-muted); text-align: center; cursor: default; }
.table-list > tbody > tr:hover > td.dataTables_empty { background-color: transparent; }
.dataTables_wrapper .dataTables_length { padding-top: 0.35rem; color: var(--aslh-color-text-muted); font-size: var(--aslh-text-sm); }
.dataTables_wrapper .dataTables_length select {
  margin: 0 0.4rem; background-color: var(--aslh-color-surface-raised); color: var(--aslh-color-text);
  border: 1px solid var(--aslh-color-input-border); border-radius: 0; min-height: 2.25rem;
}
.dataTables_wrapper .dataTables_paginate { padding-top: 0.2rem; }
.dataTables_wrapper .pagination .page-link { background: transparent; border-color: var(--aslh-color-input-border); color: var(--aslh-color-text); }
.dataTables_wrapper .pagination .page-item.disabled .page-link { background: transparent; color: var(--aslh-color-text-muted); opacity: 0.6; }
.dataTables_wrapper .pagination .page-item:not(.disabled):not(.active) .page-link:hover { background: var(--aslh-color-mark); color: var(--aslh-color-brand); border-color: var(--aslh-color-brand); }

/* ============ Weitere WHMCS-Bausteine: helle Festfarben des twenty-one-Gerüsts ersetzt (Sammelkorrektur 2026-10-08) ============
   Gefunden per Durchsicht von css/theme.css (feste #fff/#f5f5f5/#efefef-Flächen, #ddd-Linien, #333-Schrift) und Abgleich mit den
   Client-Area-Vorlagen. Alle Werte über Tokens, damit hell und dunkel stimmen. */
.announcements .announcement article { background-color: var(--aslh-color-surface); border-left: 1px solid var(--aslh-island-border); }
div.credit-card { background-color: var(--aslh-color-surface-raised); border: 1px solid var(--aslh-color-input-border); border-radius: 0; color: var(--aslh-color-text); }
.domain-pricing .tld-row.highlighted { background: color-mix(in srgb, var(--aslh-color-brand) 10%, transparent); }
.featured-tld { background-color: var(--aslh-island-bg); border: 1px solid var(--aslh-island-border); border-radius: 0; box-shadow: var(--aslh-shadow-lg); color: var(--aslh-color-text); }
.featured-tld .price { background-color: var(--aslh-color-surface); color: var(--aslh-color-text); }
.home-domain-search .input-group-wrapper { background-color: var(--aslh-color-surface-raised); border-color: var(--aslh-color-input-border); border-radius: 0; }
.input-group .btn-reveal-pw:hover, .input-group .btn-reveal-pw:active { background-color: var(--aslh-color-surface); color: var(--aslh-color-text); border-color: var(--aslh-color-input-border); }
.invite-box { background-color: var(--aslh-color-surface); border: 1px solid var(--aslh-island-border); color: var(--aslh-color-text); }
.invoice-summary-table td.total-row, tr.masspay-total td { background-color: var(--aslh-color-surface); color: var(--aslh-color-text); }
.kb-article-item:hover, .kb-category a:hover { background-color: color-mix(in srgb, var(--aslh-color-text) 6%, transparent); }
.list-group-item-danger { background-color: var(--aslh-color-danger-bg); color: var(--aslh-color-danger); }
div.product-details div.product-icon { background-color: var(--aslh-color-mark); color: var(--aslh-color-brand); box-shadow: inset 0 0 0 2px var(--aslh-color-brand); border-radius: 0; }
div.product-details-tab-container { background-color: var(--aslh-color-surface-raised); border-color: var(--aslh-island-border); color: var(--aslh-color-text); }
.promo-banner { background-color: var(--aslh-color-surface); color: var(--aslh-color-text); }
.promo-banner a { color: var(--aslh-color-brand-text); }
.responsive-tabs-sm, .responsive-tabs-sm-connector .channel { background-color: var(--aslh-color-surface); border-color: var(--aslh-island-border); }
.responsive-tabs-sm-connector .bottom-border, .responsive-tabs-sm-connector.store .channel { border-color: var(--aslh-island-border); }
.select-account, .select-account a { border-color: var(--aslh-island-border); color: var(--aslh-color-text); }
.select-account a:hover { background-color: color-mix(in srgb, var(--aslh-color-text) 6%, transparent); }
.store-order-container .store-domain-tabs li a { background-color: var(--aslh-color-surface); border-bottom-color: var(--aslh-island-border); color: var(--aslh-color-text); }
.store-order-container .store-domain-tab-content { border-color: var(--aslh-island-border); }
#registration .sub-heading { border-top-color: var(--aslh-island-border); }
#registration .sub-heading span { background-color: var(--aslh-color-bg); color: var(--aslh-color-text-muted); }
.table-bordered, .table-bordered th, .table-bordered td, table.table-solid-bottom-border-light-gray { border-color: var(--aslh-island-border); }
.ticketfeedbackstaffcont { background-color: var(--aslh-color-surface); border-radius: 0; color: var(--aslh-color-text); }
.upgrade .product-to-be-upgraded, .upgrade .products .product { background-color: var(--aslh-color-surface); color: var(--aslh-color-text); }
.upgrade .products .product ul, .upgrade .products .product ul li, .upgrade .products .product .footer { border-color: var(--aslh-island-border); }
.upgrade .products .product ul li span { color: var(--aslh-color-text); }
.verification-banner { background-color: var(--aslh-color-surface); border-bottom-color: var(--aslh-island-border); color: var(--aslh-color-text); }
.verification-banner .fas, .verification-banner .fal, .verification-banner .far { color: var(--aslh-color-brand-text); }
.view-ticket .attachments, .view-ticket .attachment-list li span { border-color: var(--aslh-island-border); }
.view-ticket .attachment-list li figure { background-color: var(--aslh-color-surface); }
.carousel-indicators li { background-color: var(--aslh-color-text-muted); }
.carousel-indicators .active { background-color: var(--aslh-color-brand); }
.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label { color: var(--aslh-color-text-muted); }
.sidebar .list-group-item > i.far.fa-circle { color: var(--aslh-color-text-muted); }
.popover-user-notifications ul li i.fas.fa-check-circle, .popover-user-notifications ul li i.far.fa-check-circle { color: var(--aslh-color-success); }
.markdown-content blockquote, .md-preview blockquote { border-color: var(--aslh-color-brand); color: var(--aslh-color-text-muted); }
.markdown-content table, .md-preview table { background-color: transparent; border-color: var(--aslh-island-border); }

/* ============ Tabellen ============ */
.table { color: var(--aslh-color-text); }
.table th, .table td, .table thead th { border-color: var(--aslh-color-border); }
.table thead th, .table-list thead th {
  font-family: var(--aslh-font-display);
  font-size: var(--aslh-text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--aslh-color-text-muted);
  background: var(--aslh-color-surface);
}
.table-striped tbody tr:nth-of-type(odd) { background-color: var(--aslh-color-surface); }
.table-hover tbody tr:hover, .table-list > tbody > tr:hover > td { background-color: color-mix(in srgb, var(--aslh-color-brand) 8%, var(--aslh-color-surface-raised)); color: var(--aslh-color-text); }
.table-list, .table-container { background: var(--aslh-color-surface-raised); border-color: var(--aslh-color-border); border-radius: 0; }
.table-list > tbody > tr > td { background: var(--aslh-color-surface-raised); border-color: var(--aslh-color-border); }
.dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter { color: var(--aslh-color-text-muted); }
.dataTables_wrapper .dataTables_filter input { background: var(--aslh-color-surface-raised); border: 1px solid var(--aslh-color-border); color: var(--aslh-color-text); border-radius: 0; }
.dataTables_wrapper .dataTables_paginate .paginate_button { color: var(--aslh-color-text) !important; }

/* ============ Status: Badges, Labels, Alerts ============ */
.badge, .label {
  font-family: var(--aslh-font-display);
  font-weight: 600;
  letter-spacing: 0.02em;
  border-radius: 0;
  padding: 0.3em 0.6em;
}
.badge-primary { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }
.badge-info { background: var(--aslh-color-info-bg); color: var(--aslh-color-info); }
.badge-secondary, .badge-default, .badge-light { background: var(--aslh-color-surface-sunken); color: var(--aslh-color-text); }
.badge-success, .status-active, .status-paid, .status-open, .status-completed { background: var(--aslh-color-success-bg); color: var(--aslh-color-success); }
.badge-danger, .status-unpaid, .status-cancelled, .status-terminated, .status-overdue, .status-fraud, .status-closed { background: var(--aslh-color-danger-bg); color: var(--aslh-color-danger); }
.badge-warning, .status-pending, .status-suspended, .status-customer-reply, .status-onhold { background: var(--aslh-color-warning-bg); color: var(--aslh-color-warning); }
.status-answered, .status-inprogress { background: var(--aslh-color-info-bg); color: var(--aslh-color-info); }

.alert { border-radius: 0; border: 1px solid transparent; }
.alert-success { background: var(--aslh-color-success-bg); color: var(--aslh-color-success); border-color: color-mix(in srgb, var(--aslh-color-success) 30%, transparent); }
.alert-danger, .alert-error { background: var(--aslh-color-danger-bg); color: var(--aslh-color-danger); border-color: color-mix(in srgb, var(--aslh-color-danger) 30%, transparent); }
.alert-warning { background: var(--aslh-color-warning-bg); color: var(--aslh-color-warning); border-color: color-mix(in srgb, var(--aslh-color-warning) 30%, transparent); }
.alert-info { background: var(--aslh-color-info-bg); color: var(--aslh-color-info); border-color: color-mix(in srgb, var(--aslh-color-info) 30%, transparent); }
.alert a, .alert .alert-link { color: inherit; text-decoration: underline; font-weight: 600; }
/* Ruhigere Hinweise (Nutzerwunsch 2026-10-08, Startseiten-Sprache): Panel-Grund mit leichter Statustönung,
   Text in Tinte, davor ein kleines Status-Quadrat wie der Logo-Punkt; die Statusfarbe bleibt im Quadrat und an der Kante. */
.alert {
  --aslh-alert: var(--aslh-color-info);
  position: relative; padding-left: 2.6rem;
  background: color-mix(in srgb, var(--aslh-alert) 10%, var(--aslh-island-bg));
  border: 1px solid color-mix(in srgb, var(--aslh-alert) 35%, transparent);
  color: var(--aslh-color-text);
}
.alert::before { content: ""; position: absolute; left: 1.1rem; top: 1.15em; width: 0.6rem; height: 0.6rem; background: var(--aslh-alert); }
.alert-success { --aslh-alert: var(--aslh-color-success); }
.alert-danger, .alert-error { --aslh-alert: var(--aslh-color-danger); }
.alert-warning { --aslh-alert: var(--aslh-color-brand); }
.alert-info { --aslh-alert: var(--aslh-color-info); }
.alert-success, .alert-danger, .alert-error, .alert-warning, .alert-info { color: var(--aslh-color-text); }
.alert a, .alert .alert-link { color: var(--aslh-color-text); text-decoration-color: var(--aslh-alert); }

/* ============ Navigationselemente ============ */
.nav-tabs { border-bottom-color: var(--aslh-color-border); }
.nav-tabs .nav-link { color: var(--aslh-color-text-muted); border: 0; border-bottom: 2px solid transparent; font-weight: 600; }
.nav-tabs .nav-link:hover { color: var(--aslh-color-text); border-bottom-color: var(--aslh-color-border-strong); }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
  background: transparent; color: var(--aslh-color-text); border-bottom-color: var(--aslh-color-brand);
}
.nav-pills .nav-link { color: var(--aslh-color-text-muted); border-radius: 0; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }

.dropdown-menu { border-radius: 0; box-shadow: var(--aslh-shadow-lg); padding: var(--aslh-space-2); }
.dropdown-item { color: var(--aslh-color-text); border-radius: 0; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--aslh-color-surface); color: var(--aslh-color-text); }
.dropdown-item.active, .dropdown-item:active { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }
.dropdown-divider { border-top-color: var(--aslh-color-border); }

.pagination .page-link { background: var(--aslh-color-surface-raised); border-color: var(--aslh-color-border); color: var(--aslh-color-text); }
.pagination .page-item.active .page-link { background: var(--aslh-color-brand); border-color: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }
.pagination .page-item.disabled .page-link { background: var(--aslh-color-surface); color: var(--aslh-color-text-muted); }

.modal-content { border-radius: 0; box-shadow: var(--aslh-shadow-lg); }
.modal-header, .modal-footer { border-color: var(--aslh-color-border); }
.modal-backdrop.show { opacity: 0.6; }
.close { color: var(--aslh-color-text); text-shadow: none; opacity: 0.7; }
.close:hover { color: var(--aslh-color-text); opacity: 1; }

.popover { box-shadow: var(--aslh-shadow-lg); border-radius: 0; }
.popover-header { background: var(--aslh-color-surface); border-color: var(--aslh-color-border); color: var(--aslh-color-text); }
.popover-body { color: var(--aslh-color-text); }
.tooltip-inner { background: var(--aslh-color-text); color: var(--aslh-color-bg); font-size: var(--aslh-text-xs); border-radius: 0; }
.progress { background: var(--aslh-color-surface-sunken); border-radius: 0; }
.progress-bar { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }

/* Ticket-Ansicht */
.ticket-reply { background: var(--aslh-color-surface-raised); border-color: var(--aslh-color-border); border-radius: 0; }
.ticket-reply.staff { background: var(--aslh-color-surface); }
.ticket-reply .posted-by { color: var(--aslh-color-text-muted); }

/* Ladeoverlay */
#fullpage-overlay { background: color-mix(in srgb, var(--aslh-color-bg) 85%, transparent); }
#fullpage-overlay .msg { color: var(--aslh-color-text); }

/* ============ Rechtstexte (agb/datenschutz/impressum) ============ */
.aslh-legal { padding-block: 0; } /* Abstand oben/unten liefern .aslh-top und #main-body (aslh-nav.css) */
/* Rechtstext als App-Panel (Material, Eckmarken, Lichtlauf: aslh-surfaces.css); Überschrift mit orangem Logo-Quadrat davor */
.aslh-legal__article { max-width: 52rem; margin-inline: auto; padding: clamp(1.75rem, 1rem + 2.5vw, 3.25rem); } /* mittig (Nutzerwunsch 2026-10-08) */
.aslh-legal__body { max-width: var(--aslh-measure); }
.aslh-legal__header { margin-bottom: var(--aslh-space-6); padding-bottom: var(--aslh-space-5); border-bottom: 1px solid var(--aslh-island-border); }
.aslh-legal__title { font-size: var(--aslh-text-3xl); margin-bottom: var(--aslh-space-3); }
.aslh-legal__title::after { content: ""; display: inline-block; width: 0.2em; height: 0.2em; margin-left: 0.08em; background: var(--aslh-color-brand); }
.aslh-legal__lead { color: var(--aslh-color-text-muted); font-size: var(--aslh-text-lg); }
.aslh-legal__body { font-size: var(--aslh-text-base); }

/* Impressum zweispaltig (Nutzerwunsch 2026-10-08): Angaben als Raster aus Blöcken, getrennt durch feine Linien; mobil einspaltig */
.aslh-imprint { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; } /* obere Linie liefert der Kopf (.aslh-legal__header) */
.aslh-imprint__item:first-child, .aslh-imprint__item:nth-child(2) { padding-top: 0; }
@media (max-width: 767.98px) { .aslh-imprint__item:nth-child(2) { padding-top: 1.25rem; } }
@media (min-width: 768px) { .aslh-imprint { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 1rem + 3vw, 3.5rem); } }
.aslh-imprint__item { padding: 1.25rem 0; border-bottom: 1px solid var(--aslh-island-border); }
.aslh-imprint dt { margin-bottom: 0.45rem; font-family: var(--aslh-font-display); font-size: var(--aslh-text-xs); font-weight: 600; letter-spacing: 0.06em; color: var(--aslh-color-text-muted); }
.aslh-imprint dd { margin: 0; line-height: 1.6; color: var(--aslh-color-text); word-break: break-word; }
.aslh-imprint__fairness { display: flex; align-items: center; gap: 1.25rem; margin-top: var(--aslh-space-6); color: var(--aslh-color-text-muted); }
.aslh-imprint__fairness img { height: 80px; width: auto; flex-shrink: 0; }
.aslh-imprint__fairness p { margin: 0 0 0.25rem; }
.aslh-imprint__fairness a { word-break: break-word; }
.aslh-legal__body p { margin-bottom: var(--aslh-space-4); }
.aslh-legal__body strong { color: var(--aslh-color-text); }
.aslh-legal__body h2, .aslh-legal__body h3, .aslh-legal__body h4 { margin-top: var(--aslh-space-7); margin-bottom: var(--aslh-space-3); }
.aslh-legal__body a { word-break: break-word; }
.aslh-legal__body [style*="text-decoration: underline"] { text-decoration: none !important; font-family: var(--aslh-font-display); font-weight: 600; display: block; margin-top: var(--aslh-space-6); }

/* ============ Footer ============ */
#footer.aslh-footer {
  background: var(--aslh-color-surface-sunken);
  color: var(--aslh-color-text-muted);
  border-top: 1px solid var(--aslh-color-border);
  padding: var(--aslh-space-8) 0 var(--aslh-space-6);
  font-size: var(--aslh-text-sm);
}
.aslh-footer__grid { display: grid; gap: var(--aslh-space-6); grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
.aslh-footer__brand { grid-column: span 2; max-width: 26rem; }
@media (max-width: 575.98px) { .aslh-footer__brand { grid-column: auto; } }
.aslh-footer__logo { height: 34px; width: auto; margin-bottom: var(--aslh-space-4); }
.aslh-footer__heading { font-family: var(--aslh-font-display); font-size: var(--aslh-text-sm); font-weight: 600; color: var(--aslh-color-text); margin-bottom: var(--aslh-space-3); }
.aslh-footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--aslh-space-2); }
#footer.aslh-footer a, #footer.aslh-footer .copyright { color: var(--aslh-color-text-muted); text-decoration: none; }
#footer.aslh-footer a:hover, #footer.aslh-footer a:focus-visible { color: var(--aslh-color-text); text-decoration: underline; text-decoration-color: var(--aslh-color-brand); }
.aslh-footer__facts { display: flex; flex-wrap: wrap; gap: var(--aslh-space-2) var(--aslh-space-5); margin-top: var(--aslh-space-4); color: var(--aslh-color-text); }
.aslh-footer__fact { display: inline-flex; align-items: center; gap: var(--aslh-space-2); }
.aslh-footer__fact svg { width: 16px; height: 16px; color: var(--aslh-color-brand-text); }
.aslh-footer__bottom {
  display: flex; flex-wrap: wrap; gap: var(--aslh-space-4); justify-content: space-between; align-items: center;
  border-top: 1px solid var(--aslh-color-border); margin-top: var(--aslh-space-7); padding-top: var(--aslh-space-5);
}
.aslh-footer__social { display: flex; gap: var(--aslh-space-2); list-style: none; margin: 0; padding: 0; }
.aslh-footer__social .list-inline-item { margin: 0; }
.aslh-footer__social a, .aslh-footer__locale {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--aslh-space-2);
  min-width: 2.5rem; height: 2.5rem; padding: 0 var(--aslh-space-3);
  border-radius: 0; border: 1px solid var(--aslh-color-border);
  color: var(--aslh-color-text); background: var(--aslh-color-surface); font-size: var(--aslh-text-sm);
}
.aslh-footer__social a:hover, .aslh-footer__locale:hover { border-color: var(--aslh-color-brand); text-decoration: none; }

/* Sprachwahl-Modal */
.modal-localisation .modal-content { background: var(--aslh-color-surface-raised); }
.modal-localisation .item-selector .item { color: var(--aslh-color-text); border-radius: 0; }
.modal-localisation .item-selector .item.active, .modal-localisation .item-selector .item:hover { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); }
.modal-localisation .close.text-light { color: var(--aslh-color-text) !important; }

/* „Zurück zum Admin“-Knopf */
/* „Zurück zum Admin-Bereich“: Stil in aslh-nav.css (.btn-return-to-admin.aslh-admin-return) */

/* ============ Druck: immer hell ============ */
@media print {
  :root, :root[data-theme] {
    --aslh-color-bg: #FFFFFF; --aslh-color-surface: #FFFFFF; --aslh-color-surface-raised: #FFFFFF;
    --aslh-color-text: #000000; --aslh-color-text-muted: #333333; --aslh-color-border: #BBBBBB;
    --aslh-color-brand-text: #7E5700; color-scheme: light;
  }
  .aslh-island, .aslh-footer, .aslh-skip { display: none !important; }
  #main-body { padding-top: 0; }
}

.aslh-footer__heading--spaced { margin-top: var(--aslh-space-5); }
#footer.aslh-footer .copyright { margin: 0; text-align: left; font-size: var(--aslh-text-sm); }
#footer.aslh-footer .aslh-footer__social .btn { background: var(--aslh-color-surface); color: var(--aslh-color-text); line-height: 1; padding: 0; }

/* ---- Korrekturen nach Prototyp-Test (spezifischere twenty-one-Regeln, Kontrast) ---- */
.sidebar .list-group-item.active, .sidebar .list-group-item.active:focus, .sidebar .list-group-item.active:hover {
  background: color-mix(in srgb, var(--aslh-color-brand) 18%, transparent); border-color: var(--aslh-island-border); color: var(--aslh-color-text);
}
/* Seitenleisten-Einträge liegen auf dem Panel-Material: transparent statt eigener weißer Fläche */
.sidebar .list-group-item, .card-sidebar .list-group-item { background-color: transparent; border-color: var(--aslh-island-border); }
.sidebar .list-group-item-action:hover { background: color-mix(in srgb, var(--aslh-color-text) 6%, transparent); }
table.table-list thead th { background: var(--aslh-color-surface); color: var(--aslh-color-text-muted); border-color: var(--aslh-color-border); }
.form-control, .custom-select, select.form-control, .custom-file-label { border-color: var(--aslh-color-input-border); }
.input-group-text { border-color: var(--aslh-color-input-border); }
.custom-control-label::before { border-color: var(--aslh-color-input-border); }
.btn-default, .btn-secondary, .btn-outline-secondary, .btn-outline-default { border-color: var(--aslh-color-input-border); }
.btn-danger, .btn-danger:hover, .btn-danger:focus, .btn-outline-danger:hover { color: var(--aslh-color-on-danger); }
.btn-primary.disabled, .btn-primary:disabled, .btn-success.disabled, .btn-success:disabled {
  background: var(--aslh-color-brand); border-color: var(--aslh-color-brand); color: var(--aslh-color-on-brand); box-shadow: none;
}
.list-group .badge, .sidebar .list-group-item .badge { background: var(--aslh-color-surface-sunken); color: var(--aslh-color-text); }
.list-group .badge-danger, .sidebar .list-group-item .badge-danger { background: var(--aslh-color-danger-bg); color: var(--aslh-color-danger); }
.modal-content, .dropdown-menu, .popover { border: 0; }
.sidebar h2.card-title, .card-sidebar h2.card-title { font-size: var(--aslh-text-base); }
.badge, .label, .label.status { font-size: 0.75rem; }


/* ============ Restliche Detailseiten (Audit Testkunde, 2026-10-08) ============ */
/* Produktdetails: Graphit-Quadrat bleibt in beiden Modi dunkel, also auch die Schrift darauf hell */
div.product-details div.product-icon h3, div.product-details div.product-icon h4 { color: #EEF0F3; }
div.product-details div.product-icon h4 { opacity: 0.72; }
/* Labels (z. B. Benutzerverwaltung "Eigentümer") */
.label-info { background-color: var(--aslh-color-info-bg); color: var(--aslh-color-info); }
/* bootstrap-switch (Kontodetails, E-Mail-Einstellungen) */
.bootstrap-switch { border-color: var(--aslh-color-input-border); border-radius: 0; background-color: var(--aslh-color-surface); }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success { background-color: var(--aslh-color-success-bg); color: var(--aslh-color-success); border-color: transparent; }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary:hover,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary:disabled { background-color: var(--aslh-color-surface-sunken); color: var(--aslh-color-text-muted); border-color: transparent; }
.bootstrap-switch .bootstrap-switch-label { background-color: var(--aslh-color-surface-raised); color: var(--aslh-color-text); }

/* ============ Seitentitel (ersetzt die Brotkrumen, header.tpl .aslh-pagehead) ============ */
.aslh-pagehead { margin-bottom: clamp(1.75rem, 1.25rem + 1.5vw, 2.75rem); }
.aslh-pagehead__title { font-family: var(--aslh-font-display); font-size: var(--aslh-text-2xl); font-weight: 700; letter-spacing: -0.01em; margin: 0; }
.aslh-pagehead__title::after { content: ""; display: inline-block; width: 0.2em; height: 0.2em; margin-left: 0.1em; background: var(--aslh-color-brand); }
.aslh-pagehead__tagline { margin: var(--aslh-space-2) 0 0; color: var(--aslh-color-text-muted); max-width: 60ch; }

/* ============ Ticket-Verlauf (viewticket.tpl), ersetzt twenty-one-Grau #f6f6f6 und Bootstrap-Badges (2026-10-08) ============ */
/* Eine Karte = ein Gespräch; die einzelnen Nachrichten darin ohne eigenen Schatten/Blur (kein Panel im Panel) */
.view-ticket .card-body { padding: 0 var(--aslh-space-4) var(--aslh-space-4); border-bottom: 0; }
.view-ticket .aslh-ticket-bar { display: flex; justify-content: flex-end; padding: var(--aslh-space-4) !important; }
.view-ticket .ticket-reply { box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--aslh-color-surface); border: 1px solid var(--aslh-color-border); }
.view-ticket .ticket-reply.staff { background: color-mix(in srgb, var(--aslh-color-brand) 6%, var(--aslh-color-surface)); box-shadow: inset 3px 0 0 var(--aslh-color-brand); }
.view-ticket .posted-by {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--aslh-space-2) var(--aslh-space-3);
  background: transparent; color: var(--aslh-color-text-muted); border-bottom: 1px solid var(--aslh-color-border);
  padding: var(--aslh-space-3) var(--aslh-space-4);
}
.view-ticket .posted-by .posted-by-name { color: var(--aslh-color-text); }
.view-ticket .posted-by .requestor-badge { float: none !important; margin-left: auto; }
.view-ticket .message { color: var(--aslh-color-text); padding: var(--aslh-space-4) !important; }
.view-ticket .message hr { border-color: var(--aslh-color-border); }
/* Absender-Badges: getönt statt bunter Bootstrap-Flächen mit weißer Schrift */
.requestor-badge { color: var(--aslh-color-text-muted); background: var(--aslh-color-surface-sunken); }
.requestor-type-operator { background: color-mix(in srgb, var(--aslh-color-brand) 18%, transparent); color: var(--aslh-color-brand-text); }
.requestor-type-owner { background: var(--aslh-color-success-bg); color: var(--aslh-color-success); }
.requestor-type-registereduser { background: var(--aslh-color-warning-bg); color: var(--aslh-color-warning); }
.requestor-type-authorizeduser, .requestor-type-subaccount, .requestor-type-guest { background: var(--aslh-color-surface-sunken); color: var(--aslh-color-text-muted); }
/* Bewertungssterne */
.ticket-reply .rating span.star::before, .ticket-reply .rating-done span.star::before { color: var(--aslh-color-text-muted); }
.ticket-reply .rating span.star:hover::before, .ticket-reply .rating span.star:hover ~ span.star::before,
.ticket-reply .rating-done span.star.active::before { color: var(--aslh-color-brand); }

/* ============ Downloads (includes/aslh-download-item.tpl) ============ */
.aslh-dl { display: flex; align-items: center; gap: var(--aslh-space-4); }
.aslh-dl__icon { flex: none; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; background: var(--aslh-color-mark); color: var(--aslh-color-brand); box-shadow: inset 0 0 0 1.5px var(--aslh-color-brand); }
.aslh-dl__body { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.aslh-dl__title { font-family: var(--aslh-font-display); font-weight: 600; color: var(--aslh-color-text); }
.aslh-dl__desc { font-size: 0.875rem; color: var(--aslh-color-text-muted); }
.aslh-dl__meta { font-size: 0.8rem; color: var(--aslh-color-text-muted); }
.aslh-dl__lock { margin-left: auto; flex: none; }
/* Kategorien mit Bildvorschau (Wallpaper): Galerie statt Liste */
.list-group:has(> .aslh-dl--thumb) {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 11rem), 1fr)); gap: var(--aslh-space-4); padding: var(--aslh-space-4);
}
.list-group:has(> .aslh-dl--thumb) > .list-group-item { border: 1px solid var(--aslh-color-border) !important; margin: 0; }
.aslh-dl--thumb { flex-direction: column; align-items: stretch; gap: var(--aslh-space-3); padding: var(--aslh-space-3); transition: border-color var(--aslh-dur-base) var(--aslh-ease-out), transform var(--aslh-dur-base) var(--aslh-ease-out); }
.aslh-dl--thumb:hover, .aslh-dl--thumb:focus-visible { border-color: var(--aslh-color-brand) !important; transform: translateY(-2px); }
.aslh-dl__thumb { display: block; aspect-ratio: 9 / 16; overflow: hidden; background: var(--aslh-color-surface-sunken); }
.aslh-dl__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.aslh-dl--thumb .aslh-dl__lock { margin: 0; align-self: flex-start; }
@media (prefers-reduced-motion: reduce) { .aslh-dl--thumb:hover { transform: none; } }

/* ============ AV-Vertrag (Addon av_contract, clientarea_bs4.tpl; Modul bleibt unverändert, nur Theme-CSS) ============ */
/* Seitenklasse enthält den Modulpfad, daher Attribut-Selektor auf data-aslh-page */
body[data-aslh-page*="av_contract"] .card-header h4 { font-family: var(--aslh-font-display); font-size: var(--aslh-text-lg, 1.125rem); font-weight: 600; margin: 0; color: var(--aslh-color-text); }
/* Herunterladen + Löschen nebeneinander, rechtsbündig */
body[data-aslh-page*="av_contract"] form#form { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--aslh-space-2); }
body[data-aslh-page*="av_contract"] form#form .btn { margin: 0; }
body[data-aslh-page*="av_contract"] form#form .btn-danger { background: transparent; border-color: var(--aslh-color-danger); color: var(--aslh-color-danger); }
body[data-aslh-page*="av_contract"] form#form .btn-danger:hover, body[data-aslh-page*="av_contract"] form#form .btn-danger:focus { background: var(--aslh-color-danger); color: #FFFFFF; }
@media (max-width: 767.98px) { body[data-aslh-page*="av_contract"] form#form { justify-content: flex-start; margin-top: var(--aslh-space-3); } }
/* „Art der Daten hinzufügen“ / „Betroffene hinzufügen“: sichtbarer Umrissknopf in der Karte statt fast unsichtbarem Link */
body[data-aslh-page*="av_contract"] .btn-green.add-input {
  display: inline-flex; align-items: center; gap: 0.4rem; align-self: flex-start;
  margin: 0 var(--aslh-space-4) var(--aslh-space-4); padding: 0.4rem 0.85rem;
  background: transparent; border: 1px solid var(--aslh-color-brand); border-radius: 0;
  color: var(--aslh-color-brand-text); font-family: var(--aslh-font-display); font-size: 0.85rem; font-weight: 600; cursor: pointer;
}
body[data-aslh-page*="av_contract"] .btn-green.add-input:hover, body[data-aslh-page*="av_contract"] .btn-green.add-input:focus-visible { background: var(--aslh-color-brand); color: var(--aslh-color-on-brand); text-decoration: none; }
/* Kontrollkästchen und Beschriftungen */
body[data-aslh-page*="av_contract"] input.custom-checkbox { accent-color: var(--aslh-color-brand); width: 1rem; height: 1rem; margin-right: 0.5rem; vertical-align: -0.15em; }
body[data-aslh-page*="av_contract"] .form-check-label { color: var(--aslh-color-text); }
body[data-aslh-page*="av_contract"] .form-av-type > div { padding: 0.2rem 0; }
body[data-aslh-page*="av_contract"] .form-av-type .form-control { margin: var(--aslh-space-2) 0 0; }
/* Vertragstext-Boxen */
body[data-aslh-page*="av_contract"] #contract, body[data-aslh-page*="av_contract"] #contract_attachment { background: var(--aslh-color-surface-sunken); padding: var(--aslh-space-4); color: var(--aslh-color-text); }
/* Upload-Feld (bootstrap-fileinput) */
body[data-aslh-page*="av_contract"] .file-caption, body[data-aslh-page*="av_contract"] .file-preview, body[data-aslh-page*="av_contract"] .file-drop-zone { background: var(--aslh-color-surface); border-color: var(--aslh-color-input-border); color: var(--aslh-color-text); border-radius: 0; }
body[data-aslh-page*="av_contract"] .file-drop-zone-title { color: var(--aslh-color-text-muted); }

/* ============ KI-Domainsuche (WHMCS 9.1, „domain-checker-advanced“, 2026-10-25) ============
   standard_cart/twenty-one setzen dort feste Farben (Knöpfe #111827 auf transparent, Textfeld grau) → im Dark Mode unsichtbar.
   Gilt in der Bestellstrecke (#order-standard_cart) und in der Startseiten-Domainsuche (.home-domain-search). */
html[data-theme-pref] #order-standard_cart .domain-checker-advanced textarea,
html[data-theme-pref] .domain-checker-container.domain-checker-advanced textarea,
html[data-theme-pref] .home-domain-search .advanced-input textarea {
  background-color: var(--aslh-color-surface-raised);
  border: 1px solid var(--aslh-color-input-border);
  border-radius: 0;
  color: var(--aslh-color-text);
  padding: 0.75rem 0.9rem;
}
html[data-theme-pref] .domain-checker-advanced textarea::placeholder,
html[data-theme-pref] .home-domain-search .advanced-input textarea::placeholder { color: var(--aslh-color-text-muted); opacity: 1; }
html[data-theme-pref] .domain-checker-advanced textarea:focus,
html[data-theme-pref] .home-domain-search .advanced-input textarea:focus {
  outline: none; border-color: var(--aslh-color-brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--aslh-color-brand) 30%, transparent);
}
/* Filterknöpfe „TLDs einbeziehen“ / „Maximale Länge“ */
html[data-theme-pref] #order-standard_cart .domain-checker-advanced .multiselect.dropdown-toggle,
html[data-theme-pref] .domain-checker-container.domain-checker-advanced .multiselect.dropdown-toggle,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect.dropdown-toggle {
  display: inline-flex; align-items: center; gap: 0.35rem;
  margin: 0.4rem 0.4rem 0 0; padding: 0.3rem 0.7rem;
  background-color: var(--aslh-color-surface-raised);
  border: 1px solid var(--aslh-color-input-border);
  border-radius: 0;
  color: var(--aslh-color-text);
  font-size: 0.8rem; font-weight: 600;
}
html[data-theme-pref] .domain-checker-advanced .multiselect.dropdown-toggle:hover,
html[data-theme-pref] .domain-checker-advanced .multiselect.dropdown-toggle:focus-visible,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect.dropdown-toggle:hover {
  border-color: var(--aslh-color-brand); color: var(--aslh-color-text);
}
html[data-theme-pref] .domain-checker-advanced .multiselect.dropdown-toggle .caret,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect.dropdown-toggle .caret { border-top-color: currentColor; }
/* Aufklappliste der Filter */
html[data-theme-pref] .domain-checker-advanced .multiselect-container,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect-container {
  background-color: var(--aslh-color-surface-raised);
  border: 1px solid var(--aslh-color-border);
  border-radius: 0;
  box-shadow: var(--aslh-shadow-lg);
}
html[data-theme-pref] .domain-checker-advanced .multiselect-container label,
html[data-theme-pref] .domain-checker-advanced .multiselect-container a,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect-container label,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect-container a { color: var(--aslh-color-text); }
html[data-theme-pref] .domain-checker-advanced .multiselect-container li:hover > a,
html[data-theme-pref] .domain-checker-advanced .multiselect-container li.active > a,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect-container li:hover > a { background-color: var(--aslh-color-surface); }
html[data-theme-pref] .domain-checker-advanced .multiselect-container .multiselect-search,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect-container .multiselect-search {
  background-color: var(--aslh-color-surface); border: 1px solid var(--aslh-color-input-border); color: var(--aslh-color-text); border-radius: 0;
}
html[data-theme-pref] #order-standard_cart .domain-checker-advanced label,
html[data-theme-pref] .domain-checker-container.domain-checker-advanced label { color: var(--aslh-color-text); }
html[data-theme-pref] .domain-checker-advanced input[type="checkbox"],
html[data-theme-pref] .home-domain-search .advanced-input input[type="checkbox"] { accent-color: var(--aslh-color-brand); }
/* „Sichere Suche“ als Schalter im Stil der Filterknöpfe daneben (2026-10-25): gleiche Höhe/Rahmen,
   eckiges Kästchen, aktiv orange mit dunklem Haken; Rahmen orange, solange aktiv. */
html[data-theme-pref] .domain-checker-advanced label:has(> input[name="filter"]),
html[data-theme-pref] .home-domain-search .advanced-input label:has(> input[name="filter"]) {
  display: inline-flex; align-items: center; gap: 0.5rem;
  margin: 0.4rem 0.4rem 0 0; padding: 0.3rem 0.7rem;
  background-color: var(--aslh-color-surface-raised);
  border: 1px solid var(--aslh-color-input-border);
  color: var(--aslh-color-text);
  font-size: 0.8rem; font-weight: 600; line-height: 1.5;
  cursor: pointer; user-select: none;
  transition: border-color var(--aslh-dur-fast) var(--aslh-ease-out);
}
html[data-theme-pref] .domain-checker-advanced label:has(> input[name="filter"]:checked),
html[data-theme-pref] .domain-checker-advanced label:has(> input[name="filter"]):hover,
html[data-theme-pref] .home-domain-search .advanced-input label:has(> input[name="filter"]:checked),
html[data-theme-pref] .home-domain-search .advanced-input label:has(> input[name="filter"]):hover { border-color: var(--aslh-color-brand); }
html[data-theme-pref] .domain-checker-advanced input[name="filter"],
html[data-theme-pref] #order-standard_cart .domain-checker-advanced input[name="filter"],
html[data-theme-pref] .home-domain-search .advanced-input input[name="filter"] {
  -webkit-appearance: none; appearance: none;
  flex: 0 0 auto; width: 0.95rem; height: 0.95rem; margin: 0;
  background: var(--aslh-color-surface) no-repeat center / 0.7rem 0.7rem;
  border: 1px solid var(--aslh-color-input-border); border-radius: 0;
  cursor: pointer;
}
html[data-theme-pref] .domain-checker-advanced input[name="filter"]:checked,
html[data-theme-pref] #order-standard_cart .domain-checker-advanced input[name="filter"]:checked,
html[data-theme-pref] .home-domain-search .advanced-input input[name="filter"]:checked {
  background-color: var(--aslh-color-brand); border-color: var(--aslh-color-brand);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.3 5 8.6l4.5-5' fill='none' stroke='%2314161B' stroke-width='1.8' stroke-linecap='square'/%3E%3C/svg%3E");
}
html[data-theme-pref] .domain-checker-advanced input[name="filter"]:focus-visible,
html[data-theme-pref] .home-domain-search .advanced-input input[name="filter"]:focus-visible { outline: 2px solid var(--aslh-color-brand); outline-offset: 2px; }
/* Knöpfe und Schalter gleich hoch und auf einer Linie */
html[data-theme-pref] .domain-checker-advanced .btn-group:has(> .multiselect),
html[data-theme-pref] .home-domain-search .advanced-input .btn-group:has(> .multiselect) { vertical-align: top; }
html[data-theme-pref] #order-standard_cart .domain-checker-advanced .multiselect.dropdown-toggle,
html[data-theme-pref] .domain-checker-container.domain-checker-advanced .multiselect.dropdown-toggle,
html[data-theme-pref] .home-domain-search .advanced-input .multiselect.dropdown-toggle,
html[data-theme-pref] .domain-checker-advanced label:has(> input[name="filter"]),
html[data-theme-pref] .home-domain-search .advanced-input label:has(> input[name="filter"]) {
  box-sizing: border-box; height: 2.125rem; padding-top: 0; padding-bottom: 0; vertical-align: top;
}
/* standard_cart setzt Labels in der Bestellstrecke per ID-Regel auf margin 5px → gleicher Abstand wie die Knöpfe */
html[data-theme-pref] #order-standard_cart .domain-checker-advanced label:has(> input[name="filter"]) { margin: 0.4rem 0.4rem 0 0; }