/* Shared compact UI layer for the new Traeger-facing pages. */

/* Sticky-footer layout — moved here from footer.blade.php inline <style> so
   body flex is applied render-blocking (before first paint) and never causes
   a mid-render layout shift that makes the navbar jump in height. */
body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.wrapper {
    flex: 1 0 auto;
    min-height: 0;
}
.wrapper > .content,
.wrapper main.content {
    min-height: 0;
}

.pba-compact-page-wrap.container-fluid {
    padding-left: 2px;
    padding-right: 6px;
}

.pba-compact-page.message-hub {
    gap: 6px;
}

.pba-compact-page .message-hub-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.06);
    margin-bottom: 12px;
}

.pba-compact-page .message-hub-hero h2 {
    margin: 0;
    font-size: 28px;
    line-height: 1.2;
}

.pba-compact-page .message-hub-hero-copy {
    min-width: 0;
    flex: 1;
}

.pba-compact-page .message-hub-hero:has(.message-hub-hero-tabs:not(:empty)) {
    align-items: flex-end;
}

.pba-compact-page .message-hub-hero:has(.message-hub-hero-tabs:not(:empty)) h2 {
    margin-bottom: 12px;
}

.pba-compact-page .message-hub-hero-copy p {
    margin: 4px 0 0;
    font-size: 15px;
    line-height: 1.4;
}

.pba-compact-page .message-hub-hero-nav {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 6px;
}

.pba-compact-page .message-hub-hero-tabs {
    flex: 1;
    min-width: 0;
}

.pba-compact-page .message-hub-hero-tabs .nav {
    margin-bottom: 0 !important;
    flex-wrap: nowrap;
}

.pba-compact-page .message-hub-export-btn {
    flex-shrink: 0;
    white-space: nowrap;
    border-radius: 999px !important;
    padding: 0.3rem 1rem !important;
    font-size: 14px !important;
    font-weight: 600;
    letter-spacing: 0.01em;
    background: var(--pba-accent, #1c5224) !important;
    color: var(--pba-accent-contrast, #fff) !important;
    border: none !important;
    box-shadow: 0 2px 10px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.38), 0 1px 3px rgba(0, 0, 0, 0.1);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.pba-compact-page .message-hub-export-btn:hover {
    transform: translateY(-1px);
    filter: brightness(1.1);
    box-shadow: 0 4px 16px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.48), 0 2px 5px rgba(0, 0, 0, 0.1);
    color: var(--pba-accent-contrast, #fff) !important;
}

.pba-compact-page .message-hub-export-btn:active {
    transform: translateY(0);
    filter: brightness(0.94);
    box-shadow: 0 1px 4px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.3);
}

.pba-compact-page .message-hub-help {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 999px;
    background: #eef2f7;
    color: #334155;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
    transition: transform 0.16s ease, background-color 0.16s ease, color 0.16s ease;
}

.pba-compact-page .message-hub-help:hover {
    transform: translateY(-1px);
    background: #e2e8f0;
    color: #0f172a;
}

.pba-compact-page .message-hub-help:focus,
.pba-compact-page .message-hub-help:focus-visible {
    outline: none;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06), 0 0 0 3px rgba(51, 65, 85, 0.12);
}

.pba-compact-page .message-hub-main {
    padding: 18px;
    border-radius: 12px;
}

.pba-compact-page .message-tab-nav {
    margin-bottom: 16px;
}

.pba-compact-page .dx-datagrid .badge {
    border-radius: 0.25rem;
}

/* Guided Tour (Shepherd) - PBA design system */

/* Stacking context for Bootstrap modal compatibility:
   Bootstrap backdrop: 1050 → Shepherd overlay: 1051 → Bootstrap modal: 1055 → Shepherd tooltip: 1070
   With overlay at 1051 (below Bootstrap modal at 1055) the whole modal dialog is visible above the
   dim layer, so steps targeting modal elements work without hiding the modal's own content.
   The tooltip at 1070 sits above the modal (1055) and Bootstrap popovers (also 1070 — fine). */
.shepherd-modal-overlay-container {
    z-index: 1051 !important;
}

.shepherd-element.pba-tour-step {
    max-width: min(420px, calc(100vw - 32px));
    border-radius: 16px !important;
    z-index: 1070 !important;
}

.shepherd-element.pba-tour-step .shepherd-content {
    border-radius: 16px !important;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #ffffff;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.16);
    color: #0f172a;
    overflow: hidden;
}

.shepherd-element.pba-tour-step .shepherd-arrow {
    color: #ffffff !important;
    background-color: transparent !important;
}

.shepherd-element.pba-tour-step .shepherd-arrow:before {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
}

.shepherd-element.pba-tour-step .shepherd-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 10px;
    background: #ffffff;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.shepherd-element.pba-tour-step .shepherd-title {
    margin: 0;
    font-size: 17px;
    line-height: 1.3;
    font-weight: 700;
    color: #0f172a;
}

.shepherd-element.pba-tour-step .shepherd-text {
    padding: 12px 16px 14px;
    font-size: 14px;
    line-height: 1.55;
    color: #334155;
}

.shepherd-element.pba-tour-step .shepherd-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 16px 14px;
}

.shepherd-element.pba-tour-step .shepherd-cancel-icon {
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: 0;
    background: #eef2f7;
    color: #475569;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.16s ease, background-color 0.16s ease, color 0.16s ease;
}

.shepherd-element.pba-tour-step .shepherd-cancel-icon:hover {
    background: #e2e8f0;
    color: #0f172a;
    transform: translateY(-1px);
}

.shepherd-element.pba-tour-step .shepherd-cancel-icon:focus,
.shepherd-element.pba-tour-step .shepherd-cancel-icon:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-tour-accent-rgb, var(--pba-accent-rgb, 28, 82, 36)), 0.18);
}

.shepherd-element.pba-tour-step .shepherd-button,
.shepherd-element.pba-tour-step .pba-tour-btn {
    border-radius: 8px;
    border: 1px solid transparent;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    min-height: 34px;
    padding: 9px 14px;
    transition: transform 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease, color 0.16s ease;
}

.shepherd-element.pba-tour-step .pba-tour-btn-primary,
.shepherd-element.pba-tour-step .shepherd-button:not(.pba-tour-btn-secondary) {
    background: var(--pba-tour-accent, var(--pba-accent, #1c5224));
    border-color: var(--pba-tour-accent, var(--pba-accent, #1c5224));
    color: #ffffff;
}

.shepherd-element.pba-tour-step .pba-tour-btn-primary:hover,
.shepherd-element.pba-tour-step .shepherd-button:not(.pba-tour-btn-secondary):hover {
    filter: brightness(0.96);
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(var(--pba-tour-accent-rgb, var(--pba-accent-rgb, 28, 82, 36)), 0.28);
}

.shepherd-element.pba-tour-step .pba-tour-btn-secondary {
    background: #ffffff;
    border-color: rgba(15, 23, 42, 0.16);
    color: #334155;
}

.shepherd-element.pba-tour-step .pba-tour-btn-secondary:hover {
    background: #f8fafc;
    color: #0f172a;
    transform: translateY(-1px);
}

.shepherd-element.pba-tour-step .shepherd-button:focus,
.shepherd-element.pba-tour-step .shepherd-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-tour-accent-rgb, var(--pba-accent-rgb, 28, 82, 36)), 0.2);
}

.shepherd-element.pba-tour-step.shepherd-has-arrow[data-popper-placement^='top'] .shepherd-arrow:before {
    border-top-color: #ffffff !important;
}

.shepherd-element.pba-tour-step.shepherd-has-arrow[data-popper-placement^='bottom'] .shepherd-arrow:before {
    border-bottom-color: #ffffff !important;
}

.shepherd-element.pba-tour-step.shepherd-has-arrow[data-popper-placement^='left'] .shepherd-arrow:before {
    border-left-color: #ffffff !important;
}

.shepherd-element.pba-tour-step.shepherd-has-arrow[data-popper-placement^='right'] .shepherd-arrow:before {
    border-right-color: #ffffff !important;
}

/* Generic highlight for active tour target (all modules/pages). */
.pba-tour-target-highlight,
.pba-tour-target-highlight.shepherd-target.shepherd-enabled {
    border-radius: 10px !important;
    box-shadow:
        0 0 0 2px rgba(255, 255, 255, 0.92),
        0 0 0 4px rgba(37, 99, 235, 0.42) !important;
}

body.pba-tour-preview-finished > *:not(#pba-tour-preview-complete-overlay) {
    filter: blur(5px);
    pointer-events: none !important;
    user-select: none;
}

#pba-tour-preview-complete-overlay {
    position: fixed;
    inset: 0;
    z-index: 200000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

#pba-tour-preview-complete-overlay.is-visible {
    display: flex;
}

.pba-tour-preview-complete-card {
    width: min(520px, calc(100vw - 36px));
    border-radius: 14px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: #ffffff;
    box-shadow: 0 20px 50px rgba(2, 6, 23, 0.25);
    padding: 20px 20px 16px;
    text-align: center;
}

.pba-tour-preview-complete-card h3 {
    margin: 0 0 8px;
    font-size: 22px;
    font-weight: 700;
    color: #0f172a;
}

.pba-tour-preview-complete-card p {
    margin: 0 0 14px;
    color: #475569;
    font-size: 14px;
    line-height: 1.45;
}

.pba-tour-preview-complete-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.pba-tour-preview-btn {
    border-radius: 8px;
    height: 36px;
    font-size: 14px;
    font-weight: 600;
    border: 1px solid transparent;
    cursor: pointer;
}

.pba-tour-preview-btn-primary {
    background: #0d6efd;
    color: #fff;
}

.pba-tour-preview-btn-secondary {
    background: #0f172a;
    color: #fff;
}

.pba-tour-preview-btn-ghost {
    background: #fff;
    border-color: #cbd5e1;
    color: #334155;
}

/* Warning banner shown inside a step when the target element was not found (preview mode only) */
.pba-tour-element-missing {
    margin: 0 0 10px;
    padding: 8px 10px;
    border-radius: 6px;
    background: #fef9c3;
    border: 1px solid #fde047;
    color: #713f12;
    font-size: 12px;
    line-height: 1.4;
}
.pba-tour-element-missing code {
    display: inline-block;
    margin-top: 2px;
    padding: 1px 4px;
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.06);
    font-family: ui-monospace, monospace;
    font-size: 11px;
    word-break: break-all;
}

/* Air-style highlight for selected dashboard tour targets */
[data-tour="dashboard-filters"].shepherd-target.shepherd-enabled,
[data-tour="dashboard-current-assignments"].shepherd-target.shepherd-enabled {
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.10);
}

[data-tour="dashboard-filters"].shepherd-target.shepherd-enabled {
    padding: 10px 12px;
}

[data-tour="dashboard-current-assignments"].shepherd-target.shepherd-enabled {
    padding: 8px;
}

.pba-single-column-layout {
    grid-template-columns: minmax(0, 1fr) !important;
}

.pba-settings-pane {
    display: grid;
    gap: 14px;
}

.pba-settings-card {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #fff;
    padding: 16px 18px;
}

.pba-settings-card-title {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

.pba-settings-card-note {
    margin: 0 0 14px;
    font-size: 13px;
    color: #64748b;
}

.pba-settings-card .form-group:last-child {
    margin-bottom: 0;
}

.pba-settings-card .col-form-label {
    color: #475569;
    font-weight: 600;
}

.pba-settings-card .form-control {
    border-radius: 7px;
    border-color: rgba(15, 23, 42, 0.12);
    box-shadow: none;
}

.pba-settings-card .form-control:focus {
    border-color: rgba(51, 65, 85, 0.35);
    box-shadow: 0 0 0 3px rgba(51, 65, 85, 0.08);
}

.pba-settings-card .border.rounded.p-3.bg-light {
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    padding: 14px 16px !important;
}

.pba-settings-card img {
    border-radius: 6px;
}

.pba-settings-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.pba-soft-modal .modal-content {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.14);
    overflow: hidden;
    background: #fff;
}

.pba-soft-modal .modal-header {
    padding: 18px 22px 14px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #fff;
    align-items: center;
}

.pba-soft-modal .modal-header h5,
.pba-soft-modal .modal-title {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: #0f172a;
}

.pba-soft-modal .modal-header small {
    margin-left: 6px;
    font-size: 13px;
    color: #64748b !important;
}

.pba-soft-modal .modal-body {
    padding: 20px 22px;
    background: #fff;
}

.pba-soft-modal .modal-footer {
    padding: 14px 22px 20px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    background: #fff;
    gap: 8px;
}

.pba-soft-modal .form-control,
.pba-soft-modal .custom-select,
.pba-soft-modal select.form-control,
.pba-soft-modal textarea.form-control {
    border-radius: 7px;
    border-color: rgba(15, 23, 42, 0.12);
    box-shadow: none;
}

.pba-soft-modal .form-control:focus,
.pba-soft-modal .custom-select:focus,
.pba-soft-modal select.form-control:focus,
.pba-soft-modal textarea.form-control:focus {
    border-color: rgba(51, 65, 85, 0.35);
    box-shadow: 0 0 0 3px rgba(51, 65, 85, 0.08);
}

/* Datums-/Zeit-Felder: internen Text vertikal mittig (Webkit zentriert ihn sonst nicht). */
input[type="date"].form-control::-webkit-datetime-edit,
input[type="time"].form-control::-webkit-datetime-edit,
input[type="datetime-local"].form-control::-webkit-datetime-edit {
    padding-top: 0;
    padding-bottom: 0;
}

/* --------------------------------------------------------------------------
   Dropdown-Pfeil bekommt einen eigenen, klar abgetrennten "Kasten".
   Vorher lief langer Optionstext bis in den Pfeil hinein (der Pfeil ist nur
   ein Hintergrundbild -> Text darueber). Jetzt: einheitlicher Pfeil rechts in
   einer eigenen Mini-Box, davor wird der Text sauber mit "…" abgeschnitten.
   Gilt global fuer alle einzeiligen Select-Felder (Bootstrap .custom-select,
   native select.form-control(-sm) und .form-select). Mehrfach-Auswahl und
   Listboxen (multiple/size) bleiben unangetastet. */
