/* KHONCHAIHERB v1.27 — premium integrated desktop footer navigation */

html body .kch-master-footer{
  position:relative;
  overflow:hidden;
}

html body .kch-master-footer-bottom{
  border-top:1px solid rgba(219,190,119,.20)!important;
  background:linear-gradient(180deg,rgba(6,53,41,.72),rgba(4,44,34,.92))!important;
}

html body .kch-master-footer-bottom>div{
  min-height:82px!important;
  padding:18px 0!important;
  font-size:15px!important;
  color:#c8d5cf!important;
}

html body .kch-master-footer-bottom>div>span{
  font-size:15px!important;
  line-height:1.5!important;
  letter-spacing:.01em!important;
}

html body .kch-master-payments span{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  min-height:42px!important;
  padding:9px 16px!important;
  border:1px solid rgba(245,218,150,.54)!important;
  border-radius:10px!important;
  background:linear-gradient(180deg,#fff1bd,#f3d888)!important;
  color:#143f31!important;
  box-shadow:0 6px 18px rgba(0,0,0,.13)!important;
  font-size:14px!important;
  font-weight:900!important;
}

html body .kch-master-payments span::before{
  content:'inventory_2';
  font-family:'Material Symbols Rounded';
  font-size:20px;
  line-height:1;
  font-weight:400;
}

html body .kch-footer-premium-wrap{
  position:relative;
  width:100%;
  padding:28px clamp(28px,5vw,74px) 30px;
  background:
    radial-gradient(circle at 5% 100%,rgba(112,142,78,.18),transparent 15%),
    radial-gradient(circle at 95% 100%,rgba(112,142,78,.16),transparent 15%),
    linear-gradient(180deg,#06382c,#043126);
  border-top:1px solid rgba(222,188,104,.18);
  box-sizing:border-box;
}

html body .kch-footer-premium-wrap::before,
html body .kch-footer-premium-wrap::after{
  content:'❧';
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  color:rgba(175,190,105,.16);
  font-family:Georgia,'Times New Roman',serif;
  font-size:86px;
  line-height:1;
  pointer-events:none;
}

html body .kch-footer-premium-wrap::before{left:22px;transform:translateY(-50%) rotate(-22deg)}
html body .kch-footer-premium-wrap::after{right:22px;transform:translateY(-50%) rotate(158deg)}

html body .kch-footer-premium-nav{
  position:relative;
  z-index:1;
  width:min(1380px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  align-items:stretch;
  min-height:88px;
  padding:8px 14px;
  border:1.5px solid #d1ad59;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(6,69,51,.96),rgba(5,53,41,.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 16px 36px rgba(0,0,0,.16);
  box-sizing:border-box;
}

html body .kch-footer-premium-nav button{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:0;
  min-height:70px;
  padding:10px 12px;
  border:0;
  border-radius:18px;
  background:transparent;
  color:#f4dda0;
  font-family:'Noto Sans Thai',system-ui,sans-serif;
  font-size:16px;
  line-height:1.35;
  font-weight:800;
  white-space:nowrap;
  cursor:pointer;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}

html body .kch-footer-premium-nav button+button::before{
  content:'';
  position:absolute;
  left:0;
  top:20%;
  bottom:20%;
  width:1px;
  background:rgba(228,194,112,.50);
}

html body .kch-footer-premium-nav button:hover,
html body .kch-footer-premium-nav button:focus-visible{
  background:rgba(255,255,255,.075);
  color:#ffe8aa;
  transform:translateY(-1px);
  outline:none;
}

html body .kch-footer-premium-nav .material-symbols-rounded{
  flex:0 0 auto;
  font-size:26px;
  color:#f2d78e;
}

/* Desktop: replace the legacy rectangular navigation with the integrated footer nav. */
@media(min-width:700px){
  html body .kch-master-shell>.tshop-bottom,
  html body .kch-master-shell .tshop-bottom{
    display:none!important;
  }
}

@media(max-width:1180px) and (min-width:700px){
  html body .kch-footer-premium-wrap{padding-inline:24px}
  html body .kch-footer-premium-nav{padding-inline:8px}
  html body .kch-footer-premium-nav button{gap:7px;padding-inline:7px;font-size:14px}
  html body .kch-footer-premium-nav .material-symbols-rounded{font-size:22px}
}

@media(max-width:699px){
  html body .kch-footer-premium-wrap{display:none!important}
  html body .kch-master-footer-bottom>div{
    min-height:0!important;
    padding:16px 0 104px!important;
    font-size:13px!important;
  }
  html body .kch-master-footer-bottom>div>span{font-size:13px!important}
  html body .kch-master-payments span{font-size:12.5px!important;min-height:38px!important;padding:8px 12px!important}
}

@media(prefers-reduced-motion:reduce){
  html body .kch-footer-premium-nav button{transition:none!important}
}