/*****footer mobile*************/
.wrap-menu {
            position: relative;
            float: left;
            width: 100%;
}
#menu-foot {
            height: 60px;
            position: fixed;
            background: #fff;
            box-shadow: 0 0 2px rgba(0, 0, 0, 0.16);
            bottom: 0;
            z-index: 4;
            font-size: 10px;
            z-index: 100;
            display: none;
}
#menu-foot ul {
            margin: 0px;
            padding: 0px;
            list-style-type: none;
        }
#menu-foot ul li {
            width: 25%;
            float: left;
            text-align: center;
            font-size: 1.4em;
            color: #7b7e8c;
            margin: 0px;
            padding: 0px;
            list-style-type: none;
        }
#menu-foot ul li a {
            color: #7b7e8c;
            display: block;
            padding: 11.5px 0;
        }
#menu-foot ul li.act a {
            color: #0082e6;
        }
#menu-foot ul li a i, #menu-foot ul li a svg {
            font-size: 15px;
            width: 17px;
            height: 17px;
            margin-bottom: -2px;
        }
#menu-foot ul li a p {
            margin: 0;
            font-family: Anuphan;
            font-size: 14px;
      }
/******************************************************/

/* ===== Mobile Footer Menu (Sticky Tab Bar) ===== */
.hj-mobile-tabbar{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 50;
  display: none;                       /* เริ่มซ่อน แล้วค่อยแสดงบนจอเล็ก */
  grid-template-columns: repeat(5, 1fr);
  align-items: center;
  background: #ffffff;
  border-top: 1px solid #e6eaee;
  box-shadow: 0 -4px 16px rgba(0,0,0,.06);
  padding: 6px max(12px, env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-right));
}
/* ปุ่มแต่ละอัน */
.hj-mobile-tabbar .tab{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 6px 4px;
  text-decoration: none;
  color: #7A7A73;
  font-size: 11.5px;
  line-height: 1.1;
  border-radius: 12px;
  transition: color .18s ease, background-color .18s ease, transform .06s ease;
  -webkit-tap-highlight-color: transparent;
}

/* ไอคอน */
.hj-mobile-tabbar .icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border-radius: 999px;
}

/* ปุ่มหลักตรงกลาง (เช่น ค้นหา) */
.hj-mobile-tabbar .tab--primary .icon{
  background: #FE7743;         /* สีส้ม CI */
  color: #fff;
}
.hj-mobile-tabbar .tab--primary .label{ color: #FE7743; }

/* โฮเวอร์/กด */
.hj-mobile-tabbar .tab:hover{ color:#303030; background:#f9fafb; }
.hj-mobile-tabbar .tab:active{ transform: translateY(1px); }

/* สถานะ active (จาก JS ด้านล่าง) */
.hj-mobile-tabbar .tab.is-active{
  color:#303030;
}
.hj-mobile-tabbar .tab.is-active .icon{
  background:#f0f4f7;
}
.hj-mobile-tabbar .tab.is-active.tab--primary .icon{
  background:#FE7743; color:#fff;
}

/****************/