/* ================================================================
   Salvus — Design System Layer  (additive; loaded after vigilops.css)
   Identidade: Segurança (índigo) + Saúde/SST (teal) — "Salvus"
   ================================================================ */

:root {
  --salvus-1: #4f46e5;          /* índigo — segurança / confiança */
  --salvus-2: #0ea5a4;          /* teal — saúde / conformidade   */
  --salvus-grad:      linear-gradient(135deg, #4f46e5 0%, #0ea5a4 100%);
  --salvus-grad-rev:  linear-gradient(135deg, #0ea5a4 0%, #4f46e5 100%);
  --salvus-soft:      linear-gradient(135deg, rgba(79,70,229,.10), rgba(14,165,164,.08));
  --ok:    #059669;
  --warn:  #d97706;
  --danger:#dc2626;
}

/* ── Marca ───────────────────────────────────────────── */
.logo-icon {
  background: var(--salvus-grad) !important;
  box-shadow: 0 6px 18px rgba(14,165,164,.32) !important;
}
.sidebar-brand {
  background: var(--salvus-grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -.02em;
}

/* ── Botões primários → gradiente da marca ───────────── */
.btn-primary {
  background-image: var(--salvus-grad);
  background-color: var(--salvus-1);
  border: none;
  box-shadow: 0 4px 14px rgba(79,70,229,.22);
}
.btn-primary:hover, .btn-primary:focus { filter: brightness(1.06); background-image: var(--salvus-grad); border:none; }
.btn-outline-primary { color: var(--salvus-1); border-color: rgba(79,70,229,.4); }
.btn-outline-primary:hover { background: var(--salvus-1); border-color: var(--salvus-1); }
.text-primary { color: var(--salvus-1) !important; }

/* ── Icon chip (cabeçalhos / KPIs / listas) ──────────── */
.icon-chip {
  width: 42px; height: 42px; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.05rem; flex-shrink: 0;
}
.icon-chip.sm { width: 34px; height: 34px; border-radius: 10px; font-size: .9rem; }
.icon-chip.lg { width: 52px; height: 52px; border-radius: 15px; font-size: 1.35rem; }
.chip-indigo { background: rgba(79,70,229,.12);  color: #4f46e5; }
.chip-teal   { background: rgba(14,165,164,.14); color: #0d9488; }
.chip-blue   { background: rgba(37,99,235,.12);  color: #1d4ed8; }
.chip-green  { background: rgba(5,150,105,.12);  color: #059669; }
.chip-amber  { background: rgba(217,119,6,.15);  color: #b45309; }
.chip-red    { background: rgba(220,38,38,.12);  color: #dc2626; }
.chip-purple { background: rgba(124,58,237,.12); color: #7c3aed; }
.chip-slate  { background: rgba(100,116,139,.14);color: #475569; }
.chip-cyan   { background: rgba(8,145,178,.13);  color: #0e7490; }

/* ── Cabeçalhos de secção / cartões ──────────────────── */
.section-title {
  display: flex; align-items: center; gap: .65rem;
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800;
  font-size: 1.2rem; letter-spacing: -.02em; margin: 0;
}
.vigilops-card .card-header { font-weight: 700; letter-spacing: -.01em; border-bottom: 1px solid var(--border); }
.vigilops-card:hover { transform: translateY(-1px); }

/* ── Mini-guia (page help) — legível no tema claro ───── */
.page-help {
  display: flex; align-items: flex-start; gap: .7rem;
  background: var(--salvus-soft);
  border: 1px solid rgba(79,70,229,.20);
  border-left: 3px solid var(--salvus-1);
  border-radius: 12px; padding: .72rem .95rem; margin-bottom: 1.1rem;
}
.page-help > i { margin-top: .12rem; color: var(--salvus-1); font-size: 1rem; }
.page-help .ph-text { font-size: .86rem; line-height: 1.45; color: #334155; }
.page-help .ph-text strong { color: #1e293b; }

/* ── KPI: variantes extra (indigo/amber/cyan) ────────── */
.kpi-indigo { background: linear-gradient(135deg, rgba(79,70,229,.09), rgba(79,70,229,.02)); border-color: rgba(79,70,229,.22); }
.kpi-indigo .kpi-icon  { background: rgba(79,70,229,.12); color: #4f46e5; }
.kpi-indigo .kpi-value { color: #4338ca; }
.kpi-amber  { background: linear-gradient(135deg, rgba(217,119,6,.09), rgba(217,119,6,.02)); border-color: rgba(217,119,6,.22); }
.kpi-amber  .kpi-icon  { background: rgba(217,119,6,.13); color: #b45309; }
.kpi-amber  .kpi-value { color: #92400e; }
.kpi-cyan   { background: linear-gradient(135deg, rgba(8,145,178,.09), rgba(8,145,178,.02)); border-color: rgba(8,145,178,.22); }
.kpi-cyan   .kpi-icon  { background: rgba(8,145,178,.13); color: #0e7490; }
.kpi-cyan   .kpi-value { color: #155e75; }

/* KPI clicável */
a.kpi-card { text-decoration: none; cursor: pointer; }
a.kpi-card:hover { transform: translateY(-3px); }

/* ── Cartão "tile" de atalho ─────────────────────────── */
.salvus-tile {
  display: flex; align-items: center; gap: 14px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 16px 18px;
  text-decoration: none; color: var(--text);
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
  box-shadow: var(--shadow); height: 100%;
}
.salvus-tile:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); border-color: var(--border-2); color: var(--text); }
.salvus-tile .tile-title { font-weight: 700; font-size: .95rem; }
.salvus-tile .tile-sub   { font-size: .78rem; color: var(--text-2); }

/* ── Barra de progresso de conformidade ──────────────── */
.compliance-bar { height: 10px; border-radius: 99px; background: var(--bg-hover); overflow: hidden; }
.compliance-bar > span { display: block; height: 100%; border-radius: 99px; background: var(--salvus-grad); }

/* ── Matriz de risco 5×5 ─────────────────────────────── */
.risk-matrix { border-collapse: separate; border-spacing: 4px; }
.risk-matrix td, .risk-matrix th { text-align: center; vertical-align: middle; font-size: .8rem; }
.risk-matrix .cell {
  width: 58px; height: 50px; border-radius: 9px; font-weight: 800; color: #fff;
  display: flex; align-items: center; justify-content: center; flex-direction: column;
  transition: transform var(--t); cursor: default;
}
.risk-matrix .cell:hover { transform: scale(1.06); }
.risk-matrix .cell small { font-weight: 600; opacity: .85; font-size: .6rem; }
.risk-low      { background: #16a34a; }
.risk-medium   { background: #ca8a04; }
.risk-high     { background: #ea580c; }
.risk-critical { background: #dc2626; }
.risk-axis { color: var(--text-3); font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; }

/* Selo de nível de risco */
.risk-pill { padding: 3px 10px; border-radius: 99px; font-size: .72rem; font-weight: 700; }
.risk-pill.low      { background: rgba(22,163,74,.12);  color: #15803d; }
.risk-pill.medium   { background: rgba(202,138,4,.14);  color: #a16207; }
.risk-pill.high     { background: rgba(234,88,12,.14);  color: #c2410c; }
.risk-pill.critical { background: rgba(220,38,38,.14);  color: #b91c1c; }

/* ── Anel de pontuação (resultado de inspeção/risco) ─── */
.score-ring {
  width: 110px; height: 110px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; position: relative;
  background: conic-gradient(var(--ring-color, #4f46e5) calc(var(--pct, 0) * 1%), var(--bg-hover) 0);
}
.score-ring::before { content: ''; position: absolute; inset: 9px; border-radius: 50%; background: var(--bg-card); }
.score-ring .sr-val { position: relative; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 1.55rem; line-height: 1; }
.score-ring .sr-sub { position: relative; font-size: .62rem; color: var(--text-2); margin-top: 2px; }
.score-pass    { --ring-color: #059669; }
.score-partial { --ring-color: #d97706; }
.score-fail    { --ring-color: #dc2626; }
.score-ring.low      { --ring-color: #16a34a; }
.score-ring.medium   { --ring-color: #ca8a04; }
.score-ring.high     { --ring-color: #ea580c; }
.score-ring.critical { --ring-color: #dc2626; }

/* "Hero" de resultado */
.result-hero { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.result-hero .rh-title { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 1.35rem; letter-spacing: -.02em; }

/* PDCA badge */
.pdca { padding: 2px 9px; border-radius: 7px; font-size: .7rem; font-weight: 800; letter-spacing: .03em; }
.pdca-plan  { background: rgba(37,99,235,.12);  color: #1d4ed8; }
.pdca-do    { background: rgba(217,119,6,.14);  color: #b45309; }
.pdca-check { background: rgba(124,58,237,.12); color: #6d28d9; }
.pdca-act   { background: rgba(5,150,105,.12);  color: #047857; }

/* ── Badges refinados (mais "premium") ──────────────── */
.badge { font-weight: 600; letter-spacing: .2px; padding: .42em .72em; border-radius: 7px; }
.badge.rounded-pill { border-radius: 99px; }
.badge.bg-success { background-color: rgba(5,150,105,.13) !important; color: #047857 !important; }
.badge.bg-danger  { background-color: rgba(220,38,38,.13) !important; color: #b91c1c !important; }
.badge.bg-warning { background-color: rgba(217,119,6,.16) !important; color: #b45309 !important; }
.badge.bg-secondary { background-color: rgba(100,116,139,.14) !important; color: #475569 !important; }
.badge.bg-info    { background-color: rgba(8,145,178,.13) !important; color: #0e7490 !important; }
.badge.bg-primary { background-color: rgba(79,70,229,.13) !important; color: #4338ca !important; }
/* badges "sólidos" (mantêm cor cheia quando precisam de destaque) */
.badge.badge-solid.bg-danger { background-color: #dc2626 !important; color:#fff !important; }

/* ── Tabelas: linhas clicáveis com leve destaque ─────── */
.table > tbody > tr { transition: background var(--t); }
.table tbody tr[onclick] { cursor: pointer; }

/* ── Alertas inteligentes (faixa do dashboard) ───────── */
.alert-strip { display: flex; gap: .8rem; flex-wrap: wrap; }
.atile {
  display: flex; align-items: center; gap: .9rem; padding: .85rem 1.1rem;
  border-radius: 16px; text-decoration: none; border: 1px solid;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  min-width: 218px; position: relative; overflow: hidden;
}
.atile::after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; }
.atile:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.atile .at-icon {
  width: 44px; height: 44px; border-radius: 13px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
}
.atile .at-body { display: flex; flex-direction: column; line-height: 1.05; }
.atile .at-count { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 1.7rem; }
.atile .at-label { font-size: .8rem; font-weight: 600; opacity: .9; margin-top: 2px; }

.atile-danger  { background: linear-gradient(135deg, rgba(220,38,38,.10), rgba(220,38,38,.03)); border-color: rgba(220,38,38,.28); color: #b91c1c; }
.atile-danger::after  { background: #dc2626; }
.atile-danger  .at-icon { background: rgba(220,38,38,.15); color: #dc2626; }
.atile-warning { background: linear-gradient(135deg, rgba(217,119,6,.11), rgba(217,119,6,.03)); border-color: rgba(217,119,6,.28); color: #b45309; }
.atile-warning::after { background: #d97706; }
.atile-warning .at-icon { background: rgba(217,119,6,.16); color: #d97706; }
.atile-info    { background: linear-gradient(135deg, rgba(8,145,178,.10), rgba(8,145,178,.03)); border-color: rgba(8,145,178,.26); color: #0e7490; }
.atile-info::after    { background: #0891b2; }
.atile-info    .at-icon { background: rgba(8,145,178,.15); color: #0891b2; }
.atile-ok      { background: linear-gradient(135deg, rgba(5,150,105,.10), rgba(5,150,105,.03)); border-color: rgba(5,150,105,.26); color: #047857; gap: .7rem; }
.atile-ok::after      { background: #059669; }
.atile-ok      .at-icon { background: rgba(5,150,105,.15); color: #059669; }
/* críticos pulsam suavemente para chamar a atenção */
.atile-danger { animation: atile-pulse 2.6s ease-in-out infinite; }
@keyframes atile-pulse { 0%,100%{ box-shadow: 0 0 0 0 rgba(220,38,38,0); } 50%{ box-shadow: 0 0 0 4px rgba(220,38,38,.10); } }

/* Destaque "atribuído a si" em listas de tarefas */
.task-mine { background: rgba(79,70,229,.06) !important; box-shadow: inset 3px 0 0 var(--salvus-1); }
.badge-mine { background: var(--salvus-grad); color: #fff; padding: 2px 9px; border-radius: 99px; font-size: .68rem; font-weight: 700; }

/* ── Banner fixo de alertas inteligentes ─────────────── */
.alert-banner {
  position: fixed; left: var(--sidebar-w); right: 0; bottom: 0; z-index: 1040;
  display: flex; align-items: center; gap: .85rem; padding: .55rem .9rem;
  background: var(--bg-surface); border-top: 1px solid var(--border);
  box-shadow: 0 -8px 28px rgba(15,23,42,.12);
  animation: ab-up .35s cubic-bezier(.4,0,.2,1);
}
@keyframes ab-up { from { transform: translateY(110%); } to { transform: translateY(0); } }
.alert-banner .ab-icon {
  width: 36px; height: 36px; border-radius: 11px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(220,38,38,.13); color: #dc2626;
  animation: atile-pulse 2.4s ease-in-out infinite;
}
.alert-banner .ab-title { font-weight: 700; font-size: .82rem; color: var(--text); white-space: nowrap; }
.alert-banner .ab-items { display: flex; gap: .5rem; overflow-x: auto; flex: 1; padding: .15rem 2px; }
.alert-banner .ab-items::-webkit-scrollbar { height: 4px; }
.ab-pill {
  white-space: nowrap; text-decoration: none; padding: .32rem .75rem; border-radius: 99px;
  font-size: .8rem; font-weight: 600; border: 1px solid; display: inline-flex; align-items: center; gap: .4rem;
  transition: transform .12s ease;
}
.ab-pill:hover { transform: translateY(-1px); }
.ab-pill strong { font-weight: 800; font-family: 'Plus Jakarta Sans', sans-serif; }
.ab-danger  { background: rgba(220,38,38,.08);  border-color: rgba(220,38,38,.30);  color: #b91c1c; }
.ab-warning { background: rgba(217,119,6,.10);   border-color: rgba(217,119,6,.30);  color: #b45309; }
.ab-info    { background: rgba(8,145,178,.08);   border-color: rgba(8,145,178,.28);  color: #0e7490; }
.ab-close {
  border: 0; background: transparent; color: var(--text-3); width: 34px; height: 34px;
  border-radius: 9px; flex-shrink: 0; cursor: pointer; transition: all var(--t);
}
.ab-close:hover { background: var(--bg-hover); color: var(--text); }
@media (max-width: 991px) { .alert-banner { left: 0; } }
.has-alert-banner .page-content { padding-bottom: 74px; }

/* ── Sininho de notificações ─────────────────────────── */
.notif-bell-anim { animation: bell-pulse 2s ease-in-out infinite; }
@keyframes bell-pulse { 0%,100%{transform:rotate(0);} 5%{transform:rotate(12deg);} 10%{transform:rotate(-10deg);} 15%{transform:rotate(8deg);} 20%{transform:rotate(0);} }

.notif-dot {
  position: absolute; top: -3px; right: -3px; min-width: 17px; height: 17px;
  padding: 0 4px; border-radius: 99px; background: var(--danger); color: #fff;
  font-size: .64rem; font-weight: 700; line-height: 17px; text-align: center;
}
.notif-menu { border: 1px solid var(--border); box-shadow: var(--shadow-lg); border-radius: 12px; }
.notif-unread { background: rgba(79,70,229,.05); }
.notif-unread:hover { background: rgba(79,70,229,.09); }

/* ── Organograma (árvore de graus) ───────────────────── */
.org-card {
  display: flex; align-items: center; gap: .8rem; background: var(--bg-card);
  border: 1px solid var(--border); border-radius: 13px; padding: .6rem .9rem;
  box-shadow: var(--shadow); margin: .4rem 0; max-width: 540px;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.org-card:hover { transform: translateX(2px); box-shadow: var(--shadow-lg); border-color: var(--border-2); }
.org-card .oc-chip {
  width: 40px; height: 40px; border-radius: 11px; flex-shrink: 0; color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 800;
  font-family: 'Plus Jakarta Sans', sans-serif; background: var(--salvus-grad);
}
.org-card .oc-title { font-weight: 700; letter-spacing: -.01em; }
.org-card .oc-meta { font-size: .74rem; color: var(--text-2); }
.org-children { margin-left: 19px; padding-left: 22px; border-left: 2px solid var(--border-2); }

/* Badge de contagem nos links do sidebar */
.nav-badge {
  margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px;
  background: var(--salvus-grad); color: #fff; font-size: .68rem; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center; line-height: 1;
  box-shadow: 0 2px 6px rgba(79,70,229,.35);
}

/* ── Toasts (mensagens) ──────────────────────────────── */
.salvus-toast { border: 1px solid var(--border); border-left-width: 4px; border-radius: 12px;
  box-shadow: var(--shadow-lg); background: var(--bg-surface); }
.salvus-toast .toast-body { color: var(--text); font-size: .9rem; }
.toast-success { border-left-color: #059669; }
.toast-success .ti { color: #059669; }
.toast-danger,  .toast-error { border-left-color: #dc2626; }
.toast-danger .ti, .toast-error .ti { color: #dc2626; }
.toast-warning { border-left-color: #d97706; }
.toast-warning .ti { color: #d97706; }
.toast-info,    .toast-debug { border-left-color: #0891b2; }
.toast-info .ti, .toast-debug .ti { color: #0891b2; }

/* Pequenos ajustes globais */
.navbar-title { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 700; letter-spacing: -.01em; }
.sidebar-link.active { font-weight: 600; }
