/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.auth-page[b-0b4evgt6ut] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    /* The sidebar's gradient (MainLayout.razor.css), so the front door
       reads as the same application as the pages behind it. */
    background-image: linear-gradient(180deg, #16233c 0%, #0e1524 100%);
}

.auth-main[b-0b4evgt6ut] {
    width: 100%;
    max-width: 26rem;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-g05z3txciz] {
    position: relative;
    display: flex;
    flex-direction: column;

    /* Matches the foot of the sidebar gradient. The sidebar is sticky at
       100vh so the nav stays put while the page scrolls, which leaves the
       column below it empty on a long page; painting the row behind it
       keeps the dark column continuous instead of stopping mid-page. */
    background-color: #0e1524;
}

main[b-g05z3txciz] {
    flex: 1;
    /* Opaque so the row background above only shows in the sidebar column. */
    background-color: #fff;

    /* A flex item defaults to min-width:auto, meaning it will not shrink
       below its content's min-content width. With a wide table inside, that
       makes the whole page scroll sideways instead of letting
       .table-responsive scroll on its own -- Toll Activity pushed the
       document ~200px past the viewport at 768px wide. Allowing main to
       shrink puts the overflow back where it belongs. */
    min-width: 0;
}

/* Deep navy with a slight vertical fade. Replaces the Blazor template's
   blue-to-purple gradient, which reads as scaffolding and fights the blue
   accent used for links, primary buttons, and the active nav marker. */
.sidebar[b-g05z3txciz] {
    background-image: linear-gradient(180deg, #16233c 0%, #0e1524 100%);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.top-row[b-g05z3txciz] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-g05z3txciz]  a, .top-row[b-g05z3txciz]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-g05z3txciz]  a:hover, .top-row[b-g05z3txciz]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-g05z3txciz]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-g05z3txciz] {
        justify-content: space-between;
    }

    .top-row[b-g05z3txciz]  a, .top-row[b-g05z3txciz]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-g05z3txciz] {
        flex-direction: row;
    }

    .sidebar[b-g05z3txciz] {
        /* flex: none so the column holds its width. As a plain flex item it
           shrinks when the row is tight, which squeezed the nav to ~150px on
           a portrait tablet and wrapped labels like "Customer Balances" onto
           two lines. */
        flex: 0 0 250px;
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-g05z3txciz] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-g05z3txciz]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-g05z3txciz], article[b-g05z3txciz] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-g05z3txciz] {
    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-g05z3txciz] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* ── Brand ─────────────────────────────────────────────────────────── */

.nav-brand[b-rk9ekzp535] {
    height: 3.5rem;
    display: flex;
    align-items: center;
    padding: 0 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.nav-brand-link[b-rk9ekzp535] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    text-decoration: none;
    color: #fff;
}

/* Small accent mark left of the wordmark -- gives the header something to
   anchor on without needing a logo asset. */