select.form-control:not([multiple]):not([size]),
select.form-control-sm:not([multiple]):not([size]),
select.form-select:not([multiple]):not([size]),
select.custom-select:not([multiple]):not([size]),
.custom-select:not([multiple]):not([size]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* Platz fuer den Pfeil-Kasten reservieren */
    padding-right: 2.2rem !important;
    /* langen Text VOR dem Kasten abschneiden statt ihn zu ueberlagern */
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    /* Ebene 1: Pfeil-Chevron  |  Ebene 2: abgesetzte Mini-Box mit Trennlinie */
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"),
        linear-gradient(to right,
            rgba(15, 23, 42, 0) calc(100% - 1.75rem),
            rgba(15, 23, 42, 0.12) calc(100% - 1.75rem),
            rgba(15, 23, 42, 0.12) calc(100% - 1.75rem + 1px),
            rgba(15, 23, 42, 0.05) calc(100% - 1.75rem + 1px),
            rgba(15, 23, 42, 0.05) 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: right 0.55rem center, right center;
    background-size: 12px 12px, 100% 100%;
}

/* IE/Edge-Legacy: nativen Pfeil ausblenden, damit kein Doppelpfeil entsteht. */
select.form-control:not([multiple])::-ms-expand,
select.custom-select:not([multiple])::-ms-expand,
.custom-select:not([multiple])::-ms-expand {
    display: none;
}

.pba-masterdata-page .message-hub-main {
    padding: 16px 18px;
}

.dx-toolbar .pba-grid-toolbar-btn.dx-button {
    border-radius: 0.35rem;
    height: 38px;
    min-height: 38px;
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    box-shadow: none;
    opacity: 0.9;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.dx-toolbar .pba-grid-toolbar-btn.dx-button .dx-button-content {
    height: 100%;
    padding: 0.375rem 0.75rem;
    display: inline-flex;
    align-items: center;
}

.dx-toolbar .pba-grid-toolbar-btn.dx-button .dx-icon,
.dx-toolbar .pba-grid-toolbar-btn.dx-button .dx-button-text {
    color: var(--pba-accent, var(--connie-orange)) !important;
}

.dx-toolbar .pba-grid-toolbar-btn.dx-button.dx-state-hover,
.dx-toolbar .pba-grid-toolbar-btn.dx-button:hover {
    transform: translateY(-1px);
    opacity: 1;
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.dx-toolbar .pba-grid-toolbar-btn.dx-button.dx-state-hover .dx-icon,
.dx-toolbar .pba-grid-toolbar-btn.dx-button.dx-state-hover .dx-button-text,
.dx-toolbar .pba-grid-toolbar-btn.dx-button:hover .dx-icon,
.dx-toolbar .pba-grid-toolbar-btn.dx-button:hover .dx-button-text {
    color: #fff !important;
}

.dx-toolbar .pba-grid-toolbar-btn.dx-button.dx-state-focused,
.dx-toolbar .pba-grid-toolbar-btn.dx-button:focus {
    box-shadow: none;
}

.pba-db-parent-tabs .highlight {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px !important;
    padding-left: 0;
}

.pba-db-parent-tabs .highlight > xli,
.pba-db-parent-tabs .highlight > .nav-item {
    list-style: none;
}

.pba-db-parent-tabs .btn-menu,
.pba-db-parent-tabs .btn-outline-menu {
    border-radius: 999px !important;
    min-height: 34px;
    padding: 0.3rem 1rem !important;
    font-size: 14px !important;
    font-weight: 600;
    margin-right: 0 !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.pba-db-parent-tabs .btn-outline-menu {
    color: var(--pba-accent, var(--connie-orange)) !important;
    background: #fff !important;
}

.pba-db-parent-tabs .btn-menu {
    --connie-info: var(--pba-accent-contrast, #fff);
    color: var(--pba-accent-contrast, #fff) !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    border-bottom: 1px solid var(--pba-accent, var(--connie-orange)) !important;
}

.pba-db-parent-tabs .btn-outline-menu:hover,
.pba-db-parent-tabs .btn-menu:hover {
    transform: translateY(-1px);
}

.pba-db-parent-tabs .btn-outline-menu:hover {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
}

.pba-db-parent-tabs .btn-menu:hover {
    filter: brightness(0.94);
}

.pba-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

.pba-status-pill.is-success {
    background: rgba(34, 197, 94, 0.14);
    color: #15803d;
}

.pba-status-pill.is-muted {
    background: #eef2f7;
    color: #475569;
}

.pba-color-swatch {
    display: inline-flex;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: var(--swatch-color, #cbd5e1);
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08);
}

.pba-color-value {
    font-family: Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 13px;
    color: #475569;
}

.pba-modal-form-grid {
    display: grid;
    gap: 14px;
}

.pba-modal-form-grid .form-group {
    margin-bottom: 0;
}

.pba-modal-form-grid label {
    display: block;
    margin-bottom: 6px;
    color: #475569;
    font-weight: 500;
}

/* Switch-Labels nicht vom Grid-Label-Stil verzerren lassen
   (sonst stimmen Position/Proportionen des Toggles nicht). */
.pba-modal-form-grid .custom-control-label {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
}

.pba-modal-form-grid .pba-grid-span-2 {
    grid-column: 1 / -1;
}

.pba-tagestypen-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pba-tagestypen-form .pba-color-input {
    height: 44px;
    padding: 6px;
}

.pba-status-pill.is-primary {
    background: rgba(var(--pba-accent-rgb, 28, 82, 36), 0.14);
    color: var(--pba-accent, var(--connie-orange));
}

.pba-ausbildungsjahre-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pba-inline-settings-card {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 10px;
    background: #f8fafc;
    padding: 14px 16px;
}

.pba-inline-settings-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.pba-form-check {
    margin-bottom: 0;
}

.pba-ausbildungsjahre-calendar-modal .modal-dialog {
    max-width: min(1320px, calc(100vw - 32px));
}

.pba-ausbildungsjahre-calendar-header {
    align-items: center;
}

.pba-ausbildungsjahre-calendar-header .modal-title span {
    color: #64748b;
    font-weight: 600;
}

.pba-ausbildungsjahre-calendar-body {
    padding-top: 12px;
}

.wrapper,
#content {
    background: #ffffff;
}

#sidebar {
    --sidebar-width: 272px;
    --sidebar-width-collapsed: 88px;
    --sidebar-menu-text: var(--pba-sidebar-accent-strong, #334155);
    --sidebar-menu-active: var(--pba-sidebar-accent-strong, #0f172a);
    width: var(--sidebar-width);
    min-width: var(--sidebar-width);
    transition: none;
    color: var(--sidebar-menu-text);
    position: relative;
    z-index: 2;
    min-height: 100vh;
    background: transparent;
    padding: 8px 2px 8px 8px;
    margin-top: 0;
    flex-shrink: 0;
    flex-grow: 0;
}

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

#sidebar .sidebar-shell {
    height: auto;
    max-height: none;
    padding: 12px 10px;
    border-radius: 15px;
    border: 1px solid rgba(255, 255, 255, 0.55);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.96) 100%);
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.55);
    overflow: visible;
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: sticky;
    top: 18px;
    opacity: 1;
    transform: translateX(0) scale(1);
    transition: padding 0.18s ease, border-radius 0.18s ease, box-shadow 0.18s ease, opacity 0.14s ease, transform 0.18s ease;
}

#sidebar.sidebar-animating .sidebar-shell {
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
    opacity: 0;
    transform: translateX(-6px) scale(0.985);
}

#sidebar.sidebar-animating #sidebar-nav {
    opacity: 0;
    pointer-events: none;
}

#sidebar-nav {
    flex: 0 0 auto;
    min-height: 0;
    overflow-y: visible;
    padding-right: 0;
    overflow-x: hidden;
    opacity: 1;
    transition: opacity 0.16s ease;
}

#sidebar-nav::-webkit-scrollbar {
    width: 8px;
}

#sidebar-nav::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, 0.25);
    border-radius: 999px;
}

#sidebar.collapsed .sidebar-shell {
    padding-left: 8px;
    padding-right: 8px;
}

#sidebar.collapsed .dx-accordion-item-title {
    padding-left: 0;
    padding-right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
}

#sidebar.collapsed .dx-accordion-item-title .nav-item {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    min-height: 40px;
}

#sidebar.collapsed .dx-accordion-item-opened > .dx-accordion-item-title::before,
#sidebar.collapsed .dx-accordion-item-closed > .dx-accordion-item-title::before,
#sidebar.collapsed .dx-accordion-item > .dx-accordion-item-title::before,
#sidebar.collapsed .dx-accordion-item > .dx-accordion-item-title::after {
    content: none !important;
    display: none !important;
}

#sidebar.collapsed .nav-item {
    justify-content: center;
    padding-left: 6px;
    padding-right: 6px;
    gap: 0;
}

#sidebar.collapsed .dx-accordion-item-body .nav-item:hover,
#sidebar.collapsed .dx-accordion-item-body .nav-item.active {
    background: transparent;
    box-shadow: none;
}

#sidebar.collapsed .dx-accordion-item-body .nav-item {
    margin-left: 0;
    width: 100%;
    justify-content: center;
    gap: 0;
    padding-left: 0;
    padding-right: 0;
    padding-top: 6px;
    padding-bottom: 6px;
}

#sidebar .nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    cursor: pointer;
    user-select: none;
    margin-top: 2px;
    color: var(--sidebar-menu-text);
    border-radius: 18px;
    overflow: hidden;
    transition: background-color 0.16s ease, color 0.16s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

#sidebar .nav-item:hover {
    background: rgba(var(--pba-sidebar-accent-rgb, 28, 82, 36), 0.10);
    color: var(--sidebar-menu-active);
    transform: translateY(-1px);
}

#sidebar .nav-item.active {
    font-weight: 700;
    color: var(--sidebar-menu-active);
    background: rgba(var(--pba-sidebar-accent-rgb, 28, 82, 36), 0.14);
    box-shadow: inset 0 0 0 1px rgba(var(--pba-sidebar-accent-rgb, 28, 82, 36), 0.12);
}

#sidebar .dx-accordion-item-body .nav-item {
    margin-left: 4px;
    gap: 10px;
    padding: 6px 8px;
    margin-bottom: 2px;
    border-radius: 14px;
}

#sidebar .dx-accordion-item-body .nav-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    border-radius: 8px;
    font-size: 13px;
}

#sidebar .dx-accordion-item-body .nav-text {
    font-size: 14px;
    line-height: 1.15;
}

#sidebar .nav-icon {
    width: 30px;
    height: 30px;
    min-width: 30px;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--pba-sidebar-accent-soft, #eef2f7);
    color: var(--pba-sidebar-accent-strong, #334155);
    transform: scale(1);
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

#sidebar .nav-item.active .nav-icon,
#sidebar .nav-item:hover .nav-icon {
    background: rgba(var(--pba-sidebar-accent-rgb, 28, 82, 36), 0.14);
    color: var(--pba-sidebar-accent-strong, #0f172a);
}

#sidebar .group-icon {
    gap: 0;
}

#sidebar .group-icon .sidebar-group-symbol {
    display: none;
}

#sidebar .group-icon .sidebar-group-chevron {
    font-size: 10px;
    color: var(--pba-sidebar-accent-strong, #64748b);
    transform: rotate(0deg);
    transition: transform 0.18s ease, color 0.18s ease;
}

#sidebar .dx-accordion-item-opened > .dx-accordion-item-title .sidebar-group-chevron {
    transform: rotate(90deg);
    color: var(--pba-sidebar-accent-strong, #0f172a);
}

#sidebar.collapsed .group-icon .sidebar-group-symbol {
    display: inline-flex;
}

#sidebar.collapsed .group-icon .sidebar-group-chevron {
    display: none;
}

#sidebar .nav-text {
    min-width: 0;
    line-height: 1.2;
    font-size: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#sidebar.collapsed .nav-text {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    margin: 0 !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.sidebar-group-title {
    font-weight: 700;
    color: var(--pba-sidebar-accent-strong, #0f172a);
}

#sidebar.collapsed .nav-icon {
    transform: scale(1.02);
}

#sidebar.collapsed .dx-accordion-item-body .nav-item:hover .nav-icon,
#sidebar.collapsed .dx-accordion-item-body .nav-item.active .nav-icon {
    background: transparent;
    box-shadow: none;
    color: var(--pba-sidebar-accent-strong, var(--connie-orange));
}

#sidebar.collapsed .dx-accordion-item-body .nav-icon {
    margin: 0 auto;
    background: transparent;
    box-shadow: none;
}

#sidebar.collapsed #sidebar-nav .dx-accordion-item-body {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#sidebar .dx-widget {
    font-family: inherit !important;
}

#sidebar .dx-accordion-item-title {
    font-size: 13px !important;
    color: var(--sidebar-menu-text) !important;
    background-color: transparent !important;
    padding: 3px 0 !important;
}

#sidebar .dx-accordion-item {
    border: 0 !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
    background-color: transparent !important;
    margin-bottom: 2px;
}

#sidebar-nav .dx-accordion,
#sidebar-nav .dx-accordion-item,
#sidebar-nav .dx-accordion-item-opened,
#sidebar-nav .dx-accordion-item-closed,
#sidebar-nav .dx-accordion-item.dx-item-selected,
#sidebar-nav .dx-accordion-item.dx-state-hover,
#sidebar-nav .dx-accordion-item.dx-state-focused,
#sidebar-nav .dx-accordion-item.dx-state-active,
#sidebar-nav .dx-item,
#sidebar-nav .dx-item-content,
#sidebar-nav .dx-accordion-item-title,
#sidebar-nav .dx-accordion-item-body {
    background-color: transparent !important;
}

#sidebar-nav .dx-accordion-item.dx-item-selected .dx-accordion-item-title,
#sidebar-nav .dx-accordion-item.dx-state-hover .dx-accordion-item-title,
#sidebar-nav .dx-accordion-item.dx-state-focused .dx-accordion-item-title {
    color: var(--sidebar-menu-active) !important;
}

#sidebar-nav .dx-accordion-item-title::before,
#sidebar-nav .dx-accordion-item-title::after {
    display: none !important;
    content: none !important;
}

#sidebar-nav .dx-accordion-item-body {
    padding: 2px 0 6px !important;
}

@media (max-width: 767.98px) {
    .pba-settings-actions {
        flex-direction: column-reverse;
    }

    .pba-settings-actions .btn {
        width: 100%;
    }

    .pba-tagestypen-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .pba-ausbildungsjahre-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .pba-modal-form-grid .pba-grid-span-2 {
        grid-column: auto;
    }
}

/* Einsaetze pages */

.einsatz-beratungsstelle-details {
    width: 100%;
}

.einsatz-beratungsstelle-details summary {
    list-style-position: inside;
}

