/* ============================================
   ME TELECOM · NOC CONSOLE — TEMA DARK
   ============================================ */

:root {
  --bg-0:#07090F;
  --bg-1:#0C111C;
  --bg-2:#111827;
  --bg-3:#1A2334;
  --line:#1F2A40;
  --line-soft:#16203355;
  --ink-0:#F4F6FB;
  --ink-1:#C7D0E0;
  --ink-2:#8896AC;
  --ink-3:#5A6678;
  --accent:#22D3EE;
  --accent-dim:#0891B2;
  --amber:#F59E0B;
  --green:#10B981;
  --red:#EF4444;
  --violet:#A78BFA;
  --whatsapp:#25D366;

  --font-display:"Bricolage Grotesque", serif;
  --font-body:"Inter", -apple-system, "Segoe UI", sans-serif;
  --font-mono:"IBM Plex Mono", monospace;
}

/* ============================================
   TEMA CLARO — sobrescreve as variaveis
   ============================================ */

html[data-theme="light"] {
  --bg-0:#E2E8F0;        /* FUNDO geral - cinza medio (destaca os paineis brancos) */
  --bg-1:#FFFFFF;        /* PAINEIS - branco puro */
  --bg-2:#F8FAFC;        /* toolbar dentro do painel */
  --bg-3:#E2E8F0;        /* hover, badges */
  --line:#94A3B8;        /* divisores - bem visiveis */
  --line-soft:#CBD5E1;
  --ink-0:#020617;       /* texto preto profundo (titulos / valores) */
  --ink-1:#0F172A;       /* texto principal - quase preto */
  --ink-2:#334155;       /* texto secundario */
  --ink-3:#475569;       /* labels uppercase - cinza-escuro */
}

