/*
 * Beyond 'Biz' Experience - Style 2 Styles
 * 
 * @package Beyond_Biz_Experience
 * @author Susan Robichaud
 * @copyright Copyright © 2024 Susan Robichaud International
 * @version 1.0.0
 */

/* ==========================================================================
   STYLE #2 — PLATFORM NAVIGATION (Layout Only)
   ========================================================================== */

.main-navigation.navigation-style-style-2 {
    display: flex;
    align-items: center;
    height: 64px; /* Adjust as needed to match your logo/CTA */
    background: transparent !important;
    width: 100%;
    box-sizing: border-box;
    justify-content: space-between;
}

.main-navigation.navigation-style-style-2 .nav-menu {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin: 0;
    padding: 0;
    background: transparent !important;
    list-style: none;
}

.main-navigation.navigation-style-style-2 .nav-menu > li {
    display: flex;
    align-items: center;
    height: 100%;
    position: relative;
}

.main-navigation.navigation-style-style-2 .nav-menu > li > a {
    font-weight: 300;
    transition: background 0.2s, color 0.2s;
    text-decoration: none;
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 1.25em; /* Adjust for spacing */
    line-height: 1.2;
    box-sizing: border-box;
    font-size: 20px !important; 
}

.main-navigation.navigation-style-style-2 .nav-menu > li > a:focus {
    outline: 2px solid;
}

.main-navigation.navigation-style-style-2 .nav-menu li ul {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    min-width: 220px;
    border-radius: 0 0 6px 6px;
    z-index: 9999;
    padding: 0.5em 0;
    background: #393939;
    list-style: none !important; /* Add this line */
}


.main-navigation.navigation-style-style-2 .nav-menu li ul li {
    list-style: none !important;
    list-style-type: none !important;
    margin: 0;
    padding: 0;
}






/* ========================
   STYLE 2 - SUBMENU STYLES
   ======================== */

.main-navigation.navigation-style-style-2 .nav-menu li ul {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    min-width: 220px;
    border-radius: 0 0 6px 6px;
    z-index: 9999;
    padding: 0.5em 0;
    background: #393939;
}

.main-navigation.navigation-style-style-2 .nav-menu li:hover > ul,
.main-navigation.navigation-style-style-2 .nav-menu li:focus-within > ul {
    display: block;
}

.main-navigation.navigation-style-style-2 .nav-menu li ul li a {
    padding: 0.5em 1.5em;
    transition: background 0.2s, color 0.2s;
    display: block;
}

.main-navigation.navigation-style-style-2 .nav-menu li ul li a:focus {
    outline: 2px solid;
}

/* Submenu arrow indicator */
.main-navigation.navigation-style-style-2 .nav-menu > li.menu-item-has-children > a:after {
    content: " ▼";
    font-size: 0.7em;
    margin-left: 0.3em;
}

.main-navigation.navigation-style-style-2 .menu-cta a,
.main-navigation.navigation-style-style-2 .menu-cta button {
    display: flex;
    align-items: center;
    justify-content: center; 
    height: 48px; 
    padding: 1.5em 1.5em;
    border-radius: 6px;
    font-weight: 300;
    letter-spacing: 0.5px;
    border: none;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
    text-decoration: none;
    margin-right: 50px;
}