.nav-brand-mark[b-rk9ekzp535] {
    width: 0.5rem;
    height: 1.4rem;
    border-radius: 2px;
    background: linear-gradient(180deg, #5aa9ff 0%, #2f7de0 100%);
    flex: none;
}

.nav-brand-text[b-rk9ekzp535] {
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

/* ── Section labels ────────────────────────────────────────────────── */

/* Plain (non-clickable) module label. Height is set rather than left to the
   text so it keeps the same vertical rhythm as the clickable variant below —
   the two sit in the same column and must not stagger against each other. */
.nav-section[b-rk9ekzp535] {
    display: flex;
    align-items: center;
    height: 1.85rem;
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: rgba(255, 255, 255, 0.38);
    padding: 0 0.75rem;
    margin-bottom: 0.35rem;
}

/* A module label that is ALSO the link to that module's hub.
   ::deep is required, not stylistic: NavLink is a child component, so its
   <a> never receives this stylesheet's scope attribute and an unprefixed
   rule silently does nothing (which is how this shipped as blue underlined
   body text). Every .nav-link rule below has the same shape for the same
   reason.
   It borrows the nav item's own interaction vocabulary — the pill hover, the
   accent bar, the tinted current state — so it reads as part of the same
   system, while staying smaller and dimmer than its children so the
   hierarchy still reads as "header above list". */
.nav-item[b-rk9ekzp535]  .nav-section-link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    height: 1.85rem;
    padding: 0 0.75rem;
    margin-bottom: 0.35rem;
    border-radius: 6px;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
    transition: background-color 120ms ease, color 120ms ease;
}

/* Chevron marking "this label goes somewhere". Hidden at rest so the nav
   stays quiet, and it slides as it fades rather than just appearing. */
.nav-item[b-rk9ekzp535]  .nav-section-link::after {
    content: "";
    width: 0.7rem;
    height: 0.7rem;
    flex: none;
    background-color: currentColor;
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M4.646%201.646a.5.5%200%200%201%20.708%200l6%206a.5.5%200%200%201%200%20.708l-6%206a.5.5%200%200%201-.708-.708L10.293%208%204.646%202.354a.5.5%200%200%201%200-.708%22%2F%3E%3C%2Fsvg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M4.646%201.646a.5.5%200%200%201%20.708%200l6%206a.5.5%200%200%201%200%20.708l-6%206a.5.5%200%200%201-.708-.708L10.293%208%204.646%202.354a.5.5%200%200%201%200-.708%22%2F%3E%3C%2Fsvg%3E");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    opacity: 0;
    transform: translateX(-2px);
    transition: opacity 120ms ease, transform 120ms ease;
}

.nav-item[b-rk9ekzp535]  .nav-section-link:hover {
    background-color: rgba(255, 255, 255, 0.07);
    color: #fff;
}

.nav-item[b-rk9ekzp535]  .nav-section-link.active {
    background-color: rgba(90, 169, 255, 0.15);
    color: #fff;
}

.nav-item[b-rk9ekzp535]  .nav-section-link:hover::after,
.nav-item[b-rk9ekzp535]  .nav-section-link.active::after {
    opacity: 0.75;
    transform: translateX(0);
}

/* Same inset accent bar the current nav item gets, so "you are on the module
   home" is marked the same way as "you are on a page". */
.nav-item[b-rk9ekzp535]  .nav-section-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.35rem;
    bottom: 0.35rem;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: #5aa9ff;
}

.nav-item[b-rk9ekzp535]  .nav-section-link:focus-visible {
    outline: 2px solid #5aa9ff;
    outline-offset: -2px;
}

@media (prefers-reduced-motion: reduce) {
    .nav-item[b-rk9ekzp535]  .nav-section-link,
    .nav-item[b-rk9ekzp535]  .nav-section-link::after {
        transition: none;
    }
}

/* ── Items ─────────────────────────────────────────────────────────── */

.nav-item[b-rk9ekzp535] {
    padding: 0 0.75rem;
    margin-bottom: 1.1rem;
}

.nav-item:first-of-type[b-rk9ekzp535] {
    padding-top: 1rem;
}

.nav-item:last-of-type[b-rk9ekzp535] {
    margin-bottom: 1rem;
}

/* Pinned to the bottom of the sidebar rather than trailing the last section,
   so it stays put no matter how many nav sections are above it. Needs the
   nav itself to be a full-height flex column for the auto margin to push
   against -- .flex-column only sets the direction. */
.nav-scrollable > nav[b-rk9ekzp535] {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.nav-footer[b-rk9ekzp535] {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.nav-item[b-rk9ekzp535]  .nav-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    height: 2.5rem;
    padding: 0 0.75rem;
    margin-bottom: 1px;
    border: none;
    border-radius: 6px;
    font-size: 0.875rem;
    line-height: 1;
    color: rgba(255, 255, 255, 0.72);
    background: none;
    text-decoration: none;
    transition: background-color 120ms ease, color 120ms ease;
}

.nav-item[b-rk9ekzp535]  .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.07);
    color: #fff;
}

.nav-item[b-rk9ekzp535]  .nav-link.active {
    background-color: rgba(90, 169, 255, 0.15);
    color: #fff;
    font-weight: 600;
}

/* Accent bar on the active item. Inset rather than full-height so it reads
   as a marker rather than a border. */
.nav-item[b-rk9ekzp535]  .nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.45rem;
    bottom: 0.45rem;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: #5aa9ff;
}

.nav-item[b-rk9ekzp535]  .nav-link:focus-visible {
    outline: 2px solid #5aa9ff;
    outline-offset: -2px;
}

/* ── Unresolved-tolls count badge ──────────────────────────────────── */

/* The notification that an unattended run brought new work (AUTO-1 /
   LE-11): amber so it reads as "waiting", right-aligned so the link text
   stays scannable. */
.nav-item[b-rk9ekzp535]  .nav-count-badge {
    margin-left: auto;
    min-width: 1.35rem;
    padding: 0.14rem 0.4rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    color: #1a1d21;
    background-color: #ffc766;
}

/* ── Icons ─────────────────────────────────────────────────────────── */

