/*
 Theme Name:   Bootscore Child
 Description:  Bootscore Child Theme
 Author:       Bootscore
 Author URI:   https://bootscore.me
 Template:     bootscore
 Version:      6.0.0
 Requires at least: 5.0
 Tested up to: 6.6
 Requires PHP: 7.4
 License: MIT License
 License URI: https://github.com/bootscore/bootscore-child/blob/main/LICENSE
 Text Domain:  bootscore
*/

/* 
All style editing is done via /assets/scss/_bootscore_custom.scss
*/

body{
	font-family: 'Montserrat';
}

.text-principal{
	color: #3776ff;
}

.text-secundario{
	color: #ffd000;
}

.bg-principal{
	background: #3776ff;
}

.bg-secundario{
	background: #ffd000;
}

.bg-whatsapp{
	background: #25d366;
}

.nav-item-1225 {
	border-radius: 8px;
}

.nav-item-1225 a{
	color: #fff !important;
}

.btn-principal,
.nav-item-1225 {
    background: #3776ff;
    color: #fff;
    font-weight: 500;
}

.btn-principal:hover,
.nav-item-1225:hover{
	background: #ffd000;
}

.card-zoom {
    transition: transform 0.4s ease-in-out;
}

.nav-link{
	font-size: 18px;
	line-height: 22px;
	margin: 0 15px;
}

/*.nav-link i{
	font-size: 14px;
	line-height: 18px;
}*/

/* Estilos personalizados para el logo y el botón */
.navbar-brand img {
	/*height: 80px;*/ /* Ajusta la altura del logo */
}

/* Estilo para el Mega Menú (ajustar ancho y fondo) */
.mega-menu {
	width: 800px; /* Ajusta el ancho deseado para el mega menú */
	padding: 20px;
}

/* Ajustes de color para los enlaces de navegación */
.navbar-nav .nav-link {
	color: #333; /* Color de texto oscuro para los enlaces */
	font-weight: 500;
}

/* Color de los enlaces del mega menú */
.mega-menu a {
	color: #555;
	text-decoration: none;
}

.mega-menu a:hover {
	color: #e91e63;
}

.mega-menu h6 {
	color: #e91e63; /* Color de encabezado en el mega menú */
	margin-bottom: 10px;
	font-weight: bold;
}

.custom-card {
    border-radius: 15px; /* Bordes redondeados */
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Sombra ligera */
    background-color: #fff; /* Fondo blanco */
}

.icon-circle {
    width: 50px;
    height: 50px;
    background-color: #3776ff; /* Color azul de Bootstrap */
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 20px;
}

.card-title-custom {
    font-weight: 700; /* Texto en negrita */
    font-size: 1.4rem;
    margin-bottom: 15px;
}

.card-text-custom {
    color: #555;
    line-height: 1.5;
}

/* Estilo para el contenedor de cada logo */
.logo-item {
    padding: 15px; /* Espacio interno para que el logo no toque el borde */
    /* Altura fija para que todos los elementos tengan el mismo tamaño */
    height: 80px; 
    display: flex; /* Para centrar la imagen */
    align-items: center;
    justify-content: center;
    opacity: 0.7; /* Da un tono sutil (opcional) */
    transition: opacity 0.3s ease;
}

/* Efecto hover: el logo se vuelve 100% visible */
.logo-item:hover {
    opacity: 1;
}

/* Asegura que la imagen dentro del contenedor no sea más alta que su padre */
.logo-item img {
    max-height: 100%; 
    width: auto; /* Mantiene la proporción */
    filter: grayscale(100%); /* Hace los logos en blanco y negro (opcional, muy profesional) */
    transition: filter 0.3s ease;
}

/* Efecto hover: quita el filtro de blanco y negro */
.logo-item:hover img {
    filter: grayscale(0%);
}

/* Media Query para ajustar la altura en móviles (opcional) */
@media (max-width: 768px) {
    .logo-item {
        height: 60px;
    }
}