@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';
@import '_content/DeFa.Blazor/DeFa.Blazor.y8z9ikn8y4.bundle.scp.css';
@import '_content/Oss.Filters.Blazor/Oss.Filters.Blazor.tcd8r2hg0l.bundle.scp.css';
@import '_content/Oss.Menu.Blazor/Oss.Menu.Blazor.36o7zkrtkd.bundle.scp.css';
@import '_content/Oss.Settings.Blazor/Oss.Settings.Blazor.qhcwns5zxw.bundle.scp.css';
@import '_content/Scarnas.Blazor.Components/Scarnas.Blazor.Components.8w9pwpweek.bundle.scp.css';
@import '_content/Servel.Blazor.Forms/Servel.Blazor.Forms.609oh5ogbc.bundle.scp.css';
@import '_content/Tabiot.Blazor.Breadcrumb/Tabiot.Blazor.Breadcrumb.ypcz477a8p.bundle.scp.css';
@import '_content/Tabiot.Blazor.Conversion/Tabiot.Blazor.Conversion.rutrgx2pjl.bundle.scp.css';
@import '_content/Tabiot.Blazor.Core/Tabiot.Blazor.Core.wfr2gml081.bundle.scp.css';
@import '_content/Tabiot.Blazor.DetailsCard/Tabiot.Blazor.DetailsCard.ulqc6uogr5.bundle.scp.css';
@import '_content/Tabiot.Blazor.DxColumnChooser/Tabiot.Blazor.DxColumnChooser.m6085f0y0m.bundle.scp.css';
@import '_content/Tabiot.Blazor.Layouts/Tabiot.Blazor.Layouts.j5crb2ebzl.bundle.scp.css';
@import '_content/Tabiot.Blazor.Loading/Tabiot.Blazor.Loading.hxb6uypiw6.bundle.scp.css';
@import '_content/Tabiot.Blazor.SearchBox/Tabiot.Blazor.SearchBox.hl5yquya2h.bundle.scp.css';
@import '_content/Tabiot.Blazor.Wizard/Tabiot.Blazor.Wizard.ik4copyss6.bundle.scp.css';

/* /Components/edu/TrainingDeadlines/TrainingDeadlinesKpiBar.razor.rz.scp.css */
.td-kpi[b-qo98cobkis] {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
    align-items: stretch;
}

.td-kpi-stat[b-qo98cobkis] {
    flex: 1;
    border-radius: 6px;
    padding: 8px 12px;
    border: 1px solid transparent;
    min-width: 90px;
    cursor: pointer;
    transition: transform .1s, box-shadow .1s;
    user-select: none;
}

.td-kpi-stat:hover[b-qo98cobkis] {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

.td-kpi-stat.td-kpi-active[b-qo98cobkis] {
    box-shadow: 0 0 0 2px var(--bs-primary);
}

.td-kpi-label[b-qo98cobkis] {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.75;
    margin-bottom: 2px;
}

.td-kpi-value[b-qo98cobkis] {
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
}

.td-kpi-red[b-qo98cobkis]    { background: rgba(198, 40, 40, 0.12); border-color: rgba(198, 40, 40, 0.3); color: var(--bs-danger); }
.td-kpi-orange[b-qo98cobkis] { background: rgba(230, 81, 0, 0.12);  border-color: rgba(230, 81, 0, 0.3);  color: var(--bs-warning); }
.td-kpi-yellow[b-qo98cobkis] { background: rgba(255, 193, 7, 0.12); border-color: rgba(255, 193, 7, 0.3); color: var(--bs-warning); }
.td-kpi-gray[b-qo98cobkis]   { background: var(--bs-tertiary-bg);   border-color: var(--bs-border-color); color: var(--bs-secondary-color); }

.td-kpi-compliance[b-qo98cobkis] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    padding: 8px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 180px;
    gap: 4px;
}

.td-kpi-compliance-header[b-qo98cobkis] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--bs-secondary-color);
}

.td-kpi-compliance-header > span:last-child[b-qo98cobkis] {
    font-size: 18px;
    font-weight: 700;
}

.td-kpi-compliance-progress[b-qo98cobkis] {
    height: 6px;
    background: var(--bs-tertiary-bg);
    border-radius: 3px;
    overflow: hidden;
}

.td-kpi-compliance-fill[b-qo98cobkis] {
    height: 100%;
    transition: width 0.3s;
}

.td-kpi-compliance-text-good[b-qo98cobkis] { color: var(--bs-success); }
.td-kpi-compliance-text-warn[b-qo98cobkis] { color: var(--bs-warning); }
.td-kpi-compliance-text-bad[b-qo98cobkis]  { color: var(--bs-danger); }

