/* ================================================================
   Sistema de Gestao de Demandas - estilos globais
   Design 2026: SaaS moderno e premium (inspirado em Linear/Notion/
   ClickUp/Asana, sem copiar nenhum) - Inter, paleta azul equilibrada,
   sidebar escura sofisticada, cards com whitespace generoso.
   ================================================================ */

:root{
  --pill-ativo-bg:#172033;
  --pill-ativo-texto:#ffffff;
  --azul:#2563EB;
  --azul-escuro:#1D4ED8;
  --azul-claro:#3B82F6;
  --azul-bg:#EFF6FF;
  --fundo:#F8FAFC;
  --card:#FFFFFF;
  --borda:#E2E8F0;
  --borda-forte:#CBD5E1;
  --texto:#172033;
  --texto-suave:#64748B;
  --texto-fraco:#94A3B8;
  --verde:#10B981;
  --verde-bg:#D1FAE5;
  --vermelho:#EF4444;
  --vermelho-bg:#FEE2E2;
  --amarelo:#F59E0B;
  --amarelo-bg:#FEF3C7;
  --roxo:#8B5CF6;
  --roxo-bg:#F3E8FF;
  --raio:12px;
  --raio-sm:8px;
  --raio-lg:16px;
  --sombra:0 1px 2px rgba(15,23,42,.04),0 1px 3px rgba(15,23,42,.06);
  --sombra-md:0 4px 12px rgba(15,23,42,.08);
  --sombra-lg:0 16px 40px rgba(15,23,42,.14);
  --transicao:160ms cubic-bezier(.4,0,.2,1);
  --sidebar-de:#101A3D;
  --sidebar-para:#0A122B;
  --sidebar-texto:rgba(255,255,255,.66);
  --sidebar-texto-forte:#fff;
  --sidebar-borda:rgba(255,255,255,.09);
  --sidebar-hover:rgba(255,255,255,.07);
  --sidebar-ativo:rgba(59,130,246,.22);

  /* Paleta semantica de urgencia/status - usada em badges, icones de KPI e
     abas ativas (Por status / Atencao / filtros rapidos de Demandas).
     Fixa entre temas (o alfa ja adapta o fundo ao claro/escuro). */
  --sem-critico:#EF4444;    --sem-critico-bg:#EF444426;    /* atrasado / critico */
  --sem-urgente:#F97316;    --sem-urgente-bg:#F9731626;    /* urgente / vence hoje */
  --sem-atencao:#EAB308;    --sem-atencao-bg:#EAB30826;    /* atencao / vence em 7 dias */
  --sem-neutro:#64748B;     --sem-neutro-bg:#64748B26;     /* neutro / pendente / aguardando */
  --sem-andamento:#3B82F6;  --sem-andamento-bg:#3B82F626;  /* em andamento */
  --sem-concluido:#22C55E;  --sem-concluido-bg:#22C55E26;  /* concluido */
  --sem-cancelado:#475569;  --sem-cancelado-bg:#47556926;  /* cancelado */
}

