/* Pantallas de acceso: entrar (pages/auth/index), recuperar contraseña (pages/login/resetcontrasena)
   y nueva contraseña / activación (pages/login/newpassword). Clases propias "ba-" para no depender
   de Bootstrap 3 ni 4 (estas vistas cargan ambos) ni de los h2 en mayúsculas del tema (color1.css). */
/* fondo gris también bajo el header fijo (deja un espacio arriba) */
body.ba-page { background: #f4f4f5; }
.ba-wrap { background: #f4f4f5; padding: 24px 16px 64px; font-family: Lato, "Helvetica Neue", Arial, sans-serif; }
.ba-card { max-width: 440px; margin: 0 auto; padding: 36px 36px 30px; background: #fff; border-radius: 14px; box-shadow: 0 1px 3px rgba(0, 0, 0, .06), 0 12px 32px rgba(0, 0, 0, .08); color: #333; }
.ba-logo { display: block; text-align: center; margin-bottom: 22px; }
.ba-logo img { height: 64px; width: auto; }
.ba-icon { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 50%; background: #fdf0e5; color: #f37e2b; font-size: 24px; }
.ba-title { margin: 0 0 6px; font-size: 24px; font-weight: 700; line-height: 1.25; text-align: center; text-transform: none; letter-spacing: 0; color: #1d1d1f; }
.ba-sub { margin: 0 0 26px; font-size: 15px; line-height: 1.5; text-align: center; color: #6b6b70; }

/* Avisos */
.ba-alert { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 20px; padding: 12px 14px; border-radius: 8px; font-size: 14px; line-height: 1.45; }
.ba-alert .fa { margin-top: 2px; font-size: 16px; }
.ba-alert p { margin: 0; }
.ba-alert-ok { background: #ecf8f0; color: #1e6b3a; border: 1px solid #c7e9d3; }
.ba-alert-err { background: #fdeeee; color: #a12a2a; border: 1px solid #f5cccc; }

/* Campos */
.ba-field { margin-bottom: 18px; }
.ba-field label { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 700; color: #333; text-transform: none; }
.ba-input { position: relative; }
.ba-input > .fa { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: #9a9aa0; font-size: 16px; pointer-events: none; }
.ba-card .ba-input input { display: block; width: 100%; height: 48px; margin: 0; padding: 0 44px 0 42px; border: 1.5px solid #d9d9de; border-radius: 8px; background: #fff; box-shadow: none; font-size: 16px; color: #1d1d1f; transition: border-color .15s, box-shadow .15s; }
.ba-card .ba-input input::placeholder { color: #a5a5ab; }
.ba-card .ba-input input:focus { outline: 0; border-color: #f37e2b; box-shadow: 0 0 0 3px rgba(243, 126, 43, .18); }
.ba-input input:focus ~ .fa { color: #f37e2b; }
.ba-input.is-invalid input { border-color: #d9534f; }
.ba-input.is-valid input { border-color: #2e9e4f; }
.ba-eye { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #8a8a90; font-size: 17px; cursor: pointer; }
.ba-eye:hover, .ba-eye:focus { color: #f37e2b; background: #fdf0e5; outline: 0; }
.ba-hint { margin: 6px 0 0; font-size: 13px; color: #8a8a90; }
.ba-error { margin: 6px 0 0; font-size: 13px; color: #c0392b; min-height: 0; }

/* Requisitos de la contraseña nueva */
.ba-reqs { list-style: none; margin: -6px 0 18px; padding: 12px 14px; border-radius: 8px; background: #f7f7f8; font-size: 13px; color: #6b6b70; }
.ba-reqs li { display: flex; align-items: center; gap: 8px; padding: 2px 0; }
.ba-reqs li .fa { width: 14px; text-align: center; color: #b5b5ba; }
.ba-reqs li.ok { color: #1e6b3a; }
.ba-reqs li.ok .fa { color: #2e9e4f; }

/* Botones */
.ba-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 48px; margin: 6px 0 0; padding: 0 20px; border: 0; border-radius: 8px; background: #f37e2b; color: #fff; font-size: 16px; font-weight: 700; letter-spacing: .02em; text-transform: none; cursor: pointer; transition: background .15s, box-shadow .15s; }
.ba-btn:hover, .ba-btn:focus { background: #dd6a18; color: #fff; outline: 0; box-shadow: 0 4px 14px rgba(243, 126, 43, .35); }
.ba-btn[disabled] { background: #f3b98f; box-shadow: none; cursor: not-allowed; }
.ba-btn .fa-spinner { display: none; }
.ba-btn.is-loading { pointer-events: none; opacity: .85; }
.ba-btn.is-loading .fa-spinner { display: inline-block; }
.ba-btn-outline { background: #fff; color: #f37e2b; border: 1.5px solid #f37e2b; }
.ba-btn-outline:hover, .ba-btn-outline:focus { background: #fdf0e5; color: #dd6a18; box-shadow: none; text-decoration: none; }

.ba-row-link { margin: -6px 0 18px; text-align: right; font-size: 14px; }
.ba-wrap a.ba-link { color: #f37e2b; font-weight: 700; text-decoration: none; }
.ba-wrap a.ba-link:hover { color: #dd6a18; text-decoration: underline; }
.ba-back { display: inline-flex; align-items: center; gap: 6px; margin-top: 20px; font-size: 14px; }
.ba-center { text-align: center; }

.ba-sep { display: flex; align-items: center; gap: 12px; margin: 26px 0 16px; font-size: 13px; color: #9a9aa0; }
.ba-sep::before, .ba-sep::after { content: ""; flex: 1; height: 1px; background: #e6e6ea; }

/* Ayuda / contacto */
.ba-help { max-width: 440px; margin: 18px auto 0; padding: 18px 20px; border-radius: 12px; background: #fff; border: 1px solid #ececef; font-size: 14px; line-height: 1.5; color: #555; text-align: center; }
.ba-help p { margin: 0 0 10px; line-height: 1.6; }
.ba-help-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; }
.ba-help-links a { display: inline-flex; align-items: center; gap: 7px; color: #333; font-weight: 700; text-decoration: none; }
.ba-help-links a .fa { color: #f37e2b; }
.ba-help-links a:hover { color: #f37e2b; text-decoration: none; }

@media (max-width: 575px) {
    .ba-wrap { padding: 16px 16px 40px; }
    .ba-card { padding: 28px 20px 24px; border-radius: 12px; }
    .ba-logo img { height: 54px; }
    .ba-title { font-size: 21px; }
}
a.ba-btn, a.ba-btn:hover, a.ba-btn:focus { text-decoration: none; }

/* Login en ventana (#login-modal de templates/footer_panel.php) */
.ba-login-modal .modal-dialog { max-width: 460px; margin-left: auto; margin-right: auto; }
.ba-login-modal .modal-content { border: 0; border-radius: 14px; overflow: hidden; }
.ba-login-modal .modal-body.ba-wrap-modal { position: relative; padding: 0; background: #fff; }
.ba-card.ba-card-modal { max-width: none; padding: 34px 30px 24px; border-radius: 0; box-shadow: none; }
.ba-login-modal .ba-close { position: absolute; top: 10px; right: 14px; z-index: 2; float: none; padding: 0; border: 0; background: transparent; color: #9a9aa0; font-size: 30px; font-weight: 400; line-height: 1; opacity: 1; text-shadow: none; }
.ba-login-modal .ba-close:hover { color: #333; }
.ba-help.ba-help-modal { margin: 22px 0 0; padding: 14px 12px 0; border: 0; border-top: 1px solid #ececef; border-radius: 0; font-size: 13.5px; }
@media (max-width: 575px) {
    .ba-login-modal .modal-dialog { margin: 12px; }
    .ba-card.ba-card-modal { padding: 30px 18px 20px; }
}

/* Resultado de la activación (views/pages/registro/registro_activado.php) */
.ba-icon.ba-icon-ok { background: #e7f6ec; color: #2e9e4f; }
.ba-icon.ba-icon-warn { background: #fdeeee; color: #c0392b; }
.ba-datos { margin: 0 0 22px; padding: 14px 16px; border-radius: 10px; background: #f7f7f8; text-align: center; }
.ba-datos-tit, .ba-datos-nota { margin: 0; font-size: 13px; color: #6b6b70; }
.ba-datos-tit { margin-bottom: 8px; }
.ba-datos-nota { margin-top: 8px; }
.ba-dato { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 7px 0; border-top: 1px solid #e6e6ea; font-size: 14px; text-align: left; }
.ba-dato:first-of-type { border-top: 0; }
.ba-dato span { color: #6b6b70; }
.ba-dato strong { color: #1d1d1f; font-size: 15px; word-break: break-all; text-align: right; }
.ba-btn.ba-btn-sep { margin-top: 12px; }
/* el mensaje de error puede traer un botón propio del controlador ("Ir al registro de cliente") */
.ba-msg .btn { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; margin-top: 4px; border: 1.5px solid #f37e2b; border-radius: 8px; background: #fff; color: #f37e2b; font-weight: 700; text-transform: none; }
.ba-msg .btn:hover { background: #fdf0e5; color: #dd6a18; }