.td-kpi-compliance-fill-good[b-qo98cobkis] { background-color: var(--bs-success); }
.td-kpi-compliance-fill-warn[b-qo98cobkis] { background-color: var(--bs-warning); }
.td-kpi-compliance-fill-bad[b-qo98cobkis]  { background-color: var(--bs-danger); }

.td-kpi-compliance-detail[b-qo98cobkis] {
    font-size: 11px;
    color: var(--bs-secondary-color);
    text-align: right;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-8z6h1db7q8],
.components-reconnect-repeated-attempt-visible[b-8z6h1db7q8],
.components-reconnect-failed-visible[b-8z6h1db7q8],
.components-pause-visible[b-8z6h1db7q8],
.components-resume-failed-visible[b-8z6h1db7q8],
.components-rejoining-animation[b-8z6h1db7q8] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-retrying[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-failed[b-8z6h1db7q8],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-8z6h1db7q8] {
    display: block;
}


#components-reconnect-modal[b-8z6h1db7q8] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-8z6h1db7q8 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-8z6h1db7q8 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-8z6h1db7q8 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-8z6h1db7q8]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-8z6h1db7q8 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-8z6h1db7q8 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-8z6h1db7q8 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-8z6h1db7q8 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-8z6h1db7q8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-8z6h1db7q8] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-8z6h1db7q8] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-8z6h1db7q8] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-8z6h1db7q8] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-8z6h1db7q8] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-8z6h1db7q8] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-8z6h1db7q8 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-8z6h1db7q8] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-8z6h1db7q8 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/AppointmentsCalendar/AppointmentsCalendar.razor.rz.scp.css */
/* Page layout */
.page-header[b-v0nhpyt90c] {
    background: var(--bs-body-bg);
    border-bottom: 1px solid var(--bs-border-color);
    padding: 1rem 1.5rem;
}

.page-header h1[b-v0nhpyt90c] {
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0;
}

.page-header .breadcrumb[b-v0nhpyt90c] {
    font-size: .85rem;
    margin: 0;
}

.content[b-v0nhpyt90c] {
    padding: 1rem 1.5rem;
    display: flex;
    gap: 1rem;
    height: calc(100vh - 120px);
    font-family: 'Segoe UI', system-ui, sans-serif;
}

/* Filters bar */
.filters-bar[b-v0nhpyt90c] {
    background: var(--bs-body-bg);
    border-radius: .5rem;
    border: 1px solid var(--bs-border-color);
    padding: .6rem 1rem;
    margin-bottom: 0;
    display: flex;
    gap: .75rem;
    align-items: center;
    flex-wrap: wrap;
}

.filters-bar label[b-v0nhpyt90c] {
    font-size: .75rem;
    color: var(--bs-secondary-color);
    text-transform: uppercase;
    font-weight: 600;
    margin-right: .25rem;
}

.filter-group[b-v0nhpyt90c] {
    display: flex;
    align-items: center;
    gap: .25rem;
}

/* Legend */
.legend[b-v0nhpyt90c] {
    display: flex;
    gap: .75rem;
    flex-wrap: wrap;
    align-items: center;
    font-size: .75rem;
}

.legend-item[b-v0nhpyt90c] {
    display: flex;
    align-items: center;
    gap: .3rem;
}

