/*=============================================
CONTROL GENERAL · estilos
=============================================*/
:root{ --bg:#f3f5fb; --ink:#0f172a; --muted:#64748b; --line:#e8ecf4; --brand:#6366f1; --brand2:#10b981; }

body.cg-body, .cg-body .content-wrapper, .cg-body .right-side{ background:var(--bg); }
body{ font-family:'Source Sans Pro','Segoe UI',system-ui,-apple-system,sans-serif; color:var(--ink); }

/* Cabecera y menú */
.skin-blue .main-header .logo, .skin-blue .main-header .navbar{ background:linear-gradient(90deg,#1e1b4b,#312e81); }
.skin-blue .main-header .logo{ font-weight:300; letter-spacing:.3px; border-bottom:0; }
.skin-blue .main-header .logo:hover{ background:#1e1b4b; }
.main-header .logo .cg-header-logo{ height:38px; width:auto; display:inline-block; vertical-align:middle; }
.skin-blue .main-header .navbar .sidebar-toggle:hover{ background:rgba(255,255,255,.1); }
.skin-blue .main-sidebar{ background:#0f172a; }
.skin-blue .sidebar-menu > li.header{ background:#0f172a; color:#64748b; font-size:11px; letter-spacing:1.2px; padding:14px 15px 6px; }
.skin-blue .sidebar-menu > li > a{ color:#cbd5e1; border-left:3px solid transparent; padding:11px 15px; }
.skin-blue .sidebar-menu > li:hover > a{ background:#1e293b; color:#fff; }
.skin-blue .sidebar-menu > li.active > a{ background:linear-gradient(90deg,rgba(99,102,241,.35),rgba(99,102,241,0)); color:#fff; border-left-color:#818cf8; }
.skin-blue .sidebar-menu > li > a > .fa{ width:22px; }
.cg-conexion small.label{ margin-left:3px; font-weight:600; }
.cg-nav-live a{ color:#c7d2fe !important; font-variant-numeric:tabular-nums; }
.cg-pulse{ display:inline-block; width:9px; height:9px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 0 rgba(34,197,94,.7); animation:cgpulse 1.8s infinite; margin-right:4px; }
@keyframes cgpulse{ 70%{ box-shadow:0 0 0 9px rgba(34,197,94,0);} 100%{ box-shadow:0 0 0 0 rgba(34,197,94,0);} }
.cg-avatar{ display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#6366f1,#10b981); color:#fff; font-weight:700; margin-right:6px; font-size:13px; }
.cg-avatar-lg{ width:64px; height:64px; font-size:28px; margin:0; }
.cg-avatar-sm{ width:30px; height:30px; margin:0; }
.cg-user-menu .cg-user-head{ text-align:center; padding:22px 10px 12px; background:linear-gradient(135deg,#312e81,#4f46e5); color:#fff; }
.cg-user-menu .cg-user-head p{ margin:10px 0 0; font-size:16px; }
.cg-user-menu .cg-user-head small{ display:block; color:#c7d2fe; margin-top:3px; }

/* Encabezados */
.cg-page-head h1{ font-weight:700; font-size:26px; }
.cg-page-head h1 small{ color:var(--muted); font-weight:400; margin-left:8px; }
.cg-title-dot{ display:inline-block; width:12px; height:12px; border-radius:50%; margin-right:6px; vertical-align:middle; }

/* Hero */
.cg-hero{ position:relative; overflow:hidden; border-radius:22px; padding:30px 34px; margin-bottom:22px; color:#fff; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:20px;
  background:radial-gradient(circle at 85% 15%,rgba(16,185,129,.55),transparent 45%),radial-gradient(circle at 10% 100%,rgba(236,72,153,.35),transparent 40%),linear-gradient(120deg,#1e1b4b,#4338ca 60%,#6366f1);
  box-shadow:0 18px 40px -18px rgba(67,56,202,.7); }
.cg-hero:after{ content:""; position:absolute; right:-60px; top:-60px; width:240px; height:240px; border-radius:50%; background:rgba(255,255,255,.07); }
.cg-hero h1{ margin:6px 0 4px; font-size:34px; font-weight:700; }
.cg-hero p{ margin:0 0 10px; color:#c7d2fe; font-size:15px; }
.cg-hero-fecha{ text-transform:capitalize; color:#e0e7ff; font-size:13px; letter-spacing:.4px; }
.cg-hero-estado{ font-size:13px; color:#d1fae5; }
.cg-wave{ display:inline-block; animation:cgwave 2.2s infinite; transform-origin:70% 70%; }
@keyframes cgwave{ 0%,60%,100%{ transform:rotate(0);} 10%,30%{ transform:rotate(14deg);} 20%,40%{ transform:rotate(-8deg);} 50%{ transform:rotate(10deg);} }
.cg-hero-filtros{ position:relative; z-index:2; }
.cg-hero-filtros label{ display:block; font-size:11px; letter-spacing:1px; text-transform:uppercase; color:#c7d2fe; margin-bottom:6px; }
.cg-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.cg-chips button{ border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.08); color:#fff; border-radius:20px; padding:5px 14px; font-size:13px; transition:.2s; }
.cg-chips button:hover{ background:rgba(255,255,255,.22); }
.cg-chips button.active{ background:#fff; color:#3730a3; font-weight:700; border-color:#fff; }
.cg-rango-hero{ background:rgba(255,255,255,.14); color:#fff; border:1px solid rgba(255,255,255,.3); border-radius:10px; }
.cg-rango-hero:hover{ background:rgba(255,255,255,.25); color:#fff; }

/* Tarjetas "hoy" */
.cg-hoy{ position:relative; display:block; overflow:hidden; border-radius:18px; padding:20px 22px; margin-bottom:22px; color:#fff !important; text-decoration:none !important;
  background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 60%,#000)); box-shadow:0 14px 28px -16px var(--c); transition:transform .2s; }
a.cg-hoy:hover{ transform:translateY(-3px); }
.cg-hoy span{ display:block; position:relative; z-index:2; }
.cg-hoy-tag{ font-size:11px; letter-spacing:1.2px; opacity:.85; font-weight:600; }
.cg-hoy-tag .fa{ font-size:8px; vertical-align:middle; margin-right:3px; animation:cgblink 1.6s infinite; }
@keyframes cgblink{ 50%{ opacity:.2; } }
.cg-hoy-v{ font-size:34px; font-weight:700; line-height:1.15; margin:4px 0; font-variant-numeric:tabular-nums; }
.cg-hoy-s{ opacity:.9; font-size:13px; }
.cg-hoy-d{ margin-top:8px; font-size:12px; }
.cg-hoy-d .cg-delta{ background:rgba(255,255,255,.2); color:#fff !important; }
.cg-hoy-ico{ position:absolute; right:14px; bottom:-14px; font-size:92px; opacity:.12; }

/* Tarjetas KPI */
.cg-kpi{ position:relative; background:#fff; border-radius:18px; padding:16px 18px 12px; margin-bottom:22px; box-shadow:0 8px 24px -14px rgba(15,23,42,.25); border:1px solid var(--line); overflow:hidden; transition:transform .2s, box-shadow .2s; min-height:132px; }
.cg-kpi:hover{ transform:translateY(-3px); box-shadow:0 16px 30px -16px rgba(15,23,42,.35); }
.cg-kpi:before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--c); }
.cg-kpi-top{ display:flex; align-items:center; gap:12px; }
.cg-kpi-ico{ flex:0 0 44px; height:44px; border-radius:13px; display:flex; align-items:center; justify-content:center; font-size:19px; color:#fff; background:var(--c); box-shadow:0 8px 14px -8px var(--c); }
.cg-kpi-txt{ min-width:0; }
.cg-kpi-t{ display:block; font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cg-kpi-v{ display:block; font-size:25px; font-weight:700; line-height:1.15; font-variant-numeric:tabular-nums; }
.cg-kpi-pie{ margin-top:8px; font-size:12px; color:var(--muted); }
.cg-kpi-spark{ margin:2px -18px -12px; }
.cg-delta{ display:inline-block; font-weight:700; font-size:12px; padding:1px 8px; border-radius:20px; }
.cg-delta.up{ background:#dcfce7; color:#15803d; }
.cg-delta.down{ background:#fee2e2; color:#b91c1c; }
.cg-delta.neutral{ background:#f1f5f9; color:#64748b; }
.cg-split{ display:flex; height:8px; border-radius:6px; overflow:hidden; background:#eef2f7; margin-bottom:6px; }
.cg-split span{ display:block; height:100%; }
.cg-split-leyenda{ display:flex; flex-direction:column; gap:1px; }
.cg-split-leyenda b{ color:var(--ink); float:right; }

/* Tarjetas generales */
.cg-card, .cg-card-box{ background:#fff; border-radius:18px; padding:18px 20px 12px; margin-bottom:22px; border:1px solid var(--line); box-shadow:0 8px 24px -16px rgba(15,23,42,.25); }
.cg-card h4{ margin:0 0 10px; font-size:15px; font-weight:700; color:#1e293b; }
.cg-card h4 .fa{ color:var(--brand); margin-right:4px; }
.cg-card-box.box{ padding:0; }
.cg-sindatos{ display:flex; flex-direction:column; align-items:center; justify-content:center; padding:50px 10px; color:#94a3b8; }
.cg-sindatos .fa{ font-size:34px; margin-bottom:8px; }

/* Barra de filtros */
.cg-toolbar{ border-radius:16px; border:1px solid var(--line); box-shadow:0 8px 24px -18px rgba(15,23,42,.3); margin-bottom:18px; position:sticky; top:50px; z-index:50; }
.cg-toolbar .box-body{ display:flex; flex-wrap:wrap; gap:18px; align-items:flex-end; }
.cg-filtro label{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.8px; color:var(--muted); margin-bottom:4px; }
.cg-filtro-der{ margin-left:auto; display:flex; gap:6px; align-items:center; }
.cg-actualizado{ color:var(--muted); font-size:12px; margin-right:6px; }
.cg-rango{ min-width:270px; text-align:left; border-radius:10px; font-weight:600; }
#cg-agrup .btn{ font-weight:600; }
#cg-agrup .btn.active{ background:var(--brand); color:#fff; border-color:var(--brand); }

/* Pestañas */
.cg-tabs.nav-tabs-custom{ background:transparent; box-shadow:none; }
.cg-tabs > .nav-tabs{ border-bottom:0; margin-bottom:14px; }
.cg-tabs > .nav-tabs > li > a{ border:0 !important; border-radius:12px; margin-right:6px; background:#fff; color:#475569; font-weight:600; padding:10px 18px; box-shadow:0 4px 10px -8px rgba(15,23,42,.4); }
.cg-tabs > .nav-tabs > li.active > a, .cg-tabs > .nav-tabs > li.active:hover > a{ background:var(--brand); color:#fff; }
.cg-tabs > .nav-tabs > li > a:hover{ background:#eef2ff; color:#4338ca; }
.cg-tabs > .nav-tabs > li.active > a:hover{ background:var(--brand); color:#fff; }
.cg-tabs > .tab-content{ background:transparent; padding:0; }
.cg-alert{ border-radius:12px; }

/* Tablas */
.cg-card table.dataTable thead th{ background:#f8fafc; color:#475569; font-size:12px; text-transform:uppercase; letter-spacing:.5px; border-bottom:1px solid var(--line); }
.cg-card table.dataTable{ border-color:var(--line); }
.cg-cmp-tabla th, .cg-cmp-tabla td{ padding:10px 12px !important; }
.cg-cmp-tabla thead th{ background:#f8fafc; text-transform:uppercase; font-size:12px; color:#475569; }
.dataTables_wrapper .dataTables_filter input{ border-radius:8px; border:1px solid var(--line); padding:3px 8px; }

/* Feed */
.cg-feed{ list-style:none; margin:0; padding:0; }
.cg-feed li{ display:flex; align-items:center; gap:12px; padding:10px 4px; border-bottom:1px dashed var(--line); animation:cgin .5s both; }
.cg-feed li:last-child{ border-bottom:0; }
.cg-feed-dot{ flex:0 0 10px; height:10px; border-radius:50%; }
.cg-feed-txt{ flex:1; min-width:0; }
.cg-feed-txt b, .cg-feed-der b{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cg-feed small{ color:var(--muted); }
.cg-feed-der{ text-align:right; }
@keyframes cgin{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none; } }

.cg-empty{ text-align:center; padding:90px 10px; color:var(--muted); }
.cg-empty .fa{ font-size:60px; color:#c7d2fe; }

/* Login */
body.cg-login{ background:#0b1020; min-height:100vh; }
.cg-login-bg{ position:fixed; inset:0; z-index:0; background:radial-gradient(circle at 20% 20%,#4338ca 0,transparent 40%),radial-gradient(circle at 80% 30%,#059669 0,transparent 38%),radial-gradient(circle at 50% 100%,#be185d 0,transparent 45%),#0b1020; filter:saturate(1.1); animation:cgbg 14s ease-in-out infinite alternate; }
@keyframes cgbg{ to{ transform:scale(1.15) rotate(3deg); } }
.cg-login-box{ position:relative; z-index:2; width:400px; max-width:92%; margin:8vh auto 0; }
.cg-login-brand{ text-align:center; color:#fff; margin-bottom:22px; }
.cg-login-brand h1{ margin:12px 0 2px; font-weight:700; }
.cg-login-brand p{ color:#c7d2fe; margin:0; }
.cg-login-logo{ display:inline-block; width:68px; height:68px; border-radius:20px; object-fit:contain; background:#fff; box-shadow:0 14px 30px -10px rgba(99,102,241,.9); }
.cg-login-card{ background:rgba(255,255,255,.95); border-radius:22px; padding:26px 28px 24px; box-shadow:0 30px 60px -20px rgba(0,0,0,.6); }
.cg-login-card .login-box-msg{ font-size:16px; color:#334155; padding:0 0 16px; }
.cg-login-card .form-control{ border-radius:12px; height:46px; }
.cg-login-card .btn-primary{ border-radius:12px; background:linear-gradient(90deg,#4f46e5,#6366f1); border:0; font-weight:600; }
.cg-login-pie{ text-align:center; color:#94a3b8; margin-top:16px; font-size:12px; }

/* Impresión */
@media print{
  .main-header, .main-sidebar, .cg-toolbar, .main-footer, .cg-tabs > .nav-tabs, .cg-csv, .apexcharts-toolbar{ display:none !important; }
  .content-wrapper{ margin-left:0 !important; background:#fff; }
  .tab-content > .tab-pane{ display:block !important; opacity:1 !important; page-break-inside:avoid; }
  .cg-card, .cg-kpi{ box-shadow:none; break-inside:avoid; }
}
@media (max-width:767px){
  .cg-hero h1{ font-size:26px; } .cg-hero{ padding:22px; }
  .cg-toolbar{ position:static; } .cg-filtro-der{ margin-left:0; } .cg-rango{ min-width:0; width:100%; }
  .cg-tabs > .nav-tabs > li{ float:none; display:inline-block; margin-bottom:6px; }
}
