/* Protocolos integrados CRM + VG FISCALIZA */
.protocolos-app{display:flex;flex-direction:column;gap:18px;padding-bottom:40px}.protocolos-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-end}.protocolos-title h1{margin:0;color:#f8fafc;font-size:28px;letter-spacing:-.03em}.protocolos-title p{margin:6px 0 0;color:#64748b;font-size:14px}.protocolos-actions{display:flex;gap:10px;align-items:center}.protocolos-search{min-width:340px;border:1px solid rgba(18,113,55,.22);height:48px;border-radius:16px;padding:0 16px;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.04)}.protocolos-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.proto-card{background:#fff;border:1px solid rgba(18,113,55,.13);border-radius:22px;padding:22px;display:flex;gap:16px;align-items:center;box-shadow:0 20px 42px rgba(15,23,42,.06)}.proto-card-icon{width:46px;height:46px;border-radius:16px;background:#e8f8ee;display:grid;place-items:center;color:#047335;font-weight:900}.proto-card small{display:block;color:#64748b;font-weight:700}.proto-card strong{display:block;font-size:30px;color:#f8fafc;line-height:1.05;margin-top:5px}.proto-card span{display:block;color:#0a7a3b;font-size:12px;font-weight:800;margin-top:8px}.protocolos-table-card{background:#fff;border:1px solid rgba(18,113,55,.14);border-radius:22px;box-shadow:0 24px 52px rgba(15,23,42,.07);overflow:hidden}.protocolos-table{width:100%;border-collapse:separate;border-spacing:0}.protocolos-table thead th{text-align:left;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:#06451f;background:#ecf8f0;border-bottom:1px solid rgba(18,113,55,.14);padding:15px 16px}.protocolos-table tbody td{padding:16px;border-bottom:1px solid rgba(226,232,240,.9);vertical-align:middle;color:#1e293b;font-size:13px}.protocolos-table tbody tr{transition:.18s ease}.protocolos-table tbody tr:hover{background:#f8fcf9;transform:translateY(-1px)}.proto-code{font-weight:900;color:#f8fafc}.proto-sub{display:block;margin-top:4px;color:#64748b;font-size:12px}.status-badge{display:inline-flex;align-items:center;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:900}.status-nao-iniciado{background:#f1f5f9;color:#475569}.status-em-atendimento{background:#dbeafe;color:#1d4ed8}.status-aguardando-cidadao{background:#fef3c7;color:#b45309}.status-respondido{background:#dcfce7;color:#047857}.status-finalizado{background:#e2e8f0;color:#334155}.proto-actions{display:flex;gap:7px}.proto-icon-btn{border:0;width:34px;height:34px;border-radius:10px;color:white;font-weight:900;cursor:pointer;box-shadow:0 8px 18px rgba(15,23,42,.12);transition:.18s ease}.proto-icon-btn:hover{transform:translateY(-2px)}.proto-view{background:#0ea5e9}.proto-reply{background:#f59e0b}.proto-finish{background:#ef4444}.proto-empty{padding:32px;text-align:center;color:#64748b}.proto-modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(5px);z-index:9300;display:none;align-items:center;justify-content:center;padding:110px 24px 24px}.proto-modal-overlay.show{display:flex}.proto-modal{background:#fff;border-radius:24px;width:min(1220px,94vw);max-height:calc(100vh - 140px);display:grid;grid-template-rows:auto 1fr auto;box-shadow:0 36px 90px rgba(0,0,0,.24);overflow:hidden;border:1px solid rgba(255,255,255,.68)}.proto-modal-head{padding:18px 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0}.proto-modal-head h2{margin:0;font-size:20px;color:#f8fafc}.proto-modal-head p{margin:4px 0 0;color:#64748b;font-size:13px}.proto-close{border:0;background:#f8fafc;border-radius:12px;width:38px;height:38px;cursor:pointer;color:#f8fafc;font-size:20px}.proto-modal-body{overflow:auto;background:#f8fcf9;padding:18px}.proto-detail-grid{display:grid;grid-template-columns:320px 1fr;gap:18px}.proto-info-panel,.proto-chat-panel{background:#fff;border:1px solid rgba(18,113,55,.13);border-radius:20px;box-shadow:0 16px 38px rgba(15,23,42,.05)}.proto-info-panel{padding:18px}.proto-info-row{padding:12px 0;border-bottom:1px solid #edf2f7}.proto-info-row:last-child{border-bottom:0}.proto-info-row small{display:block;color:#64748b;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.proto-info-row strong,.proto-info-row span{display:block;margin-top:4px;color:#f8fafc;font-weight:800;line-height:1.35}.proto-tabs{display:flex;gap:8px;border-bottom:1px solid #e2e8f0;padding:12px 14px}.proto-tab{border:0;background:transparent;padding:10px 14px;border-radius:12px;font-weight:900;color:#64748b;cursor:pointer}.proto-tab.active{background:#e8f8ee;color:#047335}.proto-chat-box{height:430px;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:14px;background:linear-gradient(180deg,#fff,#fbfffc)}.proto-msg{max-width:72%;padding:12px 14px;border-radius:16px;box-shadow:0 8px 20px rgba(15,23,42,.05);font-size:13px;line-height:1.42}.proto-msg small{display:block;margin-top:7px;color:#64748b;font-size:11px}.proto-msg.cidadao{align-self:flex-start;background:#f1f5f9;border-top-left-radius:5px}.proto-msg.atendente,.proto-msg.sistema{align-self:flex-end;background:#dcfce7;border-top-right-radius:5px}.proto-chat-send{display:flex;gap:10px;border-top:1px solid #e2e8f0;padding:14px}.proto-chat-send textarea{flex:1;height:48px;max-height:100px;resize:vertical;border:1px solid rgba(18,113,55,.2);border-radius:14px;padding:13px;background:#fff}.proto-chat-send button{border:0;border-radius:14px;padding:0 18px;background:linear-gradient(135deg,#087a3a,#22c55e);color:#111827;font-weight:900;cursor:pointer}.proto-final-note{margin:14px;padding:14px;border-radius:14px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-weight:800}.proto-modal-foot{display:flex;justify-content:flex-end;gap:10px;padding:15px 20px;border-top:1px solid #e2e8f0;background:#fff}.proto-primary,.proto-soft,.proto-danger{border:0;border-radius:14px;padding:12px 16px;font-weight:900;cursor:pointer}.proto-primary{background:linear-gradient(135deg,#087a3a,#22c55e);color:#111827}.proto-soft{background:#f8fafc;color:#f8fafc;border:1px solid #dbe3ea}.proto-danger{background:#ef4444;color:#111827}.portal-protocol-panel{background:#fff;border:1px solid rgba(18,113,55,.12);border-radius:22px;padding:18px;box-shadow:0 18px 44px rgba(15,23,42,.07);margin-top:16px}.portal-protocol-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.portal-message-history{display:flex;flex-direction:column;gap:10px;margin-top:14px}.portal-message{padding:12px 14px;border-radius:14px;background:#f1f5f9}.portal-message.gabinete{background:#dcfce7}.portal-message small{display:block;color:#64748b;margin-top:5px}.portal-reply-box{display:flex;gap:10px;margin-top:14px}.portal-reply-box input{flex:1;border:1px solid rgba(18,113,55,.22);border-radius:14px;padding:13px}.portal-reply-box button{border:0;border-radius:14px;background:#087a3a;color:#111827;font-weight:900;padding:0 16px}.portal-finalizado{margin-top:14px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;padding:14px;border-radius:14px;font-weight:800}@media(max-width:980px){.protocolos-cards{grid-template-columns:repeat(2,1fr)}.protocolos-head{flex-direction:column;align-items:stretch}.protocolos-actions{flex-wrap:wrap}.protocolos-search{min-width:0;flex:1}.proto-detail-grid{grid-template-columns:1fr}.proto-modal-overlay{padding-top:90px}.protocolos-table-card{overflow:auto}.protocolos-table{min-width:900px}}@media(max-width:620px){.protocolos-cards{grid-template-columns:1fr}.proto-modal{width:96vw}.proto-msg{max-width:88%}.portal-protocol-grid{grid-template-columns:1fr}}


/* Hotfix Portal Protocolo - corrige textos quebrados/sobrepostos e melhora a área de acompanhamento */
.portal-publico, .portal-publico * { text-rendering: optimizeLegibility; }
.follow-card, .acompanhar-card, #acompanhar .protocol-search, #acompanhar .follow-box {
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
}
#acompanhar input, #protocolSearchInput { min-width:260px; flex:1 1 320px; }
.portal-steps, .trust-strip, .portal-benefits { display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; align-items:stretch; }
.portal-steps > *, .trust-strip > *, .portal-benefits > * { min-width:0; overflow:hidden; }
.portal-steps .icon, .trust-strip .icon, .portal-benefits .icon { flex:0 0 46px; width:46px; height:46px; display:grid; place-items:center; font-size:22px; line-height:1; }
#faq, .faq-section { overflow:hidden; }
.faq-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
@media(max-width:900px){ .portal-steps, .trust-strip, .portal-benefits{grid-template-columns:1fr 1fr;} .faq-grid{grid-template-columns:1fr;} }
@media(max-width:560px){ .portal-steps, .trust-strip, .portal-benefits{grid-template-columns:1fr;} }

/* Visualizar protocolo - ajuste premium do modal sobre a topbar */
html:has(.proto-modal-overlay.show),
body:has(.proto-modal-overlay.show) {
  overflow: hidden !important;
}

.proto-modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 28px !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(34, 197, 94, .18), transparent 32%),
    rgba(3, 20, 11, .62) !important;
  backdrop-filter: blur(11px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(11px) saturate(118%) !important;
}

body.proto-modal-open .topbar,
body.proto-modal-open .premium-topbar,
body.proto-modal-open .app-header,
body.proto-modal-open .header,
body.proto-modal-open .page-header,
body.proto-modal-open aside.sidebar,
body.proto-modal-open .sidebar {
  z-index: 1 !important;
}

body.proto-modal-open .proto-modal-overlay {
  z-index: 2147483647 !important;
}

.proto-modal-overlay.show {
  display: flex !important;
}

.proto-modal {
  width: min(1180px, calc(100vw - 56px)) !important;
  max-height: calc(100dvh - 56px) !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  overflow: hidden !important;
  border: 1px solid rgba(184, 219, 197, .92) !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 44px 120px rgba(0, 0, 0, .34) !important;
}

.proto-modal-head {
  position: relative !important;
  z-index: 2 !important;
  min-height: 76px !important;
  padding: 18px 22px !important;
  gap: 18px !important;
  border-bottom: 1px solid rgba(18, 113, 55, .13) !important;
  background: linear-gradient(135deg, #ffffff 0%, #f6fbf8 100%) !important;
}

.proto-modal-head h2 {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 0 !important;
  color: #102217 !important;
  font-size: 22px !important;
  line-height: 1.15 !important;
}

.proto-modal-head p {
  margin-top: 7px !important;
  color: #607269 !important;
  font-size: 13px !important;
}

.proto-close {
  flex: 0 0 auto !important;
  width: 40px !important;
  height: 40px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(18, 113, 55, .14) !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #173322 !important;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .07) !important;
}

.proto-modal-body {
  min-height: 0 !important;
  overflow: auto !important;
  padding: 18px !important;
  background:
    linear-gradient(180deg, rgba(239, 248, 242, .72), rgba(248, 252, 249, .96)) !important;
}

.proto-detail-grid {
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(260px, 330px) minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
}

.proto-info-panel,
.proto-chat-panel {
  min-width: 0 !important;
  border: 1px solid rgba(18, 113, 55, .14) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, .06) !important;
}

.proto-info-panel {
  max-height: calc(100dvh - 198px) !important;
  overflow: auto !important;
  padding: 16px !important;
}

.proto-info-row {
  padding: 12px 0 !important;
  border-bottom: 1px solid rgba(18, 113, 55, .09) !important;
}

.proto-info-row small {
  color: #607269 !important;
  font-size: 10.5px !important;
}

.proto-info-row strong,
.proto-info-row span {
  color: #13251a !important;
  overflow-wrap: anywhere !important;
}

.proto-chat-panel {
  min-height: min(520px, calc(100dvh - 198px)) !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  overflow: hidden !important;
}

.proto-tabs {
  overflow-x: auto !important;
  padding: 12px 14px !important;
  border-bottom: 1px solid rgba(18, 113, 55, .12) !important;
  background: #fff !important;
}

.proto-tab {
  white-space: nowrap !important;
  border-radius: 10px !important;
  color: #53685d !important;
}

.proto-tab.active {
  background: #e6f6ec !important;
  color: #087a3a !important;
}

.proto-chat-box {
  min-height: 300px !important;
  height: auto !important;
  overflow: auto !important;
  padding: 18px !important;
  background:
    radial-gradient(circle at 100% 0, rgba(34, 197, 94, .08), transparent 34%),
    linear-gradient(180deg, #fff, #fbfffc) !important;
}

.proto-msg {
  max-width: min(76%, 620px) !important;
  border: 1px solid rgba(15, 23, 42, .04) !important;
}

.proto-msg.cidadao {
  background: #f3f7f5 !important;
}

.proto-msg.atendente,
.proto-msg.sistema {
  background: #ddf7e7 !important;
}

.proto-chat-send {
  align-items: flex-end !important;
  padding: 14px !important;
  background: #fff !important;
  border-top: 1px solid rgba(18, 113, 55, .12) !important;
}

.proto-chat-send textarea {
  min-height: 48px !important;
  max-height: 110px !important;
  border-radius: 13px !important;
}

.proto-modal-foot {
  position: relative !important;
  z-index: 2 !important;
  padding: 15px 20px !important;
  border-top: 1px solid rgba(18, 113, 55, .12) !important;
  background: #fff !important;
}

.proto-primary,
.proto-soft,
.proto-danger {
  border-radius: 12px !important;
  min-height: 42px !important;
  padding: 11px 17px !important;
}

@media (max-width: 980px) {
  .proto-modal-overlay {
    padding: 14px !important;
  }

  .proto-modal {
    width: calc(100vw - 28px) !important;
    max-height: calc(100dvh - 28px) !important;
  }

  .proto-detail-grid {
    grid-template-columns: 1fr !important;
  }

  .proto-info-panel,
  .proto-chat-panel {
    max-height: none !important;
  }
}

@media (max-width: 620px) {
  .proto-modal-head,
  .proto-modal-foot {
    padding: 14px !important;
  }

  .proto-modal-head h2 {
    font-size: 18px !important;
  }

  .proto-modal-foot {
    flex-wrap: wrap !important;
  }

  .proto-primary,
  .proto-soft,
  .proto-danger {
    flex: 1 1 100% !important;
  }

  .proto-msg {
    max-width: 92% !important;
  }
}

/* Protocol workflow tabs: internal data, attachments and timeline */
.proto-tab-pane {
  min-height: 430px !important;
  max-height: 430px !important;
  overflow: auto !important;
  padding: 18px !important;
  background:
    radial-gradient(circle at 100% 0, rgba(34, 197, 94, .08), transparent 34%),
    linear-gradient(180deg, #fff, #fbfffc) !important;
}

.proto-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  padding: 16px !important;
  border: 1px solid rgba(18, 113, 55, .14) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .04) !important;
}

