@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.olwso25aue.bundle.scp.css';

/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-coq0el67m3],
.components-reconnect-repeated-attempt-visible[b-coq0el67m3],
.components-reconnect-failed-visible[b-coq0el67m3],
.components-pause-visible[b-coq0el67m3],
.components-resume-failed-visible[b-coq0el67m3],
.components-rejoining-animation[b-coq0el67m3] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-retrying[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-failed[b-coq0el67m3],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-coq0el67m3] {
    display: block;
}


#components-reconnect-modal[b-coq0el67m3] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-coq0el67m3 0.5s both;
}

#components-reconnect-modal[open][b-coq0el67m3] {
    animation: components-reconnect-modal-slideUp-b-coq0el67m3 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-coq0el67m3 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

#components-reconnect-modal[b-coq0el67m3]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-coq0el67m3 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-coq0el67m3 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-coq0el67m3 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-coq0el67m3 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-coq0el67m3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-coq0el67m3] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-coq0el67m3] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-coq0el67m3] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-coq0el67m3] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-coq0el67m3] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-coq0el67m3] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-coq0el67m3 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-coq0el67m3] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-coq0el67m3 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Kompakte Monatsmatrix (Dienstplan) — möglichst viele Tage & MAs auf dem Bildschirm */
.shift-plan-page[b-ngqnfbdngp] {
    /* ~25 % größer als erste Kompaktversion, weiterhin eine Monatsseite im Blick */
    --shift-cell-h: 1.6rem;
    --shift-font: 0.78125rem;
    --shift-absence-bg: #ced4da;
    --shift-absence-bg-hover: #b8c0ca;
    --shift-absence-fg: #fff;
    /* Native <select>-Liste: einheitliche Basiszeile (leer, Gruppe); Schichtfarben per inline auf <option> */
    --shift-dropdown-opt-bg: #fff;
    --shift-dropdown-opt-fg: #212529;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.shift-grid-scroll[b-ngqnfbdngp] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.shift-grid-table[b-ngqnfbdngp] {
    table-layout: fixed;
    width: 100%;
    font-size: var(--shift-font);
    line-height: 1.15;
}

.shift-grid-table thead th[b-ngqnfbdngp],
.shift-grid-table tbody td[b-ngqnfbdngp] {
    border-color: var(--bs-border-color);
}

.shift-grid-th-employee[b-ngqnfbdngp] {
    width: 10.625rem;
    min-width: 10.625rem;
    max-width: 10.625rem;
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.25rem 0.44rem !important;
    vertical-align: bottom;
    white-space: nowrap;
}

.shift-grid-th-day[b-ngqnfbdngp] {
    width: auto;
    min-width: 0;
    padding: 0.15rem 0.1rem !important;
    font-size: 0.725rem;
    font-weight: 600;
    line-height: 1.1;
    vertical-align: middle;
}

.shift-grid-day-label[b-ngqnfbdngp] {
    display: block;
    white-space: nowrap;
    letter-spacing: -0.02em;
}

.shift-grid-hl[b-ngqnfbdngp] {
    display: inline-block;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.075rem 0.15rem;
    border-radius: 0.15rem;
    margin-top: 0.075rem;
    vertical-align: middle;
}

.shift-grid-hl-f[b-ngqnfbdngp] {
    color: #fff;
    background: var(--bs-danger);
}

.shift-grid-hl-s[b-ngqnfbdngp] {
    color: #fff;
    background: var(--bs-success);
}

[data-bs-theme="dark"] .shift-plan-page[b-ngqnfbdngp] {
    --shift-absence-bg: #5c6368;
    --shift-absence-bg-hover: #6c757d;
    --shift-absence-fg: #fff;
    --shift-dropdown-opt-bg: #212529;
    --shift-dropdown-opt-fg: #dee2e6;
}

.shift-grid-legend-absence[b-ngqnfbdngp] {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.1rem 0.22rem;
    border-radius: 0.15rem;
    vertical-align: middle;
    background: var(--shift-absence-bg);
    color: var(--shift-absence-fg);
}

.shift-grid-legend-shift[b-ngqnfbdngp] {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.1rem 0.22rem;
    border-radius: 0.15rem;
    vertical-align: middle;
}

