/*
 * Paleta Cocua para /login. Cargar DESPUÉS de public-design.css.
 * No editar public-design.css (landing).
 */
:root {
  --font-sans: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display: "Spectral", Georgia, serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --bg: #f7f5ef;
  --surface: #f7f5ef;
  --surface-2: #ece6d8;
  --text: #132a20;
  --text-muted: #5f6b63;
  --navy: #2f6b4e;
  --navy-2: #132a20;
  --navy-3: #132a20;
  --navy-soft: rgba(47, 107, 78, 0.10);
  --green: #1f8a5b;
  --green-soft: #e4f0e9;
  --border: rgba(47, 107, 78, 0.16);
  --border-strong: rgba(47, 107, 78, 0.28);
}
html.dark {
  --bg: #132a20;
  --surface: #1a3328;
  --surface-2: #1f3c30;
  --text: #f7f5ef;
  --text-muted: #c5cdc8;
  --navy: #7fbe9a;
  --navy-2: #a8d4ba;
  --green: #7fbe9a;
  --green-soft: rgba(127, 190, 154, 0.16);
  --border: rgba(247, 245, 239, 0.12);
  --border-strong: rgba(247, 245, 239, 0.22);
}

body.auth-app {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--text);
}

body.auth-app .login-wrap {
  background:
    radial-gradient(50% 60% at 50% -10%, rgba(47, 107, 78, 0.14) 0%, transparent 60%),
    var(--bg);
}
html.dark body.auth-app .login-wrap {
  background:
    radial-gradient(50% 60% at 50% -10%, rgba(127, 190, 154, 0.16) 0%, transparent 60%),
    var(--bg);
}

body.auth-app .pn-inner {
  background: rgba(247, 245, 239, 0.92);
}
html.dark body.auth-app .pn-inner {
  background: rgba(19, 42, 32, 0.92);
}

body.auth-app .pn-brand {
  gap: 0;
}
body.auth-app .login-title {
  font-family: var(--font-display);
}
body.auth-app .btn-pub.is-primary {
  background: #2f6b4e;
  border-color: #2f6b4e;
  color: #f7f5ef;
}
body.auth-app .btn-pub.is-primary:hover {
  background: #132a20;
  border-color: #132a20;
  box-shadow: 0 8px 20px rgba(47, 107, 78, 0.22);
}
body.auth-app .login-google:hover {
  box-shadow: 0 6px 16px rgba(47, 107, 78, 0.10);
}
body.auth-app .login-flash p.success {
  background: #e4f0e9;
  color: #1f8a5b;
  border-color: rgba(31, 138, 91, 0.28);
}
body.auth-app .login-error,
body.auth-app .login-flash p.error {
  background: rgba(213, 80, 58, 0.08);
  border-color: rgba(213, 80, 58, 0.32);
  color: #d5503a;
}
