/* Bottom nav mobile — frontend/partials/_bottom_nav.blade.php.
   Nạp ở layouts/frontend.blade.php và layouts/account.blade.php (không nằm trong style.css
   vì trang tài khoản không nạp style.css). */
.bottom-nav {
    display: none !important; /* desktop ẩn; mobile bật flex ở media query dưới */
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9000; /* dưới #mask (9999) và popup */
    height: 58px;
    padding-bottom: env(safe-area-inset-bottom);
    background: linear-gradient(180deg, #3a2410 0%, #1f1208 100%);
    border-top: 2px solid #b98a45;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, .45);
}
.bottom-nav__item {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    color: #e8d3a8;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: .02em;
    line-height: 1;
}
.bottom-nav__item + .bottom-nav__item { border-left: 1px solid rgba(185, 138, 69, .35); }
.bottom-nav__item svg { width: 22px; height: 22px; }
.bottom-nav__item.active,
.bottom-nav__item:active { color: #ffd77a; }
.bottom-nav__item--hot { color: #ffb84d; }
.bottom-nav__item--hot svg { filter: drop-shadow(0 0 4px rgba(255, 184, 77, .6)); }
@media (max-width: 1000px) {
    .bottom-nav {
        display: flex !important;
        flex-direction: row;
        align-items: stretch;
        justify-content: space-around;
    }
    body { padding-bottom: calc(58px + env(safe-area-inset-bottom)); } /* chừa chỗ, không che footer */
}

/* Trang tài khoản: sidebar trượt (z-index 200) và lớp phủ (150) phải che thanh này khi mở. */
.acc-body .bottom-nav { z-index: 140; }