@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';
@import '_content/MrGiffComponents/MrGiffComponents.ysoy4ckvsl.bundle.scp.css';

/* /Components/Absences/AbsencesPage.razor.rz.scp.css */
.contentArea[b-nqkzjpvz4v]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}

.filters__wrapper[b-nqkzjpvz4v] {
    display: flex;
    margin-bottom: 1.5rem;
    gap: 1rem;
    align-items: center;
}

td:first-of-type[b-nqkzjpvz4v] {
    color: var(--clr-text-subtle);
}
/* /Components/Account/Pages/Login.razor.rz.scp.css */
.login__wrapper[b-qqbilgk0s3] {
    display: grid;
    place-items: center;
    min-height: calc(100vh - 3rem);

    section {
        width: 100%;
        max-width: 400px;

        h1 {
            display: inline-block;
        }

        p:first-of-type[b-qqbilgk0s3] {
            margin-top: 1rem;
        }
    }
}
/* /Components/Admin/FeatureFlagsList.razor.rz.scp.css */
/* Row header is for semantics (screen readers announce it per cell), not emphasis */
th[scope="row"][b-ojoiuwtz7u] {
    font-weight: inherit;
}

/* Centre each row's text on the switch, which is taller than a line of text */
th[scope="row"][b-ojoiuwtz7u],
td[b-ojoiuwtz7u] {
    vertical-align: middle;
}
/* /Components/Admin/Pages/Weeks.razor.rz.scp.css */
.contentArea[b-hcplo5xoou]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}
/* /Components/BankHolidaysPage.razor.rz.scp.css */
h1[b-eaxdj0syff] {
    margin-bottom: 1rem;
    display: inline-flex;
    gap: .5rem;
    align-items: center;
}

.bankHolidays[b-eaxdj0syff] {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .25rem;

    li {
        padding: .5rem;
    }
}

.date[b-eaxdj0syff] {
    display: inline-block;
    width: 10rem;
}

.bankHolidays-next[b-eaxdj0syff] {
    color: var(--clr-neutral-50);
    border-top: 1px solid var(--clr-primary-400);
    position: relative;

    @media (min-width: 768px) {
        border-top: none;[b-eaxdj0syff]
    }

    span.nextDate {
        position: relative;

        @media (min-width: 768px) {
            &[b-eaxdj0syff]::before {
                content: attr(data-next-label);
                position: absolute;
                top: 50%;
                left: 100%;
                margin-left: 1rem;
                transform: translateY(-50%);
                display: inline-block;
                padding: .5rem 1rem;
                font-size: .75rem;
                line-height: 1;
                white-space: nowrap;
                background: var(--clr-primary-800);
                color: var(--clr-neutral-100);
                border-radius: .25rem;
            }

            &[b-eaxdj0syff]::after {
                content: "";
                position: absolute;
                top: 50%;
                left: calc(100% + .5rem);
                transform: translateY(-50%);
                width: 0;
                height: 0;
                border-top: .5rem solid transparent;
                border-bottom: .5rem solid transparent;
                border-right: .5rem solid var(--clr-primary-800);
            }
        }
    }
}

.isNewDate[b-eaxdj0syff]{
    color: var(--clr-warning);
}
.tso-warning[b-eaxdj0syff] {
    color: var(--clr-warning);
}

.actions__wrapper[b-eaxdj0syff] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    align-items: center;
}
/* /Components/Layout/LoginDisplay.razor.rz.scp.css */
.actions__wrapper[b-insj4pzure] {
    display: none;

    @media (min-width: 768px) {
        display: flex;
        gap: 1.5rem;
        justify-content: right;
        align-items: center;[b-insj4pzure]
    }
}

    .actions__wrapper > *[b-insj4pzure] {
        margin: 0;
    }
/* /Components/Layout/MainLayout.razor.rz.scp.css */

.page[b-uit3mock1x] {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--clr-neutral-950);

    @media (min-width: 641px) {
        flex-direction: row;[b-uit3mock1x]
    }
}

main[b-uit3mock1x] {
    flex: 1;
}

.sidebar[b-uit3mock1x] {
    background: var(--clr-bg-sidebar);

    @media (min-width: 641px) {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;[b-uit3mock1x]
    }
}

.top-row[b-uit3mock1x] {
    background-color: var(--clr-bg-toprow);
    justify-content: space-between;
    display: flex;
    align-items: center;
    padding: .5rem 1rem;

    @media (min-width: 641px) {
        position: sticky;
        top: 0;
        z-index: 1;
        padding: .75rem 1rem;[b-uit3mock1x]
    }

    .pageTitle {
        font-size: 1.25rem;
        display: inline-flex;
        gap: .5rem;
        align-items: center;
    }

    .actions__wrapper[b-uit3mock1x] {
        margin-left: auto;
    }
}

    .top-row[b-uit3mock1x]  a, .top-row[b-uit3mock1x]  .btn-link {
        white-space: nowrap;
        text-decoration: none;
    }

        .top-row[b-uit3mock1x]  a:hover, .top-row[b-uit3mock1x]  .btn-link:hover {
            text-decoration: underline;
        }

        .top-row[b-uit3mock1x]  a:first-child {
            overflow: hidden;
            text-overflow: ellipsis;
        }

    @media (max-width: 640.98px) {
        .top-row[b-uit3mock1x] {
            justify-content: space-between;
        }

            .top-row[b-uit3mock1x]  a, .top-row[b-uit3mock1x]  .btn-link {
                margin-left: 0;
            }
    }

    @media (min-width: 641px) {
        .top-row.auth[b-uit3mock1x]  a:first-child {
            flex: 1;
            text-align: right;
            width: 0;
        }
    }

    #blazor-error-ui[b-uit3mock1x] {
        background: lightyellow;
        bottom: 0;
        box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
        display: none;
        left: 0;
        padding: 0.6rem 1.25rem 0.7rem 1.25rem;
        position: fixed;
        width: 100%;
        z-index: 1000;
    }

        #blazor-error-ui .dismiss[b-uit3mock1x] {
            cursor: pointer;
            position: absolute;
            right: 0.75rem;
            top: 0.5rem;
        }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-arj25qktvi] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    display: grid;
    place-content: center;
    background: var(--clr-action-secondary-bg);
    border: 1px solid var(--clr-action-secondary-border);
    border-radius: .25rem;
    outline: none;

    @media (min-width: 641px) {
        display: none;[b-arj25qktvi]
    }
}

    /* Hamburger icon, masked so its colour comes from a token. */
    .navbar-toggler[b-arj25qktvi]::before {
        content: '';
        width: 1.75rem;
        height: 1.75rem;
        background-color: var(--clr-action-secondary-text);
        mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='black' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") center / contain no-repeat;
    }

    /* Overrides the generic input hover/focus outline from app.css and Bootstrap's
       .navbar-toggler:focus box-shadow ring. */
    .navbar-toggler:hover[b-arj25qktvi],
    .navbar-toggler:focus[b-arj25qktvi] {
        outline: none;
        box-shadow: none;
    }

    .navbar-toggler:hover[b-arj25qktvi] {
        background: var(--clr-action-secondary-bg-hover);
        border-color: var(--clr-action-secondary-border);
    }

    .navbar-toggler:checked[b-arj25qktvi] {
        background: var(--clr-action-secondary-bg-active);
    }

    .navbar-toggler:focus-visible[b-arj25qktvi] {
        outline: 2px solid var(--clr-focus-ring-color);
        outline-offset: 2px;
    }

    .top-row[b-arj25qktvi] {
        height: 3.5rem;
        padding: .5rem 1rem;
    }

    .navbar-brand[b-arj25qktvi] {
        color: var(--clr-text);
        padding-top: 0;
        padding-bottom: 0;
        margin-right: 0;
    }

    .tso-brand[b-arj25qktvi] {
        background: var(--clr-neutral-925);
        height: 3.75rem;

        .container-fluid {
            margin-inline: -.75rem;
        }
    }

    .bi[b-arj25qktvi] {
        display: inline-block;
        position: relative;
        width: 1.25rem;
        height: 1.25rem;
        margin-right: 0.75rem;
        top: -1px;
        background-size: cover;
    }

    .bi-house-door-fill-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
    }

    .bi-plus-square-fill-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
    }

    .bi-list-nested-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
    }

    .bi-lock-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
    }

    .bi-person-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
    }

    .bi-person-badge-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
    }

    .bi-person-fill-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
    }

    .bi-arrow-bar-left-nav-menu[b-arj25qktvi] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
    }

    .nav-item[b-arj25qktvi] {
        font-size: 0.9rem;
    }

        .nav-item:first-of-type[b-arj25qktvi] {
            padding-top: 1rem;
        }

        .nav-item:last-of-type[b-arj25qktvi] {
            padding-bottom: 1rem;
        }

        .nav-item[b-arj25qktvi]  .nav-link {
            color: #d7d7d7;
            background: none;
            border: none;
            height: 3rem;
            display: flex;
            align-items: center;
            line-height: 3rem;
            width: 100%;
            border-left: 4px solid transparent;
        }

        .nav-item[b-arj25qktvi]  a.active {
            background-color: var(--clr-nav-item-active-bg);
            color: var(--clr-nav-item-active-text);
            border-left: 4px solid var(--clr-primary-500);
        }

        .nav-item[b-arj25qktvi]  .nav-link:hover {
            background-color: var(--clr-nav-item-hover-bg);
            color: white;
        }

.nav-scrollable[b-arj25qktvi] {
    display: none;
    overscroll-behavior: contain;

    @media (min-width: 641px) {
        /* Never collapse the sidebar for wide screens */
        display: block;
        /* Allow sidebar to scroll for tall menus. 3.75rem matches .tso-brand's
           height, which wins over .top-row's 3.5rem (same specificity, later
           in this file) - using 3.5rem here left a stray 4px page overflow. */
        height: calc(100vh - 3.75rem);
        overflow-y: auto;[b-arj25qktvi]
    }
}

    .navbar-toggler:checked ~ .nav-scrollable[b-arj25qktvi] {
        display: block;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
/* Card styling matches Maintenance/app_offline.htm so the two feel like one system. */
#components-reconnect-modal[b-7itbciw7ay] {
    width: calc(100% - 2rem);
    max-width: 32rem;
    padding: clamp(1.25rem, 5vw, 2.5rem);
    background: var(--clr-surface);
    color: var(--clr-text);
    border: 1px solid var(--clr-border-default);
    border-radius: .5rem;
    line-height: 1.5;
}

    /* Delay, then fade in, so a split-second network blip doesn't flash the modal */
    #components-reconnect-modal[open][b-7itbciw7ay] {
        animation: components-reconnect-fade-in-b-7itbciw7ay 300ms ease-out 500ms both;
    }

        #components-reconnect-modal[open][b-7itbciw7ay]::backdrop {
            background: var(--clr-backdrop);
            animation: components-reconnect-fade-in-b-7itbciw7ay 300ms ease-out 500ms both;
        }

@keyframes components-reconnect-fade-in-b-7itbciw7ay {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.logo[b-7itbciw7ay] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
}

.logo__icon[b-7itbciw7ay] {
    flex-shrink: 0;
}

    .logo__icon path:first-child[b-7itbciw7ay] {
        fill: var(--clr-logo-primary);
    }

    .logo__icon path:last-child[b-7itbciw7ay] {
        fill: var(--clr-logo-secondary);
    }

.logo__wordmark[b-7itbciw7ay] {
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 1rem;
    color: var(--clr-wordmark-text);
    margin-top: .5rem;
}

.logo__wordmark-accent[b-7itbciw7ay] {
    font-weight: 600;
    color: var(--clr-wordmark-accent);
}

#components-reconnect-title[b-7itbciw7ay] {
    margin: 1.5rem 0 .75rem;
    font-size: clamp(1.25rem, 4vw, 1.5rem);
    line-height: 1.25;
    color: var(--clr-text);
}

#components-reconnect-message p[b-7itbciw7ay] {
    margin: 0 0 .75rem;
}

#components-reconnect-button[b-7itbciw7ay] {
    margin-top: .75rem;
    min-height: 44px;
    padding: .5rem 1rem;
    font: inherit;
    background: var(--clr-action-primary-bg);
    color: var(--clr-action-primary-text);
    border: 1px solid var(--clr-action-primary-border);
    border-radius: .25rem;
    cursor: pointer;
}

    #components-reconnect-button[hidden][b-7itbciw7ay] {
        display: none;
    }

    #components-reconnect-button:hover[b-7itbciw7ay] {
        background: var(--clr-action-primary-bg-hover);
    }

    #components-reconnect-button:active[b-7itbciw7ay] {
        background: var(--clr-action-primary-bg-active);
    }

    /* Offset so the ring sits on the surface, where it meets 3:1 contrast */
    #components-reconnect-button:focus-visible[b-7itbciw7ay] {
        outline: 2px solid var(--clr-focus-ring-color);
        outline-offset: 3px;
        box-shadow: var(--clr-focus-ring-shadow);
    }

@media (prefers-reduced-motion: reduce) {
    #components-reconnect-modal[open][b-7itbciw7ay],
    #components-reconnect-modal[open][b-7itbciw7ay]::backdrop {
        animation: none;
    }
}
/* /Components/Organisations/ConvertSoloAccountButton.razor.rz.scp.css */
.convert-solo[b-902c8jaj2y] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

/* Persistent live region with reserved width, so a message doesn't move anything */
.status[b-902c8jaj2y] {
    min-width: 9rem;
    color: var(--clr-text-muted);
}
/* /Components/Organisations/Dialogs/CreateOrganisationDialog.razor.rz.scp.css */
.wrapper[b-jsdliyp39j]{
    display: flex;
    gap: 1rem;
}
/* /Components/Organisations/OrganisationLabel.razor.rz.scp.css */
.solo[b-kc5oxajb5i] {
    color: var(--clr-text-muted);
}
/* /Components/Organisations/Pages/OrganisationDetails.razor.rz.scp.css */
h4[b-hgdpusj3cm]{
    margin-top: 3rem;
}

.form__section[b-hgdpusj3cm] {
    margin: 1rem 0;
    padding: .5rem;
    border: 1px solid var(--clr-border-default);
    border-radius: .25rem;
}