/* Schichtfarbe: Hover per Helligkeit, Fokus-Rahmen (Hintergrund bleibt inline / Stammdaten) */
.shift-grid-cell-shift:not(.shift-grid-cell-absence):hover .shift-grid-select[b-ngqnfbdngp],
.shift-grid-cell-shift:not(.shift-grid-cell-absence) .shift-grid-select:hover[b-ngqnfbdngp] {
    filter: brightness(0.94);
}

.shift-grid-cell-shift:not(.shift-grid-cell-absence) .shift-grid-select:focus[b-ngqnfbdngp] {
    filter: brightness(0.96);
    outline: 1px solid var(--bs-primary);
    outline-offset: -1px;
    position: relative;
    z-index: 1;
}

/* Erste Spalte beim horizontalen Scrollen fixieren */
.shift-grid-table thead th.shift-grid-sticky[b-ngqnfbdngp],
.shift-grid-table tbody td.shift-grid-sticky[b-ngqnfbdngp] {
    position: sticky;
    left: 0;
    z-index: 2;
    box-shadow: 1px 0 0 var(--bs-border-color);
}

.shift-grid-table thead th.shift-grid-sticky[b-ngqnfbdngp] {
    z-index: 4;
    background-color: var(--bs-light) !important;
}

.shift-grid-table tbody td.shift-grid-sticky[b-ngqnfbdngp] {
    background-color: var(--bs-light) !important;
}

.shift-grid-employee[b-ngqnfbdngp] {
    padding: 0.19rem 0.44rem !important;
    vertical-align: middle;
}

.shift-grid-emp-name[b-ngqnfbdngp] {
    font-weight: 600;
    font-size: 0.85rem;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shift-grid-emp-meta[b-ngqnfbdngp] {
    font-size: 0.725rem;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 0.04rem;
    opacity: 0.92;
}

.shift-grid-emp-sep[b-ngqnfbdngp] {
    opacity: 0.45;
    padding: 0 0.12rem;
}

.shift-grid-row-lock[b-ngqnfbdngp] {
    flex-shrink: 0;
    line-height: 1;
    min-width: 1.25rem;
    color: var(--bs-secondary);
}

.shift-grid-row-lock:hover:not(:disabled)[b-ngqnfbdngp] {
    color: var(--bs-primary);
}

.shift-grid-row-lock-muted[b-ngqnfbdngp] {
    opacity: 0.7;
    pointer-events: none;
}

.shift-grid-cell[b-ngqnfbdngp] {
    padding: 0 !important;
    vertical-align: middle;
    text-align: center;
}

/* Flaches Select: Höhe der Bootstrap-Standard-Controls stark reduzieren */
.shift-grid-select[b-ngqnfbdngp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0;
    font-size: var(--shift-font);
    line-height: 1.1;
    padding: 0 0.12rem;
    min-height: var(--shift-cell-h);
    height: var(--shift-cell-h);
    border: none;
    border-radius: 0;
    background-color: transparent;
    background-image: none !important;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    text-align: center;
    text-align-last: center;
    color: var(--bs-body-color);
}

/* Aufgeklappte Liste: einheitlicher Zeilenhintergrund; Abwesenheits-Zeilen wie Matrix */
.shift-grid-select option[b-ngqnfbdngp],
.shift-grid-select optgroup[b-ngqnfbdngp] {
    background-color: var(--shift-dropdown-opt-bg);
    color: var(--shift-dropdown-opt-fg);
}

.shift-grid-select option.shift-grid-opt-absence[b-ngqnfbdngp] {
    background-color: var(--shift-absence-bg);
    color: var(--shift-absence-fg);
}

.shift-grid-cell:hover .shift-grid-select[b-ngqnfbdngp],
.shift-grid-select:hover[b-ngqnfbdngp] {
    background-color: color-mix(in srgb, var(--bs-primary) 7%, transparent);
}

.shift-grid-cell-absence .shift-grid-select[b-ngqnfbdngp] {
    background-color: var(--shift-absence-bg) !important;
    color: var(--shift-absence-fg);
}

.shift-grid-cell-absence:hover .shift-grid-select[b-ngqnfbdngp],
.shift-grid-cell-absence .shift-grid-select:hover[b-ngqnfbdngp] {
    background-color: var(--shift-absence-bg-hover) !important;
    color: var(--shift-absence-fg);
}

.shift-grid-select:focus[b-ngqnfbdngp] {
    outline: 1px solid var(--bs-primary);
    outline-offset: -1px;
    background-color: var(--bs-body-bg);
    position: relative;
    z-index: 1;
}

.shift-grid-cell-absence .shift-grid-select:focus[b-ngqnfbdngp] {
    background-color: var(--shift-absence-bg-hover) !important;
    color: var(--shift-absence-fg);
}

.shift-grid-table tbody td.table-danger .shift-grid-select[b-ngqnfbdngp] {
    background-color: color-mix(in srgb, var(--bs-danger) 18%, transparent);
}

.shift-grid-table tbody td.table-danger.shift-grid-cell-absence .shift-grid-select[b-ngqnfbdngp] {
    background-color: var(--shift-absence-bg) !important;
    color: var(--shift-absence-fg);
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--bs-danger) 55%, transparent);
}

