/* =====================================================
   SOASEM — Tema unificado AdminLTE
   Define las mismas CSS vars que style.css y aplica
   overrides sobre AdminLTE para que ambas superficies
   compartan el mismo esquema de colores.
   ===================================================== */

/* Variables de marca — fuente única de verdad */
:root {
  --soasem-primary:         #3eb1f3;  /* Amarillo dorado  */
  --soasem-secondary:       #24262c;  /* Azul oscuro       */
  --soasem-secondary-light: #60677e;  /* +5% luminosidad  */
  --soasem-secondary-dark:  #25272d;  /* -5% luminosidad  */
  --soasem-white:           #ffffff;
  --soasem-black:           #000000;
  --soasem-text:            #0c0c0c;
  --soasem-text-muted:      #6d6d6d;
  --soasem-text-gray:       #999;
}


/* =====================================================
   SIDEBAR
   ===================================================== */

/* Fondo principal del sidebar */
.main-sidebar,
.main-sidebar.sidebar-dark-primary {
  background-color: var(--soasem-secondary);
}

/* Barra de marca / logo */
.main-sidebar.sidebar-dark-primary .brand-link,
.main-sidebar .brand-link {
  background-color: var(--soasem-secondary-dark);
  border-bottom-color: rgba(255, 255, 255, 0.1);
}

.main-sidebar.sidebar-dark-primary .brand-link:hover {
  background-color: var(--soasem-secondary-dark);
}

/* Ítems de navegación — estado activo */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item.menu-open > .nav-link {
  background-color: var(--soasem-primary) !important;
  color: var(--soasem-secondary) !important;
  font-weight: 600;
}

/* Ítems de navegación — hover */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:hover {
  background-color: rgba(62, 195, 243, 0.15);
  color: var(--soasem-primary) !important;
}

/* Sub-menú activo */
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link:hover {
  color: var(--soasem-primary) !important;
}

/* Iconos en el sidebar */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link .nav-icon {
  color: rgba(255, 255, 255, 0.65);
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active .nav-icon,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:hover .nav-icon {
  color: var(--soasem-secondary) !important;
}

/* Ícono cuando el item activo */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active .nav-icon {
  color: var(--soasem-secondary) !important;
}

/* Encabezados de grupo de menú */
.sidebar-dark-primary .nav-header {
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.7rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Scrollbar del sidebar */
.sidebar-dark-primary .os-scrollbar-track > .os-scrollbar-handle {
  background: rgba(255, 255, 255, 0.2);
}


/* =====================================================
   NAVBAR SUPERIOR
   ===================================================== */

/* Borde inferior dorado como acento de marca */
.main-header.navbar {
  border-bottom: 3px solid var(--soasem-primary);
}

/* Links activos del navbar */
.navbar-white .navbar-nav > .nav-item > .nav-link:hover,
.navbar-white .navbar-nav > .active > .nav-link {
  color: var(--soasem-secondary);
}

/* Ícono hamburguesa / sidebar-toggle */
.navbar-white .navbar-nav > .nav-item > .nav-link {
  color: var(--soasem-secondary);
}


/* =====================================================
   BOTONES PRIMARIOS
   ===================================================== */

.btn-primary {
  background-color: var(--soasem-secondary);
  border-color: var(--soasem-secondary);
  color: var(--soasem-white);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  background-color: var(--soasem-secondary-dark);
  border-color: var(--soasem-secondary-dark);
  color: var(--soasem-white);
}

/* Botón flat (usado en páginas de auth) */
.btn-flat.btn-primary {
  background-color: var(--soasem-secondary);
  border-color: transparent;
}

.btn-flat.btn-primary:hover {
  background-color: var(--soasem-secondary-dark);
}


/* =====================================================
   CARDS
   ===================================================== */

/* Card con header primario (relleno) */
.card-primary:not(.card-outline) > .card-header {
  background-color: var(--soasem-secondary);
  border-bottom-color: var(--soasem-secondary);
}

/* Card con outline primario — borde superior dorado */
.card.card-outline.card-primary {
  border-top: 3px solid var(--soasem-primary);
}

/* Encabezados de tarjeta */
.card-header .card-title {
  color: inherit;
}


/* =====================================================
   PÁGINAS DE AUTENTICACIÓN (login / registro)
   ===================================================== */

/* Fondo de auth */
.login-page,
.register-page {
  background-color: var(--soasem-secondary);
}

/* Borde superior de la card de auth */
.login-card-body,
.register-card-body {
  border-top: 3px solid var(--soasem-primary);
}

/* Logo en auth pages */
.login-logo a,
.register-logo a {
  color: var(--soasem-white);
}

.login-logo a b,
.register-logo a b {
  color: var(--soasem-primary);
}


/* =====================================================
   ELEMENTOS DE ACENTO GENERALES
   ===================================================== */

/* Links activos y estados de foco */
a.active,
.page-item.active .page-link {
  color: var(--soasem-primary);
  border-color: var(--soasem-primary);
  background-color: var(--soasem-primary);
}

/* Paginación */
.page-link:hover {
  color: var(--soasem-secondary);
}

/* Progress bars */
.progress-bar.bg-primary {
  background-color: var(--soasem-secondary) !important;
}

/* Badges primarios */
.badge-primary,
.badge.bg-primary {
  background-color: var(--soasem-secondary) !important;
}

/* Badges de acento / amarillo */
.badge-warning,
.badge.bg-warning {
  background-color: var(--soasem-primary) !important;
  color: var(--soasem-secondary) !important;
}

/* Small boxes del dashboard (info-box) */
.info-box .info-box-icon.bg-primary {
  background-color: var(--soasem-secondary);
}

.small-box.bg-primary {
  background-color: var(--soasem-secondary) !important;
}

/* Tabs activos */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: var(--soasem-secondary);
  border-bottom-color: var(--soasem-secondary);
}

/* Alertas de info */
.alert-primary {
  background-color: rgba(58, 68, 104, 0.1);
  border-color: var(--soasem-secondary);
  color: var(--soasem-secondary);
}

/* Inputs con foco */
.form-control:focus {
  border-color: var(--soasem-primary);
  box-shadow: 0 0 0 0.2rem rgba(243, 201, 62, 0.25);
}

/* Checkboxes y radios de Bootstrap */
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--soasem-secondary);
  border-color: var(--soasem-secondary);
}

/* DataTables — fila seleccionada */
table.dataTable tbody tr.selected {
  background-color: rgba(58, 68, 104, 0.1) !important;
}

/* Select2 — item seleccionado */
.select2-container--default .select2-results__option--highlighted {
  background-color: var(--soasem-secondary) !important;
}

.select2-container--default .select2-selection--single:focus,
.select2-container--default.select2-container--focus .select2-selection--single {
  border-color: var(--soasem-primary);
}

/* Breadcrumbs */
.content-header .breadcrumb .breadcrumb-item.active {
  color: var(--soasem-secondary);
}