.legend-swatch[b-v0nhpyt90c] {
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

/* Calendar layout */
.calendar-layout[b-v0nhpyt90c] {
    display: flex;
    gap: 1rem;
    flex: 1;
    min-height: 0;
}

.calendar-area[b-v0nhpyt90c] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* Toolbar */
.calendar-toolbar[b-v0nhpyt90c] {
    background: var(--bs-body-bg);
    border-radius: .5rem .5rem 0 0;
    border: 1px solid var(--bs-border-color);
    border-bottom: none;
    padding: .6rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.nav-group[b-v0nhpyt90c] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.nav-group button[b-v0nhpyt90c] {
    background: none;
    border: 1px solid var(--bs-border-color);
    border-radius: .25rem;
    padding: .25rem .5rem;
    cursor: pointer;
    font-size: .85rem;
    color: var(--bs-body-color);
}

.nav-group button:hover[b-v0nhpyt90c] {
    background: var(--bs-tertiary-bg);
}

.current-period[b-v0nhpyt90c] {
    font-weight: 600;
    font-size: 1.1rem;
}

.view-toggle[b-v0nhpyt90c] {
    display: flex;
    gap: 0;
}

.view-toggle button[b-v0nhpyt90c] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    padding: .3rem .75rem;
    font-size: .8rem;
    cursor: pointer;
    color: var(--bs-body-color);
}

.view-toggle button:first-child[b-v0nhpyt90c] {
    border-radius: .25rem 0 0 .25rem;
}

.view-toggle button:last-child[b-v0nhpyt90c] {
    border-radius: 0 .25rem .25rem 0;
}

.view-toggle button.active[b-v0nhpyt90c] {
    background: var(--bs-primary);
    color: #fff;
    border-color: var(--bs-primary);
}

/* ::deep styles for child components */

/* Calendar grid */
[b-v0nhpyt90c] .calendar-grid {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0 0 .5rem .5rem;
    flex: 1;
    overflow-y: auto;
}

[b-v0nhpyt90c] .cal-header {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    border-bottom: 2px solid var(--bs-border-color);
}

[b-v0nhpyt90c] .day-name {
    text-align: center;
    font-size: .75rem;
    font-weight: 600;
    color: var(--bs-secondary-color);
    text-transform: uppercase;
    padding: .5rem .25rem;
}

[b-v0nhpyt90c] .day-number {
    display: block;
    font-size: .9rem;
    font-weight: 700;
    color: var(--bs-body-color);
}

[b-v0nhpyt90c] .today-label {
    color: var(--bs-primary) !important;
    font-weight: 700 !important;
}

/* Week view */
[b-v0nhpyt90c] .week-body {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    position: relative;
}

[b-v0nhpyt90c] .time-labels {
    display: flex;
    flex-direction: column;
}

[b-v0nhpyt90c] .time-label {
    height: 60px;
    font-size: .7rem;
    color: var(--bs-secondary-color);
    text-align: right;
    padding-right: .4rem;
    border-right: 1px solid var(--bs-border-color);
    position: relative;
}

[b-v0nhpyt90c] .time-label span {
    position: relative;
    top: -7px;
}

[b-v0nhpyt90c] .day-column {
    border-left: 1px solid var(--bs-border-color-translucent);
    position: relative;
    min-height: 720px;
}

[b-v0nhpyt90c] .hour-line {
    height: 60px;
    border-bottom: 1px solid var(--bs-border-color-translucent);
}

[b-v0nhpyt90c] .hour-line:hover {
    background: var(--bs-tertiary-bg);
    cursor: pointer;
}

/* Today column highlight */
[b-v0nhpyt90c] .today-col {
    background: color-mix(in srgb, var(--bs-primary) 5%, transparent);
}

/* Appointment blocks */
[b-v0nhpyt90c] .appt-block {
    position: absolute;
    left: 3px;
    right: 3px;
    border-radius: .3rem;
    padding: .3rem .4rem;
    font-size: .75rem;
    cursor: pointer;
    overflow: hidden;
    border-left: 3px solid;
    z-index: 2;
    transition: box-shadow .15s, transform .15s;
    color: #212529;
}

[b-v0nhpyt90c] .appt-block:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
    transform: translateY(-1px);
    z-index: 10;
}

[b-v0nhpyt90c] .appt-inner {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

[b-v0nhpyt90c] .appt-title-row {
    display: flex;
    align-items: center;
    gap: .25rem;
    min-width: 0;
}

[b-v0nhpyt90c] .appt-course {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #212529;
}

[b-v0nhpyt90c] .appt-time {
    font-size: .7rem;
    color: rgba(0, 0, 0, .7);
    white-space: nowrap;
}

[b-v0nhpyt90c] .appt-meta {
    font-size: .65rem;
    color: rgba(0, 0, 0, .65);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
}

[b-v0nhpyt90c] .appt-meta i {
    margin-right: 2px;
}

[b-v0nhpyt90c] .appt-enrollment {
    font-size: .65rem;
    color: rgba(0, 0, 0, .7);
    white-space: nowrap;
}

[b-v0nhpyt90c] .appt-enrollment i {
    margin-right: 3px;
}

/* Status dot */
[b-v0nhpyt90c] .status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 2px;
}

/* Now line */
[b-v0nhpyt90c] .now-line {
    border-top: 2px solid #dc3545;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 5;
}

[b-v0nhpyt90c] .now-indicator {
    background: #dc3545;
    color: #fff;
    font-size: .6rem;
    padding: 0 .3rem;
    border-radius: 0 .2rem .2rem 0;
    position: absolute;
    left: 0;
    top: -8px;
}

/* Empty state */
[b-v0nhpyt90c] .empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: var(--bs-secondary-color);
    font-size: .9rem;
}

/* Month grid */
[b-v0nhpyt90c] .month-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    flex: 1;
}