html[data-theme="light"] body {
  background:
    radial-gradient(1200px 700px at 85% -10%, rgba(34,211,238,.08), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(167,139,250,.06), transparent 60%),
    linear-gradient(180deg, #E2E8F0 0%, #CBD5E1 100%);
  color:#0F172A;
  font-weight:450;  /* peso ligeiramente acima do regular para mais corpo */
}

/* Labels uppercase ganham cor indigo profunda */
html[data-theme="light"] .kpi-label,
html[data-theme="light"] .page-meta,
html[data-theme="light"] .form-label,
html[data-theme="light"] .crumbs,
html[data-theme="light"] .status-line,
html[data-theme="light"] .name-text small,
html[data-theme="light"] .brand-text .sub,
html[data-theme="light"] .user-chip .role {
  color:#1E40AF !important;       /* indigo-700 */
  font-weight:600 !important;
}

/* Texto MAIS forte em titulos e valores - preto profundo */
html[data-theme="light"] .page-title,
html[data-theme="light"] .kpi-value,
html[data-theme="light"] .panel-title,
html[data-theme="light"] .mini-stat .val,
html[data-theme="light"] .name-text strong,
html[data-theme="light"] .brand-text .name {
  color:#020617 !important;
  font-weight:700 !important;
}

/* Tabela: linhas com texto preto profundo */
html[data-theme="light"] table.tbl tbody td { color:#0F172A; font-weight:500; }
html[data-theme="light"] table.tbl thead th {
  color:#1E40AF !important;
  font-weight:700;
  background:#F1F5F9 !important;
}
html[data-theme="light"] table.tbl tbody td { border-bottom-color:#E2E8F0 !important; }

/* Subtitulos da pagina */
html[data-theme="light"] .page-sub {
  color:#1E293B;
  font-weight:500;
}
html[data-theme="light"] .page-meta .val { color:#020617; font-weight:700; }

/* Crumbs separadores - mais visiveis */
html[data-theme="light"] .crumbs .sep { color:#94A3B8; font-weight:400; }
html[data-theme="light"] .crumbs .now { color:#020617; font-weight:700; }

/* Botoes da topbar - mais peso */
html[data-theme="light"] .btn {
  background:#FFFFFF;
  border-color:#94A3B8;
  color:#0F172A;
  font-weight:600;
}
html[data-theme="light"] .btn:hover { background:#F1F5F9; }

/* Inputs - mantem fundo claro com texto preto */
html[data-theme="light"] .search input,
html[data-theme="light"] .fiber-input,
html[data-theme="light"] .select,
html[data-theme="light"] select.fiber-select {
  background:#F8FAFC !important;
  border-color:#94A3B8 !important;
  color:#020617 !important;
  font-weight:500 !important;
}
html[data-theme="light"] .search input::placeholder,
html[data-theme="light"] .fiber-input::placeholder { color:#64748B !important; font-weight:400 !important; }

/* KPI sub (rodape do KPI) */
html[data-theme="light"] .kpi-foot { color:#334155; font-weight:500; }
html[data-theme="light"] .kpi-foot span { color:#475569; }

/* Mini stats no mapa */
html[data-theme="light"] .mini-stat .lbl { color:#1E40AF !important; font-weight:600; }

/* Card-kpi com leve borda no topo mais vivida */
html[data-theme="light"] .kpi::before { opacity:1; height:3px; }

/* Topbar mais marcada */
html[data-theme="light"] .topbar {
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
  border-bottom:1px solid #94A3B8;
}

html[data-theme="light"] body::before {
  background-image:
    linear-gradient(rgba(30,41,59,.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(30,41,59,.015) 1px, transparent 1px);
}

html[data-theme="light"] .fiber-content-bg { opacity:.20; }

html[data-theme="light"] .topbar {
  background:linear-gradient(180deg, rgba(240,244,249,.95), rgba(229,236,244,.90));
  border-bottom:1px solid #C7D2DF;
}

html[data-theme="light"] .toolbar { background:rgba(30,41,59,.025); }

/* Paineis ganham sombra suave pra "flutuar" no tema claro */
html[data-theme="light"] .panel,
html[data-theme="light"] .form-card,
html[data-theme="light"] .kpi {
  box-shadow:0 6px 18px -10px rgba(30,41,59,.18), 0 1px 3px rgba(30,41,59,.06) !important;
  border-color:#D4DCE7;
}

/* User chip e brand em fundo claro */
html[data-theme="light"] .user-chip { background:#F0F4F9; }
html[data-theme="light"] .user-chip:hover { background:#E5ECF4; }

/* Botoes da topbar em fundo claro */
html[data-theme="light"] .btn { background:#F0F4F9; border-color:#C7D2DF; color:#334155; }
html[data-theme="light"] .btn:hover { background:#E5ECF4; color:#1E293B; }
html[data-theme="light"] .btn-danger { background:rgba(239,68,68,.06); color:#B91C1C; border-color:rgba(239,68,68,.25); }
html[data-theme="light"] .btn-danger:hover { background:rgba(239,68,68,.12); }

/* Inputs ganham fundo levemente mais escuro pra contrastar com painel */
html[data-theme="light"] .search input,
html[data-theme="light"] .fiber-input,
html[data-theme="light"] .select,
html[data-theme="light"] select.fiber-select {
  background:#E5ECF4 !important;
  border-color:#C7D2DF !important;
  color:#1E293B !important;
}
html[data-theme="light"] .search input:focus,
html[data-theme="light"] .fiber-input:focus {
  background:#F0F4F9 !important;
  border-color:var(--accent-dim) !important;
}
html[data-theme="light"] input[type=date].fiber-input { color-scheme:light; }

/* Leaflet overrides para tema claro */
html[data-theme="light"] .leaflet-container { background:#E2E8F0 !important; }
html[data-theme="light"] .leaflet-control-zoom a {
  background:#FFFFFF !important;
  color:#334155 !important;
  border-bottom:1px solid #CBD5E1 !important;
}
html[data-theme="light"] .leaflet-control-zoom a:hover {
  background:#F1F5F9 !important; color:#0F172A !important;
}
html[data-theme="light"] .leaflet-control-attribution {
  background:rgba(255,255,255,.9) !important;
  color:#64748B !important;
  border:1px solid #CBD5E1 !important;
}

html[data-theme="light"] .leaflet-popup-content-wrapper {
  background:#FFFFFF !important;
  color:#334155 !important;
  border:1px solid #E2E8F0 !important;
  box-shadow:0 12px 28px -8px rgba(15,23,42,.20) !important;
}
html[data-theme="light"] .leaflet-popup-tip {
  background:#FFFFFF !important;
  border:1px solid #E2E8F0 !important;
}

html[data-theme="light"] .leaflet-control-layers {
  background:#FFFFFF !important; color:#334155 !important;
  border:1px solid #CBD5E1 !important;
}
html[data-theme="light"] .leaflet-control-layers-toggle { background-color:#FFFFFF !important; }
html[data-theme="light"] .leaflet-control-layers label { color:#334155 !important; }
html[data-theme="light"] .leaflet-control-layers-separator { border-top:1px solid #E2E8F0 !important; }
html[data-theme="light"] .popup-name { color:#0F172A; }
html[data-theme="light"] .popup-loc { color:#94A3B8; }
html[data-theme="light"] .popup-row .k { color:#94A3B8; }
html[data-theme="light"] .popup-row .v { color:#334155; }

html[data-theme="light"] .map-legend,
html[data-theme="light"] .mini-stat {
  background:rgba(255,255,255,.95);
  border-color:#E2E8F0;
  color:#334155;
}
html[data-theme="light"] .map-legend .legend-title,
html[data-theme="light"] .mini-stat .lbl { color:#94A3B8; }
html[data-theme="light"] .mini-stat .val { color:#0F172A; }

/* Marker pulsante: aumenta contraste no light */
html[data-theme="light"] .me-marker {
  box-shadow:0 0 0 2px rgba(255,255,255,.95), 0 0 14px rgba(34,211,238,.5);
}
html[data-theme="light"] .me-marker.amber  { box-shadow:0 0 0 2px rgba(255,255,255,.95), 0 0 14px rgba(245,158,11,.5); }
html[data-theme="light"] .me-marker.violet { box-shadow:0 0 0 2px rgba(255,255,255,.95), 0 0 14px rgba(167,139,250,.5); }
html[data-theme="light"] .me-marker.red    { box-shadow:0 0 0 2px rgba(255,255,255,.95), 0 0 14px rgba(239,68,68,.5); }
html[data-theme="light"] .me-marker.green  { box-shadow:0 0 0 2px rgba(255,255,255,.95), 0 0 14px rgba(16,185,129,.5); }

/* Bootstrap fallbacks no tema claro */
html[data-theme="light"] .shell .card,
html[data-theme="light"] .shell .container-fluid .card,
html[data-theme="light"] .shell .container .card {
  background:linear-gradient(180deg, #F0F4F9, #E9EFF5) !important;
  border:1px solid #D4DCE7 !important;
  color:#334155 !important;
  box-shadow:0 6px 18px -10px rgba(30,41,59,.15) !important;
}
html[data-theme="light"] .shell .card-header,
html[data-theme="light"] .shell .card-footer {
  background:#DCE4ED !important;
  border-color:#C7D2DF !important;
  color:#334155 !important;
}
html[data-theme="light"] .shell .table thead.table-light,
html[data-theme="light"] .shell .table thead { background:#DCE4ED !important; }
html[data-theme="light"] .shell .table thead th {
  color:#64748B !important;
  background:#DCE4ED !important;
  border-color:#C7D2DF !important;
}
html[data-theme="light"] .shell .table tbody td {
  border-color:#D4DCE7 !important;
  color:#334155 !important;
}
html[data-theme="light"] .shell .form-control,
html[data-theme="light"] .shell .form-select {
  background:#E5ECF4 !important;
  border:1px solid #C7D2DF !important;
  color:#1E293B !important;
}
html[data-theme="light"] .shell .btn-secondary {
  background:#F0F4F9 !important;
  border:1px solid #C7D2DF !important;
  color:#334155 !important;
}
html[data-theme="light"] .shell .text-muted { color:#8B98AB !important; }
html[data-theme="light"] .shell h4,
html[data-theme="light"] .shell h5,
html[data-theme="light"] .shell h6 { color:#1E293B; }
html[data-theme="light"] .shell code {
  background:rgba(34,211,238,.08);
  color:#0891B2;
  border:1px solid rgba(34,211,238,.20);
}
html[data-theme="light"] .shell .badge.bg-secondary { background:#D4DCE7 !important; color:#334155 !important; }
html[data-theme="light"] .shell .alert { background:#F0F4F9 !important; border-color:#D4DCE7 !important; color:#334155 !important; }
html[data-theme="light"] .shell .alert-danger { background:rgba(239,68,68,.08) !important; border-color:rgba(239,68,68,.30) !important; color:#B91C1C !important; }
html[data-theme="light"] .shell .alert-success { background:rgba(16,185,129,.08) !important; border-color:rgba(16,185,129,.30) !important; color:#047857 !important; }
html[data-theme="light"] .shell .alert-warning { background:rgba(245,158,11,.08) !important; border-color:rgba(245,158,11,.30) !important; color:#B45309 !important; }

/* Tabela: linhas com hover suave */
html[data-theme="light"] table.tbl tbody tr:hover { background:rgba(34,211,238,.06); }
html[data-theme="light"] table.tbl.tbl-compact tbody tr:hover td:last-child {
  background:linear-gradient(90deg, transparent, rgba(34,211,238,.08) 25%, var(--bg-1) 100%);
}

/* Header de tabela com cinza um pouco mais escuro pra destacar */
html[data-theme="light"] table.tbl thead th {
  background:#DCE4ED;
  color:#64748B;
}
html[data-theme="light"] table.tbl tbody td { border-bottom-color:#D4DCE7; }
html[data-theme="light"] table.tbl.tbl-compact thead th:last-child { background:#DCE4ED; }
html[data-theme="light"] table.tbl.tbl-compact tbody td:last-child {
  background:linear-gradient(90deg, transparent, var(--bg-1) 25%);
}

/* Status line - tem fundo verde sutil. Mantem. */
html[data-theme="light"] .status-line { background:rgba(16,185,129,.06); }

/* ============================================
   Painel de atalhos de teclado (toggle com ?)
   ============================================ */
.shortcuts-help {
  position:fixed; inset:0; z-index:9000;
  background:rgba(7,9,15,.7); backdrop-filter:blur(4px);
  display:none; align-items:center; justify-content:center;
}
.shortcuts-help.open { display:flex; }
.sh-inner {
  background:var(--bg-1); border:1px solid var(--line);
  border-radius:14px; padding:24px 28px; min-width:340px;
  box-shadow:0 30px 60px rgba(0,0,0,.6);
  color:var(--ink-1);
}
.sh-title {
  font-family:var(--font-display); font-size:16px; font-weight:600;
  color:var(--ink-0); margin-bottom:14px;
}
.sh-row {
  display:flex; align-items:center; gap:10px;
  padding:6px 0; border-bottom:1px solid var(--line-soft);
  font-size:13px;
}
.sh-row:last-of-type { border-bottom:none; }
.sh-row kbd {
  display:inline-block; padding:2px 7px; min-width:22px; text-align:center;
  font-family:var(--font-mono); font-size:11px; color:var(--ink-0);
  background:var(--bg-3); border:1px solid var(--line);
  border-radius:5px; box-shadow:0 1px 0 var(--line);
}
.sh-row span { color:var(--ink-2); margin-left:auto; font-size:12.5px; }
.sh-foot {
  margin-top:12px; padding-top:10px; border-top:1px solid var(--line-soft);
  font-size:11px; color:var(--ink-3); text-align:center;
}
html[data-theme="light"] .shortcuts-help { background:rgba(15,23,42,.45); }

/* ============================================
   Drop zone (upload de anexos)
   ============================================ */
.drop-zone {
  display:flex; align-items:center; gap:14px;
  padding:18px 20px;
  border:1px dashed var(--line);
  background:var(--bg-0);
  border-radius:10px;
  cursor:pointer;
  transition:all .18s ease;
}
.drop-zone:hover {
  border-color:var(--accent);
  background:rgba(34,211,238,.04);
}
.drop-zone-active {
  border-color:var(--accent) !important;
  background:rgba(34,211,238,.10) !important;
  transform:scale(1.005);
}
.drop-zone-icon { color:var(--accent); flex-shrink:0; }
.drop-zone-text strong {
  display:block; color:var(--ink-0); font-weight:600; font-size:13px; margin-bottom:2px;
}
.drop-zone-text span { color:var(--ink-3); font-size:11.5px; }

/* Mini-mapa de selecao de coordenadas no formulario */
.picker-map {
  width:100%; height:300px;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  cursor:crosshair;
}

/* ============================================
   Modal de detalhes do parceiro
   ============================================ */
.partner-modal {
  position:fixed; inset:0; z-index:9500;
  background:rgba(7,9,15,.72); backdrop-filter:blur(6px);
  display:none; align-items:center; justify-content:center;
  padding:24px;
}
.partner-modal.open { display:flex; }
.partner-modal-inner {
  width:100%; max-width:680px;
  background:var(--bg-1);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 30px 80px rgba(0,0,0,.7);
  overflow:hidden;
  max-height:90vh; display:flex; flex-direction:column;
}
.partner-modal-head {
  display:flex; align-items:flex-start; gap:16px;
  padding:20px 24px;
  border-bottom:1px solid var(--line-soft);
}
.partner-modal-title {
  font-family:var(--font-display); font-size:20px; font-weight:600;
  color:var(--ink-0); line-height:1.2;
}
.partner-modal-sub {
  font-family:var(--font-mono); font-size:11px; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.12em; margin-top:6px;
}
.partner-modal-body {
  padding:20px 24px;
  overflow-y:auto;
  flex:1;
}
.pm-row {
  display:grid; grid-template-columns:140px 1fr; gap:18px;
  padding:9px 0; border-bottom:1px solid var(--line-soft);
  font-size:13px;
}
.pm-row:last-child { border-bottom:none; }
.pm-k {
  font-family:var(--font-mono); font-size:10.5px;
  text-transform:uppercase; letter-spacing:.12em;
  color:var(--ink-3); padding-top:2px;
}
.pm-v { color:var(--ink-1); word-break:break-word; }
.partner-modal-foot {
  padding:14px 24px;
  border-top:1px solid var(--line-soft);
  background:rgba(0,0,0,.15);
  display:flex; justify-content:flex-end; gap:8px;
}
html[data-theme="light"] .partner-modal { background:rgba(15,23,42,.5); }
html[data-theme="light"] .partner-modal-foot { background:#F8FAFC; }

/* ============================================
   Botao de toggle de tema
   ============================================ */
.theme-toggle { padding:6px 9px !important; }
.theme-toggle .theme-icon { width:16px; height:16px; }
.theme-toggle .theme-icon-light { display:none; }
html[data-theme="light"] .theme-toggle .theme-icon-light { display:block; color:#F59E0B; }
html[data-theme="light"] .theme-toggle .theme-icon-dark { display:none; }

* { box-sizing:border-box; margin:0; padding:0; }
html, body { height:100%; }

body {
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(34,211,238,.08), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(167,139,250,.06), transparent 60%),
    var(--bg-0);
  color:var(--ink-1);
  font-family:var(--font-body);
  font-size:13.5px;
  line-height:1.5;
  letter-spacing:-0.005em;
  overflow-x:hidden;
  min-height:100vh;
  position:relative;
}

body::before {
  content:"";
  position:fixed; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.015) 1px, transparent 1px);
  background-size:48px 48px;
  pointer-events:none;
  z-index:0;
  mask-image:radial-gradient(ellipse at center, black 30%, transparent 80%);
}

::selection { background:var(--accent); color:var(--bg-0); }

a { color:var(--accent); text-decoration:none; }
a:hover { color:#67E8F9; }

code, .mono { font-family:var(--font-mono); }

/* Canvas de fibras como background (sutil sobre o dark) */
.fiber-content-bg {
  position:fixed; inset:0;
  width:100vw; height:100vh;
  z-index:0;
  pointer-events:none;
  opacity:.55;
}

body > .topbar,
body > .shell,
body > main,
body > .container,
body > .container-fluid { position:relative; z-index:2; }

body.fiber-login-page .fiber-content-bg { display:none; }

/* ============================================
   TOPBAR (substitui Bootstrap navbar)
   ============================================ */

.topbar {
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; gap:16px;
  padding:10px 20px;
  background:linear-gradient(180deg, rgba(7,9,15,.92), rgba(7,9,15,.78));
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--line);
  flex-wrap:nowrap;
  white-space:nowrap;
}

.brand {
  display:flex; align-items:center; gap:12px;
  padding-right:16px;
  border-right:1px solid var(--line);
  text-decoration:none;
  flex-shrink:0;
}

.brand-mark {
  width:44px; height:44px;
  border-radius:10px;
  background:linear-gradient(135deg, #0EA5B7, #22D3EE 55%, #67E8F9);
  display:grid; place-items:center;
  overflow:hidden;
  box-shadow:0 0 0 1px rgba(34,211,238,.4), 0 10px 28px -10px rgba(34,211,238,.5);
  flex-shrink:0;
}
.brand-mark img { width:100%; height:100%; object-fit:cover; }

.brand-text { display:flex; flex-direction:column; line-height:1.15; white-space:nowrap; }
.brand-text .name {
  font-family:var(--font-display); font-weight:600; font-size:16px;
  color:var(--ink-0); letter-spacing:-.02em;
}
.brand-text .sub {
  font-family:var(--font-mono); font-size:10px; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.14em; margin-top:2px;
}

.crumbs {
  display:flex; align-items:center; gap:8px; color:var(--ink-2);
  font-family:var(--font-mono); font-size:10.5px;
  text-transform:uppercase; letter-spacing:.10em;
  flex-shrink:1; min-width:0; overflow:hidden; text-overflow:ellipsis;
}
.crumbs .sep { color:var(--ink-3); }
.crumbs .now { color:var(--ink-0); }

.status-line {
  display:flex; align-items:center; gap:7px;
  padding:4px 9px; border:1px solid var(--line); border-radius:999px;
  font-family:var(--font-mono); font-size:9.5px; color:var(--ink-2);
  letter-spacing:.08em; background:rgba(16,185,129,.04);
  flex-shrink:0;
}

.pulse {
  width:7px; height:7px; border-radius:50%; background:var(--green);
  box-shadow:0 0 0 0 rgba(16,185,129,.7);
  animation:pulse 2s infinite;
}
@keyframes pulse {
  0%   { box-shadow:0 0 0 0 rgba(16,185,129,.6); }
  70%  { box-shadow:0 0 0 8px rgba(16,185,129,0); }
  100% { box-shadow:0 0 0 0 rgba(16,185,129,0); }
}

.top-actions { margin-left:auto; display:flex; align-items:center; gap:5px; flex-wrap:nowrap; flex-shrink:0; }

.btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:7px;
  background:transparent; color:var(--ink-1);
  border:1px solid var(--line);
  font-family:var(--font-body); font-size:12px; font-weight:500;
  cursor:pointer; transition:all .18s ease;
  white-space:nowrap; text-decoration:none;
}
.btn:hover { background:var(--bg-2); border-color:#2A3958; color:var(--ink-0); }
.btn svg { width:14px; height:14px; stroke-width:1.8; }

.btn-primary {
  background:linear-gradient(180deg, #22D3EE, #0EA5B7);
  color:#021116; border:none; font-weight:600;
  box-shadow:0 4px 14px -4px rgba(34,211,238,.5), inset 0 1px 0 rgba(255,255,255,.4);
}
.btn-primary:hover {
  color:#021116; background:linear-gradient(180deg, #4DDBF1, #14B8CA);
  transform:translateY(-1px);
  box-shadow:0 6px 20px -4px rgba(34,211,238,.6);
}

.btn-danger { color:#FCA5A5; }
.btn-danger:hover { background:rgba(239,68,68,.08); border-color:rgba(239,68,68,.3); color:#FCA5A5; }

.btn-whatsapp {
  color:#86EFAC;
  border-color:rgba(37,211,102,.25);
  background:rgba(37,211,102,.06);
}
.btn-whatsapp:hover {
  background:rgba(37,211,102,.14);
  border-color:rgba(37,211,102,.5);
  color:#A7F3D0;
}

.user-chip {
  display:flex; align-items:center; gap:7px;
  padding:3px 10px 3px 3px;
  border:1px solid var(--line); border-radius:999px;
  margin-right:2px; text-decoration:none;
}
.user-chip:hover { background:var(--bg-2); }
.avatar {
  width:24px; height:24px; border-radius:50%;
  background:linear-gradient(135deg, #A78BFA, #22D3EE);
  display:grid; place-items:center;
  font-family:var(--font-display); font-weight:600; font-size:10px; color:#0a0e1a;
}
.user-chip .who { font-size:11.5px; color:var(--ink-1); line-height:1.1; }
.user-chip .role {
  font-family:var(--font-mono); font-size:9px; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.10em; line-height:1.2;
}

/* Em telas medias, esconde texto secundario na topbar */
@media (max-width: 1500px) {
  .brand-text .sub { display:none; }
  .user-chip .role { display:none; }
  .crumbs { display:none; }
}
@media (max-width: 1280px) {
  .status-line { display:none; }
  .top-actions .btn span { display:none; }
  .top-actions .btn { padding:7px; }
}

/* ============================================
   SHELL / PAGE HEAD
   ============================================ */

.shell { position:relative; z-index:1; padding:24px 28px 40px; max-width:1700px; margin:0 auto; }

.page-head {
  display:flex; align-items:flex-end; justify-content:space-between; gap:20px;
  margin-bottom:24px; padding-bottom:18px;
  border-bottom:1px solid var(--line-soft);
  flex-wrap:wrap;
}
.page-title {
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(26px, 3vw, 38px);
  color:var(--ink-0); letter-spacing:-.025em; line-height:1;
}
.page-title em {
  font-style:italic; font-weight:400; color:var(--accent);
  font-family:var(--font-display);
}
.page-sub { margin-top:8px; color:var(--ink-2); font-size:13px; max-width:560px; }
.page-meta {
  text-align:right; font-family:var(--font-mono); font-size:11px;
  color:var(--ink-3); text-transform:uppercase; letter-spacing:.12em; line-height:1.8;
}
.page-meta .val { color:var(--ink-1); font-weight:500; }

/* ============================================
   KPI GRID
   ============================================ */

.kpi-grid {
  display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; margin-bottom:24px;
}

.kpi {
  position:relative; padding:18px 20px 20px;
  background:linear-gradient(180deg, var(--bg-2), var(--bg-1));
  border:1px solid var(--line); border-radius:14px;
  overflow:hidden;
  transition:transform .25s ease, border-color .25s ease;
}
.kpi:hover { transform:translateY(-2px); border-color:#2A3958; }
.kpi::before {
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:var(--accent-grad, linear-gradient(90deg, var(--accent), transparent));
  opacity:.6;
}
.kpi.amber::before  { --accent-grad:linear-gradient(90deg, var(--amber), transparent); }
.kpi.violet::before { --accent-grad:linear-gradient(90deg, var(--violet), transparent); }
.kpi.green::before  { --accent-grad:linear-gradient(90deg, var(--green), transparent); }

.kpi-label {
  display:flex; align-items:center; justify-content:space-between;
  font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase;
  letter-spacing:.14em; color:var(--ink-3); margin-bottom:14px;
}
.kpi-icon {
  width:28px; height:28px; border-radius:7px;
  background:rgba(34,211,238,.08); border:1px solid rgba(34,211,238,.15);
  display:grid; place-items:center; color:var(--accent);
}
.kpi.amber  .kpi-icon { background:rgba(245,158,11,.08); border-color:rgba(245,158,11,.18); color:var(--amber); }
.kpi.violet .kpi-icon { background:rgba(167,139,250,.08); border-color:rgba(167,139,250,.18); color:var(--violet); }
.kpi.green  .kpi-icon { background:rgba(16,185,129,.08); border-color:rgba(16,185,129,.18); color:var(--green); }
.kpi-icon svg { width:14px; height:14px; stroke-width:1.8; }

.kpi-value {
  font-family:var(--font-display); font-weight:500;
  font-size:38px; line-height:1; color:var(--ink-0);
  letter-spacing:-.035em; display:flex; align-items:baseline; gap:8px;
}
.kpi-value .unit {
  font-family:var(--font-mono); font-size:13px; color:var(--ink-3);
  font-weight:400; letter-spacing:.05em;
}
.kpi-foot {
  margin-top:12px; display:flex; align-items:center; gap:8px;
  font-size:11.5px; color:var(--ink-2);
}
.spark { position:absolute; right:18px; bottom:14px; opacity:.5; }

/* ============================================
   PANEL (substitui card)
   ============================================ */

.workspace {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1.15fr);
  gap:18px;
}

.panel {
  background:linear-gradient(180deg, var(--bg-2), var(--bg-1));
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.6);
}

.panel-head {
  display:flex; align-items:center; gap:12px;
  padding:16px 20px; border-bottom:1px solid var(--line-soft);
}
.panel-title {
  font-family:var(--font-display); font-weight:600; font-size:15px;
  color:var(--ink-0); letter-spacing:-.01em;
}
.panel-title .count {
  font-family:var(--font-mono); font-size:11px; font-weight:500;
  color:var(--ink-3); margin-left:8px;
  padding:2px 7px; border:1px solid var(--line); border-radius:5px;
  background:var(--bg-3);
}
.panel-actions { margin-left:auto; display:flex; gap:6px; flex-wrap:wrap; }
.panel-body { padding:20px; }

.icon-btn {
  width:30px; height:30px; border-radius:7px;
  background:transparent; border:1px solid var(--line);
  color:var(--ink-2); cursor:pointer;
  display:grid; place-items:center; transition:all .15s; text-decoration:none;
}
.icon-btn:hover { background:var(--bg-3); color:var(--ink-0); border-color:#2A3958; }
.icon-btn svg { width:14px; height:14px; stroke-width:1.8; }

.icon-btn.whatsapp {
  color:#86EFAC; border-color:rgba(37,211,102,.25);
}
.icon-btn.whatsapp:hover {
  background:rgba(37,211,102,.12); color:#A7F3D0; border-color:rgba(37,211,102,.5);
}

.icon-btn.danger { color:#FCA5A5; border-color:rgba(239,68,68,.2); }
.icon-btn.danger:hover { background:rgba(239,68,68,.10); color:#FCA5A5; border-color:rgba(239,68,68,.4); }

/* ============================================
   TOOLBAR / SEARCH / SELECT
   ============================================ */

.toolbar {
  display:flex; align-items:center; gap:8px; padding:12px 16px;
  border-bottom:1px solid var(--line-soft); background:rgba(0,0,0,.15);
  flex-wrap:wrap;
}

.search { flex:1; position:relative; min-width:220px; }
.search svg {
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  width:14px; height:14px; color:var(--ink-3);
}
.search input,
input[type=text].fiber-input,
input[type=password].fiber-input,
input[type=email].fiber-input,
input[type=file].fiber-input,
input[type=date].fiber-input,
textarea.fiber-input {
  width:100%; padding:9px 12px 9px 34px;
  background:var(--bg-0); border:1px solid var(--line); border-radius:8px;
  color:var(--ink-0); font-family:var(--font-body); font-size:12.5px;
  outline:none; transition:border-color .15s;
}
input[type=date].fiber-input { color-scheme:dark; padding-left:12px; }
input.fiber-input,
textarea.fiber-input { padding-left:12px; }
.search input::placeholder,
.fiber-input::placeholder { color:var(--ink-3); }
.search input:focus,
.fiber-input:focus {
  border-color:var(--accent-dim);
  box-shadow:0 0 0 3px rgba(34,211,238,.1);
  color:#fff;
}

.select, select.fiber-select {
  padding:9px 30px 9px 12px;
  background:var(--bg-0) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238896AC' stroke-width='2'><polyline points='6 9 12 15 18 9'/></svg>") no-repeat right 10px center;
  border:1px solid var(--line); border-radius:8px;
  color:var(--ink-1); font-family:var(--font-body); font-size:12.5px;
  appearance:none; -webkit-appearance:none; cursor:pointer; outline:none;
  min-width:140px;
}
.select:focus, select.fiber-select:focus {
  border-color:var(--accent-dim);
  box-shadow:0 0 0 3px rgba(34,211,238,.1);
}

.chip-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:7px 11px; border-radius:7px;
  background:transparent; border:1px solid var(--line); color:var(--ink-1);
  font-size:12px; cursor:pointer; transition:all .15s;
  font-family:var(--font-body); text-decoration:none;
}
.chip-btn:hover { background:var(--bg-3); border-color:#2A3958; color:var(--ink-0); }
.chip-btn.active {
  background:rgba(34,211,238,.1); border-color:rgba(34,211,238,.3); color:#67E8F9;
}
.chip-btn svg { width:13px; height:13px; stroke-width:1.8; }

/* ============================================
   TABLE
   ============================================ */

.table-wrap { overflow-y:auto; overflow-x:hidden; max-height:540px; }

table.tbl {
  width:100%; border-collapse:separate; border-spacing:0; font-size:12.5px;
}
table.tbl.tbl-compact { table-layout:fixed; }
table.tbl.tbl-compact td { overflow:hidden; }
table.tbl thead th {
  position:sticky; top:0; z-index:2;
  background:var(--bg-2);
  text-align:left; padding:11px 14px;
  font-family:var(--font-mono); font-size:10.5px; font-weight:500;
  color:var(--ink-3); text-transform:uppercase; letter-spacing:.12em;
  border-bottom:1px solid var(--line);
  white-space:nowrap;
}
table.tbl thead th.num { text-align:right; }
table.tbl tbody tr {
  transition:background .12s; cursor:pointer;
  border-bottom:1px solid var(--line-soft);
}
table.tbl tbody tr:hover { background:rgba(34,211,238,.04); }
table.tbl tbody tr.active { background:rgba(34,211,238,.08); box-shadow:inset 2px 0 0 var(--accent); }
table.tbl tbody td { padding:13px 14px; color:var(--ink-1); vertical-align:middle; }
table.tbl tbody td.num {
  text-align:right; font-family:var(--font-mono); font-weight:500; color:var(--ink-0);
}

.name-cell { display:flex; align-items:center; gap:10px; }
table.tbl tbody td:nth-child(2) > div > div { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.name-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.name-text { display:flex; flex-direction:column; line-height:1.25; }
.name-text strong {
  color:var(--ink-0); font-weight:500; font-size:12.5px;
  max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  display:block;
}
.name-text small {
  font-family:var(--font-mono); font-size:10px; color:var(--ink-3); letter-spacing:.04em;
}

.tag {
  display:inline-block; padding:3px 8px; border-radius:5px;
  font-family:var(--font-mono); font-size:10px; font-weight:500;
  letter-spacing:.05em; text-transform:uppercase; white-space:nowrap;
}
.tag-partner  { background:rgba(16,185,129,.10); color:#34D399; border:1px solid rgba(16,185,129,.20); }
.tag-prospect { background:rgba(245,158,11,.10); color:#FBBF24; border:1px solid rgba(245,158,11,.20); }
.tag-non      { background:rgba(239,68,68,.08);  color:#F87171; border:1px solid rgba(239,68,68,.18); }
.tag-ix       { background:rgba(167,139,250,.10);color:#C4B5FD; border:1px solid rgba(167,139,250,.20); }
.tag-neutral  { background:rgba(136,150,172,.10);color:#B7C1D2; border:1px solid rgba(136,150,172,.18); }
.tag-free     { background:rgba(34,211,238,.08); color:#67E8F9; border:1px solid rgba(34,211,238,.18); font-size:9.5px; padding:2px 6px; }
.tag-clickable { cursor:pointer; transition:all .12s ease; }
.tag-clickable:hover {
  background:rgba(34,211,238,.18);
  color:#A5F3FC;
  transform:translateY(-1px);
}
html[data-theme="light"] .tag-free { background:rgba(8,145,178,.10); color:#0E7490; border-color:rgba(8,145,178,.30); }
html[data-theme="light"] .tag-clickable:hover { background:rgba(8,145,178,.20); color:#0E4D67; }

.row-actions { display:flex; gap:3px; justify-content:flex-end; }
.row-actions .icon-btn { width:26px; height:26px; }
.row-actions .icon-btn svg { width:12px; height:12px; }
.row-actions form { margin:0; padding:0; }

/* Tabela compacta com coluna de Acoes sticky a direita */
table.tbl.tbl-compact tbody td { padding:10px 12px; }
table.tbl.tbl-compact thead th { padding:9px 12px; }

/* Borda esquerda colorida indicando o status do parceiro */
table.tbl tbody tr[data-status*="ativo"]:not([data-status*="inativo"]) td:first-child {
  box-shadow:inset 3px 0 0 var(--green);
}
table.tbl tbody tr[data-status*="negocia"] td:first-child {
  box-shadow:inset 3px 0 0 var(--amber);
}
table.tbl tbody tr[data-status*="inativo"] td:first-child {
  box-shadow:inset 3px 0 0 #6B7280;
  opacity:.72;
}
table.tbl.tbl-compact tbody td:last-child,
table.tbl.tbl-compact thead th:last-child {
  position:sticky; right:0;
  background:linear-gradient(90deg, transparent, var(--bg-1) 25%);
  z-index:1;
}
table.tbl.tbl-compact thead th:last-child { background:var(--bg-2); }
table.tbl.tbl-compact tbody tr:hover td:last-child {
  background:linear-gradient(90deg, transparent, rgba(34,211,238,.06) 25%, var(--bg-1) 100%);
}

/* ============================================
   MAP
   ============================================ */

.map-panel { display:flex; flex-direction:column; position:relative; }

.map-panel:fullscreen,
.map-panel:-webkit-full-screen {
  width:100vw; height:100vh; border-radius:0; padding:0;
}
.map-panel::backdrop,
.map-panel::-webkit-full-screen-backdrop { background:var(--bg-0); }
#btnFullscreen.active svg { color:var(--accent); }

.map-canvas-wrap { position:relative; flex:1; min-height:540px; }
#map { position:absolute; inset:0; background:var(--bg-0); }

.leaflet-container { background:#0A1020; font-family:var(--font-body); }
.leaflet-control-zoom {
  border:1px solid var(--line) !important;
  box-shadow:0 4px 12px rgba(0,0,0,.4) !important;
  border-radius:8px !important; overflow:hidden;
}
.leaflet-control-zoom a {
  background:var(--bg-2) !important; color:var(--ink-1) !important;
  border-bottom:1px solid var(--line) !important;
  font-family:var(--font-body) !important;
}
.leaflet-control-zoom a:hover { background:var(--bg-3) !important; color:var(--ink-0) !important; }
.leaflet-control-attribution {
  background:rgba(7,9,15,.8) !important; color:var(--ink-3) !important;
  font-size:9px !important; font-family:var(--font-mono) !important;
  border:1px solid var(--line) !important; border-radius:5px !important;
}
.leaflet-control-attribution a { color:var(--accent) !important; }

/* Fix padrao do Leaflet para linhas de emenda (seams) entre tiles adjacentes */
.leaflet-tile { outline: 1px solid transparent; }

.leaflet-control-layers {
  background:var(--bg-2) !important; color:var(--ink-1) !important;
  border:1px solid var(--line) !important; border-radius:8px !important;
  box-shadow:0 4px 12px rgba(0,0,0,.4) !important;
  font-family:var(--font-body) !important; font-size:12px !important;
}
.leaflet-control-layers-toggle { background-color:var(--bg-2) !important; }
.leaflet-control-layers label { color:var(--ink-1) !important; margin-bottom:2px; }
.leaflet-control-layers-separator { border-top:1px solid var(--line) !important; }

.map-legend {
  position:absolute; left:14px; bottom:34px; z-index:400;
  background:rgba(12,17,28,.92); backdrop-filter:blur(12px);
  border:1px solid var(--line); border-radius:10px;
  padding:12px 14px;
  font-family:var(--font-mono); font-size:10.5px; color:var(--ink-2);
  letter-spacing:.04em;
}
.legend-title {
  color:var(--ink-3); text-transform:uppercase; letter-spacing:.14em;
  font-size:9.5px; margin-bottom:8px;
}
.legend-row { display:flex; align-items:center; gap:8px; margin-top:4px; }
.legend-dot { width:8px; height:8px; border-radius:50%; }

.map-overlay-stats {
  position:absolute; right:14px; top:14px; z-index:400;
  display:flex; gap:8px;
}
.mini-stat {
  background:rgba(12,17,28,.92); backdrop-filter:blur(12px);
  border:1px solid var(--line); border-radius:8px;
  padding:8px 12px; min-width:88px;
}
.mini-stat .lbl {
  font-family:var(--font-mono); font-size:9.5px; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.12em;
}
.mini-stat .val {
  font-family:var(--font-display); font-weight:500; font-size:18px;
  color:var(--ink-0); line-height:1; margin-top:2px; letter-spacing:-.02em;
}

/* Custom marker */
.me-marker {
  position:relative;
  width:14px; height:14px; border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 2px rgba(7,9,15,.9), 0 0 14px rgba(34,211,238,.6);
}
.me-marker::after {
  content:""; position:absolute; inset:-6px; border-radius:50%;
  border:1px solid rgba(34,211,238,.4);
  animation:ring 2.4s infinite;
}
@keyframes ring {
  0%   { transform:scale(.7); opacity:1; }
  100% { transform:scale(1.6); opacity:0; }
}
.me-marker.amber  { background:var(--amber);  box-shadow:0 0 0 2px rgba(7,9,15,.9), 0 0 14px rgba(245,158,11,.5); }
.me-marker.amber::after  { border-color:rgba(245,158,11,.4); }
.me-marker.violet { background:var(--violet); box-shadow:0 0 0 2px rgba(7,9,15,.9), 0 0 14px rgba(167,139,250,.5); }
.me-marker.violet::after { border-color:rgba(167,139,250,.4); }
.me-marker.red    { background:var(--red);    box-shadow:0 0 0 2px rgba(7,9,15,.9), 0 0 14px rgba(239,68,68,.5); }
.me-marker.red::after    { border-color:rgba(239,68,68,.4); }
.me-marker.green  { background:var(--green);  box-shadow:0 0 0 2px rgba(7,9,15,.9), 0 0 14px rgba(16,185,129,.5); }
.me-marker.green::after  { border-color:rgba(16,185,129,.4); }

.leaflet-popup-content-wrapper {
  background:var(--bg-2) !important; color:var(--ink-1) !important;
  border:1px solid var(--line) !important;
  border-radius:10px !important;
  box-shadow:0 20px 40px -10px rgba(0,0,0,.7) !important;
}
.leaflet-popup-tip { background:var(--bg-2) !important; border:1px solid var(--line) !important; }
.leaflet-popup-content {
  margin:14px 16px !important; font-family:var(--font-body) !important; font-size:12px !important;
}
.popup-name {
  font-family:var(--font-display); font-weight:600; color:var(--ink-0);
  font-size:13.5px; margin-bottom:4px;
}
.popup-loc {
  font-family:var(--font-mono); font-size:10px; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.1em; margin-bottom:8px;
}
.popup-row { display:flex; justify-content:space-between; gap:18px; padding:3px 0; font-size:11.5px; }
.popup-row .k { color:var(--ink-3); }
.popup-row .v { color:var(--ink-1); font-family:var(--font-mono); }
.popup-actions { margin-top:10px; padding-top:10px; border-top:1px solid var(--line-soft); display:flex; gap:6px; }
.popup-actions a {
  flex:1; padding:6px 10px; border-radius:6px; text-align:center;
  font-size:11px; font-weight:500; text-decoration:none;
  border:1px solid var(--line); color:var(--ink-1); background:rgba(255,255,255,.02);
}
.popup-actions a.wa { background:rgba(37,211,102,.12); color:#A7F3D0; border-color:rgba(37,211,102,.35); }
.popup-actions a:hover { transform:translateY(-1px); }

/* Marker cluster (Leaflet.markercluster) — adapta cor ao tema */
.marker-cluster-small,
.marker-cluster-medium,
.marker-cluster-large {
  background-color:rgba(34,211,238,.20);
}
.marker-cluster-small div,
.marker-cluster-medium div,
.marker-cluster-large div {
  background-color:rgba(34,211,238,.85);
  color:#021116; font-weight:700;
  border:none;
}

/* ============================================
   FOOTER STRIP
   ============================================ */

.footer-strip {
  margin-top:24px; display:flex; justify-content:space-between;
  padding:12px 18px; border:1px solid var(--line); border-radius:10px;
  background:var(--bg-1);
  font-family:var(--font-mono); font-size:10.5px; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.12em;
  flex-wrap:wrap; gap:10px;
}
.footer-strip span { color:var(--ink-2); }
.footer-strip .ok { color:var(--green); }

/* ============================================
   ANIMATIONS
   ============================================ */

.reveal { opacity:0; transform:translateY(8px); animation:reveal .55s forwards; }
.reveal:nth-child(1) { animation-delay:.05s; }
.reveal:nth-child(2) { animation-delay:.12s; }
.reveal:nth-child(3) { animation-delay:.19s; }
.reveal:nth-child(4) { animation-delay:.26s; }
@keyframes reveal { to { opacity:1; transform:translateY(0); } }

/* ============================================
   FORMS (genericos)
   ============================================ */

.form-card {
  background:linear-gradient(180deg, var(--bg-2), var(--bg-1));
  border:1px solid var(--line); border-radius:14px;
  padding:24px 24px 8px;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.6);
}
.form-section-title {
  font-family:var(--font-mono);
  font-size:10.5px;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--accent);
  margin:8px 0 12px;
  padding-bottom:6px;
  border-bottom:1px dashed rgba(34,211,238,.18);
  display:flex; align-items:center; gap:8px;
}
.form-section-title::before {
  content:''; width:6px; height:6px; border-radius:50%;
  background:var(--accent); box-shadow:0 0 8px var(--accent);
}
.form-row { display:grid; grid-template-columns:repeat(12, 1fr); gap:14px; margin-bottom:14px; }
.form-row .c-2  { grid-column:span 2;  } .form-row .c-3  { grid-column:span 3;  }
.form-row .c-4  { grid-column:span 4;  } .form-row .c-5  { grid-column:span 5;  }
.form-row .c-6  { grid-column:span 6;  } .form-row .c-8  { grid-column:span 8;  }
.form-row .c-12 { grid-column:span 12; }
.form-label {
  display:block; margin-bottom:6px;
  font-family:var(--font-mono); font-size:10.5px;
  color:var(--ink-3); text-transform:uppercase; letter-spacing:.12em;
}
.form-hint { font-size:11px; color:var(--ink-3); margin-top:4px; }

textarea.fiber-input { resize:vertical; min-height:80px; padding:10px 12px; }

.form-actions {
  margin:8px -24px 0; padding:14px 24px;
  border-top:1px solid var(--line-soft);
  display:flex; justify-content:flex-end; gap:8px;
  background:rgba(0,0,0,.15);
}

@media (max-width: 1100px) {
  .workspace { grid-template-columns:1fr; }
  .kpi-grid { grid-template-columns:repeat(2, 1fr); }
  .top-actions .btn span { display:none; }
  .form-row .c-2, .form-row .c-3, .form-row .c-4 { grid-column:span 6; }
  .form-row .c-5, .form-row .c-6 { grid-column:span 12; }
}

/* ============================================
   ALERTS (substitui Bootstrap)
   ============================================ */

.alert-fiber {
  padding:12px 14px; border-radius:8px;
  border:1px solid var(--line); font-size:12.5px;
  margin-bottom:14px;
}
.alert-fiber.danger  { background:rgba(239,68,68,.08); border-color:rgba(239,68,68,.3); color:#FCA5A5; }
.alert-fiber.success { background:rgba(16,185,129,.08); border-color:rgba(16,185,129,.3); color:#86EFAC; }
.alert-fiber.warning { background:rgba(245,158,11,.08); border-color:rgba(245,158,11,.3); color:#FCD34D; }

/* ============================================
   LOGIN — mantém o tema "espacial" anterior
   ============================================ */

.fiber-login-bg {
  position:fixed; inset:0;
  width:100vw; height:100vh;
  z-index:-1;
  background:
    radial-gradient(circle at 20% 20%, rgba(34,211,238,.18) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(167,139,250,.16) 0%, transparent 55%),
    linear-gradient(135deg, #050a1c 0%, #07142b 45%, #04101f 100%);
}

.fiber-login-shell {
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  padding:20px; z-index:1;
}

.fiber-login-card {
  width:100%; max-width:420px; padding:36px 32px;
  border-radius:18px;
  background:rgba(8, 17, 36, 0.78);
  backdrop-filter:blur(14px) saturate(140%);
  border:1px solid rgba(34, 211, 238, 0.18);
  box-shadow:
    0 0 30px rgba(34, 211, 238, 0.18),
    0 20px 60px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  color:#e8f7ff;
  position:relative;
}
.fiber-login-card::before {
  content:'';
  position:absolute; inset:-1px;
  border-radius:18px; padding:1px;
  background:linear-gradient(135deg, rgba(34, 211, 238, 0.55), rgba(167, 139, 250, 0.55), transparent 60%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  pointer-events:none;
}
.fiber-login-logo { height:56px; filter:drop-shadow(0 0 12px rgba(34, 211, 238, 0.45)); }
.fiber-login-title {
  color:#ffffff; font-weight:600; letter-spacing:0.4px;
  text-shadow:0 0 18px rgba(125, 249, 255, 0.35);
  font-family:var(--font-display);
}
.fiber-login-sub {
  color:rgba(199, 232, 255, 0.65);
  font-size:0.85rem; letter-spacing:0.5px; margin-bottom:0;
  font-family:var(--font-mono); text-transform:uppercase;
}

body.fiber-login-page .topbar { display:none; }
body.fiber-login-page { background:none; }
body.fiber-login-page::before { display:none; }

.fiber-code {
  background:rgba(34, 211, 238, 0.15); color:#7df9ff;
  padding:1px 6px; border-radius:4px;
  border:1px solid rgba(34, 211, 238, 0.25);
  font-size:0.85em; font-family:var(--font-mono);
}

/* ============================================
   FALLBACKS para Bootstrap nas demais telas
   (dashboard, logs, users, import, restore, etc.)
   ============================================ */

.shell .card,
.container-fluid .card,
.container .card {
  background:linear-gradient(180deg, var(--bg-2), var(--bg-1)) !important;
  border:1px solid var(--line) !important;
  border-radius:14px !important;
  color:var(--ink-1) !important;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.5) !important;
}

.shell .card-header,
.shell .card-footer {
  background:rgba(0,0,0,.20) !important;
  border-color:var(--line-soft) !important;
  color:var(--ink-1) !important;
}

.shell .card-body { color:var(--ink-1); }

.shell .table,
.shell table.table {
  color:var(--ink-1) !important;
  background:transparent !important;
}
.shell .table thead.table-light,
.shell .table thead {
  background:var(--bg-2) !important;
}
.shell .table thead th {
  color:var(--ink-3) !important;
  background:var(--bg-2) !important;
  border-color:var(--line) !important;
  font-family:var(--font-mono);
  font-size:10.5px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:500;
}
.shell .table tbody td {
  border-color:var(--line-soft) !important;
  color:var(--ink-1) !important;
  background:transparent !important;
}
.shell .table tbody tr:hover { background:rgba(34,211,238,.04) !important; }

.shell h4, .shell h5, .shell h6 { color:var(--ink-0); font-family:var(--font-display); font-weight:500; }
.shell .text-muted { color:var(--ink-3) !important; }
.shell label.form-label { color:var(--ink-3); font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.12em; }

.shell .form-control,
.shell .form-select {
  background:var(--bg-0) !important;
  border:1px solid var(--line) !important;
  color:var(--ink-0) !important;
  border-radius:8px !important;
}
.shell .form-control:focus,
.shell .form-select:focus {
  border-color:var(--accent-dim) !important;
  box-shadow:0 0 0 3px rgba(34,211,238,.10) !important;
}

.shell .btn-primary {
  background:linear-gradient(180deg, #22D3EE, #0EA5B7) !important;
  border:none !important;
  color:#021116 !important;
  font-weight:600;
}
.shell .btn-secondary {
  background:transparent !important;
  border:1px solid var(--line) !important;
  color:var(--ink-1) !important;
}
.shell .btn-outline-primary,
.shell .btn-outline-secondary,
.shell .btn-outline-danger {
  background:transparent !important;
  border:1px solid var(--line) !important;
}
.shell .btn-outline-primary { color:#67E8F9 !important; }
.shell .btn-outline-secondary { color:var(--ink-1) !important; }
.shell .btn-outline-danger { color:#FCA5A5 !important; border-color:rgba(239,68,68,.25) !important; }
.shell .btn-danger { background:rgba(239,68,68,.15) !important; color:#FCA5A5 !important; border:1px solid rgba(239,68,68,.3) !important; }

.shell .alert {
  background:rgba(255,255,255,.04) !important;
  border:1px solid var(--line) !important;
  color:var(--ink-1) !important;
  border-radius:8px;
}
.shell .alert-danger { background:rgba(239,68,68,.08) !important; border-color:rgba(239,68,68,.3) !important; color:#FCA5A5 !important; }
.shell .alert-success { background:rgba(16,185,129,.08) !important; border-color:rgba(16,185,129,.3) !important; color:#86EFAC !important; }
.shell .alert-warning { background:rgba(245,158,11,.08) !important; border-color:rgba(245,158,11,.3) !important; color:#FCD34D !important; }

.shell .pagination .page-link {
  background:var(--bg-2);
  border:1px solid var(--line);
  color:var(--ink-1);
}
.shell .pagination .page-item.disabled .page-link { color:var(--ink-3); background:var(--bg-1); }
.shell .pagination .page-item.active .page-link { background:var(--accent-dim); color:#021116; border-color:var(--accent-dim); }

.shell .badge.bg-secondary { background:var(--bg-3) !important; color:var(--ink-1) !important; }
.shell .badge.bg-danger { background:rgba(239,68,68,.20) !important; color:#FCA5A5 !important; }
.shell .badge.bg-warning { background:rgba(245,158,11,.20) !important; color:#FCD34D !important; }

.shell code {
  background:rgba(34,211,238,.08);
  color:#7df9ff;
  border:1px solid rgba(34,211,238,.20);
  padding:1px 6px; border-radius:4px;
  font-family:var(--font-mono);
}

/* ============================================
   Botão grande tema fibra (no login)
   ============================================ */
.btn-fiber {
  width:100%;
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  background:linear-gradient(180deg, #22D3EE, #0EA5B7);
  border:none; color:#021116;
  font-family:var(--font-body); font-weight:600; letter-spacing:.5px;
  padding:.7rem 1rem; border-radius:10px;
  box-shadow:0 8px 24px rgba(34,211,238,.35), inset 0 1px 0 rgba(255,255,255,.4);
  cursor:pointer; transition:all .2s ease;
}
.btn-fiber:hover { filter:brightness(1.08); transform:translateY(-1px); }