:root {
    --bm-home-navy: #103d28;
    --bm-home-forest: #0e6224;
    --bm-home-mint: #eaf7ed;
    --bm-home-sun: #fff7e6;
    --bm-home-blue: #edf5fb;
}

body {
    background:
        radial-gradient(circle at 100% -10%, rgb(31 161 56 / 12%), transparent 27rem),
        linear-gradient(180deg, #f8fbf8 0, #fff 23rem);
}

.bm-card {
    box-shadow: 0 1px 2px rgb(20 67 34 / 5%), 0 10px 28px rgb(20 67 34 / 4%);
}

.bm-card:focus-within {
    border-color: color-mix(in srgb, var(--bm-green) 45%, white);
}

.bm-employee-welcome-replaced {
    display: none;
}

.bm-employee-welcome {
    position: relative;
    overflow: hidden;
    margin-bottom: 1.5rem;
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid rgb(22 112 48 / 26%);
    border-radius: 1rem;
    background:
        radial-gradient(circle at 88% 16%, rgb(255 255 255 / 22%) 0 5.5rem, transparent 5.6rem),
        linear-gradient(130deg, var(--bm-home-navy), var(--bm-home-forest));
    color: #fff;
    box-shadow: 0 16px 38px rgb(14 98 36 / 17%);
}

.bm-employee-welcome::after {
    position: absolute;
    top: -7rem;
    right: -5rem;
    width: 16rem;
    height: 16rem;
    border: 1px solid rgb(255 255 255 / 18%);
    border-radius: 999px;
    content: '';
}

.bm-employee-welcome__head,
.bm-home-metrics,
.bm-home-links {
    position: relative;
    z-index: 1;
}

.bm-employee-welcome__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.bm-employee-welcome .bm-kicker {
    margin: 0 0 .35rem;
    color: rgb(232 255 237 / 80%);
}

.bm-employee-welcome h1 {
    margin: 0;
    letter-spacing: -.04em;
    font-size: clamp(1.7rem, 3vw, 2.4rem);
    font-weight: 650;
    line-height: 1.05;
}

.bm-employee-welcome__date {
    margin: .45rem 0 0;
    color: rgb(255 255 255 / 76%);
    font-size: .92rem;
}

.bm-home-day-badge {
    max-width: 22rem;
    padding: .7rem .85rem;
    border: 1px solid rgb(255 255 255 / 22%);
    border-radius: .75rem;
    background: rgb(255 255 255 / 12%);
    backdrop-filter: blur(8px);
}

.bm-home-day-badge span,
.bm-home-day-badge small {
    display: block;
}

.bm-home-day-badge span {
    font-size: .86rem;
    font-weight: 700;
}

.bm-home-day-badge small {
    margin-top: .2rem;
    color: rgb(255 255 255 / 74%);
    font-size: .76rem;
    line-height: 1.35;
}

.bm-home-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    margin-top: 1.5rem;
}

.bm-home-metric {
    min-width: 0;
    padding: .9rem 1rem;
    border: 1px solid rgb(255 255 255 / 18%);
    border-radius: .75rem;
    background: rgb(255 255 255 / 10%);
}

.bm-home-metric__label,
.bm-home-metric__detail,
.bm-home-metric__value {
    margin: 0;
}

.bm-home-metric__label {
    color: rgb(255 255 255 / 70%);
    font-size: .76rem;
    font-weight: 650;
}

.bm-home-metric__value {
    margin-top: .35rem;
    overflow-wrap: anywhere;
    font-size: 1.05rem;
    font-weight: 720;
    letter-spacing: -.018em;
    line-height: 1.18;
}

.bm-home-metric__detail {
    margin-top: .32rem;
    color: rgb(255 255 255 / 70%);
    font-size: .72rem;
    line-height: 1.35;
}

.bm-home-links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    margin-top: .8rem;
}

.bm-home-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
    padding: .78rem .9rem;
    border: 1px solid rgb(255 255 255 / 18%);
    border-radius: .68rem;
    background: rgb(255 255 255 / 8%);
    color: #fff;
    text-decoration: none;
    transition: background-color .16s ease, transform .16s ease;
}

.bm-home-link:hover {
    background: rgb(255 255 255 / 17%);
    transform: translateY(-1px);
}

.bm-home-link__copy,
.bm-home-link__copy strong,
.bm-home-link__copy span {
    display: block;
}

.bm-home-link__copy strong { font-size: .84rem; }
.bm-home-link__copy span { margin-top: .17rem; color: rgb(255 255 255 / 68%); font-size: .7rem; line-height: 1.3; }
.bm-home-link__arrow { margin-left: .7rem; font-size: 1.15rem; }

.bm-home-requests {
    margin-top: 1.5rem;
    padding: 1.1rem 1.2rem;
}

.bm-home-requests__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
}