[b-v0nhpyt90c] .month-cell {
    border-right: 1px solid var(--bs-border-color);
    border-bottom: 1px solid var(--bs-border-color);
    padding: .3rem .4rem;
    min-height: 100px;
    cursor: pointer;
}

[b-v0nhpyt90c] .month-cell:hover {
    background: var(--bs-tertiary-bg);
}

[b-v0nhpyt90c] .month-appt-strip {
    display: flex;
    align-items: center;
    gap: .25rem;
    border-radius: .2rem;
    font-size: .7rem;
    padding: .1rem .3rem;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    color: #212529;
}

[b-v0nhpyt90c] .month-appt-time {
    font-weight: 600;
    color: rgba(0, 0, 0, .75);
    flex-shrink: 0;
}

[b-v0nhpyt90c] .month-appt-name {
    overflow: hidden;
    text-overflow: ellipsis;
    color: #212529;
}

[b-v0nhpyt90c] .month-overflow {
    font-size: .65rem;
    color: var(--bs-secondary-color);
    cursor: pointer;
}

/* Side panel */
[b-v0nhpyt90c] .side-panel {
    width: 340px;
    min-width: 340px;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    overflow-y: auto;
}

[b-v0nhpyt90c] .panel-card {
    background: var(--bs-body-bg);
    border-radius: .5rem;
    border: 1px solid var(--bs-border-color);
}

[b-v0nhpyt90c] .panel-card-header {
    padding: .55rem .85rem;
    border-bottom: 1px solid var(--bs-border-color-translucent);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    font-weight: 600;
    font-size: .9rem;
}

[b-v0nhpyt90c] .panel-empty {
    padding: 1.25rem .85rem;
    text-align: center;
}

[b-v0nhpyt90c] .appt-color-strip {
    margin: .65rem .85rem .5rem;
    padding: .5rem .65rem;
    border-radius: 0 .3rem .3rem 0;
    color: #212529;
}

[b-v0nhpyt90c] .appt-color-strip .text-muted {
    color: rgba(0, 0, 0, .6) !important;
}

[b-v0nhpyt90c] .detail-rows {
    padding: .25rem .85rem .65rem;
}

[b-v0nhpyt90c] .detail-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
    padding: .3rem 0;
    font-size: .85rem;
    border-bottom: 1px solid var(--bs-border-color-translucent);
}

[b-v0nhpyt90c] .detail-row:last-child {
    border-bottom: none;
}

[b-v0nhpyt90c] .detail-label {
    color: var(--bs-secondary-color);
    font-size: .8rem;
}

[b-v0nhpyt90c] .detail-value {
    font-weight: 500;
}

/* Progress bar */
[b-v0nhpyt90c] .progress-mini {
    height: 6px;
    border-radius: 3px;
    background: var(--bs-secondary-bg);
    overflow: hidden;
}

/* Action buttons */
[b-v0nhpyt90c] .action-btn {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .65rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .25rem;
    background: var(--bs-body-bg);
    font-size: .8rem;
    cursor: pointer;
    width: 100%;
    text-align: left;
    color: var(--bs-body-color);
}

[b-v0nhpyt90c] .action-btn:hover {
    background: color-mix(in srgb, var(--bs-primary) 8%, var(--bs-body-bg));
    border-color: var(--bs-primary);
    color: var(--bs-primary);
}

[b-v0nhpyt90c] .action-btn i {
    width: 16px;
    text-align: center;
}

/* Workers expandable */
[b-v0nhpyt90c] .toggle-workers-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .8rem;
    color: var(--bs-primary);
    text-decoration: none;
}

[b-v0nhpyt90c] .toggle-workers-link:hover {
    text-decoration: underline;
}

[b-v0nhpyt90c] .workers-list {
    list-style: none;
    margin: 0;
    padding: 0 .85rem .65rem;
}

[b-v0nhpyt90c] .worker-row {
    padding: .3rem 0;
    border-bottom: 1px solid var(--bs-border-color-translucent);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
    font-size: .85rem;
}

[b-v0nhpyt90c] .worker-row:last-child {
    border-bottom: none;
}

[b-v0nhpyt90c] .worker-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-v0nhpyt90c] .presence-badge {
    font-size: .7rem;
    padding: .15em .4em;
    border-radius: .2rem;
}

/* Status colors — these are intentionally fixed */
[b-v0nhpyt90c] .st-planned {
    color: #6c757d;
}

[b-v0nhpyt90c] .st-open {
    color: #0d6efd;
}

[b-v0nhpyt90c] .st-inprogress {
    color: #f9a825;
}