.proto-form-grid label {
  display: grid !important;
  gap: 7px !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.proto-form-grid .full {
  grid-column: 1 / -1 !important;
}

.proto-form-grid input,
.proto-form-grid select,
.proto-form-grid textarea {
  width: 100% !important;
  border: 1px solid rgba(18, 113, 55, .18) !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #10251a !important;
  font: inherit !important;
  font-weight: 650 !important;
  padding: 11px 13px !important;
  outline: none !important;
}

.proto-form-grid textarea {
  min-height: 88px !important;
  resize: vertical !important;
}

.proto-form-grid input:focus,
.proto-form-grid select:focus,
.proto-form-grid textarea:focus {
  border-color: #16a34a !important;
  box-shadow: 0 0 0 4px rgba(22, 163, 74, .10) !important;
}

.proto-mini-list {
  display: grid !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

.proto-mini-list article,
.proto-history-item {
  border: 1px solid rgba(18, 113, 55, .12) !important;
  border-radius: 15px !important;
  background: #fff !important;
  padding: 13px 15px !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, .035) !important;
}

.proto-mini-list article strong,
.proto-history-item strong {
  display: block !important;
  color: #10251a !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.proto-mini-list article p,
.proto-history-item p {
  margin: 5px 0 !important;
  color: #334155 !important;
  line-height: 1.45 !important;
  font-size: 13px !important;
}

.proto-mini-list article small,
.proto-history-item small {
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.proto-file-link {
  display: inline-flex !important;
  margin-top: 10px !important;
  color: #087a3a !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.proto-history-pane {
  display: grid !important;
  gap: 10px !important;
}

.proto-history-item {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 12px !important;
}

.proto-history-item > span {
  width: 12px !important;
  height: 12px !important;
  margin-top: 4px !important;
  border-radius: 999px !important;
  background: #16a34a !important;
  box-shadow: 0 0 0 5px rgba(22, 163, 74, .10) !important;
}

@media (max-width: 760px) {
  .proto-form-grid {
    grid-template-columns: 1fr !important;
  }

  .proto-tab-pane {
    max-height: none !important;
    min-height: 320px !important;
  }
}


/* === FIX LEGENDA DO MAPA: contraste e leitura === */
.map-legend,
.mapa-legenda,
.legend-map,
.legenda-mapa,
.category-legend,
.categoria-legenda,
#mapLegend,
#mapaLegenda,
.leaflet-control .map-legend,
.leaflet-control .legenda-mapa {
  background: rgba(255,255,255,0.96) !important;
  border: 1px solid rgba(15, 82, 43, 0.22) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.18) !important;
  color: #0f172a !important;
  backdrop-filter: blur(10px) !important;
}

.map-legend *,
.mapa-legenda *,
.legend-map *,
.legenda-mapa *,
.category-legend *,
.categoria-legenda *,
#mapLegend *,
#mapaLegenda * {
  color: #123524 !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

.map-legend button,
.mapa-legenda button,
.legend-map button,
.legenda-mapa button,
.category-legend button,
.categoria-legenda button,
#mapLegend button,
#mapaLegenda button,
.map-filter-chip,
.category-chip,
.legend-chip,
.categoria-chip {
  background: rgba(255,255,255,0.98) !important;
  color: #0f3d27 !important;
  border: 1px solid rgba(16, 185, 129, 0.24) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.10) !important;
  opacity: 1 !important;
  filter: none !important;
}

.map-legend .dot,
.mapa-legenda .dot,
.legend-dot,
.legenda-dot,
.category-dot,
.categoria-dot {
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.9) !important;
}


/* === FIX GLOBAL: textos escuros em cards, painel e filtros === */
:root {
  --texto-forte-sistema: #f8fafc;
  --texto-normal-sistema: #dbeafe;
  --texto-suave-sistema: #b7c9bd;
}

/* Painel/dashboard/cards */
.dashboard,
.painel,
.panel,
.page,
.main-content,
.content,
.card,
.metric-card,
.stat-card,
.radar-card,
.kpi-card,
.widget,
section[class*="card"],
div[class*="card"] {
  color: var(--texto-normal-sistema) !important;
}

.dashboard h1,
.dashboard h2,
.dashboard h3,
.dashboard h4,
.painel h1,
.painel h2,
.painel h3,
.painel h4,
.panel h1,
.panel h2,
.panel h3,
.panel h4,
.card h1,
.card h2,
.card h3,
.card h4,
.metric-card h1,
.metric-card h2,
.metric-card h3,
.metric-card h4,
.stat-card h1,
.stat-card h2,
.stat-card h3,
.stat-card h4 {
  color: var(--texto-forte-sistema) !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.dashboard p,
.dashboard span,
.dashboard small,
.dashboard strong,
.painel p,
.painel span,
.painel small,
.painel strong,
.panel p,
.panel span,
.panel small,
.panel strong,
.card p,
.card span,
.card small,
.card strong,
.metric-card p,
.metric-card span,
.metric-card small,
.metric-card strong,
.stat-card p,
.stat-card span,
.stat-card small,
.stat-card strong {
  color: var(--texto-normal-sistema) !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Números grandes dos cards */
.metric-card .value,
.stat-card .value,
.kpi-value,
.card-value,
[class*="numero"],
[class*="valor"],
[class*="count"],
[class*="total"] {
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Labels pequenos */
.label,
.badge,
.chip,
.tag,
.pill,
.subtitle,
.text-muted,
.muted,
[class*="subtitle"],
[class*="muted"] {
  color: #c7f9d8 !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Aba mapas: filtros e legenda inferior */
.map-toolbar,
.mapa-toolbar,
.map-filters,
.mapa-filtros,
.filters,
.filtros,
.map-panel,
.mapa-panel,
.map-legend,
.mapa-legenda,
.legend-map,
.legenda-mapa,
.category-legend,
.categoria-legenda {
  color: #0f3d27 !important;
  opacity: 1 !important;
  filter: none !important;
}

.map-toolbar *,
.mapa-toolbar *,
.map-filters *,
.mapa-filtros *,
.filters *,
.filtros *,
.map-panel *,
.mapa-panel *,
.map-legend *,
.mapa-legenda *,
.legend-map *,
.legenda-mapa *,
.category-legend *,
.categoria-legenda * {
  opacity: 1 !important;
  filter: none !important;
}

.map-toolbar input,
.mapa-toolbar input,
.map-toolbar select,
.mapa-toolbar select,
.map-filters input,
.mapa-filtros input,
.map-filters select,
.mapa-filtros select,
.filters input,
.filtros input,
.filters select,
.filtros select {
  color: #f8fafc !important;
  background: rgba(3, 18, 12, .72) !important;
  border-color: rgba(34,197,94,.35) !important;
}

.map-toolbar input::placeholder,
.mapa-toolbar input::placeholder,
.map-filters input::placeholder,
.mapa-filtros input::placeholder,
.filters input::placeholder,
.filtros input::placeholder {
  color: rgba(248,250,252,.72) !important;
}

/* Legenda de categoria embaixo do mapa: chip claro com texto verde escuro */
.map-legend button,
.mapa-legenda button,
.legend-map button,
.legenda-mapa button,
.category-legend button,
.categoria-legenda button,
.map-filter-chip,
.category-chip,
.legend-chip,
.categoria-chip,
[class*="legend"] .chip,
[class*="legenda"] .chip {
  background: rgba(255,255,255,.96) !important;
  color: #0f3d27 !important;
  border: 1px solid rgba(15,61,39,.18) !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

.map-legend button *,
.mapa-legenda button *,
.legend-map button *,
.legenda-mapa button *,
.category-legend button *,
.categoria-legenda button *,
.map-filter-chip *,
.category-chip *,
.legend-chip *,
.categoria-chip * {
  color: #0f3d27 !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

/* Evita que patches antigos deixem texto invisível */
[style*="color: rgb(0, 0, 0)"],
[style*="color:#000"],
[style*="color: #000"],
[style*="color:#020617"],
[style*="color: #020617"],
[style*="color:#0f172a"],
[style*="color: #0f172a"] {
  color: #f8fafc !important;
}


/* FIX APENAS TITULOS DOS PAINEIS */
.dashboard-title,
.panel-title,
.card-title,
.widget-title,
.section-title,
.radar-title,
.titulo-painel,
.titulo-card,
.titulo-dashboard,
[class*="title"],
[class*="titulo"]{
  color:#ffffff !important;
  text-shadow:0 1px 2px rgba(0,0,0,.45) !important;
}


/* =========================================================
   PAINEL PREMIUM ORGANIZADO - SOMENTE VISUAL
   Mantém Firebase, rotas, login, mapa e lógica intactos.
   ========================================================= */

/* Área geral do painel */
#painel,
.painel,
.dashboard,
.dashboard-page,
.page-dashboard,
[data-page="painel"],
[data-view="painel"] {
  --panel-bg: rgba(4, 18, 13, .76);
  --panel-bg-2: rgba(8, 31, 22, .68);
  --panel-border: rgba(34, 197, 94, .22);
  --panel-border-soft: rgba(255,255,255,.08);
  --panel-text: #f8fafc;
  --panel-muted: rgba(226, 232, 240, .78);
  --panel-green: #22c55e;
  --panel-green-2: #16a34a;
  --panel-blue: #38bdf8;
  --panel-orange: #f59e0b;
  --panel-purple: #a855f7;
  color: var(--panel-text) !important;
}

/* Conteúdo com largura e respiro parecidos com preview */
#painel main,
.painel main,
.dashboard main,
.dashboard-page main,
.page-dashboard main,
#painel .content,
.painel .content,
.dashboard .content,
.dashboard-page .content,
.page-dashboard .content,
#painel .main-content,
.painel .main-content,
.dashboard .main-content {
  max-width: 1680px !important;
  margin: 0 auto !important;
  padding: 18px 24px 32px !important;
}

/* Hero principal do dashboard: duas colunas */
#painel .hero,
.painel .hero,
.dashboard .hero,
#painel .dashboard-hero,
.painel .dashboard-hero,
.dashboard .dashboard-hero,
#painel .executive-panel,
.painel .executive-panel,
.dashboard .executive-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 520px !important;
  gap: 24px !important;
  align-items: stretch !important;
  padding: 24px !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 18% 15%, rgba(34,197,94,.18), transparent 34%),
    linear-gradient(135deg, rgba(5,20,14,.92), rgba(2,10,7,.86)) !important;
  border: 1px solid var(--panel-border) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05) !important;
}

/* Caso o hero não tenha classe, aplica no primeiro bloco grande do painel */
#painel > section:first-of-type,
.painel > section:first-of-type,
.dashboard > section:first-of-type,
.dashboard-page > section:first-of-type {
  border-radius: 24px !important;
}

/* Badge "Dashboard" */
#painel .badge,
.painel .badge,
.dashboard .badge,
#painel .eyebrow,
.painel .eyebrow,
.dashboard .eyebrow,
#painel [class*="badge"],
.painel [class*="badge"],
.dashboard [class*="badge"] {
  color: #d1fae5 !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 999px !important;
  padding: 7px 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
}

/* Títulos brancos e com hierarquia premium */
#painel h1,
.painel h1,
.dashboard h1,
.dashboard-page h1,
.page-dashboard h1 {
  color: #ffffff !important;
  font-size: clamp(34px, 3.1vw, 56px) !important;
  line-height: .98 !important;
  letter-spacing: -0.055em !important;
  font-weight: 900 !important;
  margin: 18px 0 10px !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.42) !important;
}

#painel h2,
#painel h3,
#painel h4,
.painel h2,
.painel h3,
.painel h4,
.dashboard h2,
.dashboard h3,
.dashboard h4 {
  color: #f8fafc !important;
  opacity: 1 !important;
}

/* Descrição/subtitle */
#painel p,
.painel p,
.dashboard p,
.dashboard-page p {
  color: var(--panel-muted) !important;
}

/* Cards pequenos do topo */
#painel .stats,
.painel .stats,
.dashboard .stats,
#painel .metric-row,
.painel .metric-row,
.dashboard .metric-row,
#painel .kpi-row,
.painel .kpi-row,
.dashboard .kpi-row {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(150px, 1fr)) !important;
  gap: 14px !important;
  margin-top: 26px !important;
}

#painel .stat-card,
#painel .metric-card,
#painel .kpi-card,
.painel .stat-card,
.painel .metric-card,
.painel .kpi-card,
.dashboard .stat-card,
.dashboard .metric-card,
.dashboard .kpi-card,
#painel [class*="metric"],
.painel [class*="metric"],
.dashboard [class*="metric"] {
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(34,197,94,.15), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022)) !important;
  border: 1px solid rgba(34,197,94,.22) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 32px rgba(0,0,0,.20) !important;
  padding: 20px !important;
  min-height: 112px !important;
  color: #fff !important;
}

#painel .stat-card strong,
#painel .metric-card strong,
#painel .kpi-card strong,
.painel .stat-card strong,
.painel .metric-card strong,
.painel .kpi-card strong,
.dashboard .stat-card strong,
.dashboard .metric-card strong,
.dashboard .kpi-card strong {
  color: #fff !important;
  font-size: 32px !important;
  font-weight: 900 !important;
}

#painel .stat-card small,
#painel .metric-card small,
#painel .kpi-card small,
.painel .stat-card small,
.painel .metric-card small,
.painel .kpi-card small,
.dashboard .stat-card small,
.dashboard .metric-card small,
.dashboard .kpi-card small {
  color: rgba(226,232,240,.78) !important;
}

/* Botões do hero */
#painel button,
.painel button,
.dashboard button,
#painel .btn,
.painel .btn,
.dashboard .btn {
  border-radius: 12px !important;
  font-weight: 800 !important;
}

#painel .btn-primary,
.painel .btn-primary,
.dashboard .btn-primary,
#painel button.primary,
.painel button.primary,
.dashboard button.primary {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  color: #03120c !important;
  border: 0 !important;
  box-shadow: 0 14px 28px rgba(34,197,94,.22) !important;
}

/* Radar do dia: cards empilhados como preview */
#painel .radar,
.painel .radar,
.dashboard .radar,
#painel .radar-card,
.painel .radar-card,
.dashboard .radar-card,
#painel [class*="radar"],
.painel [class*="radar"],
.dashboard [class*="radar"] {
  border-radius: 18px !important;
  color: #fff !important;
}

#painel .radar-list,
.painel .radar-list,
.dashboard .radar-list,
#painel .side-widgets,
.painel .side-widgets,
.dashboard .side-widgets,
#painel .right-panel,
.painel .right-panel,
.dashboard .right-panel {
  display: grid !important;
  gap: 12px !important;
}

#painel .right-panel > *,
.painel .right-panel > *,
.dashboard .right-panel > *,
#painel .side-widgets > *,
.painel .side-widgets > *,
.dashboard .side-widgets > * {
  border-radius: 16px !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  padding: 14px 16px !important;
}