.bm-home-requests__header .bm-kicker { margin: 0 0 .2rem; }
.bm-home-inline-link { color: var(--bm-green-dark); font-size: .82rem; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.bm-home-request-list { margin-top: .8rem; border-top: 1px solid var(--bm-line); }

.bm-home-request {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 0;
    border-bottom: 1px solid var(--bm-line);
}

.bm-home-request strong,
.bm-home-request span { display: block; }
.bm-home-request strong { color: var(--bm-ink); font-size: .88rem; }
.bm-home-request span { margin-top: .16rem; color: var(--bm-muted); font-size: .78rem; }

.bm-home-withdraw {
    flex: 0 0 auto;
    min-height: 2rem;
    padding: .35rem .55rem;
    border: 1px solid #d89b91;
    border-radius: .45rem;
    background: #fff;
    color: #9a352b;
    cursor: pointer;
    font-size: .76rem;
    font-weight: 700;
}

.bm-home-withdraw:hover:not(:disabled) { background: #fff3f1; }
.bm-home-withdraw:disabled { cursor: wait; opacity: .64; }
.bm-home-empty { margin: .85rem 0 0; color: var(--bm-muted); font-size: .84rem; }

@media (max-width: 760px) {
    .bm-employee-welcome__head { display: block; }
    .bm-home-day-badge { margin-top: 1rem; max-width: none; }
    .bm-home-metrics,
    .bm-home-links { grid-template-columns: 1fr; }
    .bm-home-link { padding: .85rem .9rem; }
}

@media (prefers-reduced-motion: reduce) {
    .bm-home-link { transition: none; }
    .bm-home-link:hover { transform: none; }
}

/* Compact navigation: the expanded desktop menu overlays, rather than shifts, the plan. */
.workforce-app > [data-slot="sidebar-inset"] { min-width: 0; }
.bm-main-navigation [data-sidebar="sidebar"],
[data-sidebar="sidebar"][data-mobile="true"] { background: var(--sidebar); }
[data-sidebar="sidebar"] .bm-nav-header {
    min-height: 5.5rem;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: 1rem .75rem;
    border-bottom: 1px solid var(--bm-line);
    overflow: hidden;
}
.bm-nav-brand {
    display: flex;
    align-items: center;
    flex: 1;
    gap: .65rem;
    min-width: 0;
    min-height: 2.75rem;
    border-radius: .5rem;
}
.bm-nav-brand:focus-visible { outline: 2px solid var(--bm-green); outline-offset: 3px; }
.bm-nav-mark {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 2.75rem;
    border: 1px solid var(--bm-line);
    border-radius: .8rem;
    background: var(--bm-green-soft);
    color: var(--bm-green-dark);
    font-size: .9rem;
    font-weight: 700;
    letter-spacing: -.04em;
}
.bm-nav-wordmark { width: 10.5rem; height: auto; max-width: none; transition: opacity .18s ease; }
[data-sidebar="sidebar"] .bm-nav-content {
    padding: .75rem;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}
[data-sidebar="sidebar"] .bm-nav-list { gap: .3rem; }
[data-sidebar="sidebar"] .bm-nav-link {
    display: flex;
    align-items: center;
    width: 100% !important;
    height: 2.75rem !important;
    min-height: 2.75rem;
    gap: .75rem;
    padding: .7rem .75rem !important;
    border-radius: .65rem;
    color: var(--bm-ink);
    font-size: .875rem;
    white-space: nowrap;
    overflow: hidden;
}
[data-sidebar="sidebar"] .bm-nav-link > svg { width: 1.25rem; height: 1.25rem; flex: 0 0 1.25rem; }
[data-sidebar="sidebar"] .bm-nav-link:hover { background: var(--bm-green-soft); }
[data-sidebar="sidebar"] .bm-nav-link[data-active="true"] {
    background: var(--bm-green-soft);
    color: var(--bm-green-dark);
    font-weight: 650;
}
.bm-nav-label { opacity: 1; transition: opacity .18s ease; }
@media (min-width: 768px) {
    .workforce-app > [data-slot="sidebar"][data-variant="sidebar"] > div:first-child {
        width: var(--sidebar-width-icon) !important;
    }
    .workforce-app .bm-main-navigation {
        z-index: 40;
        overflow: hidden;
        transition: width .2s ease, box-shadow .2s ease;
    }
    .workforce-app [data-state="expanded"] > .bm-main-navigation {
        box-shadow: 10px 0 28px rgb(20 67 34 / 12%);
    }
    .workforce-app [data-state="collapsed"] .bm-nav-wordmark,
    .workforce-app [data-state="collapsed"] .bm-nav-label { opacity: 0; }
}
[data-sidebar="sidebar"][data-mobile="true"] {
    width: min(20rem, calc(100vw - 2.75rem));
    max-width: 100vw;
    height: 100dvh;
    padding-bottom: env(safe-area-inset-bottom);
    animation-duration: .22s;
}
[data-sidebar="sidebar"][data-mobile="true"] .bm-nav-mark { display: none; }
[data-sidebar="sidebar"][data-mobile="true"] .bm-nav-wordmark { max-width: 100%; }
[data-sidebar="sidebar"][data-mobile="true"] .bm-nav-header > button { flex-shrink: 0; }
.bm-plan-overview-toolbar {
    display: flex;
    justify-content: flex-end;
    padding: .75rem 2.5rem 0;
    margin-bottom: -.75rem;
}
@media (max-width: 767px) {
    .bm-plan-overview-toolbar { padding-right: 1rem; padding-left: 1rem; }
}
[data-slot="sheet-content"].bm-plan-overview-sheet {
    width: min(25rem, 100vw);
    max-width: 100vw;
    height: 100dvh;
    gap: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: env(safe-area-inset-bottom);
    background: var(--bm-surface, #fff);
    animation-duration: .22s;
}
.bm-plan-overview-sheet > [data-slot="sheet-header"] {
    padding: 1.5rem 3rem 1rem 1.25rem;
    border-bottom: 1px solid var(--bm-line);
}
.bm-plan-overview-sheet > aside { padding: 1.25rem; border: 0; }
@media (prefers-reduced-motion: reduce) {
    .workforce-app .bm-main-navigation,
    .bm-nav-label,
    .bm-nav-wordmark { transition: none; }
    [data-sidebar="sidebar"][data-mobile="true"],
    [data-slot="sheet-content"].bm-plan-overview-sheet,
    body:has(.bm-nav-content, .bm-plan-overview-sheet) [data-slot="sheet-overlay"] {
        animation: none !important;
        transition: none !important;
    }
}