.einsatz-beratungsstelle-summary {
    display: inline-block;
    max-width: calc(100% - 18px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
}

.einsatz-beratungsstelle-details[open] .einsatz-beratungsstelle-summary {
    max-width: none;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}

.einsatz-beratungsstelle-wrap {
    white-space: normal;
    word-break: break-word;
    display: block;
    line-height: 1.2;
}

.einsaetze-traeger-page .message-hub-main > div[class$="-container"],
.einsaetze-role-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.einsaetze-role-page .customarea h4,
.einsaetze-role-page .einsaetze-page-toolbar {
    display: none;
}

.tb-traeger-page-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.tb-traeger-page-nav-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.tb-traeger-page-nav-row .message-tab-nav {
    margin-bottom: 0;
}

.tb-traeger-page-nav-row .tb-traeger-page-toolbar {
    margin-bottom: 0;
}

.tb-traeger-page-toolbar .tb-traeger-top-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-radius: 0.35rem;
    min-height: 38px;
    box-shadow: none;
    opacity: 0.9;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.tb-traeger-page-toolbar .tb-traeger-top-btn:hover,
.tb-traeger-page-toolbar .tb-traeger-top-btn:focus {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button {
    border-radius: 0.35rem;
    height: 38px;
    min-height: 38px;
    box-shadow: none;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button .dx-button-content,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button .dx-button-content {
    height: 100%;
    padding: 0.375rem 0.75rem;
    display: inline-flex;
    align-items: center;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.dx-state-hover,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button:hover,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button.dx-state-hover,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button:hover {
    transform: translateY(-1px);
    opacity: 1;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.dx-state-focused,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button:focus,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button.dx-state-focused,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button:focus {
    box-shadow: none;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-primary {
    color: #fff !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-primary .dx-icon,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-primary .dx-button-text {
    color: #fff !important;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    opacity: 0.9;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary .dx-icon,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary .dx-button-text,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button .dx-icon,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button .dx-button-text {
    color: var(--pba-accent, var(--connie-orange)) !important;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary.dx-state-hover,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary:hover,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button.dx-state-hover,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button:hover {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary.dx-state-hover .dx-icon,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary.dx-state-hover .dx-button-text,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary:hover .dx-icon,
.einsaetze-role-page .dx-toolbar .einsaetze-filter-toolbar-btn.dx-button.is-secondary:hover .dx-button-text,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button.dx-state-hover .dx-icon,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button.dx-state-hover .dx-button-text,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button:hover .dx-icon,
.einsaetze-traeger-page .dx-toolbar .einsatzplanung-toolbar-btn.dx-button:hover .dx-button-text {
    color: #fff !important;
}

#modal-edit-einsatz .modal-dialog,
#modal-beratungsstelledaten .modal-dialog,
#modal-taetigkeitsbericht-submit-confirm .modal-dialog,
#modal-azubi-report-sign.pba-soft-modal .modal-dialog {
    max-width: 620px;
}

#modal-edit-einsatz .form-group:last-child {
    margin-bottom: 0;
}

#modal-edit-taetigkeitsbericht .tb-input {
    font-size: 1rem;
    padding: 0.45rem 0.6rem;
}

#modal-edit-taetigkeitsbericht .tb-table,
#beratungsstelledaten-table,
#modal-view-taetigkeitsbericht .table {
    margin-bottom: 0 !important;
}

#modal-edit-taetigkeitsbericht .tb-table th,
#modal-edit-taetigkeitsbericht .tb-table td {
    vertical-align: middle;
}

#modal-edit-taetigkeitsbericht .table-responsive,
#modal-beratungsstelledaten #beratungsstelledaten-table,
#modal-view-taetigkeitsbericht .table-responsive {
    border: 1px solid rgba(15, 23, 42, 0.08);
    overflow: hidden;
    background: #f8fafc;
}

#modal-edit-taetigkeitsbericht .table-responsive,
#modal-beratungsstelledaten #beratungsstelledaten-table {
    border-radius: 18px;
}

#modal-view-taetigkeitsbericht .table-responsive,
#tb-view-remark-container,
#tb-view-remark-input,
#modal-tb-signature .border.rounded,
#modal-sign-request .border.rounded,
#modal-azubi-report-sign .border.rounded {
    border-radius: 9px;
}

#modal-edit-taetigkeitsbericht .tb-table thead th,
#modal-view-taetigkeitsbericht .table thead th,
#beratungsstelledaten-table th {
    padding: 12px 14px;
    border-top: 0;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.01em;
}

#beratungsstelledaten-table th {
    text-transform: uppercase;
}

#modal-edit-taetigkeitsbericht .tb-table tbody td,
#modal-view-taetigkeitsbericht .table tbody td,
#beratungsstelledaten-table td {
    padding: 12px 14px;
    border-top-color: rgba(15, 23, 42, 0.06);
    color: #0f172a;
    background: #fff;
}

#modal-edit-taetigkeitsbericht .tb-sort-date {
    color: #475569;
    font-weight: 700;
    text-decoration: none;
}

#modal-edit-taetigkeitsbericht .tb-sort-date:hover {
    color: #0f172a;
    text-decoration: none;
}

#tb-edit-remark-container,
#tb-view-remark-container,
#tb-view-remark-input {
    padding: 14px 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
}

#tb-edit-remark-container,
#beratungsstelledaten-empty {
    border-radius: 18px;
}

#tb-view-remark-text {
    color: #334155 !important;
}

#modal-view-taetigkeitsbericht .modal-dialog {
    max-width: 920px;
}

#modal-view-taetigkeitsbericht .tb-view-status {
    font-size: 0.9rem;
    padding: 0.42em 0.72em;
    border-radius: 0.375rem;
}

#modal-view-status-hint,
#tb-view-status-hint {
    color: #64748b !important;
    font-size: 13px;
}

#modal-tb-signature .border.rounded,
#modal-sign-request .border.rounded,
#modal-azubi-report-sign .border.rounded {
    border-color: rgba(15, 23, 42, 0.08) !important;
    background: #fff !important;
}

#modal-tb-signature .form-check,
#modal-sign-request .form-check {
    margin-bottom: 0.4rem;
}

#modal-sign-request ul {
    margin-bottom: 0;
}

#modal-tb-signature img,
#modal-azubi-report-sign img {
    display: block;
    border-radius: 6px;
}

#modal-edit-taetigkeitsbericht #tb-add-row {
    margin-top: 10px;
    border-radius: 9px;
}

#beratungsstelledaten-empty {
    border-color: rgba(15, 23, 42, 0.08);
    background: #f8fafc;
    color: #475569;
}

#beratungsstelledaten-map-btn,
#beratungsstelledaten-email-btn,
#beratungsstelledaten-telefon-btn {
    border-radius: 999px;
}

#modal-edit-taetigkeitsbericht .modal-dialog {
    width: 90vw !important;
    max-width: 1400px !important;
    margin: 1.5rem auto !important;
}

#modal-edit-taetigkeitsbericht.modal .modal-dialog {
    display: flex;
    justify-content: center;
}

#modal-edit-taetigkeitsbericht .modal-content {
    width: 100%;
}

#modal-taetigkeitsbericht-submit-confirm + .modal-backdrop {
    opacity: 0.5;
}

.tb-azubi-page .message-chip.message-chip-danger {
    background: #ef4444;
    color: #fff;
}

.tb-action-menu,
.tb-beratungsstelle-action-menu {
    display: inline-flex;
    justify-content: center;
    width: auto;
    min-width: 0;
}

#TaetigkeitsberichteAktivcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteNiocontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteArchivcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleTodocontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleUeberfaelligcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleFehlercontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleArchivcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteAktivcontainer .dx-datagrid-headers .dx-header-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteNiocontainer .dx-datagrid-headers .dx-header-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteArchivcontainer .dx-datagrid-headers .dx-header-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleTodocontainer .dx-datagrid-headers .dx-header-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleUeberfaelligcontainer .dx-datagrid-headers .dx-header-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleFehlercontainer .dx-datagrid-headers .dx-header-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteBeratungsstelleArchivcontainer .dx-datagrid-headers .dx-header-row > td:last-child:not(.dx-pointer-events-none) {
    padding-left: 6px !important;
    padding-right: 6px !important;
    text-align: center;
}

#TaetigkeitsberichteAktivcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteNiocontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none),
#TaetigkeitsberichteArchivcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none) {
    overflow: visible;
}

#TaetigkeitsberichteAktivcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none) .dropdown-menu,
#TaetigkeitsberichteNiocontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none) .dropdown-menu,
#TaetigkeitsberichteArchivcontainer .dx-datagrid-rowsview .dx-row > td:last-child:not(.dx-pointer-events-none) .dropdown-menu {
    z-index: 3000;
}

/* Keep DevExtreme fixed-column filler cells from covering row content. */
#TaetigkeitsberichteAktivcontainer .dx-datagrid .dx-datagrid-content-fixed .dx-row > td.dx-pointer-events-none,
#TaetigkeitsberichteNiocontainer .dx-datagrid .dx-datagrid-content-fixed .dx-row > td.dx-pointer-events-none,
#TaetigkeitsberichteArchivcontainer .dx-datagrid .dx-datagrid-content-fixed .dx-row > td.dx-pointer-events-none {
    visibility: hidden !important;
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}

@media (max-width: 998.98px) {
    .tb-overdue-badge {
        display: inline-block;
        width: 10px;
        height: 10px;
        padding: 0 !important;
        border-radius: 999px;
        font-size: 0 !important;
        line-height: 0 !important;
        white-space: nowrap !important;
        vertical-align: middle;
    }
}

@media (max-width: 768px) {
    .tb-action-menu,
    .tb-beratungsstelle-action-menu {
        display: inline-flex !important;
    }

    #TaetigkeitsberichteAktivcontainer .dx-datagrid-rowsview .dx-row > td:nth-child(3),
    #TaetigkeitsberichteNiocontainer .dx-datagrid-rowsview .dx-row > td:nth-child(3),
    #TaetigkeitsberichteArchivcontainer .dx-datagrid-rowsview .dx-row > td:nth-child(3) {
        white-space: normal;
        line-height: 1.2;
        overflow: visible;
        text-overflow: clip;
    }

    #TaetigkeitsberichteAktivcontainer .dx-datagrid-rowsview .dx-row > td:nth-child(3) .dx-datagrid-text-content,
    #TaetigkeitsberichteNiocontainer .dx-datagrid-rowsview .dx-row > td:nth-child(3) .dx-datagrid-text-content,
    #TaetigkeitsberichteArchivcontainer .dx-datagrid-rowsview .dx-row > td:nth-child(3) .dx-datagrid-text-content,
    #TaetigkeitsberichteBeratungsstelleTodocontainer .dx-datagrid-rowsview .dx-row > td:first-child .dx-datagrid-text-content,
    #TaetigkeitsberichteBeratungsstelleUeberfaelligcontainer .dx-datagrid-rowsview .dx-row > td:first-child .dx-datagrid-text-content,
    #TaetigkeitsberichteBeratungsstelleFehlercontainer .dx-datagrid-rowsview .dx-row > td:first-child .dx-datagrid-text-content,
    #TaetigkeitsberichteBeratungsstelleArchivcontainer .dx-datagrid-rowsview .dx-row > td:first-child .dx-datagrid-text-content {
        white-space: normal !important;
        word-break: break-word;
    }

    #TaetigkeitsberichteBeratungsstelleTodocontainer .dx-datagrid-rowsview .dx-row > td:first-child,
    #TaetigkeitsberichteBeratungsstelleUeberfaelligcontainer .dx-datagrid-rowsview .dx-row > td:first-child,
    #TaetigkeitsberichteBeratungsstelleFehlercontainer .dx-datagrid-rowsview .dx-row > td:first-child,
    #TaetigkeitsberichteBeratungsstelleArchivcontainer .dx-datagrid-rowsview .dx-row > td:first-child {
        white-space: normal;
        line-height: 1.2;
        overflow: visible;
        text-overflow: clip;
    }

    #modal-edit-taetigkeitsbericht .modal-dialog {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 !important;
        height: 90vh;
    }

    #modal-edit-taetigkeitsbericht .modal-dialog.modal-dialog-centered {
        align-items: stretch;
        min-height: 90vh;
    }

    #modal-edit-taetigkeitsbericht .modal-content {
        height: 90vh;
        border-radius: 0;
    }

    #modal-edit-taetigkeitsbericht .modal-body {
        padding: 0.75rem;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    #modal-edit-taetigkeitsbericht .modal-footer {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    #modal-edit-taetigkeitsbericht .modal-footer .btn {
        flex: 1 1 calc(50% - 0.5rem);
        min-width: 140px;
    }

    #modal-edit-taetigkeitsbericht .table-responsive {
        overflow: visible;
    }

    #modal-edit-taetigkeitsbericht .tb-table {
        display: block;
    }

    #modal-edit-taetigkeitsbericht .tb-table thead {
        display: none;
    }

    #modal-edit-taetigkeitsbericht .tb-table tbody,
    #modal-edit-taetigkeitsbericht .tb-table tr,
    #modal-edit-taetigkeitsbericht .tb-table td {
        display: block;
        width: 100%;
    }

    #modal-edit-taetigkeitsbericht .tb-table tr {
        border: 1px solid rgba(15, 23, 42, 0.08);
        border-radius: 0.85rem;
        padding: 0.5rem;
        margin-bottom: 0.75rem;
        background: #fff;
    }

    #modal-edit-taetigkeitsbericht .tb-table td {
        border: none;
        padding: 0.35rem 0;
    }

    #modal-edit-taetigkeitsbericht .tb-table td[data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        color: #6c757d;
        margin-bottom: 0.25rem;
    }

    #modal-edit-taetigkeitsbericht .tb-table td:last-child {
        text-align: right;
    }

    #modal-edit-taetigkeitsbericht .tb-remove-row {
        font-size: 1.2rem;
    }

    #modal-edit-taetigkeitsbericht .tb-input {
        font-size: 0.95rem;
    }
}

/* Ausbildungstypen */

.ausbildungstypen-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    border-radius: 0.35rem;
    background: transparent !important;
    opacity: 0.9;
    height: 38px;
    min-height: 38px;
    box-shadow: none;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button .dx-button-content {
    height: 100%;
    padding: 0.375rem 0.75rem;
    display: inline-flex;
    align-items: center;
}

.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button .dx-icon,
.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button .dx-button-text {
    color: var(--pba-accent, var(--connie-orange)) !important;
}

.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button.dx-state-hover,
.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button:hover {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button.dx-state-hover .dx-icon,
.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button.dx-state-hover .dx-button-text,
.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button:hover .dx-icon,
.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button:hover .dx-button-text {
    color: #fff !important;
}

.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button.dx-state-focused,
.ausbildungstypen-page .dx-toolbar .ausbildungstypen-toolbar-btn.dx-button:focus {
    box-shadow: none;
}

.ausbildungstypen-rlp-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0.32rem 0.62rem;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
}