/* Segunda linha de cards grandes */
#painel .summary-grid,
.painel .summary-grid,
.dashboard .summary-grid,
#painel .cards-grid,
.painel .cards-grid,
.dashboard .cards-grid,
#painel .overview-grid,
.painel .overview-grid,
.dashboard .overview-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(180px, 1fr)) !important;
  gap: 18px !important;
  margin: 18px 0 !important;
}

/* Área inferior: tabela + mapa lado a lado */
#painel .dashboard-bottom,
.painel .dashboard-bottom,
.dashboard .dashboard-bottom,
#painel .bottom-grid,
.painel .bottom-grid,
.dashboard .bottom-grid,
#painel .content-grid,
.painel .content-grid,
.dashboard .content-grid {
  display: grid !important;
  grid-template-columns: minmax(420px, .95fr) minmax(520px, 1.25fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
  margin-top: 18px !important;
}

/* Seções de tabela e mapa */
#painel .table-card,
#painel .map-card,
#painel .map-section,
#painel .demand-list,
.painel .table-card,
.painel .map-card,
.painel .map-section,
.painel .demand-list,
.dashboard .table-card,
.dashboard .map-card,
.dashboard .map-section,
.dashboard .demand-list,
#painel section:has(table),
.painel section:has(table),
.dashboard section:has(table) {
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 92% 10%, rgba(34,197,94,.10), transparent 28%),
    rgba(4, 18, 13, .82) !important;
  border: 1px solid rgba(34,197,94,.20) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05) !important;
  padding: 16px !important;
  overflow: hidden !important;
}

/* mapa menor no painel, mas bonito */
#painel .leaflet-container,
.painel .leaflet-container,
.dashboard .leaflet-container {
  border-radius: 18px !important;
  min-height: 320px !important;
}

/* Tabela premium */
#painel table,
.painel table,
.dashboard table {
  width: 100% !important;
  border-collapse: collapse !important;
  color: #e5e7eb !important;
  background: transparent !important;
}

#painel th,
.painel th,
.dashboard th {
  color: #d1fae5 !important;
  background: rgba(34,197,94,.16) !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  padding: 14px 12px !important;
}

#painel td,
.painel td,
.dashboard td {
  color: #f1f5f9 !important;
  padding: 14px 12px !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
}

/* status pills */
#painel .status,
.painel .status,
.dashboard .status,
#painel [class*="status"],
.painel [class*="status"],
.dashboard [class*="status"] {
  border-radius: 999px !important;
  padding: 6px 10px !important;
  font-weight: 900 !important;
}

/* Cabeçalho antigo Mandato/Painel: deixa compacto e limpo */
#painel .topbar,
.painel .topbar,
.dashboard .topbar,
.header-panel,
.panel-header {
  border-radius: 20px !important;
  background: rgba(3, 14, 9, .72) !important;
  border: 1px solid rgba(34,197,94,.18) !important;
}

/* responsivo */
@media (max-width: 1180px) {
  #painel .hero,
  .painel .hero,
  .dashboard .hero,
  #painel .dashboard-hero,
  .painel .dashboard-hero,
  .dashboard .dashboard-hero,
  #painel .executive-panel,
  .painel .executive-panel,
  .dashboard .executive-panel {
    grid-template-columns: 1fr !important;
  }

  #painel .dashboard-bottom,
  .painel .dashboard-bottom,
  .dashboard .dashboard-bottom,
  #painel .bottom-grid,
  .painel .bottom-grid,
  .dashboard .bottom-grid,
  #painel .content-grid,
  .painel .content-grid,
  .dashboard .content-grid {
    grid-template-columns: 1fr !important;
  }

  #painel .summary-grid,
  .painel .summary-grid,
  .dashboard .summary-grid,
  #painel .cards-grid,
  .painel .cards-grid,
  .dashboard .cards-grid,
  #painel .overview-grid,
  .painel .overview-grid,
  .dashboard .overview-grid,
  #painel .stats,
  .painel .stats,
  .dashboard .stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  #painel main,
  .painel main,
  .dashboard main {
    padding: 14px !important;
  }

  #painel .summary-grid,
  .painel .summary-grid,
  .dashboard .summary-grid,
  #painel .cards-grid,
  .painel .cards-grid,
  .dashboard .cards-grid,
  #painel .overview-grid,
  .painel .overview-grid,
  .dashboard .overview-grid,
  #painel .stats,
  .painel .stats,
  .dashboard .stats {
    grid-template-columns: 1fr !important;
  }

  #painel h1,
  .painel h1,
  .dashboard h1 {
    font-size: 34px !important;
  }
}


/* FIX TEXTO TRANSFORMA VERDE */
.hero-title .highlight,
.transforma,
.text-gradient,
.highlight-green,
.green-text{
  color:#22c55e !important;
  background:none !important;
  -webkit-text-fill-color:#22c55e !important;
  text-shadow:
    0 0 12px rgba(34,197,94,.25),
    0 0 24px rgba(34,197,94,.12) !important;
  opacity:1 !important;
  filter:none !important;
}

.hero-title .highlight *,
.transforma *,
.text-gradient *{
  color:#22c55e !important;
  -webkit-text-fill-color:#22c55e !important;
}


/* =========================================================
   FIX REAL LOGIN HERO - palavra "transforma." verde puro
   ========================================================= */

/* Título esquerdo do login */
.login-hero h1,
.auth-hero h1,
.login-left h1,
.auth-left h1,
.hero-login h1,
.hero-title,
[class*="login"] h1,
[class*="auth"] h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  background: none !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Qualquer span/strong usado para a palavra transforma */
.login-hero h1 span,
.auth-hero h1 span,
.login-left h1 span,
.auth-left h1 span,
.hero-login h1 span,
.hero-title span,
.login-hero h1 strong,
.auth-hero h1 strong,
.login-left h1 strong,
.auth-left h1 strong,
.hero-login h1 strong,
.hero-title strong,
.transforma,
.text-transforma,
.highlight-transforma,
.hero-title .highlight,
.hero-title .accent,
.hero-title .green,
.text-gradient,
.highlight-green,
.green-text {
  color: #22c55e !important;
  -webkit-text-fill-color: #22c55e !important;
  background: none !important;
  background-image: none !important;
  background-clip: initial !important;
  -webkit-background-clip: initial !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow:
    0 0 10px rgba(34,197,94,.55),
    0 0 22px rgba(34,197,94,.28) !important;
}

/* Caso exista marcação com gradiente aplicada diretamente */
.login-hero .text-gradient,
.auth-hero .text-gradient,
.login-left .text-gradient,
.auth-left .text-gradient,
.hero-login .text-gradient {
  color: #22c55e !important;
  -webkit-text-fill-color: #22c55e !important;
  background: none !important;
  background-image: none !important;
}

/* Labels verdes dos bullets do login */
.login-feature-title,
.auth-feature-title,
.login-feature strong,
.auth-feature strong,
[class*="feature"] strong {
  color: #22c55e !important;
  -webkit-text-fill-color: #22c55e !important;
}



/* =========================================================
   FIX FINAL LOGIN - frases verdes premium
   ========================================================= */

.transforma,
.text-transforma,
.highlight-transforma,
.hero-title .highlight,
.hero-title .accent,
.hero-title .green {
  color: #22c55e !important;
  -webkit-text-fill-color: #22c55e !important;
  background: none !important;
  background-image: none !important;
  text-shadow:
    0 0 12px rgba(34,197,94,.55),
    0 0 24px rgba(34,197,94,.28) !important;
}

/* Frase inferior */
.quote,
.login-quote,
.hero-quote,
blockquote,
.quote-text,
.login-footer-quote,
[class*="quote"] {
  color: #22c55e !important;
  -webkit-text-fill-color: #22c55e !important;
  text-shadow:
    0 0 10px rgba(34,197,94,.40),
    0 0 18px rgba(34,197,94,.20) !important;
  opacity: 1 !important;
}

/* Ícones/quotes */
.quote-mark,
blockquote::before,
blockquote::after {
  color: #22c55e !important;
}


/* =========================================================
   FIX REAL INSPECIONADO - LOGIN VERDE E SEM OVERLAY NA LETRA
   ========================================================= */

/* Garante que o título do hero não herde gradiente branco/cinza */
.login-transforma-verde,
.login-transforma-verde *,
.login-page .login-transforma-verde,
.auth-page .login-transforma-verde,
.login-screen .login-transforma-verde,
.auth-screen .login-transforma-verde,
body .login-transforma-verde {
  color: #22ff7a !important;
  -webkit-text-fill-color: #22ff7a !important;
  background: transparent !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  text-shadow:
    0 0 4px rgba(34,255,122,.95),
    0 0 14px rgba(34,255,122,.70),
    0 0 32px rgba(34,255,122,.36) !important;
}

/* Caso a palavra ainda esteja sem span, pega spans/highlights dentro do título esquerdo */
.login-left h1 span,
.auth-left h1 span,
.login-hero h1 span,
.auth-hero h1 span,
.hero-login h1 span,
.login-page h1 span,
.auth-page h1 span,
[class*="login"] h1 span,
[class*="auth"] h1 span,
.transforma,
.text-transforma,
.highlight-transforma {
  color: #22ff7a !important;
  -webkit-text-fill-color: #22ff7a !important;
  background: transparent !important;
  background-image: none !important;
  filter: none !important;
  opacity: 1 !important;
  text-shadow:
    0 0 4px rgba(34,255,122,.95),
    0 0 14px rgba(34,255,122,.70),
    0 0 32px rgba(34,255,122,.36) !important;
}

/* Frase inferior verde brilhando */
.login-quote-verde,
.login-quote-verde *,
.login-quote,
.hero-quote,
.quote-text,
blockquote,
[class*="quote"] {
  color: #22ff7a !important;
  -webkit-text-fill-color: #22ff7a !important;
  background: transparent !important;
  background-image: none !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  text-shadow:
    0 0 4px rgba(34,255,122,.75),
    0 0 14px rgba(34,255,122,.48),
    0 0 28px rgba(34,255,122,.24) !important;
}

/* Remove "máscara/overview" preta que estava passando por cima das letras do login */
.login-page::before,
.login-page::after,
.auth-page::before,
.auth-page::after,
.login-screen::before,
.login-screen::after,
.auth-screen::before,
.auth-screen::after,
.login-bg::before,
.login-bg::after,
.auth-bg::before,
.auth-bg::after,
[class*="login"]::before,
[class*="login"]::after {
  pointer-events: none !important;
}

/* O overlay de foto continua, mas não escurece os textos */
.login-content,
.login-panel,
.login-card,
.auth-card,
.login-left,
.auth-left,
.login-hero,
.auth-hero,
.hero-login {
  position: relative !important;
  z-index: 5 !important;
}

/* Título principal normal branco puro, sem preto em cima */
.login-left h1,
.auth-left h1,
.login-hero h1,
.auth-hero h1,
.hero-login h1,
.login-page h1,
.auth-page h1 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  text-shadow:
    0 0 10px rgba(255,255,255,.18),
    0 2px 8px rgba(0,0,0,.42) !important;
}


/* =========================================================
   ANALÍTICO PREMIUM - SOMENTE VISUAL
   Corrige contraste, cards brancos e organização dos gráficos
   ========================================================= */

body:has([data-page="analitico"]),
body:has(.analitico),
body:has(.analytics),
body:has(.analytics-page) {
  background: #020b07 !important;
}

/* container da página analítica */
[data-page="analitico"],
.analitico,
.analytics,
.analytics-page,
.page-analitico,
#analitico {
  color: #f8fafc !important;
  --ana-bg: rgba(4, 18, 13, .78);
  --ana-card: rgba(6, 24, 16, .84);
  --ana-border: rgba(34, 197, 94, .22);
  --ana-text: #f8fafc;
  --ana-muted: rgba(226,232,240,.78);
  --ana-green: #22c55e;
  --ana-yellow: #f59e0b;
}

/* hero superior */
[data-page="analitico"] .hero,
.analitico .hero,
.analytics .hero,
.analytics-page .hero,
.page-analitico .hero,
#analitico .hero,
[data-page="analitico"] section:first-of-type,
.analitico section:first-of-type,
.analytics section:first-of-type,
.page-analitico section:first-of-type {
  background:
    radial-gradient(circle at 75% 20%, rgba(34,197,94,.16), transparent 34%),
    linear-gradient(135deg, rgba(7, 28, 19, .94), rgba(2, 10, 7, .92)) !important;
  border: 1px solid var(--ana-border) !important;
  border-radius: 24px !important;
  padding: 28px !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05) !important;
}

/* títulos */
[data-page="analitico"] h1,
.analitico h1,
.analytics h1,
.analytics-page h1,
.page-analitico h1,
#analitico h1 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(36px, 3vw, 54px) !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  letter-spacing: -.055em !important;
  margin: 12px 0 8px !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.42) !important;
}

[data-page="analitico"] h2,
[data-page="analitico"] h3,
[data-page="analitico"] h4,
.analitico h2,
.analitico h3,
.analitico h4,
.analytics h2,
.analytics h3,
.analytics h4,
.analytics-page h2,
.analytics-page h3,
.analytics-page h4,
.page-analitico h2,
.page-analitico h3,
.page-analitico h4,
#analitico h2,
#analitico h3,
#analitico h4 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.42) !important;
}

[data-page="analitico"] p,
.analitico p,
.analytics p,
.analytics-page p,
.page-analitico p,
#analitico p,
[data-page="analitico"] small,
.analitico small,
.analytics small,
.analytics-page small,
.page-analitico small,
#analitico small {
  color: var(--ana-muted) !important;
  opacity: 1 !important;
}

/* cards do topo: tira branco estourado e deixa premium */
[data-page="analitico"] .card,
[data-page="analitico"] .metric-card,
[data-page="analitico"] .kpi-card,
[data-page="analitico"] .stat-card,
.analitico .card,
.analitico .metric-card,
.analitico .kpi-card,
.analitico .stat-card,
.analytics .card,
.analytics .metric-card,
.analytics .kpi-card,
.analytics .stat-card,
.analytics-page .card,
.analytics-page .metric-card,
.analytics-page .kpi-card,
.analytics-page .stat-card,
.page-analitico .card,
.page-analitico .metric-card,
.page-analitico .kpi-card,
.page-analitico .stat-card,
#analitico .card,
#analitico .metric-card,
#analitico .kpi-card,
#analitico .stat-card {
  background:
    radial-gradient(circle at 92% 10%, rgba(34,197,94,.18), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(34,197,94,.22) !important;
  border-radius: 20px !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color: #ffffff !important;
  min-height: 118px !important;
  padding: 20px !important;
  overflow: hidden !important;
}

/* força textos dos cards analíticos */
[data-page="analitico"] .card *,
[data-page="analitico"] .metric-card *,
[data-page="analitico"] .kpi-card *,
[data-page="analitico"] .stat-card *,
.analitico .card *,
.analitico .metric-card *,
.analitico .kpi-card *,
.analitico .stat-card *,
.analytics .card *,
.analytics .metric-card *,
.analytics .kpi-card *,
.analytics .stat-card *,
.analytics-page .card *,
.analytics-page .metric-card *,
.analytics-page .kpi-card *,
.analytics-page .stat-card *,
.page-analitico .card *,
.page-analitico .metric-card *,
.page-analitico .kpi-card *,
.page-analitico .stat-card *,
#analitico .card *,
#analitico .metric-card *,
#analitico .kpi-card *,
#analitico .stat-card * {
  color: inherit !important;
  opacity: 1 !important;
  filter: none !important;
}