.address__wrapper[b-hgdpusj3cm]{
    display: inline-flex;
    gap: 1rem;
    align-items: flex-start;
}
/* /Components/Organisations/Pages/Organisations.razor.rz.scp.css */
.contentArea[b-wuqps4yz7n]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}
/* /Components/Pages/SystemConfig.razor.rz.scp.css */
.contentArea[b-y8pqep3abz]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}
/* /Components/Settings/AccountSettingsForm.razor.rz.scp.css */
.settings-group[b-dr6g3ziv6v] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 40rem;
    padding: 1rem;
    border: 1px solid var(--clr-border-default);
    border-radius: .25rem;
    background: var(--clr-surface);

    legend {
        float: none;
        width: auto;
        padding-inline: .25rem;
        margin-bottom: 0;
        font-size: 1.1rem;
        color: var(--clr-text-emphasis);
    }
}

.settings-group__intro[b-dr6g3ziv6v] {
    margin: 0;
    color: var(--clr-text-muted);
}

/* Checkbox and label share the first row, so the checkbox is centred on the label line; the hint sits under
   the label. The auto column is sized to the checkbox, so it never shrinks. */
.setting[b-dr6g3ziv6v] {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: .75rem;
    row-gap: .125rem;

    label {
        color: var(--clr-text);
    }
}

.setting__hint[b-dr6g3ziv6v] {
    grid-column: 2;
    margin: 0;
    font-size: .875rem;
    color: var(--clr-text-muted);
}

.actions[b-dr6g3ziv6v] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-top: 1rem;
}

/* Fits the longer "Save settings" label (13 characters) plus the icon, gap and padding, so the button keeps
   the same size when the label changes to "Saving...". ch units scale with the font. */
.save-button[b-dr6g3ziv6v] {
    min-width: calc(13ch + 3rem);
}

.save-result[b-dr6g3ziv6v] {
    color: var(--clr-text-muted);
}

.save-result--error[b-dr6g3ziv6v] {
    color: var(--clr-danger);
}

/* Hold for 3s, then fade. visibility: hidden also removes the faded text from the accessibility tree. */
.save-result--fade[b-dr6g3ziv6v] {
    animation: save-result-fade-out-b-dr6g3ziv6v .5s ease-in 3s forwards;
}

@keyframes save-result-fade-out-b-dr6g3ziv6v {
    to {
        opacity: 0;
        visibility: hidden;
    }
}

@media (prefers-reduced-motion: reduce) {
    .save-result--fade[b-dr6g3ziv6v] {
        animation-duration: 1ms;
    }
}
/* /Components/Shared/AddressEditor.razor.rz.scp.css */
.editor[b-256tlgmven] {
    padding: .5rem 0;
    /*width: 100%;*/
    max-width: 30rem;
    /*box-shadow: 0 0 12px 17px rgb(221 223 231 / 20%);*/

    overflow: hidden;
    transition: max-height 1s cubic-bezier(.27,1.08,.68,1.04), opacity 1s;
    max-height: 0;
    opacity: 0;
    pointer-events: none;
    border: 1px solid transparent;
}
.editor.show[b-256tlgmven]{
    max-height: 800px;
    opacity: 1;
    pointer-events: auto;
}
.controls__wrapper[b-256tlgmven]{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
label[b-256tlgmven]{
    min-width:5rem;
    padding: 0;
}
.postcode[b-256tlgmven],
.form-control.postcode[b-256tlgmven]{
    max-width: 7rem;
}
.actions__wrapper[b-256tlgmven]{
    padding-right: 1rem;
    max-width:333px;
}
/* /Components/Shared/AppIcon.razor.rz.scp.css */
.app-icon[b-stx8kn2771] {
    display: block;
    fill: currentColor;
    color: currentColor;
    vertical-align: middle;
}
/* /Components/Shared/Badge.razor.rz.scp.css */

.success[b-z4w45hulf8] {
    background: var(--clr-success-bg);
    color: var(--clr-success);
    border-radius: .5rem;
    display: inline-block;
    padding: .5rem 1rem;
}

.warning[b-z4w45hulf8] {
    background: var(--clr-warning-bg);
    color: var(--clr-warning);
    border-radius: .5rem;
    display: inline-block;
    padding: .5rem 1rem;
}

.error[b-z4w45hulf8] {
    background: var(--clr-danger-bg);
    color: var(--clr-danger);
    border-radius: .5rem;
    display: inline-block;
    padding: .5rem 1rem;
}
/* /Components/Shared/CustomInputNumber.razor.rz.scp.css */
.input-group[b-1we8qpdj1x] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    min-width: 0;
}

    /* ::deep is required: the input is rendered by the child InputNumber component, so it
       doesn't carry this component's scope attribute and a plain selector matches nothing. */
    .input-group[b-1we8qpdj1x]  input {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        text-align: center;
        font-size: .875rem;
        border: 1px solid var(--clr-input-border);
        background: var(--clr-input-bg);
        border-radius: .25rem;
        margin: 0;
        appearance: textfield;
        -moz-appearance: textfield;
    }

    /* The -/+ buttons replace the browser's tiny native spinners */
    .input-group[b-1we8qpdj1x]  input::-webkit-inner-spin-button,
    .input-group[b-1we8qpdj1x]  input::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .input-group button[b-1we8qpdj1x] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        min-width: 44px;
        min-height: 44px;
        margin: 0;
        padding: .5rem;
        font-size: .875rem;
        border: 1px solid var(--clr-input-border);
        border-radius: .25rem;
        cursor: pointer;

        &:hover:not(:disabled) {
            background: var(--clr-action-secondary-bg-hover);
        }
    }

    .input-group button .app-icon[b-1we8qpdj1x] {
        margin: 0 auto;
    }

    .input-group > :not(:first-child)[b-1we8qpdj1x] {
        margin-left: 1px;
    }

.input-group button:disabled[b-1we8qpdj1x] {
    background-color: var(--clr-action-disabled-bg);
    cursor: not-allowed;
}
/* /Components/Shared/Dialog.razor.rz.scp.css */
.dialog-container[b-3lwyqtispf] {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0,0,0,0.6);
    z-index: 2000;
    display: flex;
    justify-content: center;
    align-items: center;
}
.dialog[b-3lwyqtispf] {
    background-color: var(--clr-surface-raised);
    color: var(--clr-text);
    margin: 1.25rem;
    max-width: 90%;
    max-height: calc(100vh - 8rem);
    border: 1px solid var(--clr-border-default);
    border-radius: .5rem;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.dialog-title[b-3lwyqtispf] {
    background-color: var(--clr-surface);
    color: var(--clr-text-muted);
    padding: 1rem 1.5rem;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--clr-border-default);
    font-size: 1rem;
    font-weight: 400;
    flex: 0 0 auto;
}
/* Square "dialogue close" button in the top right corner. */
.closeBtn__wrapper[b-3lwyqtispf]{
    background: var(--clr-action-secondary-bg);
    padding:0;
    margin:0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    border-radius: .375rem;
}
.closeBtn__wrapper:hover[b-3lwyqtispf] {
    background: var(--clr-action-secondary-bg-hover);
}
.closeBtn__wrapper .btn-close[b-3lwyqtispf] { 
    box-sizing: border-box;
    width: 2rem;
    height: 2rem;
    min-height: 2rem;
    padding: 0;
    font-size: .75rem;
    opacity: 1;
    filter: invert(1) grayscale(100%) brightness(200%);
}
.dialog-body[b-3lwyqtispf] {
    padding: 1rem 1.5rem;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
}
.dialog-footer[b-3lwyqtispf] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--clr-border-default);
    flex: 0 0 auto;
}
/* /Components/Shared/Divider.razor.rz.scp.css */
.divider[b-nk4kfiyd6m] {
    width: 1px;
    height: 2.25rem;
    /*align-self: stretch;*/
    padding-block: 1rem;
    background: var(--clr-border-default);
}
/* /Components/Shared/ListPager.razor.rz.scp.css */
.pager[b-xdh0zsal15] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    padding-block: 1rem;
}

    .pager .btn[b-xdh0zsal15] {
        min-width: 6rem; /* the same width whether enabled or not */
    }

.pager__current[b-xdh0zsal15] {
    min-width: 8rem; /* room for "Page 99 of 99", so the buttons don't move */
    text-align: center;
}
/* /Components/Shared/Logo.razor.rz.scp.css */
.logo[b-mmgd8a3ola] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
    margin-top: .25rem;
}

.logo__icon[b-mmgd8a3ola] {
    flex-shrink: 0;
}

.logo__wordmark[b-mmgd8a3ola] {
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 1rem;
    color: var(--theme-text-primary, #a0d3f2);
    margin-top: .5rem;
}

.logo__wordmark-accent[b-mmgd8a3ola] {
    font-weight: 600;
    color: var(--theme-accent-primary, #AAA1F2);
}

.logo--auto .logo__icon[b-mmgd8a3ola] {
    --logo-primary: var(--theme-logo-primary);
    --logo-secondary: var(--theme-logo-secondary);
}

/* Fixed variant — always the lighter violet, regardless of active theme.
   Use where the logo sits on a surface that stays dark either way. */
.logo--ondark .logo__icon[b-mmgd8a3ola] {
    --logo-primary: #7F77DD;
    --logo-secondary: #A0D3F2;
}

/* Fixed variant — always the darker violet, for light-surface use
   where legibility at small sizes matters more than matching the active theme. */
.logo--favicon .logo__icon[b-mmgd8a3ola] {
    --logo-primary: #3C3489;
    --logo-secondary: #A0D3F2;
}
/* /Components/Shared/Notifications.razor.rz.scp.css */
.notifications__btn[b-ts9j3mf9xp]{
    anchor-name: --notifications-btn;
}
#notifications[b-ts9j3mf9xp]{
    position: absolute;
    margin:0;
    padding: 0 .5rem;
    inset: auto;
    border:1px solid #d4086a;
    top: anchor(bottom);
    right: anchor(left);
    margin-block-start: .5rem;
}
.notification[b-ts9j3mf9xp] {
    padding: .5rem 0;
}
.notification-title[b-ts9j3mf9xp]{
    font-weight: 600;
}
#notifications[popover][b-ts9j3mf9xp]{
    position-anchor: --notifications-btn;
}
#notifications[popover][b-ts9j3mf9xp]::backdrop{
    background-color: rgba(0,0,0,.5);
}
/* /Components/Shared/SimpleAuthError.razor.rz.scp.css */
.authError[b-7suv15jb1t] {
    color: red;
    font-weight: 500;
}
/* /Components/Shared/Tooltip.razor.rz.scp.css */
/* ---------------------------------------------------------------------------
   Tooltip
   Base: absolutely positioned above the wrapped content, centred.
   Enhancement (see the supports block below): CSS anchor positioning, which
   flips below when there is no room above, stays inside the viewport
   horizontally and escapes overflow:hidden ancestors. No JavaScript either way.
   --------------------------------------------------------------------------- */

.tooltip-host[b-z3ohpzbqy7] {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
    border-radius: .25rem;
}

    .tooltip-host:focus-visible[b-z3ohpzbqy7] {
        outline: 2px solid var(--clr-focus-ring-color);
        outline-offset: 3px;
    }

    /* Disabled controls handle pointer events inconsistently across browsers. Let the pointer
       fall through to the wrapper, which owns the hover, and keep the "not allowed" cue there. */
    .tooltip-host[b-z3ohpzbqy7]  :disabled {
        pointer-events: none;
    }

    .tooltip-host:has(:disabled)[b-z3ohpzbqy7] {
        cursor: not-allowed;
    }

.tooltip[b-z3ohpzbqy7] {
    position: absolute;
    z-index: 1000;
    bottom: 100%;
    left: 50%;
    translate: -50% 0;
    /* Transparent padding bridges the gap to the trigger, so the pointer can move onto
       the tooltip without it closing (WCAG 1.4.13 hoverable). Symmetric so it still works when flipped. */
    padding-block: .375rem;
    width: max-content;
    max-width: min(20rem, calc(100vw - 2rem));
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 120ms ease, visibility 0s linear 120ms;
    /* Don't inherit layout-ish text styles from wherever the tooltip is used (tables, buttons...) */
    white-space: normal;
    text-align: start;
    text-transform: none;
    font-weight: 400;
    cursor: default;
}

.tooltip__bubble[b-z3ohpzbqy7] {
    display: block;
    padding: .375rem .625rem;
    background: var(--clr-surface-active);
    color: var(--clr-text);
    border: 1px solid var(--clr-border-default);
    border-radius: .375rem;
    box-shadow: 0 4px 12px rgb(0 0 0 / .35);
    font-size: .875rem;
    line-height: 1.4;
    overflow-wrap: break-word;
}

/* Show on pointer hover, and on keyboard focus of the wrapper or of anything inside it.
   :focus-visible (not :focus) so a mouse click on a wrapped button doesn't leave a tooltip stuck open. */
.tooltip-host:hover > .tooltip[b-z3ohpzbqy7],
.tooltip-host:focus-visible > .tooltip[b-z3ohpzbqy7] {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition: opacity 120ms ease, visibility 0s;
}

/* Separate rule: an unsupported :has() would otherwise invalidate the whole selector list above. */
.tooltip-host:has(:focus-visible) > .tooltip[b-z3ohpzbqy7] {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition: opacity 120ms ease, visibility 0s;
}

/* Escape pressed: stay hidden until the next hover/focus (the component clears the class). Must stay last. */
.tooltip-host.is-dismissed > .tooltip[b-z3ohpzbqy7] {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: none;
}