.ausbildungstypen-rlp-status.is-filled {
    color: #166534;
    background: rgba(34, 197, 94, 0.14);
}

.ausbildungstypen-rlp-status.is-empty {
    color: #b91c1c;
    background: rgba(239, 68, 68, 0.12);
}

#modal-neuer-ausbildungstyp.pba-soft-modal .modal-dialog,
#modal-edit-ausbildungstypen.pba-soft-modal .modal-dialog {
    max-width: 980px;
}

#modal-neuer-ausbildungstyp .modal-body,
#modal-edit-ausbildungstypen .modal-body {
    padding-top: 18px;
    padding-bottom: 18px;
}

#modal-neuer-ausbildungstyp .form-group,
#modal-edit-ausbildungstypen .form-group {
    margin-bottom: 1rem;
}

#modal-neuer-ausbildungstyp .col-form-label,
#modal-edit-ausbildungstypen .col-form-label {
    color: #475569;
    font-weight: 600;
}

#modal-neuer-ausbildungstyp .table-responsive,
#modal-edit-ausbildungstypen .table-responsive {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    overflow-x: auto;
    overflow-y: auto;
    background: #f8fafc;
    /* Teil der Flex-Höhenkette: Tabelle füllt die Restspalte und scrollt intern. */
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
}

/* Modal auf den Viewport begrenzen → NICHT das ganze Fenster scrollt, sondern nur
   die Tabellen (Kategorien links / Rahmenlehrplan rechts) scrollen intern. */
#modal-neuer-ausbildungstyp .modal-content,
#modal-edit-ausbildungstypen .modal-content {
    max-height: calc(100vh - 3.5rem);
}
#modal-neuer-ausbildungstyp .modal-body,
#modal-edit-ausbildungstypen .modal-body {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}
#modal-neuer-ausbildungstyp .ausbildungstyp-advanced,
#modal-edit-ausbildungstypen .ausbildungstyp-advanced {
    flex: 1 1 auto;
    min-height: 0;
}
#modal-neuer-ausbildungstyp .ausbildungstyp-advanced > [class*="col-"],
#modal-edit-ausbildungstypen .ausbildungstyp-advanced > [class*="col-"] {
    min-height: 0;
    display: flex;
    flex-direction: column;
}
#modal-neuer-ausbildungstyp .ausbildungstyp-advanced .form-group,
#modal-edit-ausbildungstypen .ausbildungstyp-advanced .form-group {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}
@media (min-width: 992px) {
    /* einzelne Flex-Zeile, deren Höhe = Modal-Resthöhe → Spalten/Tabellen begrenzt */
    #modal-neuer-ausbildungstyp .ausbildungstyp-advanced,
    #modal-edit-ausbildungstypen .ausbildungstyp-advanced {
        flex-wrap: nowrap;
    }
}
@media (max-width: 991.98px) {
    /* gestapelt (mobil): normales Modalverhalten, Tabellen mit Maximalhöhe */
    #modal-neuer-ausbildungstyp .modal-content,
    #modal-edit-ausbildungstypen .modal-content {
        max-height: none;
    }
    #modal-neuer-ausbildungstyp .modal-body,
    #modal-edit-ausbildungstypen .modal-body {
        display: block;
        overflow: visible;
    }
    #modal-neuer-ausbildungstyp .ausbildungstyp-advanced .table-responsive,
    #modal-edit-ausbildungstypen .ausbildungstyp-advanced .table-responsive {
        flex: none;
        max-height: 50vh;
    }
}

#modal-neuer-ausbildungstyp .table,
#modal-edit-ausbildungstypen .table {
    margin-bottom: 0 !important;
}

#modal-neuer-ausbildungstyp .table thead th,
#modal-edit-ausbildungstypen .table thead th {
    padding: 12px 14px;
    border-top: 0;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
    /* app.css setzt global `th { opacity: 0.7 }`. Dadurch war der sticky
       Tabellenkopf halb durchsichtig und der darunter scrollende Inhalt schien
       durch. Hier wieder voll deckend machen. */
    opacity: 1;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.01em;
    /* bleibt beim internen Scrollen der Tabelle oben sichtbar */
    position: sticky;
    top: 0;
    z-index: 5;
}

#modal-neuer-ausbildungstyp .table tbody td,
#modal-edit-ausbildungstypen .table tbody td {
    padding: 12px 14px;
    border-top-color: rgba(15, 23, 42, 0.06);
    color: #0f172a;
    background: #fff;
    vertical-align: middle;
}

#modal-neuer-ausbildungstyp .ausbildungstypen-kategorie-table,
#modal-edit-ausbildungstypen .ausbildungstypen-kategorie-table,
#modal-neuer-ausbildungstyp .ausbildungstypen-rlp-table,
#modal-edit-ausbildungstypen .ausbildungstypen-rlp-table {
    table-layout: fixed;
}

#modal-neuer-ausbildungstyp .ausbildungstypen-kategorie-table td:last-child,
#modal-edit-ausbildungstypen .ausbildungstypen-kategorie-table td:last-child {
    width: 130px;
    min-width: 130px;
}

#modal-neuer-ausbildungstyp .ausbildungstypen-rlp-table .rlp-stunden,
#modal-edit-ausbildungstypen .ausbildungstypen-rlp-table .rlp-stunden {
    min-width: 96px;
    text-align: right;
}

#modal-neuer-ausbildungstyp .ausbildungstypen-rlp-table .rlp-block-color,
#modal-edit-ausbildungstypen .ausbildungstypen-rlp-table .rlp-block-color {
    min-width: 72px;
}

.ausbildungstypen-rlp-section {
    display: none;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

#modal-neuer-ausbildungstyp .remove-rahmenlehrplan-row,
#modal-edit-ausbildungstypen .remove-rahmenlehrplan-row {
    border-radius: 9px;
}

/* Jahrgaenge */

.jahrgaenge-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.jahrgaenge-page .dx-datagrid-rowsview .dx-row > td:last-child,
.jahrgaenge-page .dx-datagrid-headers .dx-header-row > td:last-child {
    padding-left: 6px !important;
    padding-right: 6px !important;
    text-align: center;
}

.pba-jahrgaenge-modal .modal-dialog {
    max-width: 980px;
}

.pba-jahrgaenge-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pba-jahrgaenge-field {
    margin-bottom: 0;
}

.pba-jahrgaenge-form .col-form-label {
    color: #475569;
    font-weight: 600;
}

.pba-jahrgaenge-lehrjahre {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 10px;
    padding: 12px;
    background: #f8fafc;
}

.pba-jahrgaenge-row {
    margin: 0 0 8px;
    padding: 8px 10px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 10px;
    background: #fff;
}

.pba-jahrgaenge-row:last-child {
    margin-bottom: 0;
}

.pba-jahrgaenge-row .custom-select,
.pba-jahrgaenge-row .form-control {
    min-height: 38px;
}

.pba-jahrgaenge-lehrjahr-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 94px;
    border-radius: 999px;
    background: rgba(var(--pba-accent-rgb, 28, 82, 36), 0.14) !important;
    color: var(--pba-accent, var(--connie-orange));
}

.pba-jahrgaenge-row .ausbildungsjahr-dates {
    display: inline-block;
    font-size: 12px;
    color: #64748b !important;
}

.pba-jahrgaenge-row .remove-row,
.pba-jahrgaenge-add-row {
    border-radius: 9px;
}

.pba-jahrgaenge-form .alert {
    margin-bottom: 10px;
}

/* Auszubildende */

