/* Orbi 1.3 · ajustes diversos da 1.3: telas de servidores, versão no menu */

/* Arranque: a tela de acesso fica escondida até o /api/me responder (orbiBoot), para não piscar o formulário de quem já tem sessão. */
#login.orbi-boot .account-shell{ visibility:hidden; }

/* ---------- Tela de servidores: Meus servidores ---------- */
.account-servers.is-first{ max-width:860px; margin:0 auto 22px; }
.account-servers.is-first.many,.account-servers.many~.account-more,.account-servers.many~.account-migrate{ max-width:none; }
.account-servers.is-first h2{ font-size:17px; margin:0 0 12px; }
.orbi-srv-list{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
@media (min-width:900px){ .account-servers.many .orbi-srv-list{ grid-template-columns:1fr 1fr; } }
.orbi-srv{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px 14px;
  padding:14px 16px; border:1px solid var(--o-line-strong); border-radius:14px; background:var(--o-surface);
  cursor:pointer; transition:border-color .15s,background-color .15s;
}
.orbi-srv:hover{ border-color:rgba(252,173,8,.5); background:var(--o-hover); }
.orbi-srv.is-last{ border-color:var(--o-brand); background:var(--o-brand-soft); box-shadow:0 0 0 1px var(--o-brand-glow); }
.orbi-srv .trem-mark{ width:36px; height:29px; }
.orbi-srv-main{ min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; }
.orbi-srv-name{ min-width:0; max-width:100%; font-size:16px; color:var(--o-text-strong); overflow-wrap:anywhere; }
.orbi-srv-tag{ padding:2px 9px; border-radius:999px; background:var(--o-brand); color:var(--o-brand-ink); font-size:11px; font-weight:700; letter-spacing:.02em; }
.orbi-srv-meta{ flex:1 0 100%; display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; min-width:0; }
.orbi-srv-id{ color:var(--o-muted); font-size:12.5px; overflow-wrap:anywhere; }
.orbi-srv-role{ padding:1px 9px; border:1px solid var(--o-line-strong); border-radius:999px; color:var(--o-text-strong); font-size:11.5px; font-weight:600; }
.orbi-srv-role.is-owner{ background:var(--o-brand-soft); border-color:rgba(252,173,8,.5); }
.orbi-srv-online{ display:inline-flex; align-items:center; gap:6px; color:var(--o-muted); font-size:12.5px; min-width:0; }
.orbi-srv-online.on{ color:var(--o-text); }
.orbi-srv-online i{ flex:none; width:8px; height:8px; border-radius:50%; background:var(--o-faint); }
.orbi-srv-online.on i{ background:var(--o-success); box-shadow:0 0 0 3px color-mix(in srgb,var(--o-success) 26%,transparent); }
.orbi-srv-go{
  min-width:92px; min-height:44px; padding:0 20px; border:1px solid var(--o-line-strong); border-radius:11px;
  background:transparent; color:var(--o-text-strong); font:inherit; font-size:14px; font-weight:700; cursor:pointer;
}
.orbi-srv-go:hover:not(:disabled){ border-color:var(--o-brand); color:var(--o-brand-text); }
.orbi-srv-go.primary{ border-color:transparent; background:linear-gradient(120deg,#FCAD08,#E08A00); color:var(--o-brand-ink); }
.orbi-srv-go.primary:hover:not(:disabled){ color:var(--o-brand-ink); filter:brightness(1.07); }
.orbi-srv-go:disabled{ opacity:.6; cursor:wait; }
.orbi-srv-go:focus-visible{ outline:2px solid var(--o-brand-text); outline-offset:3px; }
@media (max-width:520px){
  .orbi-srv{ grid-template-columns:auto minmax(0,1fr); padding:14px; }
  .orbi-srv-go{ grid-column:1 / -1; width:100%; }
}

/* Avisos da tela de servidores: o do topo (entrar pelos cartões) e o de cada formulário. */
.account-shell .account-status{ overflow-wrap:anywhere; }
.account-shell>.account-status{ max-width:860px; margin:0 auto 14px; text-align:center; }
.account-shell>.account-status:empty{ margin:0; }
.account-form-status{ margin:0; }
.account-form-status:empty{ margin-top:-17px; }

/* ---------- Criar ou entrar em outro servidor (recolhido quando já existe servidor) ---------- */
.account-more{ max-width:860px; margin:0 auto; }
.account-more>summary,.account-migrate>summary{ cursor:pointer; }
.account-more>summary{
  list-style:none; display:flex; align-items:center; gap:12px; min-height:50px; padding:0 18px;
  border:1px solid var(--o-line-strong); border-radius:12px; color:var(--o-text-strong); font-weight:600; font-size:15px;
}
.account-more>summary::-webkit-details-marker{ display:none; }
.account-more>summary::before{
  content:''; flex:none; width:8px; height:8px; margin:0 2px 3px 2px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(-45deg); transition:transform .15s;
}
.account-more[open]>summary::before{ transform:rotate(45deg); margin-bottom:5px; }
.account-more>summary:hover{ border-color:rgba(252,173,8,.5); background:var(--o-hover); }
.account-more>summary:focus-visible,.account-migrate>summary:focus-visible{ outline:2px solid var(--o-brand-text); outline-offset:3px; }
.account-more[open]>summary{ margin-bottom:18px; }
.account-migrate{ max-width:860px; margin:22px auto 0; }

/* ---------- Abrindo o último servidor ---------- */
/* Não usa .account-panel de propósito: o Orbizinho da tela de acesso só aparece nos formulários de entrada. */
.orbi-opening{
  display:grid; justify-items:center; gap:10px; max-width:450px; margin:auto; padding:34px 28px; text-align:center;
  border:1px solid var(--o-line); border-radius:20px; background:var(--o-surface); box-shadow:var(--o-shadow);
}
.orbi-opening .trem-mark{ width:64px; height:52px; animation:orbi-opening-pulse 1.5s ease-in-out infinite; }
.orbi-opening h2{ margin:6px 0 0; font-size:21px; color:var(--o-text-strong); overflow-wrap:anywhere; }
.orbi-opening h2 b{ color:var(--o-brand-text); }
.orbi-opening .account-note{ margin:0 0 6px; }
@keyframes orbi-opening-pulse{ 0%,100%{ opacity:.55; transform:scale(.94); } 50%{ opacity:1; transform:scale(1); } }
.account-shell h1:focus{ outline:none; }

@media (prefers-reduced-motion:reduce){
  .orbi-opening .trem-mark{ animation:none; }
  .orbi-srv,.account-more>summary::before{ transition:none; }
}