.shift-grid-table tbody td.table-danger.shift-grid-cell-shift:not(.shift-grid-cell-absence) .shift-grid-select[b-ngqnfbdngp] {
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--bs-danger) 55%, transparent);
}

/* Tablet/Touch: größere Schrift in Zellen (≥16px verhindert iOS-Fokus-Zoom), bessere Bedienbarkeit für Select */
@media (pointer: coarse) {
    .shift-plan-page[b-ngqnfbdngp] {
        --shift-cell-h: 2.75rem;
        --shift-font: 1rem;
    }

    .shift-grid-th-day[b-ngqnfbdngp] {
        font-size: 0.8125rem;
    }

    .shift-grid-emp-meta[b-ngqnfbdngp] {
        font-size: 0.78125rem;
    }
}
/* /Components/Pages/Settings.razor.rz.scp.css */
/* Scroll über volle Hauptbreite; Inhalt bleibt im Bootstrap-container (scrollbar rechts am Fenster) */
.settings-page[b-nbc68o8ot7] {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* Einheitliche Struktur für Einstellungs-Formulare */
.settings-page .settings-lead[b-nbc68o8ot7] {
    color: var(--bs-secondary-color);
    font-size: 0.95rem;
    max-width: 52rem;
    margin-bottom: 1.25rem;
}

.settings-page .settings-form-block[b-nbc68o8ot7] {
    background: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
}

.settings-page .settings-form-block:last-child[b-nbc68o8ot7] {
    margin-bottom: 0;
}

.settings-page .settings-form-block-title[b-nbc68o8ot7] {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.045em;
    color: var(--bs-secondary-color);
    margin-bottom: 1rem;
}

.settings-page .settings-form-actions[b-nbc68o8ot7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    padding-top: 0.25rem;
}

.settings-page .settings-data-table[b-nbc68o8ot7] {
    margin-bottom: 0;
}

.settings-page .settings-data-table thead th[b-nbc68o8ot7] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bs-secondary-color);
    border-bottom-width: 1px;
}

/* Großer (nicht Vollbild-) Dialog Mitarbeitende */
.settings-employee-modal.modal.show[b-nbc68o8ot7] {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 1.25rem 1rem;
    min-height: 100dvh;
    overflow-y: auto;
}

.settings-employee-modal .settings-employee-modal-dialog[b-nbc68o8ot7] {
    max-width: min(1280px, 94vw);
    width: 100%;
    margin: 0;
    height: auto;
    max-height: none;
}

.settings-employee-modal .settings-employee-modal-dialog .modal-content[b-nbc68o8ot7] {
    max-height: calc(100dvh - 2.5rem);
}

.settings-employee-modal .modal-content[b-nbc68o8ot7] {
    border: none;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.12);
}

.settings-employee-modal .modal-header[b-nbc68o8ot7] {
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    flex-shrink: 0;
}

.settings-employee-modal .modal-body[b-nbc68o8ot7] {
    background: var(--bs-tertiary-bg);
    padding: 1.25rem 1.5rem;
}