.auszubildende-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.auszubildende-gps-wrap {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.auszubildende-gps-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    border-radius: 0.35rem;
    background: transparent !important;
    opacity: 0.9;
    height: 38px;
    min-height: 38px;
    box-shadow: none;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.auszubildende-gps-btn:hover,
.auszubildende-gps-btn:focus {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.auszubildende-page .badge.badge-pill {
    border-radius: 999px;
    padding: 0.32rem 0.6rem;
}

.auszubildende-modal .modal-dialog.auszubildende-modal-xl-dialog {
    max-width: min(1700px, 96vw);
}

.auszubildende-modal .auszubildende-modal-body {
    padding-top: 12px;
}

.auszubildende-modal .auszubildende-modal-body-relative {
    position: relative;
}

.auszubildende-modal .auszubildende-panel {
    background: #fcfcfc;
    border-color: rgba(15, 23, 42, 0.08) !important;
}

.auszubildende-modal .auszubildende-panel-fullheight {
    height: 100%;
}

.auszubildende-modal .auszubildende-beratungsstelle-area {
    max-height: 62vh;
    overflow: auto;
}

.auszubildende-modal #azubi-beratungsstelle-rows .btn {
    border-radius: 8px;
}

/* Beratungsstelle Traeger */

.beratungsstelle-traeger-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.beratungsstelle-traeger-page-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.beratungsstelle-traeger-page-toolbar .beratungsstelle-traeger-top-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-radius: 0.35rem;
    min-height: 38px;
    box-shadow: none;
    opacity: 0.9;
    margin-right: 0 !important;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.beratungsstelle-traeger-page-toolbar .beratungsstelle-traeger-top-btn:hover,
.beratungsstelle-traeger-page-toolbar .beratungsstelle-traeger-top-btn:focus {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-multimenu-wrap {
    margin-left: 0;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-detail-card,
.beratungsstelle-traeger-page .beratungsstelle-traeger-detail-body {
    white-space: normal;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-detail-summary {
    cursor: pointer;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-break-anywhere {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-color-badge {
    display: inline-block;
    vertical-align: middle;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-gps-flag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-kategorien-inline {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    white-space: nowrap;
    line-height: 1.3;
    max-width: 100%;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-kategorien-inline.is-expanded {
    display: flex;
    flex-wrap: wrap;
    white-space: normal;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-kategorien-toggle {
    font-size: 12px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    line-height: 1;
    vertical-align: middle;
    text-decoration: none;
}

.beratungsstelle-traeger-page .beratungsstelle-traeger-kategorien-toggle:hover {
    text-decoration: none;
}

.beratungsstelle-traeger-map-popup {
    min-width: 180px;
}

.beratungsstelle-traeger-map-canvas {
    height: 65vh;
    min-height: 420px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #f8fafc;
}

.beratungsstelle-traeger-progress {
    height: 22px;
}

.beratungsstelle-traeger-modal .modal-dialog.modal-xl {
    max-width: min(1500px, 96vw);
}

.beratungsstelle-traeger-modal .modal-footer {
    gap: 10px;
}

.beratungsstelle-traeger-modal .modal-footer .btn,
.beratungsstelle-traeger-modal [id^="btn-"],
.beratungsstelle-traeger-modal .btn-outline-primary,
.beratungsstelle-traeger-modal .btn-outline-secondary {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.beratungsstelle-traeger-modal .modal-footer .btn:focus,
.beratungsstelle-traeger-modal .modal-footer .btn:focus-visible,
.beratungsstelle-traeger-modal [id^="btn-"]:focus,
.beratungsstelle-traeger-modal [id^="btn-"]:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

.beratungsstelle-traeger-modal .modal-footer .btn[data-dismiss="modal"],
.beratungsstelle-traeger-modal .modal-footer .btn.btn-secondary,
.beratungsstelle-traeger-modal .btn-outline-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.beratungsstelle-traeger-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.beratungsstelle-traeger-modal .modal-footer .btn.btn-secondary:hover,
.beratungsstelle-traeger-modal .btn-outline-secondary:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

.beratungsstelle-traeger-modal .modal-footer .btn[type="submit"],
.beratungsstelle-traeger-modal .modal-footer .btn.btn-primary,
.beratungsstelle-traeger-modal .btn-outline-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.beratungsstelle-traeger-modal .modal-footer .btn[type="submit"]:hover,
.beratungsstelle-traeger-modal .modal-footer .btn.btn-primary:hover,
.beratungsstelle-traeger-modal .btn-outline-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

.beratungsstelle-modal-compact .modal-body {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.beratungsstelle-modal-compact .modal-body .form-group.row {
    display: inline-flex;
    width: 49%;
    vertical-align: top;
    margin: 0 1% .45rem 0;
    margin-left: 0;
    margin-right: 0;
}

.beratungsstelle-modal-compact .modal-body .form-group.row:nth-of-type(2n) {
    margin-right: 0;
}

.beratungsstelle-modal-compact .modal-body .form-group.row.beratungsstelle-map-row {
    width: 100%;
    margin-right: 0;
}

.beratungsstelle-modal-compact .modal-body .col-form-label {
    padding-top: .35rem;
    padding-bottom: .35rem;
    font-size: .9rem;
}

.beratungsstelle-modal-compact .modal-body .form-control,
.beratungsstelle-modal-compact .modal-body .custom-select {
    height: 34px;
    padding: .25rem .5rem;
    font-size: .9rem;
}

.beratungsstelle-modal-compact .modal-body .select2-container {
    width: 100% !important;
}

.beratungsstelle-modal-compact .modal-body .select2-container--default .select2-selection--multiple {
    min-height: 34px;
}

.beratungsstelle-modal-compact .modal-body hr {
    clear: both;
    margin: .35rem 0 .55rem;
}

.beratungsstelle-modal-compact-textarea {
    height: auto !important;
}

.beratungsstelle-map-frame {
    display: none;
    width: 100%;
    height: 260px;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}

@media (max-width: 991.98px) {
    .beratungsstelle-modal-compact .modal-body .form-group.row {
        width: 100%;
        margin-right: 0;
    }
}

/* Plaetze Traeger */

.plaetze-traeger-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.plaetze-beratungsstelle-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.plaetze-traeger-page .plaetze-traeger-color-badge {
    display: inline-block;
    vertical-align: middle;
}

.plaetze-beratungsstelle-page .badge.badge-pill {
    display: inline-block;
    vertical-align: middle;
}

.plaetze-modal .modal-footer {
    gap: 10px;
}

.plaetze-modal .modal-footer .btn,
.plaetze-modal [id^="btn-"] {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.plaetze-modal .modal-footer .btn:focus,
.plaetze-modal .modal-footer .btn:focus-visible,
.plaetze-modal [id^="btn-"]:focus,
.plaetze-modal [id^="btn-"]:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

.plaetze-modal .modal-footer .btn[data-dismiss="modal"],
.plaetze-modal .modal-footer .btn.btn-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.plaetze-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.plaetze-modal .modal-footer .btn.btn-secondary:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

.plaetze-modal .modal-footer .btn[type="submit"],
.plaetze-modal .modal-footer .btn.btn-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.plaetze-modal .modal-footer .btn[type="submit"]:hover,
.plaetze-modal .modal-footer .btn.btn-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

.plaetze-modal-footer-split {
    justify-content: space-between;
}

.plaetze-counter-wrap {
    gap: 8px;
}

.plaetze-counter-input {
    width: 80px;
}

@media (max-width: 767.98px) {
    .plaetze-modal-footer-split {
        flex-direction: column;
        align-items: stretch;
    }

    .plaetze-modal-footer-split > div:last-child {
        display: flex;
        gap: 8px;
        justify-content: flex-end;
    }
}

/* Ausbildungskatalog / Kategorien / Kennzeichen */

.ausbildungskatalog-page .message-hub-main > div[class$="-container"],
.kategorien-page .message-hub-main > div[class$="-container"],
.kennzeichen-page .message-hub-main > div[class$="-container"],
.module-page .message-hub-main > div[class$="-container"],
.kompetenzen-page .message-hub-main > div[class$="-container"],
.benutzer-traeger-page .message-hub-main > div[class$="-container"],
.benutzer-beratungsstelle-page .message-hub-main > div[class$="-container"],
.snapshots-page .message-hub-main > div[class$="-container"],
.learnbooks-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.ausbildungskatalog-page-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.benutzer-traeger-page-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.benutzer-csv-import-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-radius: 0.35rem;
    min-height: 38px;
    box-shadow: none;
    opacity: 0.9;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.benutzer-csv-import-btn:hover,
.benutzer-csv-import-btn:focus {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.csv-import-page .message-hub-main {
    padding: 18px;
}

.csv-import-hero-note {
    margin-top: 4px;
    color: #64748b;
    font-size: 14px;
    line-height: 1.35;
}

.csv-import-grid {
    margin-top: 2px;
}

.csv-import-card {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.csv-import-card-head {
    padding: 12px 16px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
}

.csv-import-card-head.is-accent {
    background: var(--pba-accent, var(--connie-orange));
    color: var(--pba-accent-contrast, #fff);
    border-bottom-color: transparent;
}

.csv-import-card-body {
    padding: 16px;
}

.csv-import-page .form-control,
.csv-import-page select.form-control {
    border-radius: 7px;
    border-color: rgba(15, 23, 42, 0.12);
    box-shadow: none;
}

.csv-import-page .form-control:focus,
.csv-import-page select.form-control:focus {
    border-color: rgba(51, 65, 85, 0.35);
    box-shadow: 0 0 0 3px rgba(51, 65, 85, 0.08);
}

.csv-import-template-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-radius: 0.35rem;
    min-height: 32px;
    box-shadow: none;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.csv-import-template-btn:hover,
.csv-import-template-btn:focus {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    transform: translateY(-1px);
}

.csv-import-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.csv-import-actions .btn {
    border-radius: 8px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    opacity: 0.9;
    box-shadow: none !important;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.csv-import-actions .btn.btn-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.csv-import-actions .btn.btn-primary:hover,
.csv-import-actions .btn.btn-primary:focus {
    opacity: 1;
    filter: brightness(0.94);
    transform: translateY(-1px);
}

.csv-import-actions .btn.btn-outline-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.csv-import-actions .btn.btn-outline-secondary:hover,
.csv-import-actions .btn.btn-outline-secondary:focus {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.csv-preview-header {
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 8px;
    padding: 10px 12px;
    color: #334155;
    font-size: 13px;
}

.csv-preview-sample {
    background: #0f172a;
    color: #e2e8f0;
    border: 1px solid rgba(15, 23, 42, 0.3);
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 13px;
}

/* Import result block */
.csv-import-result {
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 10px;
    overflow: hidden;
}

.csv-import-result-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 16px;
    gap: 12px;
}

.csv-import-result-head.is-success {
    background: #f0fdf4;
    border-bottom: 1px solid #bbf7d0;
}

.csv-import-result-head.is-error {
    background: #fef2f2;
    border-bottom: 1px solid #fecaca;
}

.csv-import-result-head.is-partial {
    background: #fffbeb;
    border-bottom: 1px solid #fde68a;
}

.csv-import-result-title {
    font-weight: 600;
    font-size: 13.5px;
    color: #1e293b;
}

.csv-import-result-counts {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
}

.csv-import-result-ok {
    color: #16a34a;
    font-weight: 500;
}

.csv-import-result-sep {
    color: #94a3b8;
}

.csv-import-result-err {
    color: #dc2626;
    font-weight: 500;
}

.csv-import-errors-details {
    background: #fff;
}

.csv-import-errors-summary {
    padding: 9px 16px;
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    cursor: pointer;
    user-select: none;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 6px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.csv-import-errors-summary::-webkit-details-marker {
    display: none;
}

.csv-import-errors-summary::before {
    content: '▶';
    font-size: 10px;
    color: #94a3b8;
    transition: transform 0.15s ease;
    display: inline-block;
}

details[open] .csv-import-errors-summary::before {
    transform: rotate(90deg);
}

.csv-import-errors-list {
    margin: 0;
    padding: 10px 16px 10px 32px;
    list-style: disc;
    font-size: 12.5px;
    color: #475569;
    line-height: 1.7;
    max-height: 240px;
    overflow-y: auto;
}

.csv-import-errors-list li {
    padding: 1px 0;
}

.ausbildungskatalog-import-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-radius: 0.35rem;
    min-height: 38px;
    box-shadow: none;
    opacity: 0.9;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.ausbildungskatalog-import-btn:hover,
.ausbildungskatalog-import-btn:focus {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.kategorien-page .kategorien-color-badge,
.kennzeichen-page .kennzeichen-color-badge {
    font-size: 0.8em;
}

.kompetenzen-page .komp-text {
    max-width: 520px;
    display: block;
    line-height: 1.35;
}

.kompetenzen-page .komp-toggle {
    font-size: 0.85em;
    margin-left: 6px;
}

.kompetenzen-page .komp-view {
    font-weight: 600;
}

.ausbildungskatalog-modal .modal-footer,
.kategorien-modal .modal-footer,
.kennzeichen-modal .modal-footer,
.module-modal .modal-footer,
.kompetenzen-modal .modal-footer,
.benutzer-modal .modal-footer,
.snapshots-modal .modal-footer,
.interactions-modal .modal-footer {
    gap: 10px;
}

.ausbildungskatalog-modal .modal-footer .btn,
.kategorien-modal .modal-footer .btn,
.kennzeichen-modal .modal-footer .btn,
.module-modal .modal-footer .btn,
.kompetenzen-modal .modal-footer .btn,
.benutzer-modal .modal-footer .btn,
.snapshots-modal .modal-footer .btn,
.interactions-modal .modal-footer .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.ausbildungskatalog-modal .modal-footer .btn:focus,
.ausbildungskatalog-modal .modal-footer .btn:focus-visible,
.kategorien-modal .modal-footer .btn:focus,
.kategorien-modal .modal-footer .btn:focus-visible,
.kennzeichen-modal .modal-footer .btn:focus,
.kennzeichen-modal .modal-footer .btn:focus-visible,
.module-modal .modal-footer .btn:focus,
.module-modal .modal-footer .btn:focus-visible,
.kompetenzen-modal .modal-footer .btn:focus,
.kompetenzen-modal .modal-footer .btn:focus-visible,
.benutzer-modal .modal-footer .btn:focus,
.benutzer-modal .modal-footer .btn:focus-visible,
.snapshots-modal .modal-footer .btn:focus,
.snapshots-modal .modal-footer .btn:focus-visible,
.interactions-modal .modal-footer .btn:focus,
.interactions-modal .modal-footer .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

.ausbildungskatalog-modal .modal-footer .btn[data-dismiss="modal"],
.ausbildungskatalog-modal .modal-footer .btn.btn-secondary,
.kategorien-modal .modal-footer .btn[data-dismiss="modal"],
.kategorien-modal .modal-footer .btn.btn-secondary,
.kennzeichen-modal .modal-footer .btn[data-dismiss="modal"],
.kennzeichen-modal .modal-footer .btn.btn-secondary,
.module-modal .modal-footer .btn[data-dismiss="modal"],
.module-modal .modal-footer .btn.btn-secondary,
.kompetenzen-modal .modal-footer .btn[data-dismiss="modal"],
.kompetenzen-modal .modal-footer .btn.btn-secondary,
.benutzer-modal .modal-footer .btn[data-dismiss="modal"],
.benutzer-modal .modal-footer .btn.btn-secondary,
.snapshots-modal .modal-footer .btn[data-dismiss="modal"],
.snapshots-modal .modal-footer .btn.btn-secondary,
.interactions-modal .modal-footer .btn[data-dismiss="modal"],
.interactions-modal .modal-footer .btn.btn-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.ausbildungskatalog-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.ausbildungskatalog-modal .modal-footer .btn.btn-secondary:hover,
.kategorien-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.kategorien-modal .modal-footer .btn.btn-secondary:hover,
.kennzeichen-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.kennzeichen-modal .modal-footer .btn.btn-secondary:hover,
.module-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.module-modal .modal-footer .btn.btn-secondary:hover,
.kompetenzen-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.kompetenzen-modal .modal-footer .btn.btn-secondary:hover,
.benutzer-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.benutzer-modal .modal-footer .btn.btn-secondary:hover,
.snapshots-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.snapshots-modal .modal-footer .btn.btn-secondary:hover,
.interactions-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.interactions-modal .modal-footer .btn.btn-secondary:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

.ausbildungskatalog-modal .modal-footer .btn[type="submit"],
.ausbildungskatalog-modal .modal-footer .btn.btn-primary,
.ausbildungskatalog-modal .modal-footer .btn.btn-success,
.kategorien-modal .modal-footer .btn[type="submit"],
.kategorien-modal .modal-footer .btn.btn-primary,
.kennzeichen-modal .modal-footer .btn[type="submit"],
.kennzeichen-modal .modal-footer .btn.btn-primary,
.module-modal .modal-footer .btn[type="submit"],
.module-modal .modal-footer .btn.btn-primary,
.kompetenzen-modal .modal-footer .btn[type="submit"],
.kompetenzen-modal .modal-footer .btn.btn-primary,
.benutzer-modal .modal-footer .btn[type="submit"],
.benutzer-modal .modal-footer .btn.btn-primary,
.snapshots-modal .modal-footer .btn[type="submit"],
.snapshots-modal .modal-footer .btn.btn-primary,
.interactions-modal .modal-footer .btn[type="submit"],
.interactions-modal .modal-footer .btn.btn-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1 !important;
}

.kompetenzen-modal .modal-footer .btn[type="submit"]:disabled,
.kompetenzen-modal .modal-footer .btn.btn-primary:disabled,
.benutzer-modal .modal-footer .btn[type="submit"]:disabled,
.benutzer-modal .modal-footer .btn.btn-primary:disabled,
.snapshots-modal .modal-footer .btn[type="submit"]:disabled,
.snapshots-modal .modal-footer .btn.btn-primary:disabled,
.interactions-modal .modal-footer .btn[type="submit"]:disabled,
.interactions-modal .modal-footer .btn.btn-primary:disabled {
    background: #cbd5e1 !important;
    border-color: #cbd5e1 !important;
    color: #94a3b8 !important;
    cursor: not-allowed;
    pointer-events: auto;
}

.ausbildungskatalog-modal .modal-footer .btn[type="submit"]:hover,
.ausbildungskatalog-modal .modal-footer .btn.btn-primary:hover,
.ausbildungskatalog-modal .modal-footer .btn.btn-success:hover,
.kategorien-modal .modal-footer .btn[type="submit"]:hover,
.kategorien-modal .modal-footer .btn.btn-primary:hover,
.kennzeichen-modal .modal-footer .btn[type="submit"]:hover,
.kennzeichen-modal .modal-footer .btn.btn-primary:hover,
.module-modal .modal-footer .btn[type="submit"]:hover,
.module-modal .modal-footer .btn.btn-primary:hover,
.kompetenzen-modal .modal-footer .btn[type="submit"]:hover,
.kompetenzen-modal .modal-footer .btn.btn-primary:hover,
.benutzer-modal .modal-footer .btn[type="submit"]:hover,
.benutzer-modal .modal-footer .btn.btn-primary:hover,
.snapshots-modal .modal-footer .btn[type="submit"]:hover,
.snapshots-modal .modal-footer .btn.btn-primary:hover,
.interactions-modal .modal-footer .btn[type="submit"]:hover,
.interactions-modal .modal-footer .btn.btn-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

/* Auswertung Auslastung */

.auswertung-auslastung-page .auswertung-auslastung-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.auswertung-auslastung-page .auswertung-auslastung-toolbar h5 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

.auswertung-auslastung-page .auswertung-filter-group {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 8px;
    margin-right: 8px;
}

.auswertung-auslastung-page .auswertung-filter-group .btn + .btn {
    margin-left: 0;
}

.auswertung-auslastung-page .auswertung-auslastung-toolbar .pba-grid-toolbar-btn {
    border-radius: 0.35rem;
    min-height: 38px;
    padding: 0.35rem 0.82rem;
    font-size: 1rem;
    font-weight: 400;
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    box-shadow: none;
    opacity: 0.9;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.auswertung-auslastung-page .auswertung-auslastung-toolbar .pba-grid-toolbar-btn:hover,
.auswertung-auslastung-page .auswertung-auslastung-toolbar .pba-grid-toolbar-btn:focus {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.auswertung-auslastung-page .auswertung-filter-group .auswertung-filter-btn.active {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.auswertung-auslastung-page #auswertungDataGrid {
    border-radius: 10px;
}

.auswertung-auslastung-page .auswertung-auslastung-empty {
    margin: 0;
    border-radius: 10px;
}

.auswertung-modal .modal-footer {
    gap: 10px;
}

.auswertung-modal .modal-footer .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
}

.auswertung-modal .modal-footer .btn:focus,
.auswertung-modal .modal-footer .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

.auswertung-modal .modal-footer .btn[data-dismiss="modal"],
.auswertung-modal .modal-footer .btn.btn-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.auswertung-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.auswertung-modal .modal-footer .btn.btn-secondary:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

.auswertung-modal .modal-footer .btn[type="submit"],
.auswertung-modal .modal-footer .btn.btn-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.auswertung-modal .modal-footer .btn[type="submit"]:hover,
.auswertung-modal .modal-footer .btn.btn-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

/* Platzbelegung */

.platzbelegung-page .platzbelegung-filter-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 12px;
}

.platzbelegung-page .platzbelegung-filter-group {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 8px;
}

.platzbelegung-page .platzbelegung-filter-group .btn + .btn {
    margin-left: 0;
}

.platzbelegung-page .platzbelegung-filter-btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.35rem 0.82rem;
    font-size: 1rem;
    font-weight: 400;
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: #fff !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.platzbelegung-page .platzbelegung-filter-btn:hover,
.platzbelegung-page .platzbelegung-filter-btn:focus {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    transform: translateY(-1px);
}

.platzbelegung-page .platzbelegung-filter-btn.active {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.platzbelegung-page .dashboard-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.platzbelegung-page .dashboard-stat-card {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.05);
    padding: 16px 18px;
    min-height: 110px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.platzbelegung-page .dashboard-stat-label {
    color: #64748b;
    font-size: 13px;
    line-height: 1.35;
}

.platzbelegung-page .dashboard-stat-value {
    margin: 0;
    font-size: 28px;
    line-height: 1;
    font-weight: 800;
    color: #0f172a;
}

.platzbelegung-page .dashboard-stat-tone {
    color: var(--pba-accent, #334155);
}

.platzbelegung-page .platzbelegung-grid-panel {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

.platzbelegung-page .platzbelegung-grid-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 16px;
    color: #0f172a;
    background: #f8fafc;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.platzbelegung-page .platzbelegung-grid-panel-head h5 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.platzbelegung-page .platzbelegung-grid-filter-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    padding: 8px 10px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 10px;
    background: #fff;
    max-width: 100%;
}

.platzbelegung-page .platzbelegung-grid-filter-wrap label {
    color: #475569;
    font-weight: 600;
    margin-right: 0 !important;
    white-space: nowrap;
}

.platzbelegung-page .platzbelegung-beratungsstelle-filter.form-control {
    min-width: 280px;
    width: min(560px, 52vw);
    max-width: 100%;
    border-radius: 8px;
    border-color: rgba(15, 23, 42, 0.15);
    box-shadow: none;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.platzbelegung-page .platzbelegung-beratungsstelle-filter.form-control:focus {
    border-color: rgba(15, 23, 42, 0.28);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.16);
}

.platzbelegung-page .platzbelegung-grid-panel-body {
    padding: 14px;
}

.platzbelegung-page #platzbelegungGrid {
    border-radius: 10px;
}

.platzbelegung-page .platzbelegung-utilization {
    width: 108px;
    height: 20px;
    border-radius: 999px;
    background: #e2e8f0;
    margin: 0 auto;
    overflow: hidden;
}

.platzbelegung-page .platzbelegung-utilization-bar {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    transition: width 0.2s ease;
}

.platzbelegung-page .platzbelegung-utilization-bar.is-high {
    background: #16a34a;
}

.platzbelegung-page .platzbelegung-utilization-bar.is-medium {
    background: #d97706;
}

.platzbelegung-page .platzbelegung-utilization-bar.is-low {
    background: #dc2626;
}

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

@media (max-width: 767.98px) {
    .platzbelegung-page .dashboard-stats {
        grid-template-columns: minmax(0, 1fr);
    }

    .platzbelegung-page .platzbelegung-filter-toolbar {
        justify-content: flex-start;
    }

    .platzbelegung-page .platzbelegung-beratungsstelle-filter.form-control {
        min-width: 0;
        width: 100%;
    }

    .platzbelegung-page .platzbelegung-grid-filter-wrap {
        width: 100%;
        flex-wrap: wrap;
        align-items: flex-start;
        padding: 10px;
    }

    .platzbelegung-page .platzbelegung-grid-filter-wrap label {
        width: 100%;
    }
}

/* Auswertung Matrix */

.auswertung-matrix-page {
    overflow-x: visible;
}

.auswertung-matrix-page .message-hub-main {
    padding: 14px;
}

.auswertung-matrix-page .auswertung-matrix-panel {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.auswertung-matrix-page .auswertung-matrix-panel-head {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.auswertung-matrix-page .auswertung-matrix-panel-head h5 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

.auswertung-matrix-page .matrix-top-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 8px;
}

.auswertung-matrix-page .auswertung-matrix-panel-body {
    position: relative;
    max-width: 100%;
    overflow-x: hidden;
    padding: 15px;
}

.auswertung-matrix-page .matrix-top-btn,
.auswertung-matrix-page .matrix-action-btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.38rem 0.9rem;
    font-size: 1rem;
    font-weight: 400;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.auswertung-matrix-page .matrix-top-btn + .matrix-top-btn {
    margin-left: 0;
}

.auswertung-matrix-page .matrix-action-btn + .matrix-action-btn {
    margin-left: 0;
}

.auswertung-matrix-page .matrix-top-btn.btn-outline-secondary,
.auswertung-matrix-page .matrix-top-btn.btn-outline-primary,
.auswertung-matrix-page .matrix-action-btn.btn-outline-secondary {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    background: #fff !important;
}

.auswertung-matrix-page .matrix-top-btn.btn-outline-secondary:hover,
.auswertung-matrix-page .matrix-top-btn.btn-outline-primary:hover,
.auswertung-matrix-page .matrix-action-btn.btn-outline-secondary:hover {
    color: #fff !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    transform: translateY(-1px);
}

.auswertung-matrix-page .matrix-top-btn.btn-primary,
.auswertung-matrix-page .matrix-action-btn.btn-primary {
    color: #fff !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
}

.auswertung-matrix-page .matrix-top-btn.btn-primary:hover,
.auswertung-matrix-page .matrix-action-btn.btn-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

.auswertung-matrix-page .matrix-filter-row .matrix-filter-col {
    display: flex;
    flex-direction: column;
}

.auswertung-matrix-page .matrix-selects-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: min(100%, 1100px);
}

.auswertung-matrix-page .matrix-select-col {
    flex: 0 1 225px;
    min-width: 195px;
}

.auswertung-matrix-page .matrix-select-col-wide {
    flex-basis: 275px;
    min-width: 240px;
}

.auswertung-matrix-page .matrix-actions-col {
    margin-bottom: 0;
}

@media (min-width: 992px) {
    .auswertung-matrix-page .matrix-actions-col {
        align-items: flex-end;
    }

    .auswertung-matrix-page .matrix-actions-col .matrix-filter-actions {
        justify-content: flex-end;
    }
}

.auswertung-matrix-page .matrix-filter-label {
    min-height: 21px;
    margin-bottom: 6px;
}

.auswertung-matrix-page .matrix-filter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 38px;
}

@media (min-width: 2300px) {
    .auswertung-matrix-page .matrix-filter-actions {
        flex-wrap: nowrap;
        align-items: stretch;
    }

    .auswertung-matrix-page .matrix-top-actions {
        flex-wrap: nowrap;
    }

    .auswertung-matrix-page .matrix-action-btn,
    .auswertung-matrix-page .matrix-top-btn,
    .auswertung-matrix-page .matrix-actions-divider {
        flex: 0 0 auto;
    }
}

.auswertung-matrix-page .matrix-actions-divider {
    width: 1px;
    align-self: stretch;
    background: rgba(15, 23, 42, 0.16);
    margin: 0 2px;
}

.auswertung-matrix-page .matrix-dominant-check {
    display: none;
}

.auswertung-matrix-page .matrix-loading-overlay {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(255, 255, 255, 0.5);
    align-items: center;
    justify-content: center;
}

.auswertung-matrix-page .matrix-loading-spinner {
    width: 3rem;
    height: 3rem;
}

.auswertung-matrix-page .matrix-table-wrap {
    max-height: calc(100vh - 480px);
    max-width: calc(100vw - 332px);
    overflow-x: auto;
    overflow-y: auto;
    position: relative;
    width: 100%;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 10px;
    -webkit-overflow-scrolling: touch;
}

.auswertung-matrix-page .matrix-table {
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    margin-bottom: 0;
}

.auswertung-matrix-page .matrix-table th,
.auswertung-matrix-page .matrix-table td {
    vertical-align: top;
    padding: 4px;
    font-size: 11px;
    border-color: #e9ecef;
}

.auswertung-matrix-page .matrix-table th {
    text-align: center;
}

.auswertung-matrix-page .matrix-sort-toggle {
    color: #212529;
    text-decoration: none !important;
    font-weight: 600;
}

.auswertung-matrix-page .matrix-sort-toggle:hover,
.auswertung-matrix-page .matrix-sort-toggle:focus {
    color: var(--pba-accent, var(--connie-orange));
}

.auswertung-matrix-page .matrix-table thead th {
    position: sticky;
    top: 0;
    z-index: 20;
    background-color: #f8f9fa !important;
    background-clip: padding-box;
    opacity: 1;
}

.auswertung-matrix-page .matrix-table th:first-child,
.auswertung-matrix-page .matrix-table td:first-child {
    width: 36px;
}

.auswertung-matrix-page .matrix-table th:nth-child(2),
.auswertung-matrix-page .matrix-table td:nth-child(2) {
    width: 160px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.auswertung-matrix-page .matrix-table .matrix-sticky-check,
.auswertung-matrix-page .matrix-table .matrix-sticky-azubi,
.auswertung-matrix-page .matrix-table .matrix-sticky-plan {
    position: sticky;
    background-color: #ffffff;
    background-clip: padding-box;
}

.auswertung-matrix-page .matrix-table .matrix-sticky-check {
    left: 0;
    width: 36px;
    z-index: 25;
}

.auswertung-matrix-page .matrix-table .matrix-sticky-azubi {
    left: 36px;
    width: 160px;
    z-index: 24;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.auswertung-matrix-page .matrix-table .matrix-sticky-plan {
    left: 196px;
    width: 60px;
    min-width: 60px;
    max-width: 60px;
    z-index: 23;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

.auswertung-matrix-page .matrix-table thead .matrix-sticky-check,
.auswertung-matrix-page .matrix-table thead .matrix-sticky-azubi,
.auswertung-matrix-page .matrix-table thead .matrix-sticky-plan {
    z-index: 30;
    background-color: #f8f9fa !important;
}

.auswertung-matrix-page .matrix-check-col {
    width: 40px;
    min-width: 40px;
    max-width: 40px;
}

.auswertung-matrix-page .matrix-week {
    width: 35px;
    min-width: 35px;
    max-width: 35px;
    height: 80px;
    padding: 0;
    background-color: #f8f9fb !important;
    border-left: 1px solid #e5e7eb;
    border-right: 1px solid #e5e7eb;
    position: relative;
    opacity: 1;
}

.auswertung-matrix-page .matrix-week .week-label {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(-90deg);
    transform-origin: center;
    white-space: nowrap;
    font-size: 9px;
    letter-spacing: 0.1px;
    color: #4b5563;
}

.auswertung-matrix-page .matrix-week-cell {
    background: #fcfcfd;
    padding: 2px;
    border-right: 1px solid #e5e7eb;
    overflow: hidden;
}

.auswertung-matrix-page .matrix-table tbody tr:nth-child(even) td {
    background: #ffffff;
}

.auswertung-matrix-page .matrix-cell {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: stretch;
    width: 100%;
    min-width: 0;
}

.auswertung-matrix-page .matrix-badge {
    font-weight: 600;
    font-size: 11px;
    padding: 3px 5px;
    border-radius: 4px;
    display: block;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

.auswertung-matrix-page .matrix-badge-summary {
    background: #6c757d;
}

.auswertung-matrix-page .select2-container {
    width: 100% !important;
}

@media (max-width: 1199.98px) {
    .auswertung-matrix-page .matrix-table-wrap {
        max-width: 100%;
    }
}

@media (max-width: 767.98px) {
    .auswertung-matrix-page .auswertung-matrix-panel-head {
        align-items: flex-start;
    }

    .auswertung-matrix-page .matrix-top-btn + .matrix-top-btn {
        margin-left: 6px;
    }

    .auswertung-matrix-page .matrix-actions-divider {
        display: none;
    }

    .auswertung-matrix-page .matrix-top-actions {
        width: 100%;
    }

    .auswertung-matrix-page .matrix-select-col,
    .auswertung-matrix-page .matrix-select-col-wide {
        flex-basis: 100%;
        min-width: 0;
    }

    .auswertung-matrix-page .matrix-table-wrap {
        max-height: calc(100vh - 420px);
    }
}

/* Einsatz Tagesdaten */

.tagesdaten-page .message-hub-main {
    padding: 14px;
}

.tagesdaten-page .tagesdaten-grid-panel {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.tagesdaten-page .tagesdaten-grid-panel-head {
    padding: 12px 16px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.tagesdaten-page .tagesdaten-grid-panel-head h5 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

.tagesdaten-page .tagesdaten-grid-panel-body {
    padding: 14px;
}

.tagesdaten-page #tagesdatenDataGrid {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 10px;
    overflow: hidden;
}

.tagesdaten-page .tagesdaten-empty {
    margin: 0;
    border-radius: 10px;
}

/* Analytics Refresh */

.auswertung-auslastung-page,
.tagesdaten-page,
.auswertung-matrix-page,
.azubi-delta-page,
.platzbelegung-page,
.beratungsstelle-freie-plaetze-page,
.kategorie-matrix-page {
    position: relative;
}

.auswertung-auslastung-page .message-hub-hero,
.tagesdaten-page .message-hub-hero,
.auswertung-matrix-page .message-hub-hero,
.azubi-delta-page .message-hub-hero,
.platzbelegung-page .message-hub-hero,
.beratungsstelle-freie-plaetze-page .message-hub-hero {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    padding: 14px 16px;
    margin-bottom: 12px;
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.06);
}

.auswertung-auslastung-page .message-hub-hero h2,
.tagesdaten-page .message-hub-hero h2,
.auswertung-matrix-page .message-hub-hero h2,
.azubi-delta-page .message-hub-hero h2,
.platzbelegung-page .message-hub-hero h2,
.beratungsstelle-freie-plaetze-page .message-hub-hero h2 {
    letter-spacing: 0.01em;
}

.analytics-kpi-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.analytics-kpi-card {
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-radius: 12px;
    padding: 10px 12px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.analytics-kpi-card.is-positive {
    border-color: rgba(22, 163, 74, 0.25);
    background: linear-gradient(180deg, #ffffff 0%, #f4fbf6 100%);
}

.analytics-kpi-card.is-negative {
    border-color: rgba(220, 38, 38, 0.22);
    background: linear-gradient(180deg, #ffffff 0%, #fff7f7 100%);
}

.analytics-kpi-label {
    display: block;
    margin-bottom: 2px;
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.analytics-kpi-value {
    font-size: 21px;
    font-weight: 800;
    line-height: 1.2;
    color: #0f172a;
}

.auswertung-auslastung-page #auswertungDataGrid,
.tagesdaten-page #tagesdatenDataGrid,
.azubi-delta-page #azubiDeltaGrid,
.platzbelegung-page #platzbelegungGrid,
.beratungsstelle-freie-plaetze-page .beratungsstelle-freie-plaetze-table-wrap {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.09);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.05);
    background: #fff;
}

.auswertung-matrix-page .matrix-table-wrap,
.kategorie-matrix-page .kategorie-matrix-table-wrap {
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.09);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.05);
    background: #fff;
    overflow-x: auto;
    overflow-y: auto;
}

.auswertung-auslastung-page .dx-datagrid,
.tagesdaten-page .dx-datagrid,
.azubi-delta-page .dx-datagrid,
.platzbelegung-page .dx-datagrid {
    border-radius: 12px;
}

.auswertung-auslastung-page .dx-datagrid-headers,
.tagesdaten-page .dx-datagrid-headers,
.azubi-delta-page .dx-datagrid-headers,
.platzbelegung-page .dx-datagrid-headers {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

.beratungsstelle-freie-plaetze-page .beratungsstelle-freie-plaetze-table thead th,
.kategorie-matrix-page .kategorie-matrix-table thead th {
    background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%) !important;
}

.beratungsstelle-freie-plaetze-page .beratungsstelle-freie-plaetze-page-toolbar,
.platzbelegung-page .platzbelegung-filter-toolbar,
.auswertung-matrix-page .auswertung-matrix-panel,
.kategorie-matrix-page .card,
.auswertung-auslastung-page .auswertung-auslastung-toolbar,
.azubi-delta-page .azubi-delta-page-toolbar,
.tagesdaten-page .tagesdaten-grid-panel {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.beratungsstelle-freie-plaetze-page .beratungsstelle-freie-plaetze-page-toolbar,
.platzbelegung-page .platzbelegung-filter-toolbar,
.azubi-delta-page .azubi-delta-page-toolbar,
.auswertung-auslastung-page .auswertung-auslastung-toolbar {
    padding: 12px;
}

.analytics-chart-card {
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
    padding: 12px;
}

.analytics-chart-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.analytics-chart-head h6 {
    font-size: 15px;
    font-weight: 700;
    color: #0f172a;
}

.analytics-chart-surface {
    width: 100%;
    min-height: 320px;
}

.analytics-chart-surface .dx-chart {
    border-radius: 10px;
}

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

@media (max-width: 575.98px) {
    .analytics-kpi-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .analytics-kpi-value {
        font-size: 18px;
    }
}

/* Einsatzplanung Traeger */

.einsatzplanung-page {
    font-size: 15px;
}

.einsatzplanung-page .message-hub-main {
    padding: 14px;
}

.einsatzplanung-page .einsatzplanung-columns {
    margin-left: -6px;
    margin-right: -6px;
}

.einsatzplanung-page .einsatzplanung-columns > [class*="col-"] {
    padding-left: 6px;
    padding-right: 6px;
}

.einsatzplanung-page label {
    font-size: 15px;
}

.einsatzplanung-page .einsatzplanung-bold-label {
    font-weight: 600;
}

.einsatzplanung-page .card {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
    overflow: hidden;
}

.einsatzplanung-page .card-header,
.einsatzplanung-page .card-header h5,
.einsatzplanung-page .modal-title {
    font-weight: 600;
}

.einsatzplanung-page .card-header {
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
}

.einsatzplanung-page .card-body strong,
.einsatzplanung-page .modal-body strong,
.einsatzplanung-page #azubis-list strong,
.einsatzplanung-page #beratungsstelle-list strong,
.einsatzplanung-page #kompetenzen-list strong,
.einsatzplanung-page .form-group strong {
    font-weight: 400;
}

.einsatzplanung-page #azubis-list,
.einsatzplanung-page #kompetenzen-list {
    overflow-x: visible;
}

.einsatzplanung-page #planning-settings-summary {
    color: #64748b !important;
}

.einsatzplanung-page .einsatzplanung-show-calendar-btn {
    display: none;
}

.einsatzplanung-page .einsatzplanung-periods-box {
    max-height: 150px;
    overflow-y: auto;
    display: none;
    margin-bottom: 0;
}

.einsatzplanung-page .einsatzplanung-kompetenzen-list {
    max-height: 200px;
    overflow-y: auto;
}

.einsatzplanung-page .einsatzplanung-azubi-status-line {
    display: none;
}

.einsatzplanung-page .einsatzplanung-azubis-list {
    max-height: 680px;
    overflow-y: auto;
}

.einsatzplanung-page .einsatzplanung-beratungsstelle-list {
    max-height: 530px;
    overflow-y: auto;
}

.einsatzplanung-page .btn {
    font-weight: 400;
    border-radius: 10px;
    box-shadow: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.einsatzplanung-page .btn:not(.btn-sm) {
    font-size: 1rem;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
}

.einsatzplanung-page .btn.btn-sm {
    font-size: 0.8125rem !important;
    min-height: 28px !important;
    padding: 0.25rem 0.6rem !important;
}

@media (min-width: 1920px) {
    .einsatzplanung-page .btn.btn-sm {
        font-size: 1rem !important;
        min-height: 38px !important;
        padding: 0.35rem 0.82rem !important;
    }
}

.einsatzplanung-page .btn.btn-primary,
.einsatzplanung-page .btn.btn-outline-primary {
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.einsatzplanung-page .btn.btn-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
}

.einsatzplanung-page .btn.btn-outline-primary {
    color: var(--pba-accent, var(--connie-orange)) !important;
    background: #fff !important;
}

.einsatzplanung-page .btn.btn-outline-primary:hover,
.einsatzplanung-page .btn.btn-outline-primary:focus {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.einsatzplanung-page .btn.btn-primary:hover,
.einsatzplanung-page .btn.btn-primary:focus {
    filter: brightness(0.94);
}

.einsatzplanung-page #start-btn {
    min-height: 40px;
}

.einsatzplanung-page .card-disabled {
    opacity: 0.5;
    pointer-events: none;
    position: relative;
}

.einsatzplanung-page .card-disabled::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 1;
}

.einsatzplanung-page .einsatzplan-kalender-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr));
    gap: 10px 12px;
    padding: 10px 0;
}

.einsatzplanung-page .einsatzplan-month {
    padding: 6px 0 0;
}

.einsatzplanung-page .einsatzplan-month-title {
    font-size: 14px;
    color: #b6bcc6;
    font-weight: 600;
    text-align: center;
    margin-bottom: 6px;
}

.einsatzplanung-page .einsatzplan-head {
    display: grid;
    grid-template-columns: 28px repeat(7, 14px);
    gap: 6px;
    justify-content: center;
    margin-bottom: 6px;
    color: #c7ccd5;
    font-size: 11px;
    font-weight: 600;
}

.einsatzplanung-page .einsatzplan-head .kw-h {
    width: 28px;
    text-align: right;
    padding-right: 2px;
}

.einsatzplanung-page .einsatzplan-head .dow {
    width: 14px;
    text-align: center;
}

.einsatzplanung-page .einsatzplan-days {
    display: grid;
    grid-template-columns: 28px repeat(7, 14px);
    gap: 6px;
    justify-content: center;
}

.einsatzplanung-page .einsatzplan-kw {
    width: 28px;
    height: 14px;
    font-size: 11px;
    color: #c7ccd5;
    font-weight: 700;
    text-align: center;
    padding-right: 2px;
    line-height: 14px;
}

.einsatzplanung-page .einsatzplan-cell {
    width: 14px;
    height: 14px;
    border-radius: 4px;
    background: transparent;
    position: relative;
    overflow: hidden;
    border: 1px solid #e5e7eb;
}

.einsatzplanung-page .einsatzplan-cell.empty {
    border: none;
    pointer-events: none;
}

.einsatzplanung-page .einsatzplan-cell::after {
    content: attr(data-day);
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font-size: 9px;
    font-weight: 800;
    color: rgba(17, 24, 39, 0.95);
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.12s ease, transform 0.12s ease;
}

.einsatzplanung-page .einsatzplan-cell:hover::after {
    opacity: 1;
    transform: scale(1);
}

.einsatzplanung-page .einsatzplan-cell.praktische-ausbildung {
    background: #34c759;
}

.einsatzplanung-page .einsatzplan-cell.free {
    background: #cfd4d8;
}

.einsatzplanung-page .einsatzplan-cell.preview-assigned {
    background: #34c759;
    border-color: #1f9a46;
    box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.22);
}

.einsatzplanung-page .einsatzplan-cell.preview-assigned::before {
    content: attr(data-count);
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 12px;
    height: 12px;
    padding: 0 2px;
    border-radius: 10px;
    background: #1c5224;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
}

.einsatzplanung-page .form-check,
#planningSettingsModal .form-check,
#azubiFilterModal .form-check,
#kategorieModal .form-check {
    padding: 5px 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

#planningSettingsModal .form-check {
    gap: 10px;
}

#planningSettingsModal .form-check-label {
    margin-right: 6px;
    white-space: nowrap;
}

.planning-settings-modal-dialog {
    width: 95vw;
    max-width: 1500px;
}

.planning-settings-help {
    font-size: 0.86rem;
    line-height: 1.2;
    margin: 0;
    white-space: nowrap;
    flex: 1 1 auto;
}

.einsatzplanung-page .form-check-input,
#planningSettingsModal .form-check-input,
#azubiFilterModal .form-check-input,
#kategorieModal .form-check-input {
    position: static;
    margin: 0;
    margin-top: 3px;
}

#available-periods-box .form-check-label {
    font-size: 0.8rem;
    margin-bottom: 0;
}

.einsatzplanung-periods-hint {
    font-size: 0.8rem;
}

.einsatzplanung-modal .einsaetze-link,
.einsatzplanung-page .einsaetze-link {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.85rem;
    color: #007bff;
    background-color: #e7f3ff;
    border: 1px solid #007bff;
    border-radius: 4px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.einsatzplanung-modal .einsaetze-link:hover,
.einsatzplanung-page .einsaetze-link:hover {
    color: #fff;
    background-color: #007bff;
    text-decoration: none;
    cursor: pointer;
}

.einsatzplanung-modal .modal-footer {
    gap: 8px;
}

.einsatzplanung-modal .modal-footer .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
}

.einsatzplanung-modal .modal-footer .btn:focus,
.einsatzplanung-modal .modal-footer .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

.einsatzplanung-modal .modal-footer .btn[data-dismiss="modal"],
.einsatzplanung-modal .modal-footer .btn.btn-secondary,
.einsatzplanung-modal .modal-footer .btn.btn-outline-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.einsatzplanung-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.einsatzplanung-modal .modal-footer .btn.btn-secondary:hover,
.einsatzplanung-modal .modal-footer .btn.btn-outline-secondary:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

.einsatzplanung-modal .modal-footer .btn.btn-primary,
.einsatzplanung-modal .modal-footer .btn.btn-success,
.einsatzplanung-modal .modal-footer .btn.btn-warning,
.einsatzplanung-modal .modal-footer .btn.btn-outline-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.einsatzplanung-modal .modal-footer .btn.btn-primary:hover,
.einsatzplanung-modal .modal-footer .btn.btn-success:hover,
.einsatzplanung-modal .modal-footer .btn.btn-warning:hover,
.einsatzplanung-modal .modal-footer .btn.btn-outline-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

.einsatzplanung-success-header {
    background-color: #1c5224;
}

.einsatzplanung-calendar-container {
    min-height: 500px;
}

.einsatzplanung-preview-warning {
    display: none;
}

.einsatzplanung-preview-calendar {
    min-height: 180px;
}

@media (max-width: 1620px) {
    .einsatzplanung-page .card-header {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 6px;
    }
}

@media (max-width: 1399.98px) {
    .planning-settings-modal-dialog {
        width: auto;
        max-width: 1140px;
    }

    .planning-settings-help {
        white-space: normal;
        font-size: 0.82rem;
        line-height: 1.25;
    }
}

@media (max-width: 991.98px) {
    .planning-settings-modal-dialog {
        max-width: 96vw;
    }

    .einsatzplanung-page .einsatzplan-kalender-grid {
        grid-template-columns: repeat(3, minmax(140px, 1fr));
    }
}

@media (max-width: 767.98px) {
    .einsatzplanung-page .einsatzplan-kalender-grid {
        grid-template-columns: repeat(2, minmax(120px, 1fr));
    }

    .einsatzplanung-page .einsatzplanung-azubis-list,
    .einsatzplanung-page .einsatzplanung-beratungsstelle-list {
        max-height: 420px;
    }
}

/* Beratungsstelleverbund */

.beratungsstelleverbund-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

#modal-edit-beratungsstelleverbund-traeger .modal-footer {
    gap: 10px;
}

#modal-edit-beratungsstelleverbund-traeger .modal-footer .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

#modal-edit-beratungsstelleverbund-traeger .modal-footer .btn:focus,
#modal-edit-beratungsstelleverbund-traeger .modal-footer .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

#modal-edit-beratungsstelleverbund-traeger .modal-footer .btn[data-dismiss="modal"] {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

#modal-edit-beratungsstelleverbund-traeger .modal-footer .btn[data-dismiss="modal"]:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

#modal-edit-beratungsstelleverbund-traeger .modal-footer .btn[type="submit"] {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

#modal-edit-beratungsstelleverbund-traeger .modal-footer .btn[type="submit"]:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

/* Ausbildungsplaene */

.plaene-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.plaene-page .plaene-block-legend {
    font-size: 12px;
}

.plaene-modal .modal-dialog.plaene-modal-xl-dialog {
    max-width: 1152px;
    width: calc(100% - 2rem);
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.plaene-modal .plaene-modal-body {
    max-height: calc(100vh - 180px);
    overflow-y: auto;
    padding-top: 0.5rem;
}

/* Kopfbereich kompakter, damit Kalender + Steuerung ohne Body-Scrollbalken in den Dialog passen */
.plaene-modal .plaene-modal-body .form-group.row {
    margin-bottom: 0.45rem;
}
.plaene-modal .plaene-modal-body hr {
    margin-top: 0.6rem;
    margin-bottom: 0.6rem;
}

.plaene-modal .plaene-tab-content {
    margin-top: 12px;
}

.plaene-modal .plaene-assistent-swatch {
    width: 28px;
    height: 28px;
    border-radius: 5px;
    border: 1px solid #dee2e6;
}

.plaene-modal [id^="btn-assistent-"],
.plaene-modal [id^="btn-holiday-import-"],
.plaene-modal [id^="btn-view-types-"],
.plaene-modal [id^="btn-view-blocks-"],
.plaene-modal .plaene-add-module-btn {
    border-radius: 10px;
    min-height: 34px;
    padding: 0.28rem 0.72rem;
    font-weight: 600;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.plaene-modal [id^="btn-assistent-"],
.plaene-modal [id^="btn-holiday-import-"],
.plaene-modal .plaene-add-module-btn,
.plaene-modal [id^="btn-view-types-"].btn-outline-primary,
.plaene-modal [id^="btn-view-blocks-"].btn-outline-primary {
    color: var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.plaene-modal [id^="btn-assistent-"]:hover,
.plaene-modal [id^="btn-holiday-import-"]:hover,
.plaene-modal .plaene-add-module-btn:hover,
.plaene-modal [id^="btn-view-types-"].btn-outline-primary:hover,
.plaene-modal [id^="btn-view-blocks-"].btn-outline-primary:hover {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    transform: translateY(-1px);
}

.plaene-modal [id^="btn-view-types-"].btn-primary,
.plaene-modal [id^="btn-view-blocks-"].btn-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.plaene-modal [id^="btn-view-types-"].btn-primary:hover,
.plaene-modal [id^="btn-view-blocks-"].btn-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

.plaene-modal [id^="btn-assistent-"]:focus,
.plaene-modal [id^="btn-assistent-"]:focus-visible,
.plaene-modal [id^="btn-holiday-import-"]:focus,
.plaene-modal [id^="btn-holiday-import-"]:focus-visible,
.plaene-modal [id^="btn-view-types-"]:focus,
.plaene-modal [id^="btn-view-types-"]:focus-visible,
.plaene-modal [id^="btn-view-blocks-"]:focus,
.plaene-modal [id^="btn-view-blocks-"]:focus-visible,
.plaene-modal .plaene-add-module-btn:focus,
.plaene-modal .plaene-add-module-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

#modal-edit-plan .modal-footer {
    gap: 10px;
    flex-wrap: wrap;
}

#modal-edit-plan .modal-footer .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

#modal-edit-plan .modal-footer .btn:focus,
#modal-edit-plan .modal-footer .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

#modal-edit-plan .modal-footer .btn[data-dismiss="modal"] {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

#modal-edit-plan .modal-footer .btn[data-dismiss="modal"]:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

#modal-edit-plan .modal-footer #create-taetigkeitsberichte-btn,
#modal-edit-plan .modal-footer #edit-submit-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

#modal-edit-plan .modal-footer #create-taetigkeitsberichte-btn:hover,
#modal-edit-plan .modal-footer #edit-submit-btn:hover {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    transform: translateY(-1px);
}

#modal-edit-plan .modal-footer #edit-submit-close-btn {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

#modal-edit-plan .modal-footer #edit-submit-close-btn:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

#modal-taetigkeitsberichte-create .modal-footer,
#modal-taetigkeitsberichte-confirm .modal-footer {
    gap: 10px;
    flex-wrap: wrap;
}

#modal-taetigkeitsberichte-create .modal-footer .btn,
#modal-taetigkeitsberichte-confirm .modal-footer .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

#modal-taetigkeitsberichte-create .modal-footer .btn:focus,
#modal-taetigkeitsberichte-create .modal-footer .btn:focus-visible,
#modal-taetigkeitsberichte-confirm .modal-footer .btn:focus,
#modal-taetigkeitsberichte-confirm .modal-footer .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

#modal-taetigkeitsberichte-create .modal-footer .btn[data-dismiss="modal"],
#modal-taetigkeitsberichte-confirm .modal-footer .btn[data-dismiss="modal"] {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

#modal-taetigkeitsberichte-create .modal-footer .btn[data-dismiss="modal"]:hover,
#modal-taetigkeitsberichte-confirm .modal-footer .btn[data-dismiss="modal"]:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
}

#taetigkeitsberichte-create-submit,
#taetigkeitsberichte-confirm-yes {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

#taetigkeitsberichte-create-submit:hover,
#taetigkeitsberichte-confirm-yes:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

#taetigkeitsberichte-toast.toast-success {
    bottom: 30px;
    right: 30px;
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    animation: slideInUp 0.5s ease-out;
}

#taetigkeitsberichte-toast.toast-error {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
}

@media (max-width: 1199.98px) {
    #sidebar {
        position: fixed;
        top: 0;
        left: calc(-1 * (var(--sidebar-width) + 24px));
        height: 100vh;
        margin-top: 72px !important;
        background: transparent;
        z-index: 1040;
        transition: left 0.2s ease;
    }

    #sidebar.mobile-open {
        left: 0;
    }

    #sidebar .sidebar-shell {
        height: calc(100vh - 96px);
        top: 0;
        border-radius: 0 15px 15px 0;
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
        overflow: hidden;
    }

    #sidebar-nav {
        flex: 1 1 auto;
        overflow-y: auto;
        padding-right: 2px;
    }
}

@media (max-width: 767.98px) {
    .pba-jahrgaenge-row > [class*="col-"] {
        margin-bottom: 8px;
    }

    .pba-jahrgaenge-row > [class*="col-"]:last-child {
        margin-bottom: 0;
    }

    .pba-jahrgaenge-row .remove-row,
    .pba-jahrgaenge-add-row {
        width: 100%;
    }

    .auszubildende-gps-wrap {
        justify-content: stretch;
    }

    .auszubildende-gps-btn {
        width: 100%;
    }

    #modal-edit-plan .modal-footer .btn {
        width: 100%;
    }
}

/* Beratungsstellendetails */

.beratungsstellendetails-page .message-hub-main {
    padding: 16px 18px;
}

.beratungsstellendetails-page .beratungsstellendetails-card {
    padding: 18px 20px;
}

.beratungsstellendetails-page .beratungsstellendetails-card hr {
    margin-top: 0;
    margin-bottom: 16px;
    border-color: rgba(15, 23, 42, 0.08);
}

.beratungsstellendetails-page .beratungsstellendetails-card .form-group {
    margin-bottom: 12px;
}

.beratungsstellendetails-page .beratungsstellendetails-card .col-form-label {
    color: #334155;
    font-weight: 600;
}

.beratungsstellendetails-page .beratungsstellendetails-card .form-control,
.beratungsstellendetails-page .beratungsstellendetails-card textarea.form-control {
    border-radius: 8px;
}

.beratungsstellendetails-page .beratungsstellendetails-card textarea.form-control {
    min-height: 88px;
}

.beratungsstellendetails-page .beratungsstellendetails-actions {
    margin-top: 14px;
}

.beratungsstellendetails-page .beratungsstellendetails-actions .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.beratungsstellendetails-page .beratungsstellendetails-actions .btn:focus,
.beratungsstellendetails-page .beratungsstellendetails-actions .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

.beratungsstellendetails-page .beratungsstellendetails-actions .btn.btn-outline-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.beratungsstellendetails-page .beratungsstellendetails-actions .btn.btn-outline-secondary:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
    transform: translateY(-1px);
}

.beratungsstellendetails-page .beratungsstellendetails-actions .btn.btn-primary {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.beratungsstellendetails-page .beratungsstellendetails-actions .btn.btn-primary:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

@media (max-width: 767.98px) {
    .beratungsstellendetails-page .beratungsstellendetails-card {
        padding: 14px;
    }
}

/* Blockplanung */

.blockplanung-page .message-hub-main > div[class$="-container"] {
    margin-top: 0 !important;
}

.blockplanung-page-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.blockplanung-page-toolbar .blockplanung-top-btn {
    color: var(--pba-accent, var(--connie-orange)) !important;
    border: 1px solid var(--pba-accent, var(--connie-orange)) !important;
    background: transparent !important;
    border-radius: 0.35rem;
    min-height: 38px;
    box-shadow: none;
    opacity: 0.9;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease;
}

.blockplanung-page-toolbar .blockplanung-top-btn:hover,
.blockplanung-page-toolbar .blockplanung-top-btn:focus {
    color: #fff !important;
    background-color: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
    opacity: 1;
    transform: translateY(-1px);
}

.blockplanung-page .blockplanung-multimenu-wrap {
    margin-left: 0;
}

.blockplanung-modal .modal-footer {
    gap: 10px;
}

.blockplanung-modal .modal-footer .btn {
    border-radius: 10px;
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    font-weight: 600;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.blockplanung-modal .modal-footer .btn:focus,
.blockplanung-modal .modal-footer .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--pba-accent-rgb, 28, 82, 36), 0.2) !important;
}

.blockplanung-modal .modal-footer .btn[data-dismiss="modal"],
.blockplanung-modal .modal-footer .btn.btn-outline-secondary {
    color: #475569 !important;
    background: #fff !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

.blockplanung-modal .modal-footer .btn[data-dismiss="modal"]:hover,
.blockplanung-modal .modal-footer .btn.btn-outline-secondary:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.3) !important;
    transform: translateY(-1px);
}

