/* =====================================================================
   Thegioidotap Mobile UI — chỉ áp dụng màn hình < 850px (mobile / tablet dọc,
   cùng mốc "show-for-medium" của Flatsome). Desktop không đổi.
   ===================================================================== */

@media (max-width: 849px) {

    /* --- Header: 111px -> 60px, header dính 99px -> 56px ------------- */
    #masthead,
    .header-main {
        height: 60px !important;
    }

    .stuck #masthead,
    .stuck .header-main {
        height: 56px !important;
    }

    #logo img {
        max-height: 40px !important;
        width: auto;
    }

    /* Nút tròn xanh (tìm kiếm, giỏ, menu) nhỏ lại cho vừa header thấp. */
    #masthead .mobile-nav > li > a {
        padding-top: 0;
        padding-bottom: 0;
    }

    #masthead .mobile-nav .icon-circle,
    #masthead .mobile-nav .button.circle {
        min-width: 0;
        width: 34px;
        height: 34px;
        line-height: 34px;
        padding: 0 !important;
        font-size: 15px;
    }

    #masthead .mobile-nav .icon-circle i,
    #masthead .mobile-nav .button.circle i {
        top: 0;
        margin: 0 !important;
    }

    /* --- Thanh liên hệ xanh dưới cùng (HFCM "CTA mobile"): ẩn ---------
       Nút Zalo tròn nổi (footer.php) thay thế, được thu nhỏ và đưa xuống góc
       phải bằng script trong thegioidotap-mobile-ui.php (style inline có
       !important nên CSS không đè được). */
    #mobile-bottom-navigation {
        display: none !important;
    }
}