/* /Layout/Components/AccessPanel.razor.rz.scp.css */
.access2[b-k6dwh1walq] { padding: 24px 26px; display: flex; flex-direction: column; }

.access2-head[b-k6dwh1walq] { margin-bottom: 20px; }

    .access2-head h3[b-k6dwh1walq] { margin: 0; font-size: 18px; font-weight: 700; color: var(--text); }
    .access2-head p[b-k6dwh1walq] { margin: 4px 0 0; font-size: 13px; color: var(--text-muted); }

.access2-list[b-k6dwh1walq] { display: flex; flex-direction: column; gap: 10px; }

.access2-item[b-k6dwh1walq] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: var(--surface-2);
}

.access2-avatar[b-k6dwh1walq] {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--primary-soft);
    color: #A5B4FC;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
}

.access2-info[b-k6dwh1walq] { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }

.access2-name[b-k6dwh1walq] { font-size: 14.5px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 8px; }

.access2-you[b-k6dwh1walq] {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #6EE7B7;
    background: var(--secondary-soft);
    padding: 1px 7px;
    border-radius: var(--r-pill);
}

.access2-email[b-k6dwh1walq] { font-size: 12.5px; color: var(--text-muted); }

.access2-badge[b-k6dwh1walq] {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    color: #C7D2FE;
    background: var(--primary-soft);
    padding: 4px 12px;
    border-radius: var(--r-pill);
}

.access2-add[b-k6dwh1walq] { margin-top: 16px; align-self: flex-start; }

.access2-team[b-k6dwh1walq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
    flex-wrap: wrap;
}

.access2-team-text[b-k6dwh1walq] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--text-muted);
    min-width: 0;
}

    .access2-team-text i[b-k6dwh1walq] { color: #A5B4FC; font-size: 17px; flex-shrink: 0; }

.access2-modal-hint[b-k6dwh1walq] { margin: 0 0 4px; font-size: 13px; color: var(--text-muted); }
/* /Layout/Components/CardComponent.razor.rz.scp.css */
.kpi[b-v4pviurcsv] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background-color: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow-sm);
    transition: border-color var(--t), transform var(--t);
    min-width: 0;
}

    .kpi:hover[b-v4pviurcsv] {
        border-color: var(--border-strong);
        transform: translateY(-1px);
    }

.kpi-icon[b-v4pviurcsv] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.kpi-body[b-v4pviurcsv] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.kpi-label[b-v4pviurcsv] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kpi-value[b-v4pviurcsv] {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--text);
    white-space: nowrap;
}

.kpi-trend[b-v4pviurcsv] {
    display: inline-flex;
    align-items: center;
    gap: 1px;
    font-size: 12px;
    font-weight: 600;
    margin-top: 2px;
}

    .kpi-trend i[b-v4pviurcsv] { font-size: 15px; }
    .kpi-trend.up[b-v4pviurcsv]   { color: #34D399; }
    .kpi-trend.down[b-v4pviurcsv] { color: #F87171; }
    .kpi-trend.flat[b-v4pviurcsv] { color: var(--text-muted); }

/* Acentos */
.kpi-indigo .kpi-icon[b-v4pviurcsv]  { background: var(--primary-soft);   color: #A5B4FC; }
.kpi-emerald .kpi-icon[b-v4pviurcsv] { background: var(--secondary-soft); color: #6EE7B7; }
.kpi-amber .kpi-icon[b-v4pviurcsv]   { background: rgba(250,204,21,0.14); color: var(--warning); }

.kpi-emerald .kpi-value[b-v4pviurcsv] { color: #6EE7B7; }
.kpi-amber .kpi-value[b-v4pviurcsv]   { color: var(--warning); }

@media (max-width: 1280px) {
    .kpi-value[b-v4pviurcsv] { font-size: 19px; }
    .kpi-icon[b-v4pviurcsv] { width: 40px; height: 40px; font-size: 18px; }
}

@media (max-width: 560px) {
    .kpi[b-v4pviurcsv] { padding: 12px; gap: 10px; }
    .kpi-icon[b-v4pviurcsv] { width: 36px; height: 36px; font-size: 16px; border-radius: 10px; }
    .kpi-value[b-v4pviurcsv] { font-size: 17px; }
    .kpi-label[b-v4pviurcsv] { font-size: 12px; }
}
/* /Layout/Components/EmployeeForm.razor.rz.scp.css */
.employee-form-avatar[b-ylzwwvp8uk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-bottom: 4px;
}

.employee-form-photo[b-ylzwwvp8uk] {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background: var(--primary-soft);
    border: 2px solid var(--border-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #A5B4FC;
    font-size: 40px;
    overflow: hidden;
}

    .employee-form-photo img[b-ylzwwvp8uk] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
/* /Layout/Components/EmployeeScheduleManager.razor.rz.scp.css */
.sched[b-fhm7sb9yny] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sched-section[b-fhm7sb9yny] { padding: 18px 20px; }

.sched-head[b-fhm7sb9yny] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

    .sched-head h3[b-fhm7sb9yny] {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0;
        font-size: 15px;
        font-weight: 600;
        color: var(--text);
    }

    .sched-head h3 i[b-fhm7sb9yny] { color: #A5B4FC; }

/* ---- Escala ---- */
.sched-days[b-fhm7sb9yny] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sched-day[b-fhm7sb9yny] {
    display: grid;
    grid-template-columns: 130px 90px 1fr;
    align-items: center;
    gap: 14px;
    padding: 10px 14px;
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: var(--surface-2);
}

    .sched-day.folga[b-fhm7sb9yny] { opacity: 0.72; }

.sched-day-name[b-fhm7sb9yny] { font-weight: 600; color: var(--text); font-size: 14px; }

.sched-folga[b-fhm7sb9yny] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-muted);
    cursor: pointer;
    user-select: none;
}

.sched-folga input[b-fhm7sb9yny] { accent-color: var(--primary); width: 16px; height: 16px; }

.sched-times[b-fhm7sb9yny] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--text-muted);
    font-size: 13px;
}

.sched-folga-label[b-fhm7sb9yny] { color: var(--text-dim); font-size: 13px; font-style: italic; }

/* Inputs nativos de hora/data alinhados ao tema escuro */
.sched input[type="time"][b-fhm7sb9yny],
.sched input[type="datetime-local"][b-fhm7sb9yny],
.sched input[type="text"][b-fhm7sb9yny] {
    background: var(--surface);
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    color: var(--text);
    padding: 7px 10px;
    font-size: 13.5px;
    color-scheme: dark;
}

    .sched input:focus[b-fhm7sb9yny] { outline: none; border-color: var(--primary); }

/* ---- Bloqueios ---- */
.sched-add[b-fhm7sb9yny] { margin-bottom: 14px; }

.sched-add-row[b-fhm7sb9yny] {
    display: grid;
    grid-template-columns: 1fr 1fr 1.4fr;
    gap: 14px;
}

.sched-add-motivo input[b-fhm7sb9yny] { width: 100%; box-sizing: border-box; }

.sched-add-actions[b-fhm7sb9yny] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 12px;
}

.sched-blocks[b-fhm7sb9yny] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sched-block[b-fhm7sb9yny] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: var(--surface-2);
}

.sched-block-info[b-fhm7sb9yny] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.sched-block-when[b-fhm7sb9yny] { font-size: 13.5px; font-weight: 600; color: var(--text); }

.sched-block-motivo[b-fhm7sb9yny] { font-size: 12.5px; color: var(--text-muted); }

.btn-icon-danger[b-fhm7sb9yny] {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: #F87171;
    cursor: pointer;
    transition: all var(--t);
}

    .btn-icon-danger:hover[b-fhm7sb9yny] { background: var(--danger); color: #fff; border-color: var(--danger); }

.sched-empty[b-fhm7sb9yny] { color: var(--text-muted); font-size: 14px; padding: 8px 2px; }

.sched-msg[b-fhm7sb9yny] { margin-top: 12px; font-size: 13px; color: var(--secondary); }
.sched-msg-err[b-fhm7sb9yny] { color: #F87171; }

@media (max-width: 720px) {
    .sched-day[b-fhm7sb9yny] { grid-template-columns: 1fr; gap: 8px; }
    .sched-add-row[b-fhm7sb9yny] { grid-template-columns: 1fr; }
}
/* /Layout/Components/FilterMenuComponent.razor.rz.scp.css */
.filter-wrapper[b-0i2twp73f1] {
    position: relative;
    display: flex;
    align-items: center;
}

/* ---------- BOTÃO ---------- */
.filter-toggle[b-0i2twp73f1] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 16px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all var(--t);
}

    .filter-toggle:hover[b-0i2twp73f1] {
        color: var(--text);
        border-color: var(--border-strong);
    }

    .filter-toggle.open[b-0i2twp73f1] {
        color: #C7D2FE;
        border-color: var(--primary);
        background: var(--primary-soft);
    }

.filter-toggle i[b-0i2twp73f1] {
    font-size: 17px;
}

/* ---------- BACKDROP (fecha ao clicar fora) ---------- */
.filter-backdrop[b-0i2twp73f1] {
    position: fixed;
    inset: 0;
    z-index: 900;
}

/* ---------- PAINEL ---------- */
.filter-panel[b-0i2twp73f1] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: 340px;
    z-index: 901;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow);
    overflow: hidden;

    opacity: 0;
    transform: translateY(-6px) scale(0.98);
    transform-origin: top right;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}

    .filter-panel.active[b-0i2twp73f1] {
        opacity: 1;
        transform: translateY(0) scale(1);
        visibility: visible;
        pointer-events: auto;
    }

