/* ==========================================================================
   OncoAnálises: visual "OncoSystem"
   Fundo claro com leve gradiente lavanda, cartões brancos com borda fina,
   ícones em blocos coloridos, botão principal escuro, abas em pílula e
   selos arredondados. Só aparência: nenhum comportamento muda.
   Vale só com o estilo "OncoSystem" escolhido (data-estilo no <html>) e só
   dentro de #app-shell: a tela de login não é afetada.
   ========================================================================== */

/* ---------- tokens ---------- */
:root[data-estilo="oncosystem"] #app-shell {
  --brand: #4f46e5;
  --brand-dark: #111827;
  --brand-light: #eef0ff;
  --accent: #7c3aed;
  --danger: #dc2626;
  --success: #16a34a;
  --bg: #f7f8fc;
  --card-bg: #ffffff;
  --text: #0b0b16;
  --text-muted: #64697b;
  --border: #e6e8f0;
  --radius: 14px;
  --radius-lg: 18px;
  --shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 1px 3px rgba(16, 24, 40, 0.05);
  --tm-sombra-alta: 0 10px 28px rgba(31, 27, 75, 0.1), 0 2px 6px rgba(31, 27, 75, 0.05);
  --tm-campo: #f3f4f8;
  --tm-campo-borda: #e8eaf1;
  --tm-hover: #f5f6fa;
  --tm-pilula: #f0f1f6;
  --tm-pilula-ativa: #ffffff;
  --tm-th: #f8f9fc;
  --tm-th-texto: #3b4152;
  --tm-botao: #0b0b16;
  --tm-botao-texto: #ffffff;
  --tm-botao-hover: #262836;
  --tm-gradiente: linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%);
  --tm-boas-vindas: linear-gradient(120deg, #f5f3ff 0%, #f0f4ff 60%, #fdf2ff 100%);
  --tm-boas-vindas-borda: #e5e1fb;
  --bi-superficie: #ffffff;
  --bi-fundo-filtros: #ffffff;
  --bi-grade: #eceef4;
  color-scheme: light;
  background:
    radial-gradient(1100px 520px at 100% 0%, rgba(167, 139, 250, 0.12), transparent 62%),
    radial-gradient(900px 480px at 0% 100%, rgba(96, 165, 250, 0.1), transparent 60%),
    var(--bg);
  background-attachment: fixed;
  color: var(--text);
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
}
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell {
  --brand: #818cf8;
  --brand-dark: #eceef8;
  --brand-light: #1c1f3a;
  --accent: #a78bfa;
  --danger: #f87171;
  --success: #4ade80;
  --bg: #0b0c12;
  --card-bg: #13151e;
  --text: #eceef6;
  --text-muted: #9aa0b4;
  --border: #252938;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
  --tm-sombra-alta: 0 12px 30px rgba(0, 0, 0, 0.5);
  --tm-campo: #191c28;
  --tm-campo-borda: #2a2e40;
  --tm-hover: #1a1d29;
  --tm-pilula: #1a1d29;
  --tm-pilula-ativa: #2b2f44;
  --tm-th: #171a25;
  --tm-th-texto: #c9cde0;
  --tm-botao: #f2f3f9;
  --tm-botao-texto: #0b0b16;
  --tm-botao-hover: #d9dbe8;
  --tm-boas-vindas: linear-gradient(120deg, #1b1737 0%, #141b33 60%, #22163a 100%);
  --tm-boas-vindas-borda: #2e2a55;
  --bi-superficie: #13151e;
  --bi-fundo-filtros: #13151e;
  --bi-grade: #232737;
  color-scheme: dark;
  background:
    radial-gradient(1100px 520px at 100% 0%, rgba(124, 58, 237, 0.12), transparent 62%),
    radial-gradient(900px 480px at 0% 100%, rgba(59, 130, 246, 0.08), transparent 60%),
    var(--bg);
  background-attachment: fixed;
}
:root[data-estilo="oncosystem"] #app-shell a { color: var(--brand); }
:root[data-estilo="oncosystem"] #app-shell a.inicio-card { color: var(--text); }
/* logotipo no tom violeta do novo visual (só dentro do sistema) */
:root[data-estilo="oncosystem"] #app-shell .brand-logo, :root[data-estilo="oncosystem"] #app-shell .inicio-marca img { filter: hue-rotate(78deg) saturate(1.15); }

/* ---------- barra lateral (clara, como o cabeçalho do vídeo) ---------- */
:root[data-estilo="oncosystem"] #app-shell .sidebar {
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: var(--text);
  border-right: 1px solid var(--border);
}
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .sidebar { background: rgba(17, 19, 28, 0.86); }
:root[data-estilo="oncosystem"] #app-shell .sidebar .brand { border-bottom-color: var(--border); }
:root[data-estilo="oncosystem"] #app-shell .sidebar .brand-logo { box-shadow: 0 6px 16px rgba(79, 70, 229, 0.25); }
:root[data-estilo="oncosystem"] #app-shell .sidebar .brand-text,
:root[data-estilo="oncosystem"] #app-shell .inicio-marca-texto strong {
  font-weight: 800;
  letter-spacing: -0.01em;
  background: var(--tm-gradiente);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .sidebar .brand-text,
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-marca-texto strong { background: linear-gradient(135deg, #c4b5fd 0%, #a5b4fc 100%); -webkit-background-clip: text; background-clip: text; }
:root[data-estilo="oncosystem"] #app-shell .sidebar .brand-text small,
:root[data-estilo="oncosystem"] #app-shell .inicio-marca-texto span { -webkit-text-fill-color: var(--text-muted); color: var(--text-muted); opacity: 1; font-weight: 500; }

:root[data-estilo="oncosystem"] #app-shell .nav-item { color: #3b4152; font-weight: 500; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .nav-item { color: #c3c7d8; }
:root[data-estilo="oncosystem"] #app-shell .nav-icon { background: var(--tm-pilula); filter: saturate(0.85); }
:root[data-estilo="oncosystem"] #app-shell .nav-item:hover { background: var(--tm-hover); }
:root[data-estilo="oncosystem"] #app-shell .nav-item:hover .nav-icon { background: #e7e9f2; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .nav-item:hover .nav-icon { background: #262a3a; }
:root[data-estilo="oncosystem"] #app-shell .nav-item.active { background: var(--brand-light); color: #3730a3; font-weight: 600; box-shadow: none; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .nav-item.active { color: #c7d2fe; }
:root[data-estilo="oncosystem"] #app-shell .nav-item.active .nav-icon { background: #ffffff; box-shadow: 0 0 0 1px #c7cbf5, 0 3px 10px rgba(79, 70, 229, 0.18); filter: none; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .nav-item.active .nav-icon { background: #2b2f50; box-shadow: 0 0 0 1px #3d4373; }
:root[data-estilo="oncosystem"] #app-shell .v2-tag-migracao { background: var(--tm-pilula); color: var(--text-muted); }

:root[data-estilo="oncosystem"] #app-shell .sidebar-footer { border-top-color: var(--border); color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .sidebar-footer .user-email { color: var(--text); opacity: 1; }
:root[data-estilo="oncosystem"] #app-shell .btn-ghost-dark { background: var(--card-bg); color: var(--text); border: 1px solid var(--border); }
:root[data-estilo="oncosystem"] #app-shell .btn-ghost-dark:hover { background: var(--tm-hover); }

/* ---------- cabeçalho de página e trilha ---------- */
:root[data-estilo="oncosystem"] #app-shell .page-header h2 { font-size: 1.45rem; font-weight: 700; letter-spacing: -0.015em; color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .page-header .desc { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .page-icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: var(--brand-light);
  box-shadow: inset 0 0 0 1px #dfe2fb;
}
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .page-icon { background: #1c1f3a; box-shadow: inset 0 0 0 1px #2e3360; }
:root[data-estilo="oncosystem"] #app-shell .v2-trilha { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .v2-trilha a { color: var(--text-muted); font-weight: 500; text-decoration: none; }
:root[data-estilo="oncosystem"] #app-shell .v2-trilha a:hover { color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .v2-trilha [aria-current] { color: var(--text); font-weight: 600; }
:root[data-estilo="oncosystem"] #app-shell .v2-secao { color: var(--text); }

/* ---------- cartões ---------- */
:root[data-estilo="oncosystem"] #app-shell .card { border-radius: 16px; border-color: var(--border); box-shadow: var(--shadow); padding: 22px; }

/* ---------- botões ---------- */
:root[data-estilo="oncosystem"] #app-shell .btn { border-radius: 9px; font-weight: 600; letter-spacing: 0; }
:root[data-estilo="oncosystem"] #app-shell .btn-primary { background: var(--tm-botao); color: var(--tm-botao-texto); box-shadow: 0 1px 2px rgba(16, 24, 40, 0.12); }
:root[data-estilo="oncosystem"] #app-shell .btn-primary:hover { background: var(--tm-botao-hover); filter: none; }
:root[data-estilo="oncosystem"] #app-shell .btn-secondary { background: var(--card-bg); color: var(--text); border: 1px solid var(--border); box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04); }
:root[data-estilo="oncosystem"] #app-shell .btn-secondary:hover { background: var(--tm-hover); }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .btn-secondary { background: #181b27; color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .btn-danger { background: var(--danger); color: #fff; }
:root[data-estilo="oncosystem"] #app-shell .btn-ghost, :root[data-estilo="oncosystem"] #app-shell .btn-link { color: var(--brand); }
:root[data-estilo="oncosystem"] #app-shell .btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* ---------- campos (preenchidos em cinza, como no vídeo) ---------- */
:root[data-estilo="oncosystem"] #app-shell .field input, :root[data-estilo="oncosystem"] #app-shell .field select, :root[data-estilo="oncosystem"] #app-shell .field textarea,
:root[data-estilo="oncosystem"] #app-shell .v2-campo input, :root[data-estilo="oncosystem"] #app-shell .v2-campo select, :root[data-estilo="oncosystem"] #app-shell .v2-campo textarea,
:root[data-estilo="oncosystem"] #app-shell .toolbar input, :root[data-estilo="oncosystem"] #app-shell .toolbar select,
:root[data-estilo="oncosystem"] #app-shell .bi-filtro select, :root[data-estilo="oncosystem"] #app-shell .bi-filtro input {
  background: var(--tm-campo);
  border: 1px solid var(--tm-campo-borda);
  border-radius: 9px;
  color: var(--text);
}
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .field input, :root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .field select, :root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .field textarea,
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .toolbar input, :root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .toolbar select,
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .bi-filtro select, :root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .bi-filtro input {
  background: var(--tm-campo); border-color: var(--tm-campo-borda); color: var(--text);
}
:root[data-estilo="oncosystem"] #app-shell .field input:focus, :root[data-estilo="oncosystem"] #app-shell .field select:focus, :root[data-estilo="oncosystem"] #app-shell .field textarea:focus,
:root[data-estilo="oncosystem"] #app-shell .v2-campo input:focus, :root[data-estilo="oncosystem"] #app-shell .v2-campo select:focus, :root[data-estilo="oncosystem"] #app-shell .v2-campo textarea:focus,
:root[data-estilo="oncosystem"] #app-shell .toolbar input:focus, :root[data-estilo="oncosystem"] #app-shell .toolbar select:focus,
:root[data-estilo="oncosystem"] #app-shell .bi-filtro select:focus, :root[data-estilo="oncosystem"] #app-shell .bi-filtro input:focus {
  outline: none;
  background: var(--card-bg);
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.18);
}
:root[data-estilo="oncosystem"] #app-shell .field label, :root[data-estilo="oncosystem"] #app-shell .v2-rotulo { color: #3b4152; font-weight: 600; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .field label, :root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .v2-rotulo { color: #c3c7d8; }

