/* Fixes for custom-header-links mobile positioning issues */

/* Mobile devices (<= 576px) */
@media (max-width: 576px) {
    .custom-header-links {
        position: relative !important;
        z-index: 10 !important;
        background: transparent !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .custom-header-links .nav.item {
        display: block !important;
        margin-bottom: 8px !important;
        width: 100% !important;
    }
    
    .custom-header-links .nav.item a {
        display: block !important;
        padding: 8px 12px !important;
        text-align: center !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        margin: 0 auto !important;
        max-width: 200px !important;
    }
}

/* Small tablets (577px - 605px) */
@media (min-width: 577px) and (max-width: 605px) {
    .custom-header-links {
        position: relative !important;
        z-index: 10 !important;
        background: transparent !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .custom-header-links .nav.item {
        display: block !important;
        margin-bottom: 12px !important;
        width: 100% !important;
    }
    
    .custom-header-links .nav.item a {
        display: block !important;
        padding: 10px 16px !important;
        text-align: center !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        margin: 0 auto !important;
        max-width: 250px !important;
    }
}

/* Medium tablets (606px - 675px) */
@media (min-width: 606px) and (max-width: 675px) {
    .custom-header-links {
        position: relative !important;
        z-index: 10 !important;
        background: transparent !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .custom-header-links .nav.item {
        display: block !important;
        margin-bottom: 12px !important;
        width: 100% !important;
    }
    
    .custom-header-links .nav.item a {
        display: block !important;
        padding: 10px 16px !important;
        text-align: center !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        margin: 0 auto !important;
        max-width: 250px !important;
    }
}

/* Large tablets (676px - 768px) */
@media (min-width: 676px) and (max-width: 768px) {
    .custom-header-links {
        position: relative !important;
        z-index: 10 !important;
        background: transparent !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .custom-header-links .nav.item {
        display: block !important;
        margin-bottom: 12px !important;
        width: 100% !important;
    }
    
    .custom-header-links .nav.item a {
        display: block !important;
        padding: 10px 16px !important;
        text-align: center !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        margin: 0 auto !important;
        max-width: 250px !important;
    }
}

/* Medium tablets (769px - 992px) */
@media (min-width: 769px) and (max-width: 992px) {
    .custom-header-links {
        position: relative !important;
        z-index: 10 !important;
        background: transparent !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .custom-header-links .nav.item {
        display: block !important;
        margin-bottom: 12px !important;
        width: 100% !important;
    }
    
    .custom-header-links .nav.item a {
        display: block !important;
        padding: 10px 16px !important;
        text-align: center !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        margin: 0 auto !important;
        max-width: 250px !important;
    }
}
