/* assets/css/login.css */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
body { background: linear-gradient(135deg, var(--wl-primary), var(--wl-accent)); display: flex; align-items: center; justify-content: center; }
.login-wrap { width: 100%; max-width: 420px; padding: 20px; position: relative; }
.login-card { background: #fff; border-radius: 12px; padding: 32px 28px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); }
.logo { display: block; max-width: 120px; margin: 0 auto 20px; }
h1 { margin: 0 0 6px; text-align: center; color: var(--wl-primary); font-size: 24px; }
.subtitle { margin: 0 0 24px; text-align: center; color: #666; font-size: 14px; }
.step { display: flex; flex-direction: column; gap: 12px; }
.step.hidden { display: none; }
label { font-size: 13px; color: #555; font-weight: 600; }
input { width: 100%; padding: 14px; font-size: 18px; border: 2px solid #ddd; border-radius: 8px; outline: none; }
input:focus { border-color: var(--wl-primary); }
.btn-primary, .btn-secondary { padding: 14px; font-size: 16px; font-weight: 600; border: none; border-radius: 8px; cursor: pointer; }
.btn-primary { background: var(--wl-primary); color: #fff; }
.btn-primary:hover { background: var(--wl-accent); }
.btn-secondary { background: #eee; color: #333; }
.row { display: flex; gap: 10px; }
.row .btn-primary, .row .btn-secondary { flex: 1; }
.error { background: #fee; color: #c33; padding: 10px; border-radius: 6px; font-size: 14px; }
.error.hidden { display: none; }
.lang-switcher { position: absolute; top: 16px; right: 16px; }
.lang-switcher select { background: rgba(255,255,255,0.9); color: #111; border: 1px solid rgba(0,0,0,0.1); padding: 4px 8px; border-radius: 4px; font-size: 12px; cursor: pointer; }
.lang-switcher option { background: #fff; color: #111; }