/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme, customized for Viet Lao Stone.
Author: UX-Themes / Antigravity
Template: flatsome
Version: 1.0.0
*/

/* Custom styles for Viet Lao Stone go here */

/* Import Google Font Montserrat */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800&display=swap');

/* Apply font and styles to main navigation menu with high specificity */
.header-nav-main .nav > li > a,
.header-nav .nav > li > a,
.nav > li > a,
a.nav-top-link,
.lang-item > a,
li.menu-item > a {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: 0.3px !important;
    color: #0b2f64 !important;
    transition: all 0.3s ease !important;
    
    /* Force icon, text, and arrow to align horizontally in a straight line */
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.header-nav-main .nav > li > a:hover,
.header-nav .nav > li > a:hover,
.nav > li > a:hover,
a.nav-top-link:hover,
.lang-item > a:hover,
li.menu-item > a:hover {
    color: #d4af37 !important;
}

/* Force all child elements inside the anchor to align horizontally and inline */
.header-nav-main .nav > li > a *,
.header-nav .nav > li > a *,
.nav > li > a *,
a.nav-top-link *,
.lang-item > a *,
li.menu-item > a * {
    display: inline-block !important;
    vertical-align: middle !important;
    float: none !important;
}

/* Specific adjustments for icons and dropdowns */
a.nav-top-link::before,
.nav > li > a::before,
.lang-item > a img {
    margin-right: 6px !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

a.nav-top-link i,
.nav > li > a i,
a.nav-top-link span,
.nav > li > a span {
    margin-left: 4px !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

/* Insert custom icons before menu items based on URL slugs */
.header-nav-main .nav > li > a[href$="/"]::before,
.header-nav-main .nav > li > a[href*="/trang-chu/"]::before,
.header-nav-main .nav > li > a[href*="/%e9%a6%96%e9%a1%b5/"]::before,
.nav > li > a[href$="/"]::before,
.nav > li > a[href*="/trang-chu/"]::before,
.nav > li > a[href*="/%e9%a6%96%e9%a1%b5/"]::before,
a.nav-top-link[href$="/"]::before,
a.nav-top-link[href*="/trang-chu/"]::before {
    content: "⌂ ";
    font-size: 14px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="basalt-stone"]::before,
.header-nav-main .nav > li > a[href*="da-basalt"]::before,
.nav > li > a[href*="basalt-stone"]::before,
.nav > li > a[href*="da-basalt"]::before,
a.nav-top-link[href*="basalt-stone"]::before,
a.nav-top-link[href*="da-basalt"]::before {
    content: "✦ ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="quarries"]::before,
.header-nav-main .nav > li > a[href*="mo-da"]::before,
.nav > li > a[href*="quarries"]::before,
.nav > li > a[href*="mo-da"]::before,
a.nav-top-link[href*="quarries"]::before,
a.nav-top-link[href*="mo-da"]::before {
    content: "⛏ ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="factory"]::before,
.header-nav-main .nav > li > a[href*="nha-may"]::before,
.nav > li > a[href*="factory"]::before,
.nav > li > a[href*="nha-may"]::before,
a.nav-top-link[href*="factory"]::before,
a.nav-top-link[href*="nha-may"]::before {
    content: "🏭 ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="logistics"]::before,
.header-nav-main .nav > li > a[href*="van-chuyen"]::before,
.nav > li > a[href*="logistics"]::before,
.nav > li > a[href*="van-chuyen"]::before,
a.nav-top-link[href*="logistics"]::before,
a.nav-top-link[href*="van-chuyen"]::before {
    content: "🚢 ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="packaging"]::before,
.header-nav-main .nav > li > a[href*="dong-goi"]::before,
.nav > li > a[href*="packaging"]::before,
.nav > li > a[href*="dong-goi"]::before,
a.nav-top-link[href*="packaging"]::before,
a.nav-top-link[href*="dong-goi"]::before {
    content: "📦 ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="applications"]::before,
.header-nav-main .nav > li > a[href*="ung-dung"]::before,
.nav > li > a[href*="applications"]::before,
.nav > li > a[href*="ung-dung"]::before,
a.nav-top-link[href*="applications"]::before,
a.nav-top-link[href*="ung-dung"]::before {
    content: "📐 ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="news"]::before,
.header-nav-main .nav > li > a[href*="tin-tuc"]::before,
.nav > li > a[href*="news"]::before,
.nav > li > a[href*="tin-tuc"]::before,
a.nav-top-link[href*="news"]::before,
a.nav-top-link[href*="tin-tuc"]::before {
    content: "📰 ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

.header-nav-main .nav > li > a[href*="contact"]::before,
.header-nav-main .nav > li > a[href*="lien-he"]::before,
.nav > li > a[href*="contact"]::before,
.nav > li > a[href*="lien-he"]::before,
a.nav-top-link[href*="contact"]::before,
a.nav-top-link[href*="lien-he"]::before {
    content: "✉ ";
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}

/* Desktop header optimization: Hide search and keep layout horizontal */
@media (min-width: 992px) {
    /* Hide the search icon and search dropdown on desktop */
    .header-search,
    .header-search-dropdown,
    li.header-search {
        display: none !important;
    }
    
    /* Force navigation menus to always display in a single horizontal row */
    .nav {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
    }
    
    .header-nav {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
    }
    
    /* Compress paddings and font size */
    .header-nav-main .nav > li > a,
    .header-nav .nav > li > a,
    .nav > li > a,
    a.nav-top-link,
    .lang-item > a {
        padding-left: 8px !important;
        padding-right: 8px !important;
        font-size: 12px !important;
    }
}

/* Mobile Sidebar Drawer Navigation Stylings */
.mobile-sidebar .nav > li > a,
.mobile-sidebar .nav-sidebar > li > a,
.mobile-sidebar li.menu-item > a,
.nav-sidebar > li > a {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: left !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

/* Align child elements in mobile sidebar links horizontally */
.mobile-sidebar .nav > li > a *,
.mobile-sidebar .nav-sidebar > li > a *,
.nav-sidebar > li > a * {
    display: inline-block !important;
    vertical-align: middle !important;
    text-align: left !important;
}

/* Spacing and layout for mobile menu icons */
.mobile-sidebar .nav > li > a::before,
.mobile-sidebar .nav-sidebar > li > a::before,
.nav-sidebar > li > a::before {
    margin-right: 12px !important;
    margin-left: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    float: none !important;
}

/* Push toggle arrow to the far right on mobile sidebar menu */
.mobile-sidebar .nav > li > a i.icon-angle-down,
.mobile-sidebar .nav-sidebar > li > a i.icon-angle-down,
.nav-sidebar > li > a i.icon-angle-down {
    margin-left: auto !important;
    margin-right: 0 !important;
    padding-right: 5px !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

/* Investment menu icon */
.header-nav-main .nav > li > a[href*="dautuvietlao.com"]::before,
.nav > li > a[href*="dautuvietlao.com"]::before,
a.nav-top-link[href*="dautuvietlao.com"]::before {
    content: "📈 " !important;
    font-size: 12px;
    color: #d4af37;
    font-weight: bold;
}
