/* app.css — estilos custom do CME Digital (complementam o Tailwind CDN)
   Identidade visual inspirada no dashmobi: brand #2563eb, sidebar ink-900,
   Plus Jakarta Sans, cards suaves, animações discretas. */

:root { --ink-900:#0a1a3b; --ink-800:#0f2347; --ink-700:#1a3266; --brand-500:#2563eb; }

body { font-family:'Plus Jakarta Sans', system-ui, -apple-system, sans-serif; }
[x-cloak] { display:none !important; }

.font-mono, .tabular { font-family:'JetBrains Mono', ui-monospace, monospace; }
.tabular { font-variant-numeric: tabular-nums; }

/* ── Sidebar ── */
.sidebar-bg { background: var(--ink-900); }
.nav-item-active { background: linear-gradient(90deg, #2563eb 0%, #1e40af 100%); }

/* ── Scrollbars ── */
.custom-scroll::-webkit-scrollbar { width:8px; height:8px; }
.custom-scroll::-webkit-scrollbar-track { background:transparent; }
.custom-scroll::-webkit-scrollbar-thumb { background:rgba(148,163,184,.35); border-radius:10px; }
.custom-scroll::-webkit-scrollbar-thumb:hover { background:rgba(148,163,184,.55); }
.dark-scroll::-webkit-scrollbar { width:8px; }
.dark-scroll::-webkit-scrollbar-thumb { background:#1a3266; border-radius:10px; }

/* ── Animações ── */
@keyframes dm-fade-in { from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);} }
.fade-in { animation: dm-fade-in .4s ease-out backwards; }
.fade-in.d-1{animation-delay:.05s;} .fade-in.d-2{animation-delay:.1s;}
.fade-in.d-3{animation-delay:.15s;} .fade-in.d-4{animation-delay:.2s;}
.fade-in.d-5{animation-delay:.25s;} .fade-in.d-6{animation-delay:.3s;}

@keyframes dm-soft-pulse { 0%,100%{opacity:1;} 50%{opacity:.5;} }
.live-dot { animation: dm-soft-pulse 2s ease-in-out infinite; }

@keyframes dm-spin { to { transform: rotate(360deg); } }
.dm-spin { animation: dm-spin .8s linear infinite; }

/* ── Login: fundo pontilhado ── */
.dot-grid {
  background-image: radial-gradient(circle, rgba(255,255,255,.10) 1px, transparent 1px);
  background-size: 22px 22px;
}

/* ── Skeleton ── */
.skeleton { background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 37%,#f1f5f9 63%);
  background-size:400% 100%; animation: dm-shimmer 1.4s ease infinite; }
@keyframes dm-shimmer { 0%{background-position:100% 50%;} 100%{background-position:0 50%;} }

/* Select sem seta nativa (usa a do Tailwind/ícone) */
select.unstyled { -webkit-appearance:none; appearance:none; }