[data-page="analitico"] .card strong,
[data-page="analitico"] .metric-card strong,
[data-page="analitico"] .kpi-card strong,
[data-page="analitico"] .stat-card strong,
.analitico .card strong,
.analitico .metric-card strong,
.analitico .kpi-card strong,
.analitico .stat-card strong,
.analytics .card strong,
.analytics .metric-card strong,
.analytics .kpi-card strong,
.analytics .stat-card strong,
.analytics-page .card strong,
.analytics-page .metric-card strong,
.analytics-page .kpi-card strong,
.analytics-page .stat-card strong,
.page-analitico .card strong,
.page-analitico .metric-card strong,
.page-analitico .kpi-card strong,
.page-analitico .stat-card strong,
#analitico .card strong,
#analitico .metric-card strong,
#analitico .kpi-card strong,
#analitico .stat-card strong {
  color: #ffffff !important;
  font-size: 36px !important;
  font-weight: 900 !important;
}

/* grid dos cards do topo */
[data-page="analitico"] .stats,
[data-page="analitico"] .metrics,
[data-page="analitico"] .kpis,
.analitico .stats,
.analitico .metrics,
.analitico .kpis,
.analytics .stats,
.analytics .metrics,
.analytics .kpis,
.analytics-page .stats,
.analytics-page .metrics,
.analytics-page .kpis,
.page-analitico .stats,
.page-analitico .metrics,
.page-analitico .kpis,
#analitico .stats,
#analitico .metrics,
#analitico .kpis {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(140px, 1fr)) !important;
  gap: 14px !important;
  margin: 18px 0 !important;
}

/* painéis dos gráficos */
[data-page="analitico"] .chart-card,
[data-page="analitico"] .chart-panel,
[data-page="analitico"] canvas,
.analitico .chart-card,
.analitico .chart-panel,
.analytics .chart-card,
.analytics .chart-panel,
.analytics-page .chart-card,
.analytics-page .chart-panel,
.page-analitico .chart-card,
.page-analitico .chart-panel,
#analitico .chart-card,
#analitico .chart-panel {
  color: #f8fafc !important;
}

[data-page="analitico"] .chart-card,
[data-page="analitico"] .chart-panel,
[data-page="analitico"] section:has(canvas),
.analitico .chart-card,
.analitico .chart-panel,
.analitico section:has(canvas),
.analytics .chart-card,
.analytics .chart-panel,
.analytics section:has(canvas),
.analytics-page .chart-card,
.analytics-page .chart-panel,
.analytics-page section:has(canvas),
.page-analitico .chart-card,
.page-analitico .chart-panel,
.page-analitico section:has(canvas),
#analitico .chart-card,
#analitico .chart-panel,
#analitico section:has(canvas) {
  background:
    radial-gradient(circle at 95% 8%, rgba(34,197,94,.12), transparent 28%),
    rgba(4, 18, 13, .84) !important;
  border: 1px solid rgba(34,197,94,.22) !important;
  border-radius: 22px !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05) !important;
  padding: 18px !important;
  overflow: hidden !important;
}

/* grid dos gráficos: linha grande + dois menores */
[data-page="analitico"] .charts-grid,
.analitico .charts-grid,
.analytics .charts-grid,
.analytics-page .charts-grid,
.page-analitico .charts-grid,
#analitico .charts-grid {
  display: grid !important;
  grid-template-columns: 2fr 1fr 1fr !important;
  gap: 18px !important;
  align-items: stretch !important;
}

/* corrige legendas dos gráficos e eixos apagados */
[data-page="analitico"] canvas,
.analitico canvas,
.analytics canvas,
.analytics-page canvas,
.page-analitico canvas,
#analitico canvas {
  filter: none !important;
  opacity: 1 !important;
}

/* botões superiores */
[data-page="analitico"] button,
.analitico button,
.analytics button,
.analytics-page button,
.page-analitico button,
#analitico button {
  border-radius: 14px !important;
  font-weight: 800 !important;
  min-height: 46px !important;
}

[data-page="analitico"] .btn-primary,
.analitico .btn-primary,
.analytics .btn-primary,
.analytics-page .btn-primary,
.page-analitico .btn-primary,
#analitico .btn-primary,
[data-page="analitico"] button:first-of-type,
.analitico button:first-of-type,
.analytics button:first-of-type,
.analytics-page button:first-of-type {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  color: #03120c !important;
  border: 0 !important;
  box-shadow: 0 16px 30px rgba(34,197,94,.22) !important;
}

/* remove cards brancos no analítico especificamente */
[data-page="analitico"] [style*="background: white"],
[data-page="analitico"] [style*="background:#fff"],
[data-page="analitico"] [style*="background: #fff"],
.analitico [style*="background: white"],
.analitico [style*="background:#fff"],
.analitico [style*="background: #fff"],
.analytics [style*="background: white"],
.analytics [style*="background:#fff"],
.analytics [style*="background: #fff"],
.analytics-page [style*="background: white"],
.analytics-page [style*="background:#fff"],
.analytics-page [style*="background: #fff"] {
  background:
    radial-gradient(circle at 92% 10%, rgba(34,197,94,.18), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
  color: #ffffff !important;
}

/* responsividade */
@media (max-width: 1280px) {
  [data-page="analitico"] .stats,
  [data-page="analitico"] .metrics,
  [data-page="analitico"] .kpis,
  .analitico .stats,
  .analitico .metrics,
  .analitico .kpis,
  .analytics .stats,
  .analytics .metrics,
  .analytics .kpis,
  .analytics-page .stats,
  .analytics-page .metrics,
  .analytics-page .kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  [data-page="analitico"] .charts-grid,
  .analitico .charts-grid,
  .analytics .charts-grid,
  .analytics-page .charts-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 720px) {
  [data-page="analitico"] .stats,
  [data-page="analitico"] .metrics,
  [data-page="analitico"] .kpis,
  .analitico .stats,
  .analitico .metrics,
  .analitico .kpis,
  .analytics .stats,
  .analytics .metrics,
  .analytics .kpis,
  .analytics-page .stats,
  .analytics-page .metrics,
  .analytics-page .kpis {
    grid-template-columns: 1fr !important;
  }
}


/* =========================================================
   FIX REAL ANALITICO - sobrescreve body.caio-emerald-ui #analitico
   ========================================================= */

body.caio-emerald-ui #analitico,
body.caio-emerald-ui section#analitico.page {
  background: transparent !important;
  color: #f8fafc !important;
}

body.caio-emerald-ui #analitico .analytics-dashboard {
  gap: 20px !important;
}

/* HERO */
body.caio-emerald-ui #analitico .analytics-hero {
  background:
    radial-gradient(circle at 82% 20%, rgba(34,197,94,.18), transparent 34%),
    linear-gradient(135deg, rgba(5, 22, 15, .96), rgba(2, 10, 7, .94)) !important;
  border: 1px solid rgba(34,197,94,.24) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

body.caio-emerald-ui #analitico .analytics-kicker {
  background: rgba(34,197,94,.16) !important;
  color: #b7f7cc !important;
  border: 1px solid rgba(34,197,94,.18) !important;
}

body.caio-emerald-ui #analitico .analytics-hero h2 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.42) !important;
}

body.caio-emerald-ui #analitico .analytics-hero p {
  color: rgba(226,232,240,.84) !important;
}

/* KPI CARDS - remove branco de verdade */
body.caio-emerald-ui #analitico .analytics-kpi-card {
  background:
    radial-gradient(circle at 92% 6%, rgba(34,197,94,.18), transparent 31%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(34,197,94,.24) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color: #ffffff !important;
}

body.caio-emerald-ui #analitico .analytics-kpi-card:after {
  background: rgba(34,197,94,.18) !important;
  opacity: .85 !important;
}

body.caio-emerald-ui #analitico .analytics-kpi-card.urgent:after {
  background: rgba(245,158,11,.22) !important;
}

body.caio-emerald-ui #analitico .analytics-kpi-card span {
  color: #b7f7cc !important;
  -webkit-text-fill-color: #b7f7cc !important;
}

body.caio-emerald-ui #analitico .analytics-kpi-card strong {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.35) !important;
}

body.caio-emerald-ui #analitico .analytics-kpi-card small {
  color: rgba(226,232,240,.76) !important;
}

/* CARDS DOS GRAFICOS */
body.caio-emerald-ui #analitico .analytics-card {
  background:
    radial-gradient(circle at 95% 8%, rgba(34,197,94,.11), transparent 30%),
    linear-gradient(180deg, rgba(8,31,22,.88), rgba(3,13,9,.90)) !important;
  border: 1px solid rgba(34,197,94,.24) !important;
  box-shadow: 0 20px 55px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.05) !important;
}

body.caio-emerald-ui #analitico .analytics-card-head {
  background: rgba(0,0,0,.16) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
}

body.caio-emerald-ui #analitico .analytics-card-head strong {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body.caio-emerald-ui #analitico .analytics-card-head span,
body.caio-emerald-ui #analitico .analytics-card-head small {
  color: rgba(226,232,240,.72) !important;
  -webkit-text-fill-color: rgba(226,232,240,.72) !important;
}

/* PAINEIS LISTAS / TABELAS */
body.caio-emerald-ui #analitico .analytics-panel,
body.caio-emerald-ui #analitico .analytics-table-card {
  background:
    radial-gradient(circle at 95% 8%, rgba(34,197,94,.11), transparent 30%),
    linear-gradient(180deg, rgba(8,31,22,.88), rgba(3,13,9,.90)) !important;
  border: 1px solid rgba(34,197,94,.24) !important;
  box-shadow: 0 20px 55px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.05) !important;
  color: #f8fafc !important;
}

body.caio-emerald-ui #analitico .analytics-list-row,
body.caio-emerald-ui #analitico .analytics-table-card tr {
  background: rgba(255,255,255,.035) !important;
  border-color: rgba(255,255,255,.07) !important;
}

body.caio-emerald-ui #analitico .analytics-list-row strong,
body.caio-emerald-ui #analitico .analytics-list-row span,
body.caio-emerald-ui #analitico .analytics-table-card td,
body.caio-emerald-ui #analitico .analytics-table-card th {
  color: #f8fafc !important;
}

/* GRIDS MAIS LIMPOS */
body.caio-emerald-ui #analitico .analytics-kpi-grid {
  grid-template-columns: repeat(6, minmax(145px, 1fr)) !important;
  gap: 14px !important;
}

body.caio-emerald-ui #analitico .analytics-grid-main {
  grid-template-columns: 2fr 1fr 1fr !important;
  gap: 18px !important;
}

body.caio-emerald-ui #analitico .analytics-card.chart-wide {
  grid-column: span 1 !important;
}

body.caio-emerald-ui #analitico .analytics-grid-main .chart-wide:first-child {
  grid-column: span 1 !important;
}

body.caio-emerald-ui #analitico canvas {
  filter: none !important;
  opacity: 1 !important;
}

/* BOTÕES */
body.caio-emerald-ui #analitico .analytics-actions .btn-primary {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  color: #03120c !important;
}

body.caio-emerald-ui #analitico .analytics-actions .btn-soft {
  background: rgba(255,255,255,.94) !important;
  color: #0f3d27 !important;
}

/* MOBILE */
@media (max-width: 1280px) {
  body.caio-emerald-ui #analitico .analytics-kpi-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  body.caio-emerald-ui #analitico .analytics-grid-main {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 720px) {
  body.caio-emerald-ui #analitico .analytics-kpi-grid {
    grid-template-columns: 1fr !important;
  }
}


/* =========================================================
   FIX ATENDIMENTOS - MODAL VER FICHA PREMIUM
   Remove CSS antigo azul/branco e integra no tema escuro
   ========================================================= */

/* Overlay do modal */
.modal-backdrop,
.ficha-backdrop,
#personModalBackdrop,
#fichaModalBackdrop,
#modalFichaBackdrop,
[class*="modal-backdrop"],
[class*="backdrop"] {
  background: rgba(0, 12, 8, .72) !important;
  backdrop-filter: blur(14px) saturate(120%) !important;
}

/* Caixa principal da ficha */
#personModal,
#fichaModal,
#modalFicha,
.person-modal,
.ficha-modal,
.modal-ficha,
.people-modal,
.cadastro-modal,
[class*="ficha"][class*="modal"],
[class*="modal"][class*="ficha"] {
  background:
    radial-gradient(circle at 85% 8%, rgba(34,197,94,.13), transparent 34%),
    linear-gradient(180deg, rgba(6,24,16,.97), rgba(2,10,7,.98)) !important;
  border: 1px solid rgba(34,197,94,.26) !important;
  border-radius: 26px !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color: #f8fafc !important;
  overflow: hidden !important;
}

/* Header azul antigo -> verde premium */
#personModal .modal-header,
#fichaModal .modal-header,
#modalFicha .modal-header,
.person-modal .modal-header,
.ficha-modal .modal-header,
.modal-ficha .modal-header,
.people-modal .modal-header,
.cadastro-modal .modal-header,
[class*="ficha"][class*="modal"] .modal-header,
[class*="modal"][class*="ficha"] .modal-header {
  background:
    linear-gradient(135deg, rgba(34,197,94,.95), rgba(16,185,129,.82)) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  color: #04130d !important;
  padding: 18px 24px !important;
}

