/*
 Theme Name:   Divi 5 Child Theme
 Theme URI:    https://elegantthemes.com
 Description:  Tema hijo optimizado y preparado para desarrollo a medida en Divi 5.
 Author:       Indexa Digital
 Template:     Divi
 Version:      1.0.0
*/

/* ==========================================================================
   Tus estilos personalizados (v0.dev, Tailwind adaptado, etc.) van aquí abajo
   ========================================================================== */


/* ========================================
   TÍTULOS ESTILO OVER MOTORS
   Clase: titulo-over
======================================== */

/*
.titulo-over{
    text-align: center;
}

.titulo-over h1,
.titulo-over h2,
.titulo-over h3,
.titulo-over .et_pb_module_header{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.titulo-over h1::before,
.titulo-over h2::before,
.titulo-over h3::before,
.titulo-over .et_pb_module_header::before{
    content: "";
    width: 50px;
    height: 75px;
    flex-shrink: 0;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50.294' height='75.125' viewBox='0 0 50.294 75.125'%3E%3Cg transform='translate(-809.785 -213.595)'%3E%3Crect width='12.443' height='68.438' transform='translate(850.012 213.595) rotate(36)' fill='%23fd4a4a'/%3E%3Crect width='12.443' height='29.034' transform='translate(843.442 257.917) rotate(36)' fill='%23c9c9c9'/%3E%3C/g%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
*/

/* Ajustes móviles */
/*
@media (max-width: 767px){

    .titulo-over h1::before,
    .titulo-over h2::before,
    .titulo-over h3::before,
    .titulo-over .et_pb_module_header::before{
        width: 35px;
        height: 50px;
    }

    .titulo-over h1,
    .titulo-over h2,
    .titulo-over h3,
    .titulo-over .et_pb_module_header{
        gap: 10px;
    }

}
*/

/* Base */

.titulo-over{
    text-align:center;
}

.titulo-over h1,
.titulo-over h2,
.titulo-over h3{
    display:inline-flex;
    align-items:center;
    gap:15px;
}

.titulo-over h1::before,
.titulo-over h2::before,
.titulo-over h3::before{
    content:"";
    
    width:var(--icon-width, 40px);
    height:var(--icon-height, 60px);

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50.294' height='75.125' viewBox='0 0 50.294 75.125'%3E%3Cg transform='translate(-809.785 -213.595)'%3E%3Crect width='12.443' height='68.438' transform='translate(850.012 213.595) rotate(36)' fill='%23fd4a4a'/%3E%3Crect width='12.443' height='29.034' transform='translate(843.442 257.917) rotate(36)' fill='%23c9c9c9'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
}

/* Pequeño */
.titulo-over-sm{
    --icon-width:25px;
    --icon-height:35px;
}

/* Mediano */
.titulo-over-md{
    --icon-width:40px;
    --icon-height:60px;
}

/* Grande */
.titulo-over-lg{
    --icon-width:60px;
    --icon-height:90px;
}

/* ==========================
   CONTENEDOR FORMULARIO
========================== */

.wpcf7{
    max-width: 900px;
    margin: 0 auto;
}

/* ==========================
   FILAS Y COLUMNAS
========================== */

.cf7-row{
    display:flex;
    gap:20px;
    margin-bottom:10px;
}

.cf7-col{
    flex:1;
}

/* ==========================
   CAMPOS
========================== */

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"]{
    width:100%;
    height:46px;
    padding:0 18px;
    border:1px solid #d8d8d8;
    border-radius:6px;
    font-size:16px;
    background:#fff;
    box-sizing:border-box;
    transition:all .3s ease;
}

/* Hover */

.wpcf7 input[type="text"]:hover,
.wpcf7 input[type="email"]:hover,
.wpcf7 input[type="tel"]:hover{
    border-color:#b5b5b5;
}

/* Focus */

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus{
    border-color:#1f6eb3;
    outline:none;
}

/* ==========================
   ESPACIADO
========================== */

.wpcf7 p{
    margin-bottom:0px !important;
}

.wpcf7-form-control-wrap{
    display:block;
}

/* ==========================
   TITULO CHECKBOX
========================== */

.cf7-titulo{
    font-size:22px;
    font-weight:700;
    margin-top:10px;
    margin-bottom:20px;
    color:#1f2d3d;
}

/* ==========================
   CHECKBOX
========================== */

.cf7-radio .wpcf7-list-item{
    margin-right:50px;
    margin-left:0;
}

.cf7-radio label{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:18px;
    font-weight:500;
}

.cf7-radio input[type="checkbox"]{
    width:20px;
    height:20px;
}

/* ==========================
   BOTÓN
========================== */

.wpcf7-submit{
    background: #de3333 !important;
    color:#fff !important;
    border:none !important;
    border-radius:6px !important;
    padding:15px 35px !important;
    font-size:20px !important;
    font-weight:600 !important;
    cursor:pointer;
    transition:.3s;
}
.cf7-radio {
    padding-bottom: 10px;
}

.wpcf7-submit:hover{
    opacity:.9;
}

/* ==========================
   MÓVIL
========================== */

@media (max-width:767px){

    .cf7-row{
        flex-direction:column;
        gap:15px;
        margin-bottom:15px;
    }

    .cf7-titulo{
        font-size:18px;
        margin-bottom:15px;
    }

    .cf7-radio .wpcf7-list-item{
        display:block;
        margin-right:0;
        margin-bottom:15px;
    }

    .wpcf7-submit{
        width:100%;
        padding:16px !important;
    }
}




