/* ==========================================================
   Sistema de Licencias - MU Caidos S6
   Tema oscuro con acento dorado
   ========================================================== */
:root{
  --fondo:#0d1117;
  --panel:#161b22;
  --panel-2:#1c2330;
  --borde:#2a3241;
  --texto:#e6edf3;
  --suave:#8b949e;
  --oro:#c9a227;
  --oro-claro:#e2bf45;
  --rojo:#da3633;
  --verde:#238636;
}

*{scrollbar-width:thin;scrollbar-color:#30363d var(--panel)}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:var(--panel)}
*::-webkit-scrollbar-thumb{background:#30363d;border-radius:6px}

body{
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(201,162,39,.08), transparent 60%),
    radial-gradient(900px 500px at 110% 10%, rgba(56,139,253,.07), transparent 60%),
    var(--fondo);
  color:var(--texto);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  min-height:100vh;
  display:flex;flex-direction:column;
}

/* ---------- Barra superior ---------- */
.barra-superior{
  background:rgba(13,17,23,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--borde);
  min-height:58px;
}
.icono-marca{color:var(--oro);font-size:1.25rem}
.marca-texto{font-weight:700;letter-spacing:.3px;font-size:1rem}
.navbar-brand{color:var(--texto)!important}

/* ---------- Botones ---------- */
.btn-oro{background:var(--oro);border:1px solid var(--oro);color:#0d1117;font-weight:600}
.btn-oro:hover,.btn-oro:focus{background:var(--oro-claro);border-color:var(--oro-claro);color:#0d1117}
.btn-borde{background:transparent;border:1px solid var(--borde);color:var(--texto)}
.btn-borde:hover{background:var(--panel-2);color:var(--texto);border-color:#3d4757}
.btn-menu{background:transparent;border:1px solid var(--borde);color:var(--texto)}
.btn-aviso{background:transparent;border:1px solid var(--borde);color:var(--oro)}

/* ---------- Estructura ---------- */
.contenedor-panel{display:flex;flex:1;align-items:stretch}
.menu-lateral{
  width:250px;flex:0 0 250px;
  background:var(--panel);
  border-right:1px solid var(--borde);
  padding:1rem 0;
}
.contenido{flex:1;padding:1.5rem;max-width:100%;min-width:0}
@media(max-width:991px){.contenido{padding:1rem}}

.menu-movil{background:var(--panel);border-right:1px solid var(--borde);width:260px}

/* ---------- Menu ---------- */
.nav-titulo{
  font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;
  color:var(--suave);padding:.5rem 1.25rem;font-weight:700;
}
.nav-lateral .nav-link{
  color:#b8c2cf;padding:.62rem 1.25rem;display:flex;align-items:center;gap:.7rem;
  border-left:3px solid transparent;font-size:.925rem;
}
.nav-lateral .nav-link i{width:18px;text-align:center;font-size:1rem}
.nav-lateral .nav-link:hover{background:var(--panel-2);color:#fff}
.nav-lateral .nav-link.activo{
  background:linear-gradient(90deg, rgba(201,162,39,.16), transparent);
  border-left-color:var(--oro);color:#fff;font-weight:600;
}

/* ---------- Tarjetas ---------- */
.card{background:var(--panel);border:1px solid var(--borde);border-radius:10px}
.card-header{background:var(--panel-2);border-bottom:1px solid var(--borde);font-weight:600}
.tarjeta-stat{
  background:linear-gradient(145deg,var(--panel),var(--panel-2));
  border:1px solid var(--borde);border-radius:10px;padding:1.1rem;height:100%;
  transition:transform .15s ease,border-color .15s ease;
}
.tarjeta-stat:hover{transform:translateY(-2px);border-color:#3d4757}
.tarjeta-stat .valor{font-size:1.85rem;font-weight:700;line-height:1}
.tarjeta-stat .etiqueta{color:var(--suave);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}
.tarjeta-stat .icono{font-size:1.6rem;opacity:.85}

/* ---------- Tablas ---------- */
.table{--bs-table-bg:transparent;--bs-table-color:var(--texto);border-color:var(--borde)}
.table>:not(caption)>*>*{border-color:var(--borde);padding:.7rem .75rem}
.table thead th{
  color:var(--suave);font-size:.74rem;text-transform:uppercase;letter-spacing:.07em;
  background:var(--panel-2);font-weight:700;white-space:nowrap;
}
.table-hover>tbody>tr:hover>*{background:rgba(201,162,39,.06);color:var(--texto)}

/* ---------- Formularios ---------- */
.form-control,.form-select,.input-group-text{
  background:#0d1117;border-color:var(--borde);color:var(--texto);
}
.form-control:focus,.form-select:focus{
  background:#0d1117;color:var(--texto);border-color:var(--oro);
  box-shadow:0 0 0 .2rem rgba(201,162,39,.2);
}
.form-control::placeholder{color:#5c6773}
.form-control:disabled,.form-control[readonly]{background:#11161d;color:#9aa6b2}
.form-label{font-weight:600;font-size:.875rem;margin-bottom:.35rem}
.form-text{color:var(--suave)}
.input-group-text{color:var(--suave)}

/* ---------- Clave de licencia ---------- */
.caja-clave{
  background:#0b0f15;border:1px dashed var(--oro);border-radius:8px;
  padding:.85rem 1rem;font-family:"SFMono-Regular",Consolas,monospace;
  font-size:1.12rem;font-weight:700;letter-spacing:.12em;color:var(--oro-claro);
  text-align:center;word-break:break-all;user-select:all;
}
.caja-clave.bloqueada{border-color:var(--borde);color:#4d5661;letter-spacing:.35em}
.mono{font-family:"SFMono-Regular",Consolas,monospace;font-size:.85rem}

/* ---------- Varios ---------- */
.pie{
  border-top:1px solid var(--borde);background:var(--panel);
  padding:.85rem 0;font-size:.82rem;color:var(--suave);
}
.dropdown-menu{background:var(--panel);border:1px solid var(--borde)}
.dropdown-item{color:var(--texto)}
.dropdown-item:hover{background:var(--panel-2);color:#fff}
.modal-content{background:var(--panel);border:1px solid var(--borde)}
.modal-header,.modal-footer{border-color:var(--borde)}
.nav-tabs{border-color:var(--borde)}
.nav-tabs .nav-link{color:var(--suave);border:none;border-bottom:2px solid transparent}
.nav-tabs .nav-link.active{background:transparent;color:var(--oro);border-bottom-color:var(--oro)}
.badge{font-weight:600}
.progress{background:#0d1117;height:7px}
.alert{border:1px solid transparent}
.text-oro{color:var(--oro)!important}
.borde-oro{border-color:var(--oro)!important}
hr{border-color:var(--borde);opacity:1}

/* ---------- Acceso (login / registro) ---------- */
.pantalla-acceso{
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem;
}
.caja-acceso{width:100%;max-width:430px}
.caja-acceso .card{box-shadow:0 18px 50px rgba(0,0,0,.45)}
.logo-acceso{
  width:66px;height:66px;border-radius:16px;margin:0 auto 1rem;
  background:linear-gradient(145deg,var(--oro),#8a6f18);
  display:flex;align-items:center;justify-content:center;
  font-size:2rem;color:#0d1117;box-shadow:0 8px 24px rgba(201,162,39,.3);
}