/* ==========================================
   GLOBAL STICKY HEADER SETTINGS (Mobile & Tablet ONLY)
   ========================================== */
@media only screen and (max-width: 1024px) {
    div[class*="mobile-header"],
    div[class*="zpmenu-mobile"],
    .zpmobile-header {
        position: fixed !important; 
        top: 0 !important;          
        left: 0 !important;         
        width: 100% !important;     
        z-index: 9999 !important;
        display: flex !important;
        align-items: center !important;
    }

    body {
        padding-top: 140px !important; 
    }
}

@media only screen and (max-width: 480px) {
    body {
        padding-top: 120px !important;
    }
}

/* ==========================================
   1. TABLET LAYOUT (481px to 1024px)
   ========================================== */
@media only screen and (min-width: 481px) and (max-width: 1024px) {
    div[class*="mobile-header"],
    div[class*="zpmenu-mobile"],
    .zpmobile-header {
        min-height: 140px !important; 
        max-height: 140px !important;
        box-sizing: border-box !important;
        padding-left: 20px !important;
        padding-right: 20px !important; 
    }

    /* CENTER LOGO FOR TABLETS */
    div[class*="mobile-header"] img,
    div[class*="zpmenu-mobile"] img,
    [class*="logoArea"] img {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important; 
        width: 150px !important; 
        max-width: 150px !important; 
        height: auto !important;          
        object-fit: contain !important;   
        z-index: 10 !important;
        margin: 0 !important;
    }

    /* PUSH HAMBURGER LEFT ON TABLETS */
    [class*="zpmenu-mobile-container"],
    [class*="menu-icon-wrap"],
    [class*="zpmenu-mobile-icon"],
    [class*="mobile-menu-icon"],
    div[class*="mobile-header"] i,
    div[class*="zpmenu-mobile"] i,
    .zpmobile-header svg {
        position: absolute !important;
        right: 120px !important;   
        left: auto !important;     
        top: 50% !important;
        transform: translateY(-50%) !important; 
        z-index: 20 !important;
        margin: 0 !important;
        display: inline-block !important;
    }
}

/* ==========================================
   2. MOBILE LAYOUT (480px and below)
   ========================================== */
@media only screen and (max-width: 480px) {
    div[class*="mobile-header"],
    div[class*="zpmenu-mobile"],
    .zpmobile-header {
        min-height: 120px !important; 
        max-height: 120px !important;
        box-sizing: border-box !important;
        padding-left: 15px !important;
        padding-right: 15px !important; 
    }

    /* CENTER LOGO FOR PHONES */
    div[class*="mobile-header"] img,
    div[class*="zpmenu-mobile"] img,
    [class*="logoArea"] img {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 150px !important; 
        max-width: 150px !important; 
        height: auto !important;          
        object-fit: contain !important;   
        z-index: 10 !important;
        margin: 0 !important;
    }

    /* POSITION HAMBURGER FOR PHONES */
    [class*="zpmenu-mobile-container"],
    [class*="menu-icon-wrap"],
    [class*="zpmenu-mobile-icon"],
    [class*="mobile-menu-icon"],
    div[class*="mobile-header"] i,
    div[class*="zpmenu-mobile"] i,
    .zpmobile-header svg {
        position: absolute !important;
        right: 45px !important;    
        left: auto !important;     
        top: 50% !important;
        transform: translateY(-50%) !important; 
        z-index: 20 !important;
        margin: 0 !important;
        display: inline-block !important;
    }
}

/* ==========================================
   3. DESKTOP LAYOUT SHIELD (1025px and up)
   ========================================== */
@media only screen and (min-width: 1025px) {
    /* Hard reset to prevent mobile values from leaking into desktop screens */
    div[class*="mobile-header"],
    div[class*="zpmenu-mobile"],
    .zpmobile-header {
        position: static !important;
        display: block !important;
        min-height: unset !important;
        max-height: unset !important;
        padding: unset !important;
    }

    /* Return desktop logo to its natural layout column orientation */
    div[class*="mobile-header"] img,
    div[class*="zpmenu-mobile"] img,
    [class*="logoArea"] img {
        position: static !important;
        transform: none !important;
        width: auto !important; /* Returns it to your default theme's chosen size */
        max-width: unset !important;
        margin: unset !important;
    }

    body {
        padding-top: 0 !important; /* Clears out header spacing buffer for desktop monitors */
    }
}











@media only screen and (max-width: 768px) {
    /* 1. Stop icons inside tabs from floating left on mobile */
    [data-element-type="tabs"] i,
    [data-element-type="tabs"] img,
    [data-element-type="tabs"] svg,
    [data-element-type="tabs"] [class*="icon"],
    .zp-tabs i {
        float: none !important;            
        display: inline-block !important;  
        vertical-align: middle !important; 
        margin-left: auto !important;      
        margin-right: auto !important;     
    }

    /* 2. Fix spacing if the text is right next to the icon */
    [data-element-type="tabs"] span,
    [data-element-type="tabs"] a {
        display: inline-block !important;
        vertical-align: middle !important;
    }
}













/* Forces the default pointer on the row, its inner containers, links, and buttons */
.no-cursor-change,
.no-cursor-change *,
.no-cursor-change button, 
.no-cursor-change .zh-btn, 
.no-cursor-change a.btn,
.no-cursor-change a.btn *,
.no-cursor-change .zh-btn * {
    cursor: default !important;
}

/* Enforces the rule even when a user hovers over them */
.no-cursor-change *:hover,
.no-cursor-change button:hover, 
.no-cursor-change .zh-btn:hover, 
.no-cursor-change a.btn:hover,
.no-cursor-change a.btn *:hover,
.no-cursor-change .zh-btn *:hover {
    cursor: default !important;
}












/* Remove all possible hover animations, lifts, filters, backgrounds, and borders in this section */
#no-hover-row-ID, 
#no-hover-row-ID *:hover {
    background-color: transparent !important;
    background: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: none !important;
    border-color: transparent !important;
    opacity: 1 !important;
    filter: none !important;
}

}