#personModal .modal-header *,
#fichaModal .modal-header *,
#modalFicha .modal-header *,
.person-modal .modal-header *,
.ficha-modal .modal-header *,
.modal-ficha .modal-header *,
.people-modal .modal-header *,
.cadastro-modal .modal-header * {
  color: #04130d !important;
  -webkit-text-fill-color: #04130d !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

#personModal .modal-header h1,
#personModal .modal-header h2,
#personModal .modal-header h3,
#personModal .modal-header strong,
#fichaModal .modal-header h1,
#fichaModal .modal-header h2,
#fichaModal .modal-header h3,
#fichaModal .modal-header strong,
#modalFicha .modal-header h1,
#modalFicha .modal-header h2,
#modalFicha .modal-header h3,
#modalFicha .modal-header strong,
.person-modal .modal-header h1,
.person-modal .modal-header h2,
.person-modal .modal-header h3,
.person-modal .modal-header strong,
.ficha-modal .modal-header h1,
.ficha-modal .modal-header h2,
.ficha-modal .modal-header h3,
.ficha-modal .modal-header strong,
.modal-ficha .modal-header h1,
.modal-ficha .modal-header h2,
.modal-ficha .modal-header h3,
.modal-ficha .modal-header strong {
  font-weight: 900 !important;
}

/* Botão fechar */
#personModal .modal-close,
#fichaModal .modal-close,
#modalFicha .modal-close,
.person-modal .modal-close,
.ficha-modal .modal-close,
.modal-ficha .modal-close,
.people-modal .modal-close,
.cadastro-modal .modal-close,
[class*="modal"] .close,
[class*="modal"] .btn-close {
  background: rgba(255,255,255,.16) !important;
  color: #04130d !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 999px !important;
}

/* Corpo interno */
#personModal .modal-body,
#fichaModal .modal-body,
#modalFicha .modal-body,
.person-modal .modal-body,
.ficha-modal .modal-body,
.modal-ficha .modal-body,
.people-modal .modal-body,
.cadastro-modal .modal-body {
  background: transparent !important;
  color: #f8fafc !important;
}

/* Cards internos do modal */
#personModal .card,
#fichaModal .card,
#modalFicha .card,
.person-modal .card,
.ficha-modal .card,
.modal-ficha .card,
.people-modal .card,
.cadastro-modal .card,
#personModal [class*="card"],
#fichaModal [class*="card"],
#modalFicha [class*="card"],
.person-modal [class*="card"],
.ficha-modal [class*="card"],
.modal-ficha [class*="card"] {
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(34,197,94,.22) !important;
  border-radius: 20px !important;
  color: #f8fafc !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Faixas "Dados principais", "Endereço" */
#personModal .section-title,
#fichaModal .section-title,
#modalFicha .section-title,
.person-modal .section-title,
.ficha-modal .section-title,
.modal-ficha .section-title,
#personModal [class*="section"],
#fichaModal [class*="section"],
#modalFicha [class*="section"],
.person-modal [class*="section"],
.ficha-modal [class*="section"],
.modal-ficha [class*="section"] {
  color: #d1fae5 !important;
}

#personModal .form-section-title,
#fichaModal .form-section-title,
#modalFicha .form-section-title,
.person-modal .form-section-title,
.ficha-modal .form-section-title,
.modal-ficha .form-section-title,
#personModal legend,
#fichaModal legend,
#modalFicha legend {
  background: rgba(34,197,94,.12) !important;
  color: #d1fae5 !important;
  border: 1px solid rgba(34,197,94,.20) !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
}

/* Labels */
#personModal label,
#fichaModal label,
#modalFicha label,
.person-modal label,
.ficha-modal label,
.modal-ficha label,
.people-modal label,
.cadastro-modal label {
  color: rgba(226,232,240,.88) !important;
  -webkit-text-fill-color: rgba(226,232,240,.88) !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}

/* Inputs/selects/textareas: remove cinza velho */
#personModal input,
#personModal select,
#personModal textarea,
#fichaModal input,
#fichaModal select,
#fichaModal textarea,
#modalFicha input,
#modalFicha select,
#modalFicha textarea,
.person-modal input,
.person-modal select,
.person-modal textarea,
.ficha-modal input,
.ficha-modal select,
.ficha-modal textarea,
.modal-ficha input,
.modal-ficha select,
.modal-ficha textarea,
.people-modal input,
.people-modal select,
.people-modal textarea,
.cadastro-modal input,
.cadastro-modal select,
.cadastro-modal textarea {
  background: rgba(3, 18, 12, .78) !important;
  border: 1px solid rgba(34,197,94,.30) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 0 0 0 rgba(34,197,94,0) !important;
  opacity: 1 !important;
  filter: none !important;
}

#personModal input:focus,
#personModal select:focus,
#personModal textarea:focus,
#fichaModal input:focus,
#fichaModal select:focus,
#fichaModal textarea:focus,
#modalFicha input:focus,
#modalFicha select:focus,
#modalFicha textarea:focus,
.person-modal input:focus,
.person-modal select:focus,
.person-modal textarea:focus,
.ficha-modal input:focus,
.ficha-modal select:focus,
.ficha-modal textarea:focus,
.modal-ficha input:focus,
.modal-ficha select:focus,
.modal-ficha textarea:focus {
  border-color: rgba(34,197,94,.78) !important;
  box-shadow: 0 0 0 3px rgba(34,197,94,.16), 0 0 22px rgba(34,197,94,.14) !important;
  outline: none !important;
}

#personModal input::placeholder,
#fichaModal input::placeholder,
#modalFicha input::placeholder,
.person-modal input::placeholder,
.ficha-modal input::placeholder,
.modal-ficha input::placeholder {
  color: rgba(226,232,240,.50) !important;
  -webkit-text-fill-color: rgba(226,232,240,.50) !important;
}

/* Avatar lateral */
#personModal .avatar,
#fichaModal .avatar,
#modalFicha .avatar,
.person-modal .avatar,
.ficha-modal .avatar,
.modal-ficha .avatar,
.people-modal .avatar,
.cadastro-modal .avatar,
#personModal [class*="avatar"],
#fichaModal [class*="avatar"],
#modalFicha [class*="avatar"] {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  color: #04130d !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 16px 36px rgba(34,197,94,.20) !important;
}

/* Tags status no modal */
#personModal .tag,
#personModal .badge,
#fichaModal .tag,
#fichaModal .badge,
#modalFicha .tag,
#modalFicha .badge,
.person-modal .tag,
.person-modal .badge,
.ficha-modal .tag,
.ficha-modal .badge,
.modal-ficha .tag,
.modal-ficha .badge {
  background: rgba(34,197,94,.16) !important;
  color: #d1fae5 !important;
  border: 1px solid rgba(34,197,94,.22) !important;
}

/* Rodapé/botões */
#personModal .modal-footer,
#fichaModal .modal-footer,
#modalFicha .modal-footer,
.person-modal .modal-footer,
.ficha-modal .modal-footer,
.modal-ficha .modal-footer {
  background: rgba(2,10,7,.72) !important;
  border-top: 1px solid rgba(34,197,94,.18) !important;
}

#personModal button,
#fichaModal button,
#modalFicha button,
.person-modal button,
.ficha-modal button,
.modal-ficha button {
  border-radius: 12px !important;
  font-weight: 900 !important;
}

/* Se algum CSS antigo força modal claro */
#personModal [style*="background: white"],
#personModal [style*="background:#fff"],
#personModal [style*="background: #fff"],
#fichaModal [style*="background: white"],
#fichaModal [style*="background:#fff"],
#fichaModal [style*="background: #fff"],
#modalFicha [style*="background: white"],
#modalFicha [style*="background:#fff"],
#modalFicha [style*="background: #fff"] {
  background: rgba(6,24,16,.88) !important;
  color: #f8fafc !important;
}


/* =========================================================
   FICHA CADASTRO/ATENDIMENTOS - OVERRIDE FINAL FORTE
   Escopo somente dos modais reais da ficha.
   ========================================================= */

#cpRealBackdrop,
#cpPopupBackdrop,
#vitorFichaBackdrop,
body.cp-ficha-modal-open::before,
body.cp-real-modal-open::before,
body.cp-popup-open::before,
body.vitor-ficha-open::before {
  background: rgba(0,10,8,.76) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
}

#cpRealModal,
#cpPopupCard,
#vitorFichaModal,
body.cp-ficha-modal-open #cad_pessoas .people-workspace,
body.cp-modal-open #cad_pessoas .people-workspace {
  background:
    radial-gradient(circle at 88% 6%, rgba(34,197,94,.14), transparent 34%),
    linear-gradient(180deg, rgba(5,22,15,.985), rgba(2,10,7,.99)) !important;
  background-color: #04160f !important;
  border: 1px solid rgba(34,197,94,.30) !important;
  box-shadow: 0 34px 120px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color: #f8fafc !important;
}

#cpRealHead,
#cpPopupHead,
#vitorFichaHeader,
body.cp-ficha-modal-open .cp-ficha-modal-head,
body.cp-modal-open #cpModalHeader {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  background-color: #22c55e !important;
  color: #03120c !important;
  border-bottom: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.22) !important;
}

#cpRealHead *,
#cpPopupHead *,
#vitorFichaHeader *,
body.cp-ficha-modal-open .cp-ficha-modal-head *,
body.cp-modal-open #cpModalHeader * {
  color: #03120c !important;
  -webkit-text-fill-color: #03120c !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

#cpRealClose,
#cpPopupClose,
#vitorFichaClose,
.cp-ficha-modal-close,
.cp-modal-close {
  background: rgba(255,255,255,.22) !important;
  color: #03120c !important;
  -webkit-text-fill-color: #03120c !important;
  border: 1px solid rgba(255,255,255,.22) !important;
}

#cpRealBody,
#cpPopupBody,
#vitorFichaBody,
body.cp-ficha-modal-open #cad_pessoas,
body.cp-modal-open #cad_pessoas {
  background: transparent !important;
  color: #f8fafc !important;
}

.cp-real-layout,
.vf-grid {
  background: transparent !important;
}

.cp-real-profile,
.cp-real-form,
#cpPopupCard .people-profile-panel,
#cpPopupCard .people-form-card,
.vf-side,
.vf-form,
body.cp-ficha-modal-open #cad_pessoas .people-profile-panel,
body.cp-ficha-modal-open #cad_pessoas .people-form-card,
body.cp-modal-open #cad_pessoas .people-profile-panel,
body.cp-modal-open #cad_pessoas .people-form-card,
#cad_pessoas .people-workspace .people-profile-panel,
#cad_pessoas .people-workspace .people-form-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  background-color: rgba(8,31,22,.92) !important;
  border: 1px solid rgba(34,197,94,.24) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color: #f8fafc !important;
}

#cpRealModal h1,#cpRealModal h2,#cpRealModal h3,#cpRealModal strong,
#cpPopupCard h1,#cpPopupCard h2,#cpPopupCard h3,#cpPopupCard strong,
#vitorFichaModal h1,#vitorFichaModal h2,#vitorFichaModal h3,#vitorFichaModal strong,
body.cp-ficha-modal-open #cad_pessoas h1,
body.cp-ficha-modal-open #cad_pessoas h2,
body.cp-ficha-modal-open #cad_pessoas h3,
body.cp-ficha-modal-open #cad_pessoas strong,
body.cp-modal-open #cad_pessoas h1,
body.cp-modal-open #cad_pessoas h2,
body.cp-modal-open #cad_pessoas h3,
body.cp-modal-open #cad_pessoas strong {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.42) !important;
}

#cpRealModal p,#cpRealModal small,
#cpPopupCard p,#cpPopupCard small,
#vitorFichaModal p,#vitorFichaModal small,
body.cp-ficha-modal-open #cad_pessoas p,
body.cp-ficha-modal-open #cad_pessoas small,
body.cp-modal-open #cad_pessoas p,
body.cp-modal-open #cad_pessoas small {
  color: rgba(226,232,240,.76) !important;
  -webkit-text-fill-color: rgba(226,232,240,.76) !important;
}

.cp-real-avatar,
.vf-avatar,
#cpPopupCard .profile-avatar,
body.cp-ficha-modal-open #cad_pessoas .profile-avatar,
body.cp-modal-open #cad_pessoas .profile-avatar {
  background: linear-gradient(135deg, #22c55e, #0ea5e9) !important;
  color: #03120c !important;
  -webkit-text-fill-color: #03120c !important;
  box-shadow: 0 16px 36px rgba(34,197,94,.24) !important;
}

.cp-real-badge,
.vf-badge,
#cpPopupCard .tag,
body.cp-ficha-modal-open #cad_pessoas .tag,
body.cp-modal-open #cad_pessoas .tag {
  background: rgba(34,197,94,.15) !important;
  color: #d1fae5 !important;
  -webkit-text-fill-color: #d1fae5 !important;
  border: 1px solid rgba(34,197,94,.24) !important;
}

.cp-real-section-title,
.vf-section,
#cpPopupCard .form-section-title,
#cpPopupCard .section-title,
body.cp-ficha-modal-open #cad_pessoas .form-section-title,
body.cp-ficha-modal-open #cad_pessoas .section-title,
body.cp-modal-open #cad_pessoas .form-section-title,
body.cp-modal-open #cad_pessoas .section-title {
  background: rgba(34,197,94,.13) !important;
  color: #d1fae5 !important;
  -webkit-text-fill-color: #d1fae5 !important;
  border: 1px solid rgba(34,197,94,.22) !important;
  border-radius: 14px !important;
}

#cpRealModal label,
#cpPopupCard label,
#vitorFichaModal label,
body.cp-ficha-modal-open #cad_pessoas label,
body.cp-modal-open #cad_pessoas label {
  color: rgba(226,232,240,.88) !important;
  -webkit-text-fill-color: rgba(226,232,240,.88) !important;
  font-weight: 900 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

#cpRealModal input,#cpRealModal select,#cpRealModal textarea,
#cpPopupCard input,#cpPopupCard select,#cpPopupCard textarea,
#vitorFichaModal input,#vitorFichaModal select,#vitorFichaModal textarea,
body.cp-ficha-modal-open #cad_pessoas input,
body.cp-ficha-modal-open #cad_pessoas select,
body.cp-ficha-modal-open #cad_pessoas textarea,
body.cp-modal-open #cad_pessoas input,
body.cp-modal-open #cad_pessoas select,
body.cp-modal-open #cad_pessoas textarea {
  background: rgba(3,18,12,.86) !important;
  background-color: rgba(3,18,12,.86) !important;
  border: 1px solid rgba(34,197,94,.34) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  opacity: 1 !important;
  filter: none !important;
}

#cpRealModal input:focus,#cpRealModal select:focus,#cpRealModal textarea:focus,
#cpPopupCard input:focus,#cpPopupCard select:focus,#cpPopupCard textarea:focus,
#vitorFichaModal input:focus,#vitorFichaModal select:focus,#vitorFichaModal textarea:focus,
body.cp-ficha-modal-open #cad_pessoas input:focus,
body.cp-ficha-modal-open #cad_pessoas select:focus,
body.cp-ficha-modal-open #cad_pessoas textarea:focus,
body.cp-modal-open #cad_pessoas input:focus,
body.cp-modal-open #cad_pessoas select:focus,
body.cp-modal-open #cad_pessoas textarea:focus {
  border-color: rgba(34,197,94,.88) !important;
  box-shadow: 0 0 0 3px rgba(34,197,94,.16), 0 0 22px rgba(34,197,94,.14) !important;
  outline: none !important;
}

#cpRealFooter,
#vitorFichaFooter,
body.cp-modal-open #cad_pessoas .modal-footer,
body.cp-ficha-modal-open #cad_pessoas .modal-footer {
  background: rgba(2,10,7,.86) !important;
  border-top: 1px solid rgba(34,197,94,.20) !important;
}

.cp-real-btn.soft,
.vf-btn.soft,
#cpPopupCard .btn-soft,
body.cp-ficha-modal-open #cad_pessoas .btn-soft,
body.cp-modal-open #cad_pessoas .btn-soft {
  background: rgba(255,255,255,.08) !important;
  color: #d1fae5 !important;
  border: 1px solid rgba(34,197,94,.24) !important;
}

.cp-real-btn.primary,
.vf-btn.primary,
#cpPopupCard .btn-primary,
body.cp-ficha-modal-open #cad_pessoas .btn-primary,
body.cp-modal-open #cad_pessoas .btn-primary {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  color: #03120c !important;
  -webkit-text-fill-color: #03120c !important;
  border: 0 !important;
  box-shadow: 0 14px 30px rgba(34,197,94,.24) !important;
}