[b-v0nhpyt90c] .st-completed {
    color: #198754;
}
/* /Components/Pages/ComplianceDashboard/CompaniesTrainingOverview.razor.rz.scp.css */
/* ===== PAGE LAYOUT ===== */
.cto-page[b-jbgc1hx4be] {
    padding: 20px;
    font-size: 13px;
    color: var(--bs-body-color);
}

/* ===== PAGE HEADER ===== */
.cto-header[b-jbgc1hx4be] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    padding: 14px 18px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.cto-header h1[b-jbgc1hx4be] {
    font-size: 16px;
    font-weight: 600;
    color: var(--bs-primary);
    white-space: nowrap;
    margin: 0;
}

.cto-company-selector[b-jbgc1hx4be] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cto-company-selector label[b-jbgc1hx4be] {
    font-size: 11px;
    color: var(--bs-secondary-color);
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin: 0;
}

/* ===== HEADER ACTIONS ===== */
.cto-header-actions[b-jbgc1hx4be] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ===== SUMMARY BAR ===== */
.cto-summary[b-jbgc1hx4be] {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
    flex-wrap: wrap;
    align-items: stretch;
}

.cto-stat[b-jbgc1hx4be] {
    flex: 1;
    border-radius: 6px;
    padding: 12px 14px;
    border: 1px solid transparent;
    min-width: 100px;
}

.cto-stat-label[b-jbgc1hx4be] {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.75;
    margin-bottom: 4px;
}

.cto-stat-value[b-jbgc1hx4be] {
    font-size: 26px;
    font-weight: 700;
    line-height: 1;
}

/* Status cards keep semantic colors in both themes */
.cto-stat.green[b-jbgc1hx4be]  { background: rgba(46, 125, 50, 0.12); border-color: rgba(46, 125, 50, 0.3); color: var(--bs-success); }
.cto-stat.yellow[b-jbgc1hx4be] { background: rgba(230, 81, 0, 0.12);  border-color: rgba(230, 81, 0, 0.3);  color: var(--bs-warning); }
.cto-stat.red[b-jbgc1hx4be]    { background: rgba(198, 40, 40, 0.12); border-color: rgba(198, 40, 40, 0.3); color: var(--bs-danger); }
.cto-stat.gray[b-jbgc1hx4be]   { background: var(--bs-tertiary-bg);    border-color: var(--bs-border-color);  color: var(--bs-secondary-color); }

/* ===== COMPLIANCE WIDGET ===== */
.cto-compliance[b-jbgc1hx4be] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    padding: 12px 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 200px;
    gap: 6px;
}

.cto-compliance-header[b-jbgc1hx4be] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    font-size: 11px;
    color: var(--bs-secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.cto-compliance-header .compliance-good[b-jbgc1hx4be],
.cto-compliance-header .compliance-medium[b-jbgc1hx4be],
.cto-compliance-header .compliance-bad[b-jbgc1hx4be] {
    font-size: 22px;
    font-weight: 700;
}

/* ===== PROGRESS BAR ===== */
.cto-progress[b-jbgc1hx4be] {
    background: var(--bs-tertiary-bg);
    border-radius: 4px;
    height: 8px;
    overflow: hidden;
}

.cto-progress-fill[b-jbgc1hx4be] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s;
}

