/**********************************************************
Tunifact V 3.0
Header Override - Clean and Simple
***********************************************************/

/* ==============================================
   Scroll Up Button Position
   ============================================== */
/* Arabic: Left side */
html[lang="ar-tn"] #scrollUp {
	right: auto !important;
	left: 31px !important;
}

/* French: Right side */
html[lang="fr-tn"] #scrollUp {
	right: 31px !important;
	left: auto !important;
}

/* Mobile - Adjust for smaller screens */
@media (max-width: 767px) {
	html[lang="ar-tn"] #scrollUp {
		left: 16px !important;
	}
	
	html[lang="fr-tn"] #scrollUp {
		right: 16px !important;
	}
}

/* Desktop Search Positioning - Arabic */
@media (min-width: 992px) {
    html[lang="ar-tn"] .header-style-1 .search-button,
    html[lang="ar-tn"] .header-style-2 .search-button {
        position: absolute;
        left: 200px;
        right: auto;
        top: 85px;
        z-index: 899;
    }
    
    html[lang="ar-tn"] .header-sticky.sticky-bar .search-button {
        top: 25px;
    }
    
    /* Desktop Search Positioning - French */
    html[lang="fr-tn"] .header-style-1 .search-button,
    html[lang="fr-tn"] .header-style-2 .search-button {
        position: absolute;
        right: 200px;
        left: auto;
        top: 85px;
        z-index: 899;
    }
    
    html[lang="fr-tn"] .header-sticky.sticky-bar .search-button {
        top: 25px;
    }
    
    /* Desktop Layout */
    .header-content-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 15px 0;
    }
    
    .header-nav-wrapper {
        display: flex;
        flex: 1;
        justify-content: center;
    }
    
    .header-logo-compact {
        position: relative;
    }
    
    .header-logo-compact img {
        max-height: 50px;
    }
    
    /* Hide mobile elements on desktop */
    .mobile_menu,
    .off-canvas-toggle-cover {
        display: none;
    }
}

/* Search Icon Styling */
.search-button button,
.search-button .search-icon {
    background: transparent;
    border: 2px solid #ef3f48;
    color: #ef3f48;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    padding: 0;
    transition: all 0.3s ease;
}

.search-button button:hover,
.search-button .search-icon:hover {
    background: #ef3f48;
    color: #fff;
}

/* Mobile Responsive - Both Versions */
@media (max-width: 991px) {
    /* Mobile Header Container */
    .header-main-wrapper {
        position: sticky;
        top: 0;
        z-index: 1000;
        background: #fff;
        box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    }
    
    .header-main-wrapper .container {
        width: 100%;
        max-width: 100%;
        padding: 0 14px;
    }
    
    .header-content-wrapper {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 0;
        height: 60px;
        min-height: 60px;
        gap: 10px;
    }
    
    /* 1. Language Flag - LEFT */
    .off-canvas-toggle-cover {
        order: 1;
        flex: 0 0 auto;
        display: flex;
        align-items: center;
    }
    
    .off-canvas-toggle-cover img {
        max-height: 20px;
        display: block;
    }
    
    /* 2. Logo - CENTER */
    .header-logo-compact {
        order: 2;
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0;
    }
    
    .header-logo-compact a {
        display: inline-block;
        line-height: 0;
    }
    
    .header-logo-compact img {
        max-height: 40px;
        display: block;
        width: auto;
    }
    
    /* 3. Menu Button - RIGHT */
    .mobile_menu {
        order: 3;
        flex: 0 0 auto;
        position: relative;
        display: block;
    }
    
    /* Slicknav Button Adjustment */
    .slicknav_btn {
        top: -30px;
        position: relative;
    }
    
    /* Hide Desktop Elements */
    .header-nav-wrapper,
    .header-actions {
        display: none;
    }
    
    /* Hide Search Button on French Mobile Version Only */
    html[lang="fr-tn"] .search-button,
    html[lang="fr-tn"] .header-actions .search-button {
        display: none !important;
    }
}
