/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* ==========================================================================
   Header Mobile & Universal Layout Fixes
   ========================================================================== */

/* 1. Sticky Header wrapper */
body .elementor-location-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    width: 100% !important;
    background-color: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    transition: all 0.3s ease !important;
}

/* 2. Header Container: Enforce horizontal single-row flex layout across all screen sizes */
#header-id,
.elementor-14412 #header-id,
.elementor-location-header #header-id,
.elementor-location-header .elementor-element-ec7d5e6 {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 55px !important;
    height: auto !important;
    padding: 8px 16px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

/* 3. Site Logo: Centered and properly proportioned */
.elementor-location-header .elementor-element-4de8c72,
#header-id .elementor-widget-theme-site-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
    flex-shrink: 0 !important;
    width: auto !important;
}

.elementor-location-header .elementor-element-4de8c72 a,
#header-id .elementor-widget-theme-site-logo a {
    display: inline-flex !important;
    align-items: center !important;
}

.elementor-location-header .elementor-element-4de8c72 img,
#header-id .elementor-widget-theme-site-logo img {
    height: 40px !important;
    max-height: 40px !important;
    width: auto !important;
    object-fit: contain !important;
    display: block !important;
}

@media (max-width: 480px) {
    .elementor-location-header .elementor-element-4de8c72 img,
    #header-id .elementor-widget-theme-site-logo img {
        height: 32px !important;
        max-height: 32px !important;
    }
}

/* 4. Right Container: Language switcher, search, support in horizontal row */
#header-id .elementor-element-f51dbc3,
#header-id > .e-con:last-child {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    width: auto !important;
}

@media (max-width: 480px) {
    #header-id .elementor-element-f51dbc3,
    #header-id > .e-con:last-child {
        gap: 8px !important;
    }
}

/* Polylang Flag sizing */
.elementor-location-header .cpel-switcher__flag,
.elementor-location-header .cpel-switcher__flag img {
    width: 20px !important;
    height: auto !important;
    display: block !important;
}

/* 5. Header Icons (Buttons & Links): Constrain to crisp fixed dimensions */
.elementor .header-icon,
.elementor .g-1b13a6e,
.elementor-location-header button.header-icon,
.elementor-location-header a.header-icon,
button.e-911c107-cd191c2 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
}

@media (max-width: 480px) {
    .elementor .header-icon,
    .elementor .g-1b13a6e,
    .elementor-location-header button.header-icon,
    .elementor-location-header a.header-icon,
    button.e-911c107-cd191c2 {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
    }
}

/* 6. Crucial: SVGs inside header icons must scale to their container (24px/28px), NOT 800px */
.elementor .header-icon svg,
.elementor .g-1b13a6e svg,
.elementor-location-header button.header-icon svg,
.elementor-location-header a.header-icon svg,
button.e-911c107-cd191c2 svg {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    display: block !important;
    margin: 0 auto !important;
    flex-shrink: 0 !important;
    overflow: visible !important;
}
