/* ==================== TLREX AUTH — dark register/login ==================== */
html:has(.authx),
body:has(.authx),
.shell:has(.authx),
.shell-main:has(.authx){
  background:#07080f !important;
}
.shell:has(.authx){border:0 !important}
.shell-main:has(.authx){
  padding:0 !important;
  min-height:100dvh !important;
}
body:has(.authx) .bottomnav,
body:has(.authx) .tgp-float{display:none !important}

/* Keep splash visible if boot is slow, on the same dark theme */
.splash{
  background:#07080f !important;
  color:#fff !important;
}

.authx{
  background:#07080f !important;
  max-width:460px;
  min-height:100dvh !important;
  margin:0 auto;
  display:flex !important;
  flex-direction:column !important;
  color:#fff !important;
  padding:0 20px calc(28px + env(safe-area-inset-bottom)) !important;
  opacity:1 !important;
  transform:none !important;
}
.authx-hero,
.kx-wordmark,
.authx-lang,
.authx-hero-sub,
.authx-hero h1,
.authx-form:before,
.authx-extras,
.authx-row-head b{
  display:none !important;
}

.tlx-auth-bar{
  display:grid;
  grid-template-columns:40px 1fr 40px;
  align-items:center;
  padding:calc(14px + env(safe-area-inset-top)) 0 22px;
}
.tlx-back{
  width:36px; height:36px;
  color:#fff;
  background:transparent;
  border:0;
  font-size:28px;
  line-height:1;
  display:grid;
  place-items:center;
  padding:0;
}
.tlx-title{
  margin:0;
  text-align:center;
  color:#fff !important;
  font-family:Inter,system-ui,sans-serif !important;
  font-size:18px !important;
  font-weight:600 !important;
  letter-spacing:.02em;
  text-transform:lowercase;
}

.authx-sheet,
.authx-form{
  opacity:1 !important;
  transform:none !important;
}
.authx-sheet{
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
  flex:1;
}
.authx-form{
  display:flex !important;
  flex-direction:column !important;
  gap:18px !important;
}
.authx-row{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
}
.authx-row-head{
  display:block !important;
  margin:0 !important;
}
.authx-row-head span{
  display:block !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}

.authx-line,
.authx .authx-line,
.authx-line:focus-within,
.authx .authx-line:focus-within,
.authx-line:hover{
  display:flex !important;
  align-items:stretch !important;
  gap:10px !important;
  background:transparent !important;
  background-color:transparent !important;
  border:0 !important;
  border-color:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
  min-height:0 !important;
  color:#fff !important;
  box-shadow:none !important;
}
.authx-cc,
.authx-line select.authx-cc{
  flex:0 0 78px !important;
  width:78px !important;
  height:52px !important;
  color:#fff !important;
  border:0 !important;
  border-radius:10px !important;
  padding:0 10px !important;
  font-size:14px !important;
  font-weight:600 !important;
  appearance:none !important;
  background-color:#14151f !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 L6 6.5 L11 1.5' fill='none' stroke='%23c9c9d4' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 10px center !important;
}
.authx-form,
.authx-line,
.authx-line input,
.authx-cc{
  color-scheme: dark;
}
.authx-line input{
  flex:1 !important;
  width:100% !important;
  height:52px !important;
  background:#14151f !important;
  background-color:#14151f !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  caret-color:#fff;
  border:0 !important;
  border-radius:10px !important;
  padding:0 16px !important;
  font-size:14px !important;
  font-weight:500 !important;
  outline:none !important;
  box-shadow:none !important;
  -webkit-tap-highlight-color:transparent;
}
.authx-line input::placeholder{color:#6b6e80 !important; -webkit-text-fill-color:#6b6e80 !important}
.authx-line input:hover,
.authx-line input:focus,
.authx-line input:focus-visible,
.authx-line input:active{
  background:#14151f !important;
  background-color:#14151f !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  outline:none !important;
  box-shadow:none !important;
}
.authx-line input:-webkit-autofill,
.authx-line input:-webkit-autofill:hover,
.authx-line input:-webkit-autofill:focus,
.authx-line input:-webkit-autofill:active{
  -webkit-text-fill-color:#fff !important;
  caret-color:#fff;
  transition:background-color 99999s ease-out 0s;
  box-shadow:0 0 0 1000px #14151f inset !important;
  -webkit-box-shadow:0 0 0 1000px #14151f inset !important;
}

.authx-eye{
  position:absolute !important;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  width:36px !important;
  height:36px !important;
  color:#8b5cf6 !important;
  background:transparent !important;
  border:0 !important;
  display:grid !important;
  place-items:center !important;
}
.authx-row:has(.authx-eye) .authx-line{position:relative}
.authx-row:has(.authx-eye) .authx-line input{padding-right:44px !important}

/* Hide OTP / verification row without JS fighting React */
.authx-up .authx-form > .authx-row:nth-of-type(4){
  display:none !important;
}

.authx .form-error{
  color:#ff4d6d !important;
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  margin:-8px 0 0 !important;
  font-size:12.5px !important;
  font-weight:600 !important;
  display:block !important;
}
.authx .form-error svg,
.authx .form-error i{display:none !important}

.authx-cta,
.authx-cta.authx-cta{
  margin-top:14px !important;
  height:52px !important;
  border:0 !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#5b7cff 0%,#7c5cff 48%,#9b5cff 100%) !important;
  color:#fff !important;
  font-family:Inter,system-ui,sans-serif !important;
  font-size:0 !important;
  font-weight:700 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  box-shadow:none !important;
}
.authx-cta:after{
  content:"Confirm";
  font-size:16px;
  font-weight:700;
  color:#fff;
}
.authx-cta:disabled{opacity:.45 !important}
.authx-cta:disabled:after{content:"Please wait…"}

.authx-switch{
  text-align:center;
  color:#6b6e80 !important;
  font-size:13px !important;
  margin-top:18px !important;
}
.authx-switch button{
  color:#8b7cff !important;
  font-weight:700 !important;
  background:none !important;
  border:0 !important;
}
/* Sign-in accepts either a local phone number or an admin username. Signup
   keeps the country selector and the phone-only validation. */
.authx-in .authx-cc{display:none!important}