@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-regular-rounded.css');
:root{--ch-accent:#3B82F6;--ch-accent-d:#2563EB;--ch-navy:#0F172A;--ch-muted:#64748B;
--ch-green:#10B981;--ch-amber:#F59E0B;--ch-violet:#8B5CF6;--ch-rose:#F43F5E;--ch-cyan:#06B6D4;}
.fi-body,.fi-simple-layout{font-family:'Plus Jakarta Sans',ui-sans-serif,system-ui,sans-serif;}
html:not(.dark) .fi-body{background:radial-gradient(1100px 420px at 100% -8%,rgba(139,92,246,.08),transparent),radial-gradient(900px 360px at -5% 0,rgba(59,130,246,.07),transparent),#F4F7FB;}
.fi-header-heading{font-weight:800;letter-spacing:-.02em;color:var(--ch-navy);}
html.dark .fi-header-heading{color:#F1F5F9;}
.fi-sidebar{border-right:1px solid #E9EEF5;}
html:not(.dark) .fi-sidebar,html:not(.dark) .fi-sidebar-header{background:#fff;}
.fi-sidebar-group-label{text-transform:uppercase;letter-spacing:.6px;font-size:.66rem;font-weight:700;color:#94A3B8;}
.fi-sidebar-item-btn{border-radius:10px;font-weight:500;}
.fi-sidebar-item-btn:hover{background:rgba(59,130,246,.08);}
.fi-sidebar-item-active .fi-sidebar-item-button{background:linear-gradient(135deg,rgba(59,130,246,.16),rgba(139,92,246,.10));color:var(--ch-accent);font-weight:700;border-radius:10px;box-shadow:inset 3px 0 0 var(--ch-accent);}
.fi-sidebar-item-active .fi-sidebar-item-icon{color:var(--ch-accent);}
html:not(.dark) .fi-topbar>div{background:rgba(255,255,255,.85);backdrop-filter:blur(10px);border-bottom:1px solid #E9EEF5;}
.fi-logo{font-weight:800;letter-spacing:-.02em;color:var(--ch-navy);}
html.dark .fi-logo{color:#F1F5F9;}
.fi-section,.fi-wi,.fi-ta-ctn{border-radius:14px!important;}
html:not(.dark) .fi-section,html:not(.dark) .fi-ta-ctn{box-shadow:0 1px 3px rgba(15,23,42,.06),0 1px 2px rgba(15,23,42,.04);border:1px solid #EAEFF5;}
.fi-btn-color-primary{background:linear-gradient(180deg,#3B82F6,#2563EB)!important;border-radius:10px;}
.fi-wi-stats-overview-stat-value{font-weight:800;letter-spacing:-.02em;}
.fi-simple-main{border-radius:20px;box-shadow:0 10px 40px rgba(15,23,42,.10);border:1px solid #EAEFF5;position:relative;overflow:hidden;}
.fi-simple-main::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#3B82F6,#60A5FA);}
.fi-simple-header{display:none;}
.ch-login-brand{text-align:center;margin-bottom:6px;}
.ch-login-brand svg{width:46px;height:46px;margin:0 auto 10px;display:block;}
.ch-login-name{font-size:1.5rem;font-weight:800;color:var(--ch-navy);letter-spacing:-.02em;}
html.dark .ch-login-name{color:#F1F5F9;}
.ch-login-sub{font-size:.8rem;color:var(--ch-muted);margin-top:2px;}
.ch-login-tag{text-align:center;font-size:.75rem;font-style:italic;color:#94A3B8;margin-top:16px;}

/* Flaticon UIcons */
.fi-sidebar-item i[class*="fi-rr-"]{font-size:1.2rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;}
.fi-topbar i[class*="fi-rr-"]{font-size:1.15rem;line-height:1;}
i[class*="fi-rr-"]{vertical-align:-2px;}

/* ===== KPIs coloridos por posição (Filament deixa ícone/card cinza) ===== */
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat{--c:#3B82F6;position:relative;overflow:hidden;transition:transform .12s ease,box-shadow .12s ease;}
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat:nth-child(6n+2){--c:#8B5CF6;}
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat:nth-child(6n+3){--c:#10B981;}
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat:nth-child(6n+4){--c:#F59E0B;}
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat:nth-child(6n+5){--c:#F43F5E;}
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat:nth-child(6n+6){--c:#06B6D4;}
html:not(.dark) .fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat{background:linear-gradient(135deg,color-mix(in srgb,var(--c) 10%,#fff),#fff)!important;border:1px solid color-mix(in srgb,var(--c) 24%,#EAEFF5)!important;}
html.dark .fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat{background:linear-gradient(135deg,color-mix(in srgb,var(--c) 16%,#0b1220),#0b1220)!important;}
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c);}
.fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat:hover{transform:translateY(-3px);box-shadow:0 12px 28px color-mix(in srgb,var(--c) 32%,transparent)!important;}
.fi-wi-stats-overview-stat-icon{color:var(--c)!important;box-sizing:content-box;background:color-mix(in srgb,var(--c) 16%,transparent);padding:.5rem;border-radius:10px;}

/* barras de topo coloridas nas seções (listas/forms) */
html:not(.dark) .fi-main .fi-section{border-top:3px solid var(--ch-accent);}
html:not(.dark) .fi-main .fi-section:nth-of-type(3n+2){border-top-color:var(--ch-violet);}
html:not(.dark) .fi-main .fi-section:nth-of-type(3n+3){border-top-color:var(--ch-green);}
html:not(.dark) .fi-ta-header-cell{background:#F8FAFF;}
html:not(.dark) .fi-ta-row:hover{background:rgba(59,130,246,.04);}

/* ===== Botão flutuante da Claudia (IA) ===== */
.ch-fab{position:fixed;right:22px;bottom:22px;z-index:9999;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#3B82F6,#8B5CF6);color:#fff!important;box-shadow:0 10px 26px rgba(99,102,241,.45);text-decoration:none;transition:transform .15s,box-shadow .15s;}
.ch-fab:hover{transform:translateY(-2px) scale(1.06);box-shadow:0 16px 34px rgba(139,92,246,.55);}
.ch-fab i{font-size:1.55rem;line-height:1;}
.ch-fab::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(99,102,241,.4);animation:chpulse 2.2s infinite;}
@keyframes chpulse{0%{transform:scale(.9);opacity:.7}70%{transform:scale(1.3);opacity:0}100%{opacity:0}}

/* ===== Sidebar premium — modo escuro (v7) ===== */
html.dark .fi-sidebar,html.dark .fi-sidebar-header{background:linear-gradient(180deg,#0B1426 0%,#0E1A30 100%);border-right:1px solid rgba(148,163,184,.10);}
html.dark .fi-sidebar::before{content:'';position:absolute;top:0;left:0;right:0;height:170px;background:radial-gradient(440px 170px at 50% -50px,rgba(59,130,246,.18),transparent);pointer-events:none;z-index:0;}
html.dark .fi-sidebar-nav{position:relative;z-index:1;}
/* grupos: divisória + respiro + rótulo */
html.dark .fi-sidebar-group{border-top:1px solid rgba(148,163,184,.09);padding-top:.3rem;margin-top:.3rem;}
html.dark .fi-sidebar-group:first-of-type{border-top:0;margin-top:0;}
html.dark .fi-sidebar-group-label{color:#7E8DA6;letter-spacing:.9px;font-size:.64rem;}
/* cabeçalho de grupo recolhível: clicável */
html.dark .fi-sidebar-group-collapse-button,html.dark .fi-sidebar-group-button{border-radius:9px;}
html.dark .fi-sidebar-group-collapse-button:hover,html.dark .fi-sidebar-group-button:hover{background:rgba(148,163,184,.06);}
/* itens */
html.dark .fi-sidebar-item-btn{color:#CBD5E1;}
html.dark .fi-sidebar-item-btn:hover{background:rgba(59,130,246,.13);color:#fff;}
html.dark .fi-sidebar-item-icon,html.dark .fi-sidebar-item i[class*="fi-rr-"]{color:#8A99B2;}
html.dark .fi-sidebar-item-btn:hover .fi-sidebar-item-icon,html.dark .fi-sidebar-item-btn:hover i[class*="fi-rr-"]{color:#93C5FD;}
/* item ativo: pílula com glow */
html.dark .fi-sidebar-item-active .fi-sidebar-item-button{background:linear-gradient(135deg,rgba(59,130,246,.30),rgba(139,92,246,.18));color:#fff;font-weight:700;border-radius:10px;box-shadow:inset 3px 0 0 #60A5FA,0 6px 16px rgba(59,130,246,.20);}
html.dark .fi-sidebar-item-active .fi-sidebar-item-icon,html.dark .fi-sidebar-item-active i[class*="fi-rr-"]{color:#BFDBFE;}
/* logo + ritmo */
html.dark .fi-sidebar-header .fi-logo,html.dark .fi-logo{color:#F8FAFC;letter-spacing:-.02em;font-weight:800;}
.fi-sidebar-item{margin-bottom:2px;}
.fi-sidebar-item-btn{transition:background .12s ease,color .12s ease;}

/* ===== Menu: fontes maiores + divisórias reforçadas (v8) ===== */
.fi-sidebar-item-btn{font-size:.95rem;padding-top:.55rem;padding-bottom:.55rem;}
.fi-sidebar-item i[class*="fi-rr-"]{font-size:1.34rem;width:1.62rem;height:1.62rem;}
.fi-sidebar-group-label{font-size:.74rem;letter-spacing:1px;}
html.dark .fi-sidebar-group-label{font-size:.74rem;letter-spacing:1px;color:#94A6C4;}
/* divisórias entre grupos: mais visíveis + respiro */
html.dark .fi-sidebar-group{border-top:1px solid rgba(148,163,184,.20);padding-top:.6rem;margin-top:.6rem;}
html:not(.dark) .fi-sidebar-group{border-top:1px solid #E2E8F0;padding-top:.6rem;margin-top:.6rem;}
.fi-sidebar-group:first-of-type{border-top:0!important;margin-top:0!important;padding-top:0!important;}

/* selects nativos (custom) legíveis no dark */
.fi-main-ctn select,.fi-main select{background:#fff;color:#0F172A;}
.fi-main-ctn select option,.fi-main select option{background:#fff;color:#0F172A;}

/* v10: opcoes de select legiveis em qualquer contexto (modais, paginas dark, OS dark) */
select option, select optgroup { background-color:#ffffff !important; color:#0F172A !important; }
select:not([multiple]) { color:#0F172A; }
.fi-modal select, .fi-fo-field-wrp select { background:#fff; color:#0F172A; }
.fi-modal select option, .fi-fo-field-wrp select option { background:#fff !important; color:#0F172A !important; }

/* sidebar-fix-scroll (v20): menu lateral fixo, altura=viewport e a AREA DE NAV rola
   ate o ultimo item em telas baixas (notebooks). Usa flex (min-height:0) em vez de
   height:100% para que o nav NUNCA transborde alem da sidebar de altura de viewport. */
@media (min-width:1024px){
  .fi-sidebar{position:sticky !important;inset-block-start:0;height:100vh;height:100dvh;overflow:hidden;}
  .fi-sidebar .fi-sidebar-nav{flex:1 1 auto;min-height:0;height:auto;overflow-y:auto;overscroll-behavior:contain;}
}
/* affordance de scroll: barra fina sempre visivel na navegacao da sidebar (todos os tamanhos) */
.fi-sidebar-nav{scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.55) transparent;}
.fi-sidebar-nav::-webkit-scrollbar{width:8px;}
.fi-sidebar-nav::-webkit-scrollbar-track{background:transparent;}
.fi-sidebar-nav::-webkit-scrollbar-thumb{background:rgba(148,163,184,.45);border-radius:8px;}
.fi-sidebar-nav:hover::-webkit-scrollbar-thumb{background:rgba(148,163,184,.7);}
html.dark .fi-sidebar-nav{scrollbar-color:rgba(148,163,184,.4) transparent;}
html.dark .fi-sidebar-nav::-webkit-scrollbar-thumb{background:rgba(148,163,184,.32);}

/* resp-otimizacao: monitores menores (laptops) e celulares */
@media (max-width:1440px){ html{font-size:15px} }
@media (max-width:1280px){
  html{font-size:14px}
  .fi-main{padding-left:1rem!important;padding-right:1rem!important;padding-top:1rem!important}
  .fi-wi-stats-overview-stats-ctn>.fi-wi-stats-overview-stat{padding:.75rem!important}
}
@media (max-width:900px){
  html{font-size:14px}
  .fi-main{padding:.7rem!important}
  .fi-section{padding:.8rem!important}
}
@media (max-width:640px){
  .fi-wi-stats-overview-stats-ctn{grid-template-columns:1fr 1fr!important;gap:.5rem!important}
  .fi-header-heading{font-size:1.1rem!important}
  .fi-ta-cell,.fi-ta-header-cell{padding:.4rem .5rem!important}
  .fi-btn{padding-left:.6rem!important;padding-right:.6rem!important}
}
@media (max-width:430px){
  .fi-wi-stats-overview-stats-ctn{grid-template-columns:1fr!important}
}

/* mobile: pilha vertical uniforme dos flutuantes na direita (baixo p/ cima: Claudia, WhatsApp, calculadora) */
@media (max-width:1023px){
  .ch-fab{right:14px!important;bottom:16px!important;width:50px!important;height:50px!important}
  .ch-fab i{font-size:1.3rem!important}
  #wa-fab{left:auto!important;right:14px!important;top:auto!important;bottom:80px!important;width:50px!important;height:50px!important}
  #wa-fab svg{width:26px!important;height:26px!important}
  #wa-dock-badge{left:auto!important;right:10px!important;top:auto!important;bottom:116px!important}
  #ch-calc{right:14px!important;bottom:144px!important}
  #ch-calc-fab{width:50px!important;height:50px!important}
  /* dock do WhatsApp aberto no celular: esconde o fab (o fechar e pelo Recolher/backdrop) */
  html.wa-dock-open #wa-fab{display:none!important}
  html.wa-dock-open #wa-dock-badge{display:none!important}
  /* menu lateral aberto: esconde os flutuantes (senao flutuam por cima do menu) */
  body:has(.fi-sidebar-open) .ch-fab,
  body:has(.fi-sidebar-open) #wa-fab,
  body:has(.fi-sidebar-open) #wa-dock-badge,
  body:has(.fi-sidebar-open) #ch-calc{display:none!important}
  /* Claudia (IA) no celular: painel ancorado por top/bottom fixos (sem depender de vh,
     que no iOS empurra o input pra fora e trava a rolagem). Assim a area de mensagens
     rola sempre e o campo de escrever fica visivel. */
  .ch-panel{
    top:56px!important;bottom:78px!important;left:10px!important;right:10px!important;
    width:auto!important;max-width:none!important;height:auto!important;max-height:none!important;
  }
}

/* desktop: sem backdrop (dock convive com a pagina) e alinha os 3 flutuantes pelo centro da coluna */
@media (min-width:1024px){
  #wa-dock-bg{display:none!important}
  #wa-fab{right:25px!important;bottom:96px!important}
  #wa-dock-badge{right:21px!important;bottom:132px!important}
  #ch-calc{right:29px!important;bottom:166px!important}
}

/* desktop: empurra o botao de recolher/mostrar o menu para a direita para nao ficar sob o botao do WhatsApp (canto sup. esq.) */
@media (min-width:1024px){
  .fi-topbar > nav, .fi-topbar nav.fi-topbar-nav{padding-inline-start:4.75rem;}
}


/* ============================================================
   v18 - Fundacao de design system + A11y (baixo risco, global)
   Use estas classes em telas NOVAS: .ch-card .ch-kpi-label
   .ch-kpi-value .ch-muted .ch-btn .ch-btn-primary .ch-grid-auto
   Texto secundario: color:var(--ch-muted) (#64748B, WCAG AA) -
   evite #94A3B8 (#2.96:1 reprova AA).
   ============================================================ */
:root{
  --ch-card-bg:#fff;--ch-card-border:#EAEFF5;--ch-radius:14px;--ch-radius-sm:12px;--ch-card-shadow:0 1px 3px rgba(15,23,42,.06);
  --ch-text:#0F172A;--ch-primary:#2563EB;
  --ch-ok:#16A34A;--ch-warn:#D97706;--ch-danger:#DC2626;
}
.ch-card{background:var(--ch-card-bg);border:1px solid var(--ch-card-border);border-radius:var(--ch-radius);box-shadow:var(--ch-card-shadow);padding:16px 18px;}
.ch-card--sm{background:var(--ch-card-bg);border:1px solid var(--ch-card-border);box-shadow:var(--ch-card-shadow);border-radius:var(--ch-radius);padding:14px 16px;}
.ch-card--lg{background:var(--ch-card-bg);border:1px solid var(--ch-card-border);box-shadow:var(--ch-card-shadow);border-radius:var(--ch-radius);padding:18px;}
.ch-card--flush{background:var(--ch-card-bg);border:1px solid var(--ch-card-border);box-shadow:var(--ch-card-shadow);border-radius:var(--ch-radius);padding:0;}
.ch-card--kanban{background:var(--ch-card-bg);border:1px solid var(--ch-card-border);box-shadow:var(--ch-card-shadow);border-radius:var(--ch-radius-sm);padding:13px 15px;}
.ch-kpi-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--ch-muted);}
.ch-kpi-value{font-size:1.4rem;font-weight:800;letter-spacing:-.02em;color:var(--ch-text);}
.ch-muted{color:var(--ch-muted);}
.ch-btn{display:inline-flex;align-items:center;gap:6px;border-radius:10px;padding:8px 14px;font-weight:600;font-size:.85rem;line-height:1;cursor:pointer;border:1px solid var(--ch-card-border);background:#fff;color:var(--ch-text);text-decoration:none;transition:transform .12s,box-shadow .12s;}
.ch-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(15,23,42,.1);}
.ch-btn-primary{background:linear-gradient(180deg,#3B82F6,var(--ch-primary));color:#fff;border-color:transparent;}
.ch-grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;}
.ch-grid-7{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
@media(max-width:900px){.ch-grid-7{grid-template-columns:repeat(4,1fr)}}
@media(max-width:560px){.ch-grid-7{grid-template-columns:repeat(2,1fr)}}

/* Barra de progresso Livewire (percepcao de responsividade) */
.ch-loading-bar{position:fixed;top:0;left:0;right:0;height:3px;z-index:100000;pointer-events:none;background:linear-gradient(90deg,#3B82F6,#8B5CF6,#3B82F6);background-size:200% 100%;animation:chLoadBar 1s linear infinite;}
@keyframes chLoadBar{0%{background-position:200% 0}100%{background-position:0 0}}

/* Foco visivel por teclado (A11y) - so no Tab, nao no mouse */
.fi-body :focus-visible,.fi-simple-layout :focus-visible{outline:2px solid #3B82F6;outline-offset:2px;border-radius:3px;}

/* v19 — utilitarios responsivos de coluna (desktop = 2/3 col, mobile = 1 col).
   Use .ch-2col / .ch-3col em telas novas; gap fica no inline se precisar de valor especifico. */
.ch-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.ch-3col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;}
@media(max-width:640px){.ch-2col,.ch-3col{grid-template-columns:1fr;}}


/* v21 sidebar COLAPSADA trilho de icones (CloudIA). colapsado=.fi-sidebar sem .fi-sidebar-open (Filament remove ao recolher no desktop). desktop>=1024; EXPANDIDO intocado; nao quebra o fix rolavel v20 */@media (min-width:1024px){.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-nav{padding-left:.6rem;padding-right:.6rem;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;}.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-button{justify-content:center;padding-left:.5rem;padding-right:.5rem;}.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-active .fi-sidebar-item-button{background:linear-gradient(135deg,rgba(59,130,246,.30),rgba(139,92,246,.18));box-shadow:0 0 0 1px rgba(96,165,250,.55) inset,0 4px 12px rgba(59,130,246,.22);border-radius:12px;}.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-active .fi-sidebar-item-icon,.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-active i[class*="fi-rr-"]{color:#BFDBFE;}html:not(.dark) .fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-active .fi-sidebar-item-button{background:linear-gradient(135deg,rgba(59,130,246,.16),rgba(139,92,246,.10));box-shadow:0 0 0 1px rgba(59,130,246,.38) inset;}html:not(.dark) .fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-active .fi-sidebar-item-icon,html:not(.dark) .fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-active i[class*="fi-rr-"]{color:var(--ch-accent);}.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-button:hover{border-radius:12px;}.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-group-button{display:none!important;}}


/* v22 sidebar EXPANDIDA: pilula ativa com gradiente da marca (corrige seletor morto -btn -> -button).
   Filament 3.3.54: item ativo = li.fi-sidebar-item-active > a.fi-sidebar-item-button (default bg-gray-100 / dark:bg-white/5).
   Escopo desktop expandido = .fi-sidebar.fi-sidebar-open; NAO regride o colapsado (v21 usa :not(.fi-sidebar-open)) nem o rolavel (v20). */
@media (min-width:1024px){
  html.dark .fi-sidebar.fi-sidebar-open .fi-sidebar-item-active .fi-sidebar-item-button{background:linear-gradient(135deg,rgba(59,130,246,.30),rgba(139,92,246,.18));border-radius:12px;color:#fff;font-weight:700;box-shadow:inset 3px 0 0 #60A5FA,0 4px 14px rgba(59,130,246,.22);}
  html.dark .fi-sidebar.fi-sidebar-open .fi-sidebar-item-active .fi-sidebar-item-icon,html.dark .fi-sidebar.fi-sidebar-open .fi-sidebar-item-active i[class*="fi-rr-"]{color:#BFDBFE;}
  html:not(.dark) .fi-sidebar.fi-sidebar-open .fi-sidebar-item-active .fi-sidebar-item-button{background:linear-gradient(135deg,rgba(59,130,246,.16),rgba(139,92,246,.10));border-radius:12px;color:var(--ch-accent);font-weight:700;box-shadow:inset 3px 0 0 var(--ch-accent),0 4px 12px rgba(59,130,246,.14);}
  html:not(.dark) .fi-sidebar.fi-sidebar-open .fi-sidebar-item-active .fi-sidebar-item-icon,html:not(.dark) .fi-sidebar.fi-sidebar-open .fi-sidebar-item-active i[class*="fi-rr-"]{color:var(--ch-accent);}
}


/* v23: a sidebar fixa (v20) ficava SOB a topbar (z-20) no desktop, cobrindo o
   header da sidebar (logo CliniHub + botao de recolher a barra). Elevar a sidebar
   acima da topbar restaura os dois. Paint-only (nao altera layout). Desktop apenas;
   mobile off-canvas ja usa z-30 proprio. */
@media (min-width:1024px){ .fi-sidebar{z-index:30 !important;} }


/* ============================================================
   v24 - DESIGN SYSTEM CONGELADO. Paginas NOVAS DEVEM usar estas
   classes em vez de repetir estilos inline (era o $card copiado
   em ~41 blades). NAO reintroduzir cores hex soltas: use os tokens.
   Cartao branco padrao ...... class="ch-card"   (== $card dominante)
   KPI rotulo/valor .......... .ch-kpi-label / .ch-kpi-value
   Bloco KPI (cartao menor) .. .ch-kpi
   Titulo de secao ........... .ch-section-title
   Texto secundario .......... .ch-muted  (var --ch-muted, WCAG AA)
   Botao / primario .......... .ch-btn / .ch-btn-primary
   Selo/etiqueta ............. .ch-badge
   Grids ..................... .ch-grid-auto / .ch-2col / .ch-3col / .ch-grid-7
   OBS dark: cartoes de conteudo permanecem BRANCOS nos 2 temas
   (paridade com o legado inline #fff); nao trocar --ch-card-bg no dark. */
.ch-kpi{background:var(--ch-card-bg);border:1px solid var(--ch-card-border);border-radius:var(--ch-radius);box-shadow:var(--ch-card-shadow);padding:14px 16px;}
.ch-section-title{font-weight:800;color:var(--ch-text);font-size:.9rem;letter-spacing:-.01em;margin-bottom:10px;}
.ch-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:.72rem;font-weight:700;line-height:1.4;background:color-mix(in srgb,var(--ch-accent) 12%,#fff);color:var(--ch-accent-d);border:1px solid color-mix(in srgb,var(--ch-accent) 22%,#fff);}

/* ============================================================
   v26 - A11y (baixo risco, global): foco de teclado consistente,
   alvos de toque >=44px no mobile, piso de fonte legivel.
   ============================================================ */

/* 1) Foco visivel por teclado — anel da marca, so no :focus-visible
   (Tab), nunca no clique de mouse. Reforca o parcial do v18 e cobre
   links/botoes/inputs/itens de menu/fabs. Vale nos 2 temas. */
.fi-body a:focus-visible,.fi-body button:focus-visible,.fi-body [role="button"]:focus-visible,
.fi-body input:focus-visible,.fi-body select:focus-visible,.fi-body textarea:focus-visible,
.fi-body [tabindex]:not([tabindex="-1"]):focus-visible,.fi-body summary:focus-visible,
.fi-simple-layout a:focus-visible,.fi-simple-layout button:focus-visible,
.fi-simple-layout input:focus-visible,.fi-simple-layout select:focus-visible,
.ch-btn:focus-visible,.fi-sidebar-item-button:focus-visible,
#wa-fab:focus-visible,.ch-fab:focus-visible{
  outline:2px solid var(--ch-accent)!important;outline-offset:2px!important;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--ch-accent) 22%,transparent)!important;border-radius:8px;
}
html.dark .fi-body a:focus-visible,html.dark .fi-body button:focus-visible,
html.dark .fi-body input:focus-visible,html.dark .fi-body select:focus-visible,
html.dark .fi-body textarea:focus-visible,html.dark .ch-btn:focus-visible,
html.dark .fi-sidebar-item-button:focus-visible{outline-color:#60A5FA!important;box-shadow:0 0 0 4px rgba(96,165,250,.32)!important;}
/* fabs redondos: anel acompanha o formato */
#wa-fab:focus-visible,.ch-fab:focus-visible{border-radius:50%;}

/* 2) Alvos de toque >=44px no mobile (WCAG 2.5.5). Escopo <=1024px:
   NAO altera o desktop. Cobre botoes, icon-buttons, itens de tab,
   paginacao, dropdown, itens de menu, links de acao e chips clicaveis. */
@media (max-width:1024px){
  .fi-btn,.ch-btn,.fi-icon-btn,.fi-tabs-item,.fi-pagination-item,
  .fi-dropdown-list-item,.fi-sidebar-item-button,
  button.fi-link,a.fi-link{min-height:44px;}
  .fi-icon-btn,.fi-pagination-item{min-width:44px;}
  a.ch-badge,button.ch-badge{min-height:34px;padding-top:7px;padding-bottom:7px;}
}

/* 3) Piso de fonte legivel nas labels do design system.
   .ch-kpi-label .68 -> .72rem (>=11.5px); no mobile .78rem. */
.ch-kpi-label{font-size:.72rem;}
@media (max-width:1024px){.ch-kpi-label,.ch-badge{font-size:.78rem;}}


/* ============================================================
   v27 - LAYOUT ACOMPANHA (sem sobreposicao)
   (a) Sidebar: v20 agora usa position:sticky (nao fixed) para o
       conteudo REFLUIR no flex do Filament ao expandir/recolher.
   (b) WhatsApp: quando o painel (#wa-dock, 380px, esquerda) esta
       ABERTO, o JS poe .wa-dock-open no <html> e o .fi-layout ganha
       padding-inline-start=380px (border-box => o conteudo abre
       espaco no lugar de ficar coberto). Fechado = 0 (padrao).
       Desktop apenas; mobile mantem overlay (nao espremer). ===== */
@media (min-width:1024px){
  .fi-layout{transition:padding-inline-start .25s ease;}
  html.wa-dock-open .fi-layout{padding-inline-start:380px;}
  html.wa-dock-open .fi-main{max-width:none;}
}


/* ===== UX pack v31: legibilidade, feedback visual ===== */
.ch-card{line-height:1.5}
.ch-card [style*="font-size:.64rem"],.ch-card [style*="font-size:.66rem"]{font-size:.72rem !important}
.ch-card [style*="font-size:.7rem"]{font-size:.74rem !important}
#chProg{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,#3B82F6,#8B5CF6);z-index:2147483000;transition:width .45s ease,opacity .35s;opacity:0;pointer-events:none}
.ch-skel{position:relative;overflow:hidden;background:#EEF2F7;border-radius:10px;min-height:64px}
.ch-skel::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);animation:chShimmer 1.2s infinite}
@keyframes chShimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.fi-sidebar-item-button,.fi-sidebar-group-button{transition:background .18s ease,color .18s ease}


/* ===== DARK MODE v32 — remap da paleta das telas custom =====
   As paginas custom usam paleta fixa consistente; no tema escuro remapeamos
   os valores. Areas de impressao/documento continuam claras. */
.dark .ch-card{background:#101826;border-color:#1F2A3C;color:#D7DEE9}
.dark [style*="background:#fff"]:not(.ch-doc):not(.doc *),.dark [style*="background:#FFF"]{background:#101826 !important}
.dark [style*="background:#F8FAFC"],.dark [style*="background:#F3F6FB"],.dark [style*="background:#FBFDFF"],.dark [style*="background:#F1F5F9"]{background:#0B1220 !important}
.dark [style*="background:#EFF6FF"]{background:#12233E !important}
.dark [style*="background:#F0FDF4"],.dark [style*="background:#ECFDF5"]{background:#0E2318 !important}
.dark [style*="background:#FEF2F2"]{background:#2A1214 !important}
.dark [style*="background:#F5F3FF"]{background:#1D1833 !important}
.dark [style*="background:#FFF7ED"]{background:#2A1E0E !important}
.dark [style*="border:1px solid #E6ECF5"],.dark [style*="border:1px solid #E2E8F0"],.dark [style*="border:1px solid #EAEFF5"],.dark [style*="border:1px solid #EEF2F7"],.dark [style*="border:1px solid #F1F5F9"],.dark [style*="border:1px solid #EEF2F6"]{border-color:#1F2A3C !important}
.dark [style*="border-bottom:1px solid #F1F5F9"],.dark [style*="border-bottom:1px solid #F8FAFC"]{border-bottom-color:#1F2A3C !important}
.dark [style*="color:#0F172A"],.dark [style*="color:#0B1B3B"]{color:#E6ECF5 !important}
.dark [style*="color:#334155"],.dark [style*="color:#1E293B"]{color:#C3CDDB !important}
.dark [style*="color:#475569"]{color:#A9B6C7 !important}
.dark [style*="color:#64748B"]{color:#8FA0B5 !important}
.dark [style*="color:#94A3B8"]{color:#7B8CA1 !important}
.dark input[style],.dark select[style],.dark textarea[style]{background:#0B1220 !important;color:#D7DEE9 !important;border-color:#2A3A52 !important}
/* documentos, PDFs e areas de impressao permanecem claros */
.dark .doc,.dark .doc *,.dark [id*="print"],.dark [class*="print"]{background:#fff;color:#1f2937}
/* graficos: fundo do card ja escurece; canvas transparente ok */

/* ===== Acessibilidade: foco visivel por teclado ===== */
:focus-visible{outline:2px solid #3B82F6 !important;outline-offset:2px;border-radius:4px}
.fi-sidebar-item-button:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid #3B82F6 !important;outline-offset:2px}


/* ===== MOBILE v33: contencao de largura (iOS alarga a viewport com overflow-x) ===== */
@media (max-width: 768px) {
  html, body { overflow-x: clip; max-width: 100vw; }
  .fi-main, .fi-page, .fi-page > * { max-width: 100vw; overflow-x: clip; }
  .ch-card, .md-card { max-width: 100%; }
  .fi-main img, .fi-main canvas, .fi-main table { max-width: 100%; }
  #chDemoraBox { left: 10px; right: 76px !important; max-width: none !important; }
}

/* ===== AGENDA (FullCalendar) — modo escuro =====
   Eventos recebem cor via JS (el.style => serializa rgb(), o override generico
   por [style*=...] nao casa). Aqui: variaveis do FC + texto claro nos eventos
   preservando o tint por servico e a borda esquerda com a cor do status. */
html.dark .fc{--fc-page-bg-color:transparent;--fc-neutral-bg-color:#101826;--fc-border-color:rgba(148,163,184,.16);--fc-today-bg-color:rgba(59,130,246,.10);--fc-list-event-hover-bg-color:#16233B;}
html.dark .fc-theme-standard td,html.dark .fc-theme-standard th{border-color:rgba(148,163,184,.16);}
html.dark .fc .fc-toolbar-title{color:#F1F5F9;}
html.dark .fc .fc-timegrid-slot-label{color:#94A3B8;}
html.dark .fc .fc-col-header-cell-cushion{color:#C3CDDB;}
html.dark .fc .fc-button{background:#111B2E;border-color:rgba(148,163,184,.24);color:#C3CDDB;}
html.dark .fc .fc-button:hover{background:#16233B;border-color:rgba(148,163,184,.36);color:#F1F5F9;}
html.dark .fc .fc-button:disabled{background:#0E1830;color:#64748B;border-color:rgba(148,163,184,.15);}
html.dark .fc .fc-button-primary:not(:disabled).fc-button-active,html.dark .fc .fc-button-primary:not(:disabled):active{background:#2563EB;border-color:#2563EB;color:#fff;}
html.dark .fc .fc-highlight{background:rgba(59,130,246,.22);}
html.dark #agCalWrap .fc .fc-scrollgrid-section-sticky > *{background:#0B1426;box-shadow:0 2px 6px rgba(0,0,0,.5);}
/* texto dos eventos: claro, sem apagar o tint nem a borda de status */
html.dark .fc .fc-timegrid-event,html.dark .fc .fc-timegrid-event .fc-event-main,html.dark .fc .fc-daygrid-event,html.dark .fc .fc-daygrid-event .fc-event-main{color:#EDF2F9 !important;}
html.dark .fc .fc-timegrid-event{border-top-color:rgba(148,163,184,.30) !important;border-right-color:rgba(148,163,184,.30) !important;border-bottom-color:rgba(148,163,184,.30) !important;box-shadow:none !important;}
/* bloqueios (listras claras via JS) -> listras escuras legiveis */
html.dark .fc .fc-timegrid-event[style*="repeating-linear-gradient"]{background:repeating-linear-gradient(45deg,#1A2438,#1A2438 6px,#22304A 6px,#22304A 12px) !important;color:#B6C2D6 !important;}
html.dark .fc .fc-timegrid-event[style*="repeating-linear-gradient"] .fc-event-main{color:#B6C2D6 !important;}
/* bolinha de status: aro escuro em vez de branco */
html.dark .ag-stdot{box-shadow:0 0 0 1.5px rgba(11,20,38,.95);}
html.dark .agcol-h:hover .agcol-car{stroke:#E6ECF5;}