/*
 * Tam Jai Studio staging — unified xianxia button system + auth layout repair.
 * Presentation only. No forms, links, API calls, or business logic are changed.
 */
:root {
  --tj-button-gold: #f5c86b;
  --tj-button-gold-light: #ffe9aa;
  --tj-button-pink: #f12b96;
  --tj-button-magenta: #bf26dc;
  --tj-button-violet: #792ae8;
  --tj-button-night: #0b0610;
  --tj-button-radius: 14px;
}

/* Shared geometry: keep every label centered, readable, and inside its hit area. */
body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .page-link,
  .dataTables_wrapper .dataTables_paginate .paginate_button,
  .swal2-actions button,
  button:not(.btn-close):not(.navbar-toggler):not(.tj-password-toggle):not(.carousel-control-prev):not(.carousel-control-next)
) {
  position: relative !important;
  isolation: isolate;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .52rem !important;
  min-width: 0;
  max-width: 100%;
  min-height: 46px;
  padding: .68rem 1.15rem !important;
  overflow: hidden;
  border: 1px solid transparent !important;
  border-radius: var(--tj-button-radius) !important;
  color: #fff9ff !important;
  background:
    linear-gradient(118deg, var(--tj-button-violet) 0%, var(--tj-button-magenta) 45%, var(--tj-button-pink) 78%, #ef5862 100%) padding-box,
    linear-gradient(115deg, var(--tj-button-gold-light), #bb6d28 28%, #ff78ce 57%, var(--tj-button-gold-light)) border-box !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -2px 7px rgba(60,0,61,.22),
    0 0 0 1px rgba(255,191,92,.17),
    0 9px 24px rgba(91,18,135,.31),
    0 0 17px rgba(239,45,143,.12) !important;
  font-family: "Kanit", "IBM Plex Sans Thai", "Leelawadee UI", sans-serif !important;
  font-size: .94rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 7px rgba(20,2,31,.72) !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  vertical-align: middle;
  translate: none !important;
  transform: none !important;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, filter .18s ease, opacity .18s ease !important;
  -webkit-tap-highlight-color: transparent;
}

body.tamjai-v2 :is(
  input[type="submit"],
  input[type="button"],
  input[type="reset"]
) {
  min-height: 46px;
  padding: .68rem 1.15rem !important;
  border: 1px solid var(--tj-button-gold) !important;
  border-radius: var(--tj-button-radius) !important;
  color: #fff9ff !important;
  background: linear-gradient(118deg, var(--tj-button-violet), var(--tj-button-magenta) 48%, var(--tj-button-pink)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.25), 0 9px 24px rgba(91,18,135,.31), 0 0 17px rgba(239,45,143,.12) !important;
  font-family: "Kanit", "IBM Plex Sans Thai", "Leelawadee UI", sans-serif !important;
  font-size: .94rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-align: center !important;
  text-shadow: 0 1px 7px rgba(20,2,31,.72) !important;
  translate: none !important;
  transform: none !important;
  transition: border-color .18s ease, box-shadow .18s ease, filter .18s ease, opacity .18s ease !important;
}

/* Disable inherited moving shine layers; the layered border supplies the ornament. */
body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .swal2-actions button
)::before,
body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .swal2-actions button
)::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

body.tamjai-v2 :is(.btn i, .shopbtn i, .neon-button i, .tj-preset i, button i) {
  flex: 0 0 auto;
  line-height: 1;
  filter: drop-shadow(0 0 7px rgba(255,220,140,.34));
}

body.tamjai-v2 .btn-sm {
  min-height: 38px !important;
  padding: .48rem .88rem !important;
  border-radius: 12px !important;
  font-size: .82rem !important;
}

body.tamjai-v2 .btn-lg {
  min-height: 54px !important;
  padding: .82rem 1.4rem !important;
  border-radius: 17px !important;
  font-size: 1rem !important;
}