.filter-head[b-0i2twp73f1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
}

.filter-head-title[b-0i2twp73f1] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
}

.filter-clear[b-0i2twp73f1] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--t);
}

    .filter-clear:hover[b-0i2twp73f1] {
        background: var(--surface-2);
        color: var(--text);
    }

.filter-body[b-0i2twp73f1] {
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.filter-row[b-0i2twp73f1] {
    display: flex;
    gap: 12px;
}

    .filter-row > *[b-0i2twp73f1] {
        flex: 1;
        min-width: 0;
    }

.filter-foot[b-0i2twp73f1] {
    display: flex;
    gap: 10px;
    padding: 0 18px 16px;
}

.filter-btn[b-0i2twp73f1] {
    flex: 1;
    height: 40px;
    border-radius: 10px;
    border: none;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--t);
}

    .filter-btn.ghost[b-0i2twp73f1] {
        background: var(--surface-2);
        color: var(--text-muted);
    }

        .filter-btn.ghost:hover[b-0i2twp73f1] {
            color: var(--text);
            background: var(--surface-3);
        }

    .filter-btn.solid[b-0i2twp73f1] {
        background: var(--primary);
        color: #fff;
    }

        .filter-btn.solid:hover[b-0i2twp73f1] {
            background: var(--primary-strong);
        }

/* ---------- RESPONSIVO ---------- */
@media (max-width: 560px) {
    .filter-toggle-text[b-0i2twp73f1] {
        display: none;
    }

    .filter-toggle[b-0i2twp73f1] {
        padding: 0 12px;
    }

    .filter-panel[b-0i2twp73f1] {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        border-radius: var(--r-lg) var(--r-lg) 0 0;
        transform: translateY(100%);
    }

        .filter-panel.active[b-0i2twp73f1] {
            transform: translateY(0);
        }
}
/* /Layout/Components/FilterMudSelect.razor.rz.scp.css */
[b-vhrr2i09tu] .premium-filter-select {
    width: 100%;
}

/* O tema escuro do MudThemeProvider já trata cores/contraste.
   Aqui só reforçamos o arredondamento para casar com o design. */
[b-vhrr2i09tu] .premium-filter-select .mud-input-outlined-border {
    border-radius: 10px !important;
}
/* /Layout/Components/HistoryEditionContainer.razor.rz.scp.css */
/* Estrutura e inputs vêm das classes globais (.modal-*, .form-*) e do
   tema escuro do MudBlazor. Aqui só destacamos os campos somente-leitura. */
[b-mo4olomdq2] .mud-input.mud-readonly {
    opacity: 0.7;
}
/* /Layout/Components/KpiColumn.razor.rz.scp.css */
.kpi-chart[b-ibgm94f0z9] {
    width: 100%;
    min-width: 0;
}

/* Eixos legíveis no tema escuro */
[b-ibgm94f0z9] .mud-charts-xaxis text,
[b-ibgm94f0z9] .mud-charts-yaxis text {
    fill: var(--text-muted) !important;
    font-size: 11px;
    font-weight: 500;
}

/* Linhas de grade discretas */
[b-ibgm94f0z9] .mud-charts-grid line,
[b-ibgm94f0z9] .mud-chart-line {
    stroke: var(--border) !important;
}

/* Legenda */
[b-ibgm94f0z9] .mud-chart-legend .mud-typography {
    color: var(--text-muted) !important;
}
/* /Layout/Components/KpiPie.razor.rz.scp.css */
.kpi-chart[b-waxf0ad7wd] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 0;
}

/* Legenda e percentuais legíveis no tema escuro */
[b-waxf0ad7wd] .mud-chart-legend .mud-typography {
    color: var(--text-muted) !important;
}

[b-waxf0ad7wd] .mud-chart-legend-item {
    color: var(--text-muted) !important;
}

[b-waxf0ad7wd] svg text {
    fill: var(--text);
}
/* /Layout/Components/ServiceForm.razor.rz.scp.css */
/* Estrutura (.modal-*, .form-*, .btn-*) e inputs vêm das classes globais
   e do tema escuro do MudBlazor — este componente não precisa de CSS próprio. */
/* /Layout/Components/SettingsForm.razor.rz.scp.css */
.set2[b-8kdkwzeal2] {
    display: grid;
    grid-template-columns: 250px 1fr;
    gap: 22px;
    align-items: start;
}

/* ---------- Rail ---------- */
.set2-rail[b-8kdkwzeal2] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
    padding: 10px;
    position: sticky;
    top: 0;
}

.set2-tab[b-8kdkwzeal2] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: none;
    border-radius: var(--r);
    background: transparent;
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: all var(--t);
}

    .set2-tab i[b-8kdkwzeal2] { font-size: 17px; width: 20px; text-align: center; }

    .set2-tab:hover[b-8kdkwzeal2] { background: var(--surface-2); color: var(--text); }

    .set2-tab.active[b-8kdkwzeal2] {
        background: var(--primary-soft);
        color: #C7D2FE;
        box-shadow: inset 3px 0 0 var(--primary);
    }

/* ---------- Conteúdo ---------- */
.set2-content[b-8kdkwzeal2] { min-width: 0; }

.set2-card[b-8kdkwzeal2] { padding: 24px 26px; }

.set2-card-head[b-8kdkwzeal2] { margin-bottom: 22px; }

    .set2-card-head h3[b-8kdkwzeal2] { margin: 0; font-size: 18px; font-weight: 700; color: var(--text); }
    .set2-card-head p[b-8kdkwzeal2] { margin: 4px 0 0; font-size: 13px; color: var(--text-muted); }

.set2-fields[b-8kdkwzeal2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 24px;
}

    .set2-fields .form-field-wide[b-8kdkwzeal2] { grid-column: 1 / -1; }

.set2-foot[b-8kdkwzeal2] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
}

.set2-msg[b-8kdkwzeal2] { font-size: 13px; color: var(--secondary); }
.set2-msg-block[b-8kdkwzeal2] { margin-top: 18px; }

/* ---------- Identidade ---------- */
.set2-media[b-8kdkwzeal2] {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 24px;
}

.set2-media-item[b-8kdkwzeal2] { display: flex; flex-direction: column; gap: 8px; min-width: 0; }

.set2-media-box[b-8kdkwzeal2] {
    position: relative;
    height: 170px;
    border-radius: var(--r);
    background: var(--surface-2);
    border: 1px dashed var(--border-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-dim);
    font-size: 38px;
    overflow: hidden;
    transition: border-color var(--t);
}

    .set2-media-box:hover[b-8kdkwzeal2] { border-color: var(--primary); }

    .set2-media-box img[b-8kdkwzeal2] { width: 100%; height: 100%; object-fit: cover; }

.set2-media-btn[b-8kdkwzeal2] {
    position: absolute;
    bottom: 10px;
    right: 10px;
    height: 34px;
    padding: 0 12px;
    border-radius: 9px;
    background: rgba(17, 26, 46, 0.88);
    color: var(--text);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all var(--t);
}

    .set2-media-btn:hover[b-8kdkwzeal2] { background: var(--primary); color: #fff; }

/* ---------- Horários ---------- */
.set2-hours[b-8kdkwzeal2] { display: flex; flex-direction: column; gap: 8px; }

.set2-hour-row[b-8kdkwzeal2] {
    display: grid;
    grid-template-columns: 120px 92px 1fr;
    align-items: center;
    gap: 14px;
    padding: 11px 14px;
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: var(--surface-2);
}

    .set2-hour-row.fechado[b-8kdkwzeal2] { opacity: 0.7; }

.set2-hour-day[b-8kdkwzeal2] { font-weight: 600; color: var(--text); font-size: 14px; }

.set2-hour-closed[b-8kdkwzeal2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-muted);
    cursor: pointer;
    user-select: none;
}

    .set2-hour-closed input[b-8kdkwzeal2] { accent-color: var(--primary); width: 16px; height: 16px; }

.set2-hour-times[b-8kdkwzeal2] { display: flex; align-items: center; gap: 10px; color: var(--text-muted); font-size: 13px; }

.set2-hour-closed-lbl[b-8kdkwzeal2] { color: var(--text-dim); font-size: 13px; font-style: italic; }

.set2-hour-row input[type="time"][b-8kdkwzeal2] {
    background: var(--surface);
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    color: var(--text);
    padding: 7px 10px;
    font-size: 13.5px;
    color-scheme: dark;
}

    .set2-hour-row input[type="time"]:focus[b-8kdkwzeal2] { outline: none; border-color: var(--primary); }