/* ---------- abas em pílula ---------- */
:root[data-estilo="oncosystem"] #app-shell .dash-tabs {
  display: inline-flex; max-width: 100%;
  gap: 2px; padding: 4px;
  background: var(--tm-pilula);
  border: 0; border-radius: 12px;
}
:root[data-estilo="oncosystem"] #app-shell .dash-tab {
  border: 0; border-radius: 9px;
  padding: 7px 15px; font-weight: 600; font-size: 0.86rem;
  color: var(--text-muted); background: transparent;
}
:root[data-estilo="oncosystem"] #app-shell .dash-tab:hover { background: transparent; color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .dash-tab.active { background: var(--tm-pilula-ativa); color: var(--text); box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08), 0 1px 3px rgba(16, 24, 40, 0.06); }

:root[data-estilo="oncosystem"] #app-shell .v2-segmento { background: var(--tm-pilula); padding: 4px; border-radius: 12px; gap: 2px; }
:root[data-estilo="oncosystem"] #app-shell .v2-segmento button { border: 0; background: transparent; color: var(--text-muted); border-radius: 9px; padding: 7px 14px; }
:root[data-estilo="oncosystem"] #app-shell .v2-segmento button:hover { color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .v2-segmento button.ativo { background: var(--tm-pilula-ativa); color: var(--text); box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08); }

