/* ================================================================
   Paleta de marca EROSP — reemplaza los colores por defecto de
   Bootstrap/AdminLTE (azul #007bff, verde #28a745, rojo #dc3545,
   amarillo #ffc107, cian #17a2b8) por la paleta propia.

   Base: Azul Marino, Celeste, Naranja Espacial, Beige Arena, Blanco.
   Rojo y Verde son tonos derivados (terracota / verde bosque) para
   que los estados de peligro/éxito se sigan leyendo a simple vista,
   con el mismo nivel de saturación que el Naranja Espacial.
   ================================================================ */

:root {
  --azul-marino:        #17385F;
  --azul-marino-oscuro:  #0F2740;
  --celeste:             #C9E8F7;
  --celeste-oscuro:       #A9D7EF;
  --naranja:              #F78A1D;
  --naranja-oscuro:       #D97300;
  --naranja-claro:        #FBC48E;
  --beige-arena:          #EFE3CF;
  --blanco:               #FFFFFF;
  --rojo:                 #C0392B;
  --rojo-oscuro:          #9B2E22;
  --verde:                #2E7D5B;
  --verde-oscuro:         #215F45;

  /* Fondo del sidebar: neutro casi negro (no azul), para que el logo
     (que ya trae azules y naranja) resalte por color en vez de competir
     con un fondo también azul. */
  --sidebar-bg:           #215F45;

  /* Alias semánticos (mismo criterio que Bootstrap) */
  --primary:  var(--azul-marino);
  --success:  var(--verde);
  --danger:   var(--rojo);
  --warning:  var(--naranja);
  --info:     var(--celeste);
}

/* ── Botones sólidos ────────────────────────────────────────────── */
.btn-primary {
  color: #fff; background-color: var(--azul-marino); border-color: var(--azul-marino);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
  background-color: var(--azul-marino-oscuro) !important; border-color: var(--azul-marino-oscuro) !important;
}
.btn-success {
  color: #fff; background-color: var(--verde); border-color: var(--verde);
}
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active {
  background-color: var(--verde-oscuro) !important; border-color: var(--verde-oscuro) !important;
}
.btn-danger {
  color: #fff; background-color: var(--rojo); border-color: var(--rojo);
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active {
  background-color: var(--rojo-oscuro) !important; border-color: var(--rojo-oscuro) !important;
}
.btn-warning {
  color: #fff; background-color: var(--naranja); border-color: var(--naranja);
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active {
  color: #fff; background-color: var(--naranja-oscuro) !important; border-color: var(--naranja-oscuro) !important;
}
.btn-info {
  color: var(--azul-marino); background-color: var(--celeste); border-color: var(--celeste);
}
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active {
  color: var(--azul-marino); background-color: var(--celeste-oscuro) !important; border-color: var(--celeste-oscuro) !important;
}

/* ── Botones "outline" ──────────────────────────────────────────── */
.btn-outline-primary { color: var(--azul-marino); border-color: var(--azul-marino); }
.btn-outline-primary:hover { color: #fff; background-color: var(--azul-marino); border-color: var(--azul-marino); }
.btn-outline-success { color: var(--verde); border-color: var(--verde); }
.btn-outline-success:hover { color: #fff; background-color: var(--verde); border-color: var(--verde); }
.btn-outline-danger { color: var(--rojo); border-color: var(--rojo); }
.btn-outline-danger:hover { color: #fff; background-color: var(--rojo); border-color: var(--rojo); }
.btn-outline-warning { color: var(--naranja-oscuro); border-color: var(--naranja); }
.btn-outline-warning:hover { color: #fff; background-color: var(--naranja); border-color: var(--naranja); }
.btn-outline-info { color: var(--azul-marino); border-color: var(--celeste); }
.btn-outline-info:hover { color: var(--azul-marino); background-color: var(--celeste); border-color: var(--celeste); }

/* ── Badges (chips de estado) ───────────────────────────────────── */
.badge-primary { color: #fff; background-color: var(--azul-marino); }
.badge-success { color: #fff; background-color: var(--verde); }
.badge-danger  { color: #fff; background-color: var(--rojo); }
.badge-warning { color: #fff; background-color: var(--naranja); }
.badge-info    { color: var(--azul-marino); background-color: var(--celeste); }

/* ── Fondos / texto / bordes de utilidad ────────────────────────── */
.bg-primary { background-color: var(--azul-marino) !important; color: #fff; }
.bg-success { background-color: var(--verde) !important; color: #fff; }
.bg-danger  { background-color: var(--rojo) !important; color: #fff; }
.bg-warning { background-color: var(--naranja) !important; color: #fff; }
.bg-info    { background-color: var(--celeste) !important; color: var(--azul-marino); }

.text-primary { color: var(--azul-marino) !important; }
.text-success { color: var(--verde) !important; }
.text-danger  { color: var(--rojo) !important; }
.text-warning { color: var(--naranja-oscuro) !important; }
.text-info    { color: var(--azul-marino) !important; }

.border-primary { border-color: var(--azul-marino) !important; }
.border-success { border-color: var(--verde) !important; }
.border-danger  { border-color: var(--rojo) !important; }
.border-warning { border-color: var(--naranja) !important; }
.border-info    { border-color: var(--celeste) !important; }

/* ── Alertas: fondo neutro + acento por tipo (mismo patrón para los 5) ── */
.alert-primary, .alert-success, .alert-danger, .alert-warning, .alert-info {
  background-color: var(--beige-arena);
  color: var(--azul-marino);
  border-left: 4px solid;
}
.alert-primary { border-color: var(--azul-marino); }
.alert-success { border-color: var(--verde); }
.alert-danger  { border-color: var(--rojo); }
.alert-warning { border-color: var(--naranja); }
.alert-info    { border-color: var(--celeste); }

/* ── Enlaces ─────────────────────────────────────────────────────── */
a { color: var(--azul-marino); }
a:hover { color: var(--naranja); }

/* ── Sidebar (AdminLTE) ──────────────────────────────────────────── */
.sidebar-dark-primary,
.sidebar-dark-primary .brand-link:not([class*="navbar"]) {
  background-color: var(--sidebar-bg) !important;
}
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar .nav-treeview > .nav-item > .nav-link.active {
  background-color: var(--naranja) !important;
  color: #fff !important;
}

/* Padre expandido (tiene hijos visibles) — mismo look de "abierto" para todos,
   sin competir con el naranja de .active (que es solo del módulo hoja real). */
.sidebar-dark-primary .nav-sidebar .nav-item.menu-open > .nav-link {
  background-color: rgba(255, 255, 255, .08);
  color: #fff;
}

/* Hijos con sangría clara para que se note que van dentro de su padre. */
.sidebar-dark-primary .nav-sidebar .nav-treeview > .nav-item > .nav-link {
  padding-left: 2.75rem;
}
.sidebar-dark-primary .nav-sidebar .nav-treeview > .nav-item > .nav-link p {
  font-size: .93rem;
}