html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

@media (max-width: 575.98px) {
    html {
        -webkit-text-size-adjust: 92%;
        text-size-adjust: 92%;
    }

    body {
        overflow-x: hidden;
    }

    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl,
    .container-fluid {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    :root {
        --aha-topbar-height: 46px !important;
        --aha-mobile-logo-width: 108px !important;
        --aha-mobile-logo-height: 28px !important;
        --aha-logo-available-width: calc(100% - 132px) !important;
    }

    .site-header .container-fluid {
        min-height: var(--aha-topbar-height) !important;
        gap: 6px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    .site-header .brand-center-mobile,
    .site-header .brand-center-logo-link,
    .site-header .brand-center-logo-link .brand-center-logo-img {
        height: var(--aha-topbar-height) !important;
        max-height: var(--aha-topbar-height) !important;
    }

    .site-header .brand-center-logo-link .brand-center-logo-img,
    .site-header .brand-center-logo-link .brand-center-logo-img.logo-fit-by-width {
        width: var(--aha-mobile-logo-width) !important;
        height: var(--aha-mobile-logo-height) !important;
        max-width: var(--aha-mobile-logo-width) !important;
        max-height: var(--aha-mobile-logo-height) !important;
    }

    .site-header .home-top-circle-btn,
    .site-header .d-lg-none.ms-auto.d-flex .btn,
    .site-header .d-lg-none.ms-auto.d-flex .home-top-circle-btn,
    .gh-gianhang-topbar__space-btn,
    .gh-gianhang-account__toggle,
    .storefront-mobile-toggle,
    .storefront-icon-button,
    .storefront-mobile-drawer__close {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
    }

    .site-header .home-account-toggle {
        min-height: 40px !important;
        padding: 3px 10px 3px 3px !important;
        gap: 8px !important;
    }

    .site-header .home-account-avatar {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
        max-width: 34px !important;
        max-height: 34px !important;
    }

    .site-header .home-account-name {
        max-width: 122px !important;
        font-size: 13px !important;
    }

    .site-header .guest-account-label {
        font-size: 12px !important;
        padding: 0 10px !important;
    }

    .site-header .mobile-icon-account.guest-account-trigger {
        min-width: 76px !important;
        padding: 0 10px !important;
    }

    .site-header .topbar-auth-btn,
    .mobile-auth-link {
        min-height: 34px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
    }

    .site-header .mode-badge.mode-mobile,
    .mobile-left-icons .mode-badge.mode-mobile {
        font-size: 9px !important;
        padding: 3px 6px !important;
        max-width: 104px !important;
    }

    .site-header .d-lg-none .mobile-icon-bell .ti,
    .site-header .d-lg-none.ms-auto.d-flex .btn .ti,
    .site-header .d-lg-none.ms-auto.d-flex .home-top-circle-btn .ti {
        font-size: 18px !important;
    }

    .mobile-floating-cart {
        left: 10px !important;
        bottom: calc(12px + env(safe-area-inset-bottom)) !important;
    }

    .mobile-floating-cart .floating-cart-btn {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
    }

    .mobile-floating-cart .floating-cart-btn .ti {
        font-size: 20px !important;
    }

    .offcanvas-body {
        padding: 12px !important;
    }

    .home-space-access-card {
        margin: 0 0 12px !important;
    }

    .home-space-access-title {
        margin-bottom: 8px !important;
        font-size: 11px !important;
    }

    .home-space-access-list {
        gap: 6px !important;
    }

    .home-space-access-link {
        padding: 10px 12px !important;
        border-radius: 16px !important;
    }

    .home-space-access-copy strong {
        font-size: 13px !important;
        line-height: 1.25 !important;
    }

    .home-space-access-copy span {
        font-size: 11px !important;
        line-height: 1.3 !important;
    }

    .home-menu-category-list {
        border-radius: 16px !important;
    }

    .home-menu-category-list .menu-category-item {
        min-height: 46px !important;
        padding: 10px 12px !important;
    }

    .menu-category-label {
        font-size: 13px !important;
    }

    .menu-category-arrow {
        font-size: 16px !important;
    }

    .grid-5 {
        gap: 8px !important;
    }

    .grid-5-item {
        width: calc((100% - 8px) / 2) !important;
    }

    .sp-card {
        border-radius: 10px !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, .06) !important;
    }

    .sp-body {
        padding: 8px !important;
    }

    .thumb-wrap {
        border-radius: 8px !important;
    }

    .sp-title {
        margin-top: 8px !important;
        font-size: 13px !important;
        line-height: 1.15rem !important;
        min-height: 2.3rem !important;
    }

    .sp-desc,
    .sp-meta,
    .sp-loc,
    .sp-time {
        font-size: 12px !important;
        line-height: 1.3 !important;
    }

    .sp-price {
        font-size: 14px !important;
    }

    .sp-source-badge {
        margin-top: 6px !important;
        padding: 3px 7px !important;
        font-size: 11px !important;
    }

    .heart-icon {
        top: 6px !important;
        right: 6px !important;
        font-size: 18px !important;
        padding: 5px !important;
    }

    .sp-actions {
        margin-top: 8px !important;
        gap: 6px !important;
    }

    .sp-actions .btn {
        min-height: 30px !important;
        padding: 5px 8px !important;
        font-size: 12px !important;
        border-radius: 10px !important;
    }

    .search-wrap .ct-shell {
        width: min(calc(100% - 10px), 1040px) !important;
    }

    .search-wrap .g-search {
        gap: 6px !important;
        padding: 6px !important;
        min-height: 46px !important;
        border-radius: 14px !important;
        box-shadow: 0 8px 20px rgba(15, 23, 42, .08) !important;
    }

    .search-wrap .g-seg {
        min-height: 36px !important;
        padding: 0 10px !important;
        border-radius: 12px !important;
    }

    .search-wrap .g-input,
    .search-wrap .g-select,
    .search-wrap .g-location-label,
    .search-wrap .g-seg .choices__item--selectable,
    .search-wrap .g-seg .choices__placeholder {
        font-size: 14px !important;
    }

    .search-wrap .g-seg .choices__inner,
    .search-wrap .g-location-trigger {
        min-height: 34px !important;
    }

    .search-wrap .g-btn {
        min-height: 36px !important;
        padding: 0 12px !important;
        border-radius: 10px !important;
        font-size: 13px !important;
    }

    .search-wrap .g-seg.g-cat .choices__item--choice {
        min-height: 44px !important;
        padding: 8px 40px 8px 12px !important;
        font-size: 14px !important;
    }

    .search-suggest-scroll {
        max-height: 300px !important;
    }

    .search-suggest-item {
        padding: 9px 12px !important;
    }

    .hero-ct-like {
        min-height: 214px !important;
        border-radius: 0 0 20px 20px !important;
        box-shadow: 0 10px 24px rgba(23, 94, 67, .12) !important;
    }

    .category-space-shell {
        margin: 10px auto 12px !important;
    }

    .category-space-banner {
        min-height: 120px !important;
        border-radius: 18px !important;
    }

    .category-space-intro {
        margin-top: -14px !important;
    }

    .category-space-intro__card {
        padding: 16px !important;
        border-radius: 18px !important;
    }

    .category-space-title {
        font-size: 22px !important;
    }

    .category-space-desc {
        margin-top: 8px !important;
        font-size: 13px !important;
        line-height: 1.55 !important;
    }

    .bds-page {
        padding-bottom: 18px !important;
    }

    .bds-landing-hero {
        gap: 8px !important;
        margin-top: -8px !important;
    }

    .bds-page-title-block {
        padding: 6px 2px 0 !important;
    }

    .bds-page-title-main {
        font-size: 1.4rem !important;
    }

    .page-pretitle {
        font-size: 11px !important;
    }

    .bds-search-shell {
        padding: 0 10px !important;
    }

    .bds-search-bar {
        gap: 8px !important;
        padding: 8px 10px 8px 12px !important;
        min-height: 46px !important;
        border-radius: 14px !important;
        box-shadow: 0 10px 22px rgba(37, 99, 235, .08) !important;
    }

    .bds-search-input {
        font-size: .94rem !important;
        padding: 4px 0 !important;
    }

    .bds-search-mode-wrap {
        min-width: 130px !important;
        gap: 6px !important;
        padding-left: 8px !important;
    }

    .bds-search-mode-prefix {
        font-size: .66rem !important;
    }

    .bds-search-mode-select {
        min-height: 36px !important;
        min-width: 112px !important;
        border-radius: 12px !important;
        font-size: .82rem !important;
        padding: 8px 30px 8px 10px !important;
    }

    .bds-search-submit {
        min-width: 96px !important;
        min-height: 36px !important;
        border-radius: 12px !important;
        font-size: .84rem !important;
        padding: 8px 12px !important;
    }

    .region-overview {
        padding: 12px !important;
        border-radius: 18px !important;
    }

    .region-overview-head {
        margin-bottom: 10px !important;
    }

    .region-overview-kicker {
        margin-bottom: 6px !important;
    }

    .region-overview-title {
        font-size: 1.1rem !important;
    }

    .region-overview-note {
        font-size: .76rem !important;
    }

    .region-type-tabs {
        gap: 6px !important;
        margin-bottom: 10px !important;
        padding-bottom: 8px !important;
    }

    .region-type-btn {
        padding: 7px 10px !important;
        font-size: 12px !important;
    }

    .region-grid {
        gap: 8px !important;
        grid-template-rows: repeat(2, 136px) !important;
    }

    .region-card {
        padding: 12px !important;
        border-radius: 14px !important;
    }

    .region-card--hero {
        min-height: 280px !important;
    }

    .region-card-name {
        font-size: 24px !important;
    }

    .region-card:not(.region-card--hero) .region-card-name {
        font-size: 17px !important;
    }

    .region-card-count {
        font-size: 22px !important;
    }

    .region-card-count-label {
        font-size: 13px !important;
    }

    .bds-link-card,
    .bds-listing-card,
    .bds-project-card {
        border-radius: 16px !important;
    }

    .bds-card-title,
    .bds-linked-title {
        font-size: 14px !important;
        line-height: 1.35 !important;
    }

    .bds-price,
    .bds-linked-price {
        font-size: 14px !important;
    }

    .gianhang-tabler-main {
        padding: 74px 10px 14px !important;
    }

    .gh-gianhang-topbar__inner {
        min-height: 54px !important;
        padding: 6px 10px !important;
        column-gap: 10px !important;
    }

    .gh-gianhang-topbar__brand-logo {
        width: 92px !important;
        height: 28px !important;
    }

    .gh-gianhang-account__avatar {
        width: 28px !important;
        height: 28px !important;
    }

    .gh-gianhang-account__menu {
        width: min(320px, calc(100vw - 16px)) !important;
        border-radius: 16px !important;
        padding: 12px !important;
    }

    .gh-gianhang-account__profile-name {
        font-size: 14px !important;
    }

    .gh-gianhang-account__link,
    .gh-gianhang-account__logout {
        min-height: 36px !important;
        font-size: 13px !important;
        border-radius: 10px !important;
    }

    .storefront-header__bar {
        min-height: 50px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
    }

    .storefront-header__inner {
        min-height: 38px !important;
        gap: 8px !important;
    }

    .storefront-brand__logo,
    .storefront-brand__logo--empty {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
    }

    .storefront-brand__title {
        font-size: 14px !important;
        line-height: 1.25 !important;
    }

    .storefront-pill,
    .storefront-account__summary,
    .storefront-mobile-nav__link,
    .storefront-mobile-drawer__account a {
        min-height: 36px !important;
        font-size: 13px !important;
        border-radius: 10px !important;
    }

    .storefront-mobile-drawer {
        width: min(316px, calc(100vw - 12px)) !important;
    }

    .storefront-mobile-drawer__head,
    .storefront-mobile-drawer__actions,
    .storefront-mobile-nav__list,
    .storefront-mobile-drawer__account {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .home-shell > .container-fluid[style*="position: fixed"] {
        min-height: 44px !important;
    }

    .home-shell .app-bar {
        min-height: 44px !important;
    }

    .home-shell .app-bar-item,
    .home-shell .brand {
        font-size: 13px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 389.98px) {
    html {
        -webkit-text-size-adjust: 90%;
        text-size-adjust: 90%;
    }

    :root {
        --aha-topbar-height: 44px !important;
        --aha-mobile-logo-width: 98px !important;
        --aha-mobile-logo-height: 26px !important;
    }

    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl,
    .container-fluid {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .grid-5 {
        gap: 6px !important;
    }

    .grid-5-item {
        width: calc((100% - 6px) / 2) !important;
    }

    .sp-body {
        padding: 7px !important;
    }

    .sp-title {
        font-size: 12.5px !important;
    }

    .category-space-title {
        font-size: 20px !important;
    }

    .region-grid {
        grid-template-rows: repeat(2, 124px) !important;
    }

    .region-card--hero {
        min-height: 256px !important;
    }
}