:root[data-estilo="oncosystem"] #app-shell .bi-presets { background: var(--tm-pilula); border: 0; border-radius: 12px; padding: 4px; }
:root[data-estilo="oncosystem"] #app-shell .bi-presets button { color: var(--text-muted); border-radius: 9px; }
:root[data-estilo="oncosystem"] #app-shell .bi-presets button:hover { background: transparent; color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .bi-presets button.ativo { background: var(--tm-pilula-ativa); color: var(--text); box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08); }

/* ---------- indicadores ---------- */
:root[data-estilo="oncosystem"] #app-shell .kpi-card {
  border: 1px solid var(--border); border-top: 1px solid var(--border);
  border-radius: 14px; align-items: flex-start; text-align: left;
  padding: 16px 18px; box-shadow: var(--shadow);
}
:root[data-estilo="oncosystem"] #app-shell .kpi-card:hover { transform: translateY(-1px); box-shadow: var(--tm-sombra-alta); }
:root[data-estilo="oncosystem"] #app-shell .kpi-card .kpi-label {
  justify-content: flex-start; text-transform: none; letter-spacing: 0;
  font-size: 0.84rem; font-weight: 500; color: var(--text-muted); min-height: 0;
}
:root[data-estilo="oncosystem"] #app-shell .kpi-card .kpi-value { font-size: 1.9rem; font-weight: 700; letter-spacing: -0.02em; color: var(--text); margin-top: 10px; }
:root[data-estilo="oncosystem"] #app-shell .kpi-card.accent .kpi-value, :root[data-estilo="oncosystem"] #app-shell .v2-kpi-atencao .kpi-value { color: #ea580c; }
:root[data-estilo="oncosystem"] #app-shell .v2-kpi-bom .kpi-value { color: var(--success); }
:root[data-estilo="oncosystem"] #app-shell .v2-kpi-ruim .kpi-value { color: var(--danger); }
:root[data-estilo="oncosystem"] #app-shell .v2-kpi-detalhe { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .bi-kpi { border-radius: 14px; }
:root[data-estilo="oncosystem"] #app-shell button.bi-kpi:hover { box-shadow: var(--tm-sombra-alta); }
:root[data-estilo="oncosystem"] #app-shell .bi-quadro, :root[data-estilo="oncosystem"] #app-shell .bi-destaques, :root[data-estilo="oncosystem"] #app-shell .bi-filtros { border-radius: 16px; }