/* =========================================================
   LOADING PREMIUM ENTRE ABAS - FLUIDEZ SEM QUEBRAR LÓGICA
   ========================================================= */

#caioPageTransitionLoader{
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147482500 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(34,197,94,.16), transparent 28%),
    rgba(0, 10, 8, .42) !important;
  backdrop-filter: blur(10px) saturate(120%) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .18s ease, visibility .18s ease !important;
}

#caioPageTransitionLoader.is-active{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.caio-loader-card{
  min-width: 220px !important;
  padding: 22px 24px !important;
  border-radius: 24px !important;
  background:
    linear-gradient(180deg, rgba(6,24,16,.92), rgba(2,10,7,.96)) !important;
  border: 1px solid rgba(34,197,94,.28) !important;
  box-shadow:
    0 30px 90px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  color: #f8fafc !important;
  transform: translateY(8px) scale(.98) !important;
  transition: transform .18s ease !important;
}

#caioPageTransitionLoader.is-active .caio-loader-card{
  transform: translateY(0) scale(1) !important;
}

.caio-loader-ring{
  width: 36px !important;
  height: 36px !important;
  border-radius: 999px !important;
  border: 3px solid rgba(34,197,94,.18) !important;
  border-top-color: #22c55e !important;
  box-shadow: 0 0 24px rgba(34,197,94,.24) !important;
  animation: caioLoaderSpin .72s linear infinite !important;
  flex: 0 0 auto !important;
}

.caio-loader-text strong{
  display: block !important;
  color: #ffffff !important;
  font-size: 14px !important;
  line-height: 1.1 !important;
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
}

.caio-loader-text small{
  display: block !important;
  color: rgba(209,250,229,.72) !important;
  margin-top: 4px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

body.caio-page-switching .page.active,
body.caio-page-switching main,
body.caio-page-switching .main,
body.caio-page-switching .content,
body.caio-page-switching .main-content{
  transition: opacity .16s ease, filter .16s ease, transform .16s ease !important;
}

body.caio-page-switching .page.active{
  opacity: .55 !important;
  filter: blur(2px) saturate(.92) !important;
  transform: translateY(2px) !important;
}

body.caio-page-lock-clicks .page,
body.caio-page-lock-clicks main,
body.caio-page-lock-clicks .main-content{
  pointer-events: none !important;
}

@keyframes caioLoaderSpin{
  to{ transform: rotate(360deg); }
}

/* mini skeleton para cards que aparecem durante troca */
body.caio-page-switching .card,
body.caio-page-switching .analytics-card,
body.caio-page-switching .metric-card,
body.caio-page-switching .stat-card{
  position: relative;
  overflow: hidden;
}

body.caio-page-switching .card::after,
body.caio-page-switching .analytics-card::after,
body.caio-page-switching .metric-card::after,
body.caio-page-switching .stat-card::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(34,197,94,.07), transparent);
  transform: translateX(-100%);
  animation: caioShimmer .85s ease infinite;
  pointer-events: none;
}

@keyframes caioShimmer{
  100%{ transform: translateX(100%); }
}


/* =========================================================
   AJUSTE FINO - CADASTRO PESSOAS + SIDEBAR ATENDIMENTOS
   ========================================================= */

/* Ficha cadastro pessoas: remove qualquer texto escuro remanescente */
#cpRealModal,
#cpPopupCard,
#vitorFichaModal,
body.cp-ficha-modal-open #cad_pessoas,
body.cp-modal-open #cad_pessoas {
  color: #f8fafc !important;
}

#cpRealModal *,
#cpPopupCard *,
#vitorFichaModal *,
body.cp-ficha-modal-open #cad_pessoas *,
body.cp-modal-open #cad_pessoas * {
  opacity: 1 !important;
  filter: none !important;
}

#cpRealModal h1,#cpRealModal h2,#cpRealModal h3,#cpRealModal h4,
#cpRealModal strong,#cpRealModal b,
#cpPopupCard h1,#cpPopupCard h2,#cpPopupCard h3,#cpPopupCard h4,
#cpPopupCard strong,#cpPopupCard b,
#vitorFichaModal h1,#vitorFichaModal h2,#vitorFichaModal h3,#vitorFichaModal h4,
#vitorFichaModal strong,#vitorFichaModal b,
body.cp-ficha-modal-open #cad_pessoas h1,
body.cp-ficha-modal-open #cad_pessoas h2,
body.cp-ficha-modal-open #cad_pessoas h3,
body.cp-ficha-modal-open #cad_pessoas h4,
body.cp-ficha-modal-open #cad_pessoas strong,
body.cp-ficha-modal-open #cad_pessoas b,
body.cp-modal-open #cad_pessoas h1,
body.cp-modal-open #cad_pessoas h2,
body.cp-modal-open #cad_pessoas h3,
body.cp-modal-open #cad_pessoas h4,
body.cp-modal-open #cad_pessoas strong,
body.cp-modal-open #cad_pessoas b {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.35) !important;
}

#cpRealModal p,#cpRealModal span,#cpRealModal small,#cpRealModal div,
#cpPopupCard p,#cpPopupCard span,#cpPopupCard small,#cpPopupCard div,
#vitorFichaModal p,#vitorFichaModal span,#vitorFichaModal small,#vitorFichaModal div,
body.cp-ficha-modal-open #cad_pessoas p,
body.cp-ficha-modal-open #cad_pessoas span,
body.cp-ficha-modal-open #cad_pessoas small,
body.cp-ficha-modal-open #cad_pessoas div,
body.cp-modal-open #cad_pessoas p,
body.cp-modal-open #cad_pessoas span,
body.cp-modal-open #cad_pessoas small,
body.cp-modal-open #cad_pessoas div {
  color: #e5f7ec !important;
  -webkit-text-fill-color: #e5f7ec !important;
}

/* mantém texto do header verde escuro, como botão premium */
#cpRealHead *, #cpPopupHead *, #vitorFichaHeader *,
body.cp-ficha-modal-open .cp-ficha-modal-head *,
body.cp-modal-open #cpModalHeader * {
  color: #03120c !important;
  -webkit-text-fill-color: #03120c !important;
  text-shadow: none !important;
}

/* labels e textos secundários da ficha */
#cpRealModal label,
#cpPopupCard label,
#vitorFichaModal label,
body.cp-ficha-modal-open #cad_pessoas label,
body.cp-modal-open #cad_pessoas label,
.cp-real-photo label,
.vf-photo label {
  color: rgba(226,232,240,.92) !important;
  -webkit-text-fill-color: rgba(226,232,240,.92) !important;
  font-weight: 900 !important;
}

/* campos continuam brancos no texto */
#cpRealModal input,#cpRealModal select,#cpRealModal textarea,
#cpPopupCard input,#cpPopupCard select,#cpPopupCard textarea,
#vitorFichaModal input,#vitorFichaModal select,#vitorFichaModal textarea,
body.cp-ficha-modal-open #cad_pessoas input,
body.cp-ficha-modal-open #cad_pessoas select,
body.cp-ficha-modal-open #cad_pessoas textarea,
body.cp-modal-open #cad_pessoas input,
body.cp-modal-open #cad_pessoas select,
body.cp-modal-open #cad_pessoas textarea {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

/* Sidebar: remove a coluna/barra verde do grupo Atendimentos */
.sidebar .menu-group,
.grouped-nav .menu-group,
.sidebar [data-group],
.grouped-nav [data-group] {
  background: transparent !important;
  box-shadow: none !important;
}

/* especificamente quando o grupo/linha de Atendimentos estiver ativo/aberto */
.sidebar .menu-group:has([data-page="atendimentos"]),
.grouped-nav .menu-group:has([data-page="atendimentos"]),
.sidebar .menu-group.open:has([data-page="atendimentos"]),
.grouped-nav .menu-group.open:has([data-page="atendimentos"]) {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* item Atendimentos: deixa só texto limpo, sem retângulo/coluna */
.sidebar [data-page="atendimentos"],
.grouped-nav [data-page="atendimentos"],
.sidebar button[data-page="atendimentos"],
.grouped-nav button[data-page="atendimentos"],
.sidebar a[data-page="atendimentos"],
.grouped-nav a[data-page="atendimentos"] {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

/* remove pseudo-barras laterais que formavam coluna */
.sidebar [data-page="atendimentos"]::before,
.sidebar [data-page="atendimentos"]::after,
.grouped-nav [data-page="atendimentos"]::before,
.grouped-nav [data-page="atendimentos"]::after,
.sidebar .menu-group:has([data-page="atendimentos"])::before,
.sidebar .menu-group:has([data-page="atendimentos"])::after,
.grouped-nav .menu-group:has([data-page="atendimentos"])::before,
.grouped-nav .menu-group:has([data-page="atendimentos"])::after {
  display: none !important;
  content: none !important;
  background: transparent !important;
}

/* mantém hover discreto sem coluna */
.sidebar [data-page="atendimentos"]:hover,
.grouped-nav [data-page="atendimentos"]:hover {
  background: rgba(255,255,255,.045) !important;
  border-radius: 12px !important;
}


/* =========================================================
   SIDEBAR HOVER + BARRA VERDE REMOVIDA
   ========================================================= */

/* remove barra/coluna verde lateral dos grupos */
.sidebar .submenu,
.sidebar .menu-dropdown,
.sidebar .group-content,
.sidebar .menu-children,
.sidebar .accordion-content {
  background: rgba(5, 15, 12, 0.55) !important;
  border-left: none !important;
  box-shadow: none !important;
}

/* remove barra lateral/pseudo */
.sidebar .submenu::before,
.sidebar .submenu::after,
.sidebar .menu-dropdown::before,
.sidebar .menu-dropdown::after,
.sidebar .group-content::before,
.sidebar .group-content::after,
.sidebar .menu-children::before,
.sidebar .menu-children::after,
.sidebar .accordion-content::before,
.sidebar .accordion-content::after {
  display: none !important;
  content: none !important;
  background: transparent !important;
}

/* itens internos */
.sidebar .submenu a,
.sidebar .submenu button,
.sidebar .menu-dropdown a,
.sidebar .menu-dropdown button,
.sidebar .group-content a,
.sidebar .group-content button,
.sidebar .menu-children a,
.sidebar .menu-children button,
.sidebar .accordion-content a,
.sidebar .accordion-content button {
  color: rgba(255,255,255,.92) !important;
  background: transparent !important;
  transition: all .18s ease !important;
  border-radius: 12px !important;
}

/* hover claro premium */
.sidebar .submenu a:hover,
.sidebar .submenu button:hover,
.sidebar .menu-dropdown a:hover,
.sidebar .menu-dropdown button:hover,
.sidebar .group-content a:hover,
.sidebar .group-content button:hover,
.sidebar .menu-children a:hover,
.sidebar .menu-children button:hover,
.sidebar .accordion-content a:hover,
.sidebar .accordion-content button:hover {
  background: rgba(255,255,255,.12) !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(120,255,180,.12) inset !important;
}

/* item ativo mais claro */
.sidebar .submenu .active,
.sidebar .menu-dropdown .active,
.sidebar .group-content .active,
.sidebar .menu-children .active,
.sidebar .accordion-content .active {
  background: linear-gradient(90deg, rgba(34,197,94,.22), rgba(34,197,94,.06)) !important;
  color: #ffffff !important;
}

/* corrige dropdown principal */
.sidebar .menu-group,
.sidebar .accordion,
.sidebar .nav-group {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
}

/* hover do botão principal */
.sidebar .menu-group:hover,
.sidebar .accordion:hover,
.sidebar .nav-group:hover {
  background: rgba(255,255,255,.05) !important;
}


/* ===== FINAL PANEL PREMIUM ===== */

.dashboard-hero,
.hero-dashboard,
.painel-hero{
  min-height:320px!important;
  border-radius:32px!important;
  padding:36px!important;
  background:
    radial-gradient(circle at top right, rgba(34,197,94,.12), transparent 30%),
    linear-gradient(180deg,#0d1713,#07100d)!important;
  border:1px solid rgba(255,255,255,.05)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.35)!important;
}

.dashboard-hero h1,
.hero-dashboard h1,
.painel-hero h1{
  font-size:64px!important;
  line-height:.95!important;
  font-weight:900!important;
  letter-spacing:-.06em!important;
  color:#fff!important;
  max-width:760px!important;
}

.dashboard-hero p,
.hero-dashboard p,
.painel-hero p{
  color:rgba(255,255,255,.72)!important;
  font-size:18px!important;
  max-width:680px!important;
}

.dashboard-grid,
.metrics-grid,
.cards-grid{
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:22px!important;
}

.metric-card,
.stat-card,
.dashboard-card{
  min-height:170px!important;
  border-radius:28px!important;
  padding:24px!important;
  background:
    radial-gradient(circle at top right, rgba(34,197,94,.10), transparent 30%),
    linear-gradient(180deg,#0f1b16,#08110d)!important;
  border:1px solid rgba(255,255,255,.05)!important;
  box-shadow:0 20px 60px rgba(0,0,0,.28)!important;
}

.metric-card h2,
.stat-card h2,
.dashboard-card h2{
  color:#fff!important;
  font-size:52px!important;
  font-weight:900!important;
  letter-spacing:-.05em!important;
}

.metric-card small,
.stat-card small,
.dashboard-card small{
  color:#8de5ad!important;
  text-transform:uppercase!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
}

.map-card,
.dashboard-map-card{
  border-radius:32px!important;
  overflow:hidden!important;
  background:#08110d!important;
  border:1px solid rgba(34,197,94,.14)!important;
  box-shadow:0 24px 80px rgba(0,0,0,.34)!important;
}

.quick-actions,
.acoes-rapidas{
  display:grid!important;
  grid-template-columns:repeat(2,1fr)!important;
  gap:18px!important;
}

.quick-actions .action-card,
.acoes-rapidas .action-card{
  min-height:150px!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at top right, rgba(34,197,94,.10), transparent 30%),
    linear-gradient(180deg,#111d18,#08110d)!important;
  border:1px solid rgba(255,255,255,.05)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:22px!important;
}

.quick-actions .action-card h3,
.acoes-rapidas .action-card h3{
  color:#fff!important;
  font-size:24px!important;
}

.quick-actions .action-card p,
.acoes-rapidas .action-card p{
  color:rgba(255,255,255,.72)!important;
}

.sidebar a:hover,
.sidebar button:hover{
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
}

.sidebar .active{
  background:linear-gradient(90deg, rgba(34,197,94,.18), transparent)!important;
}

@media(max-width:1200px){
 .dashboard-grid,
 .metrics-grid,
 .cards-grid{
   grid-template-columns:repeat(2,1fr)!important;
 }
}

@media(max-width:700px){
 .dashboard-grid,
 .metrics-grid,
 .cards-grid,
 .quick-actions,
 .acoes-rapidas{
   grid-template-columns:1fr!important;
 }
 .dashboard-hero h1{
   font-size:42px!important;
 }
}


/* =========================================================
   FIX CERTEIRO - PAINEL / MAPA DO TERRITÓRIO
   Alvo real: .dashboard-map-card / #dashboardMapPreviewPanel / #dashboardMapPreview
   ========================================================= */

/* painel vira grid real e a linha do mapa ocupa o espaço vazio */
#dashboard{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  gap:20px !important;
  align-items:stretch !important;
}

/* estatísticas no topo */
#dashboard > .stats-grid{
  grid-column:1 / -1 !important;
  order:1 !important;
  width:100% !important;
}

/* MAPA GRANDE: pega a classe exata que apareceu no DevTools */
#dashboard > .dashboard-map-card,
#dashboard > .dashboard-card-map,
#dashboard > div.card.dashboard-map-card,
#dashboard > div.card.dashboard-card-map,
#dashboard .dashboard-map-card.dashboard-card-map{
  grid-column:1 / span 7 !important;
  order:2 !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  min-height:470px !important;
  height:470px !important;
  margin:0 !important;
  padding:18px !important;
  display:flex !important;
  flex-direction:column !important;
  border-radius:26px !important;
  overflow:hidden !important;
}