/* Masked rather than a background-image with a baked-in fill, so each icon
   takes the link's own colour and brightens with the text on hover and
   active instead of staying flat white. */
.nav-ico[b-rk9ekzp535] {
    width: 1.05rem;
    height: 1.05rem;
    flex: none;
    background-color: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    opacity: 0.85;
    transition: opacity 120ms ease;
}

.nav-item[b-rk9ekzp535]  .nav-link:hover .nav-ico,
.nav-item[b-rk9ekzp535]  .nav-link.active .nav-ico {
    opacity: 1;
}

/* ── Toggler (narrow screens) ──────────────────────────────────────── */

.navbar-toggler[b-rk9ekzp535] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-rk9ekzp535] {
    background-color: rgba(255, 255, 255, 0.5);
}

/* ── Scroll area ───────────────────────────────────────────────────── */

.nav-scrollable[b-rk9ekzp535] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-rk9ekzp535] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-rk9ekzp535] {
        display: none;
    }

    .nav-scrollable[b-rk9ekzp535] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;

        scrollbar-width: thin;
        scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
    }

    .nav-scrollable[b-rk9ekzp535]::-webkit-scrollbar {
        width: 6px;
    }

    .nav-scrollable[b-rk9ekzp535]::-webkit-scrollbar-thumb {
        background-color: rgba(255, 255, 255, 0.18);
        border-radius: 3px;
    }

    .nav-scrollable[b-rk9ekzp535]::-webkit-scrollbar-track {
        background: transparent;
    }
}

/* Icon masks, generated from bootstrap-icons 1.11.3. One rule per nav
   item; the shared sizing and colouring lives on .nav-ico above. */