/* One shared anchor name, scoped to each wrapper by anchor-scope, so instances never collide. */
@supports (anchor-scope: all) and (position-area: top) and (position-try-fallbacks: flip-block) and (justify-self: anchor-center) {
    .tooltip-host[b-z3ohpzbqy7] {
        anchor-name: --tooltip-anchor;
        anchor-scope: --tooltip-anchor;
    }

    .tooltip[b-z3ohpzbqy7] {
        position-anchor: --tooltip-anchor;
        position: fixed;
        inset: auto;
        translate: none;
        position-area: top;
        justify-self: anchor-center; /* centred on the trigger, but shifted to stay inside the viewport */
        margin-inline: .5rem;        /* ...with a little breathing room from the viewport edge */
        position-try-fallbacks: flip-block;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tooltip[b-z3ohpzbqy7],
    .tooltip-host:hover > .tooltip[b-z3ohpzbqy7],
    .tooltip-host:focus-visible > .tooltip[b-z3ohpzbqy7] {
        transition: none;
    }

    .tooltip-host:has(:focus-visible) > .tooltip[b-z3ohpzbqy7] {
        transition: none;
    }
}
/* /Components/Shared/TsoSwitch.razor.rz.scp.css */
/* The switch and its status message on one line, with any description under them */
.tso-switch[b-w57tn6g05m] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .25rem;
}

/* The status stays beside the switch rather than wrapping under it, which unbalances a table row */
.tso-switch__main[b-w57tn6g05m] {
    display: flex;
    align-items: center;
    gap: .75rem;
}

/* The whole row is the hit area, at least 44px tall */
.tso-switch__row[b-w57tn6g05m] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    min-height: 44px;
    color: var(--clr-text);
    cursor: pointer;
}

/* Long labels wrap rather than truncate */
.tso-switch__label[b-w57tn6g05m] {
    min-width: 0;
    overflow-wrap: anywhere;
}

    /* Still the switch's accessible name, but not shown. Absolutely positioned, so it takes no room in the row. */
    .tso-switch__label--hidden[b-w57tn6g05m] {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
        border: 0;
    }

.tso-switch__control[b-w57tn6g05m] {
    position: relative;
    display: inline-grid;
    flex: none;
}

/* The real checkbox sits over the track, invisible but still focusable, clickable and in the accessibility tree */
.tso-switch__input[b-w57tn6g05m] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    cursor: inherit;
    z-index: 1;
}

.tso-switch__track[b-w57tn6g05m] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    width: 44px;
    height: 24px;
    padding: 0 2px;
    background: var(--clr-input-bg);
    /* The same outline as other inputs */
    border: 1px solid var(--clr-input-border);
    border-radius: 12px;
    transition: background-color 150ms ease, border-color 150ms ease;
}

.tso-switch__thumb[b-w57tn6g05m] {
    position: relative;
    display: inline-grid;
    place-content: center;
    width: 16px;
    height: 16px;
    background: var(--clr-text-muted);
    border-radius: 50%;
    /* The tick (an AppIcon, drawn in currentColor) shows only when on */
    color: transparent;
    transition: transform 150ms ease, background-color 150ms ease;
}

/* On uses the same colours as a selected chip (TimesheetQuickFilters) */
.tso-switch__input:checked + .tso-switch__track[b-w57tn6g05m] {
    background: var(--clr-action-secondary-bg-active);
}

    /* State is shown by the thumb's position and the tick, not colour alone */
    .tso-switch__input:checked + .tso-switch__track .tso-switch__thumb[b-w57tn6g05m] {
        transform: translateX(22px);
        background: var(--clr-action-secondary-text);
        color: var(--clr-action-secondary-bg-active);
    }

.tso-switch__row:hover .tso-switch__input:not([aria-disabled="true"]) + .tso-switch__track[b-w57tn6g05m] {
    border-color: var(--clr-input-border-hover);
}

.tso-switch__input:focus-visible + .tso-switch__track[b-w57tn6g05m] {
    outline: 2px solid var(--clr-focus-ring-color);
    outline-offset: 2px;
}

/* Pending: further changes are ignored until the save finishes. Three dots bounce beside the switch, but only once
   a save has taken 400ms, so a quick save doesn't flash them. No progress cursor: on Windows it draws a blue spinning
   circle at the pointer that looks like something's broken. */
.tso-switch__saving[b-w57tn6g05m] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 1em;
    opacity: 0;
    animation: tso-switch-appear-b-w57tn6g05m 0s 400ms forwards;
}

    .tso-switch__saving > span[b-w57tn6g05m] {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: var(--clr-text-muted);
        animation: tso-switch-bounce-b-w57tn6g05m 1s ease-in-out infinite;
    }

        .tso-switch__saving > span:nth-child(2)[b-w57tn6g05m] {
            animation-delay: 150ms;
        }

        .tso-switch__saving > span:nth-child(3)[b-w57tn6g05m] {
            animation-delay: 300ms;
        }

@keyframes tso-switch-appear-b-w57tn6g05m {
    to {
        opacity: 1;
    }
}

@keyframes tso-switch-bounce-b-w57tn6g05m {
    0%, 60%, 100% {
        transform: translateY(0);
    }

    30% {
        transform: translateY(-4px);
    }
}

/* Without motion, the dots fade in turn instead of bouncing */
@keyframes tso-switch-fade-b-w57tn6g05m {
    0%, 60%, 100% {
        opacity: .35;
    }

    30% {
        opacity: 1;
    }
}

/* Disabled stays focusable (aria-disabled), so the reason in the description can be reached */
.is-disabled .tso-switch__row[b-w57tn6g05m] {
    color: var(--clr-action-disabled-text);
    cursor: not-allowed;
}

.is-disabled .tso-switch__track[b-w57tn6g05m],
.is-disabled .tso-switch__input:checked + .tso-switch__track[b-w57tn6g05m] {
    background: var(--clr-action-disabled-bg);
    border-color: var(--clr-action-disabled-border);
}

.is-disabled .tso-switch__thumb[b-w57tn6g05m] {
    background: var(--clr-action-disabled-text);
}

.is-disabled .tso-switch__input:checked + .tso-switch__track .tso-switch__thumb[b-w57tn6g05m] {
    background: var(--clr-action-disabled-text);
    color: var(--clr-action-disabled-bg);
}

.tso-switch__status[b-w57tn6g05m] {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    color: var(--clr-text-muted);
}

    /* A fixed width, so a message or the saving dots don't move anything. A longer message wraps within it rather
       than widening a table column, which a minimum width alone would allow. */
    .tso-switch__status--reserved[b-w57tn6g05m] {
        flex: none;
        width: 9rem;
    }

    .tso-switch__status.is-error[b-w57tn6g05m] {
        color: var(--clr-danger);
    }

.tso-switch__description[b-w57tn6g05m] {
    margin: 0;
    color: var(--clr-text-muted);
    font-size: .875rem;
}

@media (prefers-reduced-motion: reduce) {
    .tso-switch__track[b-w57tn6g05m],
    .tso-switch__thumb[b-w57tn6g05m] {
        transition: none;
    }

    .tso-switch__saving > span[b-w57tn6g05m] {
        animation-name: tso-switch-fade-b-w57tn6g05m;
    }
}

/* Windows High Contrast and other forced colour modes: use system colours so the track, thumb and state stay visible */
@media (forced-colors: active) {
    .tso-switch__track[b-w57tn6g05m] {
        forced-color-adjust: none;
        background: Canvas;
        border-color: ButtonText;
    }

    .tso-switch__thumb[b-w57tn6g05m] {
        background: ButtonText;
    }

    .tso-switch__input:checked + .tso-switch__track[b-w57tn6g05m] {
        background: Highlight;
        border-color: Highlight;
    }

        .tso-switch__input:checked + .tso-switch__track .tso-switch__thumb[b-w57tn6g05m] {
            background: HighlightText;
            color: Highlight;
        }

    .tso-switch__input:focus-visible + .tso-switch__track[b-w57tn6g05m] {
        outline-color: Highlight;
    }

    .tso-switch__saving[b-w57tn6g05m] {
        forced-color-adjust: none;
    }

        .tso-switch__saving > span[b-w57tn6g05m] {
            background: CanvasText;
        }

    .is-disabled .tso-switch__track[b-w57tn6g05m],
    .is-disabled .tso-switch__input:checked + .tso-switch__track[b-w57tn6g05m] {
        background: Canvas;
        border-color: GrayText;
    }

    .is-disabled .tso-switch__thumb[b-w57tn6g05m] {
        background: GrayText;
    }

    .is-disabled .tso-switch__input:checked + .tso-switch__track .tso-switch__thumb[b-w57tn6g05m] {
        background: GrayText;
        color: Canvas;
    }
}
/* /Components/TimesheetSummary.razor.rz.scp.css */
.breakdown__wrapper[b-gpv3ws2t40] {
    display: flex;
    max-width: 100%;
    flex-direction: column;
    flex: 1 1 0;
    gap: .5rem;
    background: var(--clr-surface-raised);
    padding: 1rem;
    border-radius: .5rem;
    color: var(--clr-text-muted);
}

.breakdown__title[b-gpv3ws2t40] {
    margin: 0;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--clr-border-default);
}

.breakdown__items[b-gpv3ws2t40] {
    margin: 0;
    padding-left: 0;
    list-style-type: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    height: 100%;
}

.item__wrapper[b-gpv3ws2t40] {
    padding-block: .25rem;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    flex: 0 1 auto;
}
    /*
        "Select an .item__wrapper that is not the total row and whose
        next sibling is the total row"
        - this will only work in modern browsers that support the :has() pseudo-class,
        but is useful for avoiding extra classes in the markup.
    */
    .item__wrapper:not(.item__wrapper-total):has(+ .item__wrapper-total)[b-gpv3ws2t40] {
        padding-bottom: .5rem;
    }

    .item__wrapper-total[b-gpv3ws2t40]{
        margin-top: auto;
        border-top: 1px solid var(--clr-border-default);
    }

    .breakdown__item[b-gpv3ws2t40] {
        width: 11rem;
        display: inline-block;
    }
.summary__item[b-gpv3ws2t40] {
    width: 19rem;
    display: inline-block;
}

.total[b-gpv3ws2t40] {
    padding-top: .5rem;
}

.newAbsences[b-gpv3ws2t40] {
    color: var(--clr-danger);
}
/* /Components/Timesheets/AddClientForm.razor.rz.scp.css */
fieldset[b-700c4u4z62] {
    border: 0;
    margin: 0;
    padding: 0;
}

legend[b-700c4u4z62] {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: .5rem;
}

.fields[b-700c4u4z62] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .5rem 1rem;
}

    .fields .btn[b-700c4u4z62] {
        margin-top: 1.5rem; /* lines the button up with the inputs beneath their labels */
    }

.ctrl__wrapper[b-700c4u4z62] {
    flex: 0 0 auto;
    display: flex;
    gap: .25rem;
}

    .ctrl__wrapper.col[b-700c4u4z62] {
        flex-direction: column;
    }

/* Persistent live region with reserved height, so the message doesn't shift the page */
.status[b-700c4u4z62] {
    min-height: 1.5em;
    margin: .5rem 0 0;
    color: var(--clr-text-muted);
}

.no-orgs[b-700c4u4z62] {
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/AddProjectForm.razor.rz.scp.css */
.form__wrapper[b-5xxvqtgwtf]{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: flex-start;
    align-items: flex-start;
    padding-block-end: 1rem;
    
    button{
        margin-left: auto;
    }
}

.tso-form-group[b-5xxvqtgwtf]{
    display: flex;
    flex-direction: column;
    gap: .25rem;
    width: 100%;
    
    label{
        color: var(--clr-text-muted);
    }
}

.warning[b-5xxvqtgwtf]{
    color: #784201;
}

.actions[b-5xxvqtgwtf]{
    padding-top: 1rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
}
/* /Components/Timesheets/AdminEditBanner.razor.rz.scp.css */
/* Slides the page down and back up rather than jumping. Animating the row needs no fixed height, so it still works when
   the banner wraps. */
.admin-edit-banner__reveal[b-ctbyz4m4c4] {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 300ms ease-out, opacity 300ms ease-out;
}

    .admin-edit-banner__reveal.is-open[b-ctbyz4m4c4] {
        grid-template-rows: 1fr;
        opacity: 1;
    }

.admin-edit-banner__clip[b-ctbyz4m4c4] {
    min-height: 0;
    overflow: hidden;
}

/* The same width as the page content, which is centred on a wide screen */
.admin-edit-banner[b-ctbyz4m4c4] {
    box-sizing: border-box;
    max-width: min(100%, 1400px);
    margin: 0 auto 1rem;
    padding: .5rem 1rem;
    background: var(--clr-warning-bg);
    border: 1px solid var(--clr-warning);
    border-radius: .375rem;
    color: var(--clr-text);
}

/* Read by screen readers, but not shown */
.admin-edit-banner__announcement[b-ctbyz4m4c4] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

@media (prefers-reduced-motion: reduce) {
    .admin-edit-banner__reveal[b-ctbyz4m4c4] {
        transition: none;
    }
}
/* /Components/Timesheets/AllocationStatus.razor.rz.scp.css */
[b-9gwavxh271] .app-icon {
    align-self: flex-end;
}

/* Text in place of an icon, so it sits in the same 24px box */
.not-working[b-9gwavxh271] {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    align-self: flex-end;
    font-size: .75rem;
    font-weight: 600;
    color: var(--clr-text-muted);
}

.weekend[b-9gwavxh271] {
    display: inline-flex;
    align-self: flex-end;
}
/* /Components/Timesheets/CalendarDayContent.razor.rz.scp.css */
.calendar__day-date[b-9r4vd89wsf] {
    display: flex;
    align-items: baseline;
    gap: .5rem;
}

.calendar__day-weekday[b-9r4vd89wsf] {
    font-size: .75rem;
    color: var(--clr-text-muted);

    @media (min-width: 768px) {
        display: none;[b-9r4vd89wsf]
    }
}

/* .today is MonthCalendar's cell */
.today .calendar__day-weekday[b-9r4vd89wsf] {
    color: inherit;
}
/* /Components/Timesheets/ClientSelect.razor.rz.scp.css */
.select__wrapper[b-i8ojae3c1a]{
    display: flex;
    min-width: 8rem;
    max-width: 8rem;
}
.select__wrapper.col[b-i8ojae3c1a]{
    flex-direction: column;
}
.select__wrapper.full-width[b-i8ojae3c1a]{
    min-width: 100%;
    max-width: 100%;
}

.select__wrapper[b-i8ojae3c1a]  select {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding-right: 2rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23c9c3ff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: right .5rem center;
    background-repeat: no-repeat;
    background-size: .75rem;
}

.select__wrapper[b-i8ojae3c1a]  select::-ms-expand {
    display: none;
}
/* /Components/Timesheets/DailyTotal.razor.rz.scp.css */
.dailyTotal[b-bjxy2ljkb5]{
    color: var(--clr-danger);
}
.dailyTotal.today[b-bjxy2ljkb5] {
    color: var(--clr-warning);
}
.dailyTotal-achieved[b-bjxy2ljkb5]{
    color: var(--clr-success);
}
/* /Components/Timesheets/Dialogs/AddClientProject/AddClientProjectDialog.razor.rz.scp.css */
.wrapper[b-04oj1iopnl] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.emphasis[b-04oj1iopnl] {
    color: var(--clr-text-emphasis);
}

.new-client[b-04oj1iopnl] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
}