/* Radar fica à direita */
#dashboard > .dashboard-quick-card,
#dashboard > .dashboard-card-radar,
#dashboard > section.card.dashboard-quick-card,
#dashboard > section.card.dashboard-card-radar{
  grid-column:8 / -1 !important;
  order:2 !important;
  width:100% !important;
  max-width:none !important;
  min-height:470px !important;
  height:470px !important;
  margin:0 !important;
}

/* demais seções descem */
#dashboard > .grid-2,
#dashboard > .dashboard-insights-grid{
  grid-column:1 / -1 !important;
  order:3 !important;
  width:100% !important;
}

/* cabeçalho do mapa */
#dashboard .dashboard-map-card .card-head,
#dashboard .dashboard-card-map .card-head{
  flex:0 0 auto !important;
  height:auto !important;
  min-height:56px !important;
  padding:0 0 14px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
}

#dashboard .dashboard-map-card .card-head h3,
#dashboard .dashboard-card-map .card-head h3{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  font-size:25px !important;
  line-height:1.02 !important;
  max-width:none !important;
}

/* remove resumo/legenda que consome espaço */
#dashboardMapSummary,
#dashboardMapLegend,
#dashboard .dashboard-map-summary,
#dashboard .dashboard-map-legend{
  display:none !important;
}

/* painel do preview ocupa todo o card */
#dashboardMapPreviewPanel,
#dashboard .dashboard-map-preview-panel{
  position:relative !important;
  flex:1 1 auto !important;
  width:100% !important;
  height:100% !important;
  min-height:380px !important;
  display:block !important;
  border-radius:20px !important;
  overflow:hidden !important;
  isolation:isolate !important;
  background:#020b08 !important;
  border:1px solid rgba(91,255,166,.18) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 18px 55px rgba(0,0,0,.32) !important;
}

/* iframe real da aba mapa */
#dashboardMapFrame,
#dashboard .dashboard-map-frame,
#dashboardMapPreviewPanel iframe,
#dashboard .dashboard-map-preview-panel iframe{
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  border:0 !important;
  opacity:1 !important;
  visibility:visible !important;
  z-index:12 !important;
  border-radius:20px !important;
  background:#020b08 !important;
}

/* div antigo não pode cobrir o iframe */
#dashboardMapPreview{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  z-index:1 !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* tira placeholders/fake pin que escondiam o mapa */
#dashboardMapEmpty,
#dashboard .dashboard-map-empty{
  display:none !important;
}

#dashboardMapPreviewPanel::before,
#dashboardMapPreviewPanel::after,
#dashboard .dashboard-map-preview-panel::before,
#dashboard .dashboard-map-preview-panel::after{
  display:none !important;
  content:none !important;
}

/* label fica pequeno no canto */
#dashboard .dashboard-map-label,
.dashboard-map-label{
  position:absolute !important;
  left:14px !important;
  bottom:14px !important;
  transform:none !important;
  z-index:30 !important;
  padding:7px 11px !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.50) !important;
  border:1px solid rgba(91,255,166,.18) !important;
  backdrop-filter:blur(10px) !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-shadow:none !important;
}

/* força mesmo se algum CSS antigo aplicar largura fixa de 200px */
.dashboard-map-card,
.dashboard-card-map{
  max-width:none !important;
}

/* responsivo */
@media(max-width:1180px){
  #dashboard > .dashboard-map-card,
  #dashboard > .dashboard-card-map,
  #dashboard > .dashboard-quick-card,
  #dashboard > .dashboard-card-radar{
    grid-column:1 / -1 !important;
    height:auto !important;
    min-height:420px !important;
  }
}


/* =========================================================
   FIX FINAL - MAPA APARECENDO NO PAINEL
   O painel usa Leaflet próprio no #dashboardMapPreview.
   ========================================================= */

#dashboardMapFrame,
#dashboard .dashboard-map-frame,
#dashboardMapPreviewPanel iframe{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

#dashboardMapPreviewPanel,
#dashboard .dashboard-map-preview-panel{
  position:relative !important;
  flex:1 1 auto !important;
  width:100% !important;
  height:100% !important;
  min-height:380px !important;
  display:block !important;
  overflow:hidden !important;
  border-radius:20px !important;
  background:#07140f !important;
}

#dashboardMapPreview{
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  opacity:1 !important;
  visibility:visible !important;
  z-index:10 !important;
  pointer-events:auto !important;
  background:#07140f !important;
}

#dashboardMapPreview.leaflet-container,
#dashboardMapPreview .leaflet-container{
  background:#07140f !important;
}

#dashboardMapPreview .leaflet-control-container{
  display:none !important;
}

#dashboardMapEmpty{
  display:none !important;
}

#dashboardMapPreviewPanel::before,
#dashboardMapPreviewPanel::after,
#dashboard .dashboard-map-preview-panel::before,
#dashboard .dashboard-map-preview-panel::after{
  display:none !important;
  content:none !important;
}


/* =========================================================
   FIX DEFINITIVO - PREVIEW DO MAPA APARECENDO NO PAINEL
   Usa iframe OSM isolado para nunca ficar branco/preto.
   ========================================================= */

#dashboard > .dashboard-map-card,
#dashboard > .dashboard-card-map,
#dashboard .dashboard-map-card.dashboard-card-map{
  grid-column:1 / span 7 !important;
  order:2 !important;
  width:100% !important;
  max-width:none !important;
  min-height:470px !important;
  height:470px !important;
  display:flex !important;
  flex-direction:column !important;
}

#dashboardMapPreviewPanel,
#dashboard .dashboard-map-preview-panel{
  position:relative !important;
  flex:1 1 auto !important;
  width:100% !important;
  height:100% !important;
  min-height:380px !important;
  display:block !important;
  overflow:hidden !important;
  border-radius:20px !important;
  background:#07140f !important;
  border:1px solid rgba(91,255,166,.18) !important;
}

/* iframe final do preview */
#dashboardMapPreviewOSM{
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  border:0 !important;
  opacity:1 !important;
  visibility:visible !important;
  z-index:50 !important;
  pointer-events:none !important;
  background:#e8efe8 !important;
  filter:saturate(.92) contrast(1.04) brightness(.88) !important;
}

/* esconder tentativas antigas que ficavam branco/preto por cima */
#dashboardMapFrame,
#dashboardMapPreview,
#dashboardMapEmpty,
#dashboard .dashboard-map-frame,
#dashboard .dashboard-map-empty{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

#dashboardMapPreviewPanel::before,
#dashboardMapPreviewPanel::after,
#dashboard .dashboard-map-preview-panel::before,
#dashboard .dashboard-map-preview-panel::after{
  display:none !important;
  content:none !important;
}

.dashboard-map-label{
  position:absolute !important;
  left:14px !important;
  bottom:14px !important;
  z-index:80 !important;
  transform:none !important;
  padding:7px 11px !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.58) !important;
  border:1px solid rgba(91,255,166,.18) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-shadow:none !important;
  backdrop-filter:blur(10px) !important;
}

@media(max-width:1180px){
  #dashboard > .dashboard-map-card,
  #dashboard > .dashboard-card-map{
    grid-column:1 / -1 !important;
  }
}


/* =========================================================
   FIX MODAL NOVO ATENDIMENTO - DESIGN PREMIUM
   Escopo: modal/tela "Adicionar atendimento"
   Não altera lógica, eventos ou Firebase.
   ========================================================= */

dialog:has(h2, h3),
.modal:has(h2),
.modal-card:has(h2),
[role="dialog"]:has(h2),
.atendimento-modal,
#atendimentoModal,
#novoAtendimentoModal {
  color:#f8fafc !important;
}

/* Modal que contém "Adicionar atendimento" */
dialog:has(h2:first-child),
dialog:has(h3:first-child),
.modal:has(h2),
[role="dialog"]:has(h2),
#atendimentoModal,
#novoAtendimentoModal {
  max-width:min(1040px,94vw) !important;
  width:min(1040px,94vw) !important;
  max-height:92vh !important;
  overflow:hidden !important;
  border-radius:28px !important;
  background:
    radial-gradient(circle at 90% 8%, rgba(34,197,94,.14), transparent 32%),
    linear-gradient(180deg, rgba(5,22,15,.99), rgba(2,10,7,.99)) !important;
  border:1px solid rgba(34,197,94,.28) !important;
  box-shadow:0 36px 120px rgba(0,0,0,.66), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color:#f8fafc !important;
}

/* header do modal */
dialog h2:first-child,
dialog h3:first-child,
.modal h2:first-child,
.modal h3:first-child,
[role="dialog"] h2:first-child,
[role="dialog"] h3:first-child,
#atendimentoModal h2:first-child,
#novoAtendimentoModal h2:first-child {
  display:block !important;
  margin:-1px -1px 22px !important;
  padding:22px 28px !important;
  background:linear-gradient(135deg,#22c55e,#16a34a) !important;
  color:#03120c !important;
  -webkit-text-fill-color:#03120c !important;
  font-size:22px !important;
  font-weight:950 !important;
  letter-spacing:-.02em !important;
  border-radius:28px 28px 0 0 !important;
  border-bottom:1px solid rgba(255,255,255,.14) !important;
}

/* botão X */
dialog button[aria-label="Fechar"],
dialog .close,
dialog .modal-close,
.modal button[aria-label="Fechar"],
[role="dialog"] button[aria-label="Fechar"],
#atendimentoModal button[aria-label="Fechar"],
#novoAtendimentoModal button[aria-label="Fechar"] {
  position:absolute !important;
  top:18px !important;
  right:22px !important;
  width:42px !important;
  height:42px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.22) !important;
  border:1px solid rgba(255,255,255,.24) !important;
  color:#03120c !important;
  -webkit-text-fill-color:#03120c !important;
  font-size:22px !important;
  font-weight:950 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* corpo interno vira layout limpo */
dialog form,
.modal form,
[role="dialog"] form,
#atendimentoModal form,
#novoAtendimentoModal form {
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:18px 20px !important;
  padding:0 24px 24px !important;
  max-height:calc(92vh - 120px) !important;
  overflow:auto !important;
}

/* títulos de etapas ocupam largura total */
dialog form h3,
dialog form h4,
dialog form > strong,
dialog form > .section-title,
.modal form h3,
.modal form h4,
[role="dialog"] form h3,
[role="dialog"] form h4,
#atendimentoModal form h3,
#atendimentoModal form h4,
#novoAtendimentoModal form h3,
#novoAtendimentoModal form h4 {
  grid-column:1 / -1 !important;
  margin:10px 0 0 !important;
  padding:12px 16px !important;
  border-radius:16px !important;
  background:rgba(34,197,94,.13) !important;
  border:1px solid rgba(34,197,94,.22) !important;
  color:#d1fae5 !important;
  -webkit-text-fill-color:#d1fae5 !important;
  font-size:13px !important;
  font-weight:950 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}

/* labels */
dialog label,
.modal label,
[role="dialog"] label,
#atendimentoModal label,
#novoAtendimentoModal label {
  display:block !important;
  color:rgba(226,232,240,.9) !important;
  -webkit-text-fill-color:rgba(226,232,240,.9) !important;
  font-size:12px !important;
  font-weight:900 !important;
  margin:0 0 7px !important;
  text-transform:uppercase !important;
  letter-spacing:.03em !important;
}

/* campos */
dialog input,
dialog select,
dialog textarea,
.modal input,
.modal select,
.modal textarea,
[role="dialog"] input,
[role="dialog"] select,
[role="dialog"] textarea,
#atendimentoModal input,
#atendimentoModal select,
#atendimentoModal textarea,
#novoAtendimentoModal input,
#novoAtendimentoModal select,
#novoAtendimentoModal textarea {
  width:100% !important;
  min-height:46px !important;
  border-radius:14px !important;
  background:rgba(3,18,12,.88) !important;
  border:1px solid rgba(34,197,94,.34) !important;
  color:#f8fafc !important;
  -webkit-text-fill-color:#f8fafc !important;
  padding:11px 13px !important;
  outline:none !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
  font-size:14px !important;
}

dialog textarea,
.modal textarea,
[role="dialog"] textarea,
#atendimentoModal textarea,
#novoAtendimentoModal textarea {
  min-height:96px !important;
  resize:vertical !important;
}

dialog input:focus,
dialog select:focus,
dialog textarea:focus,
.modal input:focus,
.modal select:focus,
.modal textarea:focus,
[role="dialog"] input:focus,
[role="dialog"] select:focus,
[role="dialog"] textarea:focus {
  border-color:rgba(34,197,94,.9) !important;
  box-shadow:0 0 0 3px rgba(34,197,94,.16),0 0 22px rgba(34,197,94,.14) !important;
}

/* lista de pessoas vinculadas */
dialog .people-list,
dialog .person-list,
dialog .linked-person-list,
dialog [class*="pessoa"],
dialog [class*="vincul"],
.modal .people-list,
.modal .person-list,
[role="dialog"] .people-list,
[role="dialog"] .person-list {
  color:#f8fafc !important;
}

/* botões pequenos de vincular */
dialog button,
.modal button,
[role="dialog"] button {
  border-radius:12px !important;
  font-weight:900 !important;
}

dialog button:not([aria-label="Fechar"]),
.modal button:not([aria-label="Fechar"]),
[role="dialog"] button:not([aria-label="Fechar"]) {
  border:1px solid rgba(34,197,94,.24) !important;
  color:#d1fae5 !important;
  background:rgba(255,255,255,.07) !important;
}

/* botões finais */
dialog button[type="submit"],
dialog .btn-primary,
dialog button:last-child,
.modal button[type="submit"],
.modal .btn-primary,
[role="dialog"] button[type="submit"],
[role="dialog"] .btn-primary,
#atendimentoModal button[type="submit"],
#novoAtendimentoModal button[type="submit"] {
  background:linear-gradient(135deg,#22c55e,#16a34a) !important;
  color:#03120c !important;
  -webkit-text-fill-color:#03120c !important;
  border:0 !important;
  box-shadow:0 14px 30px rgba(34,197,94,.24) !important;
}

/* rodapé branco antigo */
dialog .modal-footer,
.modal .modal-footer,
[role="dialog"] .modal-footer,
#atendimentoModal .modal-footer,
#novoAtendimentoModal .modal-footer {
  grid-column:1 / -1 !important;
  margin:8px -24px -24px !important;
  padding:16px 24px !important;
  background:rgba(2,10,7,.92) !important;
  border-top:1px solid rgba(34,197,94,.20) !important;
  display:flex !important;
  justify-content:flex-end !important;
  gap:10px !important;
}