/* ---------- tabelas ---------- */
:root[data-estilo="oncosystem"] #app-shell .table-wrap { border-radius: 12px; border-color: var(--border); background: var(--card-bg); }
:root[data-estilo="oncosystem"] #app-shell table.data-table th,
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell table.data-table th {
  background: var(--tm-th); color: var(--tm-th-texto);
  font-weight: 600; font-size: 0.82rem;
  border-bottom: 1px solid var(--border);
}
:root[data-estilo="oncosystem"] #app-shell table.data-table td { border-bottom-color: var(--border); }
:root[data-estilo="oncosystem"] #app-shell table.data-table tbody tr:hover,
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell table.data-table tbody tr:hover { background: var(--tm-hover); }

/* ---------- selos ---------- */
:root[data-estilo="oncosystem"] #app-shell .badge { padding: 3px 10px; font-weight: 600; font-size: 0.72rem; }
:root[data-estilo="oncosystem"] #app-shell .badge.disp, :root[data-estilo="oncosystem"] #app-shell .badge.perfil-operador { background: #eef0ff; color: #4338ca; }
:root[data-estilo="oncosystem"] #app-shell .badge.manip, :root[data-estilo="oncosystem"] #app-shell .badge.perfil-admin { background: #fff4e5; color: #c2410c; }
:root[data-estilo="oncosystem"] #app-shell .badge.quimio { background: #fde8ea; color: #be123c; }
:root[data-estilo="oncosystem"] #app-shell .badge.hormonio { background: #e8f1ff; color: #1d4ed8; }
:root[data-estilo="oncosystem"] #app-shell .badge.perfil-visualizador { background: #f3e8ff; color: #7e22ce; }
:root[data-estilo="oncosystem"] #app-shell .badge.status-ativo { background: #dcfce7; color: #15803d; }
:root[data-estilo="oncosystem"] #app-shell .badge.status-inativo { background: #fee2e2; color: #b91c1c; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.disp, :root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.perfil-operador { background: rgba(99, 102, 241, 0.18); color: #c7d2fe; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.manip, :root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.perfil-admin { background: rgba(249, 115, 22, 0.16); color: #fdba74; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.quimio { background: rgba(244, 63, 94, 0.16); color: #fda4af; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.hormonio { background: rgba(59, 130, 246, 0.16); color: #93c5fd; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.perfil-visualizador { background: rgba(168, 85, 247, 0.16); color: #d8b4fe; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.status-ativo { background: rgba(34, 197, 94, 0.16); color: #86efac; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .badge.status-inativo { background: rgba(239, 68, 68, 0.16); color: #fca5a5; }