.new-client__panel[b-04oj1iopnl] {
    align-self: stretch;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--clr-border-default);
}

/* Persistent live region with reserved height, so the message doesn't shift the dialogue */
.status[b-04oj1iopnl] {
    min-height: 1.5em;
    margin: 0;
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/Dialogs/CopyFromLastWeek/CopyFromLastWeekDialog.razor.rz.scp.css */
.copy-last-week[b-mjxx11x2vj] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.copy-last-week__subtitle[b-mjxx11x2vj] {
    margin: 0;
    color: var(--clr-text-muted);
}

.copy-last-week__empty[b-mjxx11x2vj] {
    margin: 0;
}

.copy-group[b-mjxx11x2vj] {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.copy-group__legend[b-mjxx11x2vj] {
    float: none;
    width: auto;
    margin: 0 0 .5rem;
    padding: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--clr-text-emphasis);
}

.copy-group__list[b-mjxx11x2vj] {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Label then checkbox share a row; the whole label is the click target. The label fills the row, so entry and
   select-all checkboxes line up at the right-hand end. */
.copy-item[b-mjxx11x2vj] {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .625rem 0;
    border-top: 1px solid var(--clr-border-default);
}

.copy-item--all[b-mjxx11x2vj] {
    border-top: 0;
    padding-top: 0;
}

.copy-item--option[b-mjxx11x2vj] {
    border-top-width: 2px;
}

.copy-item input[type="checkbox"][b-mjxx11x2vj] {
    flex: 0 0 auto;
    margin-top: .125rem;
}

.copy-item label[b-mjxx11x2vj] {
    flex: 1 1 auto;
    min-width: 0;
    cursor: pointer;
}

/* Include comments is an option, not an entry: its checkbox stays beside its label. */
.copy-item--option label[b-mjxx11x2vj] {
    flex: 0 1 auto;
}

/* Date | summary with any comment stacked beneath it | right-aligned duration. */
.copy-item__label[b-mjxx11x2vj] {
    display: grid;
    grid-template-columns: 4rem 1fr auto;
    grid-template-areas: "day summary duration";
    column-gap: .75rem;
    row-gap: .25rem;
}

.copy-item__day[b-mjxx11x2vj] {
    grid-area: day;
    font-weight: 400;
    color: var(--clr-text-muted);
}

.copy-item__summary[b-mjxx11x2vj] {
    grid-area: summary;
    overflow-wrap: anywhere;
}

.copy-item__comment[b-mjxx11x2vj] {
    display: block;
    color: var(--clr-text-muted);
    font-size: .875rem;
    max-width: 50ch;
    text-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.copy-item__duration[b-mjxx11x2vj] {
    grid-area: duration;
    justify-self: end;
    white-space: nowrap;
    color: var(--clr-text-muted);
}

/* The label swaps to "Copying..." while saving - keep the width steady. */
.copy-btn[b-mjxx11x2vj] {
    min-width: calc(14ch + 3rem);
}

.validation-alert[b-mjxx11x2vj] {
    padding: .75rem 1rem;
    background: var(--clr-danger-bg);
    color: var(--clr-danger);
    border: 1px solid var(--clr-danger);
    border-radius: .25rem;
}

.copy-warning[b-mjxx11x2vj] {
    padding: .75rem 1rem;
    background: var(--clr-warning-bg);
    color: var(--clr-warning);
    border: 1px solid var(--clr-warning);
    border-radius: .25rem;
}

.copy-warning__days[b-mjxx11x2vj] {
    font-weight: 600;
}

.validation-alert:focus-visible[b-mjxx11x2vj],
.copy-warning:focus-visible[b-mjxx11x2vj] {
    outline: none;
    box-shadow: var(--clr-focus-ring-shadow);
}

/* Widening the dialog card itself is a viewport concern - the shared Dialog.razor shell sizes
   to its content. */
/*@media (min-width: 640px) {*/
/*    .copy-last-week {*/
/*        min-width: 38rem;*/
/*    }*/

/*    .copy-item__label {*/
/*        grid-template-columns: 4rem 1fr auto;*/
/*        grid-template-areas: "day summary duration";*/
/*    }*/
/*}*/
.emphasis[b-mjxx11x2vj]{
    color: var(--clr-text-emphasis);
}
/* /Components/Timesheets/Dialogs/CopyTimesheetDialog.razor.rz.scp.css */
/* The label swaps to "Copying..." while saving - keep the width steady. */
.copy-btn[b-l7jqyr8oxs] {
    min-width: calc(15ch + 3rem);
}
/* /Components/Timesheets/Dialogs/EditAbsence/EditAbsenceDialog.razor.rz.scp.css */
.edit-absence[b-36mx720lz8] {
    container-type: inline-size;
    container-name: edit-absence;

    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.edit-absence__subtitle[b-36mx720lz8] {
    margin: -0.5rem 0 0;
    color: var(--clr-text-muted);
}

.ctrl__wrapper[b-36mx720lz8] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.ctrl__wrapper.charCount[b-36mx720lz8] {
    width: 100%;
}

/* The Day column is read-only text, so its heading is a span - style it like the real labels. */
.ctrl__wrapper > label[b-36mx720lz8],
.ctrl__wrapper > .field-label[b-36mx720lz8] {
    display: block;
}

.ctrl__wrapper input[b-36mx720lz8],
.ctrl__wrapper select[b-36mx720lz8] {
    width: 100%;
}

.dayOfWeek__value[b-36mx720lz8] {
    display: flex;
    align-items: center;
    min-height: 44px;
}

/* Mobile-first: the four fields stack in a single column. A container query widens them into
   a row once THIS dialog's own rendered width allows it - the page's original version of this
   form had no wrapping at all, so the Type select was crushed in a narrow window. */
.absenceForm__row[b-36mx720lz8] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    width: 100%;
}

@container edit-absence (min-width: 30rem) {
    .absenceForm__row[b-36mx720lz8] {
        flex-direction: row;
    }

    .absenceForm__row .ctrl__wrapper[b-36mx720lz8] {
        flex: 1 1 0;
        min-width: 0;
    }

    .absenceForm__row .ctrl__wrapper.dayOfWeek[b-36mx720lz8] {
        flex: 0 0 4rem;
    }

    .absenceForm__row .ctrl__wrapper.date[b-36mx720lz8] {
        flex: 0 0 auto;
    }

    .absenceForm__row .ctrl__wrapper.duration[b-36mx720lz8] {
        flex: 0 0 8.5rem;
    }
}

.validation-alert[b-36mx720lz8] {
    padding: .75rem 1rem;
    background: var(--clr-danger-bg);
    color: var(--clr-danger);
    border: 1px solid var(--clr-danger);
    border-radius: .375rem;
}

.validation-alert:focus-visible[b-36mx720lz8] {
    outline: none;
    box-shadow: var(--clr-focus-ring-shadow);
}

[b-36mx720lz8] .validation-errors {
    padding-left: 1.25rem;
    margin: 0;
    color: var(--clr-danger);
}

/* Widening the dialog card itself is a viewport concern (the shared Dialog.razor shell sizes
   to its content), not something a container query on this component's own content can drive
   without a circular size dependency. */
@media (min-width: 640px) {
    .edit-absence[b-36mx720lz8] {
        min-width: 38rem;
    }
}
/* /Components/Timesheets/Dialogs/LogAbsence/DayChipGroup.razor.rz.scp.css */
.day-chip-group[b-zmvsn29e6m] {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.25rem;
}

.chip[b-zmvsn29e6m] {
    flex: 1 1 3.25rem;
    min-width: 3.25rem;
    min-height: 2.75rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: .5rem .25rem;
    font: inherit;
    font-weight: 400;
    background: var(--clr-action-secondary-bg);
    color: var(--clr-action-secondary-text);
    border: 1px solid var(--clr-action-secondary-border);
    border-radius: .375rem;
    cursor: pointer;
}

.chip__weekday[b-zmvsn29e6m] {
    font-size: .875rem;
}

.chip__day[b-zmvsn29e6m] {
    font-size: 1rem;
}

.chip--weekend[b-zmvsn29e6m] {
    color: var(--clr-text-muted);
}

.chip:hover:not(.chip--selected):not(:disabled)[b-zmvsn29e6m] {
    background: var(--clr-action-secondary-bg-hover);
}

.chip:disabled[b-zmvsn29e6m] {
    background: var(--clr-action-disabled-bg);
    color: var(--clr-action-disabled-text);
    border-color: var(--clr-action-disabled-border);
    cursor: not-allowed;
}

.chip:focus-visible[b-zmvsn29e6m] {
    outline: none;
    box-shadow: var(--clr-focus-ring-shadow);
}

.chip--selected[b-zmvsn29e6m] {
    background: var(--clr-action-secondary-bg-active);
    color: var(--clr-action-secondary-text);
    border-color: var(--clr-action-secondary-border);
    font-weight: 500;
}
/* /Components/Timesheets/Dialogs/LogAbsence/DurationSegmentedControl.razor.rz.scp.css */
.duration-segmented[b-ydqn93xsa9] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .25rem;
}

.segment[b-ydqn93xsa9] {
    min-width: 0;
    min-height: 2.75rem;
    padding: .5rem .25rem;
    font: inherit;
    font-weight: 400;
    text-align: center;
    background: var(--clr-action-secondary-bg);
    color: var(--clr-action-secondary-text);
    border: 1px solid var(--clr-action-secondary-border);
    border-radius: .375rem;
    cursor: pointer;
}

.segment:hover:not(.segment--selected)[b-ydqn93xsa9] {
    background: var(--clr-action-secondary-bg-hover);
}

.segment:focus-visible[b-ydqn93xsa9] {
    outline: none;
    box-shadow: var(--clr-focus-ring-shadow);
}

.segment--selected[b-ydqn93xsa9] {
    background: var(--clr-action-secondary-bg-active);
    color: var(--clr-action-secondary-text);
    border-color: var(--clr-action-secondary-border);
    font-weight: 500;
}
/* /Components/Timesheets/Dialogs/LogAbsence/LogAbsenceDialog.razor.rz.scp.css */
.log-absence[b-y8ecty8yw2] {
    container-type: inline-size;
    container-name: log-absence;

    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.log-absence__subtitle[b-y8ecty8yw2] {
    margin: -0.5rem 0 0;
    color: var(--clr-text-muted);
}

.ctrl__wrapper[b-y8ecty8yw2]{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.ctrl__wrapper select[b-y8ecty8yw2],
.ctrl__wrapper input[type="text"][b-y8ecty8yw2] {
    width: 100%;
}

.running-summary[b-y8ecty8yw2] {
    margin: 0;
    padding-top: .5rem;
    border-top: 1px solid var(--clr-border-default);
    color: var(--clr-text-emphasis);
}

.validation-alert[b-y8ecty8yw2] {
    padding: .75rem 1rem;
    background: var(--clr-danger-bg);
    color: var(--clr-danger);
    border: 1px solid var(--clr-danger);
    border-radius: .375rem;
}

.validation-alert p[b-y8ecty8yw2] {
    margin: 0 0 .5rem;
    font-weight: 500;
}

.validation-alert ul[b-y8ecty8yw2] {
    margin: 0;
    padding-left: 1.25rem;
}

.validation-alert:focus-visible[b-y8ecty8yw2] {
    outline: none;
    box-shadow: var(--clr-focus-ring-shadow);
}

.bulk-row[b-y8ecty8yw2] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Mobile-first (matches the narrow reference design): fields stack in a single
   column. A container query rearranges the type/duration pair once THIS dialog's
   own rendered width allows it - this reacts to the dialog's actual size, not the
   viewport, so it still degrades gracefully in a narrow window on a wide screen. */
@container log-absence (min-width: 30rem) {
    .bulk-row[b-y8ecty8yw2] {
        flex-direction: row;
    }

    .bulk-row .ctrl__wrapper[b-y8ecty8yw2] {
        flex: 1 1 0;
    }
}

/* Widening the dialog card itself is a viewport concern (the shared Dialog.razor
   shell sizes to its content's needs), not something a container query on this
   component's own content can drive without a circular size dependency. */
@media (min-width: 640px) {
    .log-absence[b-y8ecty8yw2] {
        min-width: 40rem;
    }
}
/* /Components/Timesheets/Dialogs/LogAbsence/PerDateOverrideList.razor.rz.scp.css */
.per-date-override[b-q42kgnihv2] {
    border-top: 1px solid var(--clr-border-default);
    padding-top: .5rem;
}

.disclosure-toggle[b-q42kgnihv2] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: transparent;
    border: none;
    color: var(--clr-text-muted);
    font: inherit;
    font-size: .875rem;
    min-height: 2.25rem;
    padding: 0;
    cursor: pointer;
}

.disclosure-toggle:hover[b-q42kgnihv2] {
    color: var(--clr-text);
}

.disclosure-toggle:focus-visible[b-q42kgnihv2] {
    outline: none;
    box-shadow: var(--clr-focus-ring-shadow);
}

[b-q42kgnihv2] .disclosure-toggle__chevron {
    transition: transform 150ms ease;
}

[b-q42kgnihv2] .disclosure-toggle__chevron--open {
    transform: rotate(90deg);
}

.override-list[b-q42kgnihv2] {
    list-style: none;
    margin: .5rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.override-row[b-q42kgnihv2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem;
    background: var(--clr-surface-active);
    font-size: .875rem;
}

.override-row__info[b-q42kgnihv2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.override-row__date[b-q42kgnihv2] {
    flex: 0 0 7rem;
    color: var(--clr-text);
    font-weight: 500;
}

.override-pill[b-q42kgnihv2] {
    display: inline-block;
    padding: .25rem .625rem;
    border-radius: .5rem;
    font-size: .75rem;
    color: var(--clr-text);
    background: var(--clr-surface-active);
}

.override-pill--annual[b-q42kgnihv2] {
    background: var(--clr-action-secondary-bg-active);
    color: var(--clr-action-secondary-text);
}

.override-pill--holiday[b-q42kgnihv2] {
    background: var(--clr-action-primary-bg);
    color: var(--clr-action-primary-text);
}

.override-pill--invalid[b-q42kgnihv2] {
    background: var(--clr-danger-bg);
    color: var(--clr-danger);
    border: 1px solid var(--clr-danger);
}

.override-edit[b-q42kgnihv2] {
    min-height: 2.25rem;
    padding: .375rem .75rem;
    font-size: .875rem;
}

.override-row__edit[b-q42kgnihv2] {
    flex-basis: 100%;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: .75rem;
    background: var(--clr-surface);
    border: 1px solid var(--clr-border-default);
    border-radius: .375rem;
}

.ctrl__wrapper[b-q42kgnihv2] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.ctrl__wrapper select[b-q42kgnihv2],
.ctrl__wrapper input[type="text"][b-q42kgnihv2] {
    width: 100%;
}

.override-fields-row[b-q42kgnihv2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.override-save[b-q42kgnihv2] {
    align-self: flex-end;
}

@container log-absence (min-width: 30rem) {
    .override-fields-row[b-q42kgnihv2] {
        flex-direction: row;
    }

    .override-fields-row .ctrl__wrapper[b-q42kgnihv2] {
        flex: 1 1 0;
    }
}
/* /Components/Timesheets/MonthCalendar.razor.rz.scp.css */
.calendar__hint[b-d2ts2qlkuq] {
    margin: 0 0 .5rem;
    color: var(--clr-text-muted);
    font-size: .875rem;
}

.calendar[b-d2ts2qlkuq] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.calendar__weekday-header[b-d2ts2qlkuq] {
    display: none;

    @media (min-width: 768px) {
        display: grid;
        grid-template-columns: repeat(7, 1fr);
        gap: .5rem;
        padding-left: calc(3rem + .5rem);
        color: var(--clr-text-subtle);
        font-weight: 600;[b-d2ts2qlkuq]
    }
}

.calendar__week[b-d2ts2qlkuq] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: 0;
    margin: 0;

    @media (min-width: 768px) {
        flex-direction: row;
        align-items: stretch;
        gap: .5rem;[b-d2ts2qlkuq]
    }
}

.calendar__week-number[b-d2ts2qlkuq] {
    margin: 0;
    padding: .25rem .5rem;
    color: var(--clr-text-subtle);
    font-size: .875rem;

    @media (min-width: 768px) {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 3rem;
        flex-shrink: 0;
        text-align: center;[b-d2ts2qlkuq]
    }
}

.calendar__days[b-d2ts2qlkuq] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: .5rem;

    @media (min-width: 768px) {
        grid-template-columns: repeat(7, 1fr);
        flex: 1;[b-d2ts2qlkuq]
    }

    li {
        display: contents;
    }
}

.calDate[b-d2ts2qlkuq] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    gap: .5rem;
    width: 100%;
    min-height: 44px;
    padding: .5rem .75rem;
    background: var(--clr-surface);
    color: var(--clr-text);
    border: 1px solid var(--clr-border-default);
    border-radius: .25rem;
    cursor: pointer;
    text-align: left;
    font: inherit;

    @media (min-width: 768px) {
        min-height: 6rem;
        padding: .5rem;[b-d2ts2qlkuq]
    }

    /* Only days that open a timesheet; :is(button) also lets it win over the month and today backgrounds */
    &:is(button):hover {
        background: var(--clr-nav-item-hover-bg);
    }

    &:focus-visible[b-d2ts2qlkuq] {
        outline: none;
        border-color: var(--clr-focus-ring-color);
        box-shadow: var(--clr-focus-ring-shadow);
    }
}

.calDate.currentMonth[b-d2ts2qlkuq] {
    background: var(--clr-surface-raised);
}

/* A border rather than a fill, so the status icons keep their contrast, as in the status bar. The inset shadow
   thickens it without changing the cell's size. */
.calDate.today[b-d2ts2qlkuq] {
    background: var(--clr-surface-raised);
    border-color: var(--clr-action-primary-border);
    box-shadow: inset 0 0 0 1px var(--clr-action-primary-border);
    color: var(--clr-text-emphasis);

    &:focus-visible {
        border-color: var(--clr-focus-ring-color);
        box-shadow: var(--clr-focus-ring-shadow);
    }
}

    .calDate.calDate--adjacent-month[b-d2ts2qlkuq] {
        color: var(--clr-text-muted);
        border-style: dashed;
    }

/* Days with no timesheet to open, such as in weeks after this one, so nothing suggests they can be selected */
.calDate.calDate--unselectable[b-d2ts2qlkuq] {
    cursor: default;
}
/* /Components/Timesheets/Pages/CalendarPage.razor.rz.scp.css */
.header__wrapper[b-roiges4tis] {
    margin-block-end: 1rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;

    h1 {
        display: inline-flex;
        align-items: center;
        gap: .5rem;
        margin: 0;
    }

    @media (min-width: 75rem) {
        h2[b-roiges4tis] {
            display: none;
        }
    }

    h2[b-roiges4tis] {
        margin: 0;
    }
}

.actions__wrapper[b-roiges4tis] {
    min-width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    font-size: 1rem;
    margin-block: .75rem;

    select, button {
        flex: 1 1 0;
    }
}
/* /Components/Timesheets/Pages/ClientDetailsPage.razor.rz.scp.css */
.header__wrapper[b-9eafz5c8tr] {
    display: flex;
    gap: .5rem;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 2rem;
}

.rename[b-9eafz5c8tr],
.client-projects[b-9eafz5c8tr] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--clr-border-default);
}

    .client-projects h4[b-9eafz5c8tr] {
        margin: 0 0 1rem;
    }
/* /Components/Timesheets/Pages/ClientsPage.razor.rz.scp.css */
.contentArea[b-qf92vnwmhv]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}

