@import '_content/Scytales.DocumentCategories.Web/Scytales.DocumentCategories.Web.bundle.scp.css';
@import '_content/Scytales.DocumentIssuing.Web/Scytales.DocumentIssuing.Web.bundle.scp.css';
@import '_content/Scytales.Documents.Web/Scytales.Documents.Web.bundle.scp.css';
@import '_content/Scytales.Organizations.Web/Scytales.Organizations.Web.bundle.scp.css';

/* _content/Scytales.Manager/Components/Layout/LoginLayout.razor.rz.scp.css */
.login-viewport[b-qbej301lnu] {
    background-color: #36506B;
    min-height: 100vh;
}
/* _content/Scytales.Manager/Components/Layout/MainLayout.razor.rz.scp.css */
[b-87b8vhl1zo] .mud-main-content {
    min-height: calc(100vh - 64px);
    background-color: var(--mud-palette-background, #F5F5F5);
}
/* _content/Scytales.Manager/Components/Layout/NavMenu.razor.rz.scp.css */
/* Fill the drawer as a column so the version footer can settle at the bottom. If the
   surrounding drawer is not a flex column, this degrades to the footer rendering directly
   beneath the nav links rather than pinned. */
.nav-menu-root[b-daep0rpt42] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

/* Deployed app version. "start" rather than "left" so the footer follows the reading
   direction — the Manager drawer flips for RTL cultures. */
.nav-menu-footer[b-daep0rpt42] {
    margin-top: auto;
    padding: 0.5rem 1rem 0.75rem;
    font-size: 0.75rem;
    text-align: start;
    color: var(--mud-palette-drawer-text, var(--mud-palette-text-secondary));
    opacity: 0.6;
}

.org-card[b-daep0rpt42] {
    padding-top: 1em;
    color: white;
    border-bottom: 2px solid rgba(255, 255, 255, 0.3);
}

.org-card[b-daep0rpt42]  .mud-paper {
    background-color: var(--mud-palette-drawer-background);
}
/* _content/Scytales.Manager/Components/Pages/Dashboard.razor.rz.scp.css */
/* Copyright (c) Scytales. All rights reserved. */

/*
 * Chrome and ink use MudBlazor's own theme variables so light/dark follows the app theme with no
 * branching. Only the series colours are fixed hexes, and those are validated against both surfaces.
 */

/*
 * Tiles stretch to their grid row and centre their content, so the row of totals sitting beside the taller
 * document-type card reads as one band rather than three short boxes floating at its top.
 */
.stat-tile[b-72fu1fcuk5] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
    height: 100%;
}

.stat-label[b-72fu1fcuk5] {
    color: var(--mud-palette-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.stat-value[b-72fu1fcuk5] {
    color: var(--mud-palette-text-primary);
    line-height: 1.2;
}

/* Legend — identity is never carried by colour alone, so every swatch is paired with its label. */

.chart-legend[b-72fu1fcuk5] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.8125rem;
    color: var(--mud-palette-text-secondary);
}

.legend-item[b-72fu1fcuk5] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.legend-swatch[b-72fu1fcuk5] {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    flex: 0 0 auto;
}

/*
 * Donut — hand-rolled so it can carry per-slice hover and focus and drop the legend. The ring's circumference is
 * exactly 100 user units, so each slice's dasharray is its percentage share directly.
 */

.donut[b-72fu1fcuk5] {
    position: relative;
    width: 100%;
    max-width: 240px;
    margin-inline: auto;
}

.donut-ring[b-72fu1fcuk5] {
    display: block;
    width: 100%;
    height: auto;
    /* Room for the hovered slice to thicken without clipping against the viewBox. */
    overflow: visible;
}

.donut-seg[b-72fu1fcuk5] {
    stroke-width: 5;
    transition: stroke-width 120ms ease-out;
}

/* The hovered slice lifts by thickening, so the pointer visibly gets a response. */
.donut-seg:hover[b-72fu1fcuk5],
.donut-seg:focus-visible[b-72fu1fcuk5] {
    stroke-width: 7;
    outline: none;
}

.donut-hole[b-72fu1fcuk5] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.125rem;
    /* Purely a label: the ring beneath it must stay hoverable. */
    pointer-events: none;
}

