/* --- BOTÓN MENÚ VERDE (ITEM 686) --- */

#menu-item-686 a {
    background-color: #4E803F !important; /* TU NUEVO COLOR VERDE */
    color: #ffffff !important; /* Texto BLANCO para buen contraste */
    
    /* Mantenemos el estilo "discreto" */
    padding: -30px 30px !important; 
    border-radius: 50px !important; 
    font-weight: 600 !important;
    font-size: 0.85rem !important; 
    text-transform: uppercase;
    margin-top: 10px; 
		margin-bottom: 10px;
    
    /* Sombra suave verdosa */
    box-shadow: 0 2px 5px rgba(78, 128, 63, 0.3); 
    transition: all 0.3s ease;
}

/* Hover (Al pasar el mouse) */
#menu-item-686 a:hover {
    background-color: #3C6330 !important; /* Un tono ligeramente más oscuro */
    transform: translateY(-1px); 
    box-shadow: 0 4px 10px rgba(78, 128, 63, 0.4);
}

/* Ajuste móvil */
@media (max-width: 768px) {
    #menu-item-686 a {
        background-color: transparent !important;
        padding: 0 !important;
        box-shadow: none;
        color: #4E803F !important; /* En móvil solo el texto es verde */
    }
}

/* --- ESTILO SUBMENÚS HEADER (FONDO OSCURO) --- */

/* 1. Fondo del contenedor del submenú */
/* Afecta tanto al menú de escritorio como a los dropdowns */
.elementor-nav-menu .sub-menu,
.elementor-nav-menu--dropdown,
ul.sub-menu {
    background-color: #151515 !important; /* Tu color base */
    border: none !important; /* Quitamos bordes blancos si los hubiera */
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important; /* Sombra oscura */
    padding: 10px 0 !important; /* Un poco de aire */
    border-radius: 0 0 8px 8px !important; /* Bordes inferiores redondeados */
}

/* 2. Los Enlaces dentro del submenú */
.elementor-nav-menu .sub-menu a {
    color: #eeeeee !important; /* Texto casi blanco */
    background-color: transparent !important;
    padding: 12px 20px !important; /* Espaciado cómodo */
    transition: all 0.3s ease;
}

/* 3. Efecto Hover (Al pasar el mouse por una opción del submenú) */
.elementor-nav-menu .sub-menu a:hover,
.elementor-nav-menu .sub-menu li.current-menu-item a {
    background-color: #222222 !important; /* Un tono apenas más claro para destacar */
    color: #FFB300 !important; /* Tu color Naranja de acento */
    padding-left: 25px !important; /* Pequeño desplazamiento a la derecha */
}

/* 4. Triangulito decorativo (si tu tema lo usa) */
.elementor-nav-menu--main .elementor-nav-menu ul:before {
    background-color: #151515 !important;
}