.settings-employee-modal .settings-modal-panel[b-nbc68o8ot7] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}

.settings-employee-modal .settings-modal-panel:last-of-type[b-nbc68o8ot7] {
    margin-bottom: 0;
}

.settings-employee-modal .settings-modal-panel-title[b-nbc68o8ot7] {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.045em;
    color: var(--bs-secondary-color);
    margin-bottom: 1rem;
}

.settings-employee-modal .settings-subhead[b-nbc68o8ot7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--bs-emphasis-color);
    margin-bottom: 0.75rem;
    margin-top: 0.25rem;
}

.settings-employee-modal .settings-subhead:first-child[b-nbc68o8ot7] {
    margin-top: 0;
}

.settings-employee-modal .settings-period-fieldset[b-nbc68o8ot7] {
    border: 1px dashed var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    padding: 0.875rem 1rem;
    margin-bottom: 1rem;
    background: var(--bs-tertiary-bg);
}

.settings-employee-modal .settings-period-fieldset:last-of-type[b-nbc68o8ot7] {
    margin-bottom: 0;
}

.settings-employee-modal .settings-field-label[b-nbc68o8ot7] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bs-secondary-color);
    margin-bottom: 0.5rem;
}

.settings-employee-modal .settings-shift-pills[b-nbc68o8ot7],
.settings-employee-modal .settings-weekday-pills[b-nbc68o8ot7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.75rem;
}

.settings-employee-modal .settings-table-wrap[b-nbc68o8ot7] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    overflow: hidden;
}

.settings-employee-modal .settings-table-caption[b-nbc68o8ot7] {
    caption-side: top;
    padding: 0.75rem 1rem 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--bs-secondary-color);
}

.settings-employee-modal .modal-footer[b-nbc68o8ot7] {
    border-top: 1px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    flex-shrink: 0;
}

/* Kompakte Dialoge (Kategorie, Schicht, Abwesenheit, Deckung, Einsatzzeitraum im Mitarbeitenden-Dialog) */
.settings-item-modal .modal-content[b-nbc68o8ot7] {
    border: none;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.12);
}

.settings-item-modal .modal-header[b-nbc68o8ot7],
.settings-item-modal .modal-footer[b-nbc68o8ot7] {
    flex-shrink: 0;
}

.settings-item-modal .modal-body[b-nbc68o8ot7] {
    /* Einheitliche Höhe: kleine Controls */
}

.settings-item-modal .modal-body .form-control[b-nbc68o8ot7],
.settings-item-modal .modal-body .form-select[b-nbc68o8ot7] {
    min-height: calc(1.5em + 0.5rem + 2px);
}

.settings-item-modal .modal-body label.form-label[b-nbc68o8ot7] {
    margin-bottom: 0.25rem;
}

/* Über dem großen Mitarbeitenden-Dialog (gestapeltes Modal) */
.settings-item-modal-nested[b-nbc68o8ot7] {
    z-index: 1060;
}

/* Tablet/Touch: iOS verzichtet bei <16px auf zuverlässiges Öffnen von Tastatur/Datum-Uhrzeit-Pickern */
@media (pointer: coarse) {
    .settings-page .form-control-sm[b-nbc68o8ot7],
    .settings-page .form-select-sm[b-nbc68o8ot7],
    .settings-item-modal .form-control-sm[b-nbc68o8ot7],
    .settings-item-modal .form-select-sm[b-nbc68o8ot7],
    .settings-employee-modal .form-control-sm[b-nbc68o8ot7],
    .settings-employee-modal .form-select-sm[b-nbc68o8ot7] {
        font-size: 1rem;
        min-height: 2.75rem;
    }

    .settings-page input[type="date"][b-nbc68o8ot7],
    .settings-page input[type="time"][b-nbc68o8ot7],
    .settings-item-modal input[type="date"][b-nbc68o8ot7],
    .settings-item-modal input[type="time"][b-nbc68o8ot7],
    .settings-employee-modal input[type="date"][b-nbc68o8ot7],
    .settings-employee-modal input[type="time"][b-nbc68o8ot7] {
        min-height: 2.75rem;
    }
}