.form__section[b-qf92vnwmhv]{
    margin: 1rem 0;
    padding: .5rem;
    border:1px solid #aaa;
    border-radius: .25rem;
}
/* /Components/Timesheets/Pages/ProjectAllocationsPage.razor.rz.scp.css */
.header__wrapper[b-tccxizu044]{
    display: flex;
    gap: .5rem;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 2rem;
}

.rename[b-tccxizu044] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--clr-border-default);
}

/* The toggle sits beside the filters, so showing or hiding the column only changes the table */
.report-controls[b-tccxizu044] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    column-gap: 1.5rem;
}

.rate-source-toggle[b-tccxizu044] {
    padding-bottom: 1.5rem; /* matches the filter bar's, so their bottoms line up */
}
/* /Components/Timesheets/Pages/ProjectsPage.razor.rz.scp.css */
.contentArea[b-d56ys5riiz]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}
/* /Components/Timesheets/Pages/SummaryPage.razor.rz.scp.css */
.contentArea[b-qrp1uzfaxu]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}

.title__wrapper[b-qrp1uzfaxu] {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding-bottom: 1.5rem;

    h2 {
        display: inline-block;
        margin: 0;
        padding: 0;

        .date {
            display: inline-block;
            width: 10rem;
        }
    }
}

.filters__wrapper[b-qrp1uzfaxu] {
    display: flex;
    padding-bottom: 1.5rem;
    gap: .5rem;
    justify-content: space-between;
    align-items: center;
}

.table th[b-qrp1uzfaxu], .table td[b-qrp1uzfaxu] {
    border: 1px solid var(--clr-border-default);
}

    .table th.date-header[b-qrp1uzfaxu] {
        border-bottom: 1px solid currentColor;
        vertical-align: top;
    }

.date-header[b-qrp1uzfaxu] {
    border-bottom: 1px solid var(--clr-border-default);
}

.table th.user-header[b-qrp1uzfaxu] {
    border-left: 2px solid var(--clr-border-default);
}
.table th.absence-header[b-qrp1uzfaxu] {
    border-left: 2px solid var(--clr-border-default);
}

.client-header[b-qrp1uzfaxu] {
    border-right: 1px solid var(--clr-border-default);
    text-align: right;
}
    .client-header.client-header-first[b-qrp1uzfaxu] {
        border-left: 2px solid var(--clr-border-default);
    }
.absence-user-header[b-qrp1uzfaxu] {
    text-align: right;
}

.user-cell[b-qrp1uzfaxu] {
    border-right: 1px solid var(--clr-border-default);
    text-align: right;
}
    .user-cell.user-cell-first[b-qrp1uzfaxu] {
        border-left: 2px solid var(--clr-border-default);
    }
.user-cell.total-cell[b-qrp1uzfaxu]{
    font-weight: 600;
}
    .user-cell.total-cell.total-cell-first[b-qrp1uzfaxu] {
        border-left: 2px solid var(--clr-border-default);
    }
.absence-cell[b-qrp1uzfaxu]{
    text-align: right;
}
    .absence-cell.absence-cell-first[b-qrp1uzfaxu] {
        border-left: 2px solid var(--clr-border-default);
    }
.absence-cell.total-cell[b-qrp1uzfaxu]{
    font-weight: 600;
}
    .absence-cell.total-cell.absence-total-cell-first[b-qrp1uzfaxu] {
        border-left: 2px solid var(--clr-border-default);
    }
.total-cell[b-qrp1uzfaxu]{
    font-weight: 600;
}
.current-date td:first-of-type[b-qrp1uzfaxu] {
    border-left: 1px solid #000;
}
.current-date td[b-qrp1uzfaxu] {
    background: var(--clr-primary-800);
    color: var(--clr-primary-300);
}


.table-wrapper[b-qrp1uzfaxu] {
    position: relative;
    overflow: auto; /* Ensure scroll works properly */
    padding: 0;     /* Remove padding to avoid offset issues */
    z-index: 0;     /* This aligns non-sticky elements beneath the header */
}

.table[b-qrp1uzfaxu] {
    margin: 0;          /* Remove margins above/below table */
    border-spacing: 0;  /* Removes gaps between table rows and cells */
    border-collapse: collapse; /* Ensures rows and cells touch */
}

    .table th[b-qrp1uzfaxu] {
        margin: 0; /* Reset margin to avoid any gaps */
        padding: 8px; /* Provide consistent spacing inside each header cell */
        background-color: var(--clr-surface); /* Ensure no transparency */
        border: 1px solid var(--clr-border-default); /* Optional: Add consistent borders */
    }

    /* Apply to first header row */
    .table thead tr:nth-child(1) th[b-qrp1uzfaxu] {
        position: sticky; /* Make header row sticky */
        top: 60px; /* Adjust based on the height of any content above */
        z-index: 10; /* Ensure it sits above the table rows */
        background-color: var(--clr-surface); /* Add solid background color to block content behind */
    }

        .table thead tr:nth-child(1) th.user-header[b-qrp1uzfaxu] {
            border-left: 2px solid var(--clr-border-default);
        }

        .table thead tr:nth-child(1) th.absence-user-header.absence-user-header-first[b-qrp1uzfaxu] {
            border-left: 2px solid var(--clr-border-default);
        }
    
    /* Apply to second header row */
    .table thead tr:nth-child(2) th[b-qrp1uzfaxu] {
        position: sticky; /* Make the second row sticky */
        top: 100px; /* Adjust based on the height of the first row and the content above */
        z-index: 2; /* Ensure it sits above the content but below the first row */
        background-color: var(--clr-surface); /* Solid background to block table content */
    }

        .table thead tr:nth-child(2) th.absence-user-header.absence-user-header-first[b-qrp1uzfaxu] {
            border-left: 2px solid var(--clr-border-default);
        }

        .table thead tr:nth-child(2) th.client-header.client-header-first[b-qrp1uzfaxu] {
            border-left: 2px solid var(--clr-border-default);
        }

.date-cell[b-qrp1uzfaxu]{
    width: 23rem;
}
/* /Components/Timesheets/Pages/SummaryPage2.razor.rz.scp.css */
.contentArea[b-ewlnsch1rd]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}

h2[b-ewlnsch1rd] {
    display: inline-block;
    margin-bottom: 1.5rem;
}

.filters__wrapper[b-ewlnsch1rd] {
    display: flex;
    padding-bottom: 1.5rem;
    gap: .5rem;
    align-items: center;
}

.table th[b-ewlnsch1rd], .table td[b-ewlnsch1rd] {
    border: 1px solid var(--clr-border-default);
}

    .table th.date-header[b-ewlnsch1rd] {
        border-bottom: 1px solid currentColor;
        vertical-align: top;
    }

.date-header[b-ewlnsch1rd] {
    border-bottom: 1px solid var(--clr-border-default);
}

.table th.user-header[b-ewlnsch1rd] {
    border-left: 2px solid var(--clr-border-default);
}
.table th.absence-header[b-ewlnsch1rd] {
    border-left: 2px solid var(--clr-border-default);
}

.client-header[b-ewlnsch1rd] {
    border-right: 1px solid var(--clr-border-default);
    text-align: right;
}
    .client-header.client-header-first[b-ewlnsch1rd] {
        border-left: 2px solid var(--clr-border-default);
    }
.absence-user-header[b-ewlnsch1rd] {
    text-align: right;
}

.user-cell[b-ewlnsch1rd] {
    border-right: 1px solid var(--clr-border-default);
    text-align: right;
}
    .user-cell.user-cell-first[b-ewlnsch1rd] {
        border-left: 2px solid var(--clr-border-default);
    }