/* ---------- Responsivo ---------- */
@media (max-width: 900px) {
    .set2[b-8kdkwzeal2] { grid-template-columns: 1fr; }
    .set2-rail[b-8kdkwzeal2] { flex-direction: row; flex-wrap: wrap; position: static; }
    .set2-tab[b-8kdkwzeal2] { flex: 1; justify-content: center; }
    .set2-tab span[b-8kdkwzeal2] { display: none; }
    .set2-fields[b-8kdkwzeal2] { grid-template-columns: 1fr; }
    .set2-media[b-8kdkwzeal2] { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    .set2-hour-row[b-8kdkwzeal2] { grid-template-columns: 1fr; gap: 8px; }
}
/* /Layout/Components/TableHistory.razor.rz.scp.css */
/* ============ CONTAINER ============ */
.form-container[b-y4my9c0m84] {
    width: 100%;
    box-sizing: border-box;
    background-color: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
    padding: 18px 18px 6px;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.table-header[b-y4my9c0m84] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 4px 14px;
    min-height: 24px;
}

h2[b-y4my9c0m84] {
    color: var(--text);
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}

.table-add-btn[b-y4my9c0m84] {
    height: 38px;
    padding: 0 16px;
    border: none;
    border-radius: 10px;
    background: var(--secondary);
    color: #04231A;
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    transition: all var(--t);
    box-shadow: 0 6px 16px -8px rgba(16, 185, 129, 0.6);
}

    .table-add-btn:hover[b-y4my9c0m84] {
        background: #0EA372;
        transform: translateY(-1px);
    }

    .table-add-btn i[b-y4my9c0m84] {
        font-size: 15px;
    }

.table-wrapper[b-y4my9c0m84] {
    width: 100%;
    flex: 1 1 auto;        /* preenche a altura do card quando ele estica */
    max-height: 62vh;
    overflow-x: auto;
    overflow-y: auto;
    border-radius: var(--r);
    -webkit-overflow-scrolling: touch;
}

table[b-y4my9c0m84] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
}

/* ============ CABEÇALHO ============ */
thead th[b-y4my9c0m84] {
    position: sticky;
    top: 0;
    z-index: 5;
    background-color: var(--surface-2);
    padding: 12px 14px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted);
    white-space: nowrap;
}

    thead th:first-child[b-y4my9c0m84] { border-top-left-radius: var(--r); }
    thead th:last-child[b-y4my9c0m84]  { border-top-right-radius: var(--r); }

.header-content[b-y4my9c0m84] {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Cabeçalho ordenável */
.th-sortable[b-y4my9c0m84] { padding: 0; }

.th-sort[b-y4my9c0m84] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 12px 14px;
    background: transparent;
    border: none;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted);
    transition: color var(--t);
}

    .th-sort:hover[b-y4my9c0m84] { color: var(--text); }

.th-sort-icon[b-y4my9c0m84] {
    font-size: 12px;
    opacity: 0;
    transition: opacity var(--t);
}

.th-sort:hover .th-sort-icon[b-y4my9c0m84] { opacity: 0.6; }

.th-sort.active[b-y4my9c0m84] { color: #C7D2FE; }

    .th-sort.active .th-sort-icon[b-y4my9c0m84] { opacity: 1; color: #A5B4FC; }

/* ============ LINHAS ============ */
tbody tr[b-y4my9c0m84] {
    transition: background var(--t);
}

    tbody tr:hover[b-y4my9c0m84] {
        background: var(--surface-2);
    }

tbody td[b-y4my9c0m84] {
    padding: 12px 14px;
    color: var(--text);
    vertical-align: middle;
    white-space: nowrap;
    text-align: left;
    border-bottom: 1px solid var(--border);
}

tbody tr:last-child td[b-y4my9c0m84] {
    border-bottom: none;
}

/* ============ STATUS (pílulas) ============ */
.status[b-y4my9c0m84] {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 4px 12px;
    min-width: 92px;
    border-radius: var(--r-pill);
    font-weight: 600;
    font-size: 12.5px;
    white-space: nowrap;
}

    .status.Realizado[b-y4my9c0m84] {
        background: var(--status-done-bg);
        color: var(--status-done-fg);
    }

    .status.Agendado[b-y4my9c0m84] {
        background: var(--status-pending-bg);
        color: var(--status-pending-fg);
    }

    .status.Cancelado[b-y4my9c0m84] {
        background: var(--status-cancel-bg);
        color: var(--status-cancel-fg);
    }

/* ============ AÇÕES ============ */
.acao[b-y4my9c0m84] {
    text-align: center;
}

.btn-edit[b-y4my9c0m84] {
    background: var(--surface-2);
    border: 1px solid var(--border);
    color: var(--text-muted);
    width: 34px;
    height: 34px;
    border-radius: 9px;
    font-size: 15px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all var(--t);
}

    .btn-edit:hover[b-y4my9c0m84] {
        color: #C7D2FE;
        border-color: var(--primary);
        background: var(--primary-soft);
    }

/* ============ RESPONSIVO ============ */
@media (max-width: 768px) {
    table[b-y4my9c0m84] {
        min-width: 640px;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* ============================ GRID DA PÁGINA ============================ */
.page[b-ret4laf6b0] {
    position: relative;
    display: grid;
    grid-template-areas:
        "sidebar header"
        "sidebar main";
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr;
    width: 100%;
    height: 100vh;
    background-color: var(--bg);
    overflow: hidden;
}

/* ============================ HEADER ============================ */
header[b-ret4laf6b0] {
    grid-area: header;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 16px 24px;
    background: var(--bg);
    border-bottom: 1px solid var(--border);
}

.header-menu-btn[b-ret4laf6b0] {
    display: none; /* desktop usa o toggle de dentro da sidebar; aqui só no mobile */
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text-muted);
    font-size: 20px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: all var(--t);
}

    .header-menu-btn:hover[b-ret4laf6b0] {
        color: var(--text);
        border-color: var(--border-strong);
    }

.header-logo[b-ret4laf6b0] {
    display: none; /* o logo vive na sidebar; escondido por padrão no header */
    align-items: center;
}

.header-metrics[b-ret4laf6b0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.header-metrics-cap[b-ret4laf6b0] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    color: var(--text-muted);
}

    .header-metrics-cap i[b-ret4laf6b0] { color: #A5B4FC; font-size: 13px; }
    .header-metrics-cap strong[b-ret4laf6b0] { color: var(--text); font-weight: 600; }

.header-cards[b-ret4laf6b0] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    min-width: 0;
}

.header-filter-area[b-ret4laf6b0] {
    position: relative;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.logo[b-ret4laf6b0] {
    height: 34px;
}

/* ============================ SIDEBAR ============================ */
.sidebar[b-ret4laf6b0] {
    grid-area: sidebar;
    width: 264px;
    height: 100vh;
    background-color: var(--surface);
    border-right: 1px solid var(--border);
    overflow: hidden;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 30;
}

    .sidebar.closed[b-ret4laf6b0] {
        width: 76px;
    }

.sidebar-scrim[b-ret4laf6b0] {
    display: none;
}

/* ============================ MAIN ============================ */
main[b-ret4laf6b0] {
    grid-area: main;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px;
    background-color: var(--bg);
    opacity: 0;
    animation: main-in-b-ret4laf6b0 0.4s ease-out forwards;
}

/* Apenas opacidade: NÃO usar transform aqui. Um transform (mesmo translateY(0))
   torna o <main> o bloco de contenção dos elementos position:fixed (modais),
   fazendo os pop-ups não cobrirem a viewport inteira. */
@keyframes main-in-b-ret4laf6b0 {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ============================ RESPONSIVO ============================ */
@media (max-width: 1100px) {
    .header-cards[b-ret4laf6b0] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .page[b-ret4laf6b0] {
        grid-template-areas:
            "header"
            "main";
        grid-template-columns: 1fr;
    }

    /* no mobile a sidebar vira drawer: precisa do gatilho no header */
    .header-menu-btn[b-ret4laf6b0] {
        display: flex;
    }

    .header-logo[b-ret4laf6b0] {
        display: flex;
        margin-right: auto; /* empurra o filtro para a direita */
    }

    /* O header quebra: 1ª linha [menu][logo][filtro], 2ª linha os KPIs */
    header[b-ret4laf6b0] {
        flex-wrap: wrap;
        row-gap: 14px;
    }

    .header-metrics[b-ret4laf6b0] {
        order: 3;
        flex-basis: 100%;
    }

    .sidebar[b-ret4laf6b0] {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        box-shadow: var(--shadow);
    }

        .sidebar.closed[b-ret4laf6b0] {
            width: 0;
            border-right: none;
        }

    .sidebar-scrim[b-ret4laf6b0] {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(2, 6, 23, 0.6);
        backdrop-filter: blur(1px);
        z-index: 20;
    }

    main[b-ret4laf6b0] {
        animation: none;
        opacity: 1;
    }
}

@media (max-width: 560px) {
    .header-cards[b-ret4laf6b0] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    header[b-ret4laf6b0] {
        padding: 12px 16px;
    }

    main[b-ret4laf6b0] {
        padding: 16px;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.nav[b-ran0u79ux3] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 18px 14px;
    box-sizing: border-box;
    gap: 18px;
    overflow: hidden;
}

/* Recolhida: cada item vira "content-width" e é centralizado de verdade
   no trilho de 76px (align-items no eixo cruzado da coluna). */
.nav.closed[b-ran0u79ux3] {
    align-items: center;
    padding-left: 0;
    padding-right: 0;
}

/* ---------- TOPO: logo + toggle ---------- */
/* Aberto: o recuo lateral (14px) iguala o padding interno dos .nav-item,
   alinhando logo, avatar, ícone da empresa e ícones do menu na mesma coluna. */
.nav-top[b-ran0u79ux3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 40px;
    flex-shrink: 0;
    padding-left: 14px;
    width: 100%;
}

.nav.closed .nav-top[b-ran0u79ux3] {
    width: auto;
    padding-left: 0;
}

.nav-logo[b-ran0u79ux3] {
    height: 30px;
}

.nav.closed .nav-logo[b-ran0u79ux3] {
    display: none;
}

.nav-toggle[b-ran0u79ux3] {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all var(--t);
}

    .nav-toggle:hover[b-ran0u79ux3] {
        color: var(--text);
        border-color: var(--border-strong);
        background: var(--surface-3);
    }

/* ---------- PERFIL ---------- */
.nav-profile[b-ran0u79ux3] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    padding-left: 14px;
    width: 100%;
}

.nav.closed .nav-profile[b-ran0u79ux3] {
    width: auto;
    padding-left: 0;
    gap: 0;
}

.nav-avatar[b-ran0u79ux3] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
    border: 2px solid var(--border-strong);
    flex-shrink: 0;
    background: var(--surface-2);
}

.nav.closed .nav-avatar[b-ran0u79ux3] {
    width: 44px;
    height: 44px;
}

.nav-profile-info[b-ran0u79ux3] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.nav.closed .nav-profile-info[b-ran0u79ux3] {
    display: none;
}

.nav-name[b-ran0u79ux3] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
}

.nav-role[b-ran0u79ux3] {
    font-size: 12px;
    color: var(--text-muted);
    white-space: nowrap;
}

/* ---------- ESTABELECIMENTO (linha clicável → Configurações) ---------- */
.nav-company[b-ran0u79ux3] {
    flex-shrink: 0;
    width: 100%;
}

.nav.closed .nav-company[b-ran0u79ux3] {
    display: none;
}

/* O <NavLink> é um componente filho: o atributo de escopo não chega ao <a>
   que ele renderiza, então as regras precisam de ::deep para aplicar. */
.nav-company[b-ran0u79ux3]  .company-link {
    display: flex;
    align-items: center;
    gap: 11px;
    width: 100%;
    box-sizing: border-box;
    padding: 9px 11px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text);
    text-decoration: none;
    transition: all var(--t);
}

    .nav-company[b-ran0u79ux3]  .company-link:hover {
        border-color: var(--primary);
        background: var(--surface-3);
    }

    .nav-company[b-ran0u79ux3]  .company-link.active {
        border-color: var(--primary);
        background: var(--primary-soft);
    }

.nav-company[b-ran0u79ux3]  .company-shop {
    flex-shrink: 0;
    font-size: 18px;
    color: #A5B4FC;
}

.nav-company[b-ran0u79ux3]  .company-text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    flex: 1;
}

.nav-company[b-ran0u79ux3]  .company-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
    line-height: 1.2;
    /* Quebra por palavras, sem cortar no meio nem usar reticências. */
    white-space: normal;
    overflow-wrap: break-word;
}

