/* Grama Pádel - Login basado fielmente en la referencia proporcionada */
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif}
body.login-bg{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px 16px;
  background:
    linear-gradient(rgba(9,26,39,.24),rgba(9,26,39,.24)),
    url("assets/grama-court-background.jpeg") center center/cover no-repeat fixed;
}
.login-panel{
  width:min(100%,324px);
  background:rgba(255,255,255,.97);
  border-radius:12px;
  padding:20px 19px 21px;
  box-shadow:0 6px 25px rgba(0,0,0,.20);
  text-align:center;
}
.login-brand{margin:0 auto 17px;text-align:center}
.login-brand img{
  display:block;
  width:190px;
  height:auto;
  max-height:150px;
  object-fit:contain;
  margin:0 auto;
}
.login-brand h1,.login-brand p{display:none}
.login-panel h2{
  margin:0 0 3px;
  color:#142744;
  font-size:18px;
  line-height:1.25;
  font-weight:700;
}
.login-panel .subtitle{
  margin:0 0 17px;
  color:#8290a3;
  font-size:13px;
  line-height:1.4;
}
.login-panel form{text-align:left}
.login-panel label{
  display:block;
  margin:0 0 6px;
  color:#26364e;
  font-size:13px;
  font-weight:700;
}
.login-panel input[type=email],
.login-panel input[type=password]{
  display:block;
  width:100%;
  height:41px;
  border:1px solid #d2dce8;
  border-radius:7px;
  background:#fff;
  padding:0 13px;
  color:#25364d;
  font-size:13px;
  outline:none;
  box-shadow:inset 0 1px 2px rgba(20,40,65,.03);
}
.login-panel input[type=email]:focus,
.login-panel input[type=password]:focus{
  border-color:#4d8bd3;
  box-shadow:0 0 0 2px rgba(28,101,183,.10);
}
.login-panel .field-wrap{position:relative;margin-bottom:12px}
.login-panel .field-wrap input{padding-left:43px;padding-right:35px}
.login-panel .field-icon{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  color:#8290a3;font-size:17px;line-height:1;pointer-events:none
}
.login-panel .password-toggle{
  position:absolute;right:11px;top:50%;transform:translateY(-50%);
  color:#8290a3;background:none;border:0;padding:0;cursor:pointer;font-size:15px
}
.login-options{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin:1px 0 17px;font-size:11px;color:#6d7c90
}
.login-options .remember{display:flex;align-items:center;gap:7px;margin:0;font-weight:400;white-space:nowrap}
.login-options input[type=checkbox]{width:16px;height:16px;margin:0;accent-color:#0758ad}
.login-options a{color:#0758ad;text-decoration:underline;font-size:11px;white-space:nowrap}
.login-panel .login-submit{
  width:100%;height:40px;border:0;border-radius:7px;
  color:#fff;background:#0759ad;font-size:13px;font-weight:700;
  cursor:pointer;box-shadow:0 2px 3px rgba(0,0,0,.10)
}
.login-panel .login-submit:hover{background:#064b93}
.login-panel .signup-prompt{margin:18px 0 12px;color:#8290a3;font-size:12px}
.login-panel .signup-link{
  display:flex;align-items:center;justify-content:center;width:100%;height:40px;
  border:1px solid #3982d4;border-radius:7px;background:#fff;color:#0758ad;
  font-size:13px;font-weight:700;text-decoration:none
}
.login-panel .signup-link:hover{background:#f3f8ff}
.login-panel .error{
  margin:0 0 13px;padding:10px;border-radius:7px;text-align:left;
  background:#fff0f0;color:#a32626;font-size:12px
}
@media(max-width:420px){
 body.login-bg{padding:18px 16px;background-attachment:scroll}
 .login-panel{width:min(100%,324px);padding:18px 19px 20px}
 .login-brand img{width:184px;max-height:142px}
}

.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