.user-cell.total-cell[b-ewlnsch1rd]{
    font-weight: 600;
}
    .user-cell.total-cell.total-cell-first[b-ewlnsch1rd] {
        border-left: 2px solid var(--clr-border-default);
    }
.absence-cell[b-ewlnsch1rd]{
    text-align: right;
}
    .absence-cell.absence-cell-first[b-ewlnsch1rd] {
        border-left: 2px solid var(--clr-border-default);
    }
.absence-cell.total-cell[b-ewlnsch1rd]{
    font-weight: 600;
}
    .absence-cell.total-cell.absence-total-cell-first[b-ewlnsch1rd] {
        border-left: 2px solid var(--clr-border-default);
    }
.total-cell[b-ewlnsch1rd]{
    font-weight: 600;
}
.current-date td:first-of-type[b-ewlnsch1rd] {
    border-left: 1px solid var(--clr-border-default);
}
.current-date td[b-ewlnsch1rd] {
    background: var(--clr-primary-800);
    color: var(--clr-primary-300);
}


.table-wrapper[b-ewlnsch1rd] {
    position: relative;
    overflow: auto; /* Ensure scroll works properly */
    padding: 0; /* Remove padding to avoid offset issues */
    z-index: 0; /* This aligns non-sticky elements beneath the header */
}

.table[b-ewlnsch1rd] {
    margin: 0;      /* Remove margins above/below table */
    border-spacing: 0; /* Remove gaps between table rows and cells */
    border-collapse: collapse; /* Ensure rows and cells touch */
}

.table th[b-ewlnsch1rd] {
    margin: 0;      /* Reset margin to avoid any gaps */
    padding: 8px;   /* Provide consistent spacing inside each header cell */
    background-color: var(--clr-surface); /* Ensure no transparency */
    border: 1px solid var(--clr-border-default); /* Optional: Add consistent borders */
}

/* First header row */
.table thead tr:nth-child(1) th[b-ewlnsch1rd] {
    position: sticky;       /* Make the header row sticky */
    top: 60px;              /* Adjust based on the height of any content above */
    z-index: 10;            /* Ensure it sits above the table rows */
    background-color: var(--clr-surface); /* Add solid background color to block content behind */
}
.table thead tr:nth-child(1) th.user-header[b-ewlnsch1rd] {
    border-left: 2px solid var(--clr-border-default);
}
.table thead tr:nth-child(1) th.absence-user-header.absence-user-header-first[b-ewlnsch1rd] {
    border-left: 2px solid var(--clr-border-default);
}
/* Second header row (as using rowspan) */
.table thead tr:nth-child(2) th[b-ewlnsch1rd] {
    position: sticky;       /* Make the second row sticky */
    top: 100px;             /* Adjust based on height of the first row and the content above */
    z-index: 2;             /* Ensure it sits above the content but below the first row */
    background-color: var(--clr-surface); /* Solid background to block table content */
}
.table thead tr:nth-child(2) th.absence-user-header.absence-user-header-first[b-ewlnsch1rd] {
    border-left: 2px solid var(--clr-border-default);
}
.table thead tr:nth-child(2) th.client-header.client-header-first[b-ewlnsch1rd] {
    border-left: 2px solid var(--clr-border-default);
}

.date-cell[b-ewlnsch1rd]{
    width: 23rem;
}

.ctrl__wrapper[b-ewlnsch1rd]{
    display: flex;
    gap:.25rem;
}
.ctrl__wrapper.col[b-ewlnsch1rd] {
    flex-direction: column;
}

button[b-ewlnsch1rd]{
    align-self: flex-end;
}
/* /Components/Timesheets/Pages/TimesheetPage.razor.rz.scp.css */
/* On desktop, the Edit timesheet switch sits on the same row as the timesheet owner's name */
.tsMeta__wrapper[b-08w11gg7ry] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-block-end: 1.5rem;
}

@media (min-width: 1024px) {
    .tsMeta__wrapper[b-08w11gg7ry] {
        flex-direction: row;
        align-items: flex-start;
        gap: 2rem;
    }
}

.tsMeta[b-08w11gg7ry]{
    margin-block-end: 0;
    font-size: 1.25rem;
    
    .weekNum{
        color: var(--clr-text-subtle);
    }
}

.header__wrapper[b-08w11gg7ry] {
    margin: 0 auto 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    max-width: min(100%, 1400px);
    box-sizing: border-box;
    border-radius: .5rem;
}

.inlineWrapper[b-08w11gg7ry] {
    border: 1px solid var(--clr-danger);
    display: inline-block;
    width: 15rem;
    min-width: 15rem;
    background: #ccc;
}

.toolbar[b-08w11gg7ry] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

.toolbar .weekNumDesc[b-08w11gg7ry] {
    color: var(--clr-text-subtle);
    display: none;
}

@media (min-width: 1024px) {
    .toolbar .weekNumDesc[b-08w11gg7ry] {
        display: unset;
    }
}

.toolbar .weekDesc[b-08w11gg7ry] {
    color: var(--clr-text-muted);
}

.actions__wrapper[b-08w11gg7ry] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

.subtitle__wrapper[b-08w11gg7ry] {
    padding: .5rem 0;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 2rem;
    align-items: flex-start;
    max-width: 100%;
}

@media (min-width: 1300px) {
    .subtitle__wrapper[b-08w11gg7ry] {
        flex-direction: row;
        align-items: center;
    }
}

.subtitle__wrapper h2[b-08w11gg7ry] {
    display: inline-flex;
    margin: 0;
    font-size: 1.25rem;
    flex-wrap: wrap;
    gap: 2rem;
}

.subtitle__wrapper h2 .weekDesc[b-08w11gg7ry] {
    white-space: nowrap;
}

.subtitle__wrapper h2.userName[b-08w11gg7ry] {
    white-space: nowrap;
}

/*.weekMeta{*/
/*    font-size: 1.5rem;*/
/*    font-weight: 400;*/
/*}*/

.secondary__wrapper[b-08w11gg7ry] {
    padding-block: 1rem;
    display: flex;
    gap: .5rem;
    justify-content: flex-end;
    align-items: center;
}

.timesheet__id[b-08w11gg7ry] {
    font-size: 1rem;
    font-weight: 400;
    color: var(--clr-text-subtle);
    align-self: flex-end;
}

.bankHolidayAlert[b-08w11gg7ry] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    background: var(--clr-surface);
    color: var(--clr-text);
    margin-block-end: 1.5rem;
}

.bankHolidayList[b-08w11gg7ry] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding-left: 0;
    list-style-type: none;
    margin: 0;
}

.bankHolidayList__item[b-08w11gg7ry] {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    align-items: center;
    background: var(--clr-surface-raised);
    padding: 1rem;
    border-radius: .25rem;
}

.bankHoliday__title[b-08w11gg7ry] {
    width: 25rem;
}

.bankHolidayAlert:not(button)[b-08w11gg7ry] {
    font-weight: 600;
    color: var(--clr-text);
}

.bankHolidayAlert button[b-08w11gg7ry] {
    flex-grow: 0;
}

.download__wrapper[b-08w11gg7ry] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    align-items: center;
}

label[b-08w11gg7ry] {
    display: inline-block;
    min-width: 5rem;
}

.actions__wrapper span[b-08w11gg7ry] {
    display: inline-block;
}

.addRow[b-08w11gg7ry] {
    background: #ccc;
}

.table[b-08w11gg7ry] {
    margin-bottom: 2rem;
}

.validation-errors[b-08w11gg7ry] {
    display: flex;
    flex-direction: row;
    gap: .5rem;
    padding-left: 0;
    margin-bottom: 0;
}

.actions__wrapper.addEntry[b-08w11gg7ry] {
    padding-top: 1.5rem;
}

.danger[b-08w11gg7ry] {
    color: var(--clr-danger);
    font-weight: 600;
}

.submission__wrapper[b-08w11gg7ry] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: space-between;
    align-items: center;
}

.submission__wrapper button[b-08w11gg7ry] {
    margin-left: auto;
    min-width: 11rem;
}

.submissionError[b-08w11gg7ry] {
    color: red;
}
/* NEW LAYOUT */
@media (min-width: 900px) {
    .secondary__wrapper[b-08w11gg7ry],
    .submission__wrapper[b-08w11gg7ry],
    .actions__wrapper[b-08w11gg7ry] {
        flex-wrap: wrap;
    }
}

.allocations__wrapper[b-08w11gg7ry] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: min(100%, 1400px);
}

.add-entry-btn[b-08w11gg7ry] {
    align-self: flex-start;
    margin-block-end: 1.5rem;
    width: 100%;
}

.headingActions__wrapper[b-08w11gg7ry] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
    margin-block-start: 2.5rem;
    margin-block-end: 1rem;
    align-items: center;
    max-width: min(100%, 1400px);
}

.headingActions__wrapper h2[b-08w11gg7ry] {
    margin: 0;
}

.headingActions__wrapper .actions[b-08w11gg7ry] {
    display: flex;
    gap: .5rem;
    align-items: center;
}

.muted[b-08w11gg7ry]{
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/Pages/TimesheetsPage.razor.rz.scp.css */
.contentArea[b-ibq7hvkt4z]{
    margin: 0 auto;
    max-width: min(100%, 1600px); /* room for the filters, quick filters and actions on one line */
}

.actions_wrapper[b-ibq7hvkt4z] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* The filters, quick filters and bulk actions, side by side when they fit. None shrinks, so each moves to the next
   line as a group before any wraps its own controls, which they do only when wider than the screen. */
.list-header[b-ibq7hvkt4z] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    padding-bottom: 1.5rem;
}

    .list-header > *[b-ibq7hvkt4z] {
        flex: 0 0 auto;
        max-width: 100%;
    }

/* The summary of what's shown and the pager, on the right, wrapping on narrow screens */
.list-footer[b-ibq7hvkt4z] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    column-gap: 1rem;
}

    .list-footer > p[b-ibq7hvkt4z] {
        margin: 0;
    }
/* /Components/Timesheets/ProjectAllocationsFilterBar.razor.rz.scp.css */
.filters__wrapper[b-3a2fmrct96] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: .5rem;
    align-items: flex-end;
    padding-bottom: 1.5rem;
}

.ctrl__wrapper[b-3a2fmrct96] {
    flex: 0 0 auto; /* size to the control, never grow into the spare row width */
    display: flex;
    gap: .25rem;
}

    .ctrl__wrapper.col[b-3a2fmrct96] {
        flex-direction: column;
    }
/* /Components/Timesheets/ProjectAllocationsTable.razor.rz.scp.css */
.table[b-e94opv3ewg] {
    margin: 0 0 1.5rem;
    border-collapse: separate; /* keeps cell borders attached to sticky cells while scrolling */
    border-spacing: 0;
}

    .table th[b-e94opv3ewg],
    .table td[b-e94opv3ewg] {
        border-bottom: 1px solid var(--clr-border-default);
    }

    .table thead th[b-e94opv3ewg],
    .table tfoot th[b-e94opv3ewg],
    .table tfoot td[b-e94opv3ewg] {
        position: sticky;
        z-index: 1;
        background-color: var(--clr-surface);
        color: var(--clr-text);
    }

    .table thead th[b-e94opv3ewg] {
        top: 0;
        border-bottom-color: currentColor;

        @media (min-width: 641px) {
            top: 60px;[b-e94opv3ewg] /* sits beneath the sticky top row (see MainLayout.razor.css) */
        }
    }

    .table tfoot th[b-e94opv3ewg],
    .table tfoot td[b-e94opv3ewg] {
        bottom: 1.5rem;
        /* Keep the 1.5rem gap below the stuck footer: paint the page background over rows scrolling beneath it */
        box-shadow: 0 1.5rem 0 var(--clr-bg);
        font-weight: 600;
        border-top: 1px solid currentColor;
        border-bottom: none;
    }

/* Date, user, days, day rate and charge shrink to their content; description takes the remaining width */
.fit[b-e94opv3ewg] {
    width: 1%;
    white-space: nowrap;
}

.num[b-e94opv3ewg] {
    text-align: right;
}

.no-matches[b-e94opv3ewg] {
    color: var(--clr-text-muted);
    font-style: italic;
}

/* "Not set", "Charged separately" and "Not billable" read as absent values, not amounts */
.muted[b-e94opv3ewg] {
    color: var(--clr-text-muted);
    font-weight: normal;
}
/* /Components/Timesheets/ProjectSelect.razor.rz.scp.css */
.select__wrapper[b-hopc3pztmm] {
    display: flex;
    min-width: 12rem;
    max-width: 12rem;
}

.select__wrapper.col[b-hopc3pztmm] {
    flex-direction: column;
}

.select__wrapper.full-width[b-hopc3pztmm] {
    min-width: 100%;
    max-width: 100%;
}

.select__wrapper[b-hopc3pztmm]  select {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding-right: 2rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23c9c3ff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: right .5rem center;
    background-repeat: no-repeat;
    background-size: .75rem;
}

.select__wrapper[b-hopc3pztmm]  select::-ms-expand {
    display: none;
}
/* /Components/Timesheets/Rates/AddDayRateForm.razor.rz.scp.css */
fieldset[b-tzhz7nopfh] {
    border: 0;
    margin: 0;
    padding: 0;
}

legend[b-tzhz7nopfh] {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: .5rem;
}

.fields[b-tzhz7nopfh] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .5rem 1rem;
}

    .fields .btn[b-tzhz7nopfh] {
        margin-top: 1.5rem; /* lines the button up with the inputs beneath their labels */
    }

.ctrl__wrapper[b-tzhz7nopfh] {
    flex: 0 0 auto;
    display: flex;
    gap: .25rem;
}

    .ctrl__wrapper.col[b-tzhz7nopfh] {
        flex-direction: column;
    }

.amount[b-tzhz7nopfh] {
    display: flex;
    align-items: center;
    gap: .25rem;
}

