.srnat-switcher{
  position:relative;
  display:inline-flex;
  align-items:center;
  z-index:1500;
  font-family:Arial,"Noto Sans Khmer",sans-serif;
}

.srnat-trigger{
  width:112px;
  min-width:112px;
  height:54px;
  padding:0 10px;
  display:grid;
  grid-template-columns:22px minmax(0,1fr) 12px;
  align-items:center;
  column-gap:7px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:transparent;
  color:#fff;
  cursor:pointer;
  box-shadow:none;
  text-align:left;
  transition:background .18s ease,border-color .18s ease;
}

.srnat-trigger:hover,
.srnat-trigger[aria-expanded="true"]{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.25);
}

.srnat-globe{
  font-size:19px;
  line-height:1;
}

.srnat-trigger-text{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  line-height:1.12;
}

.srnat-language-title{
  color:#fff;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}

.srnat-language-current{
  margin-top:3px;
  color:#cbd5e1;
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.srnat-arrow{
  font-size:12px;
  opacity:.8;
  transition:transform .18s ease;
}

.srnat-switcher.is-open .srnat-arrow{
  transform:rotate(180deg);
}

.srnat-menu{
  position:absolute;
  top:calc(100% + 9px);
  right:0;
  display:none;
  width:190px;
  padding:8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:#09182e;
  box-shadow:0 22px 55px rgba(0,0,0,.45);
}

.srnat-switcher.is-open .srnat-menu{
  display:block;
}

.srnat-menu a{
  min-height:48px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-radius:10px;
  color:#eef4ff;
  text-decoration:none;
  transition:background .16s ease;
}

.srnat-menu a:hover{
  background:#132a4a;
}

.srnat-menu a.is-active{
  background:#1a3d6c;
}

.srnat-menu strong{
  font-size:14px;
}

.srnat-menu small{
  color:#9eb0c8;
  font-size:11px;
}

.srnat-error-notice{
  position:fixed;
  left:50%;
  bottom:20px;
  z-index:999999;
  transform:translateX(-50%);
  max-width:calc(100% - 30px);
  padding:11px 14px;
  border-radius:12px;
  background:#7f1d1d;
  color:#fff;
  font:700 12px/1.5 Arial,"Noto Sans Khmer",sans-serif;
  box-shadow:0 12px 35px rgba(0,0,0,.4);
}

@media(max-width:900px){
  .main-header{
    position:relative !important;
    display:grid !important;
    grid-template-columns:52px minmax(0,1fr) 112px !important;
    align-items:center !important;
    gap:10px !important;
    min-height:82px !important;
    padding:10px 0 !important;
  }

  .menu-toggle{
    position:static !important;
    grid-column:1 !important;
    grid-row:1 !important;
    transform:none !important;
    width:48px !important;
    height:48px !important;
    margin:0 !important;
    justify-self:start !important;
    z-index:1302 !important;
  }

  .brand{
    grid-column:2 !important;
    grid-row:1 !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  .brand-home-link{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    min-width:0 !important;
  }

  .brand-logo img,
  .brand-logo .custom-logo{
    width:54px !important;
    max-width:54px !important;
    max-height:54px !important;
    object-fit:contain !important;
  }

  .brand-text{
    display:block !important;
    min-width:0 !important;
    padding-left:8px !important;
    border-left:1px solid rgba(255,255,255,.10) !important;
  }

  .brand-title{
    margin:0 !important;
    font-size:16px !important;
    line-height:1.1 !important;
    white-space:nowrap !important;
  }

  .brand-tag{
    margin-top:5px !important;
    max-width:120px !important;
    font-size:8px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  .header-language-switcher{
    position:static !important;
    grid-column:3 !important;
    grid-row:1 !important;
    transform:none !important;
    display:block !important;
    width:auto !important;
    margin:0 !important;
    justify-self:end !important;
    z-index:1400 !important;
  }

  .srnat-trigger{
    width:112px;
    min-width:112px;
    height:54px;
  }

  .srnat-menu{
    position:absolute;
    top:calc(100% + 9px);
    right:0;
    left:auto;
    width:190px;
    max-width:calc(100vw - 24px);
  }

  .main-nav{
    top:82px !important;
  }
}

@media(max-width:420px){
  .main-header{
    grid-template-columns:48px minmax(0,1fr) 102px !important;
    gap:7px !important;
  }

  .menu-toggle{
    width:44px !important;
    height:44px !important;
  }

  .brand-logo img,
  .brand-logo .custom-logo{
    width:46px !important;
    max-width:46px !important;
  }

  .brand-title{
    font-size:14px !important;
  }

  .brand-tag{
    max-width:95px !important;
    font-size:7px !important;
  }

  .srnat-trigger{
    width:102px;
    min-width:102px;
    height:50px;
    padding:0 8px;
    grid-template-columns:20px minmax(0,1fr) 10px;
    column-gap:5px;
  }

  .srnat-globe{
    font-size:17px;
  }

  .srnat-language-title{
    font-size:11px;
  }

  .srnat-language-current{
    font-size:10px;
  }
}

/* v4 language list */
.srnat-menu{
  width:220px;
  max-height:min(420px,70vh);
  overflow-y:auto;
}
.srnat-menu a{
  gap:14px;
}
@media(max-width:420px){
  .srnat-menu{
    width:210px;
    max-width:calc(100vw - 20px);
  }
}