.blockplanung-modal .modal-footer .btn.btn-primary,
.blockplanung-modal .modal-footer .btn.btn-danger,
.blockplanung-modal .modal-footer .btn.btn-warning,
.blockplanung-modal .modal-footer .btn[type="submit"] {
    color: #fff !important;
    background: var(--pba-accent, var(--connie-orange)) !important;
    border-color: var(--pba-accent, var(--connie-orange)) !important;
}

.blockplanung-modal .modal-footer .btn.btn-primary:hover,
.blockplanung-modal .modal-footer .btn.btn-danger:hover,
.blockplanung-modal .modal-footer .btn.btn-warning:hover,
.blockplanung-modal .modal-footer .btn[type="submit"]:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

/* Blockplanung Diagramm */

.blockplanung-diagramm-page .message-hub-main {
    padding: 16px 18px;
}

.blockplanung-diagramm-page .blockplanung-diagramm-filter-card {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    box-shadow: none;
}

.blockplanung-diagramm-page .blockplanung-diagramm-filter-body {
    padding: 12px 14px;
}

.blockplanung-diagramm-page .blockplanung-diagramm-select {
    min-width: 220px;
    border-radius: 8px;
    border-color: rgba(15, 23, 42, 0.12);
    box-shadow: none;
}

.blockplanung-diagramm-page .blockplanung-diagramm-select:focus {
    border-color: rgba(51, 65, 85, 0.35);
    box-shadow: 0 0 0 3px rgba(51, 65, 85, 0.08);
}