/* Persistent live region with reserved height, so the message doesn't shift the page */
.status[b-tzhz7nopfh] {
    min-height: 1.5em;
    margin: .5rem 0 0;
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/Rates/ClientDefaultRatesSection.razor.rz.scp.css */
.default-rates[b-k7fil8hw6w] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

    .default-rates h4[b-k7fil8hw6w] {
        margin: 0;
    }

.help[b-k7fil8hw6w] {
    margin: 0;
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/Rates/DayRatesList.razor.rz.scp.css */
.rates[b-8lvel0gek1] {
    margin: 0 0 .5rem;
}

    .rates th[b-8lvel0gek1],
    .rates td[b-8lvel0gek1] {
        vertical-align: top;
        border-bottom: 1px solid var(--clr-border-default);
    }

/* User and current rate shrink to their content; history takes the remaining width */
.fit[b-8lvel0gek1] {
    width: 1%;
    white-space: nowrap;
}

.num[b-8lvel0gek1] {
    text-align: right;
}

.muted[b-8lvel0gek1],
.no-rates[b-8lvel0gek1],
.rates-ignored[b-8lvel0gek1],
.status[b-8lvel0gek1] {
    color: var(--clr-text-muted);
}

details ul[b-8lvel0gek1] {
    list-style: none;
    margin: .5rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

details li[b-8lvel0gek1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.rate-text[b-8lvel0gek1] {
    min-width: 12rem;
}

/* Keeps Cancel in place when Delete swaps to Confirm delete */
.confirm-delete[b-8lvel0gek1] {
    min-width: 9rem;
}
/* /Components/Timesheets/Rates/ProjectBillingAndRatesSection.razor.rz.scp.css */
.billing-rates[b-59c2d79lug] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--clr-border-default);
}

    .billing-rates h4[b-59c2d79lug],
    .billing-rates h5[b-59c2d79lug] {
        margin: 0;
    }

.help[b-59c2d79lug] {
    margin: 0;
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/Rates/ProjectBillingSetting.razor.rz.scp.css */
.billing__wrapper[b-a411410opt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.status[b-a411410opt] {
    color: var(--clr-text-muted);
}

.help[b-a411410opt] {
    margin: .25rem 0 0;
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/RenameForm.razor.rz.scp.css */
fieldset[b-wevguos33y] {
    border: 0;
    margin: 0;
    padding: 0;
}

legend[b-wevguos33y] {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: .5rem;
}

.fields[b-wevguos33y] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .5rem 1rem;
}

    .fields .btn[b-wevguos33y] {
        margin-top: 1.5rem; /* lines the button up with the input beneath its label */
    }

.ctrl__wrapper[b-wevguos33y] {
    flex: 0 0 auto;
    display: flex;
    gap: .25rem;
}

    .ctrl__wrapper.col[b-wevguos33y] {
        flex-direction: column;
    }

/* Persistent live region with reserved height, so the message doesn't shift the page */
.status[b-wevguos33y] {
    min-height: 1.5em;
    margin: .5rem 0 0;
    color: var(--clr-text-muted);
}
/* /Components/Timesheets/SubmittedTimesheet.razor.rz.scp.css */
.submissionMeta[b-s1eapwzm4s] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    
    @media (min-width: 600px) {
        .success[b-s1eapwzm4s], .warning[b-s1eapwzm4s]{
            text-wrap: nowrap;
        }
    }
}

.success[b-s1eapwzm4s] {
    background: var(--clr-success-bg);
    color: var(--clr-success);
    border-radius: .5rem;
    display: inline-block;
    padding: .5rem 1rem;
}

.warning[b-s1eapwzm4s] {
    background: var(--clr-warning-bg);
    color: var(--clr-warning);
    border-radius: .5rem;
    display: inline-block;
    padding: .5rem 1rem;
}

.submission__footer[b-s1eapwzm4s] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding-block: 1rem;

    .actions {
        margin-left: auto;
        padding-block: 0;
    }
}

.actions[b-s1eapwzm4s] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
    padding-block: 1rem;

    .splitViewToggle {
        display: none;

        @media (min-width: 1024px) {
            display: unset;[b-s1eapwzm4s]
        }
    }
}
/* /Components/Timesheets/TimesheetAbsences.razor.rz.scp.css */
.absenceList[b-lux7td93b2]{
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;  
    list-style-type: none;
    
    .absenceItem{
        display: flex;
        flex-direction: column;
        gap: 1rem;
        background: var(--clr-surface);
        padding: 1rem;
        border-radius: .5rem;

        @media (min-width: 1024px){
            flex-direction: row;
            gap: 1rem;
            flex: unset;
            align-items: center;
            justify-content: space-between;[b-lux7td93b2]
        }
        
        .absence{
            display: flex;
            flex-direction: column;
            gap: 1rem;

            .absenceData{
                display: flex;
                flex-direction: column;
                gap: 1rem;

                @media (min-width: 768px){
                    flex-direction: row;
                    gap: 1.5rem;[b-lux7td93b2]
                }

                .durationAndType{
                    display: flex;
                    gap: .25rem;
                }
            }
        }
        
        .absenceActions[b-lux7td93b2]{
            display: flex;
            gap: .5rem;
            
            button{
                flex: 1;

                @media (min-width: 1024px){
                    flex: unset;
                    min-width: 6rem;[b-lux7td93b2]
                }
            }
        }
    }
}
/* /Components/Timesheets/TimesheetCommentOptions.razor.rz.scp.css */
.comment-options[b-2o6ntw3z0c] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}
/* /Components/Timesheets/TimesheetEntriesCards.razor.rz.scp.css */
.submittedEntries--cards[b-olj9lv8phd] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;

    @media (min-width: 1024px) {
        display: none;[b-olj9lv8phd]
    }
}

.entries-day[b-olj9lv8phd] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.entries-day__header[b-olj9lv8phd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--clr-border-default);
}

.entries-day__label[b-olj9lv8phd] {
    margin: 0;
    font-size: 1rem;
    font-weight: 500;
    color: var(--clr-text);
}

.entries-day__total[b-olj9lv8phd] {
    flex-shrink: 0;
    padding: .25rem .625rem;
    border-radius: 999px;
    background: var(--clr-action-primary-bg);
    color: var(--clr-action-primary-text);
    font-size: 1rem;
    font-weight: 600;
}

.entries-day__list[b-olj9lv8phd] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.entry-card[b-olj9lv8phd] {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: 1rem;
    border-radius: .5rem;
    background: var(--clr-surface-raised);
}

.entry-card__client[b-olj9lv8phd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border-radius: .5rem;
    background: var(--clr-action-secondary-bg-active);
    color: var(--clr-action-secondary-text);
    font-size: .875rem;
    font-weight: 500;
}

.entry-card__body[b-olj9lv8phd] {
    display: flex;
    flex-direction: column;
    gap: .1875rem;
    min-width: 0;
    flex: 1 1 auto;
}

.entry-card__project[b-olj9lv8phd] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--clr-secondary-300);
}

.entry-card__task[b-olj9lv8phd] {
    font-size: 1rem;
    color: var(--clr-text-subtle);
}

.entry-card__task--empty[b-olj9lv8phd] {
    font-style: italic;
}

.entry-card__comment[b-olj9lv8phd] {
    margin: 0;
    font-size: .875rem;
    font-style: italic;
    color: var(--clr-text-subtle);
    white-space: pre-line;
}

.entry-card__duration[b-olj9lv8phd] {
    flex-shrink: 0;
    padding: .25rem .875rem;
    border: 1px solid var(--clr-border-default);
    border-radius: 999px;
    background: var(--clr-bg);
    color: var(--clr-text-muted);
    font-size: .875rem;
    font-weight: 500;
}

.entries-total[b-olj9lv8phd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding-top: .75rem;
    border-top: 1px solid var(--clr-border-default);
}

.entries-total__label[b-olj9lv8phd] {
    font-size: .875rem;
    font-weight: 500;
    color: var(--clr-text-muted);
}

.entries-total__value[b-olj9lv8phd] {
    padding: .375rem .875rem;
    border-radius: 999px;
    background: var(--clr-action-primary-bg);
    color: var(--clr-action-primary-text);
    font-size: 1rem;
    font-weight: 500;
}

.entries-empty[b-olj9lv8phd] {
    padding: 1rem 0;
    color: var(--clr-text-subtle);
    font-style: italic;
    text-align: center;
}
/* /Components/Timesheets/TimesheetEntriesTable.razor.rz.scp.css */
.submittedEntries--table[b-7d9qvsj1pw] {
    display: none;

    @media (min-width: 1024px) {
        display: table;[b-7d9qvsj1pw]
    }
}

.split-days-row[b-7d9qvsj1pw]{
    background: var(--clr-bg);
    border-top: none;
    
    th{
        border-top: none;
        
        &.split-days-cell{
            border-top: 1px solid var(--clr-border-default);
            background: var(--clr-surface);
        }
    }
}

.split-days-cell[b-7d9qvsj1pw] {
    border: 1px solid var(--clr-border-default);
}

td.footer-cell[b-7d9qvsj1pw] {
    border: 1px solid var(--clr-border-default);
    border-left: none;
}

/* /Components/Timesheets/TimesheetEntryRow.razor.rz.scp.css */
.entry-card[b-tx5pjihgiw] {
    display: block;
    background: var(--clr-surface-raised);
    border-radius: .25rem;
    border: 1px solid var(--clr-border-default);
}

.entry-card:focus-within[b-tx5pjihgiw] {
    border-color: var(--clr-focus-ring-color);
}

/* No gap here: the comment field sits in .timesheet-row__bottom, not the fields
   grid, but its spacing from the fields above (.5rem) differs from the spacing
   between it, the actions and the validation summary (1rem, .75rem from 900px),
   so each gap is set on the element that owns it instead. */
.timesheet-row[b-tx5pjihgiw] {
    display: grid;
    width: 100%;
    max-width: 100%;
    padding: 1rem;
    border: 1px solid var(--clr-border-default);
    border-radius: .25rem;
    background: var(--clr-surface-active);
}

.timesheet-row__fields[b-tx5pjihgiw] {
    display: grid;
    min-width: 0;
    gap: .5rem;
    align-items: end;
    /* overflow-x: auto below also forces overflow-y: auto, which clips the 1px
       outline (validation / hover / focus) that inputs paint outside their
       border box wherever they touch this grid's edge. 1px padding gives the
       outline room; the matching negative margin keeps the layout unchanged. */
    padding: 1px;
    margin: -1px -1px calc(.5rem - 1px);
    /* Safety net: date/client/project/duration below (1280px+) are fixed-width
       and don't shrink, so this keeps the row from blowing out the whole page
       horizontally if the viewport ever gets too narrow for them - only this
       grid would gain a scrollbar. */
    overflow-x: auto;
}

.timesheet-row__bottom[b-tx5pjihgiw] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.timesheet-row[b-tx5pjihgiw]  > .validation-errors {
    margin-top: 1rem;
}

.timesheet-row__actions[b-tx5pjihgiw] {
    display: grid;
    grid-auto-flow: column;
    gap: .5rem;
}

.timesheet-row__actions button[b-tx5pjihgiw] {
    min-width: 44px;
}

.timesheet-row__actions .btn-label[b-tx5pjihgiw] {
    display: none;
}

@media (min-width: 768px) {
    .timesheet-row__actions button[b-tx5pjihgiw] {
        min-width: 88px;
    }
}

/* There are 5 buttons and not enough room for labels until the viewport is wide enough */
@media (min-width: 870px) {
    .timesheet-row__actions .btn-label[b-tx5pjihgiw] {
        display: inline-flex;
    }
}

/* Cancel and Save are the two most consequential actions in this group, and
   their icons alone (an arrow-like "undo" glyph, a floppy disk) aren't strong
   enough indicators of what they do. Below 870px every other button in this
   group drops its label for its icon (rule above); these two do the opposite -
   keep the label, drop the icon - so they stay unambiguous exactly where space
   is tightest. Targeted by class, as each button's aria-label names its row (#445);
   the classes are shared by both the per-entry row and the pending/new-entry row. */
.timesheet-row__actions button.timesheet-row__cancel .btn-label[b-tx5pjihgiw],
.timesheet-row__actions button.timesheet-row__save .btn-label[b-tx5pjihgiw] {
    display: inline-flex;
}

@media (max-width: 869.98px) {
    .timesheet-row__actions button.timesheet-row__cancel[b-tx5pjihgiw]  .app-icon,
    .timesheet-row__actions button.timesheet-row__save[b-tx5pjihgiw]  .app-icon {
        display: none;
    }
}

@media (min-width: 900px) {
    .timesheet-row__fields[b-tx5pjihgiw] {
        grid-template-columns: 1fr 1fr;
    }

    .timesheet-row__bottom[b-tx5pjihgiw] {
        gap: .75rem;
    }

    .timesheet-row[b-tx5pjihgiw]  > .validation-errors {
        margin-top: .75rem;
    }

    .timesheet-row__actions[b-tx5pjihgiw] {
        height: auto;
        line-height: normal;
        align-self: flex-end;
    }
}

/* Below 1280px, .timesheet-row__fields stays in the 1fr 1fr layout from the
   900px breakpoint above, which has no fixed minimum width. */
@media (min-width: 1280px) {
    .timesheet-row__fields[b-tx5pjihgiw] {
        /* date is as wide as the browser draws the date input (Firefox needs
           more than Chrome, #410); client/project/duration are fixed; task-field
           takes whatever width is left so the row fills the available content
           area instead of leaving a gap past the fixed columns. */
        grid-template-columns: max-content 14rem 14rem 1fr 9rem;
    }

    /* Comment and actions share one row: actions keep their natural width and
       the comment field takes the rest. Top-aligned so the buttons line up with
       the textarea rather than the character count beneath it. */
    .timesheet-row__bottom[b-tx5pjihgiw] {
        flex-direction: row;
        gap: .5rem;
    }

    .timesheet-row__actions[b-tx5pjihgiw] {
        flex: none;
        align-self: flex-start;
    }

    .comment-field[b-tx5pjihgiw] {
        flex: 1;
    }

    .timesheet-row[b-tx5pjihgiw]  > .validation-errors {
        margin-top: .5rem;
    }
}

.field[b-tx5pjihgiw] {
    min-width: 0;
}

/* ::deep is required below: every .field holds a child component (InputDate,
   ClientSelect, ProjectSelect, MrgInputTextTrim, CustomInputNumber,
   InputTextArea) whose rendered markup does not carry this component's scope
   attribute. Without ::deep these rules match nothing. */
