/**
 * Estilo "boton CTA" para items del menu marcados con clase CSS `om-menu-cta`.
 *
 * Funciona en cualquier menu WordPress / Elementor sin tocar el theme.
 * Aplicar la clase desde Apariencia -> Menus -> [item] -> Clases CSS.
 */

li.om-menu-cta > a,
li.menu-item.om-menu-cta > a,
.elementor-nav-menu li.om-menu-cta > a,
.elementor-nav-menu li.om-menu-cta > a.elementor-item {
    background: linear-gradient(135deg, #C33FBC 0%, #7835E8 100%) !important;
    color: #fff !important;
    padding: 9px 22px !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: 0 3px 10px rgba(120, 53, 232, 0.28) !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    line-height: 1.2 !important;
    border: none !important;
}

li.om-menu-cta > a:hover,
li.menu-item.om-menu-cta > a:hover,
.elementor-nav-menu li.om-menu-cta > a:hover,
.elementor-nav-menu li.om-menu-cta > a.elementor-item:hover,
li.om-menu-cta > a:focus,
.elementor-nav-menu li.om-menu-cta > a.elementor-item:focus {
    background: linear-gradient(135deg, #7835E8 0%, #5C1F9E 100%) !important;
    color: #fff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 5px 14px rgba(120, 53, 232, 0.4) !important;
}

/* Quitar el subrayado/borde inferior que algunos themes ponen al hover */
li.om-menu-cta > a::after,
li.om-menu-cta > a::before {
    display: none !important;
}
