/* Sistrata Online — tipografia industrial/corporativa (Inter) */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root,
html[data-skin] {
    --ins-font-sans-serif: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ins-font-family-secondary: var(--ins-font-sans-serif);
    --ins-body-font-family: var(--ins-font-sans-serif);
    --sist-font-ui-sm: 0.8125rem;
    --sist-font-ui: 0.875rem;
    --sist-font-title: 1.5rem;
    --sist-font-kpi-label: 0.75rem;
    --sist-font-kpi: 1.625rem;
    --sist-color-label: #475569;
    --sist-color-muted: #64748b;
    --sist-sidebar-menu-item-font-weight: 500;
    --sist-font-meta: 0.6875rem;
}

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body {
    font-family: var(--ins-body-font-family);
    font-weight: 400;
    font-size: var(--sist-font-ui);
}

/* Ajuda contextual compacta para formularios */
.form-help-tooltip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    margin-left: 0.25rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #64748b;
    font-size: 0.9rem;
    line-height: 1;
    vertical-align: middle;
    cursor: help;
}

.form-help-tooltip:hover,
.form-help-tooltip:focus-visible {
    color: var(--ins-primary, #6658dd);
    background: rgba(102, 88, 221, 0.1);
    outline: none;
}

/* Switches: desligado cinza, ligado verde e estado textual explicito */
.form-switch .form-check-input {
    background-color: #adb5bd;
    border-color: #adb5bd;
    cursor: pointer;
}

.form-switch .form-check-input:checked {
    background-color: var(--ins-success, #198754);
    border-color: var(--ins-success, #198754);
}

.form-switch .form-check-input:focus {
    border-color: rgba(25, 135, 84, 0.65);
    box-shadow: 0 0 0 0.2rem rgba(25, 135, 84, 0.16);
}

.form-switch .form-check-input:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.form-switch .switch-state-label {
    display: inline-flex;
    align-items: center;
    margin-left: 0.45rem;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.25;
    vertical-align: middle;
}

.form-switch .switch-state-label.is-on {
    color: #146c43;
    background: #d1e7dd;
}

.form-switch .switch-state-label.is-off {
    color: #5c636a;
    background: #e9ecef;
}

/* Excecao semantica: acoes destrutivas continuam vermelhas quando marcadas. */
.form-switch.usuario-form-switch-danger .form-check-input:checked,
.usuario-form-switch-danger.form-switch .form-check-input:checked {
    background-color: #dc3545;
    border-color: #dc3545;
}

.form-switch.usuario-form-switch-danger .switch-state-label.is-on,
.usuario-form-switch-danger.form-switch .switch-state-label.is-on {
    color: #842029;
    background: #f8d7da;
}

/* --- Sidebar --- */
.side-nav .side-nav-title {
    font-family: var(--ins-font-sans-serif);
    font-size: var(--sist-font-meta) !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.side-nav .side-nav-title.side-nav-title--inicio {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.side-nav .side-nav-item .side-nav-link,
.side-nav .sub-menu .side-nav-item .side-nav-link {
    font-family: var(--ins-font-sans-serif) !important;
    font-size: var(--sist-font-ui) !important;
    font-weight: 500 !important;
}

.side-nav > .side-nav-item.active > a,
.side-nav > .side-nav-item.active > .side-nav-link,
.side-nav .side-nav-item.active > .side-nav-link.active > a,
.side-nav .side-nav-item.active .side-nav-item.active > a {
    font-weight: 600 !important;
}

/* --- Topbar --- */
.app-topbar .select-box-value,
.app-topbar .topbar-user-name {
    font-size: 0.8125rem;
    font-weight: 600;
}

.app-topbar .select-box-label,
.app-topbar .topbar-user-role {
    font-size: 0.625rem;
    font-weight: 500;
    letter-spacing: 0.07em;
}

.app-topbar .topbar-link {
    font-weight: 500;
}

.app-topbar .system-main-title {
    font-weight: 700;
}

.app-topbar .system-sub-title {
    font-size: var(--sist-font-ui-sm);
    font-weight: 400;
    color: rgba(255, 255, 255, 0.78);
}

/* --- Monitoramento analitico --- */
.mon-page .mon-acc-label {
    font-size: var(--sist-font-ui-sm);
    font-weight: 700;
    letter-spacing: 0.04em;
}

.mon-page .mon-info h6 {
    font-weight: 600;
}

.mon-page .mon-info small {
    font-weight: 500;
}

.mon-page .mon-meta {
    font-size: var(--sist-font-ui-sm);
    font-weight: 400;
}

.mon-page .mon-value {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.mon-page .mon-unit {
    font-size: var(--sist-font-ui-sm);
    font-weight: 400;
}

.mon-page .mon-tool-btn {
    font-size: var(--sist-font-ui-sm);
    font-weight: 500;
}

.mon-page,
.page-index-lista,
.jt-sup-wrap,
table,
.table {
    font-variant-numeric: tabular-nums;
}

/* --- Banner manutencao --- */
.mnt-supervisao-banner-body {
    font-size: var(--sist-font-ui);
    font-weight: 500;
    line-height: 1.4;
}

.mnt-supervisao-banner-body strong {
    font-weight: 700;
}

.mnt-supervisao-banner-meta {
    font-size: var(--sist-font-ui-sm);
    font-weight: 400;
}

/* ============================================================
   Padrao SaaS compartilhado — KPI, filtros, headers, checkboxes
   ============================================================ */

/* 4. Cabecalho de paginas */
.sist-page-title,
.page-index-header-title,
.estoque-page-header .estoque-header-text h4 {
    font-size: var(--sist-font-title);
    font-weight: 700;
    line-height: 1.25;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.sist-page-sub,
.page-index-header-sub,
.estoque-page-header .estoque-header-text p.text-muted {
    font-size: var(--sist-font-ui) !important;
    font-weight: 400;
    color: var(--sist-color-muted) !important;
    line-height: 1.45;
}

/* 2. Labels de filtros e form controls */
.form-label,
.form-label-sm {
    font-size: var(--sist-font-ui-sm);
    font-weight: 500;
    color: var(--sist-color-label);
}

.form-control,
.form-control-sm,
.form-select,
.form-select-sm {
    font-size: var(--sist-font-ui);
}

.form-select,
.form-select-sm,
.form-control:not(:placeholder-shown),
.form-control-sm:not(:placeholder-shown) {
    font-weight: 500;
}

.form-control::placeholder,
.form-control-sm::placeholder {
    font-weight: 400;
    color: #94a3b8;
}

/* 3. Checkboxes abaixo dos filtros */
.form-check-label {
    font-size: var(--sist-font-ui-sm);
    font-weight: 500;
    color: var(--sist-color-label);
}

/* 1. KPI cards — rotulo superior */
.ga-kpi-card label,
.jt-kpi-body label,
.estoque-kpi-card label,
.jt-sup-kpi .lbl,
.micromed-metric-card small.text-muted,
.micromed-metric-card .micromed-metric-label,
.estoque-saldo-box .lbl,
.dash-kpi-card .dash-kpi-legenda {
    font-size: var(--sist-font-kpi-label);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--sist-color-muted);
    line-height: 1.2;
}

/* 1. KPI cards — valor grande */
.ga-kpi-valor,
.jt-kpi-valor,
.estoque-kpi-card .valor,
.jt-sup-kpi strong,
.micromed-metric-card .h4,
.micromed-metric-card .micromed-metric-valor,
.estoque-saldo-box .num,
.dash-kpi-card .dash-kpi-num {
    font-size: var(--sist-font-kpi);
    font-weight: 700;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
}