/* se houver wrappers diretos com texto bagunçado, melhora espaçamento */
dialog form > *,
.modal form > *,
[role="dialog"] form > * {
  min-width:0 !important;
}

/* responsivo */
@media(max-width:760px){
  dialog form,
  .modal form,
  [role="dialog"] form,
  #atendimentoModal form,
  #novoAtendimentoModal form {
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   PAINEL - PREVIEW REAL DA ABA MAPA
   Usa iframe mapa.html?embed=dashboard. Remove imagens/fakes.
   ========================================================= */

#dashboard > .dashboard-map-card,
#dashboard > .dashboard-card-map,
#dashboard .dashboard-map-card.dashboard-card-map{
  grid-column:1 / span 7 !important;
  order:2 !important;
  width:100% !important;
  max-width:none !important;
  min-height:470px !important;
  height:470px !important;
  display:flex !important;
  flex-direction:column !important;
  padding:18px !important;
}

#dashboard > .dashboard-quick-card,
#dashboard > .dashboard-card-radar{
  grid-column:8 / -1 !important;
  order:2 !important;
  min-height:470px !important;
}

#dashboardMapPreviewPanel,
#dashboard .dashboard-map-preview-panel{
  position:relative !important;
  flex:1 1 auto !important;
  width:100% !important;
  min-height:380px !important;
  height:100% !important;
  display:block !important;
  overflow:hidden !important;
  border-radius:20px !important;
  background:#06120d !important;
  border:1px solid rgba(91,255,166,.18) !important;
  isolation:isolate !important;
}

/* remove camadas fake/placeholder */
#dashboardMapVisualFinal,
#dashboardMapPreviewOSM,
#dashboardMapPreview,
#dashboardMapEmpty{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* iframe real da aba mapa */
#dashboardMapFrame,
#dashboard .dashboard-map-frame,
#dashboardMapPreviewPanel > iframe#dashboardMapFrame{
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  border:0 !important;
  opacity:1 !important;
  visibility:visible !important;
  z-index:50 !important;
  pointer-events:none !important;
  border-radius:20px !important;
  background:#06120d !important;
}

/* tira pseudo-elementos antigos que cobriam o mapa */
#dashboardMapPreviewPanel::before,
#dashboardMapPreviewPanel::after,
#dashboard .dashboard-map-preview-panel::before,
#dashboard .dashboard-map-preview-panel::after{
  display:none !important;
  content:none !important;
}

.dashboard-map-label{
  position:absolute !important;
  left:14px !important;
  bottom:14px !important;
  z-index:80 !important;
  display:inline-flex !important;
  padding:7px 11px !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.55) !important;
  border:1px solid rgba(91,255,166,.18) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-size:12px !important;
  font-weight:900 !important;
  backdrop-filter:blur(10px) !important;
}

#dashboardMapSummary,
#dashboardMapLegend{
  display:none !important;
}

@media(max-width:1180px){
  #dashboard > .dashboard-map-card,
  #dashboard > .dashboard-card-map,
  #dashboard > .dashboard-quick-card,
  #dashboard > .dashboard-card-radar{
    grid-column:1 / -1 !important;
  }
}

/* =========================================================
   PROTOCOLOS - CHAT DARK PREMIUM HARD FIX
   Ganha dos estilos antigos claros sem alterar a logica.
   ========================================================= */

html body .proto-modal-overlay.show,
html body #protoModal.proto-modal-overlay.show{
  background:rgba(0,12,7,.72) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
}

html body .proto-modal{
  overflow:hidden !important;
  background:
    radial-gradient(circle at 14% 0%,rgba(34,197,94,.16),transparent 35%),
    linear-gradient(180deg,#07140d 0%,#04100a 100%) !important;
  border:1px solid rgba(134,239,172,.24) !important;
  box-shadow:0 28px 90px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.04) inset !important;
  color:#f2fff7 !important;
}

html body .proto-modal *{
  text-shadow:none !important;
}

html body .proto-modal-head,
html body .proto-modal-foot{
  background:linear-gradient(180deg,rgba(9,28,19,.98),rgba(4,16,10,.96)) !important;
  border-color:rgba(134,239,172,.16) !important;
  color:#f2fff7 !important;
}

html body .proto-modal-head h2,
html body .proto-modal-head p,
html body .proto-modal label,
html body .proto-modal small,
html body .proto-modal strong,
html body .proto-modal span,
html body .proto-modal p{
  color:#f2fff7 !important;
  -webkit-text-fill-color:#f2fff7 !important;
}

html body .proto-modal-head p,
html body .proto-modal small{
  color:rgba(226,255,235,.70) !important;
  -webkit-text-fill-color:rgba(226,255,235,.70) !important;
}

html body .proto-close{
  width:42px !important;
  height:42px !important;
  display:grid !important;
  place-items:center !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(134,239,172,.24) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  box-shadow:0 10px 28px rgba(0,0,0,.22) !important;
}

html body .proto-modal-body{
  background:
    radial-gradient(circle at 62% 18%,rgba(34,197,94,.13),transparent 34%),
    linear-gradient(180deg,#06130d 0%,#030d08 100%) !important;
}

html body .proto-info-panel,
html body .proto-chat-panel{
  background:rgba(8,27,18,.94) !important;
  border:1px solid rgba(134,239,172,.18) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 22px 70px rgba(0,0,0,.30) !important;
}

html body .proto-info-row{
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(134,239,172,.12) !important;
}

html body .proto-info-row small{
  color:rgba(226,255,235,.62) !important;
  -webkit-text-fill-color:rgba(226,255,235,.62) !important;
}

html body .proto-info-row strong,
html body .proto-info-row span{
  color:#f8fff9 !important;
  -webkit-text-fill-color:#f8fff9 !important;
}

html body .proto-tabs{
  background:rgba(5,18,12,.92) !important;
  border-bottom:1px solid rgba(134,239,172,.14) !important;
}

html body .proto-tab{
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(134,239,172,.16) !important;
  color:#dcffe9 !important;
  -webkit-text-fill-color:#dcffe9 !important;
}

html body .proto-tab.active{
  background:linear-gradient(135deg,rgba(34,197,94,.30),rgba(16,185,129,.16)) !important;
  border-color:rgba(134,239,172,.36) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  box-shadow:0 10px 28px rgba(34,197,94,.14) !important;
}

html body #protoTabContent{
  min-height:0 !important;
  display:grid !important;
  grid-template-rows:minmax(0,1fr) auto !important;
  background:transparent !important;
}

html body .proto-chat-box{
  min-height:340px !important;
  background:
    linear-gradient(rgba(134,239,172,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(134,239,172,.035) 1px,transparent 1px),
    radial-gradient(circle at 70% 20%,rgba(34,197,94,.11),transparent 36%),
    #07130d !important;
  background-size:34px 34px,34px 34px,auto,auto !important;
  color:#f2fff7 !important;
}

html body .proto-msg{
  max-width:min(620px,86%) !important;
  background:linear-gradient(135deg,rgba(16,37,26,.98),rgba(9,29,20,.96)) !important;
  border:1px solid rgba(134,239,172,.18) !important;
  color:#f8fff9 !important;
  -webkit-text-fill-color:#f8fff9 !important;
  box-shadow:0 14px 36px rgba(0,0,0,.24) !important;
}

html body .proto-msg.cidadao{
  background:linear-gradient(135deg,rgba(56,189,248,.23),rgba(8,47,73,.48)) !important;
  border-color:rgba(125,211,252,.32) !important;
}

html body .proto-msg.atendente,
html body .proto-msg.sistema{
  margin-left:auto !important;
  background:linear-gradient(135deg,rgba(34,197,94,.25),rgba(6,78,59,.50)) !important;
  border-color:rgba(134,239,172,.34) !important;
}

html body .proto-msg strong{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

html body .proto-msg small{
  display:block !important;
  margin-top:8px !important;
  color:rgba(226,255,235,.62) !important;
  -webkit-text-fill-color:rgba(226,255,235,.62) !important;
}

html body .proto-chat-send{
  background:rgba(5,18,12,.96) !important;
  border-top:1px solid rgba(134,239,172,.15) !important;
}

html body .proto-chat-send textarea,
html body .proto-modal input,
html body .proto-modal select,
html body .proto-modal textarea{
  background:rgba(2,10,7,.92) !important;
  border:1px solid rgba(134,239,172,.22) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
}

html body .proto-chat-send textarea::placeholder,
html body .proto-modal input::placeholder,
html body .proto-modal textarea::placeholder{
  color:rgba(226,255,235,.55) !important;
  -webkit-text-fill-color:rgba(226,255,235,.55) !important;
}

html body .proto-chat-send button,
html body .proto-primary{
  background:linear-gradient(135deg,#22c55e,#86efac) !important;
  border:0 !important;
  color:#03140b !important;
  -webkit-text-fill-color:#03140b !important;
  box-shadow:0 16px 36px rgba(34,197,94,.22) !important;
}

html body .proto-soft{
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(134,239,172,.18) !important;
  color:#eafff2 !important;
  -webkit-text-fill-color:#eafff2 !important;
}

html body .proto-danger{
  background:linear-gradient(135deg,rgba(239,68,68,.82),rgba(248,113,113,.64)) !important;
  border:0 !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

html body .proto-modal .status-badge{
  background:rgba(34,197,94,.18) !important;
  border:1px solid rgba(134,239,172,.28) !important;
  color:#dcffe9 !important;
  -webkit-text-fill-color:#dcffe9 !important;
}

html body .proto-empty,
html body .proto-final-note{
  background:rgba(255,255,255,.045) !important;
  border:1px solid rgba(134,239,172,.14) !important;
  color:#eafff2 !important;
  -webkit-text-fill-color:#eafff2 !important;
}

html body .proto-row-locked{
  opacity:.82 !important;
}

html body .proto-row-locked .proto-code{
  border-color:rgba(250,204,21,.38) !important;
  color:#fde68a !important;
  -webkit-text-fill-color:#fde68a !important;
}

html body .proto-locked-note{
  margin-top:10px !important;
  padding:12px 14px !important;
  border-radius:12px !important;
  border:1px solid rgba(250,204,21,.24) !important;
  background:rgba(120,53,15,.22) !important;
  color:#fef3c7 !important;
  -webkit-text-fill-color:#fef3c7 !important;
  font-weight:800 !important;
}

html body .proto-actions button:disabled,
html body .proto-modal button:disabled,
html body .proto-modal input:disabled,
html body .proto-modal select:disabled,
html body .proto-modal textarea:disabled{
  opacity:.58 !important;
  cursor:not-allowed !important;
}

/* Stable tables: prevents action columns from jumping during harmless refresh calls. */
html body .protocolos-table{
  table-layout:fixed !important;
}

html body .protocolos-table-card{
  overflow:auto !important;
}

html body .protocolos-table th:nth-child(1),
html body .protocolos-table td:nth-child(1){
  width:12% !important;
}

html body .protocolos-table th:nth-child(2),
html body .protocolos-table td:nth-child(2){
  width:13% !important;
}

html body .protocolos-table th:nth-child(3),
html body .protocolos-table td:nth-child(3){
  width:12% !important;
}

html body .protocolos-table th:nth-child(4),
html body .protocolos-table td:nth-child(4){
  width:13% !important;
}

html body .protocolos-table th:nth-child(5),
html body .protocolos-table td:nth-child(5),
html body .protocolos-table th:nth-child(6),
html body .protocolos-table td:nth-child(6),
html body .protocolos-table th:nth-child(8),
html body .protocolos-table td:nth-child(8){
  width:10% !important;
}

html body .protocolos-table th:nth-child(7),
html body .protocolos-table td:nth-child(7){
  width:15% !important;
}

html body .protocolos-table th:nth-child(9),
html body .protocolos-table td:nth-child(9){
  width:360px !important;
  min-width:360px !important;
}

html body .protocolos-table td{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

html body .proto-actions{
  min-width:330px !important;
  width:330px !important;
  flex-wrap:nowrap !important;
}

html body .proto-actions .proto-icon-btn{
  flex:0 0 auto !important;
}

html body .status-encerrado{
  background:rgba(148,163,184,.18) !important;
  border:1px solid rgba(148,163,184,.34) !important;
  color:#dbe7ef !important;
}

html body .proto-row-closed{
  background:rgba(15,23,42,.18) !important;
}

html body .proto-row-closed .proto-code,
html body .proto-row-closed td{
  color:rgba(232,246,238,.74) !important;
}

html body .proto-row-closed .proto-sub{
  color:rgba(216,251,231,.62) !important;
}

@media(max-width:980px){
  html body .protocolos-table{
    min-width:1180px !important;
  }
}
/* Fix 2026-05-29: checkboxes adicionaram uma coluna; mantém Ações sempre visível e clicável. */
html body .protocolos-table-card{
  overflow-x:auto !important;
  overflow-y:visible !important;
}

html body .protocolos-table{
  table-layout:fixed !important;
  min-width:1480px !important;
}

html body .protocolos-table th:nth-child(1),
html body .protocolos-table td:nth-child(1){
  width:48px !important;
  min-width:48px !important;
  text-align:center !important;
}

html body .protocolos-table th:nth-child(2),
html body .protocolos-table td:nth-child(2){width:160px !important}
html body .protocolos-table th:nth-child(3),
html body .protocolos-table td:nth-child(3){width:170px !important}
html body .protocolos-table th:nth-child(4),
html body .protocolos-table td:nth-child(4){width:150px !important}
html body .protocolos-table th:nth-child(5),
html body .protocolos-table td:nth-child(5){width:170px !important}
html body .protocolos-table th:nth-child(6),
html body .protocolos-table td:nth-child(6){width:130px !important}
html body .protocolos-table th:nth-child(7),
html body .protocolos-table td:nth-child(7){width:180px !important}
html body .protocolos-table th:nth-child(8),
html body .protocolos-table td:nth-child(8){width:160px !important}
html body .protocolos-table th:nth-child(9),
html body .protocolos-table td:nth-child(9){width:150px !important}

html body .protocolos-table th:nth-child(10),
html body .protocolos-table td:nth-child(10){
  position:sticky !important;
  right:0 !important;
  width:360px !important;
  min-width:360px !important;
  max-width:360px !important;
  overflow:visible !important;
  z-index:5 !important;
  background:#020a07 !important;
  box-shadow:-18px 0 28px rgba(0,0,0,.22) !important;
}

html body .protocolos-table thead th:nth-child(10){
  z-index:8 !important;
  background:#064225 !important;
}

html body .protocolos-table tbody td:nth-child(10){
  white-space:normal !important;
}

html body .proto-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  width:100% !important;
  min-width:330px !important;
  flex-wrap:nowrap !important;
  overflow:visible !important;
}

html body .proto-actions .proto-icon-btn{
  width:auto !important;
  min-width:64px !important;
  height:34px !important;
  padding:0 12px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  pointer-events:auto !important;
  opacity:1 !important;
}
