/* ==========================================================================
   Kuantum — estilo de marca para la pantalla de login de Frappe.
   Cubre el /login de TODOS los sitios (POS web + Panel + tenants).

   Se carga vía `web_include_css` (todas las páginas del portal), por eso TODO
   va scopeado a la página de login: `.for-login` (y sus secciones hermanas)
   solo existen en /login, así que `body:has(.for-login)` no toca otras páginas.
   En navegadores sin :has() degrada limpio (la tarjeta/botón igual se estilizan;
   solo el fondo de pantalla completa no aplica).
   ========================================================================== */

:root {
  --kp-brand: #ee7e36;
  --kp-brand-dark: #d35f1c;
  --kp-ink: #1f2430;
}

/* Fondo blanco a pantalla completa, solo en /login */
body:has(.for-login) {
  background: #ffffff !important;
}
/* Login limpio: sin chrome del portal */
body:has(.for-login) .navbar,
body:has(.for-login) .web-footer,
body:has(.for-login) .page-footer,
body:has(.for-login) .page-breadcrumbs {
  display: none !important;
}

/* La tarjeta */
.for-login .page-card,
.for-email-login .page-card,
.for-signup .page-card,
.for-forgot .page-card,
.for-login-with-email-link .page-card {
  border-radius: 18px !important;
  border: 1px solid rgba(232, 114, 46, 0.10) !important;
  box-shadow: 0 18px 50px -12px rgba(200, 90, 28, 0.28), 0 4px 12px rgba(0, 0, 0, 0.06) !important;
  padding: 32px 30px !important;
  max-width: 400px;
}

/* Logo + título */
.page-card-head { text-align: center; }
/* logo = wordmark ancho (1164x342): mostrarlo completo, sin recortar */
.page-card-head .app-logo {
  width: auto !important;
  height: 44px !important;
  max-width: 240px;
  object-fit: contain !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 6px;
}
.page-card-head h4 {
  font-weight: 700;
  color: var(--kp-ink);
  margin-top: 14px;
}

/* Inputs */
.for-login .form-control,
.for-signup .form-control,
.for-forgot .form-control,
.for-login-with-email-link .form-control {
  border-radius: 10px !important;
  border: 1.5px solid #ececf0 !important;
  /* el padding-left deja lugar al iconito de la izquierda (no pisarlo) */
  padding: 11px 14px 11px 38px !important;
  font-size: 15px;
}
/* el campo de contraseña tiene el toggle "Mostrar" a la derecha: dejarle lugar */
.page-card .password-field .form-control {
  padding-right: 64px !important;
}
.page-card .form-control:focus {
  border-color: var(--kp-brand) !important;
  box-shadow: 0 0 0 3px rgba(232, 114, 46, 0.15) !important;
}

/* Botón primario (Entrar / Reset / etc.) */
.page-card .btn-primary,
.btn-login.btn-primary,
.btn-forgot.btn-primary {
  background: linear-gradient(135deg, var(--kp-brand), var(--kp-brand-dark)) !important;
  border: none !important;
  border-radius: 11px !important;
  padding: 12px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  box-shadow: 0 6px 16px rgba(211, 95, 28, 0.32) !important;
  transition: transform .08s ease, box-shadow .15s ease;
}
.page-card .btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(211, 95, 28, 0.42) !important;
}
.page-card .btn-primary:active { transform: translateY(0); }

/* Enlaces (olvidé contraseña, registrarse, volver) */
.page-card a,
.sign-up-message a,
.forgot-password-message a {
  color: var(--kp-brand-dark) !important;
  font-weight: 500;
}

/* Iconitos de los campos en tono de marca */
.page-card .field-icon { opacity: .6; }