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

/* ==========================================================================
   STYLE #1 — PLATFORM NAVIGATION 
   ========================================================================== */

/* Main menu container */
.main-navigation.navigation-style-style-1 .nav-menu {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    max-width: 100%;
    list-style: none;
    padding: 10px 0 !important; /* Breathing room */
    align-items: center;
    justify-content: flex-start;
}

/* Menu item positioning */
.main-navigation.navigation-style-style-1 .nav-menu > li {
    position: relative;
}

/* Menu items WITH dropdowns - match submenu width */
.main-navigation.navigation-style-style-1 .nav-menu > li.menu-item-has-children > a {
    text-decoration: none;
    font-weight: 300;
    display: block;
    padding: 15px 20px !important;
    margin: 0 5px !important;
    min-width: 220px !important; /* Match submenu */
    box-sizing: border-box !important;
    text-align: left !important;
}

/* Menu items WITHOUT dropdowns - normal width */
.main-navigation.navigation-style-style-1 .nav-menu > li:not(.menu-item-has-children) > a {
    text-decoration: none;
    font-weight: 300;
    display: block;
    padding: 15px 20px !important;
    margin: 0 5px !important;
}

/* ==========================================================================
   STYLE 1 - Submenu Basic Structure (NON-CUSTOMIZABLE PARTS ONLY)
   ========================================================================== */

/* Basic submenu structure - PHP will handle colors, sizes, etc. */
.main-navigation.navigation-style-style-1 .nav-menu .sub-menu {
    list-style: none !important;
    padding: 0;
    margin: 0;
    /* REMOVED: All customizable properties - let PHP handle:
       - display/positioning (PHP handles this)
       - background-color (PHP handles this)
       - z-index (PHP handles this)
    */
}


/* Basic submenu link structure */
.main-navigation.navigation-style-style-1 .nav-menu .sub-menu a {
    text-decoration: none;
    display: block;
    list-style: none !important;
    /* REMOVED: All customizable properties - let PHP handle:
       - color (PHP handles this)
       - padding (PHP handles this)
       - background (PHP handles this)
       - width (PHP handles this)
    */
}

/* Submenu arrow indicator - Keep this visual element */
.main-navigation.navigation-style-style-1 .nav-menu > li.menu-item-has-children > a:after {
    content: " ▼";
    font-size: 0.6em;
    margin-left: 0.4em;
}

/* ==========================================================================
   STYLE 1 - SUBMENU SPACING IMPROVEMENTS
   ========================================================================== */

/* Add spacing between submenu items */
.main-navigation.navigation-style-style-1 .nav-menu .sub-menu li {
    margin-bottom: 2px !important; 
}

/* Improve submenu link padding for better touch targets */
.main-navigation.navigation-style-style-1 .nav-menu .sub-menu a {
    text-decoration: none;
    display: block;
    list-style: none !important;
    padding: 15px 20px !important; 
    margin: 3px 8px !important; 
}

/* Improve submenu container padding */
.main-navigation.navigation-style-style-1 .nav-menu .sub-menu {
    list-style: none !important;
    padding: 12px 0 !important; 
    margin: 0;
   
}

/* ==========================================================
   STYLE 1 - MIGRATION-SAFE AUTO SUBMENU WIDTH
   ========================================================== */

/* Parent menu item: natural width */
.main-navigation.navigation-style-style-1 .nav-menu > li.menu-item-has-children > a {
    min-width: 0 !important;
    width: auto !important;        
    margin: 0 !important;          
    padding: 15px 18px !important; 
    white-space: nowrap;
    box-sizing: border-box;
}

/* Submenu: natural width based on longest submenu text */
.main-navigation.navigation-style-style-1 .nav-menu > li.menu-item-has-children > .sub-menu {
    width: max-content !important;
    min-width: 100% !important;   
    max-width: 90vw;
}

/* Clean submenu spacing */
.main-navigation.navigation-style-style-1 .nav-menu .sub-menu a {
    white-space: nowrap;
    margin: 0 !important;
    padding: 12px 18px !important;
}