.nav-company[b-ran0u79ux3]  .company-edit {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11.5px;
    color: var(--text-muted);
}

    .nav-company[b-ran0u79ux3]  .company-edit i { font-size: 11px; }

.nav-company[b-ran0u79ux3]  .company-chevron {
    flex-shrink: 0;
    font-size: 13px;
    color: var(--text-dim);
}

.nav-company[b-ran0u79ux3]  .company-link:hover .company-chevron { color: #A5B4FC; }

/* ---------- DIVISOR ---------- */
.nav-divider[b-ran0u79ux3] {
    height: 1px;
    background: var(--border);
    flex-shrink: 0;
    width: 100%;
    align-self: stretch;
}

.nav.closed .nav-divider[b-ran0u79ux3] {
    width: 44px;
    align-self: center;
}

/* ---------- LINKS ---------- */
.nav-links[b-ran0u79ux3] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    width: 100%;
}

.nav.closed .nav-links[b-ran0u79ux3] {
    width: auto;
    flex: 0 0 auto;
}

/* ---------- ITENS DE NAVEGAÇÃO ---------- */
/* Renderizados pelo NavLinkComponent (<NavLink>), então estilizados via ::deep
   a partir de .nav-links — o escopo isolado não alcança o <a> do componente filho. */
.nav-links[b-ran0u79ux3]  .nav-item {
    display: flex;
    align-items: center;
    gap: 14px;
    height: 46px;
    padding: 0 14px;
    border-radius: 12px;
    color: var(--text-muted);
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--t), color var(--t);
}

    .nav-links[b-ran0u79ux3]  .nav-item:hover {
        background: var(--surface-2);
        color: var(--text);
    }

    .nav-links[b-ran0u79ux3]  .nav-item.active {
        background: var(--primary-soft);
        color: #C7D2FE;
        font-weight: 600;
        box-shadow: inset 3px 0 0 var(--primary);
    }

.nav-links[b-ran0u79ux3]  .nav-item-icon {
    font-size: 20px;
    flex-shrink: 0;
    width: 22px;
    text-align: center;
}

.nav-links[b-ran0u79ux3]  .nav-item-label {
    font-size: 15px;
    overflow: hidden;
}

/* Recolhido: ícones centralizados em quadrados de 44px, sem rótulo. */
.nav-links[b-ran0u79ux3]  .nav-item.closed {
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    gap: 0;
}

    .nav-links[b-ran0u79ux3]  .nav-item.closed .nav-item-label {
        display: none;
    }

/* MudSelect (empresa) — tema escuro nativo do MudThemeProvider */
[b-ran0u79ux3] .company-select {
    flex: 1;
    min-width: 0;
}

    [b-ran0u79ux3] .company-select .mud-input-slot {
        font-size: 14px;
    }
/* /Pages/Calendar.razor.rz.scp.css */
.calendar-page[b-xy5hlaoj5a] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ============================ TOOLBAR ============================ */
/* (estilizada aqui porque o CSS scoped do History não alcança esta página) */
.calendar-toolbar[b-xy5hlaoj5a] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
    padding: 14px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

/* Navegação de semana: « [Semana de dd/mm a dd/mm] » */
.cal-week-nav[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cal-nav-btn[b-xy5hlaoj5a] {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    transition: all var(--t);
}

    .cal-nav-btn:hover[b-xy5hlaoj5a] {
        color: var(--text);
        border-color: var(--border-strong);
        background: var(--surface-3);
    }

/* Rótulo central clicável (volta para a semana atual) */
.cal-week-label[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 38px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text);
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: all var(--t);
}

    .cal-week-label i[b-xy5hlaoj5a] {
        color: var(--text-muted);
        transition: color var(--t);
    }

    .cal-week-label:hover[b-xy5hlaoj5a] {
        border-color: var(--primary);
        color: #C7D2FE;
    }

        .cal-week-label:hover i[b-xy5hlaoj5a] {
            color: #C7D2FE;
        }

.calendar-controls[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.cal-range[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 8px;
}

    .cal-range[b-xy5hlaoj5a]  .mud-input-control {
        width: 104px;
    }

.calendar-filter[b-xy5hlaoj5a] {
    min-width: 210px;
}

    .calendar-filter[b-xy5hlaoj5a]  .mud-input-control {
        min-width: 210px;
    }

/* ============================ GRID ============================ */
.cal[b-xy5hlaoj5a] {
    --cal-row: 84px;
    --cal-gutter: 64px;
    background-color: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

/* Cabeçalho */
.cal-grid-head[b-xy5hlaoj5a] {
    display: flex;
}

.cal-corner[b-xy5hlaoj5a] {
    width: var(--cal-gutter);
    flex-shrink: 0;
    background-color: var(--surface-2);
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.cal-day-head[b-xy5hlaoj5a] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    padding: 8px 4px;
    background-color: var(--surface-2);
    border-bottom: 1px solid var(--border);
    border-right: 1px solid var(--border);
}

    .cal-day-head:last-child[b-xy5hlaoj5a] {
        border-right: none;
    }

    .cal-day-head.today[b-xy5hlaoj5a] {
        background-color: var(--primary-soft);
    }

.cal-day-name[b-xy5hlaoj5a] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted);
}

.cal-day-num[b-xy5hlaoj5a] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
}

.cal-day-head.today .cal-day-num[b-xy5hlaoj5a] {
    color: #C7D2FE;
}

/* Corpo */
.cal-grid-body[b-xy5hlaoj5a] {
    display: flex;
}

.cal-gutter[b-xy5hlaoj5a] {
    width: var(--cal-gutter);
    flex-shrink: 0;
}

.cal-hour-label[b-xy5hlaoj5a] {
    height: var(--cal-row);
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 6px;
    font-size: 12px;
    color: var(--text-muted);
    border-top: 1px solid var(--border);
    border-right: 1px solid var(--border);
}

.cal-col[b-xy5hlaoj5a] {
    flex: 1;
    min-width: 0;
    position: relative;
    border-right: 1px solid var(--border);
}

    .cal-col:last-child[b-xy5hlaoj5a] {
        border-right: none;
    }

.cal-slot[b-xy5hlaoj5a] {
    height: var(--cal-row);
    box-sizing: border-box;
    border-top: 1px solid var(--border);
    cursor: pointer;
    transition: background-color var(--t);
}

    .cal-slot:hover[b-xy5hlaoj5a] {
        background-color: var(--surface-2);
    }

    .cal-slot:focus-visible[b-xy5hlaoj5a] {
        outline: 2px solid var(--primary);
        outline-offset: -2px;
        background-color: var(--surface-2);
    }

