/**
 * Archivo consolidado para todas las correcciones de iconos
 * Consolida: btncontacto-icons-fix.css, btncontacto-theme-fix.css, 
 * faq-icons-fix.css, icons-contrast-fix.css, global-icons-contrast-fix.css
 */

/* ========================================
   CORRECCIONES GLOBALES DE ICONOS
   ======================================== */

/* Forzar visibilidad de Bootstrap Icons */
.bi {
  display: inline-block !important;
  font-style: normal !important;
  font-variant: normal !important;
  text-rendering: auto !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  font-family: "bootstrap-icons" !important;
}

/* Iconos con text-primary - cambiar a color más oscuro */
.bi.text-primary {
  color: #1d4ed8 !important; /* var(--primary-700) para mejor contraste */
}

/* Iconos con text-primary-modern - mantener contraste */
.bi.text-primary-modern {
  color: #1d4ed8 !important; /* var(--primary-700) */
}

/* ========================================
   ICONOS EN COMPONENTES ESPECÍFICOS
   ======================================== */

/* Header - Navegación principal */
.navbar-nav .nav-link .bi {
  color: #1e40af !important; /* var(--primary-800) */
}

/* Botón de cerrar móvil */
.btn-close-mobile .bi,
#closeMobileMenu .bi {
  color: #1e40af !important; /* var(--primary-800) */
}

/* Footer - Información de contacto */
.footer-info .bi,
.contact-info .bi {
  color: #1d4ed8 !important; /* var(--primary-700) */
}

/* Menús dropdown */
.dropdown-menu .bi.text-primary {
  color: #1d4ed8 !important; /* var(--primary-700) */
}

/* ========================================
   COMPONENTE BTNCONTACTO
   ======================================== */

/* Contenedor de iconos en círculo */
.icon-circle-sm {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 1.8rem !important;
  height: 1.8rem !important;
  border-radius: 50% !important;
  margin-right: 0.5rem !important;
  transition: all 0.3s ease !important;
}

/* Trust items - Iconos blancos sobre azul */
.modern-contact-container .trust-item .icon-circle-sm {
  background-color: #2563eb !important;
  color: white !important;
}

.modern-contact-container .trust-item .bi {
  color: white !important;
  font-size: 1rem !important;
}

/* Action buttons - Iconos azules sobre blanco */
.modern-contact-container .action-button .icon-circle-sm {
  background-color: #dbeafe !important;
  color: #2563eb !important;
}

.modern-contact-container .action-button .bi {
  color: #2563eb !important;
  font-size: 1rem !important;
}

/* Info items - Iconos blancos sobre azul */
.modern-contact-container .info-item .icon-circle-sm {
  background-color: #2563eb !important;
  color: white !important;
}

.modern-contact-container .info-item .bi {
  color: white !important;
  font-size: 1rem !important;
}

/* ========================================
   CORRECCIONES DE CONTRASTE ESPECÍFICAS
   ======================================== */

/* Iconos en fondos primarios (azules) */
.bg-primary .bi,
.bg-primary-50 .bi,
.bg-primary-100 .bi,
.bg-primary-200 .bi,
.bg-primary-300 .bi,
.bg-primary-400 .bi,
.bg-primary-500 .bi,
.bg-primary-600 .bi,
.bg-primary-700 .bi,
.bg-primary-800 .bi,
.bg-primary-900 .bi,
.bg-theme-primary .bi,
.bg-theme-secondary .bi,
.btn-primary .bi,
.btn-primary-modern .bi {
  color: white !important;
}

/* ========================================
   BOTONES Y ENLACES
   ======================================== */

/* Botones con iconos */
.btn .bi.text-primary {
  color: inherit !important; /* Heredar color del botón */
}

.btn-primary .bi {
  color: white !important;
}

.btn-secondary .bi {
  color: white !important;
}

.btn-outline-primary .bi {
  color: #2563eb !important; /* var(--primary-600) */
}

/* ========================================
   ESTADOS HOVER Y FOCUS
   ======================================== */

/* Hover states para mejor UX */
.nav-link:hover .bi,
.dropdown-item:hover .bi {
  color: #1e40af !important; /* var(--primary-800) */
  transition: color 0.2s ease;
}

/* Focus states para accesibilidad */
.nav-link:focus .bi,
.btn:focus .bi {
  outline: 2px solid #93c5fd; /* var(--primary-300) */
  outline-offset: 2px;
}

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */

/* En dispositivos móviles, usar colores más contrastados */
@media (max-width: 768px) {
  .navbar-collapse .bi.text-primary {
    color: #1e3a8a !important; /* var(--primary-900) */
  }
  
  .mobile-menu .bi.text-primary {
    color: #1e3a8a !important; /* var(--primary-900) */
  }
  
  .icon-circle-sm {
    width: 1.5rem !important;
    height: 1.5rem !important;
    margin-right: 0.375rem !important;
  }
}

@media (max-width: 480px) {
  .icon-circle-sm {
    width: 1.25rem !important;
    height: 1.25rem !important;
    margin-right: 0.25rem !important;
  }
}

/* ========================================
   CLASES DE UTILIDAD
   ======================================== */

/* Clase para iconos con alto contraste */
.icon-high-contrast {
  color: #1e3a8a !important; /* var(--primary-900) */
}

/* Clase para iconos sobre fondos claros */
.icon-on-light {
  color: #1d4ed8 !important; /* var(--primary-700) */
}

/* Clase para iconos sobre fondos oscuros */
.icon-on-dark {
  color: #dbeafe !important; /* var(--primary-100) */
}

/* Contenedor para iconos con fondo */
.icon-circle-lg {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background-color: #2563eb; /* var(--primary-600) */
  color: white;
}

.icon-circle-lg .bi {
  color: white !important;
  font-size: 1.5rem;
}