/* Reserva del Mar · Acceso (login, recuperar y restablecer contraseña)
   Mantiene los colores actuales del login: fondo #f5f5f2 y botón #28695b. */
body {
  font-family: "Inter", "Karla", sans-serif;
  background-color: #f5f5f2;
  -webkit-font-smoothing: antialiased;
}
.login-card {
  border: 0;
  border-radius: 24px;
  box-shadow: 0 18px 50px rgba(36, 45, 60, .14);
  overflow: hidden;
}
.login-card-img { border-radius: 0; position: absolute; width: 100%; height: 100%; object-fit: cover; }
.login-card .card-body { padding: 42px 56px 40px; }
@media (max-width: 767px) {
  .login-card .card-body { padding: 30px 22px; }
  .login-card .col-md-5 { display: none; }
}
.login-card-description { font-size: 22px; font-weight: 600; color: #000; margin-bottom: 22px; }
.login-card label { font-weight: 600; font-size: 13px; color: #242D3C; margin-bottom: 6px; }
.login-card .form-control {
  border: 1px solid #d5dae2;
  border-radius: 12px;
  padding: 12px 16px;
  min-height: 48px;
  font-size: 14px;
  transition: border-color .15s, box-shadow .15s;
}
.login-card .form-control:focus { border-color: #28695b; box-shadow: 0 0 0 4px rgba(40, 105, 91, .15); }
.login-card .form-control::placeholder { color: #919aa3; }
.login-card .form-group { margin-bottom: 16px; }
.login-card .login-btn {
  padding: 13px 20px;
  background-color: #28695b;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  border: 0;
  box-shadow: 0 6px 16px rgba(40, 105, 91, .28);
  transition: transform .12s, box-shadow .15s, filter .15s;
}
.login-card .login-btn:hover { filter: brightness(1.05); box-shadow: 0 8px 20px rgba(40, 105, 91, .34); color: #fff; }
.login-card .login-btn:active { transform: translateY(1px); }
.login-card .login-btn:disabled { opacity: .7; }
.login-link { color: #28695b; font-weight: 600; }
.login-link:hover { color: #1f5448; text-decoration: none; }
.login-card-footer-nav a, .login-card-footer-text { font-size: 13px; color: #919aa3; }
.pass-wrap { position: relative; }
.pass-wrap .toggle-pass { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; color: #919aa3; padding: 6px; cursor: pointer; }
.rdm-hint { display: block; font-size: 12px; margin-top: 5px; }
.rdm-hint.err { color: #c0392b; }
.rdm-hint.ok { color: #2e7d32; }
.form-control.rdm-invalid { border-color: #c0392b !important; }
.rdm-meter { height: 6px; border-radius: 99px; background: rgba(0, 0, 0, .08); overflow: hidden; margin-top: 8px; }
.rdm-meter > span { display: block; height: 100%; width: 0; border-radius: 99px; transition: width .2s, background-color .2s; }
.auth-note { background: #eef3f0; border-radius: 12px; padding: 12px 14px; font-size: 13px; color: #33505a; }
.auth-ok-icon { font-size: 44px; color: #28695b; }
.btn .rdm-spin { display: inline-block; width: 12px; height: 12px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: rdmspin .7s linear infinite; vertical-align: -1px; margin-right: 6px; }
@keyframes rdmspin { to { transform: rotate(360deg); } }
.ui-pnotify .ui-pnotify-container { border-radius: 12px; }
@media (max-width: 767px) { .brand-wrapper img { width: 120px; } .login-card-description { font-size: 19px; } }