/* Linha "agora" na coluna de hoje */
.cal-now-line[b-xy5hlaoj5a] {
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    border-top: 2px solid #F87171;
    z-index: 40;
    pointer-events: none;
}

.cal-now-dot[b-xy5hlaoj5a] {
    position: absolute;
    left: -4px;
    top: -4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #F87171;
}

/* Evento — posicionado de forma absoluta (top/height/left/width inline)
   conforme horário, duração real e coluna de sobreposição. */
.cal-event[b-xy5hlaoj5a] {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 3px 7px;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(99,102,241,0.97), rgba(79,70,229,0.97));
    border-left: 3px solid var(--secondary);
    color: #fff;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: filter var(--t);
    line-height: 1.2;
}

    /* hover: clareia e traz à frente (mostra o card inteiro nos horários divididos) */
    .cal-event:hover[b-xy5hlaoj5a] {
        filter: brightness(1.1);
        z-index: 60 !important;
    }

    .cal-event:focus-visible[b-xy5hlaoj5a] {
        outline: 2px solid #fff;
        outline-offset: 1px;
        filter: brightness(1.1);
        z-index: 60 !important;
    }

.cal-event-time[b-xy5hlaoj5a] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.01em;
    opacity: 0.9;
}

.cal-event-client[b-xy5hlaoj5a] {
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cal-event-service[b-xy5hlaoj5a],
.cal-event-func[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .cal-event-service > i[b-xy5hlaoj5a],
    .cal-event-func > i[b-xy5hlaoj5a] {
        font-size: 9px;
        flex-shrink: 0;
        opacity: 0.8;
    }

.cal-event-service[b-xy5hlaoj5a] {
    opacity: 0.95;
}

.cal-event-func[b-xy5hlaoj5a] {
    opacity: 0.85;
}

/* Variações por status */
.cal-event.status-realizado[b-xy5hlaoj5a] {
    background: linear-gradient(135deg, rgba(16,185,129,0.95), rgba(5,150,105,0.95));
    border-left-color: #34D399;
}

.cal-event.status-confirmado[b-xy5hlaoj5a] {
    border-left-color: #34D399;
}

.cal-event.status-agendado[b-xy5hlaoj5a] {
    border-left-color: var(--warning);
}

/* Bloco agrupado: vários agendamentos no mesmo horário */
.cal-group[b-xy5hlaoj5a] {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 10px;
    border-radius: 9px;
    background: linear-gradient(135deg, var(--surface-3), var(--surface-2));
    border: 1px solid var(--border-strong);
    border-left: 3px solid var(--primary);
    color: var(--text);
    overflow: hidden;
    cursor: pointer;
    box-shadow: var(--shadow-sm);
    transition: filter var(--t), border-color var(--t);
}

    .cal-group:hover[b-xy5hlaoj5a] { border-color: var(--primary); filter: brightness(1.06); z-index: 60 !important; }

    .cal-group:focus-visible[b-xy5hlaoj5a] { outline: 2px solid var(--primary); outline-offset: 1px; z-index: 60 !important; }

.cal-group-count[b-xy5hlaoj5a] {
    flex-shrink: 0;
    min-width: 24px;
    height: 22px;
    padding: 0 6px;
    border-radius: 7px;
    background: var(--primary);
    color: #fff;
    font-size: 12.5px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cal-group-lbl[b-xy5hlaoj5a] { font-size: 12px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.cal-group-time[b-xy5hlaoj5a] { margin-left: auto; font-size: 11px; color: var(--text-muted); white-space: nowrap; flex-shrink: 0; }

/* Modal: escolher um agendamento do grupo */
.cal-chooser[b-xy5hlaoj5a] { max-width: 470px; }

.cal-chooser-list[b-xy5hlaoj5a] { display: flex; flex-direction: column; gap: 8px; }

.cal-chooser-item[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 14px;
    border: 1px solid var(--border);
    border-left: 3px solid var(--primary);
    border-radius: 10px;
    background: var(--surface-2);
    cursor: pointer;
    text-align: left;
    transition: all var(--t);
}

    .cal-chooser-item:hover[b-xy5hlaoj5a] { border-color: var(--primary); background: var(--surface-3); }

    .cal-chooser-item.status-realizado[b-xy5hlaoj5a] { border-left-color: #34D399; }
    .cal-chooser-item.status-agendado[b-xy5hlaoj5a] { border-left-color: var(--warning); }

.cal-chooser-time[b-xy5hlaoj5a] { flex-shrink: 0; width: 100px; font-size: 13px; font-weight: 700; color: #C7D2FE; }

.cal-chooser-info[b-xy5hlaoj5a] { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }

.cal-chooser-client[b-xy5hlaoj5a] { font-weight: 600; color: var(--text); font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.cal-chooser-svc[b-xy5hlaoj5a] { font-size: 12.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.cal-chooser-item > i[b-xy5hlaoj5a] { color: var(--text-dim); flex-shrink: 0; }

/* ---------- MODAL: extras ---------- */
.cal-slot-info[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: var(--r-sm);
    background: var(--primary-soft);
    color: #C7D2FE;
    font-size: 14px;
    font-weight: 600;
}

.cal-error[b-xy5hlaoj5a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 14px;
    border-radius: var(--r-sm);
    background: var(--danger-soft);
    color: #F87171;
    font-size: 13px;
    font-weight: 500;
}

@media (max-width: 760px) {
    .calendar-toolbar[b-xy5hlaoj5a] {
        flex-direction: column;
        align-items: stretch;
    }

    .calendar-controls[b-xy5hlaoj5a] {
        justify-content: space-between;
    }
}
/* /Pages/Clients.razor.rz.scp.css */
.clients-page[b-fw9rj3ij0d] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: 100%;
    min-height: 0;
}

.clients-layout[b-fw9rj3ij0d] {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 20px;
    align-items: stretch;
    flex: 1;
    min-height: 0;
}

/* ============ LISTA ============ */
.clients-list[b-fw9rj3ij0d] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

.clients-search[b-fw9rj3ij0d] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
    color: var(--text-muted);
}

    .clients-search input[b-fw9rj3ij0d] {
        flex: 1;
        min-width: 0;
        background: transparent;
        border: none;
        outline: none;
        color: var(--text);
        font-size: 14px;
    }

    .clients-search input[b-fw9rj3ij0d]::placeholder { color: var(--text-dim); }

.clients-items[b-fw9rj3ij0d] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.clients-item[b-fw9rj3ij0d] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    text-align: left;
    transition: background var(--t);
}

    .clients-item:hover[b-fw9rj3ij0d] { background: var(--surface-2); }

    .clients-item.active[b-fw9rj3ij0d] {
        background: var(--primary-soft);
        box-shadow: inset 3px 0 0 var(--primary);
    }

.clients-item-info[b-fw9rj3ij0d] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.clients-item-name[b-fw9rj3ij0d] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.clients-item-sub[b-fw9rj3ij0d] { font-size: 12px; color: var(--text-muted); }

.clients-noresult[b-fw9rj3ij0d],
.clients-empty[b-fw9rj3ij0d],
.clients-empty-full[b-fw9rj3ij0d] {
    padding: 24px;
    color: var(--text-muted);
    text-align: center;
    font-size: 14px;
}

.clients-empty-full[b-fw9rj3ij0d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 60px 24px;
    background: var(--surface);
    border: 1px dashed var(--border-strong);
    border-radius: var(--r-lg);
}

    .clients-empty-full i[b-fw9rj3ij0d] { font-size: 32px; color: var(--text-dim); }

/* ============ AVATAR ============ */
.clients-avatar[b-fw9rj3ij0d] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 15px;
    background: var(--primary-soft);
    color: #A5B4FC;
}

    .clients-avatar.lg[b-fw9rj3ij0d] { width: 60px; height: 60px; font-size: 22px; }

/* ============ DETALHE ============ */
.clients-detail[b-fw9rj3ij0d] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
}

.client-head[b-fw9rj3ij0d] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
}

.client-head-info[b-fw9rj3ij0d] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }

.client-head-name[b-fw9rj3ij0d] { font-size: 19px; font-weight: 700; color: var(--text); }

.client-head-contacts[b-fw9rj3ij0d] {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 13px;
    color: var(--text-muted);
}

    .client-head-contacts i[b-fw9rj3ij0d] { color: var(--text-dim); margin-right: 4px; }

.client-head-nocontact[b-fw9rj3ij0d] { color: var(--text-dim); font-style: italic; }

.client-head-tag[b-fw9rj3ij0d] {
    align-self: flex-start;
    margin-top: 2px;
    padding: 2px 10px;
    border-radius: var(--r-pill);
    background: var(--surface-2);
    border: 1px solid var(--border);
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-muted);
}

.client-kpis[b-fw9rj3ij0d] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

    /* Garante que valores monetários longos não vazem do card */
    .client-kpis[b-fw9rj3ij0d]  .kpi-value {
        font-size: 20px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.client-next[b-fw9rj3ij0d] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    font-size: 14px;
    color: #C7D2FE;
}

    .client-next i[b-fw9rj3ij0d] { font-size: 17px; color: #A5B4FC; }

.client-history[b-fw9rj3ij0d] { padding: 18px; }

.client-history-title[b-fw9rj3ij0d] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
}

.client-history-wrap[b-fw9rj3ij0d] { overflow-x: auto; }

.client-history table[b-fw9rj3ij0d] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
}