.heroSwiper .swiper-button-prev,
.heroSwiper .swiper-button-next{
    width:50px;
    height:50px;
    background:#fff;
    border-radius:10px;
    color:#000;
    box-shadow:0 8px 20px rgba(0,0,0,.12);
	transition:.3s;
}

.heroSwiper .swiper-button-prev:hover,
.heroSwiper .swiper-button-next:hover{
    transform:translateY(-2px);
}

.heroSwiper .swiper-button-next svg,
.heroSwiper .swiper-button-prev svg{
    width:16px;
    height:16px;
}

.heroSwiper .swiper-pagination-bullet{
    background:#ffffff;
    opacity:.5;
}

.heroSwiper .swiper-pagination-bullet-active{
    background:#ffffff;
    opacity:1;
}

/*Estilos Menu footer*/
.menu-footer ul{
    list-style:none;
    margin:0;
    padding:0;
}

.menu-footer li{
    padding:9px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.menu-footer li:last-child{
    border-bottom:none;
}

.menu-footer a{
    color:#eeeeee;
    text-decoration:none;
    font-size:18px;
    font-weight:500;
    line-height:1.4;
    transition:.25s ease;
}

.menu-footer a:hover{
    color:#fd4a4a;
}

@media(max-width:767px){
    .menu-footer li{
        margin-bottom:8px;
    }
    .menu-footer a{
        font-size:16px;
    }
}


.footer-contacto{
    color:#eeeeee;
}

.footer-item{
    display:flex;
    align-items:flex-start;
    gap:15px;
    padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,.08);

}

.footer-item:last-child{
    border-bottom:none;
}

.footer-item i{
    color:#fd4a4a;
    font-size:20px;
    min-width:22px;
    margin-top:2px;
}

.footer-item span,
.footer-item a{
    color:#eeeeee;
    text-decoration:none;
    font-size:17px;
    line-height:1.6;
}

.footer-item a:hover{
    color:#fd4a4a;
}

/* Menu en Movil usando clase para fila
@media (max-width:980px){
    .header-overmotors{
        display:flex !important;
        align-items:center !important;
    }
    .header-overmotors .et_pb_column{
        width:auto !important;
        margin-bottom:0 !important;
    }
    .header-overmotors .et_pb_module{
        margin-bottom:0 !important;
    }
}
*/
@media only screen and (max-width: 980px) {
    .header-overmotors {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important; /* Alinea los elementos verticalmente al centro */
        justify-content: space-between !important; /* Distribuye el espacio entre las columnas */
    }

    /* Ajusta el ancho de las columnas en móvil para mantener la proporción */
    .header-overmotors .et_pb_column_1_4 {
        width: 25% !important;
    }
    .header-overmotors .et_pb_column_1_2 {
        width: 50% !important;
    }
}

/*Extendiendo desplique menu hamburguesa en MOVIL
@media (max-width:980px){
    .et_mobile_menu{
        width:280px !important;
        right:-15px !important;
        left:auto !important;
        white-space:nowrap;
    }

    .et_mobile_menu li a{
        white-space:nowrap !important;
        overflow:visible !important;
        text-overflow:unset !important;
        padding:14px 20px !important;
        font-size:18px !important;
    }

}
*/
@media only screen and (max-width: 980px) {
    /* --- CÓDIGO NUEVO PARA CORREGIR EL DESPLEGABLE --- */

    /* 1. Permitimos que la columna central no colapse el contenido flotante */
    .header-overmotors > .et_pb_column:nth-child(2) {
        position: relative !important;
    }

    /* 2. Forzamos al contenedor del menú móvil a tener un ancho independiente */
    .header-overmotors .et_mobile_menu {
        width: 280px !important; /* Ancho fijo para que entren bien los textos */
        max-width: 85vw !important; /* Evita que se salga de la pantalla en móviles muy chicos */
        position: absolute !important;
        
        /* Centrado o alineación */
        left: 50% !important;
        transform: translateX(-50%) !important; /* Lo centra perfectamente respecto a su columna */
        
        z-index: 9999 !important; /* Se asegura de quedar por encima de los banners y el carrito */
        box-shadow: 0px 5px 15px rgba(0,0,0,0.15) !important; /* Le da un sombreado sutil para separarlo del fondo */
    }

    /* 3. Corrección de espaciados internos de los enlaces */
    .header-overmotors .et_mobile_menu li a {
        width: 100% !important;
        white-space: nowrap !important; /* Evita que el texto de una opción se rompa en dos líneas */
        padding: 12px 20px !important; /* Espaciado cómodo para el dedo */
    }
}


/* Fuerza el cierre del menú cuando nuestro script detecta un clic fuera */
.header-overmotors .et_mobile_menu.menu-cerrado-fuerza {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/*Estilo al menu en movil*/
@media (max-width: 980px) {
	.header-overmotors .et_mobile_menu {
			border-radius: 10px;
	 
	}
    .et_pb_menu .et_mobile_menu {
        border-top: 0px;
        /*padding: 0 0 0 0;*/
    }
}

/* fototer whatsapp*/
.whatsapp-fijo{

    position:fixed;

    right:20px;

    bottom:20px;

    z-index:9999;

    display:flex;

    align-items:center;

    gap:12px;

    padding:7px 11px;

    border-radius:50px;

    background:#25D366;

    color:#fff !important;

    text-decoration:none;

    font-size:16px;

    font-weight:400;

    box-shadow:0 10px 25px rgba(0,0,0,.15);

    transition:.3s;

}

.whatsapp-fijo i{

    font-size:25px;

}

.whatsapp-fijo:hover{

    transform:translateY(-3px);

}
@media(max-width:767px){

    .whatsapp-fijo{

        right:15px;

        bottom:15px;

        padding:12px 18px;

        font-size:15px;

    }

}