:root{
  --glass-bg: rgba(255,255,255,0.06);
  --glass-brd: rgba(255,255,255,0.18);
  --blob-a: #7c4dff;
  --blob-b: #00e5ff;
  --blob-c: #00c853;
}

/* Fondo con gradiente suave */
.bg-gradient{
  background: radial-gradient(1200px 600px at 20% 10%, rgba(124,77,255,.25), transparent 60%),
              radial-gradient(1000px 600px at 80% 80%, rgba(0,229,255,.20), transparent 60%),
              radial-gradient(900px 500px at 0% 100%, rgba(0,200,83,.18), transparent 60%),
              #0b0f1a;
  position: relative;
}

/* blobs animados */
.bg-blobs{position:fixed; inset:0; overflow:hidden; z-index:-1;}
.bg-blobs span{
  position:absolute; width:46vmin; height:46vmin; filter:blur(60px); opacity:.22; border-radius:50%;
  animation: float 18s ease-in-out infinite;
}
.bg-blobs span:nth-child(1){left:-8vmin; top:-8vmin; background:var(--blob-a);}
.bg-blobs span:nth-child(2){right:-10vmin; bottom:-8vmin; background:var(--blob-b); animation-delay: -6s;}
.bg-blobs span:nth-child(3){left:30%; top:60%; background:var(--blob-c); animation-delay: -12s;}
@keyframes float{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(2rem,-1rem,0) scale(1.05)}}

/* Tarjeta de vidrio */
.card-glass{
  background: var(--glass-bg);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border: 1px solid var(--glass-brd);
  border-radius: 1.25rem;
}

/* Base dashboard */
.bg-surface{ background:#0b0f1a; }

/* Navbar glass */
.navbar-glass{
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
  background-color: rgba(20,24,35,0.75);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.navbar-glass .navbar-toggler{ border-color: rgba(255,255,255,0.15); }
.navbar-glass .navbar-toggler-icon{ filter: invert(1) grayscale(1); }

/* Brand icon */
.brand-icon{ width: 44px; height: 44px; background: linear-gradient(135deg, var(--blob-a), var(--blob-b)); color: #fff; font-size: 1.2rem; }
.brand-icon.small{ width: 28px; height: 28px; display:inline-flex; align-items:center; justify-content:center; border-radius:.4rem; }

/* Shell layout */
.dashboard-shell{ display: grid; grid-template-columns: 260px 1fr; gap: 1.25rem; padding: 1.25rem; }
.dash-sidebar{
  height: calc(100dvh - 72px); position: sticky; top: 72px; padding: 1rem;
  border: 1px solid rgba(255,255,255,.06); border-radius: 1rem; background: rgba(26,30,44,.6); backdrop-filter: blur(8px);
  display: flex; flex-direction: column;
}
.dash-content{ min-height: calc(100dvh - 72px); }

/* Sidebar collapsed */
.sidebar-collapsed .dashboard-shell{ grid-template-columns: 68px 1fr; }
.sidebar-collapsed .dash-sidebar .nav-link{ justify-content: center; }
.sidebar-collapsed .dash-sidebar .nav-link span{ display: none; }
.sidebar-collapsed .dash-sidebar .nav-link i{ margin-right: 0 !important; }

/* Nav links */
.dash-sidebar .nav-link{ color: #c6c9d3; border-radius:.75rem; padding:.6rem .8rem; }
.dash-sidebar .nav-link i{ margin-right:.5rem; }
.dash-sidebar .nav-link.active, .dash-sidebar .nav-link:hover{ background: rgba(124,77,255,.16); color: #fff; }

/* Tarjetas suaves */
.card-soft{ background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: 1rem; }

/* Inputs grandes */
.input-group-lg>.form-control, .input-group-lg>.input-group-text, .input-group-lg>.btn{ border-radius: .9rem; }
.btn-lg{ border-radius: .9rem; }

/* Responsive */
@media (max-width: 992px){
  .dashboard-shell{ grid-template-columns: 1fr; }
  .dash-sidebar{ position: relative; top:0; height:auto; }
}