.blockplanung-diagramm-page .blockplanung-diagramm-toolbar-btn {
    border-radius: 8px;
    min-height: 34px;
    padding: 0.34rem 0.82rem;
    font-weight: 600;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.blockplanung-diagramm-page .btn.btn-outline-secondary.blockplanung-diagramm-toolbar-btn {
    color: #475569;
    background: #fff;
    border-color: rgba(15, 23, 42, 0.2);
}

.blockplanung-diagramm-page .btn.btn-outline-secondary.blockplanung-diagramm-toolbar-btn:hover,
.blockplanung-diagramm-page .btn.btn-outline-secondary.blockplanung-diagramm-toolbar-btn:focus {
    color: #0f172a;
    background: #f8fafc;
    border-color: rgba(15, 23, 42, 0.3);
    transform: translateY(-1px);
}

.blockplanung-diagramm-page .btn.btn-primary.blockplanung-diagramm-toolbar-btn,
.blockplanung-diagramm-page .btn.btn-success.blockplanung-diagramm-toolbar-btn {
    color: #fff;
    background: var(--pba-accent, var(--connie-orange));
    border-color: var(--pba-accent, var(--connie-orange));
}

.blockplanung-diagramm-page .btn.btn-primary.blockplanung-diagramm-toolbar-btn:hover,
.blockplanung-diagramm-page .btn.btn-success.blockplanung-diagramm-toolbar-btn:hover {
    filter: brightness(0.94);
    transform: translateY(-1px);
}

.blockplanung-diagramm-page #diagramm-area {
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 12px;
}

