/* ==================================================
   TRACTOREX - HEADER Y MENÚ
   ==================================================
   CSS personalizado del Header Global de Divi.
   Si Divi/ WooCommerce presenta conflictos,
   mantener este bloque en Opciones del Tema.
   ================================================== */


/* Ajustes básicos del menú móvil */
.et_mobile_menu {
  padding: 10px 0 15px 0 !important; /* espacio arriba y abajo */
  border-width: 2px;
  border-radius: 5px;
}

/* Espaciado de enlaces */
/* Tablet */
@media (min-width: 768px) and (max-width: 980px){

    .et_mobile_menu a{
        padding: 35px 28px !important;
    }

}

/* Móvil */
@media (max-width:767px){

    .et_mobile_menu a{
        padding: 20px 28px !important;
    }

}

/* Quitar padding innecesario en listas */
.nav li li {
  padding: 0 !important;
}

/* Ajuste leve en móvil */
@media screen and (max-width: 980px) {
  .et_pb_menu__wrap {
    margin-top: -8px;
  }

  .et_mobile_menu {
    margin-top: 20px;
    padding-bottom: 20px !important; /* aire debajo del último enlace */

    /* Forzar que el menú móvil ocupe todo el ancho de la pantalla */
    position: fixed !important;
    top: 100px !important; /* ajusta este valor según la altura real de tu header */
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    border-radius: 0 !important; /* opcional: quita el radio si va de borde a borde */
  }
}

/* Separadores menú móvil */
.et_mobile_menu li:not(:last-child) a,
.nav li li:not(:last-child),
.et-menu-nav li.mega-menu > ul > li > a:first-child,
.et-menu-nav li.mega-menu ul li ul li:not(:last-child) a {
  border-bottom: 1px solid rgba(241,243,244,0.3);
}

/* Icono hamburguesa → X */
.mobile_nav.opened .mobile_menu_bar:before {
  font-family: ETmodules;
  content: '\4d';
  color: #7EBF5C;
}

/* ==================================================
   TRACTOREX - ESTILO DEL MENÚ
   ================================================== */

/* Enlaces del menú */
.et_pb_menu .et-menu > li > a {
    position: relative;
    transition: color 0.25s ease;
}

/* Hover de los enlaces */
.et_pb_menu .et-menu > li > a:hover {
    color: #7EBF5C !important;
}


/* ==================================================
   CONTACTO - DETALLE VERDE
   ================================================== */

/* Línea verde bajo Contacto */
.et_pb_menu .menu-item-70 > a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -5px;
    height: 2px;
    background-color: #7EBF5C;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.25s ease;
}

/* Contacto no cambia a verde como los demás enlaces */
.et_pb_menu .menu-item-70 > a:hover {
    color: #FFFFFF !important;
}

/* La línea aparece al pasar el cursor */
.et_pb_menu .menu-item-70 > a:hover::after {
    transform: scaleX(1);
}
 
/* ==================================================
   TRACTOREX - TRACTORES ACTIVO EN LA TIENDA
   ================================================== */

/* Página Tienda de WooCommerce */
body.woocommerce-shop .et_pb_menu .et_pb_menu_page_id-36 > a {
    color: #FFFFFF !important;
}

/* Línea verde permanente bajo TRACTORES */
body.woocommerce-shop .et_pb_menu .et_pb_menu_page_id-36 > a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -5px;
    height: 2px;
    background-color: #7EBF5C;
    transform: scaleX(1);
    transform-origin: center;
}