/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
/* =========================
   MENÚ PRINCIPAL ESTILO OFI-RIVAS
   ========================= */

/* CONTENEDOR PRINCIPAL */
.menu-principal {
    background-color: #000000 !important;
    font-family: 'Rubik', sans-serif;
}

/* NAV PRINCIPAL (DESKTOP) */
.menu-principal nav.elementor-nav--main {
    background-color: #000000;
}

/* UL principal horizontal */
.menu-principal nav.elementor-nav--main > ul.elementor-nav {
    display: flex;
    align-items: center;
    gap: 5px;
    list-style: none;
    margin: 0;
    padding: 0 10px;
}

/* LI principal */
.menu-principal nav.elementor-nav--main > ul.elementor-nav > li {
    position: relative;
}

/* ENLACES NIVEL 1 */
.menu-principal nav.elementor-nav--main > ul.elementor-nav > li > a.elementor-item {
    color: #ffffff !important;
    font-weight: 500;
    font-size: 15px;
    padding: 18px 20px !important;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

/* Hover / activo */
.menu-principal nav.elementor-nav--main > ul.elementor-nav > li:hover > a.elementor-item,
.menu-principal nav.elementor-nav--main > ul.elementor-nav > li.current-menu-item > a.elementor-item {
    color: #ff0040 !important; /* rojo parecido al de la captura */
}

/* Icono caret */
.menu-principal .sub-arrow {
    font-size: 12px;
    margin-left: 4px;
}

/* =========================
   SUBMENÚS (DESKTOP)
   ========================= */

/* Ocultar submenús por defecto (solo en el nav principal) */
.menu-principal nav.elementor-nav--main ul.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    display: none;              /* 👈 IMPORTANTE: oculto */
    z-index: 9999;
    background-color: #000000;
    padding: 10px 0;
    min-width: 260px;
    list-style: none;
    margin: 0;
    box-shadow: 0 10px 20px rgba(0,0,0,0.4);
}

/* Mostrar submenú al pasar el ratón */
.menu-principal nav.elementor-nav--main li.menu-item-has-children:hover > ul.sub-menu {
    display: block;
}

/* Submenús anidados (nivel 3, etc.) a la derecha */
.menu-principal nav.elementor-nav--main ul.sub-menu ul.sub-menu {
    top: 0;
    left: 100%;
}

/* Items del submenú */
.menu-principal nav.elementor-nav--main ul.sub-menu li {
    position: relative;
}

/* Enlaces del submenú */
.menu-principal nav.elementor-nav--main ul.sub-menu a.elementor-sub-item {
    display: block;
    color: #ffffff !important;
    font-size: 14px;
    padding: 8px 18px !important;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    white-space: nowrap;
}

/* Hover en submenú */
.menu-principal nav.elementor-nav--main ul.sub-menu a.elementor-sub-item:hover {
    background-color: rgba(255,255,255,0.07);
    color: #ff0040 !important;
}

/* Quitar viñetas en todos los niveles del nav principal */
.menu-principal nav.elementor-nav--main ul,
.menu-principal nav.elementor-nav--main li {
    list-style: none;
}

/* =========================
   MENÚ MÓVIL
   ========================= */

/* Botón hamburguesa */
.menu-principal .elementor-menu-toggle {
    color: #ffffff !important;
    border-radius: 0;
}

/* Contenedor desplegable móvil (el segundo <nav>) */
.menu-principal nav.elementor-nav__container.elementor-nav--dropdown {
    background-color: #000000 !important;
}

/* Links en menú móvil */
.menu-principal nav.elementor-nav__container.elementor-nav--dropdown a {
    color: #ffffff !important;
    padding: 12px 20px !important;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* Hover móvil */
.menu-principal nav.elementor-nav__container.elementor-nav--dropdown a:hover {
    color: #ff0040 !important;
    background-color: rgba(255,255,255,0.08);
}