/* ---------- tela Início: faixa de boas-vindas clara ---------- */
:root[data-estilo="oncosystem"] #app-shell .inicio-hero {
  background: var(--tm-boas-vindas);
  border: 1px solid var(--tm-boas-vindas-borda);
  color: var(--text);
  box-shadow: none;
  border-radius: 16px;
}
:root[data-estilo="oncosystem"] #app-shell .inicio-data { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .inicio-hero h2 { color: var(--text); font-weight: 700; letter-spacing: -0.02em; }
:root[data-estilo="oncosystem"] #app-shell .inicio-hero .desc { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .inicio-resumo-item {
  background: var(--card-bg);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
:root[data-estilo="oncosystem"] #app-shell .inicio-resumo-valor { color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .inicio-resumo-rotulo { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .inicio-usuario-email { color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .inicio-usuario-papel { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .inicio-btn-tema, :root[data-estilo="oncosystem"] #app-shell .inicio-btn-sair {
  background: var(--card-bg); color: var(--text);
  border: 1px solid var(--border); box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}
:root[data-estilo="oncosystem"] #app-shell .inicio-btn-tema:hover, :root[data-estilo="oncosystem"] #app-shell .inicio-btn-sair:hover { background: var(--tm-hover); }
:root[data-estilo="oncosystem"] #app-shell .v2-selo { color: var(--brand); }
:root[data-estilo="oncosystem"] #app-shell .v2-grupo-titulo { color: var(--text-muted); letter-spacing: 0.05em; }

