/* Compact Menu Styles for Railroad Press Plugin */

/* Make dropdown menus 50% wider - comprehensive targeting */
.main-navigation ul.sub-menu,
.main-navigation .sub-menu,
.main-navigation ul ul,
.main-navigation .menu ul,
.main-navigation .nav-menu ul,
.main-navigation .menu .sub-menu,
.main-navigation .nav-menu .sub-menu,
.main-navigation .menu-item-has-children .sub-menu,
.main-navigation .menu-item-has-children ul {
    min-width: 200px !important;
    width: auto !important;
    max-width: none !important;
}

/* Ensure parent menu items don't constrain dropdown width */
.main-navigation .menu-item-has-children,
.main-navigation .menu-item-has-children > a,
.main-navigation li.menu-item-has-children {
    position: relative !important;
    overflow: visible !important;
}

/* Force dropdowns to extend beyond parent boundaries */
.main-navigation .menu-item-has-children .sub-menu,
.main-navigation .menu-item-has-children ul {
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    z-index: 9999 !important;
    white-space: nowrap !important;
}

/* Position secondary dropdowns to the right to avoid overlap */
.main-navigation .sub-menu .menu-item-has-children .sub-menu,
.main-navigation .sub-menu .menu-item-has-children ul,
.main-navigation ul ul .menu-item-has-children .sub-menu,
.main-navigation ul ul .menu-item-has-children ul {
    position: absolute !important;
    left: 100% !important;
    top: 0 !important;
    z-index: 10000 !important;
}

/* Ensure dropdown items can expand to fill the wider container */
.main-navigation ul.sub-menu li,
.main-navigation .sub-menu li,
.main-navigation ul ul li,
.main-navigation .menu ul li,
.main-navigation .nav-menu ul li,
.main-navigation .menu .sub-menu li,
.main-navigation .nav-menu .sub-menu li,
.main-navigation .menu-item-has-children .sub-menu li,
.main-navigation .menu-item-has-children ul li {
    width: 100% !important;
    min-width: 100% !important;
}

/* Compact railroad status menu styling */
.status-submenu {
    font-size: 0.9em !important;
    padding: 2px 6px !important;
    margin: 1px 0 !important;
    line-height: 1.2 !important;
}

.status-submenu a {
    padding: 3px 8px !important;
    line-height: 1.2 !important;
    display: block !important;
}

/* Right-align dropdown arrows on status menu items */
.status-submenu.menu-item-has-children > a::after {
    float: right !important;
    margin-left: auto !important;
}

.status-submenu.menu-item-has-children > a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* Compact railroad menu styling - reduced padding and spacing */
.compact-railroad {
    font-size: 0.85em !important;
    padding: 1px 4px !important;
    margin: 0 !important;
    line-height: 1.1 !important;
}

.compact-railroad a {
    padding: 2px 6px !important;
    line-height: 1.1 !important;
    display: block !important;
}

/* Reduce spacing for compact railroad submenus */
.status-submenu .compact-railroad {
    border-left: 1px solid transparent;
    margin-left: 8px !important;
    width: calc(100% - 8px) !important;
    box-sizing: border-box !important;
}

.status-submenu .compact-railroad:hover {
    border-left-color: #0073aa;
    background-color: rgba(0, 115, 170, 0.05) !important;
}

/* Make submenu items more compact overall */
.status-submenu .compact-railroad:first-child {
    margin-top: 2px !important;
}

/* Last child should have full width like other items */
.status-submenu .compact-railroad:last-child {
    margin-left: 0 !important;
    width: 100% !important;
}

