/* ==========================================
   1. CLASES GENERALES Y COMPONENTES
   ========================================== */

/* Banner corporativo */
.banner { 
  background-color: transparent !important; 
}

/* Imagen Responsiva */
.imagen-responsiva {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Centrado de texto y contenedores */
.centrar {
  text-align: center;
}

/* Personalizaci¨®n ligera de formularios (Compatibilidad con Bootstrap 5) */
.form-control {
  font-weight: 350;
  color: #6e707e;
  background-color: #ffffff;
  padding: 0.370rem 0.70rem;
}

/* ==========================================
   2. UTILIDADES DE COLOR
   ========================================== */

.bg-custom-light {
  background-color: #ffffff;
}

.bg-negro {
  background-color: #000000;
}

.texto-negro {
  color: #000000;
}

/* Enlaces blancos limpios */
.enlace-blanco {
  color: #ffffff !important; 
  background-color: transparent; 
  text-decoration: none;
}

.enlace-blanco:hover {
  color: #e2e8f0 !important;
  text-decoration: underline;
}

/* ==========================================
   3. BARRA DE DESPLAZAMIENTO (SCROLLBAR)
   ========================================== */

/* Regla est¨˘ndar moderna para Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #004981 #C6CFE8; /* [Tirador] / [Carril] */
}

/* Personalizaci¨®n WebKit (Chrome, Safari, Edge, Opera) */

/* 1. Ancho y alto de las barras de desplazamiento */
::-webkit-scrollbar {
  width: 16px;  /* Ancho para la barra vertical optimizado */
  height: 12px; /* Alto para la barra horizontal */
}

/* 2. Fondo de la barra (El carril o pista) */
::-webkit-scrollbar-track {
  background: #C6CFE8; 
  border-radius: 3px;
}

/* 3. El cursor o tirador (La parte deslizante) */
::-webkit-scrollbar-thumb {
  background: #004981; 
  border-radius: 4px;
  border: 2px solid #C6CFE8; /* Margen est¨¦tico con el carril */
}

/* Cambio de color al pasar el cursor sobre el tirador */
::-webkit-scrollbar-thumb:hover {
  background: #002F67;
}

/* 4. Botones de desplazamiento (Flechas de navegaci¨®n) */
::-webkit-scrollbar-button {
  background-color: #002F67;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 3px;
}

/* Estado hover para los botones de las flechas */
::-webkit-scrollbar-button:hover {
  background-color: #004981;
}