/* Dark secondary buttons from the supplied reference. */
body.tamjai-v2 :is(
  .btn-dark,
  .btn-secondary,
  .btn-thxk,
  .btn-link,
  .swal2-cancel,
  .btn-outline-primary,
  .btn-outline-danger,
  .btn-outline-success,
  .btn-outline-warning,
  .btn-outline-info,
  .btn-outline-secondary,
  .btn-outline-light,
  .btn-outline-dark
) {
  color: #fff4fc !important;
  background:
    linear-gradient(145deg, rgba(35,16,46,.97), rgba(7,3,12,.98)) padding-box,
    linear-gradient(112deg, var(--tj-button-gold-light), #a85823 30%, #ee69c4 61%, var(--tj-button-gold-light)) border-box !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 0 18px rgba(158,43,205,.1),
    0 0 0 1px rgba(238,178,79,.12),
    0 9px 23px rgba(0,0,0,.34) !important;
}

body.tamjai-v2 .btn-success {
  background:
    linear-gradient(118deg, #245746, #2f8061 54%, #55a56f) padding-box,
    linear-gradient(112deg, var(--tj-button-gold-light), #a46b2a 48%, #e9d18c) border-box !important;
}

body.tamjai-v2 .btn-warning {
  color: #2a1504 !important;
  text-shadow: 0 1px rgba(255,255,255,.4) !important;
  background:
    linear-gradient(118deg, #c78a2e, #f3c85f 58%, #ffe7a3) padding-box,
    linear-gradient(112deg, #fff0bc, #b76721 48%, #fff0bc) border-box !important;
}

body.tamjai-v2 .btn-info {
  background:
    linear-gradient(118deg, #4643a5, #7b50cf 54%, #d54cc1) padding-box,
    linear-gradient(112deg, var(--tj-button-gold-light), #9c5f2a 48%, #f08acf) border-box !important;
}

body.tamjai-v2 .btn-light {
  color: #38143c !important;
  text-shadow: none !important;
  background:
    linear-gradient(118deg, #fff9ed, #efd79f) padding-box,
    linear-gradient(112deg, #fff5c9, #b86b29 48%, #f9d98e) border-box !important;
}

/* Hover/pressed feedback changes light only, never geometry, so hit areas stay still. */
body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .page-link,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  .dataTables_wrapper .dataTables_paginate .paginate_button,
  .swal2-actions button,
  button:not(.btn-close):not(.navbar-toggler):not(.tj-password-toggle):not(.carousel-control-prev):not(.carousel-control-next)
):hover {
  color: #fff !important;
  border-color: transparent !important;
  filter: brightness(1.11) saturate(1.08) !important;
  translate: none !important;
  transform: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.31),
    inset 0 -2px 8px rgba(60,0,61,.18),
    0 0 0 1px rgba(255,224,154,.32),
    0 11px 27px rgba(91,18,135,.38),
    0 0 25px rgba(246,54,171,.25) !important;
}

body.tamjai-v2 :is(.btn-warning, .btn-light):hover,
body.tamjai-v2 :is(.btn-warning, .btn-light):active {
  color: #2a1504 !important;
}

body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .page-link,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  .swal2-actions button,
  button:not(.btn-close):not(.navbar-toggler):not(.tj-password-toggle):not(.carousel-control-prev):not(.carousel-control-next)
):active {
  filter: brightness(.94) saturate(1.03) !important;
  translate: none !important;
  transform: none !important;
  box-shadow: inset 0 3px 9px rgba(23,0,30,.42), 0 4px 12px rgba(43,0,57,.28) !important;
}

body.tamjai-v2 :is(.btn, button, input[type="submit"], input[type="button"], input[type="reset"]):focus-visible {
  outline: 2px solid var(--tj-button-gold-light) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 5px rgba(218,62,224,.2), 0 0 25px rgba(246,54,171,.28) !important;
}

body.tamjai-v2 :is(.btn, button, input[type="submit"], input[type="button"], input[type="reset"]):disabled,
body.tamjai-v2 :is(.btn, button, input[type="submit"], input[type="button"], input[type="reset"]).disabled {
  color: #9e929f !important;
  background: linear-gradient(145deg, #1a141c, #0c090e) !important;
  border-color: rgba(166,141,113,.28) !important;
  box-shadow: none !important;
  filter: grayscale(.42) !important;
  opacity: .66 !important;
  transform: none !important;
}

/* Preserve compact icon-only controls while giving them the same visual family. */
body.tamjai-v2 :is(.wuxia-action-dock button, .navbar-toggler) {
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  background:
    linear-gradient(145deg, rgba(34,13,43,.97), rgba(8,4,12,.98)) padding-box,
    linear-gradient(135deg, var(--tj-button-gold-light), #aa5d25, #f16ac4) border-box !important;
  box-shadow: inset 0 0 14px rgba(177,46,211,.11), 0 7px 18px rgba(0,0,0,.34) !important;
  translate: none !important;
  transform: none !important;
}

body.tamjai-v2 :is(.wuxia-action-dock button, .navbar-toggler):hover {
  filter: brightness(1.12) !important;
  translate: none !important;
  transform: none !important;
}

body.tamjai-v2 .wuxia-action-dock button {
  border-radius: 50% !important;
}

body.tamjai-v2 :is(.wuxia-search-close, .swal2-close) {
  display: inline-grid !important;
  place-items: center !important;
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 50% !important;
  color: #ffe5a5 !important;
  background:
    linear-gradient(145deg, rgba(34,13,43,.97), rgba(8,4,12,.98)) padding-box,
    linear-gradient(135deg, var(--tj-button-gold-light), #aa5d25, #f16ac4) border-box !important;
  box-shadow: inset 0 0 12px rgba(177,46,211,.1), 0 7px 18px rgba(0,0,0,.3) !important;
  font-size: 1.14rem !important;
  line-height: 1 !important;
  filter: none !important;
  translate: none !important;
  transform: none !important;
}

body.tamjai-v2 :is(.wuxia-search-close, .swal2-close):hover,
body.tamjai-v2 :is(.wuxia-search-close, .swal2-close):active {
  color: #fff4cd !important;
  filter: brightness(1.12) !important;
  translate: none !important;
  transform: none !important;
}

/* Login/Register repair: labels remain inside fields and never cover typed text. */
body:is(.page-login, .page-register) .form-signin,
body:is(.page-login, .page-register) .form-signin form,
body:is(.page-login, .page-register) .form-signin .text-center {
  width: 100%;
  min-width: 0;
  overflow: visible;
}

body:is(.page-login, .page-register) .form-signin .form-floating {
  position: relative !important;
  width: 100%;
  min-width: 0;
  min-height: 58px;
  overflow: visible !important;
}

body:is(.page-login, .page-register) .form-signin .tj-password-wrap {
  position: relative !important;
  display: block !important;
  width: 100%;
  min-width: 0;
  min-height: 58px;
}

body:is(.page-login, .page-register) .form-signin :is(
  .form-floating > .form-control,
  .form-floating > .tj-password-wrap > .form-control
) {
  display: block !important;
  width: 100% !important;
  height: 58px !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 1.62rem 3.15rem .42rem 1rem !important;
  border: 1px solid transparent !important;
  border-radius: 13px !important;
  color: #fff8fc !important;
  background:
    linear-gradient(145deg, rgba(14,6,20,.96), rgba(28,10,27,.94)) padding-box,
    linear-gradient(115deg, rgba(255,224,154,.82), rgba(173,73,207,.68), rgba(244,76,166,.72)) border-box !important;
  box-shadow: inset 0 2px 11px rgba(0,0,0,.34), 0 0 0 1px rgba(237,182,89,.08) !important;
  font-size: 1rem !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-overflow: ellipsis;
}

body:is(.page-login, .page-register) .form-signin .form-floating > label {
  position: absolute !important;
  z-index: 5 !important;
  top: 0 !important;
  right: 3rem !important;
  bottom: auto !important;
  left: 0 !important;
  display: flex !important;
  align-items: center;
  gap: .36rem;
  width: auto !important;
  max-width: calc(100% - 3.4rem) !important;
  height: auto !important;
  margin: 0 !important;
  padding: .43rem 1rem 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #c8b5cb !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .76rem !important;
  line-height: 1.2 !important;
  text-align: left !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 1 !important;
  pointer-events: none;
  transform: none !important;
  transform-origin: 0 0 !important;
}

body:is(.page-login, .page-register) .form-signin .form-floating:focus-within > label {
  color: #f1c9fa !important;
}

body:is(.page-login, .page-register) .form-signin .tj-password-toggle {
  position: absolute !important;
  z-index: 7 !important;
  top: 50% !important;
  right: .48rem !important;
  bottom: auto !important;
  left: auto !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #f5cd76 !important;
  background: transparent !important;
  box-shadow: none !important;
  line-height: 1 !important;
  text-shadow: 0 0 9px rgba(246,191,83,.34) !important;
  opacity: .92;
  filter: none !important;
  translate: none !important;
  transform: translateY(-50%) !important;
}

body:is(.page-login, .page-register) .form-signin .tj-password-toggle:hover,
body:is(.page-login, .page-register) .form-signin .tj-password-toggle:active {
  color: #fff0b9 !important;
  background: rgba(207,62,201,.12) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: translateY(-50%) !important;
}

body:is(.page-login, .page-register) .form-signin :is(#submit_login, #submit_register, .btn.w-100) {
  width: 100% !important;
  min-height: 50px !important;
  margin-top: .25rem !important;
}

body.page-register .tj-password-meter,
body.page-register .tj-password-hint {
  position: relative;
  z-index: 1;
  max-width: 100%;
}

@media (max-width: 575.98px) {
  body.tamjai-v2 :is(.btn, .shopbtn, .neon-button, .tj-preset, .swal2-actions button) {
    min-height: 45px;
    padding: .62rem .9rem !important;
    font-size: .89rem !important;
  }

  body:is(.page-login, .page-register) .card-body {
    padding: 20px !important;
  }

  body:is(.page-login, .page-register) .form-signin :is(
    .form-floating > .form-control,
    .form-floating > .tj-password-wrap > .form-control
  ) {
    font-size: 16px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.tamjai-v2 :is(.btn, button, input[type="submit"], input[type="button"], input[type="reset"]) {
    transition: none !important;
  }
}