/* Add thin separators between menu items - full width */
.status-submenu .compact-railroad:not(:last-child) {
    border-bottom: 1px solid #e5e5e5 !important;
    padding-bottom: 2px !important;
    margin-bottom: 1px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Ensure the separator extends full width by removing left margin */
.status-submenu .compact-railroad:not(:last-child) a {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Add separator between status items */
.status-submenu:not(:last-child) {
    border-bottom: 1px solid #d0d0d0 !important;
    margin-bottom: 2px !important;
    padding-bottom: 3px !important;
}

/* Gallery menu styling - apply same compact styling to gallery children */
/* Note: Gallery plugin uses 'status-submenu' for status items and 'railroad-gallery-menu-item' for railroad items */

/* Compact gallery railroad items styling */
.railroad-gallery-menu-item {
    font-size: 0.85em !important;
    padding: 1px 4px !important;
    margin: 0 !important;
    line-height: 1.1 !important;
}

.railroad-gallery-menu-item a {
    padding: 2px 6px !important;
    line-height: 1.1 !important;
    display: block !important;
}

/* Gallery submenu spacing and indentation */
.status-submenu .railroad-gallery-menu-item {
    border-left: 1px solid transparent;
    margin-left: 8px !important;
    width: calc(100% - 8px) !important;
    box-sizing: border-box !important;
}

.status-submenu .railroad-gallery-menu-item:hover {
    border-left-color: #0073aa;
    background-color: rgba(0, 115, 170, 0.05) !important;
}

/* Gallery separators - full width */
.status-submenu .railroad-gallery-menu-item:not(:last-child) {
    border-bottom: 1px solid #e5e5e5 !important;
    padding-bottom: 2px !important;
    margin-bottom: 1px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.status-submenu .railroad-gallery-menu-item:not(:last-child) a {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Gallery first child spacing */
.status-submenu .railroad-gallery-menu-item:first-child {
    margin-top: 2px !important;
}

/* Gallery last child should have full width like other items */
.status-submenu .railroad-gallery-menu-item:last-child {
    margin-left: 0 !important;
    width: 100% !important;
}

/* Operating Sessions Menu Styling */
/* Operating sessions children use compact-session class for specific styling */

/* Fallback: Target all operating-sessions menu items that are children */
.menu-item-object-operating_session.menu-item-type-post_type {
    font-size: 0.85em !important;
    padding: 1px 4px !important;
    margin: 0 !important;
    line-height: 1.1 !important;
}

.menu-item-object-operating_session.menu-item-type-post_type a {
    padding: 2px 6px !important;
    line-height: 1.1 !important;
    display: block !important;
}

/* Fallback: Add separators to all operating-sessions children */
.menu-item-object-operating_session.menu-item-type-post_type:not(:last-child) {
    border-bottom: 1px solid #e5e5e5 !important;
    padding-bottom: 2px !important;
    margin-bottom: 1px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.menu-item-object-operating_session.menu-item-type-post_type:not(:last-child) a {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Compact operating session child items styling */
.compact-session {
    font-size: 0.85em !important;
    padding: 1px 4px !important;
    margin: 0 !important;
    line-height: 1.1 !important;
}

.compact-session a {
    padding: 2px 6px !important;
    line-height: 1.2 !important;
    display: block !important;
    font-size: 14px !important;
}

/* Style the first line (date) to be smaller and lighter - only for dynamically generated items */
.dynamic-session a::first-line {
    font-size: 0.75em !important;
    color: #666 !important;
    font-weight: normal !important;
}


/* Operating session submenu spacing and indentation */
.menu-item-object-operating_session.menu-item-type-post_type_archive .compact-session {
    border-left: 1px solid transparent;
    margin-left: 8px !important;
    width: calc(100% - 8px) !important;
    box-sizing: border-box !important;
}

.menu-item-object-operating_session.menu-item-type-post_type_archive .compact-session:hover {
    border-left-color: #0073aa;
    background-color: rgba(0, 115, 170, 0.05) !important;
}

/* Operating session first child spacing */
.menu-item-object-operating_session.menu-item-type-post_type_archive .compact-session:first-child {
    margin-top: 2px !important;
}

/* Operating session last child should have full width like other items */
.menu-item-object-operating_session.menu-item-type-post_type_archive .compact-session:last-child {
    margin-left: 0 !important;
    width: 100% !important;
}

/* Operating session separators - full width */
.menu-item-object-operating_session.menu-item-type-post_type_archive .compact-session:not(:last-child) {
    border-bottom: 1px solid #e5e5e5 !important;
    padding-bottom: 2px !important;
    margin-bottom: 1px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.menu-item-object-operating_session.menu-item-type-post_type_archive .compact-session:not(:last-child) a {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Mobile Menu Scrollable Styling */
@media (max-width: 768px) {
    /* Make mobile menus scrollable when they get too large */
    .main-navigation ul.menu,
    .main-navigation .nav-menu {
        max-height: 70vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* Ensure submenus are also scrollable */
    .main-navigation ul.sub-menu {
        max-height: 50vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* Add subtle scrollbar styling for better UX */
    .main-navigation ul.menu::-webkit-scrollbar,
    .main-navigation .nav-menu::-webkit-scrollbar,
    .main-navigation ul.sub-menu::-webkit-scrollbar {
        width: 6px !important;
    }
    
    .main-navigation ul.menu::-webkit-scrollbar-track,
    .main-navigation .nav-menu::-webkit-scrollbar-track,
    .main-navigation ul.sub-menu::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.1) !important;
        border-radius: 3px !important;
    }
    
    .main-navigation ul.menu::-webkit-scrollbar-thumb,
    .main-navigation .nav-menu::-webkit-scrollbar-thumb,
    .main-navigation ul.sub-menu::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.3) !important;
        border-radius: 3px !important;
    }
    
    .main-navigation ul.menu::-webkit-scrollbar-thumb:hover,
    .main-navigation .nav-menu::-webkit-scrollbar-thumb:hover,
    .main-navigation ul.sub-menu::-webkit-scrollbar-thumb:hover {
        background: rgba(0, 0, 0, 0.5) !important;
    }
    
    /* Ensure compact menu items maintain their styling on mobile */
    .compact-railroad,
    .compact-session,
    .railroad-gallery-menu-item {
        font-size: 0.8em !important;
        padding: 1px 3px !important;
        line-height: 1.0 !important;
    }
    
    .compact-railroad a,
    .compact-session a,
    .railroad-gallery-menu-item a {
        padding: 2px 4px !important;
        line-height: 1.0 !important;
    }
    
    /* Mobile styling for session date/title format - only for dynamically generated items */
    .dynamic-session a::first-line {
        font-size: 0.7em !important;
        color: #666 !important;
    }
}