.cto-progress-fill.compliance-good[b-jbgc1hx4be]   { background: linear-gradient(90deg, #2e7d32, #43a047); }
.cto-progress-fill.compliance-medium[b-jbgc1hx4be] { background: linear-gradient(90deg, #e65100, #f57c00); }
.cto-progress-fill.compliance-bad[b-jbgc1hx4be]    { background: linear-gradient(90deg, #c62828, #e53935); }

/* ===== COMPLIANCE TEXT COLORS ===== */
.compliance-good[b-jbgc1hx4be]   { color: var(--bs-success); }
.compliance-medium[b-jbgc1hx4be] { color: var(--bs-warning); }
.compliance-bad[b-jbgc1hx4be]    { color: var(--bs-danger); }

/* ===== FILTERS ROW ===== */
.cto-filters[b-jbgc1hx4be] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    padding: 10px 14px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.cto-filter-group[b-jbgc1hx4be] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cto-filter-group label[b-jbgc1hx4be] {
    font-size: 11px;
    color: var(--bs-secondary-color);
    white-space: nowrap;
    margin: 0;
}

/* ===== VIEW TOGGLE ===== */
.cto-view-toggle[b-jbgc1hx4be] {
    display: flex;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    overflow: hidden;
    margin-left: auto;
}

.cto-view-toggle button[b-jbgc1hx4be] {
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 500;
    border: none;
    background: var(--bs-tertiary-bg);
    color: var(--bs-body-color);
    cursor: pointer;
    line-height: 20px;
}

.cto-view-toggle button.active[b-jbgc1hx4be] {
    background: var(--bs-primary);
    color: #fff;
}

.cto-view-toggle button:hover:not(.active)[b-jbgc1hx4be] {
    background: var(--bs-secondary-bg);
}

/* ===== SECTION CARD ===== */
.cto-section[b-jbgc1hx4be] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    margin-bottom: 16px;
    overflow: visible;
}

.cto-section-header[b-jbgc1hx4be] {
    padding: 10px 16px;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 6px 6px 0 0;
}

.cto-section-title[b-jbgc1hx4be] {
    font-size: 13px;
    font-weight: 600;
    color: var(--bs-primary);
}

.cto-badge[b-jbgc1hx4be] {
    background: var(--bs-primary);
    color: #fff;
    border-radius: 10px;
    padding: 1px 7px;
    font-size: 11px;
    font-weight: 600;
}

/* ===== MATRIX WRAP ===== */
.cto-matrix-wrap[b-jbgc1hx4be] {
    overflow-x: auto;
    overflow-y: visible;
}

.cto-matrix-wrap[b-jbgc1hx4be]::-webkit-scrollbar { height: 6px; }
.cto-matrix-wrap[b-jbgc1hx4be]::-webkit-scrollbar-track { background: var(--bs-tertiary-bg); }
.cto-matrix-wrap[b-jbgc1hx4be]::-webkit-scrollbar-thumb { background: var(--bs-border-color); border-radius: 3px; }

/* ===== MATRIX TABLE ===== */
.cto-matrix[b-jbgc1hx4be] {
    border-collapse: collapse;
    width: 100%;
    min-width: 860px;
}

/* Group header row — keeps brand color in both themes */
.cto-matrix thead tr.cto-group-row th[b-jbgc1hx4be] {
    background: #1a5276;
    color: #fff;
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.4px;
    padding: 6px 4px;
    border-right: 2px solid rgba(255,255,255,0.2);
    white-space: nowrap;
}

.cto-matrix thead tr.cto-group-row th.cto-worker-header[b-jbgc1hx4be] {
    background: #2c3e50;
    text-align: left;
    padding-left: 12px;
    width: 220px;
    min-width: 220px;
}

/* Column header row */
.cto-matrix thead tr.cto-col-row th[b-jbgc1hx4be] {
    background: #2c3e50;
    color: #e2e8f0;
    font-size: 10px;
    font-weight: 600;
    text-align: center;
    padding: 6px 6px;
    border-right: 1px solid rgba(255,255,255,0.1);
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.3;
}

.cto-matrix thead tr.cto-col-row th.cto-worker-header[b-jbgc1hx4be] {
    text-align: left;
    padding-left: 12px;
    width: 220px;
    min-width: 220px;
}

/* Grouped table — no sticky */
.cto-matrix-grouped .cto-col-row th[b-jbgc1hx4be] {
    position: static;
}

/* Worker column */
.cto-matrix td.cto-worker-cell[b-jbgc1hx4be] {
    padding: 7px 12px;
    width: 220px;
    min-width: 220px;
    border-right: 2px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    overflow: hidden;
    text-overflow: ellipsis;
}

.cto-worker-name[b-jbgc1hx4be] {
    font-weight: 600;
    font-size: 12px;
    color: var(--bs-body-color);
    white-space: nowrap;
}

.cto-worker-role[b-jbgc1hx4be] {
    display: inline-block;
    font-size: 9px;
    padding: 1px 5px;
    border-radius: 8px;
    margin-top: 2px;
    font-weight: 600;
    background: rgba(46, 125, 50, 0.12);
    color: var(--bs-success);
}

.cto-worker-job[b-jbgc1hx4be] {
    font-size: 10px;
    color: var(--bs-secondary-color);
    margin-top: 1px;
}

/* Status cells */
.cto-matrix td.cto-status-cell[b-jbgc1hx4be] {
    text-align: center;
    padding: 4px 2px;
    border-right: 1px solid var(--bs-border-color-translucent);
    vertical-align: middle;
    min-width: 90px;
    width: 90px;
}

/* Status indicator — semantic colors work in both themes */
.cto-status[b-jbgc1hx4be] {
    margin: 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    cursor: default;
    border: 1px solid transparent;
}

.status-ok[b-jbgc1hx4be]   { background: rgba(46, 125, 50, 0.15); color: #4caf50; border-color: rgba(46, 125, 50, 0.3); }
.status-warn[b-jbgc1hx4be] { background: rgba(230, 81, 0, 0.15);  color: #ff9800; border-color: rgba(230, 81, 0, 0.3); }
.status-err[b-jbgc1hx4be]  { background: rgba(198, 40, 40, 0.15); color: #ef5350; border-color: rgba(198, 40, 40, 0.3); }
.status-na[b-jbgc1hx4be]   { background: var(--bs-tertiary-bg); color: var(--bs-secondary-color); border-color: var(--bs-border-color-translucent); font-size: 16px; font-weight: 400; }

/* Table rows */
.cto-matrix tbody tr[b-jbgc1hx4be] { border-bottom: 1px solid var(--bs-border-color-translucent); }
.cto-matrix tbody tr:nth-child(even) td.cto-worker-cell[b-jbgc1hx4be] { background: var(--bs-tertiary-bg); }
.cto-matrix tbody tr:nth-child(even) td.cto-status-cell[b-jbgc1hx4be] { background: rgba(0,0,0,0.015); }
.cto-matrix tbody tr:hover td[b-jbgc1hx4be] { background: rgba(var(--bs-primary-rgb), 0.08) !important; }

/* ===== LEGEND ===== */
.cto-legend[b-jbgc1hx4be] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 16px;
    border-top: 1px solid var(--bs-border-color-translucent);
    background: var(--bs-tertiary-bg);
    flex-wrap: wrap;
    border-radius: 0 0 6px 6px;
}

.cto-legend-item[b-jbgc1hx4be] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: var(--bs-secondary-color);
}

.cto-legend-dot[b-jbgc1hx4be] {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    flex-shrink: 0;
    border: 1px solid transparent;
}

/* ===== GROUP CARD (Per Mansione view) ===== */
.cto-group-card[b-jbgc1hx4be] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    margin-bottom: 12px;
    overflow: hidden;
}

.cto-group-card-header[b-jbgc1hx4be] {
    padding: 10px 16px;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    display: flex;
    align-items: center;
    gap: 12px;
}

.cto-group-title[b-jbgc1hx4be] {
    font-size: 13px;
    font-weight: 700;
    color: var(--bs-body-color);
}

.cto-group-subtitle[b-jbgc1hx4be] {
    font-size: 11px;
    color: var(--bs-secondary-color);
}

.cto-group-compliance[b-jbgc1hx4be] {
    margin-left: auto;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
}

.cto-group-compliance.compliance-good[b-jbgc1hx4be]   { background: rgba(46, 125, 50, 0.15); color: #4caf50; }
.cto-group-compliance.compliance-medium[b-jbgc1hx4be] { background: rgba(230, 81, 0, 0.15);  color: #ff9800; }
.cto-group-compliance.compliance-bad[b-jbgc1hx4be]    { background: rgba(198, 40, 40, 0.15); color: #ef5350; }
/* /Components/Pages/ComplianceDashboard/CompanyProspect.razor.rz.scp.css */
/* Summary cards */
.summary-card[b-v2x3i5szh4] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
    transition: box-shadow .15s;
}

.summary-card:hover[b-v2x3i5szh4] {
    box-shadow: 0 2px 8px color-mix(in srgb, var(--bs-body-color) 8%, transparent);
}

/* Filters bar */
.filters-bar[b-v2x3i5szh4] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
}

/* Company cards */
.company-card[b-v2x3i5szh4] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
    transition: box-shadow .15s, border-color .15s;
}

.company-card:hover[b-v2x3i5szh4] {
    border-color: var(--bs-primary);
    box-shadow: 0 2px 12px color-mix(in srgb, var(--bs-primary) 12%, transparent);
}

/* Compliance bar */
.compliance-bar[b-v2x3i5szh4] {
    height: 8px;
    border-radius: 4px;
    background: var(--bs-secondary-bg);
    overflow: hidden;
}

.compliance-bar .fill[b-v2x3i5szh4] {
    height: 100%;
    border-radius: 4px;
    transition: width .3s;
}

/* Status badges */
.status-badge[b-v2x3i5szh4] {
    font-size: .75rem;
    padding: .25em .55em;
    border-radius: .25rem;
    font-weight: 600;
    border: 1px solid transparent;
}

.status-badge-danger[b-v2x3i5szh4] {
    background: color-mix(in srgb, var(--bs-danger) 12%, transparent);
    color: var(--bs-danger);
    border-color: color-mix(in srgb, var(--bs-danger) 20%, transparent);
}

.status-badge-warning[b-v2x3i5szh4] {
    background: color-mix(in srgb, var(--bs-warning) 15%, transparent);
    color: var(--bs-warning);
    border-color: color-mix(in srgb, var(--bs-warning) 25%, transparent);
}

.status-badge-secondary[b-v2x3i5szh4] {
    background: color-mix(in srgb, var(--bs-secondary) 12%, transparent);
    color: var(--bs-secondary);
    border-color: color-mix(in srgb, var(--bs-secondary) 20%, transparent);
}

.status-badge-success[b-v2x3i5szh4] {
    background: color-mix(in srgb, var(--bs-success) 12%, transparent);
    color: var(--bs-success);
    border-color: color-mix(in srgb, var(--bs-success) 20%, transparent);
}

/* Breakdown numbers */
.breakdown-item[b-v2x3i5szh4] {
    text-align: center;
    min-width: 40px;
}

.breakdown-value[b-v2x3i5szh4] {
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 1.2;
}

.breakdown-label[b-v2x3i5szh4] {
    font-size: .7rem;
    color: var(--bs-secondary-color);
    text-transform: uppercase;
    letter-spacing: .3px;
}

/* Company meta */
.company-meta[b-v2x3i5szh4] {
    font-size: .8rem;
    color: var(--bs-secondary-color);
}

/* Compliance percentage */
.compliance-pct[b-v2x3i5szh4] {
    font-size: 1.4rem;
    font-weight: 700;
    min-width: 55px;
    text-align: right;
}
/* /Components/Pages/Home.razor.rz.scp.css */
.home-container[b-vt4xp6jdyr] {
    padding: 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-vt4xp6jdyr] {
    border-bottom: 2px solid var(--bs-border-color);
    padding-bottom: 1rem;
}

/* Statistics Cards */
.stat-card-link[b-vt4xp6jdyr] {
    text-decoration: none;
    color: inherit;
    display: block;
    height: 100%;
}

.stat-card[b-vt4xp6jdyr] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    box-shadow: var(--bs-box-shadow-sm);
    transition: transform 0.2s, box-shadow 0.2s;
    height: 100%;
}

.stat-card:hover[b-vt4xp6jdyr] {
    transform: translateY(-2px);
    box-shadow: var(--bs-box-shadow);
}

.stat-icon[b-vt4xp6jdyr] {
    width: 60px;
    height: 60px;
    border-radius: var(--bs-border-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: white;
    flex-shrink: 0;
}

.stat-content[b-vt4xp6jdyr] {
    flex-grow: 1;
}

.stat-number[b-vt4xp6jdyr] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
    color: var(--bs-body-color);
}

.stat-label[b-vt4xp6jdyr] {
    margin: 0;
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
    font-weight: 500;
}

/* Card Styling */
.card[b-vt4xp6jdyr] {
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-lg);
    background-color: var(--bs-body-bg);
}

.card-header[b-vt4xp6jdyr] {
    border-bottom: 1px solid var(--bs-border-color);
    padding: 1rem 1.25rem;
    background-color: var(--bs-body-bg);
}

.card-header h5[b-vt4xp6jdyr] {
    font-weight: 600;
    color: var(--bs-body-color);
}

/* Activity List */
.activity-list[b-vt4xp6jdyr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.activity-item[b-vt4xp6jdyr] {
    display: flex;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--bs-border-color);
}

.activity-item:last-child[b-vt4xp6jdyr] {
    border-bottom: none;
    padding-bottom: 0;
}

.activity-icon[b-vt4xp6jdyr] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1rem;
}

.activity-details[b-vt4xp6jdyr] {
    flex-grow: 1;
}

.activity-details h6[b-vt4xp6jdyr] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--bs-body-color);
}

/* Appointment List */
.appointment-list[b-vt4xp6jdyr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.appointment-item[b-vt4xp6jdyr] {
    display: flex;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--bs-border-color);
}

.appointment-item:last-child[b-vt4xp6jdyr] {
    border-bottom: none;
    padding-bottom: 0;
}

.appointment-date[b-vt4xp6jdyr] {
    width: 60px;
    height: 60px;
    border-radius: var(--bs-border-radius);
    background: linear-gradient(135deg, var(--bs-primary) 0%, var(--bs-purple) 100%);
    color: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.date-day[b-vt4xp6jdyr] {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}

.date-month[b-vt4xp6jdyr] {
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 600;
}

.appointment-details[b-vt4xp6jdyr] {
    flex-grow: 1;
}

.appointment-details h6[b-vt4xp6jdyr] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--bs-body-color);
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
    .home-container[b-vt4xp6jdyr] {
        padding: 1rem;
    }

    .stat-card[b-vt4xp6jdyr] {
        padding: 1rem;
    }

    .stat-number[b-vt4xp6jdyr] {
        font-size: 1.5rem;
    }

    .stat-icon[b-vt4xp6jdyr] {
        width: 50px;
        height: 50px;
        font-size: 1.25rem;
    }
}