/* assets/css/51_modal_login_feito.css
   
*/

/* =========================
   Modal: Login feito
   ========================= */
.modal-content.modal-login-feito{
  max-width: 760px;
  width: min(92vw, 760px);
  background: var(--modal-bg, #e9e6e6);
  border: 1px solid rgba(0,0,0,.35);
  padding: 22px 18px 16px;
  box-shadow: 0 12px 30px rgba(0,0,0,.25);
}

/* Topo: título + fechar (usa as classes já existentes) */
#modal-login-feito .login-top{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  column-gap: 14px;
  margin-bottom: 12px;
}

#modal-login-feito .login-titlebar{
  background: var(--modal-title-bg, #4c654f);
  color: var(--modal-title-color, #fff);
  font-size: 56px;
  font-weight: 300;
  line-height: 1.05;
  text-align: center;
  padding: 12px 14px;
  letter-spacing: 0px;
}

/* Linha "Login efetuado por" */
#modal-login-feito .login-feito-who{
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  border-radius: 10px;
  font-size: 22px;
  font-weight: 400;
  line-height: 1.1;
}

#modal-login-feito #loginFeitoName{
  font-weight: 700;
}

/* Botões (3 em linha) */
#modal-login-feito .login-feito-actions{
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  align-items: stretch;
}

#modal-login-feito .login-feito-btn{
  height: 54px;
  border-radius: 16px;
  font-size: 22px;
  font-weight: 300;
  padding: 10px 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space: nowrap;
}

/* Responsive */
@media (max-width: 820px){
  .modal-content.modal-login-feito{
    max-width: 560px;
    width: calc(92vw - 10px);
  }

  #modal-login-feito .login-titlebar{
    font-size: 44px;
  }

  #modal-login-feito .login-feito-who{
    font-size: 18px;
  }

  #modal-login-feito .login-feito-actions{
    grid-template-columns: 1fr;
  }

  #modal-login-feito .login-feito-btn{
    height: 54px;
    font-size: 22px;
  }
}
/* =====================================================
   LOGIN FEITO — quando NÃO há "Utilizadores"
   centra 2 botões (2 colunas)
   ===================================================== */

/* ✅ Se o botão Utilizadores estiver escondido (display:none),
   a grelha passa a 2 colunas */
#modal-login-feito .login-feito-actions:has(#btnUsersAdminFeito[style*="display:none"]),
#modal-login-feito .login-feito-actions:has(#btnUsersAdminFeito[style*="display: none"]){
  grid-template-columns: 1fr 1fr;
  justify-content: center;
}

/* opcional: garantir que os botões não ficam demasiado largos */
#modal-login-feito .login-feito-actions:has(#btnUsersAdminFeito[style*="display:none"]) .login-feito-btn,
#modal-login-feito .login-feito-actions:has(#btnUsersAdminFeito[style*="display: none"]) .login-feito-btn{
  max-width: 320px;
  justify-self: center;
  width: 100%;
}