.client-history thead th[b-fw9rj3ij0d] {
    position: sticky;
    top: 0;
    background: var(--surface-2);
    padding: 10px 12px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted);
    white-space: nowrap;
}

.client-history tbody td[b-fw9rj3ij0d] {
    padding: 10px 12px;
    color: var(--text);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.client-history tbody tr:last-child td[b-fw9rj3ij0d] { border-bottom: none; }

/* Pílulas de status (CSS scoped não alcança esta página, então redeclaramos) */
.status[b-fw9rj3ij0d] {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 3px 10px;
    min-width: 86px;
    border-radius: var(--r-pill);
    font-weight: 600;
    font-size: 12px;
}

    .status.Realizado[b-fw9rj3ij0d] { background: var(--status-done-bg); color: var(--status-done-fg); }
    .status.Agendado[b-fw9rj3ij0d] { background: var(--status-pending-bg); color: var(--status-pending-fg); }
    .status.Confirmado[b-fw9rj3ij0d] { background: var(--status-pending-bg); color: var(--status-pending-fg); }
    .status.Cancelado[b-fw9rj3ij0d] { background: var(--status-cancel-bg); color: var(--status-cancel-fg); }

@media (max-width: 980px) {
    /* Empilha e volta à altura natural (rolagem da página, não interna) */
    .clients-page[b-fw9rj3ij0d] { height: auto; }
    .clients-layout[b-fw9rj3ij0d] { grid-template-columns: 1fr; flex: none; }
    .clients-detail[b-fw9rj3ij0d] { overflow-y: visible; }
    .clients-items[b-fw9rj3ij0d] { max-height: 60vh; }
    .client-kpis[b-fw9rj3ij0d] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .client-kpis[b-fw9rj3ij0d] { grid-template-columns: 1fr; }
}
/* /Pages/Employees.razor.rz.scp.css */
.emp-page[b-pcq5cnkdyp] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ---------- layout mestre-detalhe ---------- */
.emp-layout[b-pcq5cnkdyp] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 20px;
    align-items: start;
}

/* ---------- lista de funcionários ---------- */
.emp-list[b-pcq5cnkdyp] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.emp-list-item[b-pcq5cnkdyp] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
    font: inherit;
    cursor: pointer;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r);
    padding: 12px 14px;
    transition: all var(--t);
    min-width: 0;
}

    .emp-list-item:hover[b-pcq5cnkdyp] {
        border-color: var(--border-strong);
        background: var(--surface-2);
    }

    .emp-list-item.active[b-pcq5cnkdyp] {
        border-color: var(--primary);
        background: var(--primary-soft);
        box-shadow: inset 3px 0 0 var(--primary);
    }

.emp-list-info[b-pcq5cnkdyp] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.emp-list-name[b-pcq5cnkdyp] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.emp-list-role[b-pcq5cnkdyp] {
    font-size: 12px;
    color: var(--text-muted);
}

/* ---------- avatar ---------- */
.emp-avatar[b-pcq5cnkdyp] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--border-strong);
    background: var(--surface-2);
    color: #C7D2FE;
    font-weight: 700;
    font-size: 16px;
}

    .emp-avatar.ph[b-pcq5cnkdyp] {
        background: var(--primary-soft);
        border-color: transparent;
    }

    .emp-avatar img[b-pcq5cnkdyp] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .emp-avatar.lg[b-pcq5cnkdyp] {
        width: 64px;
        height: 64px;
        font-size: 24px;
    }

/* ---------- detalhe ---------- */
.emp-detail[b-pcq5cnkdyp] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}

.emp-empty[b-pcq5cnkdyp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 320px;
    color: var(--text-muted);
    background: var(--surface);
    border: 1px dashed var(--border-strong);
    border-radius: var(--r-lg);
    font-size: 15px;
}

.emp-empty-full[b-pcq5cnkdyp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 320px;
    color: var(--text-muted);
    background: var(--surface);
    border: 1px dashed var(--border-strong);
    border-radius: var(--r-lg);
}

    .emp-empty-full i[b-pcq5cnkdyp] {
        font-size: 36px;
        opacity: 0.6;
    }

/* cabeçalho do detalhe */
.panel.emp-head[b-pcq5cnkdyp] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    flex-wrap: wrap;
}

.emp-head-info[b-pcq5cnkdyp] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.emp-head-name[b-pcq5cnkdyp] {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
}

.emp-head-role[b-pcq5cnkdyp] {
    align-self: flex-start;
    font-size: 11.5px;
    font-weight: 600;
    color: #C7D2FE;
    background: var(--primary-soft);
    padding: 2px 10px;
    border-radius: var(--r-pill);
}

.emp-head-email[b-pcq5cnkdyp] {
    font-size: 13px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 6px;
}

.emp-head-actions[b-pcq5cnkdyp] {
    display: flex;
    gap: 10px;
    margin-left: auto;
    flex-wrap: wrap;
}

/* Abas do detalhe (Desempenho / Escala) */
.emp-tabs[b-pcq5cnkdyp] {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--border);
}

.emp-tab[b-pcq5cnkdyp] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 10px 16px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--t);
}

    .emp-tab:hover[b-pcq5cnkdyp] { color: var(--text); }

    .emp-tab.active[b-pcq5cnkdyp] {
        color: #C7D2FE;
        border-bottom-color: var(--primary);
    }

/* seletor de período */
.emp-period[b-pcq5cnkdyp] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.emp-period-btn[b-pcq5cnkdyp] {
    height: 34px;
    padding: 0 14px;
    border-radius: var(--r-pill);
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-muted);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--t);
}

    .emp-period-btn:hover[b-pcq5cnkdyp] {
        color: var(--text);
        border-color: var(--border-strong);
    }

    .emp-period-btn.active[b-pcq5cnkdyp] {
        background: var(--primary-soft);
        border-color: var(--primary);
        color: #C7D2FE;
    }

/* KPIs — linha 1: Faturamento + Ticket (largos); linha 2: Atendimentos + Conclusão + Cancelados */
.emp-kpis-2[b-pcq5cnkdyp] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.emp-kpis-3[b-pcq5cnkdyp] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}

    .emp-kpis-2[b-pcq5cnkdyp]  .kpi-value,
    .emp-kpis-3[b-pcq5cnkdyp]  .kpi-value {
        font-size: 19px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

/* Linha inferior: serviços mais feitos + próximos (mesma altura) */
.emp-bottom[b-pcq5cnkdyp] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    align-items: stretch;
}

.panel.emp-svc[b-pcq5cnkdyp],
.panel.emp-next[b-pcq5cnkdyp] {
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
}

/* Distribui as barras para preencher a altura do painel (sem espaço vazio embaixo) */
.emp-svc .emp-rankbars[b-pcq5cnkdyp] {
    flex: 1;
    justify-content: space-between;
    gap: 14px;
}