.nav-ico-home[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M6.5%2014.5v-3.505c0-.245.25-.495.5-.495h2c.25%200%20.5.25.5.5v3.5a.5.5%200%200%200%20.5.5h4a.5.5%200%200%200%20.5-.5v-7a.5.5%200%200%200-.146-.354L13%205.793V2.5a.5.5%200%200%200-.5-.5h-1a.5.5%200%200%200-.5.5v1.293L8.354%201.146a.5.5%200%200%200-.708%200l-6%206A.5.5%200%200%200%201.5%207.5v7a.5.5%200%200%200%20.5.5h4a.5.5%200%200%200%20.5-.5%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-customer-balances[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M12.136.326A1.5%201.5%200%200%201%2014%201.78V3h.5A1.5%201.5%200%200%201%2016%204.5v9a1.5%201.5%200%200%201-1.5%201.5h-13A1.5%201.5%200%200%201%200%2013.5v-9a1.5%201.5%200%200%201%201.432-1.499zM5.562%203H13V1.78a.5.5%200%200%200-.621-.484zM1.5%204a.5.5%200%200%200-.5.5v9a.5.5%200%200%200%20.5.5h13a.5.5%200%200%200%20.5-.5v-9a.5.5%200%200%200-.5-.5z%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-unresolved-tolls[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M9.05.435c-.58-.58-1.52-.58-2.1%200L.436%206.95c-.58.58-.58%201.519%200%202.098l6.516%206.516c.58.58%201.519.58%202.098%200l6.516-6.516c.58-.58.58-1.519%200-2.098zM8%204c.535%200%20.954.462.9.995l-.35%203.507a.552.552%200%200%201-1.1%200L7.1%204.995A.905.905%200%200%201%208%204m.002%206a1%201%200%201%201%200%202%201%201%200%200%201%200-2%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-toll-activity[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M5%2011.5a.5.5%200%200%201%20.5-.5h9a.5.5%200%200%201%200%201h-9a.5.5%200%200%201-.5-.5m0-4a.5.5%200%200%201%20.5-.5h9a.5.5%200%200%201%200%201h-9a.5.5%200%200%201-.5-.5m0-4a.5.5%200%200%201%20.5-.5h9a.5.5%200%200%201%200%201h-9a.5.5%200%200%201-.5-.5m-3%201a1%201%200%201%200%200-2%201%201%200%200%200%200%202m0%204a1%201%200%201%200%200-2%201%201%200%200%200%200%202m0%204a1%201%200%201%200%200-2%201%201%200%200%200%200%202%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-citation-log[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M9.293%200H4a2%202%200%200%200-2%202v12a2%202%200%200%200%202%202h8a2%202%200%200%200%202-2V4.707A1%201%200%200%200%2013.707%204L10%20.293A1%201%200%200%200%209.293%200M9.5%203.5v-2l3%203h-2a1%201%200%200%201-1-1M4.5%209a.5.5%200%200%201%200-1h7a.5.5%200%200%201%200%201zM4%2010.5a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5m.5%202.5a.5.5%200%200%201%200-1h4a.5.5%200%200%201%200%201z%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-new-citation[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M2%200a2%202%200%200%200-2%202v12a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V2a2%202%200%200%200-2-2zm6.5%204.5v3h3a.5.5%200%200%201%200%201h-3v3a.5.5%200%200%201-1%200v-3h-3a.5.5%200%200%201%200-1h3v-3a.5.5%200%200%201%201%200%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-income-reservation[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M1.92.506a.5.5%200%200%201%20.434.14L3%201.293l.646-.647a.5.5%200%200%201%20.708%200L5%201.293l.646-.647a.5.5%200%200%201%20.708%200L7%201.293l.646-.647a.5.5%200%200%201%20.708%200L9%201.293l.646-.647a.5.5%200%200%201%20.708%200l.646.647.646-.647a.5.5%200%200%201%20.708%200l.646.647.646-.647a.5.5%200%200%201%20.801.13l.5%201A.5.5%200%200%201%2015%202v12a.5.5%200%200%201-.053.224l-.5%201a.5.5%200%200%201-.8.13L13%2014.707l-.646.647a.5.5%200%200%201-.708%200L11%2014.707l-.646.647a.5.5%200%200%201-.708%200L9%2014.707l-.646.647a.5.5%200%200%201-.708%200L7%2014.707l-.646.647a.5.5%200%200%201-.708%200L5%2014.707l-.646.647a.5.5%200%200%201-.708%200L3%2014.707l-.646.647a.5.5%200%200%201-.801-.13l-.5-1A.5.5%200%200%201%201%2014V2a.5.5%200%200%201%20.053-.224l.5-1a.5.5%200%200%201%20.367-.27m.217%201.338L2%202.118v11.764l.137.274.51-.51a.5.5%200%200%201%20.707%200l.646.647.646-.646a.5.5%200%200%201%20.708%200l.646.646.646-.646a.5.5%200%200%201%20.708%200l.646.646.646-.646a.5.5%200%200%201%20.708%200l.646.646.646-.646a.5.5%200%200%201%20.708%200l.646.646.646-.646a.5.5%200%200%201%20.708%200l.509.509.137-.274V2.118l-.137-.274-.51.51a.5.5%200%200%201-.707%200L12%201.707l-.646.647a.5.5%200%200%201-.708%200L10%201.707l-.646.647a.5.5%200%200%201-.708%200L8%201.707l-.646.647a.5.5%200%200%201-.708%200L6%201.707l-.646.647a.5.5%200%200%201-.708%200L4%201.707l-.646.647a.5.5%200%200%201-.708%200z%22%2F%3E%3Cpath%20d%3D%22M3%204.5a.5.5%200%200%201%20.5-.5h6a.5.5%200%201%201%200%201h-6a.5.5%200%200%201-.5-.5m0%202a.5.5%200%200%201%20.5-.5h6a.5.5%200%201%201%200%201h-6a.5.5%200%200%201-.5-.5m0%202a.5.5%200%200%201%20.5-.5h6a.5.5%200%201%201%200%201h-6a.5.5%200%200%201-.5-.5m0%202a.5.5%200%200%201%20.5-.5h6a.5.5%200%200%201%200%201h-6a.5.5%200%200%201-.5-.5m8-6a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%200%201h-1a.5.5%200%200%201-.5-.5m0%202a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%200%201h-1a.5.5%200%200%201-.5-.5m0%202a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%200%201h-1a.5.5%200%200%201-.5-.5m0%202a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%200%201h-1a.5.5%200%200%201-.5-.5%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-income-vehicle[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M2.52%203.515A2.5%202.5%200%200%201%204.82%202h6.362c1%200%201.904.596%202.298%201.515l.792%201.848c.075.175.21.319.38.404.5.25.855.715.965%201.262l.335%201.679q.05.242.049.49v.413c0%20.814-.39%201.543-1%201.997V13.5a.5.5%200%200%201-.5.5h-2a.5.5%200%200%201-.5-.5v-1.338c-1.292.048-2.745.088-4%20.088s-2.708-.04-4-.088V13.5a.5.5%200%200%201-.5.5h-2a.5.5%200%200%201-.5-.5v-1.892c-.61-.454-1-1.183-1-1.997v-.413a2.5%202.5%200%200%201%20.049-.49l.335-1.68c.11-.546.465-1.012.964-1.261a.8.8%200%200%200%20.381-.404l.792-1.848ZM3%2010a1%201%200%201%200%200-2%201%201%200%200%200%200%202m10%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202M6%208a1%201%200%200%200%200%202h4a1%201%200%201%200%200-2zM2.906%205.189a.51.51%200%200%200%20.497.731c.91-.073%203.35-.17%204.597-.17s3.688.097%204.597.17a.51.51%200%200%200%20.497-.731l-.956-1.913A.5.5%200%200%200%2011.691%203H4.309a.5.5%200%200%200-.447.276L2.906%205.19Z%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-payment-totals[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M1%203a1%201%200%200%201%201-1h12a1%201%200%200%201%201%201zm7%208a2%202%200%201%200%200-4%202%202%200%200%200%200%204%22%2F%3E%3Cpath%20d%3D%22M0%205a1%201%200%200%201%201-1h14a1%201%200%200%201%201%201v8a1%201%200%200%201-1%201H1a1%201%200%200%201-1-1zm3%200a2%202%200%200%201-2%202v4a2%202%200%200%201%202%202h10a2%202%200%200%201%202-2V7a2%202%200%200%201-2-2z%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-toll-balances[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M5.5%209.511c.076.954.83%201.697%202.182%201.785V12h.6v-.709c1.4-.098%202.218-.846%202.218-1.932%200-.987-.626-1.496-1.745-1.76l-.473-.112V5.57c.6.068.982.396%201.074.85h1.052c-.076-.919-.864-1.638-2.126-1.716V4h-.6v.719c-1.195.117-2.01.836-2.01%201.853%200%20.9.606%201.472%201.613%201.707l.397.098v2.034c-.615-.093-1.022-.43-1.114-.9zm2.177-2.166c-.59-.137-.91-.416-.91-.836%200-.47.345-.822.915-.925v1.76h-.005zm.692%201.193c.717.166%201.048.435%201.048.91%200%20.542-.412.914-1.135.982V8.518z%22%2F%3E%3Cpath%20d%3D%22M8%2015A7%207%200%201%201%208%201a7%207%200%200%201%200%2014m0%201A8%208%200%201%200%208%200a8%208%200%200%200%200%2016%22%2F%3E%3Cpath%20d%3D%22M8%2013.5a5.5%205.5%200%201%201%200-11%205.5%205.5%200%200%201%200%2011m0%20.5A6%206%200%201%200%208%202a6%206%200%200%200%200%2012%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-vehicle-profiles[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M14.5%203a.5.5%200%200%201%20.5.5v9a.5.5%200%200%201-.5.5h-13a.5.5%200%200%201-.5-.5v-9a.5.5%200%200%201%20.5-.5zm-13-1A1.5%201.5%200%200%200%200%203.5v9A1.5%201.5%200%200%200%201.5%2014h13a1.5%201.5%200%200%200%201.5-1.5v-9A1.5%201.5%200%200%200%2014.5%202z%22%2F%3E%3Cpath%20d%3D%22M5%208a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7A.5.5%200%200%201%205%208m0-2.5a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5m0%205a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5m-1-5a.5.5%200%201%201-1%200%20.5.5%200%200%201%201%200M4%208a.5.5%200%201%201-1%200%20.5.5%200%200%201%201%200m0%202.5a.5.5%200%201%201-1%200%20.5.5%200%200%201%201%200%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-citation-forms[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M9.828%203h3.982a2%202%200%200%201%201.992%202.181l-.637%207A2%202%200%200%201%2013.174%2014H2.825a2%202%200%200%201-1.991-1.819l-.637-7a2%202%200%200%201%20.342-1.31L.5%203a2%202%200%200%201%202-2h3.672a2%202%200%200%201%201.414.586l.828.828A2%202%200%200%200%209.828%203m-8.322.12q.322-.119.684-.12h5.396l-.707-.707A1%201%200%200%200%206.172%202H2.5a1%201%200%200%200-1%20.981z%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-owners[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M7%2014s-1%200-1-1%201-4%205-4%205%203%205%204-1%201-1%201zm4-6a3%203%200%201%200%200-6%203%203%200%200%200%200%206m-5.784%206A2.24%202.24%200%200%201%205%2013c0-1.355.68-2.75%201.936-3.72A6.3%206.3%200%200%200%205%209c-4%200-5%203-5%204s1%201%201%201zM4.5%208a2.5%202.5%200%201%200%200-5%202.5%202.5%200%200%200%200%205%22%2F%3E%3C%2Fsvg%3E"); }
.nav-ico-request[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22%23000%22%20viewBox=%220%200%2016%2016%22%3E%3Cpath%20d=%22M15.502%201.94a.5.5%200%200%201%200%20.706L14.459%203.69l-2-2L13.502.646a.5.5%200%200%201%20.707%200l1.293%201.293zm-1.75%202.456-2-2L4.939%209.21a1%201%200%200%200-.121.15l-1.328%202.34a.125.125%200%200%200%20.12.19l2.34-1.329a1%201%200%200%200%20.15-.12z%22/%3E%3Cpath%20fill-rule=%22evenodd%22%20d=%22M1%2013.5A1.5%201.5%200%200%200%202.5%2015h11a1.5%201.5%200%200%200%201.5-1.5v-6a.5.5%200%200%200-1%200v6a.5.5%200%200%201-.5.5h-11a.5.5%200%200%201-.5-.5v-11a.5.5%200%200%201%20.5-.5H9a.5.5%200%200%200%200-1H2.5A1.5%201.5%200%200%200%201%202.5z%22/%3E%3C/svg%3E"); }
.nav-ico-data-refresh[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M8%203a5%205%200%201%200%204.546%202.914.5.5%200%200%201%20.908-.417A6%206%200%201%201%208%202z%22%2F%3E%3Cpath%20d%3D%22M8%204.466V.534a.25.25%200%200%201%20.41-.192l2.36%201.966c.12.1.12.284%200%20.384L8.41%204.658A.25.25%200%200%201%208%204.466%22%2F%3E%3C%2Fsvg%3E"); }

.nav-version[b-rk9ekzp535] {
    font-size: 0.68rem;
    color: rgba(255, 255, 255, 0.28);
    padding: 0.35rem 0.75rem 0.75rem;
}

/* Users (admin, super-admin only) — bootstrap-icons "people". */
.nav-ico-users[b-rk9ekzp535] { mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22%23000%22%20viewBox=%220%200%2016%2016%22%3E%3Cpath%20d=%22M15%2014s1%200%201-1-1-4-5-4-5%203-5%204%201%201%201%201zm-7.978-1L7%2012.996c.001-.264.167-1.03.76-1.72C8.312%2010.629%209.282%2010%2011%2010c1.717%200%202.687.63%203.24%201.276.593.69.758%201.457.76%201.72l-.008.002-.014.002zM11%207a2%202%200%201%200%200-4%202%202%200%200%200%200%204m3-2a3%203%200%201%201-6%200%203%203%200%200%201%206%200M6.936%209.28a6%206%200%200%200-1.23-.247A7%207%200%200%200%205%209c-4%200-5%203-5%204q0%201%201%201h4.216A2.24%202.24%200%200%201%205%2013c0-1.01.377-2.042%201.09-2.904.243-.294.526-.569.846-.816M4.92%2010A5.5%205.5%200%200%200%204%2013H1c0-.26.164-1.03.76-1.724.545-.636%201.492-1.256%203.16-1.275M1.5%205.5a3%203%200%201%201%206%200%203%203%200%200%201-6%200m3-2a2%202%200%201%200%200%204%202%202%200%200%200%200-4%22/%3E%3C/svg%3E"); }

/* ── Signed-in user (footer) ───────────────────────────────────────── */

/* Slice AUTH-1. Sits above "Request a Change" in the footer: who is
   signed in, the account page, and sign-out. Quiet by design — it is a
   fact about the session, not a destination. */
.nav-user[b-rk9ekzp535] {
    padding: 0 0.75rem 0.75rem;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.nav-user-name[b-rk9ekzp535] {
    font-size: 0.875rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-user-id[b-rk9ekzp535] {
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.45);
    margin-top: 0.1rem;
    white-space: nowrap;
}

.nav-user-id[b-rk9ekzp535]  .identifier,
.nav-user-id .identifier[b-rk9ekzp535] {
    color: rgba(255, 255, 255, 0.7);
}

/* Baseline, not centre: the link is an inline <a> and the sign-out control
   is a <button> inside a <form>, and a button's box is taller than a link's
   text. Centring the boxes put the two words on different lines; aligning
   their baselines puts them on the same one. */
.nav-user-actions[b-rk9ekzp535] {
    display: flex;
    align-items: baseline;
    gap: 0.9rem;
    margin-top: 0.25rem;
}

.nav-signout[b-rk9ekzp535] {
    display: inline-flex;
    align-items: baseline;
    margin: 0;
}

/* The sign-out control is a <button> inside a POST form; styled to sit
   beside the Account link as its twin. font: inherit strips the user-agent
   button font so the two render at the same size and metrics. */
.nav-user-link[b-rk9ekzp535],
.nav-user-button[b-rk9ekzp535] {
    font: inherit;
    font-size: 0.78rem;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.55);
    text-decoration: none;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    vertical-align: baseline;
}

.nav-user-link:hover[b-rk9ekzp535],
.nav-user-button:hover[b-rk9ekzp535] {
    color: #fff;
    text-decoration: underline;
}

.nav-user-link:focus-visible[b-rk9ekzp535],
.nav-user-button:focus-visible[b-rk9ekzp535] {
    outline: 2px solid #5aa9ff;
    outline-offset: 2px;
}
/* /Components/Pages/Admin/Users.razor.rz.scp.css */
/* The one-time temporary password: large enough to read across a desk,
   monospace so 0/O and 1/l would be distinguishable if the alphabet had
   not already removed them. */
.reveal-password[b-e45tc1p96k] {
    font-size: 1.15rem;
    letter-spacing: 0.06em;
    padding: 0.2rem 0.5rem;
    background: rgba(0, 0, 0, 0.06);
    border-radius: 0.25rem;
    user-select: all;
}
/* /Components/Pages/Auth/Login.razor.rz.scp.css */
.auth-card[b-rum9r71qw1] {
    border: 0;
    border-radius: 0.75rem;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.35);
}

.auth-card > .card-body[b-rum9r71qw1] {
    padding: 2rem;
}

.auth-brand[b-rum9r71qw1] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1.5rem;
}

/* Same mark as the nav brand (NavMenu.razor.css), at card scale. */
.auth-brand-mark[b-rum9r71qw1] {
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
    background: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);
    flex: 0 0 auto;
}

.auth-brand-text[b-rum9r71qw1] {
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: #16233c;
}

.auth-title[b-rum9r71qw1] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1.25rem;
}

.auth-form .form-label[b-rum9r71qw1] {
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}
/* /Components/Shared/PageHeader.razor.rz.scp.css */
/* C6 · Page header. Title and description on the left, actions on the
   right, wrapping to two rows on a narrow screen rather than crushing the
   title. */

.page-header[b-3lrlf8itr0] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem 1.5rem;
    margin-bottom: 0.75rem;
}

.page-header-text[b-3lrlf8itr0] {
    /* min-width:0 so a long title wraps inside the flex item instead of
       pushing the actions off the row. */
    min-width: 0;
    flex: 1 1 24rem;
}

.page-header h1[b-3lrlf8itr0] {
    font-size: 1.6rem;
    font-weight: 600;
    margin: 0 0 0.2rem;
}

/* The description is the page's own sentence about itself. Capped at a
   readable measure — a full-width line of 9pt grey across a 1400px page
   is a line nobody finishes. */
.page-description[b-3lrlf8itr0] {
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
    max-width: 68ch;
    margin: 0;
}

.page-header-actions[b-3lrlf8itr0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

/* Sits under the header: freshness line, period badges. Quiet, and
   separated from the first content section by the same gap the header
   itself uses. */
.page-meta[b-3lrlf8itr0] {
    margin-bottom: 1rem;
}
/* /Components/Shared/SectionCard.razor.rz.scp.css */
/* The whole card is the link, so it needs the affordance a bare <a> would
   have had: something visible on hover, and a focus ring for keyboard use
   (Bootstrap gives .card neither, because a card is not normally clickable). */

.section-card[b-xt216pu0jm] {
    display: block;
    transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.section-card:hover[b-xt216pu0jm] {
    border-color: var(--bs-primary-border-subtle, #9ec5fe);
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .06);
}

.section-card:focus-visible[b-xt216pu0jm] {
    outline: 2px solid var(--bs-primary, #0d6efd);
    outline-offset: 2px;
}

.section-card .title[b-xt216pu0jm] {
    font-weight: 600;
    line-height: 1.3;
}

.section-card .blurb[b-xt216pu0jm] {
    font-size: 0.8125rem;
    line-height: 1.45;
    color: var(--bs-secondary-color);
    margin: 0.3rem 0 0;
}

/* Chevron marking the card as a destination. Present but faint at rest so a
   grid of these stays calm, then it firms up and steps right on hover. */
.section-card .go[b-xt216pu0jm] {
    width: 0.75rem;
    height: 0.75rem;
    flex: none;
    margin-top: 0.2rem;
    background-color: currentColor;
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M4.646%201.646a.5.5%200%200%201%20.708%200l6%206a.5.5%200%200%201%200%20.708l-6%206a.5.5%200%200%201-.708-.708L10.293%208%204.646%202.354a.5.5%200%200%201%200-.708%22%2F%3E%3C%2Fsvg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23000%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M4.646%201.646a.5.5%200%200%201%20.708%200l6%206a.5.5%200%200%201%200%20.708l-6%206a.5.5%200%200%201-.708-.708L10.293%208%204.646%202.354a.5.5%200%200%201%200-.708%22%2F%3E%3C%2Fsvg%3E");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    opacity: 0.25;
    transition: opacity 120ms ease, transform 120ms ease;
}

.section-card:hover .go[b-xt216pu0jm],
.section-card:focus-visible .go[b-xt216pu0jm] {
    opacity: 0.7;
    transform: translateX(2px);
}

@media (prefers-reduced-motion: reduce) {
    .section-card[b-xt216pu0jm],
    .section-card .go[b-xt216pu0jm] {
        transition: none;
    }
}
/* /Components/Tolls/TollAccountWidget.razor.rz.scp.css */
/* One toll agency's account card. All rules are scoped to this component;
   nothing here leaks to the other cards on the hub page.

   The card is wide and flat by design: it is a low-volume readout that sits
   above the working-page tiles, and it must not push them below the fold. A
   second agency stacks beneath this one as another card of the same width,
   which is why nothing here assumes a fixed height or an equal-height row.

   The card is its own layout container, so the body's column count keys off
   how wide the CARD is rather than how wide the window is. That keeps the
   component honest wherever the hub decides to place it — today two of the
   hub's three tile columns, tomorrow something else — without this file
   needing to know the page's grid or the sidebar's width. */
.toll-account[b-mrfgqixnud] {
    container-type: inline-size;
}

/* Small accent mark left of the agency name — the same device the sidebar
   uses for the wordmark, so a provider heading is recognisable as a heading
   without needing a logo asset per agency. */
.provider-mark[b-mrfgqixnud] {
    width: 0.3rem;
    height: 1rem;
    border-radius: 2px;
    background: linear-gradient(180deg, #5aa9ff 0%, #2f7de0 100%);
    flex: none;
}

.account-ref[b-mrfgqixnud] {
    font-size: 0.8rem;
    letter-spacing: 0.02em;
    flex: none;
}

/* Label/value rows in two columns. A definition list rather than a table:
   these are pairs, not a grid, and the values right-align against their
   column's edge so each column scans as a column.

   Every row is the same size and the same weight, balance included. The
   provider's colour on a negative figure is the only differentiation the
   card is allowed to make, and it comes from the figure alone. */
.detail-list[b-mrfgqixnud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 2.5rem;
    font-size: 0.875rem;
}

/* One column when the CARD is narrow — not when the viewport is.
   <para>
   The distinction is the whole rule. The app's sidebar takes ~245px and the
   card no longer spans the content column, so viewport width says almost
   nothing about how much room these rows actually have: at a 790px viewport
   the card measures 469px, and a viewport-keyed breakpoint happily left two
   258px columns there — narrow enough that "68 plates · 61 transponders"
   wrapped to a second line.
   </para>
   The threshold is derived, not picked: the widest row needs ~254px (label,
   1rem gap, value), so two of them plus the 2.5rem column gap and the card's
   own padding want ~37rem of card. Below that, one column. */
@container (max-width: 37rem) {
    .detail-list[b-mrfgqixnud] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.detail-list > div[b-mrfgqixnud] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.45rem 0;
    border-top: 1px solid var(--bs-border-color);
}

/* The first row of each column carries no rule above it — the card header's
   own border already closes the top edge. */
.detail-list > div:nth-child(-n + 2)[b-mrfgqixnud] {
    border-top: 0;
}

@container (max-width: 37rem) {
    /* Single column: only the genuinely first row loses its rule. */
    .detail-list > div:nth-child(2)[b-mrfgqixnud] {
        border-top: 1px solid var(--bs-border-color);
    }

    .detail-list > div:first-child[b-mrfgqixnud] {
        border-top: 0;
    }
}

.detail-list dt[b-mrfgqixnud] {
    font-weight: 400;
    color: var(--bs-secondary-color);
    flex: none;
}

.detail-list dd[b-mrfgqixnud] {
    margin: 0;
    text-align: right;
}

/* Tabular figures so a value does not shuffle horizontally between reads. */
.detail-list dd.numeric[b-mrfgqixnud] {
    font-variant-numeric: tabular-nums;
}
