.team-schedule-boot,
.team-schedule-access {
    min-height: 100vh;
    padding: 24px;
    display: grid;
    place-items: center;
    text-align: center;
}

.team-schedule-boot .brand-mark { margin: 0 auto 18px; }
.team-schedule-boot p { color: var(--muted); }
.team-schedule-access .login-panel { text-align: left; }
.action-link { display: inline-grid; place-items: center; text-decoration: none; }

.team-schedule-page {
    min-width: 0;
    padding: 28px clamp(18px, 3vw, 42px) 56px;
}

.month-toolbar,
.schedule-tools {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
}

.month-toolbar { margin-bottom: 14px; }
.month-navigation,
.month-options,
.schedule-view-toggle,
.schedule-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
}

.month-navigation label { min-width: 172px; }
.month-navigation input { color-scheme: dark; }
.month-arrow { min-width: 46px; min-height: 46px; padding-inline: 10px; }
.compact-control {
    min-height: 46px;
    padding: 0 13px;
    grid-template-columns: 22px auto;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #07111e;
    cursor: pointer;
}
.compact-control input { width: 22px; min-height: 22px; }

.schedule-view-toggle {
    padding: 3px;
    flex-wrap: nowrap;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #07111e;
}
.schedule-view-toggle button {
    min-height: 40px;
    padding: 0 14px;
    color: var(--muted);
    border: 0;
    border-radius: 5px;
    background: transparent;
    font-weight: 750;
}
.schedule-view-toggle button.active { color: #051425; background: var(--accent); }

.schedule-explanation {
    margin: 16px 0 22px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #091522d9;
}
.schedule-explanation div { min-width: 0; padding: 15px 17px; }
.schedule-explanation div + div { border-left: 1px solid var(--line); }
.schedule-explanation strong,
.schedule-explanation span { display: block; }
.schedule-explanation strong { margin-bottom: 5px; color: var(--accent); font-size: 13px; }
.schedule-explanation span { color: var(--muted); font-size: 12px; line-height: 1.45; }

.team-schedule-metrics .metric { min-height: 110px; }
.team-schedule-metrics .metric strong { margin: 11px 0 5px; font-size: 27px; }
.team-schedule-metrics .warning { color: var(--danger); }

.month-control {
    margin: 22px 0;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: linear-gradient(145deg, #0a1727e8, #091421d9);
}
.month-control.busy { pointer-events: none; }
.month-control-heading,
.control-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}
.month-control-heading h3,
.control-panel-heading h4 { margin: 2px 0 5px; }
.month-control-heading > div > p:last-child,
.control-panel-heading p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.month-control-status {
    flex: 0 0 auto;
    min-height: 30px;
    padding: 7px 10px;
    color: #a7c9e8;
    border: 1px solid #315879;
    border-radius: 999px;
    background: #0b2033;
    font-size: 10px;
    font-weight: 800;
}
.week-status-list {
    margin-top: 16px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    gap: 10px;
}
.week-status-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #284761;
    border-radius: 7px;
    background: #071624;
}
.week-status-card.selected { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.week-status-card.status-needs_attention { border-color: #8b4b57; background: #24151c; }
.week-status-card.status-ready { border-color: #3f806c; background: #0d241e; }
.week-status-card.status-published { border-color: #35715e; background: #0c211b; }
.week-status-card.status-not_started { border-color: #33475a; }
.week-status-main {
    min-height: 104px;
    padding: 13px;
    display: grid;
    align-content: start;
    gap: 5px;
    color: inherit;
    text-decoration: none;
}
.week-status-main span { color: var(--muted); font-size: 11px; }
.week-status-main strong { color: var(--text); font-size: 15px; }
.week-status-main small { color: #9eb2c5; font-size: 10px; line-height: 1.35; }
.week-status-card.status-needs_attention .week-status-main strong { color: #ffabb2; }
.week-status-card.status-ready .week-status-main strong,
.week-status-card.status-published .week-status-main strong { color: #7fe0bd; }
.week-status-main:hover { background: #10253a; }
.week-history-button {
    width: 100%;
    min-height: 44px;
    padding: 0 12px;
    color: #91c9f7;
    border: 0;
    border-top: 1px solid #284761;
    background: #0a1b2b;
    font-weight: 750;
}
.week-history-button:hover,
.week-history-button[aria-current="true"] { color: #061421; background: var(--accent); }
.month-control-tabs {
    margin-top: 18px;
    padding: 3px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #07111e;
}
.month-control-tabs button {
    min-height: 44px;
    padding: 8px 13px;
    color: var(--muted);
    border: 0;
    border-radius: 5px;
    background: transparent;
    font-weight: 800;
}
.month-control-tabs button.active { color: #051425; background: var(--accent); }
.month-control-panel { margin-top: 12px; padding: 17px; border: 1px solid #223d56; border-radius: 7px; background: #071522; }
.history-boundary-note { margin: 12px 0; padding: 10px 12px; color: #d7c494; border-left: 3px solid var(--amber); background: #2b2416; font-size: 11px; line-height: 1.45; }
.schedule-change-list { display: grid; gap: 8px; }
.schedule-change-item {
    min-width: 0;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid #29455d;
    border-radius: 6px;
    background: #091927;
}
.schedule-change-item.kind-manual_working,
.schedule-change-item.kind-manual_nonworking { border-left: 3px solid var(--amber); }
.schedule-change-item.kind-undo { border-left: 3px solid #67cda9; }
.schedule-change-copy { min-width: 0; }
.schedule-change-copy > strong,
.schedule-change-copy > span { display: block; }
.schedule-change-copy > strong { font-size: 12px; }
.schedule-change-copy > span { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.schedule-change-diff { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.schedule-change-diff span { max-width: 100%; padding: 5px 7px; color: #cbdbea; border: 1px solid #31506b; border-radius: 4px; background: #0d2133; font-size: 10px; line-height: 1.35; }
.schedule-change-diff b { color: #8cbce3; }
.schedule-change-actions { flex: 0 0 auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.schedule-change-actions .compact { min-height: 40px; }
.undo-change-button { color: #ffd2d6; border-color: #864752; }
.control-empty { min-height: 84px; display: grid; place-items: center; color: var(--muted); text-align: center; font-size: 12px; }
.manual-corrections-summary { margin-bottom: 12px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.manual-corrections-summary article { min-height: 70px; padding: 11px; border: 1px solid #29455d; border-radius: 6px; background: #0a1b2a; }
.manual-corrections-summary span,
.manual-corrections-summary strong { display: block; }
.manual-corrections-summary span { color: var(--muted); font-size: 10px; }
.manual-corrections-summary strong { margin-top: 7px; font-size: 20px; }
.load-more-button { width: 100%; min-height: 44px; margin-top: 10px; }

.schedule-tools { margin: 0 0 14px; }
.employee-search { width: min(360px, 100%); }
.schedule-legend { justify-content: flex-end; color: var(--muted); font-size: 11px; }
.schedule-legend span { display: inline-flex; align-items: center; gap: 6px; }
.schedule-legend i { width: 18px; height: 12px; display: inline-block; border-radius: 3px; }
.legend-shift { border: 1px solid #46749d; background: #102d49; }
.legend-department { border: 1px solid #447a67; background: #14392e; }
.legend-department-off { border: 1px solid #a57b36; background: #4a3314; }
.legend-off { border: 1px solid #334a61; background: repeating-linear-gradient(135deg, #102339 0 7px, #0b192a 7px 14px); }
.legend-problem { border: 2px solid var(--danger); background: #3c2026; }

.month-grid-shell {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    overscroll-behavior-inline: contain;
    overscroll-behavior-block: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #07111e;
    scrollbar-width: auto;
    scrollbar-color: #5ba8ff #0a1827;
}
.month-grid-shell::-webkit-scrollbar { height: 18px; }
.month-grid-shell::-webkit-scrollbar-track {
    background: #0a1827;
    border-top: 1px solid #1f3b55;
    border-radius: 999px;
}
.month-grid-shell::-webkit-scrollbar-thumb {
    min-width: 72px;
    border: 3px solid #0a1827;
    border-radius: 999px;
    background: linear-gradient(90deg, #377fba, #67baff 50%, #377fba);
    box-shadow: inset 0 0 0 1px #8bcaff66;
}
.month-grid-shell::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg, #4699d5, #83c9ff 50%, #4699d5);
}
.month-grid-shell::-webkit-scrollbar-thumb:active {
    background: var(--accent);
}
.month-grid {
    width: max-content;
    min-width: 100%;
    border-spacing: 0;
    border-collapse: separate;
    table-layout: fixed;
}
.month-grid th,
.month-grid td {
    padding: 0;
    border: 0;
    border-right: 1px solid #1b3047;
    border-bottom: 1px solid #1b3047;
    text-align: left;
}
.month-grid tr:last-child th,
.month-grid tr:last-child td { border-bottom: 0; }
.month-grid th:last-child,
.month-grid td:last-child { border-right: 0; }
.month-grid thead th {
    position: sticky;
    z-index: 4;
    top: 0;
    height: 58px;
    color: var(--muted);
    background: #0d2034;
    text-align: center;
}
.month-grid thead .published { box-shadow: inset 0 3px 0 #4ed0a3; }
.month-grid thead .today { background: #15385b; }
.month-grid .weekend { background-color: #081727; }
.month-grid .date-column { width: 118px; min-width: 118px; }
.month-grid .date-column span,
.month-grid .date-column strong { display: block; }
.month-grid .date-column span { margin-bottom: 2px; font-size: 10px; text-transform: uppercase; }
.month-grid .date-column strong { color: var(--text); font-size: 17px; }

.month-grid .employee-column {
    position: sticky;
    z-index: 3;
    left: 0;
    width: 230px;
    min-width: 230px;
    padding: 12px 13px;
    color: var(--text);
    background: #0a1929;
    text-transform: none;
}
.month-grid thead .employee-column { z-index: 6; }
.month-grid .employee-column strong,
.month-grid .employee-column span,
.month-grid .employee-column small { display: block; }
.month-grid .employee-column strong { font-size: 12px; line-height: 1.35; }
.month-grid .employee-column span { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.3; }
.month-grid .employee-column small { margin-top: 5px; color: var(--amber); font-size: 9px; }

.schedule-cell {
    width: 118px;
    min-width: 118px;
    height: 92px;
    padding: 7px !important;
    vertical-align: top;
    background: #07111e;
}
.schedule-cell.problem,
.day-employee-card.problem { box-shadow: inset 0 0 0 2px var(--danger); background: #25151d; }
.shift-line { min-height: 27px; display: grid; align-content: center; gap: 2px; }
.shift-line strong { color: #cad9e8; font-size: 10px; line-height: 1.2; }
.shift-line span { color: var(--muted); font-size: 9px; }
.empty-shift strong { color: #52677c; font-weight: 600; }
.work-shift strong { color: #87c8ff; }
.night-shift strong { color: #bd9bff; }
.day-off-shift,
.vacation-shift,
.sick-shift {
    margin: -7px;
    min-height: 90px;
    padding: 8px;
    background: repeating-linear-gradient(135deg, #102339 0 8px, #0b192a 8px 16px);
}
.vacation-shift strong { color: #d8c8a3; }
.sick-shift strong { color: #e0a8ae; }
.department-list { position: relative; margin-top: 4px; display: grid; gap: 3px; }
.department-chip {
    max-width: 100%;
    padding: 3px 5px;
    overflow: hidden;
    color: #dfffee;
    border: 1px solid #39745f;
    border-radius: 4px;
    background: #10382c;
    font-size: 9px;
    font-weight: 750;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.department-blood { color: #ffd9dc; border-color: #914c57; background: #4a2029; }
.department-clinic { color: #eadcff; border-color: #735293; background: #322344; }
.department-pcr { color: #d8eeff; border-color: #477ca5; background: #173854; }
.department-mpo_smears { color: #edffd1; border-color: #6b8739; background: #2d3d17; }
.department-night { color: #eadfff; border-color: #755aa8; background: #302449; }
.department-quality_control { color: #d9fcf2; border-color: #4f887b; background: #1c3e37; }
.department-day-off { display: block; margin-top: 5px; padding: 4px 6px; color: #ffdc98; border: 1px solid #987137; border-radius: 5px; background: #3d2a11; font-size: 9px; font-weight: 850; line-height: 1.2; text-align: center; }
.cell-warning,
.cell-pending { display: block; margin-top: 5px; font-size: 9px; line-height: 1.2; }
.cell-warning { color: #ff9ca5; font-weight: 800; }
.cell-pending { color: #9bacc0; }

.day-view { min-width: 0; }
.day-tabs {
    padding: 2px 0 10px;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 62px;
    gap: 7px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}
.day-tabs button {
    min-height: 58px;
    position: relative;
    color: var(--muted);
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #07111e;
}
.day-tabs button span,
.day-tabs button strong { display: block; }
.day-tabs button span { font-size: 10px; }
.day-tabs button strong { margin-top: 2px; color: var(--text); font-size: 16px; }
.day-tabs button.active { border-color: var(--accent); background: var(--accent-soft); }
.day-tabs button.has-problem::after { content: ""; position: absolute; right: 5px; top: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--danger); }
.day-schedule { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #07111e; }
.day-heading { padding: 16px; display: flex; align-items: baseline; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); }
.day-heading h3 { margin: 0; text-transform: capitalize; }
.day-heading span { color: var(--muted); font-size: 11px; }
.day-employee-card { min-height: 84px; padding: 13px 15px; display: grid; grid-template-columns: minmax(180px, 1fr) minmax(230px, 2fr); align-items: center; gap: 18px; border-bottom: 1px solid #1b3047; }
.day-employee-card:last-child { border-bottom: 0; }
.day-employee strong,
.day-employee span { display: block; }
.day-employee strong { font-size: 13px; }
.day-employee span { margin-top: 4px; color: var(--muted); font-size: 10px; }
.day-cell .department-list { display: flex; flex-wrap: wrap; }
.day-cell .department-chip { font-size: 10px; }

.team-schedule-page .empty { min-height: 160px; display: grid; place-items: center; }
.team-schedule-page.busy,
#teamScheduleApp.busy .team-schedule-page { opacity: .72; }
#teamScheduleApp.busy { cursor: wait; }

@media (max-width: 1100px) {
    .month-toolbar,
    .schedule-tools { align-items: stretch; flex-direction: column; }
    .schedule-legend { justify-content: flex-start; }
    .schedule-explanation { grid-template-columns: 1fr; }
    .schedule-explanation div + div { border-top: 1px solid var(--line); border-left: 0; }
}

@media (max-width: 700px) {
    .team-schedule-page { padding: 18px 12px 36px; }
    .month-navigation { display: grid; grid-template-columns: 46px minmax(0, 1fr) 46px; }
    .month-navigation label { min-width: 0; }
    .month-navigation #currentMonth { grid-column: 1 / -1; min-height: 46px; }
    .month-options { display: grid; grid-template-columns: 1fr; }
    .compact-control { min-height: 50px; }
    .schedule-view-toggle { display: grid; grid-template-columns: 1fr 1fr; }
    .schedule-view-toggle button { min-height: 44px; }
    .team-schedule-metrics { grid-template-columns: repeat(2, 1fr); }
    .team-schedule-metrics .metric { min-height: 98px; padding: 14px; }
    .month-control { margin-inline: -12px; padding: 14px 12px; border-right: 0; border-left: 0; border-radius: 0; }
    .month-control-heading,
    .control-panel-heading { flex-direction: column; gap: 8px; }
    .month-control-status { align-self: flex-start; }
    .week-status-list {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: minmax(240px, 84vw);
        overflow-x: auto;
        overflow-y: visible;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x proximity;
    }
    .week-status-card { scroll-snap-align: start; }
    .month-control-panel { padding: 13px; }
    .schedule-change-item { align-items: stretch; flex-direction: column; }
    .schedule-change-actions { display: grid; grid-template-columns: 1fr; }
    .schedule-change-actions .compact { width: 100%; min-height: 44px; }
    .manual-corrections-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .employee-search { width: 100%; }
    .month-grid-shell { margin-inline: -12px; border-right: 0; border-left: 0; border-radius: 0; }
    .month-grid .employee-column { width: 160px; min-width: 160px; }
    .day-employee-card { grid-template-columns: 1fr; gap: 9px; }
    .day-heading { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 420px) {
    .team-schedule-metrics { grid-template-columns: 1fr; }
    .schedule-explanation div { padding: 13px; }
}