/* MiKO Responsive Menu Overflow v1
 * Desktop: excess top-level items collapse into a clean "เพิ่มเติม" dropdown.
 * Mobile/tablet drawer: long menus become a compact expandable group.
 */
.miko-nav-overflow{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  list-style:none!important;
}
.miko-nav-overflow[hidden]{display:none!important}
.miko-nav-overflow-toggle{
  appearance:none!important;
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  margin:0!important;
  padding:8px 12px!important;
  border:1px solid #d8e5f2!important;
  border-radius:13px!important;
  background:linear-gradient(180deg,#fff,#f6faff)!important;
  color:#173e70!important;
  font:800 12px/1.2 inherit!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  box-shadow:0 5px 14px rgba(17,62,108,.07)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
.miko-nav-overflow-toggle:hover,
.miko-nav-overflow-toggle:focus-visible{
  border-color:#9bc7ee!important;
  box-shadow:0 8px 18px rgba(17,92,163,.12)!important;
  transform:translateY(-1px)!important;
  outline:0!important;
}
.miko-nav-overflow-toggle svg{
  width:15px!important;
  height:15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  transition:transform .18s ease!important;
}
.miko-nav-overflow.is-open .miko-nav-overflow-toggle svg{transform:rotate(180deg)!important}
.miko-nav-overflow-list{
  position:absolute!important;
  z-index:2147482000!important;
  top:calc(100% + 9px)!important;
  right:0!important;
  width:max-content!important;
  min-width:230px!important;
  max-width:min(340px,calc(100vw - 24px))!important;
  margin:0!important;
  padding:8px!important;
  list-style:none!important;
  border:1px solid #d8e5f2!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 18px 48px rgba(13,52,94,.16)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(-5px)!important;
  pointer-events:none!important;
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease!important;
}
.miko-nav-overflow.is-open>.miko-nav-overflow-list{
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  pointer-events:auto!important;
}
.miko-nav-overflow-list>li{
  display:block!important;
  float:none!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
.miko-nav-overflow-list>li+li{margin-top:3px!important}
.miko-nav-overflow-list>li>a{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  min-height:42px!important;
  padding:9px 11px!important;
  border-radius:11px!important;
  color:#244b72!important;
  text-decoration:none!important;
  white-space:normal!important;
  line-height:1.35!important;
}
.miko-nav-overflow-list>li>a:hover,
.miko-nav-overflow-list>li.current-menu-item>a{
  background:#eef7ff!important;
  color:#0875e1!important;
}
.miko-nav-overflow-list .sub-menu{
  max-width:100%!important;
}

/* Homepage nav: dynamic overflow entries inherit the existing More menu look. */
.miko-news-mainnav>a[data-miko-overflow-hidden="1"]{display:none!important}
.miko-nav-more-menu>.miko-dynamic-overflow{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
}

/* Long drawer menus become a compact dropdown instead of an endless block. */
.miko-master-drawer nav>.miko-drawer-more{
  display:block!important;
  margin-top:7px!important;
  border:1px solid #d7e5f2!important;
  border-radius:16px!important;
  background:#f8fbff!important;
  overflow:hidden!important;
}
.miko-master-drawer nav>.miko-drawer-more>summary{
  min-height:52px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  padding:10px 14px!important;
  color:#173e70!important;
  font-weight:900!important;
  cursor:pointer!important;
  list-style:none!important;
}
.miko-master-drawer nav>.miko-drawer-more>summary::-webkit-details-marker{display:none!important}
.miko-master-drawer nav>.miko-drawer-more>summary:after{
  content:"⌄";
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:9px;
  background:#eaf4ff;
  color:#0875e1;
  font-size:18px;
  transition:transform .18s ease;
}
.miko-master-drawer nav>.miko-drawer-more[open]>summary:after{transform:rotate(180deg)}
.miko-drawer-more-list{
  display:grid!important;
  gap:5px!important;
  padding:0 7px 7px!important;
}
.miko-drawer-more-list>a{
  margin:0!important;
  border-radius:13px!important;
  background:#fff!important;
}

/* Defensive fit for all header/menu shells. */
.menu-primary-container,
.jl-navw,
.miko-news-mainnav,
.miko-site-pages,
.miko-news-tools,
.miko-mobile-headrow,
.miko-reference-bottom-nav{
  min-width:0!important;
  max-width:100%!important;
}
.miko-mobile-headrow>*,
.miko-reference-bottom-nav>*{min-width:0!important}
.miko-head-action>span,
.miko-reference-bottom-nav b{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Tablet: keep controls compact and let the drawer be the overflow destination. */
@media(min-width:768px) and (max-width:1024px){
  .miko-tablet-toprow{min-width:0!important}
  .miko-tablet-toprow>*{min-width:0!important}
  .miko-tablet-brand{min-width:0!important;overflow:hidden!important}
  .miko-tablet-brand img{max-width:100%!important;height:auto!important}
}

/* Mobile: never allow horizontal menu overflow. */
@media(max-width:767px){
  html,body{max-width:100%!important;overflow-x:hidden!important}
  .miko-nav-overflow{display:none!important}
  .miko-mobile-shell,
  .miko-mobile-head,
  .miko-mobile-headrow,
  .miko-mobile-search,
  .miko-reference-bottom-nav,
  .miko-master-drawer,
  .miko-master-drawer>aside{
    max-width:100%!important;
    box-sizing:border-box!important;
  }
}
@media(max-width:430px){
  .miko-mobile-headrow{grid-template-columns:minmax(44px,.82fr) minmax(72px,1.14fr) minmax(44px,.82fr) minmax(44px,.82fr) minmax(44px,.74fr)!important}
  .miko-head-action{min-width:0!important;max-width:100%!important}
  .miko-head-action>span{font-size:8.2px!important}
}
@media(max-width:390px){
  .miko-mobile-headrow{grid-template-columns:minmax(40px,.8fr) minmax(68px,1.08fr) repeat(3,minmax(40px,.74fr))!important}
  .miko-head-action>span{font-size:7.7px!important}
  .miko-reference-bottom-nav b{font-size:8.5px!important}
}
@media(max-width:360px){
  .miko-mobile-head{padding-inline:2px!important}
  .miko-mobile-headrow{gap:1px!important}
  .miko-head-action{gap:2px!important}
  .miko-head-action>span{font-size:7.2px!important}
  .miko-reference-bottom-nav{left:4px!important;right:4px!important;padding-inline:2px!important}
  .miko-reference-bottom-nav b{font-size:8px!important}
}
@media(prefers-reduced-motion:reduce){
  .miko-nav-overflow-toggle,
  .miko-nav-overflow-toggle svg,
  .miko-nav-overflow-list,
  .miko-master-drawer nav>.miko-drawer-more>summary:after{transition:none!important}
}