/* HTNS v264 — login alignment cleanup requested from the v263 baseline.
   - Center the Select your name picker card inside the login panel.
   - Make Offline Songbook a true third segment of the shared action card,
     with no nested rounded border/background of its own.
   Login behavior is unchanged. */

/* The legacy picker wrapper has a 330px max-width. Keep that comfortable
   field width, but center the whole card instead of leaving it left-aligned. */
#gate .panel #nameWrap.login-select-wrap{
  display:block !important;
  width:92% !important;
  max-width:330px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  align-self:center !important;
}
#gate .panel #loginMemberTrigger.login-member-trigger{
  width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
  justify-content:center !important;
  text-align:center !important;
}
#gate .panel #loginMemberTrigger .login-member-trigger-label{
  width:100% !important;
  min-width:0 !important;
  text-align:center !important;
}

/* Offline Songbook must visually belong to the same segmented card.
   These ID-scoped resets intentionally outrank older Songbook/theme button
   rules that can otherwise re-add a rounded border and make it look nested. */
#gate #loginSecondaryActions.login-secondary-actions{
  overflow:hidden !important;
}
#gate #loginSecondaryActions #htnsSongbookOfflineEntry.htns-songbook-offline-entry,
html.htns-theme-v234 #gate #loginSecondaryActions #htnsSongbookOfflineEntry.htns-songbook-offline-entry,
html.htns-theme-v234 #gate .panel #loginSecondaryActions #htnsSongbookOfflineEntry.htns-songbook-offline-entry{
  position:relative !important;
  inset:auto !important;
  width:100% !important;
  min-width:0 !important;
  height:46px !important;
  min-height:46px !important;
  max-height:46px !important;
  align-self:stretch !important;
  margin:0 !important;
  padding:0 5px !important;
  border:0 !important;
  border-radius:0 !important;
  outline-offset:-2px !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
  transform:none !important;
  color:#173b63 !important;
  text-shadow:none !important;
  appearance:none !important;
  -webkit-appearance:none !important;
}
#gate #loginSecondaryActions #htnsSongbookOfflineEntry.htns-songbook-offline-entry.show{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#gate #loginSecondaryActions #htnsSongbookOfflineEntry.htns-songbook-offline-entry:hover{
  background:rgba(225,239,248,.62) !important;
}
#gate #loginSecondaryActions #htnsSongbookOfflineEntry.htns-songbook-offline-entry:active{
  background:rgba(207,228,241,.72) !important;
  box-shadow:none !important;
  transform:none !important;
}

/* Explicitly keep the single divider between language and Songbook, so the
   third action reads as one segment of the same outer card. */
#gate #loginSecondaryActions.has-offline #langBar{
  border-right:1px solid #d4e0e9 !important;
}
#gate #loginSecondaryActions.has-offline #htnsSongbookOfflineEntry{
  border-left:0 !important;
}

@media(max-width:390px){
  #gate .panel #nameWrap.login-select-wrap{
    width:92% !important;
    max-width:330px !important;
  }
}

/* HTNS v265 — requested micro-polish.
   - Add the missing divider between Guest Mode and the language segment.
   - Make Guest Mode regular weight instead of bold.
   All login behavior remains unchanged. */
#gate #loginSecondaryActions #btnGuest{
  border-right:1px solid #d4e0e9 !important;
  font-weight:500 !important;
}
#gate #loginSecondaryActions #btnGuest #btnGuestLabel{
  font-weight:500 !important;
}
#gate #loginSecondaryActions #langBar{
  border-right:1px solid #d4e0e9 !important;
}
#gate #loginSecondaryActions:not(.has-offline) #langBar{
  border-right:0 !important;
}

/* Login picker: the active .open rule outranks the legacy two-column style.
   Picker behavior and typography stay unchanged. */
html #loginMemberMenu.open{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
#loginMemberMenu .login-member-option{
  min-width:0 !important;
}

/* Keep Vietnamese diacritics inside the label without resizing the picker.
   Preserve the existing single-line ellipsis and all login interactions. */
html #gate .panel #loginMemberTrigger.login-member-trigger .login-member-trigger-label{
  line-height:1.35 !important;
  padding-top:2px !important;
  padding-bottom:2px !important;
}