/* ---------- cartões de módulo (Início e grupos): ícone colorido no topo ---------- */
:root[data-estilo="oncosystem"] #app-shell .inicio-card {
  --tm-ic: #eef0ff; --tm-ic-borda: #dfe2fb;
  position: relative;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  padding: 22px 22px 20px;
  border-radius: 16px;
  border-color: var(--border);
  box-shadow: var(--shadow);
}
:root[data-estilo="oncosystem"] #app-shell .inicio-card:hover { transform: translateY(-2px); border-color: #c9cdf3; box-shadow: var(--tm-sombra-alta); }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-card:hover { border-color: #3a3f63; }
:root[data-estilo="oncosystem"] #app-shell .inicio-card:focus-visible { outline: 3px solid var(--brand); }
:root[data-estilo="oncosystem"] #app-shell .inicio-card-icon {
  width: 46px; height: 46px; border-radius: 12px;
  background: var(--tm-ic);
  box-shadow: inset 0 0 0 1px var(--tm-ic-borda);
  font-size: 1.35rem;
}
:root[data-estilo="oncosystem"] #app-shell .inicio-card:hover .inicio-card-icon { transform: scale(1.04); }
:root[data-estilo="oncosystem"] #app-shell .inicio-card-icon { transition: transform 0.15s ease; }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+1) { --tm-ic: #dbeafe; --tm-ic-borda: #bfdbfe; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+1) { --tm-ic: rgba(59,130,246,0.16); --tm-ic-borda: rgba(59,130,246,0.32); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+2) { --tm-ic: #ede4ff; --tm-ic-borda: #dccbff; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+2) { --tm-ic: rgba(168,85,247,0.16); --tm-ic-borda: rgba(168,85,247,0.32); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+3) { --tm-ic: #dcfce7; --tm-ic-borda: #bbf7d0; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+3) { --tm-ic: rgba(34,197,94,0.15); --tm-ic-borda: rgba(34,197,94,0.3); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+4) { --tm-ic: #ffe4e8; --tm-ic-borda: #fecdd6; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+4) { --tm-ic: rgba(244,63,94,0.15); --tm-ic-borda: rgba(244,63,94,0.3); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+5) { --tm-ic: #e0e7ff; --tm-ic-borda: #c7d2fe; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+5) { --tm-ic: rgba(99,102,241,0.16); --tm-ic-borda: rgba(99,102,241,0.32); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+6) { --tm-ic: #ffedd5; --tm-ic-borda: #fed7aa; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+6) { --tm-ic: rgba(249,115,22,0.15); --tm-ic-borda: rgba(249,115,22,0.3); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+7) { --tm-ic: #cffafe; --tm-ic-borda: #a5f3fc; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+7) { --tm-ic: rgba(6,182,212,0.15); --tm-ic-borda: rgba(6,182,212,0.3); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+8) { --tm-ic: #fce7f3; --tm-ic-borda: #fbcfe8; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+8) { --tm-ic: rgba(236,72,153,0.15); --tm-ic-borda: rgba(236,72,153,0.3); }
:root[data-estilo="oncosystem"] #app-shell .inicio-grid > :nth-child(9n+9) { --tm-ic: #ccfbf1; --tm-ic-borda: #99f6e4; }
:root[data-estilo="oncosystem"][data-theme="dark"] #app-shell .inicio-grid > :nth-child(9n+9) { --tm-ic: rgba(20,184,166,0.15); --tm-ic-borda: rgba(20,184,166,0.3); }
:root[data-estilo="oncosystem"] #app-shell .inicio-card-text { gap: 4px; }
:root[data-estilo="oncosystem"] #app-shell .inicio-card-text strong { font-size: 1.05rem; font-weight: 700; letter-spacing: -0.01em; }
:root[data-estilo="oncosystem"] #app-shell .inicio-card-text small { color: var(--text-muted); font-size: 0.85rem; }
:root[data-estilo="oncosystem"] #app-shell .inicio-card-arrow { position: absolute; top: 20px; right: 20px; }
:root[data-estilo="oncosystem"] #app-shell .inicio-card:hover .inicio-card-arrow { color: var(--text); }
:root[data-estilo="oncosystem"] #app-shell .v2-card-migracao .inicio-card-icon { filter: grayscale(0.5); opacity: 0.85; }

/* ---------- janelas e avisos ---------- */
:root[data-estilo="oncosystem"] #app-shell .modal-overlay { background: rgba(15, 17, 26, 0.45); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
:root[data-estilo="oncosystem"] #app-shell .modal-box { border-radius: 18px; border: 1px solid var(--border); box-shadow: 0 24px 60px rgba(15, 17, 26, 0.25); }
:root[data-estilo="oncosystem"] #app-shell .modal-box h3 { letter-spacing: -0.01em; }
:root[data-estilo="oncosystem"] #app-shell .empty-state { color: var(--text-muted); }
:root[data-estilo="oncosystem"] #app-shell .notif-bell-btn { background: var(--card-bg); border-color: var(--border); box-shadow: var(--shadow); }
:root[data-estilo="oncosystem"] #app-shell .notif-badge { background: #ef4444; }
:root[data-estilo="oncosystem"] #app-shell .notif-panel { border-radius: 14px; border: 1px solid var(--border); box-shadow: var(--tm-sombra-alta); }

/* ---------- celular: a barra lateral vira faixa rolável no topo ---------- */
@media (max-width: 820px) {
  :root[data-estilo="oncosystem"] #app-shell .sidebar { border-right: 0; border-bottom: 1px solid var(--border); }
  :root[data-estilo="oncosystem"] #app-shell .inicio-card { padding: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  :root[data-estilo="oncosystem"] #app-shell .inicio-card, :root[data-estilo="oncosystem"] #app-shell .kpi-card { transition: none; }
  :root[data-estilo="oncosystem"] #app-shell .inicio-card:hover, :root[data-estilo="oncosystem"] #app-shell .kpi-card:hover { transform: none; }
}

@media print {
  :root[data-estilo="oncosystem"] #app-shell { background: #fff; }
}
