:root{
  --crm-bg:#08080b;
  --crm-surface:#111119;
  --crm-surface-2:#181825;
  --crm-text:#f6f6fb;
  --crm-muted:#b8b8c7;
  --crm-primary:#8b5cf6;
  --crm-primary-dark:#6d28d9;
  --crm-accent:#ec4899;
  --crm-cyan:#22d3ee;
  --crm-border:rgba(255,255,255,.11);
  --crm-shadow:0 18px 60px rgba(0,0,0,.38);
  --crm-button-height:38px;
  --crm-button-height-lg:46px;
  --crm-button-padding-x:.85rem;
  --crm-button-radius:.55rem;
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  padding:.2rem;
  border-radius:.3rem;
  background-color:rgba(0,0,0,.16);
  filter:invert(1) brightness(1.8);
  opacity: 1;
  cursor: pointer;
}
html,body{min-height:100%;}
body.crm-app,body.crm-public{
  background:
    radial-gradient(circle at top left, rgba(139,92,246,.28), transparent 34rem),
    radial-gradient(circle at bottom right, rgba(236,72,153,.22), transparent 32rem),
    var(--crm-bg);
  color:var(--crm-text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
a{color:var(--crm-cyan);} a:hover{color:#67e8f9;}
.crm-navbar{background:rgba(8,8,11,.92)!important;backdrop-filter:blur(12px);border-bottom:1px solid var(--crm-border);}
.crm-brand{display:flex;align-items:center;gap:.65rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#fff!important;}
.crm-brand-logo{height:34px;width:auto;max-width:150px;object-fit:contain;}
.crm-brand-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--crm-primary),var(--crm-accent));display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:900;box-shadow:0 8px 28px rgba(139,92,246,.35);}
main.container,.crm-public .container{position:relative;}
.card,.dropdown-menu,.modal-content{background:rgba(17,17,25,.96);color:var(--crm-text);border:1px solid var(--crm-border);box-shadow:var(--crm-shadow);}

/* Lernverlauf: Bootstrap-Listengruppen dürfen im Dark Theme keine dunkle
   Schriftfarbe auf den transparenten Ereigniszeilen vererben. */
.student-report-timeline-item {
    color: var(--crm-text) !important;
    border-color: rgba(255, 255, 255, .16) !important;
}
.student-report-event-title {
    color: #f8fafc !important;
}
.student-report-task-context {
    color: #c7cad8 !important;
}
.student-report-progress .progress-bar {
    min-width: 0;
    overflow: hidden;
    padding-inline: .35rem;
    white-space: nowrap;
}
.table{--bs-table-bg:rgba(17,17,25,.72);--bs-table-color:var(--crm-text);--bs-table-border-color:var(--crm-border);color:var(--crm-text);}
.table-striped>tbody>tr:nth-of-type(odd)>*{--bs-table-bg-type:rgba(255,255,255,.035);color:var(--crm-text);}
.table-hover>tbody>tr:hover>*{--bs-table-bg-state:rgba(139,92,246,.14);color:#fff;}
.form-control,.form-select,textarea{background:#0d0d14!important;border-color:rgba(255,255,255,.18)!important;color:#fff!important;}
.form-control:focus,.form-select:focus{border-color:var(--crm-primary)!important;box-shadow:0 0 0 .25rem rgba(139,92,246,.25)!important;}
.form-control::placeholder{color:#8f8fa2;}
.form-label,label{color:#e9e9f6;font-weight:600;}
.btn-primary{background:linear-gradient(135deg,var(--crm-primary),var(--crm-accent));border:0;color:#fff;box-shadow:0 10px 30px rgba(139,92,246,.25);}
.btn-primary:hover{filter:brightness(1.08);}
.btn-outline-light{border-color:rgba(255,255,255,.22);}
.btn-outline-light:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.36);color:#fff;}
.btn-success{background:#16a34a;border-color:#16a34a}.btn-danger{background:#dc2626;border-color:#dc2626}.btn-warning{background:#f59e0b;border-color:#f59e0b;color:#111}.btn-info{background:#22d3ee;border-color:#22d3ee;color:#071018}
.badge.bg-info{color:#071018!important}.badge.bg-warning{color:#111!important}
.alert{border:1px solid var(--crm-border);box-shadow:0 12px 28px rgba(0,0,0,.18);}
.crm-hero{border:1px solid var(--crm-border);background:linear-gradient(145deg,rgba(17,17,25,.96),rgba(24,24,37,.9));border-radius:24px;box-shadow:var(--crm-shadow);overflow:hidden;}
.crm-hero-header{background:linear-gradient(135deg,rgba(139,92,246,.9),rgba(236,72,153,.82));padding:28px;color:#fff;}
.crm-hero-body{padding:28px;}
.crm-kicker{color:var(--crm-cyan);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;}
.crm-card-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));}
.crm-slot-card{background:rgba(17,17,25,.92);border:1px solid var(--crm-border);border-radius:18px;padding:18px;box-shadow:0 10px 34px rgba(0,0,0,.25);}
.crm-slot-card:hover{border-color:rgba(139,92,246,.55);}
.crm-footer-small{color:var(--crm-muted);font-size:.86rem;}
@media (max-width: 768px){
  .crm-navbar .container{align-items:flex-start}.crm-navbar .d-flex{width:100%;margin-top:.75rem;gap:.45rem!important}.crm-navbar .btn{flex:1 1 auto;font-size:.78rem;padding:.42rem .55rem}.table-responsive{border-radius:16px;border:1px solid var(--crm-border)}.card-body{padding:1rem}.crm-hero-header,.crm-hero-body{padding:20px}.display-5{font-size:2rem}
}
.dropdown-menu form .dropdown-item{color:inherit;text-align:left;text-decoration:none;width:100%;}
.dropdown-menu form .dropdown-item:hover{background:rgba(255,255,255,.12);color:#fff;}

.dashboard-label {
    color: #d0d7ff;
    font-size: .9rem;
    font-weight: 600;
    letter-spacing: .01em;
}

/* Konsistente Tabellenstatus-Farben für Dark Theme auf allen Listen */
.table tbody tr.table-success > *,
.table tbody tr.table-primary > *,
.table tbody tr.table-warning > *,
.table tbody tr.table-danger > *,
.table tbody tr.table-secondary > *,
.table tbody tr.table-info > * {
    color: var(--crm-text) !important;
    border-color: var(--crm-border) !important;
}
.table tbody tr.table-success > * { background-color: rgba(22, 163, 74, .16) !important; }
.table tbody tr.table-primary > * { background-color: rgba(139, 92, 246, .18) !important; }
.table tbody tr.table-warning > * { background-color: rgba(245, 158, 11, .18) !important; }
.table tbody tr.table-danger > * { background-color: rgba(220, 38, 38, .18) !important; }
.table tbody tr.table-secondary > * { background-color: rgba(148, 163, 184, .16) !important; }
.table tbody tr.table-info > * { background-color: rgba(34, 211, 238, .16) !important; }

.table tbody tr.table-success:hover > *,
.table tbody tr.table-primary:hover > *,
.table tbody tr.table-warning:hover > *,
.table tbody tr.table-danger:hover > *,
.table tbody tr.table-secondary:hover > *,
.table tbody tr.table-info:hover > * {
    background-color: rgba(255, 255, 255, .09) !important;
    color: #fff !important;
}

.dashboard-member-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.dashboard-member-summary-card {
    min-height: 132px;
    padding: 1.2rem;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(17, 17, 25, .98), rgba(25, 25, 38, .94));
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

a.dashboard-member-summary-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .3);
}

.dashboard-member-summary-card--active { border-color: rgba(22, 163, 74, .8); }
.dashboard-member-summary-card--paused { border-color: rgba(245, 158, 11, .85); }
.dashboard-member-summary-card--returning { border-color: rgba(34, 211, 238, .8); }
.dashboard-member-summary-card--birthdays { border-color: rgba(139, 92, 246, .8); }

.dashboard-member-stat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    gap: 1rem;
}

.dashboard-member-stat-value {
    margin-top: .15rem;
    font-size: 2.65rem;
    font-weight: 300;
    line-height: 1;
}

.dashboard-member-summary-card--active .dashboard-member-stat-value { color: #22c55e; }
.dashboard-member-summary-card--paused .dashboard-member-stat-value { color: #fbbf24; }

.member-contingent-card .card-body {
    padding-right: 3.75rem;
}

.member-contingent-info {
    position: absolute;
    right: 1rem;
    bottom: 0.85rem;
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: inherit;
    opacity: 0.78;
    transition: opacity 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

.member-contingent-info:hover,
.member-contingent-info:focus-visible {
    background: rgba(148, 163, 184, 0.14);
    color: inherit;
    opacity: 1;
    outline: 0;
    box-shadow: none;
}

.dashboard-member-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.1rem;
    height: 3.1rem;
    border-radius: 50%;
    font-size: 1.25rem;
    background: rgba(255, 255, 255, .07);
}

.dashboard-member-summary-card--active .dashboard-member-stat-icon { color: #22c55e; }
.dashboard-member-summary-card--paused .dashboard-member-stat-icon { color: #fbbf24; }

.dashboard-returner-list {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.dashboard-returner-link {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .38rem .65rem;
    border: 1px solid rgba(34, 211, 238, .42);
    border-radius: 999px;
    background: rgba(34, 211, 238, .08);
    color: var(--crm-cyan);
    font-size: .88rem;
    font-weight: 700;
    line-height: 1.15;
    text-decoration: none;
}

.dashboard-returner-link:hover {
    border-color: var(--crm-cyan);
    background: rgba(34, 211, 238, .16);
    color: #fff;
}

.dashboard-birthday-link {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .38rem .65rem;
    border: 1px solid rgba(139, 92, 246, .48);
    border-radius: 999px;
    background: rgba(139, 92, 246, .1);
    color: #c4b5fd;
    font-size: .88rem;
    font-weight: 700;
    line-height: 1.15;
    text-decoration: none;
}

.dashboard-birthday-link small { color: var(--crm-muted); }
.dashboard-birthday-count {
    background: #8b5cf6;
    color: #fff;
}
.dashboard-birthday-link:hover { border-color: #a78bfa; background: rgba(139, 92, 246, .2); color: #fff; }
.dashboard-birthday-link--today {
    border-color: #f472b6;
    background: rgba(236, 72, 153, .2);
    color: #fbcfe8;
    box-shadow: 0 0 0 2px rgba(236, 72, 153, .12);
}

@media (max-width: 1199.98px) {
    .dashboard-member-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 991.98px) {
    .dashboard-member-summary-grid { grid-template-columns: 1fr; }
}

/* In der Vertragshistorie bleibt die fachliche Statusfarbe auch beim Hover erhalten. */
.contract-history-table tbody tr.table-success:hover > * {
    background-color: rgba(22, 163, 74, .23) !important;
}
.contract-history-table tbody tr.table-danger:hover > * {
    background-color: rgba(220, 38, 38, .24) !important;
}

.badge.bg-success { background-color: #16a34a !important; color: #fff !important; }
.badge.bg-danger { background-color: #dc2626 !important; color: #fff !important; }
.badge.bg-secondary { background-color: #64748b !important; color: #fff !important; }
.badge.bg-primary { background-color: #7c3aed !important; color: #fff !important; }


/* Einheitliche Button-Höhe in Listen, Dashboards und Detailseiten */
.app-action-btn,
.table-action-btn,
.d-flex > .btn,
.d-grid > .btn,
form .btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1.2;
    border-radius: .55rem;
}
.btn-sm.app-action-btn,
.table .btn-sm {
    min-height: 34px;
    padding-top: .35rem;
    padding-bottom: .35rem;
}

/* Einheitliche Buttons projektweit */
.app-btn,
.app-action-btn,
.table-action-btn,
.btn-action,
.btn.btn-sm.app-action-btn,
.btn.btn-sm.table-action-btn {
    min-height: 38px;
    padding: .45rem .85rem;
    line-height: 1.15;
    border-radius: .55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    font-weight: 600;
}
.table .btn-sm.app-action-btn,
.table .btn-sm.table-action-btn {
    min-height: 36px;
}
.signature-box {
    width: 100%;
    min-height: 220px;
    border: 2px dashed rgba(255,255,255,.28);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
}
.signature-box canvas {
    display: block;
    width: 100%;
    height: 220px;
    touch-action: none;
    background: #fff;
}


/* Einheitliches Button-System: Varianten ändern nur Farbe und Schriftgröße,
   nicht mehr Höhe, Innenabstand oder Rundung. */
.btn:not(.btn-close) {
    min-height: var(--crm-button-height) !important;
    height: var(--crm-button-height) !important;
    padding: .45rem var(--crm-button-padding-x) !important;
    line-height: 1.15 !important;
    border-radius: var(--crm-button-radius) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .35rem !important;
    font-weight: 600 !important;
    white-space: nowrap;
}

.dashboard-notice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.dashboard-notice-grid:empty {
    display: none;
}
.dashboard-notice-grid > a {
    min-width: 0;
    height: 100%;
}
.dashboard-notice-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}
.dashboard-notice-card > span:first-child {
    display: block;
    width: 100%;
}
.dashboard-notice-card > .btn {
    align-self: flex-end;
    margin-top: auto;
}
.dashboard-collapse-toggle {
    width: 100%;
    color: inherit;
    text-align: left;
    cursor: pointer;
}
button.card-header.dashboard-collapse-toggle {
    border-top: 0;
    border-right: 0;
    border-left: 0;
}
.dashboard-collapse-toggle-inline {
    width: auto;
    flex: 1 1 auto;
    padding: 0;
    border: 0;
    background: transparent;
}
.dashboard-collapse-toggle:hover,
.dashboard-collapse-toggle:focus-visible {
    color: inherit;
}
.dashboard-collapse-toggle:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: -3px;
}
.dashboard-collapse-chevron {
    transition: transform .2s ease;
}
.dashboard-collapse-toggle[aria-expanded="true"] .dashboard-collapse-chevron {
    transform: rotate(180deg);
}
@media (max-width: 991.98px) {
    .dashboard-notice-grid {
        grid-template-columns: 1fr;
    }
}
.btn.btn-sm:not(.btn-close) {
    min-height: var(--crm-button-height) !important;
    height: var(--crm-button-height) !important;
    padding: .45rem var(--crm-button-padding-x) !important;
    border-radius: var(--crm-button-radius) !important;
}
.btn.btn-icon:not(.btn-close) {
    width: var(--crm-button-height) !important;
    min-width: var(--crm-button-height) !important;
    max-width: var(--crm-button-height) !important;
    padding: 0 !important;
    flex: 0 0 var(--crm-button-height);
}
.btn.btn-icon > i {
    width: 1em;
    line-height: 1;
    text-align: center;
}
.btn.btn-lg:not(.btn-close) {
    min-height: var(--crm-button-height-lg) !important;
    height: var(--crm-button-height-lg) !important;
    padding-right: 1.1rem !important;
    padding-left: 1.1rem !important;
}
.crm-hero-header .crm-school-logo {
    width: auto !important;
    height: auto !important;
    max-width: 180px !important;
    max-height: 80px !important;
}

.crm-public-header {
    text-align: center;
}

.table-action-fixed {
    width: 110px !important;
    min-width: 110px !important;
    max-width: 110px !important;
}

.task-title {
    display: block;
    max-width: 100%;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.learning-progress-track {
    height: 8px;
    background: rgba(255,255,255,.16);
    border-radius: 999px;
    overflow: hidden;
}

.learning-progress-fill {
    display: block;
    height: 100%;
    width: var(--progress) !important;
    background: #06ca68;
    border-radius: 999px;
}

.template-card {
    cursor: pointer;
    transition: all .15s ease;
}

.template-card:hover {
    transform: translateY(-2px);
}

.template-card:hover {
    border-color: var(--crm-primary);
}

.crm-navbar {
    position: relative;
    z-index: 1050;
}

.crm-navbar .dropdown-menu {
    z-index: 2000;
}

.modal {
    z-index: 2050;
}

.modal-backdrop {
    z-index: 2040;
}

.modal-dialog {
    position: relative;
    z-index: 2060;
}

.builder-card {
    cursor: pointer;
    user-select: none;
    transition: border-color .15s ease, transform .15s ease;
}

.builder-card:hover {
    border-color: var(--crm-primary);
    transform: translateY(-2px);
}






.accordion-item {
    background: #11111a;
    border: 1px solid rgba(255,255,255,.12);
}

.accordion-button,
.accordion-button:not(.collapsed) {
    background: #181824;
    color: #fff;
    box-shadow: none;
}

.accordion-body {
    background: #11111a;
    color: #fff;
    border-top: 1px solid rgba(255,255,255,.08);
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-button::after {
    filter: invert(1);
}

/* Eine Collapsible-Karte zeichnet ihre Außenkontur selbst. Auf schmalen
   Ansichten darf die enthaltene responsive Tabelle keinen zweiten Rahmen
   und keine eigene Rundung darüberlegen. */
.dashboard-persisted-collapse > .table-responsive {
    border: 0;
    border-radius: 0;
}

.dashboard-status-card {
    position: relative;
    isolation: isolate;
    background-clip: padding-box;
}

/* Gesättigte Bootstrap-Rahmen wirken an kleinen Radien je nach Zoomstufe
   treppenförmig. Die Statusfarbe wird deshalb als geglättete Innenkontur
   über dem Karteninhalt gezeichnet. */
.dashboard-status-card.border-warning {
    border-color: transparent !important;
}

.dashboard-status-card.border-warning::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 5;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 193, 7, .82);
    pointer-events: none;
}

/* Die Statusgruppen auf der Mitgliederseite sind eigenständige Karten.
   Ohne Abstand überlagern sich Bootstraps verbundene Accordion-Kanten mit
   den Theme-Rundungen und erzeugen seitliche Kerben. */
#memberGroupsAccordion {
    display: grid;
    gap: .75rem;
}

#memberGroupsAccordion > .accordion-item {
    margin: 0;
    border-radius: 14px;
    overflow: hidden;
}

#memberGroupsAccordion > .accordion-item > .accordion-header .accordion-button {
    border-radius: 0;
}

.lesson-absence-table-card > .table-responsive {
    border: 0;
    border-radius: 0;
}

.lesson-absence-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--bs-secondary-color) 58%, transparent) transparent;
}

.lesson-absence-tabs .nav-link {
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .lesson-absence-heading {
        flex-wrap: wrap;
    }
}

.learning-level-progress-toggle {
    position: relative;
    width: 100%;
    min-height: 68px;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(13, 202, 240, .42);
    border-radius: inherit;
    background: #0b2d48;
    color: #fff;
    text-align: left;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.025);
}
.learning-level-progress-toggle:hover { border-color: rgba(13, 202, 240, .78); }
.learning-level-progress-fill {
    position: absolute;
    inset: 0 auto 0 0;
    min-width: 0;
    background: linear-gradient(90deg, rgba(0, 177, 203, .72), rgba(13, 202, 240, .5));
    border-right: 2px solid rgba(120, 236, 255, .88);
    box-shadow: 8px 0 18px rgba(13, 202, 240, .2);
    transition: width .25s ease;
}
.learning-level-progress-toggle.is-complete .learning-level-progress-fill {
    width: auto !important;
    right: 0;
    background: linear-gradient(90deg, rgba(13, 138, 76, .9), rgba(25, 180, 103, .72));
    border-right: 0;
    box-shadow: none;
}
.learning-level-progress-toggle.is-empty .learning-level-progress-fill {
    border-right: 0;
    box-shadow: none;
}
.learning-level-progress-content {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 1.25rem;
    align-items: center;
    gap: 1rem;
    min-height: 68px;
    padding: .85rem 1.1rem;
}
.learning-level-progress-title { display: flex; align-items: center; gap: .65rem; min-width: 0; }
.learning-level-progress-meta { color: rgba(255,255,255,.82); white-space: nowrap; }
.learning-level-progress-chevron { transition: transform .2s ease; }
.learning-level-progress-toggle[aria-expanded="true"] .learning-level-progress-chevron { transform: rotate(180deg); }
.learning-level-collapse-body .card-title,
.learning-level-collapse-body > fieldset > .d-flex > .text-center { display: none; }
.learning-level-collapse-body > fieldset > .d-flex { display: block !important; }
.learning-track-section-title {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .75rem .25rem;
    padding: .35rem .7rem;
    border: 1px solid rgba(13, 202, 240, .42);
    border-radius: 999px;
    color: var(--bs-info);
    background: rgba(13, 202, 240, .07);
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .015em;
}
.learning-track-section + .learning-track-section {
    padding-top: .2rem;
    border-top: 1px solid rgba(255,255,255,.08);
}

@media (max-width: 575.98px) {
    .learning-level-progress-content { grid-template-columns: minmax(0, 1fr) 1.25rem; gap: .5rem; }
    .learning-level-progress-meta { grid-column: 1; grid-row: 2; white-space: normal; font-size: .85rem; }
    .learning-level-progress-chevron { grid-column: 2; grid-row: 1 / span 2; }
}

/* Learning curriculum and path */
.module-card-wrapper { overflow: hidden; border-radius: .75rem !important; border-color:var(--learning-category) !important; }
.module-card-wrapper .accordion-button { border-radius: .75rem !important; }
.module-card-wrapper:has(.accordion-collapse.show) .accordion-button { border-radius: .75rem .75rem 0 0 !important; }
.learning-category-badge { display:inline-flex; align-items:center; padding:.32rem .55rem; border-radius:999px; font-size:.75rem; font-weight:600; }
.learning-category-basic { --learning-category:#20c997; }
.learning-category-advanced { --learning-category:#0dcaf0; }
.learning-category-proficient { --learning-category:#a56eff; }
.learning-category-training { --learning-category:#ffc107; }
.learning-category-special { --learning-category:#ff5c8a; }
.learning-category-badge[class*="learning-category-"] { color:#071a2b; background:var(--learning-category); }
.learning-path-subject[class*="learning-category-"] { border-left:4px solid var(--learning-category); }
.learning-path-prerequisites { max-height:10rem; overflow:auto; }
.learning-module-access-icon { width:2.4rem; height:2.4rem; display:inline-grid; place-items:center; }
.btn.btn-sm.seminar-task-complete-icon:not(.btn-close) {
    width:1.875rem !important;
    min-width:1.875rem !important;
    max-width:1.875rem !important;
    height:1.875rem !important;
    min-height:1.875rem !important;
    padding:0 !important;
    display:inline-grid !important;
    place-items:center;
    line-height:1 !important;
}
.module-icon-action { width:2.5rem; height:2.35rem; display:inline-grid; place-items:center; padding:0 !important; }
@media (min-width:1200px) { .member-summary-col { flex:0 0 20%; max-width:20%; } }

.accordion-person {
    border-left: 4px solid #0d6efd;
}

.accordion-partner {
    border-left: 4px solid #6f42c1;
}

.accordion-address {
    border-left: 4px solid #0dcaf0;
}

.accordion-contract {
    border-left: 4px solid #ffc107;
}


.accordion-institution {
    border-left: 4px solid #0d6efd;
}

.accordion-payment {
    border-left: 4px solid #6f42c1;
}

.accordion-numbers {
    border-left: 4px solid #0dcaf0;
}

.accordion-invoice {
    border-left: 4px solid #6f42c1;
}

.accordion-paymenttype {
    border-left: 4px solid #0dcaf0;
}

.accordion-automation {
    border-left: 4px solid #0d6efd;
}

.response-row {
    cursor: pointer;
}

.lead-timeline {
    display: grid;
}
.lead-timeline-entry {
    position: relative;
    display: grid;
    grid-template-columns: 1rem minmax(0, 1fr);
    gap: .8rem;
    padding-bottom: 1.1rem;
}
.lead-timeline-entry:not(:last-child)::before {
    content: "";
    position: absolute;
    top: .75rem;
    bottom: 0;
    left: .34rem;
    width: 2px;
    background: var(--crm-border);
}
.lead-timeline-marker {
    position: relative;
    z-index: 1;
    width: .72rem;
    height: .72rem;
    margin-top: .35rem;
    border: 2px solid var(--crm-surface);
    border-radius: 50%;
    background: var(--crm-cyan);
    box-shadow: 0 0 0 1px var(--crm-cyan);
}
.lead-timeline-content {
    min-width: 0;
    padding: .75rem .9rem;
    border: 1px solid var(--crm-border);
    border-radius: .75rem;
    background: var(--crm-surface-2);
}

.public-register input[type="date"]::-webkit-calendar-picker-indicator,
.public-register input[type="time"]::-webkit-calendar-picker-indicator {
    filter: invert(1) brightness(2);
    opacity: 0.9;
    cursor: pointer;
}

.table-number {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.app-accordion .accordion-item {
    background: rgba(18, 18, 28, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #fff;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 12px;
}

.app-accordion .accordion-button {
    background: rgba(18, 18, 28, 0.96);
    color: #fff;
    font-weight: 700;
    box-shadow: none;
}

.app-accordion .accordion-button:not(.collapsed) {
    background: rgba(35, 35, 52, 0.98);
    color: #fff;
}

.app-accordion .accordion-button::after {
    filter: invert(1);
}

.app-accordion .accordion-body {
    background: rgba(14, 14, 22, 0.98);
    color: #fff;
}

/* Die manuelle Mitgliederanlage ist ein zusammengehöriger Formularablauf.
   Ruhige, einheitliche Karten sind hier übersichtlicher als verschiedenfarbige
   Seitenmarkierungen an jedem einzelnen Abschnitt. */
.member-create-accordion {
    display: grid;
    gap: .75rem;
}

.member-create-accordion .accordion-item {
    margin-bottom: 0;
    border-radius: 12px;
}

.member-create-accordion .accordion-button {
    min-height: 3.25rem;
    border-left: 0;
    border-radius: 0;
    font-weight: 600;
}

.member-create-accordion .accordion-button:not(.collapsed) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.tag-color-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    min-height: 1.75rem;
    padding: .25rem .65rem;
    border: 2px solid var(--tag-border, #fff);
    border-radius: 999px;
    background: var(--tag-bg, #0d6efd);
    color: var(--tag-text, #fff);
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.15;
    white-space: nowrap;
}

.tag-color-preview {
    min-width: 5.5rem;
}

.learning-task .learning-task-meta-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.2rem;
    padding: .12rem .42rem;
    border-width: 1px;
    font-size: .68rem;
    font-weight: 600;
    line-height: 1;
}

.tag-value-option {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding-left: 0;
}

.tag-value-option .form-check-input {
    float: none;
    margin: 0;
}

.table .app-action-btn.btn-sm {
    min-width: 150px;
}
/* UX/Admin Block 1G.2 */
.school-logo-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 360px);
    min-height: 110px;
    padding: 16px;
    border: 1px solid rgba(148, 163, 184, .25);
    border-radius: 12px;
    background: rgba(15, 23, 42, .55);
}

.school-logo-preview img {
    display: block;
    max-width: 100%;
    max-height: 140px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.permission-matrix {
    table-layout: fixed;
    min-width: 720px;
}

.permission-matrix .permission-name-column {
    width: auto;
}

.permission-matrix .permission-role-column {
    width: 170px;
}

.permission-matrix thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #101018;
    color: #f8fafc;
    vertical-align: middle;
}

.permission-matrix .permission-category-row th {
    padding-top: .8rem;
    padding-bottom: .55rem;
    background: rgba(124, 58, 237, .10);
    color: var(--bs-secondary-color);
    font-size: .78rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.permission-matrix td,
.permission-matrix th {
    padding-left: 1rem;
    padding-right: 1rem;
    background-color: transparent;
    color: inherit;
}

.permission-check-cell {
    vertical-align: middle;
}

.permission-check-cell .form-check-input {
    width: 1.15rem;
    height: 1.15rem;
    margin: 0;
}

.permission-override-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.admin-hub-sections {
    display: grid;
    gap: 1.5rem;
}

.admin-hub-section {
    padding: 1.25rem;
    border: 1px solid var(--crm-border);
    border-radius: 14px;
    background: var(--crm-surface);
}

.admin-hub-section-heading {
    margin-bottom: 1rem;
}

.admin-hub-section-heading h2 {
    margin: 0 0 .2rem;
    font-size: 1.08rem;
}

.admin-hub-section-heading p {
    margin: 0;
    color: var(--bs-secondary-color);
    font-size: .9rem;
}

.admin-hub-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
}

.admin-hub-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 128px;
    padding: 1rem 2.6rem 1rem 1rem;
    border: 1px solid var(--crm-border);
    border-radius: 12px;
    color: inherit;
    text-decoration: none;
    background: var(--crm-surface-2);
    transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.admin-hub-card:hover,
.admin-hub-card:focus-visible {
    transform: translateY(-2px);
    border-color: var(--crm-cyan);
    color: inherit;
    background: color-mix(in srgb, var(--crm-surface-2) 82%, var(--crm-cyan));
}

.admin-hub-card-title {
    margin-bottom: .35rem;
    font-weight: 700;
}

.admin-hub-card-description {
    color: var(--bs-secondary-color);
    font-size: .88rem;
    line-height: 1.45;
}

.admin-hub-card-arrow {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    font-size: 1.65rem;
    color: #c084fc;
}

@media (max-width: 991.98px) {
    .admin-hub-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .permission-override-grid,
    .admin-hub-grid {
        grid-template-columns: 1fr;
    }

    .permission-matrix .permission-role-column {
        width: 130px;
    }
}

/* UX/Admin Block 1G.2A: lesbare Beschreibungstexte im Dark Mode */
:root {
    --bs-secondary-color: #b8b8c7;
    --bs-secondary-color-rgb: 184, 184, 199;
}

body.crm-app,
body.crm-public {
    --bs-secondary-color: var(--crm-muted);
    --bs-secondary-color-rgb: 184, 184, 199;
}

.text-secondary,
.text-muted,
.form-text,
.card-text.text-secondary,
.card-text.text-muted,
small.text-secondary,
small.text-muted {
    color: var(--crm-muted) !important;
    opacity: 1 !important;
}

.admin-hub-heading .text-secondary,
.admin-hub-section-heading p,
.admin-hub-card-description,
.permission-matrix .permission-category-row th {
    color: var(--crm-muted) !important;
    opacity: 1 !important;
}

.admin-hub-card-description,
.admin-hub-section-heading p {
    font-weight: 400;
}

/* Kumulierung 32: kompakter Lernfortschritt und identische Anwesenheitsaktionen */
.dashboard-learning-task { display:flex; align-items:center; gap:.5rem; min-width:0; }
.dashboard-learning-dot { display:inline-block !important; width:.65rem !important; height:.65rem !important; min-width:.65rem; border-radius:50%; flex:0 0 .65rem; }
.dashboard-learning-dot.is-started { background:#0d6efd !important; }
.dashboard-learning-dot.is-repeat { background:#fd7e14 !important; }
.dashboard-learning-title { display:block; max-width:420px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.attendance-action-group { display:flex; justify-content:flex-end; gap:.35rem; flex-wrap:nowrap; }
.attendance-action-form { display:block; flex:0 0 2.5rem !important; width:2.5rem !important; min-width:2.5rem !important; max-width:2.5rem !important; margin:0; }
.attendance-action-button { display:inline-flex !important; align-items:center; justify-content:center; box-sizing:border-box; width:2.5rem !important; min-width:2.5rem !important; max-width:2.5rem !important; height:2.5rem !important; min-height:2.5rem !important; padding:0 !important; line-height:1 !important; }

/* Trainerabrechnung 03 / Dashboard: zyklischer Anwesenheitsstatus */
.attendance-cycle-button {
    min-width: 9.5rem;
    justify-content: center;
    font-weight: 600;
}
.dashboard-learning-task {
    display: flex;
    align-items: center;
    gap: .35rem;
    min-width: 0;
}
.dashboard-learning-dot {
    flex: 0 0 .55rem;
    width: .55rem;
    height: .55rem;
    border-radius: 999px;
    display: inline-block;
    background: var(--bs-primary);
}
.dashboard-learning-dot.is-repeat { background: var(--bs-warning); }
.dashboard-learning-title {
    display: inline-block;
    max-width: 28rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}
.billing-rule-modal .modal-dialog { max-width: min(980px, calc(100vw - 1.5rem)); }
.billing-rule-modal .modal-content { max-height: 90vh; display: flex; }
.billing-rule-modal .modal-header,
.billing-rule-modal .modal-footer { flex: 0 0 auto; }
.billing-rule-modal .modal-body { overflow-y: auto; }

/* Kumulierung 34: Antragsaktionen im Dashboard gruppiert */
.attendance-cycle-button {
    min-width: 10.5rem;
    text-align: center;
}

/* K47.4.1 Dokumentenfelder */
.document-field-create-card {
    border-color: rgba(255, 255, 255, .14);
    background: linear-gradient(135deg, rgba(28, 36, 52, .98), rgba(20, 26, 39, .98));
}
.document-field-create-title {
    color: #f8fafc;
    font-weight: 700;
    letter-spacing: .01em;
}
.document-field-create-card .text-secondary {
    color: rgba(226, 232, 240, .76) !important;
}
.document-field-create-form .form-control {
    min-width: min(22rem, 70vw);
}
.document-fields-list-tools {
    padding: .25rem 0;
}
.document-field-group-toggle {
    width: 100%;
    color: #f8fafc !important;
    background: rgba(255, 255, 255, .045);
    border: 0;
    border-radius: 0;
}
.document-field-group-toggle:hover,
.document-field-group-toggle:focus-visible {
    color: #fff !important;
    background: rgba(255, 255, 255, .09);
}
.document-field-group-title {
    color: #f8fafc;
    font-size: 1rem;
    font-weight: 700;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
}
.document-field-group-chevron {
    color: var(--bs-primary);
    font-size: 1.25rem;
    line-height: 1;
    transition: transform .15s ease;
}
.document-field-group-toggle[aria-expanded="true"] .document-field-group-chevron {
    transform: rotate(180deg);
}
.document-field-col-visible { width: 85px; }
.document-field-col-type { width: 130px; }
.document-field-col-order { width: 105px; }

/* K47.4.2 Dokumentenfelder: ruhige Gruppenköpfe */
.document-field-group-toggle {
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr) auto 1.25rem;
    align-items: center;
    column-gap: .75rem;
    min-height: 2.75rem;
    padding: .65rem 1rem;
}
.document-field-group-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    min-width: 2.35rem;
    min-height: 1.65rem;
    padding: .1rem .35rem;
    border-radius: .45rem;
    background: rgba(148, 163, 184, .72);
    color: #fff;
    font-variant-numeric: tabular-nums;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1;
}
.document-field-group-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.document-field-group-status {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
}
.document-field-group-chevron {
    position: relative;
    display: inline-block;
    width: .72rem;
    height: .72rem;
    color: rgba(191, 219, 254, .95);
    transform: rotate(-45deg);
    transition: transform .18s ease, color .18s ease;
}
.document-field-group-chevron::before {
    content: "";
    position: absolute;
    inset: 0;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    border-radius: 1px;
}
.document-field-group-toggle:hover .document-field-group-chevron,
.document-field-group-toggle:focus-visible .document-field-group-chevron {
    color: #fff;
}
.document-field-group-toggle[aria-expanded="true"] .document-field-group-chevron {
    transform: rotate(45deg);
}
@media (max-width: 640px) {
    .document-field-group-toggle {
        grid-template-columns: 2.35rem minmax(0, 1fr) 1.25rem;
    }
    .document-field-group-status {
        display: none;
    }
}

/* K47.4.3 Dokumentenfelder: Gruppenköpfe linksbündig ausrichten */
form .document-field-group-toggle {
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr) auto 1.25rem;
    justify-content: stretch;
    justify-items: stretch;
    text-align: left;
}
form .document-field-group-toggle .document-field-group-count {
    justify-self: start;
}
form .document-field-group-toggle .document-field-group-title {
    justify-self: start;
    align-self: center;
    text-align: left;
}
form .document-field-group-toggle .document-field-group-status {
    justify-self: end;
}
form .document-field-group-toggle .document-field-group-chevron {
    justify-self: end;
}
@media (max-width: 640px) {
    form .document-field-group-toggle {
        grid-template-columns: 2.35rem minmax(0, 1fr) 1.25rem;
    }
}
.lesson-multidate-weekdays,
.lesson-multidate-days {
    display: grid;
    grid-template-columns: repeat(7, minmax(2.4rem, 1fr));
    gap: .4rem;
    text-align: center;
}

.lesson-multidate-weekdays span {
    color: var(--bs-secondary-color);
    font-size: .85rem;
    font-weight: 700;
}

.lesson-multidate-day {
    min-height: 2.65rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .55rem;
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
}

.lesson-multidate-day:not(:disabled):hover,
.lesson-multidate-day.is-selected {
    border-color: var(--bs-info);
    background: var(--bs-info);
    color: #07131a;
    font-weight: 700;
}

.lesson-multidate-day.is-disabled {
    opacity: .35;
    cursor: not-allowed;
}
.trainer-color-swatch {
    display: inline-block;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 50%;
    vertical-align: middle;
    background: var(--trainer-color, #315FA8);
    border: 2px solid color-mix(in srgb, var(--trainer-color, #315FA8) 65%, white);
}
.lesson-create-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.lesson-create-step {
  display: grid;
  grid-template-columns: 2.25rem 1fr;
  grid-template-rows: auto auto;
  column-gap: .75rem;
  align-items: center;
  padding: .85rem 1rem;
  color: var(--bs-secondary-color);
  text-align: left;
  border: 1px solid var(--bs-border-color);
  border-radius: .75rem;
  background: var(--bs-body-bg);
}
.lesson-create-step span {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  color: #fff;
  font-weight: 700;
  border-radius: 50%;
  background: #5d6670;
}
.lesson-create-step strong { color: var(--bs-body-color); }
.lesson-create-step small { line-height: 1.15; }
.lesson-create-step.is-active { border-color: #16c8e5; box-shadow: 0 0 0 1px rgba(22,200,229,.2); }
.lesson-create-step.is-active span { background: #16c8e5; color: #071014; }
.lesson-create-step.is-complete span { background: #18a957; }
.lesson-step-hidden { display: none !important; }
.trial-step-hidden { display: none !important; }
.lesson-create-navigation { display: flex; justify-content: flex-end; gap: .75rem; }
.lesson-create-navigation [hidden] { display: none !important; }
.lesson-edit-steps .lesson-create-step { cursor: default; }
.appointment-danger-zone .card-body { align-items: center; }
@media (max-width: 767.98px) {
  .lesson-create-steps { grid-template-columns: 1fr; }
  .lesson-create-step small { display: none; }
}
.seminar-attendance-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(125px, 1fr));
    gap: .75rem;
    width: 100%;
}

.seminar-attendance-form {
    margin: 0;
    min-width: 0;
}

.seminar-attendance-card {
    width: 100%;
    aspect-ratio: 1 / 1;
    min-height: 125px;
    padding: 1rem .75rem;
    border: 1px solid #596174;
    border-radius: .75rem;
    background: #20232d;
    color: #f5f7fb;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    text-align: center;
    font: inherit;
    font-weight: 700;
    line-height: 1.25;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}

.seminar-attendance-card:hover {
    background: #292d39;
    border-color: #7d879d;
    transform: translateY(-1px);
}

.seminar-attendance-card.is-attended {
    background: #137a42;
    border-color: #24c66f;
    color: #fff;
}

.seminar-attendance-card.is-attended:hover {
    background: #106c3a;
}

.seminar-attendance-card:disabled {
    cursor: not-allowed;
    opacity: .6;
    transform: none;
}

.seminar-attendance-card i {
    font-size: 1.5rem;
}

@media (max-width: 575.98px) {
    .seminar-attendance-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Wählbare Hauptnavigation */
.crm-navbar-inner { min-height: 64px; gap: .75rem; }
.crm-top-navigation { flex-grow: 1; }
.crm-navbar-utilities { margin-left: auto; }
.crm-app-shell-side {
    display: grid;
    grid-template-columns: 235px minmax(0, 1fr);
    min-height: calc(100vh - 64px);
}
.crm-side-navigation {
    background: var(--bs-tertiary-bg);
    border-right: 1px solid var(--bs-border-color);
    padding: 1.25rem .85rem;
}
.crm-side-navigation-list { display: grid; gap: .4rem; }
.crm-side-navigation-link {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-height: 44px;
    padding: .7rem .85rem;
    border: 1px solid transparent;
    border-radius: .65rem;
    color: var(--bs-body-color);
    font-weight: 650;
    text-decoration: none;
}
.crm-side-navigation-link i { width: 1.25rem; text-align: center; color: var(--bs-info); }
.crm-side-navigation-link:hover { background: var(--bs-secondary-bg); color: var(--bs-body-color); }
.crm-side-navigation-link.active { background: color-mix(in srgb, var(--bs-info) 16%, transparent); border-color: var(--bs-info); }
.crm-main-content { min-width: 0; padding-inline: clamp(1rem, 2.2vw, 2.25rem); }

.navigation-layout-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.navigation-layout-option { position: relative; display: grid; gap: .45rem; padding: 1rem; border: 1px solid var(--bs-border-color); border-radius: .8rem; cursor: pointer; }
.navigation-layout-option:has(input:checked), .navigation-layout-option.is-selected { border-color: var(--bs-info); box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-info) 18%, transparent); }
.navigation-layout-option input { position: absolute; top: .85rem; right: .85rem; }
.navigation-layout-option small { color: var(--bs-secondary-color); }
.navigation-layout-preview { display: grid; width: 150px; height: 80px; border: 1px solid var(--bs-border-color); border-radius: .45rem; overflow: hidden; background: var(--bs-body-bg); }
.navigation-layout-preview.is-top { grid-template-rows: 18px 1fr; }
.navigation-layout-preview.is-side { grid-template-columns: 32px 1fr; }
.navigation-layout-preview i { background: var(--bs-info); opacity: .8; }
.navigation-layout-preview b { background: var(--bs-secondary-bg); }

@media (max-width: 991.98px) {
    .crm-navbar-utilities { margin-left: 0; }
    .crm-app-shell-side { display: block; }
    .crm-side-navigation { border-right: 0; border-bottom: 1px solid var(--bs-border-color); }
    .crm-top-navigation { width: 100%; order: 4; padding-block: .75rem; }
}
@media (max-width: 575.98px) {
    .navigation-layout-options { grid-template-columns: 1fr; }
    .crm-navbar-utilities .btn-danger { padding-inline: .55rem; }
}