.auth-action-btn,
.velaea-auth-btn{
  appearance:none;
  border:1px solid rgba(200,149,46,.34);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  color:var(--vc-text, #f7fbff);
  min-height:42px;
  border-radius:999px;
  padding:0 16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font:800 13px/1 Inter, 'Noto Sans Thai', sans-serif;
  cursor:pointer;
  box-shadow:0 10px 30px rgba(0,0,0,.12);
  white-space:nowrap;
}
.auth-action-btn:hover,
.velaea-auth-btn:hover{border-color:rgba(242,199,106,.7); transform:translateY(-1px)}
.auth-action-btn[data-auth-state="logged-in"]{border-color:rgba(255,104,104,.42)}
.auth-action-btn[data-auth-state="logged-in"] .auth-text,
.auth-action-btn[data-auth-state="logged-in"] #profileName{color:#ffb4b4}
.auth-dot,.profile-dot{
  width:18px;height:18px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(242,199,106,.18);color:#f2c76a;font-size:11px;font-weight:900;
}
.auth-action-btn[data-auth-state="logged-in"] .auth-dot,
.auth-action-btn[data-auth-state="logged-in"] .profile-dot{background:rgba(88,216,120,.16);color:#58d878}
.auth-action-btn[data-auth-state="guest"] .auth-dot,
.auth-action-btn[data-auth-state="checking"] .auth-dot{background:rgba(242,199,106,.18)}
html[data-theme="light"] .auth-action-btn,
body.light-mode .auth-action-btn{color:#071321;background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.70));}
.lab-profile-mini.auth-action-btn{margin-left:8px}
@media (max-width: 760px){
  .auth-action-btn,
  .velaea-auth-btn{min-height:38px;padding:0 12px;font-size:12px}
  .public-actions .auth-action-btn,.community-actions .auth-action-btn{display:none}
  .lab-profile-mini.auth-action-btn{position:relative;z-index:5;margin-left:0}
}


/* =========================================================
   Step 3.25 - Trading Community Mobile Auth Button
   Keep the auth/session button visible at the far right of the mobile header.
   ========================================================= */
.community-auth-btn.auth-action-btn{
  flex:0 0 auto;
}

@media (max-width: 760px){
  .community-actions .community-auth-btn.auth-action-btn,
  .community-actions .auth-action-btn.community-auth-btn,
  .community-actions .velaea-auth-btn.community-auth-btn{
    display:inline-flex!important;
    position:relative!important;
    z-index:145!important;
    height:40px!important;
    min-height:40px!important;
    border-radius:999px!important;
    margin-left:0!important;
    transform:none!important;
  }

  /* Logged in: compact avatar only */
  .community-auth-btn.auth-action-btn[data-auth-state="logged-in"]{
    width:40px!important;
    min-width:40px!important;
    padding:0!important;
    justify-content:center!important;
    gap:0!important;
    border-color:rgba(88,216,120,.42)!important;
    background:radial-gradient(circle at 45% 32%,rgba(88,216,120,.24),rgba(88,216,120,.08) 58%,rgba(6,17,31,.62))!important;
    box-shadow:0 0 0 1px rgba(88,216,120,.08),0 12px 28px rgba(0,0,0,.20)!important;
  }
  .community-auth-btn.auth-action-btn[data-auth-state="logged-in"] .auth-text{
    display:none!important;
  }
  .community-auth-btn.auth-action-btn[data-auth-state="logged-in"] .auth-dot{
    display:inline-flex!important;
    width:24px!important;
    height:24px!important;
    color:#7dffae!important;
    font-size:12px!important;
    font-weight:950!important;
    background:rgba(88,216,120,.16)!important;
    box-shadow:0 0 18px rgba(88,216,120,.22)!important;
  }

  /* Guest / expired: show Login clearly, not an empty A */
  .community-auth-btn.auth-action-btn[data-auth-state="guest"],
  .community-auth-btn.auth-action-btn[data-auth-state="error"]{
    width:auto!important;
    min-width:66px!important;
    padding:0 11px!important;
    justify-content:center!important;
    gap:0!important;
    border-color:rgba(242,199,106,.36)!important;
    background:linear-gradient(180deg,rgba(242,199,106,.13),rgba(242,199,106,.045))!important;
  }
  .community-auth-btn.auth-action-btn[data-auth-state="guest"] .auth-dot,
  .community-auth-btn.auth-action-btn[data-auth-state="error"] .auth-dot{
    display:none!important;
  }
  .community-auth-btn.auth-action-btn[data-auth-state="guest"] .auth-text,
  .community-auth-btn.auth-action-btn[data-auth-state="error"] .auth-text{
    display:inline!important;
    color:#f2c76a!important;
    font-size:11.5px!important;
    font-weight:950!important;
  }

  /* Checking: neutral compact state until backend confirms session */
  .community-auth-btn.auth-action-btn[data-auth-state="checking"]{
    width:40px!important;
    min-width:40px!important;
    padding:0!important;
    opacity:.55!important;
    pointer-events:none!important;
  }
  .community-auth-btn.auth-action-btn[data-auth-state="checking"] .auth-text{
    display:none!important;
  }
  .community-auth-btn.auth-action-btn[data-auth-state="checking"] .auth-dot{
    display:inline-flex!important;
    width:20px!important;
    height:20px!important;
    background:rgba(242,199,106,.16)!important;
  }

  html[data-theme="light"] .community-auth-btn.auth-action-btn[data-auth-state="logged-in"]{
    background:radial-gradient(circle at 45% 32%,rgba(88,216,120,.18),rgba(88,216,120,.07) 58%,rgba(255,255,255,.92))!important;
    border-color:rgba(5,150,105,.34)!important;
  }
  html[data-theme="light"] .community-auth-btn.auth-action-btn[data-auth-state="guest"],
  html[data-theme="light"] .community-auth-btn.auth-action-btn[data-auth-state="error"]{
    background:linear-gradient(180deg,#fff7e6,#ffffff)!important;
    border-color:rgba(184,135,43,.34)!important;
  }
  html[data-theme="light"] .community-auth-btn.auth-action-btn[data-auth-state="guest"] .auth-text,
  html[data-theme="light"] .community-auth-btn.auth-action-btn[data-auth-state="error"] .auth-text{
    color:#8a5a00!important;
  }
}

@media (max-width: 390px){
  .community-auth-btn.auth-action-btn[data-auth-state="guest"],
  .community-auth-btn.auth-action-btn[data-auth-state="error"]{
    min-width:60px!important;
    padding:0 9px!important;
  }
  .community-auth-btn.auth-action-btn[data-auth-state="guest"] .auth-text,
  .community-auth-btn.auth-action-btn[data-auth-state="error"] .auth-text{
    font-size:11px!important;
  }
}