.field[b-tx5pjihgiw]  > * {
    min-width: 0;
}

.date-field[b-tx5pjihgiw],
.client-field[b-tx5pjihgiw],
.project-field[b-tx5pjihgiw],
.task-field[b-tx5pjihgiw],
.duration-field[b-tx5pjihgiw] {
    min-width: 0;
}

/* max-width overrides the global app.css input[type='date'] { max-width: max-content }
   so the date input fills its grid track below 1280px. */
.date-field[b-tx5pjihgiw]  input {
    width: 100%;
    max-width: none;
}

/* width overrides .field ::deep > * { min-width: 0 } above, which otherwise wins
   over the global .full-width class's min-width: 100% (equal specificity, later
   in source order) and lets the input shrink below its track width. */
.task-field[b-tx5pjihgiw]  input {
    width: 100%;
}

/* CustomInputNumber only ever shows a minus button, a short number and a plus
   button, so it should stay a constant width rather than stretch to fill its
   grid cell - which it otherwise does (CustomInputNumber.razor.css sets
   .input-group { width: 100% }) in the 1fr 1fr / single-column layouts below
   1280px, where the duration-field cell is much wider than the control needs.
   9rem matches the fixed duration column width used at 1280px+. */
.duration-field[b-tx5pjihgiw]  .input-group {
    width: 9rem;
}

/* width: without it the comment textarea falls back to the browser's native
   intrinsic textarea width (it's a direct child of .field, so
   .field ::deep > * { min-width: 0 } above wins over the global .full-width
   class at equal specificity, same as date-field/task-field).

   No rows attribute is set on the <textarea> in the markup, deliberately:
   field-sizing: content replaces the browser's native rows-based sizing
   entirely, so rows has no effect where this is supported (verified - setting
   rows="1" made no difference to the rendered height). Where field-sizing
   isn't supported (older Firefox), the textarea falls back to the browser's
   own multi-row default instead of being stuck at a cramped, scrolling
   single row, which is what rows="1" caused there. */
.comment-field[b-tx5pjihgiw]  textarea {
    width: 100%;
    max-width: 100%;
    field-sizing: content;
    min-height: 1lh;
}
/* /Components/Timesheets/TimesheetQuickFilters.razor.rz.scp.css */
/* The two groups sit side by side, and stack when there isn't room */
.quick-filters[b-5324y1dqo0] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1rem;
}

.quick-filters__group[b-5324y1dqo0] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* The same colours as the other chips, as a pill the height of the filter controls */
.chip[b-5324y1dqo0] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    min-height: 44px;
    padding: .375rem .875rem .375rem .625rem;
    font: inherit;
    white-space: nowrap;
    background: var(--clr-action-secondary-bg);
    color: var(--clr-action-secondary-text);
    border: 1px solid var(--clr-action-secondary-border);
    border-radius: 22px;
    cursor: pointer;
}

.chip:hover:not(.chip--selected)[b-5324y1dqo0] {
    background: var(--clr-action-secondary-bg-hover);
}

.chip:focus-visible[b-5324y1dqo0] {
    outline: none;
    box-shadow: var(--clr-focus-ring-shadow);
}

.chip--selected[b-5324y1dqo0] {
    background: var(--clr-action-secondary-bg-active);
    font-weight: 500;
}

/* A tick in a circle in the text colour, inverted when the chip is pressed */
.chip__tick[b-5324y1dqo0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border: 1px solid currentColor;
    border-radius: 50%;
    color: var(--clr-action-secondary-text);
}

.chip--selected .chip__tick[b-5324y1dqo0] {
    background: var(--clr-action-secondary-text);
    border-color: var(--clr-action-secondary-text);
    color: var(--clr-action-secondary-bg-active);
}
/* /Components/Timesheets/TimesheetsChangedNotice.razor.rz.scp.css */
/* A banner across the top of the page when the list is out of date; the region itself takes no space until then */
.changed-notice__banner[b-phgux00pdz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .5rem 1rem;
    margin-bottom: 1rem;
    padding: .5rem 1rem;
    background: var(--clr-warning-bg);
    border: 1px solid var(--clr-warning);
    border-radius: .375rem;
    color: var(--clr-text);
}

    .changed-notice__banner > p[b-phgux00pdz] {
        margin: 0;
    }
/* /Components/Timesheets/TimesheetsFilterBar.razor.rz.scp.css */
.filters__wrapper[b-w8kd4ntwie] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: .5rem;
    align-items: flex-end;
}

.ctrl__wrapper[b-w8kd4ntwie] {
    flex: 0 0 auto; /* size to the control, never grow into the spare row width */
    display: flex;
    gap: .25rem;
}

    .ctrl__wrapper.col[b-w8kd4ntwie] {
        flex-direction: column;
    }
/* /Components/Timesheets/TimesheetsTable.razor.rz.scp.css */
tr[b-kdc09q59ka] {
    vertical-align: middle;
}
/* /Components/Timesheets/TimesheetStatus.razor.rz.scp.css */
.daysRecorded[b-h8tnw6t2ug] {
    display: inline-flex;
    flex-direction: column;
    max-width: 100%;
    overflow: hidden;
    background: var(--clr-surface);
    border-radius: .5rem;

    @media (min-width: 1024px) {
        flex-direction: row;[b-h8tnw6t2ug]
    }
}
/* /Components/Timesheets/TimesheetTotal.razor.rz.scp.css */
.totalDuration[b-7u172pep00] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    white-space: nowrap;
    font-weight: 400;
    font-size: 1.25rem;
    color: var(--clr-primary-200);
    padding: .5rem;
    gap: 1rem;
    align-items: baseline;

    @media (min-width: 1024px) {
        flex-direction: column;
        gap: 0;
        padding: .5rem 1rem;[b-7u172pep00]
    }

    .numDays {
        font-size: 2rem;
        color: var(--clr-text-muted);
    }

    .label[b-7u172pep00] {
        font-size: 1rem;
        text-transform: capitalize;
        color: var(--clr-text-subtle);
    }
}
/* /Components/Timesheets/TimesheetWeekStatus.razor.rz.scp.css */
.dayCompletions__wrapper[b-qfd1mj5bmc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
    padding: .5rem;
    min-height: 3.75rem;
    border-top: 1px solid var(--clr-border-default);
    max-width: 100%;

    @media (min-width: 1024px) {
        border-top: none;
        border-left: 1px solid var(--clr-border-default);
        padding: .5rem 1rem;[b-qfd1mj5bmc]
    }
}

.dayCompletion[b-qfd1mj5bmc] {
    display: flex;
    flex-direction: column;
    padding: .25rem;
    border: 1px solid transparent;
    border-radius: .25rem;
    color: var(--clr-text-subtle);
    justify-content: center;
    align-items: center;
}
    .dayCompletion.today[b-qfd1mj5bmc] {
        border: 1px solid var(--clr-text-subtle);
        border-radius: .25rem;
        color: var(--clr-text-emphasis);
    }

.day[b-qfd1mj5bmc] {
    text-align: center;
    display: inline-block;
}
/* /Components/Users/InvitationsList.razor.rz.scp.css */
.invitations[b-9affcres5t] {
    margin: 0 0 .5rem;
}

    .invitations th[b-9affcres5t],
    .invitations td[b-9affcres5t] {
        vertical-align: middle;
        border-bottom: 1px solid var(--clr-border-default);
    }

.actions[b-9affcres5t] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* Keeps Keep in place when Cancel swaps to Confirm cancel */
.confirm-cancel[b-9affcres5t] {
    min-width: 10rem;
}

.muted[b-9affcres5t],
.expired[b-9affcres5t],
.status[b-9affcres5t] {
    color: var(--clr-text-muted);
}

.expired[b-9affcres5t] {
    font-weight: 600;
}

/* Persistent live region with reserved height, so the message doesn't shift the page */
.status[b-9affcres5t] {
    min-height: 1.5em;
    margin: .5rem 0 0;
}
/* /Components/Users/InviteForm.razor.rz.scp.css */
fieldset[b-g73abwq80z] {
    border: 0;
    margin: 0;
    padding: 0;
}

legend[b-g73abwq80z] {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: .5rem;
}

.fields[b-g73abwq80z] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .5rem 1rem;
}

    /* Lines the checkbox and button up with the inputs beneath their labels. The checkbox's margin is on its
       wrapper, not the label, so the tooltip around the label sits right above it. */
    .fields .btn[b-g73abwq80z],
    .fields .org-admin__wrapper[b-g73abwq80z] {
        margin-top: 1.5rem;
    }

.ctrl__wrapper[b-g73abwq80z] {
    flex: 0 0 auto;
    display: flex;
    gap: .25rem;
}

    .ctrl__wrapper.col[b-g73abwq80z] {
        flex-direction: column;
    }

.org-admin[b-g73abwq80z] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 44px;
}

/* Persistent live region with reserved height, so the message doesn't shift the page */
.status[b-g73abwq80z] {
    min-height: 1.5em;
    margin: .5rem 0 0;
    color: var(--clr-text-muted);
}
/* /Components/Users/Pages/EditUserPage.razor.rz.scp.css */
.actions__wrapper[b-httmqhu9fl] {
    display: flex;
    gap: .5rem;
    align-items: start;
}

.resending__wrapper[b-httmqhu9fl] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    align-items: center;
}

.resendConfState__wrapper[b-httmqhu9fl] {
    display: flex;
    gap: .5rem;
    align-items: center;
}

.resendConfResult[b-httmqhu9fl]{
    color: darkgreen;
}
/* /Components/Users/Pages/InvitationsPage.razor.rz.scp.css */
.contentArea[b-ded7hjhi07] {
    margin: 0 auto;
    max-width: min(100%, 1400px);
}

.form__section[b-ded7hjhi07] {
    margin: 1rem 0;
    padding: .5rem;
    border: 1px solid var(--clr-border-default);
    border-radius: .25rem;
}

h4[b-ded7hjhi07] {
    margin-top: 1.5rem;
}
/* /Components/Users/Pages/UsersPage.razor.rz.scp.css */
.contentArea[b-wreydwgjg5]{
    margin: 0 auto;
    max-width: min(100%, 1400px);
}
/* /Components/Users/UserSelect.razor.rz.scp.css */
.ctrl__wrapper[b-bf3f52eti3]{
    display: flex;
    gap:.25rem;
}
.ctrl__wrapper.col[b-bf3f52eti3] {
    flex-direction: column;
}
/* /Components/Users/UsersList.razor.rz.scp.css */
/* Centre each row's text on the org admin switch, which is taller than a line of text */
td[b-zqb39m76uk] {
    vertical-align: middle;
}
/* /Components/WorkProfiles/Pages/WorkProfilePage.razor.rz.scp.css */
.intro[b-e5eu3m3i8h] {
    max-width: 48rem;
    color: var(--clr-text-muted);
}
/* /Components/WorkProfiles/WorkProfileEditor.razor.rz.scp.css */
.editor[b-mn3ad95hrk] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 48rem;
}

.editor__group[b-mn3ad95hrk] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--clr-border-default);
    border-radius: .25rem;
    background: var(--clr-surface);

    legend {
        float: none;
        width: auto;
        padding-inline: .25rem;
        margin-bottom: 0;
        font-size: 1.1rem;
        color: var(--clr-text-emphasis);
    }
}

.editor__hint[b-mn3ad95hrk] {
    margin: 0;
    color: var(--clr-text-muted);
}

.editor__presets[b-mn3ad95hrk] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* Seven narrow columns on wide screens, wrapping to fewer on small ones */
.editor__days[b-mn3ad95hrk] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
    gap: 1rem;
}

.editor__day[b-mn3ad95hrk] {
    display: flex;
    flex-direction: column;
    gap: .25rem;

    label {
        color: var(--clr-text);
    }
}

.editor__from[b-mn3ad95hrk] {
    display: flex;
    flex-direction: column;
    gap: .25rem;

    label {
        color: var(--clr-text);
    }
}

.actions[b-mn3ad95hrk] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Fits the longer "Save work profile" label (17 characters) plus the icon, gap and padding, so the button keeps
   the same size when the label changes to "Saving...". ch units scale with the font. */
.save-button[b-mn3ad95hrk] {
    min-width: calc(17ch + 3rem);
}

.save-result[b-mn3ad95hrk] {
    color: var(--clr-text-muted);
}

.save-result--error[b-mn3ad95hrk] {
    color: var(--clr-danger);
}

/* Hold for 3s, then fade. visibility: hidden also removes the faded text from the accessibility tree. */
.save-result--fade[b-mn3ad95hrk] {
    animation: save-result-fade-out-b-mn3ad95hrk .5s ease-in 3s forwards;
}

@keyframes save-result-fade-out-b-mn3ad95hrk {
    to {
        opacity: 0;
        visibility: hidden;
    }
}

@media (prefers-reduced-motion: reduce) {
    .save-result--fade[b-mn3ad95hrk] {
        animation-duration: 1ms;
    }
}
/* /Components/WorkProfiles/WorkProfileSection.razor.rz.scp.css */
.work-profile[b-vv3vkupddl] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2rem;

    h4 {
        margin: 0;
    }
}

.work-profile__note[b-vv3vkupddl] {
    margin: 0;
    color: var(--clr-text-muted);
}
/* /Components/WorkProfiles/WorkProfileVersions.razor.rz.scp.css */
/* Scrolls sideways on narrow screens rather than squeezing the seven day columns */
.versions[b-wbddr22btb] {
    max-width: 48rem;
    overflow-x: auto;
}

caption[b-wbddr22btb] {
    caption-side: top;
    color: var(--clr-text-muted);
}

th[scope='row'][b-wbddr22btb] {
    font-weight: normal;
    white-space: nowrap;
}

td[b-wbddr22btb] {
    text-align: center;
}

.versions__current th[scope='row'][b-wbddr22btb] {
    font-weight: bold;
    color: var(--clr-text-emphasis);
}

.versions__status[b-wbddr22btb] {
    display: block;
    font-size: .875rem;
    color: var(--clr-text-muted);
}