@media (max-width: 991.98px) {
    .blockplanung-diagramm-page .blockplanung-diagramm-select {
        min-width: 180px;
    }
}

/* =====================================================================
   Einheitlicher "+N"-Aufklappknopf für kompakte Badge-Listen in ALLEN
   Tabellen (Kategorien, Kennzeichen ...). Markup: System::collapse_badges(),
   Verhalten: public/js/pba-badge-collapse.js
   ===================================================================== */
/* Einheitliche Farb-Vorschau in Tabellen (System::color_swatch()).
   Hover zeigt den Hex-Code, Klick kopiert ihn (pba-color-copy.js). */
.pba-color-copy {
    display: inline-block;
    width: 28px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.18);
    cursor: pointer;
    vertical-align: middle;
    transition: box-shadow .12s ease, transform .12s ease;
}
.pba-color-copy:hover {
    box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.18);
}
.pba-color-copy:active {
    transform: scale(0.92);
}
.pba-color-copy-toast {
    position: fixed;
    z-index: 20050;
    background: #0f172a;
    color: #fff;
    font-size: .72rem;
    font-weight: 600;
    padding: .18rem .5rem;
    border-radius: 6px;
    pointer-events: none;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .3);
    opacity: 0;
    transform: translateY(4px);
    transition: opacity .12s ease, transform .12s ease;
}
.pba-color-copy-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Eingeklappt: strikt einzeilig (Zeile bleibt niedrig). Überlaufende Badges
   werden per JS ausgeblendet; passt alles, wird der "+N"-Knopf ausgeblendet. */
.pba-badge-collapse {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 2px 3px;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}
/* Aufgeklappt: alle Badges zeigen, Umbruch erlaubt (Zeile darf wachsen). */
.pba-badge-collapse.is-open {
    flex-wrap: wrap;
    overflow: visible;
}
.pba-badge-collapse .badge { white-space: nowrap; flex: 0 0 auto; }
/* Einheitliche Badge-Größe in ALLEN Tabellen, unabhängig von seiten-spezifischen
   Regeln (z. B. .auszubildende-page macht Badges sonst größer/runder). Spezifität
   .badge.badge-pill + späterer Quellort schlägt diese Seitenregeln. */
.pba-badge-collapse .badge.badge-pill {
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    padding: 0.25em 0.6em;
    border-radius: 10rem;
    vertical-align: middle;
}
.pba-badge-toggle {
    flex: 0 0 auto;
    border: 0;
    background: #eef2f7;
    color: #475569;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1.4;
    border-radius: 10px;
    padding: .02rem .45rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    white-space: nowrap;
}
.pba-badge-toggle[hidden] { display: none; }
.pba-badge-toggle:hover { background: #e2e8f0; }
.pba-badge-toggle .fa-chevron-down { font-size: .6rem; transition: transform .15s ease; }
.pba-badge-collapse.is-open .pba-badge-toggle .fa-chevron-down { transform: rotate(180deg); }
/* Aufgeklappt ergibt die Zahl keinen Sinn mehr → ausblenden, nur Pfeil bleibt. */
.pba-badge-collapse.is-open .pba-badge-count { display: none; }