:root[data-theme="dark"]{
  --fundo:#0B1120;
  --card:#131B2C;
  --borda:#232E44;
  --borda-forte:#2E3B56;
  --texto:#EEF2F9;
  --texto-suave:#93A0B8;
  --texto-fraco:#5D6B85;
  --verde-bg:#0C2B21;
  --vermelho-bg:#341419;
  --amarelo-bg:#332209;
  --azul-bg:#0F1D3D;
  --roxo-bg:#241A44;
  --sidebar-de:#080D1F;
  --sidebar-para:#050813;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body{
  font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  background:var(--fundo);color:var(--texto);font-size:14px;line-height:1.55;
  font-feature-settings:'cv11','ss01';
  transition:background var(--transicao),color var(--transicao);
}
a{color:inherit;text-decoration:none;}
.hidden{display:none!important;}
button{font-family:inherit;cursor:pointer;}
svg{display:block;flex-shrink:0;}
::selection{background:var(--azul-bg);}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:#D6DEE8;border-radius:20px;}
:root[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#2c3a4d;}
:focus-visible{outline:2px solid var(--azul);outline-offset:2px;}

/* ---------- Login ---------- */
#tela-login{
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:linear-gradient(160deg,var(--sidebar-de) 0%,var(--sidebar-para) 100%);padding:52px 24px 40px;overflow-y:auto;
}
.login-card{
  background:#fff;border-radius:var(--raio-lg);padding:36px;width:min(400px,calc(100vw - 48px));
  box-shadow:0 24px 60px rgba(5,10,25,.35);animation:subir .45s cubic-bezier(.16,1,.3,1) both;
}
@keyframes subir{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
.login-marca{display:flex;align-items:center;gap:12px;margin-bottom:26px;}
.login-marca .icone-marca{
  width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--azul),var(--azul-escuro));
  display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;box-shadow:0 6px 16px rgba(37,99,235,.35);
}
.login-card h1{font-size:17px;font-weight:700;letter-spacing:-.01em;color:#172033;}
.login-card p.subtitulo{color:#64748B;font-size:12.5px;margin-top:2px;}
.campo-login{margin-bottom:16px;}
.campo-login label{display:block;font-size:13px;font-weight:600;color:#172033;margin-bottom:6px;}
.login-card input{
  width:100%;padding:10px 14px;border:1.5px solid #E2E8F0;border-radius:var(--raio-sm);font-size:14px;
  transition:border-color var(--transicao), box-shadow var(--transicao);background:#fff;color:#172033;
}
.login-card input:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px var(--azul-bg);}
.login-card button{
  width:100%;padding:11px 16px;background:var(--azul);color:#fff;border:none;border-radius:var(--raio-sm);
  font-weight:600;font-size:13.5px;letter-spacing:-.1px;margin-top:8px;transition:background var(--transicao),box-shadow var(--transicao),transform var(--transicao);
  box-shadow:0 4px 12px rgba(37,99,235,.28);
  display:flex;align-items:center;justify-content:center;gap:7px;
}
.login-card button:hover{background:var(--azul-escuro);box-shadow:0 6px 18px rgba(37,99,235,.4);transform:translateY(-1px);}
.login-card button:disabled{opacity:.6;cursor:default;transform:none;}
.login-erro{color:var(--vermelho);font-size:12.5px;margin-bottom:12px;min-height:16px;font-weight:500;}
.vl-footer{margin-top:24px;font-size:11.5px;color:rgba(255,255,255,.45);text-align:center;flex-shrink:0;}
.vl-footer strong{color:rgba(255,255,255,.75);}
.login-demo{background:#F4F7FB;border:1px dashed #C7D4E3;border-radius:var(--raio-sm);padding:11px 13px;font-size:11.5px;color:#64748B;margin-top:18px;line-height:1.65;}
.login-demo strong{color:#172033;}

/* ---------- Layout ---------- */
#app{display:none;min-height:100vh;grid-template-columns:252px minmax(0,1fr);}
#app.ativo{display:grid;}
.sidebar{
  background:linear-gradient(180deg,var(--sidebar-de) 0%,var(--sidebar-para) 100%);
  color:var(--sidebar-texto-forte);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto;
  transition:left var(--transicao);
}
.sidebar .logo-area{padding:20px 20px 18px;border-bottom:1px solid var(--sidebar-borda);margin-bottom:8px;display:flex;flex-direction:column;align-items:flex-start;gap:0;}
.sidebar .logo-area .logo-sabesp{height:60px;width:auto;max-width:100%;object-fit:contain;margin-bottom:16px;}
.sidebar .logo-area .logo-area-titulo{font-size:16px;font-weight:700;color:var(--sidebar-texto-forte);letter-spacing:-.01em;line-height:1.2;margin-bottom:3px;}
.sidebar .logo-area span{font-size:10.5px;color:rgba(255,255,255,.4);font-weight:600;letter-spacing:.03em;line-height:1.2;}
.nav-secao{padding:0 16px;font-size:10px;text-transform:uppercase;letter-spacing:1.3px;color:rgba(255,255,255,.32);margin-top:22px;margin-bottom:8px;font-weight:700;}
.nav-secao:first-of-type{margin-top:14px;}
.nav-item{
  position:relative;display:flex;align-items:center;gap:10px;padding:8px 14px;margin:2px 10px;border-radius:var(--raio-sm);
  font-size:13.5px;color:var(--sidebar-texto);cursor:pointer;transition:background var(--transicao),color var(--transicao);white-space:nowrap;
  font-weight:500;
}
.nav-item svg{opacity:.85;transition:opacity var(--transicao);}
.nav-item:hover{background:var(--sidebar-hover);color:#fff;}
.nav-item:hover svg{opacity:1;}
.nav-item.ativo{background:var(--sidebar-ativo);color:#fff;font-weight:600;}
.nav-item.ativo svg{opacity:1;color:#7EB2FF;}
.nav-item.ativo::before{content:'';position:absolute;left:-10px;top:50%;transform:translateY(-50%);width:3px;height:18px;border-radius:0 4px 4px 0;background:var(--azul-claro);}
.nav-item .contagem{margin-left:auto;background:rgba(255,255,255,.14);padding:1px 7px;border-radius:20px;font-size:10.5px;font-weight:700;}

.perfil-card{margin-top:auto;margin:10px;padding:10px;border-radius:var(--raio-sm);background:rgba(255,255,255,.05);border:1px solid var(--sidebar-borda);display:flex;align-items:center;gap:9px;}
.rodape-user{display:contents;}
.avatar{width:32px;height:32px;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0;}
.avatar.pequeno{width:24px;height:24px;font-size:10.5px;}
.avatar.grande{width:56px;height:56px;font-size:20px;}
.rodape-user-info{flex:1;min-width:0;}
.rodape-user-nome{font-size:12.5px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.rodape-user-perfil{font-size:11px;color:rgba(255,255,255,.42);text-transform:capitalize;}
.btn-icone{
  background:none;border:none;color:var(--texto-fraco);padding:6px;border-radius:var(--raio-sm);display:flex;cursor:pointer;flex-shrink:0;
  transition:background var(--transicao),color var(--transicao);
}
.btn-icone:hover{background:rgba(15,23,42,.06);color:var(--texto);}
:root[data-theme="dark"] .btn-icone:hover{background:rgba(255,255,255,.08);}
.sidebar .btn-icone{color:rgba(255,255,255,.4);}
.sidebar .btn-icone:hover{background:rgba(255,255,255,.1);color:#fff;}

/* ---------- Topbar ---------- */
.topbar{
  display:flex;align-items:center;gap:16px;padding:13px 32px;background:var(--card);border-bottom:1px solid var(--borda);
  position:sticky;top:0;z-index:20;
}
.topbar .busca-global{position:relative;flex:1;max-width:440px;}
.topbar .busca-global input{
  width:100%;padding:9px 14px 9px 36px;border:1.5px solid var(--borda);border-radius:10px;font-size:13.5px;
  font-family:inherit;background:var(--fundo);color:var(--texto);transition:border-color var(--transicao), box-shadow var(--transicao), background var(--transicao);
}
.topbar .busca-global input::placeholder{color:var(--texto-fraco);}
.topbar .busca-global input:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 4px var(--azul-bg);background:var(--card);}
.topbar .busca-global svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--texto-fraco);pointer-events:none;}
.topbar-acoes{margin-left:auto;display:flex;align-items:center;gap:6px;}
.painel-resultado-busca{
  position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--card);border:1px solid var(--borda);border-radius:var(--raio);
  box-shadow:var(--sombra-lg);max-height:420px;overflow-y:auto;z-index:60;
}
.painel-resultado-busca .grupo{padding:8px 6px;}
.painel-resultado-busca .grupo-titulo{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--texto-fraco);font-weight:700;padding:4px 10px;}
.painel-resultado-busca .item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--raio-sm);cursor:pointer;font-size:13px;transition:background var(--transicao);}
.painel-resultado-busca .item:hover{background:var(--fundo);}
.painel-resultado-busca .vazio{padding:20px;text-align:center;color:var(--texto-suave);font-size:12.5px;}

/* ---------- Notificacoes ---------- */
.sino-wrap{position:relative;}
.badge-contador{
  position:absolute;top:-3px;right:-3px;background:var(--vermelho);color:#fff;font-size:9.5px;font-weight:700;
  min-width:16px;height:16px;border-radius:20px;display:flex;align-items:center;justify-content:center;padding:0 3px;
  box-shadow:0 0 0 2px var(--card);
}
.painel-notificacoes{
  position:absolute;top:calc(100% + 12px);right:32px;width:380px;max-height:480px;overflow-y:auto;background:var(--card);
  border:1px solid var(--borda);border-radius:var(--raio-lg);box-shadow:0 20px 45px rgba(15,23,42,.16),0 4px 14px rgba(15,23,42,.08);z-index:60;
}
.painel-notificacoes .cabecalho{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--borda);position:sticky;top:0;background:var(--card);border-radius:var(--raio-lg) var(--raio-lg) 0 0;}
.painel-notificacoes .cabecalho h3{font-size:14px;font-weight:700;}
.painel-notificacoes .cabecalho h3 .contador-titulo{color:var(--azul);font-weight:700;}
.painel-notificacoes .link-acao{font-size:12px;color:var(--azul);font-weight:600;background:none;border:none;}
.notificacoes-grupo-titulo{padding:10px 16px 6px;font-size:10.5px;font-weight:700;color:var(--texto-fraco);text-transform:uppercase;letter-spacing:.05em;}
.notificacao-item{display:flex;gap:11px;padding:12px 16px;border-bottom:1px solid var(--borda);cursor:pointer;transition:background var(--transicao);}
.notificacao-item:hover{background:var(--fundo);}
.notificacao-item.nao-lida{background:var(--azul-bg);}
.notificacao-item.nao-lida:hover{background:var(--azul-bg);filter:brightness(.97);}
.notificacao-icone{
  width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;
}
.notificacao-item .conteudo{flex:1;min-width:0;}
.notificacao-topo{display:flex;align-items:baseline;justify-content:space-between;gap:10px;}
.notificacao-item .titulo{font-size:13.5px;font-weight:700;color:var(--texto);}
.notificacao-meta-direita{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.ponto-notif{width:7px;height:7px;border-radius:50%;background:var(--azul);flex-shrink:0;}
.notificacao-item .tempo{font-size:10.5px;color:var(--texto-fraco);white-space:nowrap;}
.badge-codigo-demanda{display:inline-block;margin-top:5px;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:700;background:var(--azul-bg);color:var(--azul-escuro);}

/* ---------- Conteudo / paginas ---------- */
.conteudo{padding:28px 32px 60px;overflow-y:auto;max-height:calc(100vh - 58px);}
.conteudo h1.titulo-pagina{font-size:23px;font-weight:800;letter-spacing:-.02em;color:var(--texto);}
.conteudo p.descricao-pagina{color:var(--texto-suave);font-size:13px;margin-top:4px;margin-bottom:22px;font-weight:450;}
.cabecalho-pagina{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px;flex-wrap:wrap;}

/* ---------- Cards / stats ---------- */
.grupo-kpis{margin-bottom:6px;}
.grupo-kpis-titulo{font-size:11px;font-weight:700;color:var(--texto-fraco);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;}
.cards-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:24px;}
.card-stat{
  background:var(--card);border:1px solid var(--borda);border-radius:var(--raio);padding:17px 19px;
  box-shadow:var(--sombra);display:flex;flex-direction:column;gap:9px;transition:transform var(--transicao),box-shadow var(--transicao),border-color var(--transicao);cursor:pointer;
}
.card-stat:hover{transform:translateY(-2px);box-shadow:var(--sombra-md);border-color:var(--borda-forte);}
.card-stat .icone-stat{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;}
.card-stat.azul .icone-stat{background:var(--azul-bg);color:var(--azul);}
.card-stat.verde .icone-stat{background:var(--verde-bg);color:var(--verde);}
.card-stat.vermelho .icone-stat{background:var(--vermelho-bg);color:var(--vermelho);}
.card-stat.amarelo .icone-stat{background:var(--amarelo-bg);color:var(--amarelo);}
.card-stat.roxo .icone-stat{background:var(--roxo-bg);color:var(--roxo);}
.card-stat.cinza .icone-stat{background:var(--fundo);color:var(--texto-suave);}
/* Paleta semantica de urgencia/status (ver :root) - usada no Dashboard. */
.card-stat.sem-critico .icone-stat{background:var(--sem-critico-bg);color:var(--sem-critico);}
.card-stat.sem-urgente .icone-stat{background:var(--sem-urgente-bg);color:var(--sem-urgente);}
.card-stat.sem-atencao .icone-stat{background:var(--sem-atencao-bg);color:var(--sem-atencao);}
.card-stat.sem-neutro .icone-stat{background:var(--sem-neutro-bg);color:var(--sem-neutro);}
.card-stat.sem-andamento .icone-stat{background:var(--sem-andamento-bg);color:var(--sem-andamento);}
.card-stat.sem-concluido .icone-stat{background:var(--sem-concluido-bg);color:var(--sem-concluido);}
.card-stat .valor{font-size:27px;font-weight:800;letter-spacing:-.02em;line-height:1;color:var(--texto);}
.card-stat .rotulo{font-size:12px;color:var(--texto-suave);font-weight:500;}
/* Destaque forte (usado em "Meu Trabalho" para Atrasadas/Vencem hoje quando > 0) -
   tinge o card inteiro, nao so' o icone, para ser a informacao mais visivel da tela. */
.card-stat.sem-critico.destaque{border-color:var(--sem-critico);background:var(--sem-critico-bg);}
.card-stat.sem-critico.destaque .valor{color:var(--sem-critico);}
.card-stat.sem-urgente.destaque{border-color:var(--sem-urgente);background:var(--sem-urgente-bg);}
.card-stat.sem-urgente.destaque .valor{color:var(--sem-urgente);}

.grid-2-colunas{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;align-items:start;}
.grid-3-colunas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
@media(max-width:1100px){.grid-2-colunas,.grid-3-colunas{grid-template-columns:1fr;}}

.painel{background:var(--card);border:1px solid var(--borda);border-radius:var(--raio);padding:20px 22px;margin-bottom:18px;box-shadow:var(--sombra);}
.painel h3{font-size:14.5px;font-weight:700;color:var(--texto);}
.painel .painel-cabecalho{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.painel .ver-tudo{font-size:12px;font-weight:600;color:var(--azul);}

.barra-progresso{width:100%;height:7px;background:var(--fundo);border-radius:20px;overflow:hidden;}
.barra-progresso > span{display:block;height:100%;background:var(--azul);border-radius:20px;transition:width .3s;}
.barra-progresso.pequena{height:5px;}

.lista-simples .linha-lista{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--borda);font-size:12.5px;}
.lista-simples .linha-lista:last-child{border-bottom:none;}
.lista-simples .linha-lista .rotulo{flex:1;color:var(--texto);font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lista-simples .linha-lista .valor{font-weight:700;color:var(--texto-suave);}
.lista-simples .linha-lista .barra-mini{flex:1;max-width:100px;}
.nota-poucos-dados{font-size:11.5px;color:var(--texto-fraco);margin-top:8px;}

/* ---------- Meu Trabalho ---------- */
.painel-prioritario{border-left:4px solid var(--sem-critico);background:var(--sem-critico-bg);}
.painel-prioritario .painel-cabecalho h3{display:inline-flex;align-items:center;gap:7px;color:var(--sem-critico);}
.painel-prioritario-ok{border-left:4px solid var(--sem-concluido);}
.painel-prioritario-ok .painel-cabecalho h3{display:inline-flex;align-items:center;gap:7px;color:var(--sem-concluido);}
.estado-vazio-inline{padding:14px 4px;color:var(--texto-suave);font-size:13px;font-weight:500;}

/* ---------- Estado vazio ---------- */
.estado-vazio{padding:52px 24px;text-align:center;color:var(--texto-suave);display:flex;flex-direction:column;align-items:center;}
.estado-vazio .icone-vazio-circulo{
  width:76px;height:76px;border-radius:50%;background:var(--azul-bg);color:var(--azul);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
}
.estado-vazio .titulo-vazio{font-size:15px;font-weight:700;color:var(--texto);margin-bottom:5px;}
.estado-vazio p{font-size:13px;max-width:320px;}
.estado-vazio .btn{margin-top:18px;}
.estado-carregando{padding:40px;text-align:center;color:var(--texto-fraco);font-size:13px;}

/* ---------- Tabela ---------- */
.tabela-scroll{overflow-x:auto;background:var(--card);border:1px solid var(--borda);border-radius:var(--raio);box-shadow:var(--sombra);}
table.tabela{width:100%;border-collapse:collapse;}
table.tabela th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--texto-fraco);font-weight:700;padding:12px 12px;border-bottom:1px solid var(--borda);white-space:nowrap;position:sticky;top:0;background:var(--card);cursor:pointer;user-select:none;transition:color var(--transicao);}
table.tabela th.ordenavel:hover{color:var(--azul);}
table.tabela td{padding:11px 12px;border-bottom:1px solid var(--borda);font-size:13px;vertical-align:middle;white-space:nowrap;color:var(--texto);}
table.tabela tr:last-child td{border-bottom:none;}
table.tabela tr:hover td{background:var(--fundo);}
table.tabela tr.linha-atrasada td:first-child{box-shadow:inset 3px 0 0 var(--vermelho);}
table.tabela td.col-truncar{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cel-forte{font-weight:600;}
.cel-checkbox{width:34px;}
.cel-titulo-demanda{display:flex;flex-direction:column;gap:2px;cursor:pointer;}
.cel-titulo-demanda .sub{font-size:11px;color:var(--texto-fraco);}
.linha-titulo-demanda{display:flex;align-items:flex-start;gap:9px;}
.circulo-concluir{
  width:18px;height:18px;border-radius:50%;border:1.5px solid var(--borda-forte);background:transparent;flex-shrink:0;
  margin-top:2px;display:flex;align-items:center;justify-content:center;color:transparent;padding:0;transition:all var(--transicao);
}
.circulo-concluir:hover{border-color:var(--verde);}
.circulo-concluir.concluido{background:var(--verde);border-color:var(--verde);color:#fff;}
.titulo-concluido{text-decoration:line-through;color:var(--texto-fraco)!important;}
input[type=checkbox]{accent-color:var(--azul);width:16px;height:16px;cursor:pointer;}

.badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;white-space:nowrap;}
.badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0;}
.badge.st-pendente{background:var(--sem-neutro-bg);color:var(--sem-neutro);}
.badge.st-em_andamento{background:var(--sem-andamento-bg);color:var(--sem-andamento);}
.badge.st-aguardando{background:var(--sem-neutro-bg);color:var(--sem-neutro);}
.badge.st-concluido{background:var(--sem-concluido-bg);color:var(--sem-concluido);}
.badge.st-cancelado{background:var(--sem-cancelado-bg);color:var(--sem-cancelado);}
.badge.prio-baixa{background:var(--sem-neutro-bg);color:var(--sem-neutro);}
.badge.prio-media{background:var(--sem-andamento-bg);color:var(--sem-andamento);}
.badge.prio-alta{background:var(--sem-atencao-bg);color:var(--sem-atencao);}
.badge.prio-urgente{background:var(--sem-urgente);color:#fff;box-shadow:0 0 0 3px var(--sem-urgente-bg);}
.badge.prio-opaca{background:var(--sem-neutro-bg);color:var(--sem-neutro);opacity:.8;}
/* Ciclo (retrabalho) usa roxo de proposito - e' outra dimensao (workflow),
   nao urgencia, entao fica fora da paleta semantica vermelho/laranja/verde. */
.badge-ciclo{background:var(--roxo-bg);color:var(--roxo);}
.badge-ciclo::before{display:none;}
.badge-ciclo svg{flex-shrink:0;}
.banner-ciclo{background:var(--roxo-bg);border:1px solid rgba(139,92,246,.25);border-radius:var(--raio-sm);padding:10px 14px;margin:10px 0 16px;font-size:12.5px;}
.banner-ciclo-titulo{display:flex;align-items:center;gap:6px;font-weight:700;color:var(--roxo);margin-bottom:4px;}
.banner-ciclo-item{padding:3px 0;color:var(--texto-suave);}
.banner-ciclo-item a{color:var(--roxo);font-weight:600;margin-left:6px;}
.badge.tag-generica{background:var(--fundo);color:var(--texto-suave);border:1px solid var(--borda);}
.badge.atraso{background:var(--sem-critico);color:#fff;}
.select-inline{border:none;background:transparent;font:inherit;font-weight:700;cursor:pointer;color:inherit;appearance:none;padding:4px 8px;border-radius:20px;}
select.badge-select{border-radius:20px;}
/* Garante que o popup nativo do <select> (options) respeite o tema -
   navegadores as vezes ignoram cor herdada do elemento pai no dropdown aberto. */
select, select option{background-color:var(--card);color:var(--texto);}

/* Select moderno: remove a aparencia padrao do navegador e desenha uma
   seta customizada, com estados de hover/focus consistentes com o resto
   da interface. Os selects "pilula" (select-inline, usados como badge
   editavel na tabela/detalhe) ficam de fora de proposito. */
select:not(.select-inline){
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding-right:34px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:16px;
  cursor:pointer;
}
select:not(.select-inline):hover{border-color:var(--borda-forte);}
select:not(.select-inline):focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 4px var(--azul-bg);}
select:not(.select-inline):disabled{opacity:.6;cursor:default;}
:root[data-theme="dark"] select:not(.select-inline){
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236B7A93' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}

/* ---------- Select customizado (App.melhorarSelect) ----------
   O <select> nativo continua existindo (escondido) como fonte de verdade do
   valor/evento "change" - todo o resto do app le/escuta ele normalmente. So'
   a aparencia de campo fechado + lista aberta e' substituida, porque nenhum
   navegador deixa estilizar o popup nativo de <option> via CSS. */
.select-custom{position:relative;}
.select-custom select.select-nativo-oculto{position:absolute;inset:0;opacity:0;pointer-events:none;width:100%;}
.select-custom-trigger{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 12px;border:1.5px solid var(--borda);border-radius:var(--raio-sm);
  background:var(--card);color:var(--texto);font-size:13.5px;font-family:inherit;font-weight:inherit;
  cursor:pointer;text-align:left;transition:border-color var(--transicao),box-shadow var(--transicao);
}
.select-custom-trigger:hover{border-color:var(--borda-forte);}
.select-custom-trigger:disabled{opacity:.6;cursor:default;}
.select-custom.aberto .select-custom-trigger{border-color:var(--azul);box-shadow:0 0 0 4px var(--azul-bg);}
.select-custom-valor{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.select-custom-valor.vazio{color:var(--texto-fraco);}
.select-custom-chevron{flex-shrink:0;color:var(--texto-fraco);transition:transform 180ms ease;}
.select-custom.aberto .select-custom-chevron{transform:rotate(180deg);}

.select-custom-lista{
  position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:120;
  background:var(--card);border:1px solid var(--borda);border-radius:10px;box-shadow:var(--sombra-lg);
  padding:6px;max-height:260px;overflow-y:auto;
  opacity:0;transform:translateY(-6px);pointer-events:none;
  transition:opacity 170ms ease,transform 170ms ease;
}
.select-custom.abre-cima .select-custom-lista{top:auto;bottom:calc(100% + 6px);transform:translateY(6px);}
.select-custom.aberto .select-custom-lista{opacity:1;transform:translateY(0);pointer-events:auto;}
.select-custom-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 12px;border-radius:8px;margin-bottom:2px;font-size:13.5px;color:var(--texto);
  cursor:pointer;transition:background 120ms ease;
}
.select-custom-item:last-child{margin-bottom:0;}
.select-custom-item:hover{background:#3B82F615;}
.select-custom-item.vazio{color:var(--texto-fraco);}
.select-custom-item.selecionado{background:var(--azul);color:#fff;font-weight:600;}
.select-custom-item.selecionado:hover{background:var(--azul);}
.select-custom-item svg{flex-shrink:0;}

.acoes-linha{display:flex;gap:6px;flex-wrap:nowrap;}

.btn{
  padding:8px 14px;border-radius:var(--raio-sm);border:1px solid var(--borda);background:var(--card);font-size:12.5px;
  color:var(--texto);font-weight:600;display:inline-flex;align-items:center;gap:6px;transition:all var(--transicao);white-space:nowrap;
}
.btn:hover{background:var(--fundo);border-color:var(--borda-forte);}
.btn.primario{background:var(--azul);color:#fff;border-color:var(--azul);box-shadow:0 2px 8px rgba(37,99,235,.25);}
.btn.primario:hover{background:var(--azul-escuro);border-color:var(--azul-escuro);box-shadow:0 4px 12px rgba(37,99,235,.35);}
.btn.perigo{color:var(--vermelho);border-color:#FCA5A5;}
.btn.perigo:hover{background:var(--vermelho-bg);border-color:var(--vermelho);}
.btn.sucesso{color:var(--verde);border-color:#6EE7B7;}
.btn.sucesso:hover{background:var(--verde-bg);}
.btn.fantasma{border-color:transparent;background:transparent;color:var(--texto-suave);}
.btn.fantasma:hover{background:var(--fundo);color:var(--texto);}
.btn:active{transform:scale(.97);}
.btn.grande{padding:10px 18px;font-size:13.5px;}
.btn:disabled{opacity:.5;cursor:default;transform:none;}

.barra-busca{
  display:flex;align-items:center;gap:9px;background:var(--card);border:1.5px solid var(--borda);border-radius:10px;
  padding:9px 14px;color:var(--texto-fraco);transition:border-color var(--transicao), box-shadow var(--transicao);flex:1;min-width:220px;
}
.barra-busca:focus-within{border-color:var(--azul);box-shadow:0 0 0 4px var(--azul-bg);}
.barra-busca input{flex:1;border:none;outline:none;font-size:13px;font-family:inherit;color:var(--texto);background:transparent;}
.barra-busca input::placeholder{color:var(--texto-fraco);}
.barra-ferramentas{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap;align-items:center;}

/* Abas / filtros rapidos */
.filtros{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap;}
.filtros button{
  display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;border:1px solid var(--borda);
  background:var(--card);font-size:12.5px;font-weight:600;color:var(--texto-suave);transition:all var(--transicao);
}
.filtros button svg{opacity:.75;}
.filtros button:hover{border-color:var(--borda-forte);color:var(--texto);background:var(--fundo);}
.filtros button.ativo{background:var(--pill-ativo-bg);color:var(--pill-ativo-texto);border-color:var(--pill-ativo-bg);box-shadow:var(--sombra);}
.filtros button.ativo svg{opacity:1;}
.filtros button.ativo.tab-urgente{background:var(--sem-urgente);border-color:var(--sem-urgente);}
.filtros button.ativo.tab-atrasada{background:var(--sem-critico);border-color:var(--sem-critico);}
.filtros button.ativo.tab-hoje{background:var(--sem-urgente);border-color:var(--sem-urgente);}
.filtros button.ativo.tab-atencao{background:var(--sem-atencao);border-color:var(--sem-atencao);}
.filtros button.ativo.tab-concluida{background:var(--sem-concluido);border-color:var(--sem-concluido);}
.filtros button.ativo.tab-minhas{background:var(--azul);border-color:var(--azul);}
.filtros button .contagem{margin-left:2px;opacity:.75;font-weight:700;}

.dropdown-filtros{display:flex;gap:8px;flex-wrap:wrap;}
.campo-select-icone{position:relative;display:flex;align-items:center;}
.campo-select-icone svg{position:absolute;left:13px;color:var(--texto-fraco);pointer-events:none;z-index:1;}
.campo-select-icone select{padding-left:38px!important;}
.dropdown-filtros select{
  padding:8px 14px;border:1.5px solid var(--borda);border-radius:999px;font-size:12.5px;font-weight:600;
  background-color:var(--fundo);color:var(--texto-suave);font-family:inherit;
  transition:border-color var(--transicao),box-shadow var(--transicao),color var(--transicao),background-color var(--transicao);cursor:pointer;
}
.dropdown-filtros select:hover{border-color:var(--borda-forte);color:var(--texto);background-color:var(--card);}
.dropdown-filtros select:focus{outline:none;border-color:var(--azul);color:var(--texto);background-color:var(--card);box-shadow:0 0 0 4px var(--azul-bg);}
/* Select customizado dentro de filtros: mesma pilula, so' que agora o
   "select" de verdade" e' o .select-custom-trigger (o <select> original
   fica invisivel, ver App.melhorarSelect). */
.dropdown-filtros .select-custom-trigger{
  padding:8px 14px;border-radius:999px;font-size:12.5px;font-weight:600;
  background-color:var(--fundo);color:var(--texto-suave);
}
.dropdown-filtros .select-custom-trigger:hover{border-color:var(--borda-forte);color:var(--texto);background-color:var(--card);}
.dropdown-filtros .select-custom.aberto .select-custom-trigger{color:var(--texto);background-color:var(--card);}
.campo-select-icone .select-custom-trigger{padding-left:38px;}

/* Barra de selecao em massa */
.barra-selecao-massa{
  display:flex;align-items:center;gap:12px;padding:11px 16px;margin-bottom:16px;border-radius:var(--raio);
  background:var(--azul-bg);border:1px solid rgba(37,99,235,.25);
}
.barra-selecao-massa .contador-selecao{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--azul-escuro);}
.barra-selecao-massa .contador-selecao svg{color:var(--azul);}
.barra-selecao-massa select{padding:7px 11px;border:1.5px solid rgba(37,99,235,.3);border-radius:var(--raio-sm);font-size:12.5px;background:var(--card);color:var(--texto);font-family:inherit;margin-left:auto;}
.barra-selecao-massa .select-custom{margin-left:auto;max-width:220px;}
.barra-selecao-massa .select-custom-trigger{padding:7px 11px;border-color:rgba(37,99,235,.3);font-size:12.5px;}

.paginacao{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;font-size:12.5px;color:var(--texto-suave);}
.paginacao .botoes{display:flex;gap:6px;}

/* ---------- Modal / formulario ---------- */
.overlay{display:none;position:fixed;inset:0;background:rgba(8,13,31,.6);backdrop-filter:blur(3px);align-items:center;justify-content:center;z-index:100;padding:20px;}
.overlay.ativo{display:flex;}
.modal{background:var(--card);border-radius:var(--raio-lg);padding:28px 30px;width:560px;max-width:100%;max-height:90vh;overflow-y:auto;box-shadow:var(--sombra-lg);animation:subir .2s ease both;}
.modal.largo{width:860px;}
.modal h2{font-size:17px;font-weight:700;margin-bottom:20px;color:var(--texto);letter-spacing:-.01em;}
.campo{margin-bottom:14px;}
.campo label{display:block;font-size:12px;font-weight:600;color:var(--texto-suave);margin-bottom:6px;}
.campo input,.campo select,.campo textarea{
  width:100%;padding:9px 12px;border:1.5px solid var(--borda);border-radius:var(--raio-sm);font-size:13.5px;
  font-family:inherit;transition:border-color var(--transicao), box-shadow var(--transicao);background:var(--card);color:var(--texto);
}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 4px var(--azul-bg);}
.campo.invalido label{color:var(--vermelho);}
.campo.invalido input,.campo.invalido select,.campo.invalido textarea{border-color:var(--vermelho);background:var(--vermelho-bg);}
.campo textarea{resize:vertical;min-height:70px;}
.linha-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.linha-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.linha-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.modal-acoes{display:flex;justify-content:flex-end;gap:8px;margin-top:20px;}
.secao-form{font-size:11px;font-weight:700;color:var(--texto-fraco);text-transform:uppercase;letter-spacing:.06em;margin:18px 0 10px;padding-top:14px;border-top:1px solid var(--borda);}
.secao-form:first-child{margin-top:0;padding-top:0;border-top:none;}
@media(max-width:640px){.linha-2,.linha-3,.linha-4{grid-template-columns:1fr;}.modal{padding:20px;}}

/* ---------- Detalhe da demanda ---------- */
.detalhe-cabecalho{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:6px;flex-wrap:wrap;}
.detalhe-cabecalho h2{font-size:19px;font-weight:700;color:var(--texto);letter-spacing:-.01em;}
.detalhe-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0 18px;}
.detalhe-info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:18px;padding:14px 16px;background:var(--fundo);border-radius:var(--raio-sm);}
.detalhe-info-grid .campo-info label{display:block;font-size:10.5px;font-weight:700;color:var(--texto-fraco);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px;}
.detalhe-info-grid .campo-info input{width:100%;padding:5px 8px;border:1px solid transparent;border-radius:6px;font-size:12.5px;background:transparent;color:var(--texto);font-family:inherit;transition:border-color var(--transicao),background var(--transicao);}
.detalhe-info-grid .campo-info input:hover{border-color:var(--borda);}
.detalhe-info-grid .campo-info input:focus{outline:none;border-color:var(--azul);background:var(--card);box-shadow:0 0 0 3px var(--azul-bg);}
.detalhe-info-grid .campo-info select{
  width:100%;padding-top:5px;padding-bottom:5px;padding-left:8px;border:1px solid transparent;border-radius:6px;font-size:12.5px;font-weight:600;
  background-color:transparent;color:var(--texto);font-family:inherit;transition:border-color var(--transicao),background-color var(--transicao);
  background-position:right 6px center;background-size:14px;
}
.detalhe-info-grid .campo-info select:hover{border-color:var(--borda);}
.detalhe-info-grid .campo-info select:focus{outline:none;border-color:var(--azul);background-color:var(--card);box-shadow:0 0 0 3px var(--azul-bg);}
/* Select customizado nesse painel: mesmo visual minimalista (sem borda ate'
   passar o mouse) que os outros campos do bloco (Inicio, Prazo, etc.). */
.detalhe-info-grid .campo-info .select-custom-trigger{
  padding:5px 22px 5px 8px;border-color:transparent;border-radius:6px;font-size:12.5px;font-weight:600;
  background-color:transparent;
}
.detalhe-info-grid .campo-info .select-custom-trigger:hover{border-color:var(--borda);}
.detalhe-info-grid .campo-info .select-custom.aberto .select-custom-trigger{border-color:var(--azul);background-color:var(--card);box-shadow:0 0 0 3px var(--azul-bg);}
.detalhe-info-grid .campo-info .select-custom-chevron{width:14px;height:14px;}
@media(max-width:640px){.detalhe-info-grid{grid-template-columns:1fr 1fr;}}
.detalhe-tabs{display:flex;gap:4px;border-bottom:1px solid var(--borda);margin-bottom:18px;overflow-x:auto;}
.detalhe-tabs button{background:none;border:none;padding:9px 4px;margin-right:18px;font-size:13px;font-weight:600;color:var(--texto-suave);border-bottom:2px solid transparent;white-space:nowrap;transition:color var(--transicao),border-color var(--transicao);}
.detalhe-tabs button.ativo{color:var(--azul);border-bottom-color:var(--azul);}
.descricao-editavel{border:1.5px solid transparent;border-radius:var(--raio-sm);padding:8px;font-size:13.5px;line-height:1.7;color:var(--texto);white-space:pre-wrap;cursor:text;min-height:60px;transition:border-color var(--transicao);}
.descricao-editavel:hover{border-color:var(--borda);}
.descricao-editavel:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 4px var(--azul-bg);}

.checklist-item{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:var(--raio-sm);transition:background var(--transicao);}
.checklist-item:hover{background:var(--fundo);}
.checklist-item input[type=checkbox]{width:17px;height:17px;accent-color:var(--azul);flex-shrink:0;}
.checklist-item .texto-item{flex:1;font-size:13.5px;color:var(--texto);}
.checklist-item.concluido .texto-item{text-decoration:line-through;color:var(--texto-fraco);}
.checklist-item .arrastar{cursor:grab;color:var(--texto-fraco);}
.form-add-item{display:flex;gap:8px;margin-top:10px;}
.form-add-item input{flex:1;padding:8px 10px;border:1.5px dashed var(--borda);border-radius:var(--raio-sm);font-size:13px;background:transparent;color:var(--texto);}

.comentario{display:flex;gap:10px;margin-bottom:16px;}
.comentario .corpo{flex:1;background:var(--fundo);border-radius:var(--raio-sm);padding:10px 12px;}
.comentario .cabecalho-comentario{display:flex;gap:8px;align-items:baseline;margin-bottom:3px;}
.comentario .autor{font-size:12.5px;font-weight:700;color:var(--texto);}
.comentario .quando{font-size:11px;color:var(--texto-fraco);}
.comentario .texto{font-size:13px;color:var(--texto);white-space:pre-wrap;}
.caixa-comentario{display:flex;gap:10px;margin-top:16px;position:relative;}
.caixa-comentario textarea{flex:1;padding:9px 12px;border:1.5px solid var(--borda);border-radius:var(--raio-sm);font-size:13px;font-family:inherit;resize:vertical;min-height:44px;background:var(--card);color:var(--texto);}

.item-historico{display:flex;gap:10px;padding:8px 0;font-size:12.5px;}
.item-historico .ponto-hist{width:7px;height:7px;border-radius:50%;background:var(--azul-claro);margin-top:6px;flex-shrink:0;}
.item-historico .texto-hist b{color:var(--texto);}
.item-historico .quando{color:var(--texto-fraco);font-size:11px;}

.lista-anexos .item-anexo{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--borda);border-radius:var(--raio-sm);margin-bottom:8px;font-size:12.5px;}
.lista-anexos .item-anexo .icone{width:32px;height:32px;border-radius:var(--raio-sm);background:var(--azul-bg);color:var(--azul);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.lista-anexos .item-anexo .info{flex:1;min-width:0;}
.lista-anexos .item-anexo .nome{font-weight:600;color:var(--texto);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lista-anexos .item-anexo .meta{color:var(--texto-fraco);font-size:11px;}
.zona-upload{border:1.5px dashed var(--borda);border-radius:var(--raio-sm);padding:16px;text-align:center;color:var(--texto-suave);font-size:12.5px;cursor:pointer;transition:.15s;display:block;}
.zona-upload:hover,.zona-upload.arrastando{border-color:var(--azul);background:var(--azul-bg);color:var(--azul);}

/* ---------- Kanban ---------- */
.kanban-board{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px;align-items:flex-start;}
.kanban-coluna{background:var(--fundo);border-radius:var(--raio);padding:12px;min-width:280px;width:280px;flex-shrink:0;}
:root[data-theme="dark"] .kanban-coluna{background:#0F1729;}
.kanban-coluna .titulo-coluna{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--texto);padding:4px 6px 12px;}
.kanban-coluna .titulo-coluna .ponto-status{width:9px;height:9px;border-radius:50%;flex-shrink:0;}
.kanban-coluna .titulo-coluna .contagem{margin-left:auto;background:var(--card);border:1px solid var(--borda);padding:1px 8px;border-radius:20px;font-size:11px;color:var(--texto-suave);}
.kanban-lista{min-height:60px;display:flex;flex-direction:column;gap:10px;}
.kanban-lista.arrastando-sobre{background:var(--azul-bg);border-radius:var(--raio-sm);}
.kanban-card{background:var(--card);border:1px solid var(--borda);border-radius:var(--raio-sm);padding:12px 13px;box-shadow:var(--sombra);cursor:grab;transition:transform .1s,box-shadow .1s,border-color var(--transicao);}
.kanban-card:hover{box-shadow:var(--sombra-md);border-color:var(--borda-forte);}
.kanban-card.arrastando{opacity:.4;}
.kanban-card.atrasado{box-shadow:inset 3px 0 0 var(--vermelho),var(--sombra);}
.kanban-card .titulo-card{font-size:13px;font-weight:600;color:var(--texto);margin-bottom:8px;}
.kanban-card .linha-card{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;font-size:11.5px;color:var(--texto-suave);}
.kanban-card .tags-card{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px;}
.btn-add-coluna{width:100%;padding:8px;border:1.5px dashed var(--borda);border-radius:var(--raio-sm);background:transparent;color:var(--texto-suave);font-size:12.5px;font-weight:600;}

/* ---------- Calendario ---------- */
.calendario-cabecalho{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap;}
.calendario-cabecalho h2{font-size:16px;font-weight:700;min-width:180px;}
.grade-calendario{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--borda);border:1px solid var(--borda);border-radius:var(--raio);overflow:hidden;width:100%;}
.grade-calendario .dia-semana{background:var(--card);padding:8px;text-align:center;font-size:11px;font-weight:700;color:var(--texto-fraco);text-transform:uppercase;min-width:0;}
.grade-calendario .celula-dia{background:var(--card);min-height:100px;min-width:0;overflow:hidden;padding:6px;display:flex;flex-direction:column;gap:4px;cursor:pointer;transition:background var(--transicao);}
.grade-calendario .celula-dia:hover{background:var(--fundo);}
.grade-calendario .celula-dia.fora-mes{background:var(--fundo);color:var(--texto-fraco);}
.grade-calendario .celula-dia.hoje .numero-dia{background:var(--azul);color:#fff;border-radius:50%;}
.grade-calendario .numero-dia{font-size:12px;font-weight:700;width:22px;height:22px;display:flex;align-items:center;justify-content:center;}
.grade-calendario .evento-dia{font-size:10.5px;padding:2px 6px;border-radius:5px;background:var(--azul-bg);color:var(--azul-escuro);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;cursor:pointer;}
.grade-calendario .evento-dia.atrasado{background:var(--vermelho-bg);color:var(--vermelho);}
.grade-calendario .evento-dia.concluido{background:var(--verde-bg);color:#047857;text-decoration:line-through;}
.grade-calendario .mais-eventos{font-size:10px;color:var(--texto-fraco);padding-left:6px;}

/* ---------- Equipe / Projetos ---------- */
.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;}
.card-membro,.card-projeto{background:var(--card);border:1px solid var(--borda);border-radius:var(--raio);padding:18px;box-shadow:var(--sombra);cursor:pointer;transition:transform var(--transicao),box-shadow var(--transicao),border-color var(--transicao);}
.card-membro:hover,.card-projeto:hover{transform:translateY(-2px);box-shadow:var(--sombra-md);border-color:var(--borda-forte);}
.card-membro .topo{display:flex;gap:12px;align-items:center;margin-bottom:14px;}
.card-membro .nome{font-size:14px;font-weight:700;color:var(--texto);}
.card-membro .cargo{font-size:12px;color:var(--texto-suave);}
.mini-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;text-align:center;}
.mini-stats .mini{padding:6px 1px;border-radius:var(--raio-sm);background:var(--fundo);min-width:0;overflow:hidden;}
.mini-stats .mini b{display:block;font-size:15px;font-weight:800;color:var(--texto);}
.mini-stats .mini span{display:block;font-size:8px;color:var(--texto-suave);text-transform:uppercase;letter-spacing:-.02em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:clip;}
.card-projeto .barra-topo-projeto{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;}
.card-projeto .tag-cor{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px;}
.card-projeto .nome{font-size:14.5px;font-weight:700;color:var(--texto);}
.card-projeto .desc{font-size:12px;color:var(--texto-suave);margin:4px 0 12px;min-height:16px;}

.pilha-avatares{display:flex;}
.pilha-avatares .avatar{border:2px solid var(--card);margin-left:-8px;}
.pilha-avatares .avatar:first-child{margin-left:0;}

table.tabela-carga td,table.tabela-carga th{text-align:center;}
table.tabela-carga td:first-child,table.tabela-carga th:first-child{text-align:left;}

/* ---------- Toasts ---------- */
#toast-container{position:fixed;bottom:24px;right:24px;display:flex;flex-direction:column;gap:10px;z-index:200;}
.toast{background:var(--texto);color:#fff;padding:12px 16px;border-radius:var(--raio-sm);font-size:13px;font-weight:500;box-shadow:var(--sombra-lg);display:flex;align-items:center;gap:10px;animation:subir .2s ease both;min-width:240px;}
.toast.sucesso{background:#047857;}
.toast.erro{background:#B91C1C;}
.toast.aviso{background:#B45309;}

/* ---------- Menu de contexto / dropdown generico ---------- */
.menu-flutuante{position:absolute;background:var(--card);border:1px solid var(--borda);border-radius:var(--raio-sm);box-shadow:var(--sombra-lg);padding:6px;z-index:80;min-width:180px;}
.menu-flutuante .item-menu{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:7px;font-size:12.5px;color:var(--texto);cursor:pointer;transition:background var(--transicao);}
.menu-flutuante .item-menu:hover{background:var(--fundo);}
.menu-flutuante .item-menu.perigo{color:var(--vermelho);}
.menu-flutuante hr{border:none;border-top:1px solid var(--borda);margin:5px 0;}

/* ---------- Responsivo / drawer mobile ---------- */
.backdrop-mobile{display:none;position:fixed;inset:0;background:rgba(8,13,31,.5);z-index:140;}
@media(max-width:900px){
  #app.ativo{grid-template-columns:minmax(0,1fr);}
  .sidebar{position:fixed;left:-260px;top:0;width:252px;z-index:150;}
  .sidebar.aberta{left:0;box-shadow:var(--sombra-lg);}
  .backdrop-mobile.ativo{display:block;}
  #btn-menu-mobile{display:flex!important;}
  .conteudo{padding:18px 16px 60px;}
  .topbar{padding:12px 16px;gap:10px;}
  .topbar .busca-global{max-width:none;}
  .cards-stats{grid-template-columns:repeat(2,1fr);}
  .grid-3-colunas{grid-template-columns:1fr;}
  .modal.largo{width:100%;}
  .detalhe-info-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:560px){
  .cards-stats{grid-template-columns:1fr 1fr;}
  .barra-ferramentas{flex-direction:column;align-items:stretch;}
  .dropdown-filtros{flex-direction:column;}
  .dropdown-filtros select{width:100%;}
}

/* Tabela -> lista de cards no celular (mesmos dados, layout adaptado). */
@media(max-width:760px){
  .tabela-scroll{overflow-x:visible;border:none;background:transparent;box-shadow:none;}
  table.tabela, table.tabela tbody{display:block;width:100%;}
  table.tabela thead{display:none;}
  table.tabela tr{
    position:relative;display:block;background:var(--card);border:1px solid var(--borda);border-radius:var(--raio);
    margin-bottom:12px;padding:14px 44px 12px 14px;box-shadow:var(--sombra);
  }
  table.tabela td{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--borda);padding:7px 0;white-space:normal;max-width:none;}
  table.tabela td:last-child{border-bottom:none;}
  table.tabela td[data-label=""]{display:block;padding:0 0 8px;}
  table.tabela td[data-label]:not([data-label=""])::before{
    content:attr(data-label);font-size:10.5px;font-weight:700;color:var(--texto-fraco);text-transform:uppercase;
    letter-spacing:.04em;flex-shrink:0;
  }
  table.tabela td.cel-checkbox{position:absolute;top:14px;right:14px;padding:0;width:auto;}
  table.tabela td.col-truncar{padding-bottom:10px;border-bottom:1px solid var(--borda);}
  table.tabela td.col-truncar .cel-titulo-demanda{white-space:normal;}
  table.tabela td:last-child > div.acoes-linha{margin-left:auto;}
  table.tabela select.select-inline,
  table.tabela input.input-prazo-rapido{text-align:right;}
}