/* =====================================================================
   SIGPRED — tokens e estilos globais da casca (layout, status, utilitários)
   Carregado no index.html ANTES das folhas de cada página.
   As cores de status espelham Services/StatusSigpred.cs — altere nos dois.
   ===================================================================== */

:root {
    /* Status (mesmos valores de StatusSigpred.cs) */
    --sp-st-n: #16a34a;
    --sp-st-a1: #ca8a04;
    --sp-st-a2: #dc2626;
    --sp-st-a3: #7c3aed;
    --sp-st-p: #64748b;
    --sp-st-m: #2563eb;
    --sp-st-nd: #94a3b8;
    --sp-st-n-bg: #f0fdf4;
    --sp-st-a1-bg: #fefce8;
    --sp-st-a2-bg: #fef2f2;
    --sp-st-a3-bg: #f5f3ff;
    --sp-st-p-bg: #f1f5f9;
    --sp-st-m-bg: #eff6ff;
    --sp-st-nd-bg: #f1f5f9;

    /* Superfícies e texto */
    --sp-page: #f5f7fb;
    --sp-surface: #ffffff;
    --sp-border: #e2e8f0;
    --sp-text: #1e293b;
    --sp-muted: #64748b;
    --sp-primary: #1677ff;
    --sp-sider: #001529;

    /* Medidas */
    --sp-radius: 10px;
    --sp-gap: 12px;
    --sp-header-h: 56px;
    --sp-touch: 44px;

    --sp-font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
}

html, body {
    margin: 0;
    font-family: var(--sp-font);
    color: var(--sp-text);
    background: var(--sp-page);
    -webkit-text-size-adjust: 100%;
}

/* Valores medidos sempre alinhados nas colunas */
.sp-num, .ant-table-cell, .va-measure-value, .de-kpi strong, .sd-kpi strong {
    font-variant-numeric: tabular-nums;
}

/* ======================= STATUS ======================= */
.sp-st-n  { --sp-st: var(--sp-st-n);  --sp-st-bg: var(--sp-st-n-bg); }
.sp-st-a1 { --sp-st: var(--sp-st-a1); --sp-st-bg: var(--sp-st-a1-bg); }
.sp-st-a2 { --sp-st: var(--sp-st-a2); --sp-st-bg: var(--sp-st-a2-bg); }
.sp-st-a3 { --sp-st: var(--sp-st-a3); --sp-st-bg: var(--sp-st-a3-bg); }
.sp-st-p  { --sp-st: var(--sp-st-p);  --sp-st-bg: var(--sp-st-p-bg); }
.sp-st-m  { --sp-st: var(--sp-st-m);  --sp-st-bg: var(--sp-st-m-bg); }
.sp-st-nd { --sp-st: var(--sp-st-nd); --sp-st-bg: var(--sp-st-nd-bg); }

.sp-status-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    color: var(--sp-st);
    background: var(--sp-st-bg);
    border: 1px solid color-mix(in srgb, var(--sp-st) 35%, transparent);
    white-space: nowrap;
}

.sp-status-tag--solido {
    color: #fff;
    background: var(--sp-st);
    border-color: var(--sp-st);
}

.sp-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    flex: none;
}

.sp-status-tag--solido .sp-status-dot { background: #fff; }

/* ======================= CASCA (layout) ======================= */
.sp-shell {
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
}

.sp-sider.ant-layout-sider {
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
}

.sp-sider-logo {
    height: var(--sp-header-h);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.sp-sider-logo img {
    max-width: 100%;
    max-height: 40px;
    object-fit: contain;
}

.sp-sider-logo .sp-logo-mini {
    width: 36px;
    height: 36px;
    border-radius: 9px;
}

.sp-menu-scroll {
    height: calc(100dvh - var(--sp-header-h) - 48px);
    overflow-y: auto;
    overflow-x: hidden;
}

.sp-menu-scroll::-webkit-scrollbar { width: 4px; }
.sp-menu-scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,.28); border-radius: 10px; }

.sp-sider-toggle {
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.75);
    cursor: pointer;
    border-top: 1px solid rgba(255,255,255,.08);
    font-size: 16px;
}

.sp-sider-toggle:hover { color: #fff; background: rgba(255,255,255,.06); }

.sp-main.ant-layout {
    height: 100vh;
    height: 100dvh;
    min-width: 0;
}

.sp-header {
    height: var(--sp-header-h);
    flex: none;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    background: var(--sp-surface);
    border-bottom: 1px solid var(--sp-border);
    box-sizing: border-box;
    min-width: 0;
}

.sp-header-btn {
    min-width: var(--sp-touch);
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--sp-text);
    cursor: pointer;
    font: inherit;
    font-size: 14px;
}

.sp-header-btn:hover { background: #f1f5f9; }

.sp-header-hamburger { font-size: 20px; }

.sp-context {
    min-width: 0;
    max-width: 420px;
    border-color: var(--sp-border);
}

.sp-context-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
    line-height: 1.15;
}

.sp-context-text small {
    display: block;
    color: var(--sp-muted);
    font-size: 11px;
}

.sp-context-text strong { font-weight: 600; font-size: 13px; }

.sp-header-spacer { flex: 1; }

.sp-user-avatar.ant-avatar {
    background: var(--sp-primary);
    color: #fff;
    font-weight: 700;
    flex: none;
}

.sp-user-name {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

.sp-content {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--sp-page);
    -webkit-overflow-scrolling: touch;
}

/* Drawer do menu no celular */
.sp-drawer .ant-drawer-body { padding: 0; }
.sp-drawer-user {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--sp-border);
}

/* Menu: grupos com título discreto */
.sp-sider .ant-menu-item-group-title {
    color: rgba(255,255,255,.45);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    padding-top: 14px;
}

.sp-drawer .ant-menu-item-group-title {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

/* ======================= ESTADOS ======================= */
.sp-state {
    padding: 28px 16px;
    text-align: center;
    color: var(--sp-muted);
}

.sp-state--erro {
    color: #a3262c;
    background: #fff2f0;
    border: 1px solid #ffccc7;
    border-radius: var(--sp-radius);
}

.sp-panel-loading {
    position: relative;
    min-height: 120px;
}

.sp-panel-loading > .sp-panel-spin {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.55);
    z-index: 5;
}

/* Tela de abertura (restaurando sessão) */
.sp-splash {
    height: 100vh;
    height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 14px;
    color: var(--sp-muted);
    background: var(--sp-page);
}

/* ======================= CELULAR ======================= */
@media (max-width: 767.98px) {
    .sp-header { padding: 0 8px; gap: 6px; }
    .sp-user-name { display: none; }
    .sp-context { max-width: none; flex: 1; }

    /* Evita zoom automático do iPhone ao focar campos */
    input, select, textarea,
    .ant-input, .ant-select-selection-search-input, .ant-picker-input > input {
        font-size: 16px !important;
    }

    .ant-menu-item, .ant-menu-submenu-title {
        height: var(--sp-touch) !important;
        line-height: var(--sp-touch) !important;
    }

    .ant-tree .ant-tree-node-content-wrapper { padding: 8px 6px; }
    .ant-tree .ant-tree-switcher { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; }

    .ant-modal { max-width: calc(100vw - 16px) !important; margin: 8px auto; }
}

/* Movimento reduzido: tira transições decorativas.
   O piscar dos alarmes da Gestão à vista é funcional e continua (mais lento), ver GestVisual. */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: 0.001ms !important;
    }
}