.emp-panel-title[b-pcq5cnkdyp] {
    margin: 0 0 14px;
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: 8px;
}

    .emp-panel-title i[b-pcq5cnkdyp] { color: #A5B4FC; }

.emp-next-empty[b-pcq5cnkdyp] {
    color: var(--text-muted);
    font-size: 14px;
    padding: 8px 0;
}

/* Serviços mais feitos (barras) */
.emp-rankbars[b-pcq5cnkdyp] { display: flex; flex-direction: column; gap: 12px; }

.emp-rankbar[b-pcq5cnkdyp] { display: grid; grid-template-columns: 120px 1fr 30px; align-items: center; gap: 12px; }

.emp-rankbar-name[b-pcq5cnkdyp] { font-size: 13px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.emp-rankbar-track[b-pcq5cnkdyp] { height: 11px; border-radius: var(--r-pill); background: var(--surface-2); overflow: hidden; }

.emp-rankbar-fill[b-pcq5cnkdyp] { height: 100%; border-radius: var(--r-pill); background: linear-gradient(90deg, var(--primary), #818CF8); }

.emp-rankbar-val[b-pcq5cnkdyp] { font-size: 13px; font-weight: 700; color: var(--text); text-align: right; }

/* Próximos atendimentos (lista com chip de horário) */
.emp-next-list[b-pcq5cnkdyp] { display: flex; flex-direction: column; }

.emp-next-row[b-pcq5cnkdyp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--border);
}

    .emp-next-row:last-child[b-pcq5cnkdyp] { border-bottom: none; }

.emp-next-time[b-pcq5cnkdyp] {
    flex-shrink: 0;
    width: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 5px 0;
    border-radius: 9px;
    background: var(--primary-soft);
}

.emp-next-day[b-pcq5cnkdyp] { font-size: 10.5px; color: #A5B4FC; font-weight: 600; }
.emp-next-hour[b-pcq5cnkdyp] { font-size: 13px; font-weight: 700; color: #C7D2FE; }

.emp-next-info[b-pcq5cnkdyp] { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }

.emp-next-client[b-pcq5cnkdyp] { color: var(--text); font-weight: 600; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.emp-next-svc[b-pcq5cnkdyp] { color: var(--text-muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.emp-next-price[b-pcq5cnkdyp] { flex-shrink: 0; font-weight: 700; color: var(--secondary); font-size: 13.5px; }

.emp-confirm[b-pcq5cnkdyp] {
    max-width: 440px;
}

/* ---------- responsivo ---------- */
@media (max-width: 900px) {
    .emp-layout[b-pcq5cnkdyp] {
        grid-template-columns: 1fr;
    }

    .emp-list[b-pcq5cnkdyp] {
        flex-direction: row;
        overflow-x: auto;
        padding-bottom: 4px;
    }

        .emp-list .emp-list-item[b-pcq5cnkdyp] {
            min-width: 200px;
        }

    .emp-bottom[b-pcq5cnkdyp] {
        grid-template-columns: 1fr;
    }

    .emp-svc .emp-rankbars[b-pcq5cnkdyp] { justify-content: flex-start; }
}
/* /Pages/General.razor.rz.scp.css */
.dash2[b-5my1lesskh] {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

/* ---------- Saudação ---------- */
.dash2-greet[b-5my1lesskh] { display: flex; align-items: center; justify-content: space-between; }

.dash2-hi[b-5my1lesskh] {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -0.01em;
}

    .dash2-hi span[b-5my1lesskh] { color: #A5B4FC; }

.dash2-sub[b-5my1lesskh] {
    margin: 4px 0 0;
    font-size: 13.5px;
    color: var(--text-muted);
    text-transform: capitalize;
}

/* ---------- HOJE (hero) ---------- */
.today[b-5my1lesskh] {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 1px;
    border-radius: var(--r-lg);
    overflow: hidden;
    background: var(--border);
    box-shadow: var(--shadow);
}

.today-main[b-5my1lesskh] {
    padding: 24px 28px;
    background:
        radial-gradient(1200px 200px at 0% 0%, rgba(99, 102, 241, 0.35), transparent 60%),
        linear-gradient(135deg, #1E2A52, #141C36);
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.today-eyebrow[b-5my1lesskh] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #C7D2FE;
}

.today-stats[b-5my1lesskh] { display: flex; align-items: center; gap: 22px; }

.today-stat[b-5my1lesskh] { display: flex; flex-direction: column; gap: 2px; }

.today-num[b-5my1lesskh] { font-size: 30px; font-weight: 800; color: #fff; line-height: 1; letter-spacing: -0.02em; }

.today-lbl[b-5my1lesskh] { font-size: 12.5px; color: #AEB9D6; }

.today-divider[b-5my1lesskh] { width: 1px; align-self: stretch; background: rgba(255, 255, 255, 0.12); }

.today-next[b-5my1lesskh] {
    padding: 24px 26px;
    background: linear-gradient(135deg, #6366F1, #4F46E5);
    display: flex;
    flex-direction: column;
    gap: 4px;
    position: relative;
}

.today-next-lbl[b-5my1lesskh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.today-next-time[b-5my1lesskh] { font-size: 26px; font-weight: 800; color: #fff; line-height: 1.1; }

.today-next-name[b-5my1lesskh] { font-size: 15px; font-weight: 600; color: #fff; }

.today-next-svc[b-5my1lesskh] { font-size: 13px; color: rgba(255, 255, 255, 0.82); }

.today-cta[b-5my1lesskh] {
    margin-top: auto;
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 16px;
    border: none;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background var(--t);
}

    .today-cta:hover[b-5my1lesskh] { background: rgba(255, 255, 255, 0.28); }

/* ---------- KPIs do dia ---------- */
.daily[b-5my1lesskh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.daily-card[b-5my1lesskh] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
}

.daily-icon[b-5my1lesskh] {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
}

    .daily-icon.amber[b-5my1lesskh] { background: rgba(250, 204, 21, 0.14); color: var(--warning); }
    .daily-icon.emerald[b-5my1lesskh] { background: var(--secondary-soft); color: #6EE7B7; }
    .daily-icon.rose[b-5my1lesskh] { background: var(--danger-soft); color: #F87171; }

.daily-body[b-5my1lesskh] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.daily-num[b-5my1lesskh] { font-size: 24px; font-weight: 800; color: var(--text); line-height: 1; }
.daily-lbl[b-5my1lesskh] { font-size: 13px; color: var(--text-muted); }

/* ---------- Coluna esquerda (indicadores + serviços) ---------- */
.dash-left[b-5my1lesskh] { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

/* ---------- Insights ---------- */
.insights[b-5my1lesskh] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.insights-2x2[b-5my1lesskh] { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.insight[b-5my1lesskh] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
}

.insight-body[b-5my1lesskh] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }

.insight-num[b-5my1lesskh] { font-size: 22px; font-weight: 700; color: var(--text); line-height: 1; }

    .insight-num small[b-5my1lesskh] { font-size: 13px; font-weight: 600; color: var(--text-muted); }

.insight-lbl[b-5my1lesskh] { font-size: 13px; font-weight: 500; color: var(--text-muted); }

.insight-desc[b-5my1lesskh] { font-size: 12px; color: var(--text-dim); }

.insight-icon[b-5my1lesskh] {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
}

    .insight-icon.indigo[b-5my1lesskh] { background: var(--primary-soft); color: #A5B4FC; }
    .insight-icon.emerald[b-5my1lesskh] { background: var(--secondary-soft); color: #6EE7B7; }
    .insight-icon.amber[b-5my1lesskh] { background: rgba(250, 204, 21, 0.14); color: var(--warning); }
    .insight-icon.down[b-5my1lesskh] { background: var(--danger-soft); color: #F87171; }

/* Anel de progresso (taxa de conclusão) */
.ring[b-5my1lesskh] {
    flex-shrink: 0;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: conic-gradient(var(--secondary) calc(var(--p) * 1%), var(--surface-3) 0);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

    .ring[b-5my1lesskh]::before {
        content: "";
        position: absolute;
        inset: 6px;
        border-radius: 50%;
        background: var(--surface);
    }

.ring-val[b-5my1lesskh] { position: relative; font-size: 14px; font-weight: 700; color: var(--text); }

/* ---------- Painéis com gráfico/lista ---------- */
.panel-head[b-5my1lesskh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}

    .panel-head h3[b-5my1lesskh] {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0;
        font-size: 15px;
        font-weight: 600;
        color: var(--text);
    }

    .panel-head h3 i[b-5my1lesskh] { color: #A5B4FC; }

.panel-link[b-5my1lesskh] {
    background: transparent;
    border: none;
    color: #A5B4FC;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

    .panel-link:hover[b-5my1lesskh] { color: #C7D2FE; }

.d-panel[b-5my1lesskh] { padding: 18px 20px; display: flex; flex-direction: column; }

.d-empty[b-5my1lesskh] { color: var(--text-muted); font-size: 14px; padding: 18px 2px; }

.dash2-cols[b-5my1lesskh] {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 20px;
    align-items: stretch;
}

.dash2-cols > *[b-5my1lesskh] { min-width: 0; }

/* ---------- Serviços mais procurados (mini barras coloridas) ---------- */
.svc-mini[b-5my1lesskh] { flex: 1; }

.minibars[b-5my1lesskh] { display: flex; flex-direction: column; gap: 9px; margin-top: 4px; }

.minibar[b-5my1lesskh] { display: grid; grid-template-columns: 110px 1fr 28px; align-items: center; gap: 10px; }

.minibar-name[b-5my1lesskh] { font-size: 12.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.minibar-track[b-5my1lesskh] { height: 8px; border-radius: var(--r-pill); background: var(--surface-2); overflow: hidden; }

.minibar-fill[b-5my1lesskh] { height: 100%; border-radius: var(--r-pill); }

.minibar-val[b-5my1lesskh] { font-size: 12.5px; font-weight: 700; color: var(--text); text-align: right; }

/* ---------- Movimento por dia da semana (barras verticais) ---------- */
.weekbars[b-5my1lesskh] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
    align-items: end;
    height: 200px;
    margin-top: 8px;
}

.weekbar[b-5my1lesskh] { display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; justify-content: flex-end; }

.weekbar-val[b-5my1lesskh] { font-size: 12px; font-weight: 700; color: var(--text-muted); }

.weekbar-track[b-5my1lesskh] { width: 60%; max-width: 34px; flex: 1; display: flex; align-items: flex-end; }

.weekbar-fill[b-5my1lesskh] {
    width: 100%;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(180deg, #818CF8, var(--primary));
    min-height: 3px;
}

.weekbar-lbl[b-5my1lesskh] { font-size: 12px; font-weight: 600; color: var(--text-muted); }

/* ---------- Lista de próximos atendimentos ---------- */
.agenda-panel[b-5my1lesskh] { padding: 18px; display: flex; flex-direction: column; }

.agenda-list[b-5my1lesskh] { display: flex; flex-direction: column; }

.agenda-row[b-5my1lesskh] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 11px 6px;
    border-bottom: 1px solid var(--border);
}

    .agenda-row:last-child[b-5my1lesskh] { border-bottom: none; }

.agenda-time[b-5my1lesskh] {
    flex-shrink: 0;
    width: 52px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 6px 0;
    border-radius: 10px;
    background: var(--primary-soft);
}

.agenda-day[b-5my1lesskh] { font-size: 11px; color: #A5B4FC; font-weight: 600; }
.agenda-hour[b-5my1lesskh] { font-size: 14px; font-weight: 700; color: #C7D2FE; }

.agenda-avatar[b-5my1lesskh] {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--surface-3);
    color: var(--text);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
}

.agenda-info[b-5my1lesskh] { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.agenda-name[b-5my1lesskh] { font-size: 14px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agenda-svc[b-5my1lesskh] { font-size: 12.5px; color: var(--text-muted); }

.agenda-func[b-5my1lesskh] {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
    padding: 4px 10px;
    border-radius: var(--r-pill);
    background: var(--surface-2);
}

.agenda-empty[b-5my1lesskh] { color: var(--text-muted); font-size: 14px; padding: 24px 6px; text-align: center; }

/* ---------- Responsivo ---------- */
@media (max-width: 1100px) {
    .today[b-5my1lesskh] { grid-template-columns: 1fr; }
    .dash2-cols[b-5my1lesskh] { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .daily[b-5my1lesskh] { grid-template-columns: 1fr; }
    .insights-2x2[b-5my1lesskh] { grid-template-columns: 1fr; }
    .today-stats[b-5my1lesskh] { flex-wrap: wrap; gap: 16px; }
}
/* /Pages/History.razor.rz.scp.css */
.history-page[b-336v15uiho] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Barra de filtros como um card */
.history-toolbar[b-336v15uiho] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
    padding: 16px 18px;
}

.history-pager[b-336v15uiho] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.history-pager-info[b-336v15uiho] {
    font-size: 13px;
    color: var(--text-muted);
}

.history-pager-btns[b-336v15uiho] {
    display: flex;
    gap: 10px;
}

    .history-pager-btns .btn:disabled[b-336v15uiho] {
        opacity: 0.45;
        cursor: not-allowed;
    }

.toolbar-head[b-336v15uiho] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    color: var(--text);
    font-size: 15px;
    font-weight: 600;
}

    .toolbar-head i[b-336v15uiho] {
        color: var(--text-muted);
    }

.history-export[b-336v15uiho] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 34px;
    padding: 0 14px;
    border-radius: 9px;
    border: 1px solid var(--border-strong);
    background: var(--surface-2);
    color: var(--text-muted);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--t);
}

    .history-export:hover[b-336v15uiho] {
        color: #C7D2FE;
        border-color: var(--primary);
        background: var(--primary-soft);
    }

/* Busca + intervalo de datas */
.toolbar-search[b-336v15uiho] {
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.history-searchbox[b-336v15uiho] {
    flex: 1;
    min-width: 220px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    height: 40px;
    border: 1px solid var(--border-strong);
    border-radius: 9px;
    background: var(--surface-2);
    color: var(--text-muted);
}

    .history-searchbox input[b-336v15uiho] {
        flex: 1;
        min-width: 0;
        background: transparent;
        border: none;
        outline: none;
        color: var(--text);
        font-size: 14px;
    }

    .history-searchbox input[b-336v15uiho]::placeholder { color: var(--text-dim); }

.history-daterange[b-336v15uiho] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--text-muted);
}

    .history-daterange input[type="date"][b-336v15uiho] {
        height: 40px;
        padding: 0 10px;
        border: 1px solid var(--border-strong);
        border-radius: 9px;
        background: var(--surface-2);
        color: var(--text);
        font-size: 13.5px;
        color-scheme: dark;
    }

    .history-daterange input:focus[b-336v15uiho] { outline: none; border-color: var(--primary); }

.history-clear-range[b-336v15uiho] {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-muted);
    cursor: pointer;
    transition: all var(--t);
}

    .history-clear-range:hover[b-336v15uiho] { color: var(--text); border-color: var(--border-strong); }

.toolbar-filters[b-336v15uiho] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

@media (max-width: 1300px) {
    .toolbar-filters[b-336v15uiho] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .toolbar-filters[b-336v15uiho] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 460px) {
    .toolbar-filters[b-336v15uiho] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Services.razor.rz.scp.css */
.svc-page[b-zxtjxfya0u] {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

/* ---------- Header ---------- */
.svc-header[b-zxtjxfya0u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.svc-title[b-zxtjxfya0u] { margin: 0; font-size: 24px; font-weight: 700; color: var(--text); letter-spacing: -0.01em; }
.svc-subtitle[b-zxtjxfya0u] { margin: 4px 0 0; font-size: 13.5px; color: var(--text-muted); }

/* ---------- Resumo ---------- */
.svc-summary[b-zxtjxfya0u] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.svc-sum[b-zxtjxfya0u] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
}

    .svc-sum > div:last-child[b-zxtjxfya0u] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.svc-sum-num[b-zxtjxfya0u] {
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.svc-sum-lbl[b-zxtjxfya0u] { font-size: 12.5px; color: var(--text-muted); }

.svc-sum-icon[b-zxtjxfya0u] {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
}

    .svc-sum-icon.indigo[b-zxtjxfya0u] { background: var(--primary-soft); color: #A5B4FC; }
    .svc-sum-icon.emerald[b-zxtjxfya0u] { background: var(--secondary-soft); color: #6EE7B7; }
    .svc-sum-icon.amber[b-zxtjxfya0u] { background: rgba(250, 204, 21, 0.14); color: var(--warning); }

/* ---------- Grade de cards ---------- */
.svc-grid[b-zxtjxfya0u] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 18px;
}

.svc-card[b-zxtjxfya0u] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px;
    text-align: left;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: border-color var(--t), transform var(--t), box-shadow var(--t);
}

    .svc-card:hover[b-zxtjxfya0u] {
        border-color: var(--primary);
        transform: translateY(-2px);
        box-shadow: var(--shadow);
    }

.svc-card-top[b-zxtjxfya0u] { display: flex; align-items: center; gap: 12px; }

.svc-card-icon[b-zxtjxfya0u] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
}

    .svc-card-icon.indigo[b-zxtjxfya0u] { background: var(--primary-soft); color: #A5B4FC; }
    .svc-card-icon.emerald[b-zxtjxfya0u] { background: var(--secondary-soft); color: #6EE7B7; }
    .svc-card-icon.sky[b-zxtjxfya0u] { background: rgba(56, 189, 248, 0.14); color: #7DD3FC; }
    .svc-card-icon.amber[b-zxtjxfya0u] { background: rgba(250, 204, 21, 0.14); color: var(--warning); }
    .svc-card-icon.pink[b-zxtjxfya0u] { background: rgba(244, 114, 182, 0.14); color: #F9A8D4; }

.svc-card-id[b-zxtjxfya0u] { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }

.svc-card-name[b-zxtjxfya0u] {
    font-size: 15.5px;
    font-weight: 700;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.svc-card-dur[b-zxtjxfya0u] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: var(--text-muted);
}

    .svc-card-dur i[b-zxtjxfya0u] { font-size: 11px; }

.svc-card-edit[b-zxtjxfya0u] {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: var(--surface-2);
    color: var(--text-dim);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    transition: all var(--t);
}

.svc-card:hover .svc-card-edit[b-zxtjxfya0u] { color: #C7D2FE; background: var(--primary-soft); }

.svc-card-price[b-zxtjxfya0u] {
    font-size: 26px;
    font-weight: 800;
    color: #6EE7B7;
    letter-spacing: -0.02em;
    line-height: 1;
}

.svc-card-desc[b-zxtjxfya0u] {
    margin: 0;
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.svc-card-stats[b-zxtjxfya0u] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

.svc-card-stat[b-zxtjxfya0u] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.svc-card-stat-num[b-zxtjxfya0u] {
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.svc-card-stat-lbl[b-zxtjxfya0u] { font-size: 11px; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.03em; }

/* ---------- Ranking de receita ---------- */
.svc-rank[b-zxtjxfya0u] { padding: 20px 22px; }

.svc-rank-head h3[b-zxtjxfya0u] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
}

    .svc-rank-head h3 i[b-zxtjxfya0u] { color: #A5B4FC; }

.svc-rank-row[b-zxtjxfya0u] {
    display: grid;
    grid-template-columns: 160px 1fr 110px;
    align-items: center;
    gap: 14px;
    padding: 7px 0;
}

.svc-rank-name[b-zxtjxfya0u] { font-size: 13.5px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.svc-rank-track[b-zxtjxfya0u] {
    height: 10px;
    border-radius: var(--r-pill);
    background: var(--surface-2);
    overflow: hidden;
}

.svc-rank-bar[b-zxtjxfya0u] {
    height: 100%;
    border-radius: var(--r-pill);
    background: linear-gradient(90deg, var(--primary), var(--secondary));
}

.svc-rank-val[b-zxtjxfya0u] { font-size: 13.5px; font-weight: 600; color: var(--text); text-align: right; }

/* ---------- Vazio ---------- */
.svc-empty[b-zxtjxfya0u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 60px 24px;
    background: var(--surface);
    border: 1px dashed var(--border-strong);
    border-radius: var(--r-lg);
    color: var(--text-muted);
}

    .svc-empty i[b-zxtjxfya0u] { font-size: 34px; color: var(--text-dim); }

/* ---------- Responsivo ---------- */
@media (max-width: 1100px) {
    .svc-summary[b-zxtjxfya0u] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .svc-summary[b-zxtjxfya0u] { grid-template-columns: 1fr; }
    .svc-rank-row[b-zxtjxfya0u] { grid-template-columns: 110px 1fr 90px; gap: 10px; }
}
/* /Pages/Settings.razor.rz.scp.css */
.settings-page[b-3jjf87juqe] {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.settings-title[b-3jjf87juqe] { margin: 0; font-size: 24px; font-weight: 700; color: var(--text); letter-spacing: -0.01em; }
.settings-subtitle[b-3jjf87juqe] { margin: 4px 0 0; font-size: 13.5px; color: var(--text-muted); }