/* ============================================================
   ETI Header Style Widget  —  Frontend CSS
   ⚠️  সব rule .elementor-widget-eti_header_style এর ভেতরে
       scoped — বাইরের কোনো element affect হবে না।
   ============================================================ */

.elementor-widget-eti_header_style,
.elementor-widget-eti_header_style * {
    box-sizing: border-box;
}

/* ── CSS Variables ── */
.elementor-widget-eti_header_style .eti-main-header {
    --eti-orange-gradient : linear-gradient(135deg, #FF9D2E 0%, #FF6B4A 100%);
    --eti-text-dark       : #1D242B;
    --eti-text-light      : #6B7C93;
    --eti-hover-bg        : #F5F7F9;
    --eti-height          : 90px;
    --eti-height-mobile   : 85px;
}

/* ================================================================
   HEADER CONTAINER
================================================================ */
.elementor-widget-eti_header_style .eti-main-header {
    display         : flex;
    align-items     : center;
    justify-content : space-between;
    flex-wrap       : nowrap;
    background-color: #FFFFFF;
    height          : var(--eti-height);
    padding         : 0 1%;
    width           : 100%;
    transition      : background 0.3s ease, box-shadow 0.3s ease;
}

.elementor-widget-eti_header_style .eti-main-header.eti-fixed {
    position: fixed;
    left    : 0;
    top     : 0;
    z-index : 9999;
}

.elementor-widget-eti_header_style .eti-main-header.eti-has-border {
    border-bottom: 1px solid #e0e0e0;
}

.elementor-widget-eti_header_style .eti-header-spacer {
    height: var(--eti-height, 90px);
}

/* ================================================================
   LEFT — Profile / Logo
================================================================ */
.elementor-widget-eti_header_style .eti-header-left {
    display                    : flex;
    align-items                : center;
    gap                        : 15px;
    text-decoration            : none;
    padding                    : 8px 12px;
    border-radius              : 12px;
    transition                 : background-color 0.3s ease;
    -webkit-tap-highlight-color: transparent;
    flex-shrink                : 0;
}

.elementor-widget-eti_header_style .eti-header-left:hover,
.elementor-widget-eti_header_style .eti-header-left:active {
    background-color: var(--eti-hover-bg);
}

.elementor-widget-eti_header_style .eti-profile-img {
    width        : 55px;
    height       : 55px;
    border-radius: 50%;
    object-fit   : cover;
    aspect-ratio : 1 / 1;
    border       : 1px solid #eee;
    display      : block;
    flex-shrink  : 0;
}

.elementor-widget-eti_header_style .eti-branding-text {
    display       : flex;
    flex-direction: column;
}

.elementor-widget-eti_header_style .eti-name {
    font-weight: 800;
    font-size  : 18px;
    color      : var(--eti-text-dark);
    line-height: 1.2;
}

.elementor-widget-eti_header_style .eti-title-info {
    font-size  : 13px;
    color      : var(--eti-text-light);
    line-height: 1.4;
}

/* ================================================================
   MIDDLE — Desktop Nav
================================================================ */
.elementor-widget-eti_header_style .eti-desktop-nav {
    display    : flex;
    align-items: center;
}

/* ul reset — custom list এবং WP wp_nav_menu() দুটোর জন্যই */
.elementor-widget-eti_header_style .eti-desktop-nav ul {
    list-style : none !important;
    display    : flex;
    align-items: center;
    gap        : 10px;
    margin     : 0 !important;
    padding    : 0 !important;
    flex-wrap  : wrap;
    background : transparent;
    border     : none;
    box-shadow : none;
}

/* top-level li */
.elementor-widget-eti_header_style .eti-desktop-nav ul > li {
    position  : relative;
    margin    : 0;
    padding   : 0;
    background: transparent;
    border    : none;
    float     : none;
}

/* top-level link */
.elementor-widget-eti_header_style .eti-desktop-nav ul > li > a {
    display        : inline-flex;
    align-items    : center;
    gap            : 6px;
    text-decoration: none !important;
    color          : var(--eti-text-dark) !important;
    font-size      : 15px;
    font-weight    : 600;
    padding        : 10px 18px;
    border-radius  : 8px;
    white-space    : nowrap;
    transition     : all 0.3s ease;
    background     : transparent;
    border         : none;
    outline        : none;
    box-shadow     : none;
}

.elementor-widget-eti_header_style .eti-desktop-nav ul > li > a:hover,
.elementor-widget-eti_header_style .eti-desktop-nav ul > li.current-menu-item > a,
.elementor-widget-eti_header_style .eti-desktop-nav ul > li.current_page_item > a,
.elementor-widget-eti_header_style .eti-desktop-nav ul > li.current-menu-ancestor > a {
    background-color: var(--eti-hover-bg) !important;
    color           : #FF6B4A !important;
}

/* ── WP sub-menu dropdown ── */
.elementor-widget-eti_header_style .eti-desktop-nav ul .sub-menu {
    list-style   : none !important;
    margin       : 0 !important;
    padding      : 8px 0 !important;
    position     : absolute;
    top          : 100%;
    left         : 0;
    min-width    : 190px;
    background   : #fff !important;
    border-radius: 8px;
    box-shadow   : 0 8px 25px rgba(0,0,0,0.10);
    opacity      : 0;
    visibility   : hidden;
    transform    : translateY(6px);
    transition   : all 0.22s ease;
    z-index      : 9999;
    /* vertical list — flex override */
    display      : block !important;
    flex-wrap    : unset;
    gap          : unset;
    width        : auto;
}

.elementor-widget-eti_header_style .eti-desktop-nav ul > li:hover > .sub-menu {
    opacity   : 1;
    visibility: visible;
    transform : translateY(0);
}

.elementor-widget-eti_header_style .eti-desktop-nav ul .sub-menu > li {
    position: relative;
    width   : 100%;
    float   : none;
    margin  : 0;
    padding : 0;
}

.elementor-widget-eti_header_style .eti-desktop-nav ul .sub-menu > li > a {
    display        : block !important;
    padding        : 9px 18px !important;
    font-size      : 14px;
    font-weight    : 500;
    color          : var(--eti-text-dark) !important;
    border-radius  : 0;
    white-space    : nowrap;
    text-decoration: none !important;
    background     : transparent !important;
    transition     : background 0.2s, color 0.2s;
}

.elementor-widget-eti_header_style .eti-desktop-nav ul .sub-menu > li > a:hover {
    background: #F5F7F9 !important;
    color     : #FF6B4A !important;
}

/* Nested sub-menu */
.elementor-widget-eti_header_style .eti-desktop-nav ul .sub-menu .sub-menu {
    top : 0;
    left: 100%;
}

/* Theme-injected toggle buttons hide করা */
.elementor-widget-eti_header_style .eti-desktop-nav .sub-menu-toggle,
.elementor-widget-eti_header_style .eti-desktop-nav .dropdown-toggle,
.elementor-widget-eti_header_style .eti-desktop-nav .menu-item-has-children > button {
    display: none !important;
}

/* ── Badge ── */
.elementor-widget-eti_header_style .eti-badge {
    display       : inline-block;
    background    : #FF6B4A;
    color         : #fff;
    font-size     : 10px;
    font-weight   : 700;
    padding       : 1px 6px;
    border-radius : 20px;
    line-height   : 1.5;
    margin-left   : 2px;
    vertical-align: middle;
}

/* ================================================================
   RIGHT — CTA Button
================================================================ */
.elementor-widget-eti_header_style .eti-cta-button {
    background                 : var(--eti-orange-gradient);
    color                      : #FFFFFF !important;
    padding                    : 12px 28px;
    border-radius              : 50px;
    text-decoration            : none !important;
    font-weight                : 700;
    font-size                  : 15px;
    box-shadow                 : 0 4px 15px rgba(255,107,74,0.3);
    transition                 : transform 0.2s ease, box-shadow 0.2s ease, opacity 0.3s ease;
    white-space                : nowrap;
    -webkit-tap-highlight-color: transparent;
    display                    : inline-flex;
    align-items                : center;
    gap                        : 8px;
    flex-shrink                : 0;
    line-height                : 1;
    border                     : none;
    cursor                     : pointer;
}

.elementor-widget-eti_header_style .eti-cta-button:hover {
    transform : translateY(-2px);
    box-shadow: 0 6px 20px rgba(255,107,74,0.4);
    color     : #fff !important;
}

.elementor-widget-eti_header_style .eti-cta-button:active {
    transform: scale(0.96);
    opacity  : 0.9;
}

/* ================================================================
   MOBILE  ≤768px
   (Widget এর inline <style> custom breakpoint এ এটা override করে)
================================================================ */
@media (max-width: 768px) {

    .elementor-widget-eti_header_style .eti-main-header {
        height         : var(--eti-height-mobile);
        padding        : 0 10px;
        flex-direction : row !important;
        justify-content: space-between !important;
        flex-wrap      : nowrap !important;
    }

    .elementor-widget-eti_header_style .eti-header-spacer {
        height: var(--eti-height-mobile);
    }

    .elementor-widget-eti_header_style .eti-desktop-nav {
        display : none !important;
        width   : 0;
        overflow: hidden;
    }

    .elementor-widget-eti_header_style .eti-header-left {
        flex-shrink : 0;
        margin-right: auto;
    }

    .elementor-widget-eti_header_style .eti-profile-img {
        width : 48px;
        height: 48px;
    }

    .elementor-widget-eti_header_style .eti-name {
        font-size: 16px;
    }

    .elementor-widget-eti_header_style .eti-title-info {
        font-size: 11px;
    }

    .elementor-widget-eti_header_style .eti-cta-button {
        flex-shrink : 0;
        margin-left : auto;
        margin-right: 12px;
        padding     : 10px 20px;
        font-size   : 14px;
    }
}