.donut-total[b-72fu1fcuk5] {
    font-size: 1.5rem;
    line-height: 1.1;
    color: var(--mud-palette-text-primary);
}

.donut-total-label[b-72fu1fcuk5] {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--mud-palette-text-secondary);
}

/*
 * The readout replaces the legend. Its height is reserved whether or not a slice is named, so naming one cannot
 * reflow the card.
 */
.donut-readout[b-72fu1fcuk5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    min-height: 2.5rem;
    margin-top: 0.5rem;
    font-size: 0.8125rem;
    text-align: center;
}

.donut-readout-name[b-72fu1fcuk5] {
    color: var(--mud-palette-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.donut-readout-value[b-72fu1fcuk5] {
    color: var(--mud-palette-text-secondary);
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
}

/* Table view — the pointer-free way to read every value the donut encodes. */

.chart-table summary[b-72fu1fcuk5] {
    cursor: pointer;
    font-size: 0.8125rem;
    color: var(--mud-palette-text-secondary);
}

.chart-table table[b-72fu1fcuk5] {
    width: 100%;
    margin-top: 0.5rem;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.chart-table th[b-72fu1fcuk5],
.chart-table td[b-72fu1fcuk5] {
    padding: 0.25rem 0.5rem 0.25rem 0;
    text-align: start;
    border-bottom: 1px solid var(--mud-palette-table-lines);
}

.chart-table th[b-72fu1fcuk5] {
    color: var(--mud-palette-text-secondary);
    font-weight: 500;
}

.chart-table td[b-72fu1fcuk5] {
    color: var(--mud-palette-text-primary);
}

.chart-table .numeric[b-72fu1fcuk5] {
    text-align: end;
    font-variant-numeric: tabular-nums;
}

/* Funnel — a horizontal bar list. Bars grow from the inline-start baseline; the data end is rounded. */

.funnel[b-72fu1fcuk5] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.funnel-row[b-72fu1fcuk5] {
    display: grid;
    grid-template-columns: minmax(6rem, 9rem) 1fr auto;
    align-items: center;
    gap: 0.75rem;
}

.funnel-label[b-72fu1fcuk5] {
    font-size: 0.8125rem;
    color: var(--mud-palette-text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.funnel-track[b-72fu1fcuk5] {
    display: flex;
    /* 2px of surface between adjacent fills keeps the two segments legibly separate. */
    gap: 2px;
    background: var(--mud-palette-action-disabled-background);
    border-radius: 4px;
    height: 12px;
    overflow: hidden;
}

.funnel-seg[b-72fu1fcuk5] {
    height: 100%;
    min-width: 2px;
    transition: width 150ms ease-out;
}

/* Round only the outer data end; the baseline end stays square, anchored to the axis. */
.funnel-seg:last-child[b-72fu1fcuk5] {
    border-start-end-radius: 4px;
    border-end-end-radius: 4px;
}

.funnel-seg-ok[b-72fu1fcuk5] {
    background: var(--funnel-ok);
}

.funnel-seg-fail[b-72fu1fcuk5] {
    background: var(--funnel-fail);
}

.funnel-value[b-72fu1fcuk5] {
    display: flex;
    align-items: baseline;
    gap: 0.375rem;
    /* Counts sit in a column, so they align on their digits. */
    font-variant-numeric: tabular-nums;
}

.funnel-count[b-72fu1fcuk5] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--mud-palette-text-primary);
}

.funnel-share[b-72fu1fcuk5] {
    font-size: 0.75rem;
    color: var(--mud-palette-text-secondary);
    min-width: 2.5rem;
    text-align: end;
}

@media (max-width: 600px) {
    .funnel-row[b-72fu1fcuk5] {
        grid-template-columns: minmax(4.5rem, 7rem) 1fr auto;
        gap: 0.5rem;
    }

    .funnel-share[b-72fu1fcuk5] {
        display: none;
    }
}
/* _content/Scytales.Manager/Components/Pages/Landing.razor.rz.scp.css */
.landing-card-wrapper[b-5jy7zacowb] {
    width: 100%;
}

.landing-card-wrapper[b-5jy7zacowb]  .mud-paper {
    width: 100%;
    border-radius: 8px;
}
