/* ══════════════════════════════════════════════
   login.css — Night Kitchen
   Accent : vert #34d399 / #10b981
══════════════════════════════════════════════ */

/* ─── Page shell ─── */
.nk-login-page {
    min-height:100vh; background:#030f07;
    display:flex; align-items:center; justify-content:center;
    position:relative; overflow:hidden; padding:24px;
}
.nk-login-page::before {
    content:''; position:fixed; top:-200px; left:-200px;
    width:800px; height:800px;
    background:radial-gradient(circle,rgba(16,185,129,0.07) 0%,transparent 65%);
    pointer-events:none; z-index:0;
}
.nk-login-page::after {
    content:''; position:fixed; bottom:-200px; right:-200px;
    width:700px; height:700px;
    background:radial-gradient(circle,rgba(245,158,11,0.04) 0%,transparent 65%);
    pointer-events:none; z-index:0;
}

/* ─── Card ─── */
.nk-login-card {
    max-width:440px; width:100%; position:relative; z-index:1;
    background:rgba(3,20,12,0.84); backdrop-filter:blur(24px) saturate(180%);
    -webkit-backdrop-filter:blur(24px) saturate(180%);
    border:1px solid rgba(255,255,255,0.08); border-radius:28px;
    overflow:hidden; padding:40px 36px 36px;
    box-shadow:0 40px 100px rgba(0,0,0,0.5);
}
.nk-login-card::before {
    content:''; position:absolute; top:0; left:0; right:0; height:2px;
    background:linear-gradient(90deg,transparent,#34d399,#10b981,transparent);
    opacity:0.8;
}

/* ─── Brand ─── */
.nk-login-brand { text-align:center; margin-bottom:32px; }
.nk-login-emoji { font-size:52px; display:block; margin-bottom:12px; }
.nk-login-title {
    font-family:'Poppins',sans-serif; font-size:26px; font-weight:900;
    color:#fff; letter-spacing:-0.5px;
}
.nk-login-sub { font-size:13px; color:rgba(255,255,255,0.55); margin-top:6px; }

/* ─── Form ─── */
.nk-login-form { display:flex; flex-direction:column; gap:20px; }
.nk-login-fields { display:flex; flex-direction:column; gap:18px; }
.nk-login-field { display:flex; flex-direction:column; }
.nk-login-field-header {
    display:flex; justify-content:space-between; align-items:center;
    margin-bottom:7px;
}

/* ─── Error ─── */
.nk-login-error {
    background:rgba(239,68,68,0.10); border:1px solid rgba(239,68,68,0.25);
    border-radius:14px; padding:12px 16px; font-size:13px; font-weight:700;
    color:#f87171; display:flex; align-items:center; gap:8px;
}

/* ─── Label ─── */
.nk-login-label {
    display:block; font-family:'Poppins',sans-serif; font-size:9px; font-weight:700;
    color:rgba(52,211,153,0.55); text-transform:uppercase; letter-spacing:1.5px;
    margin-bottom:7px;
}
.nk-login-field-header .nk-login-label { margin-bottom:0; }

/* ─── Input ─── */
.nk-login-input {
    width:100%; background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.12); border-radius:12px;
    padding:12px 16px; font-family:'DM Sans',sans-serif;
    font-size:14px; font-weight:500; color:#fff; outline:none; transition:all 0.2s;
}
.nk-login-input::placeholder { color:rgba(255,255,255,0.20); }
.nk-login-input:focus {
    background:rgba(255,255,255,0.08); border-color:#34d399;
    box-shadow:0 0 0 3px rgba(52,211,153,0.10);
}
.nk-login-input-wrap { position:relative; }
.nk-login-input-pwd { padding-right:48px; }

/* ─── Password toggle ─── */
.nk-pwd-toggle {
    position:absolute; right:12px; top:50%; transform:translateY(-50%);
    background:none; border:none; color:rgba(255,255,255,0.35);
    cursor:pointer; padding:4px; transition:color 0.15s;
    display:flex; align-items:center; z-index:20;
}
.nk-pwd-toggle:hover { color:#34d399; }
.nk-pwd-toggle svg { width:22px; height:22px; }

/* ─── Forgot link ─── */
.nk-login-forgot { display:flex; justify-content:flex-end; margin-top:8px; }
.nk-login-link {
    color:#34d399; font-weight:700; font-size:11px;
    text-decoration:none; transition:color 0.15s;
}
.nk-login-link:hover { color:#6ee7b7; text-decoration:underline; }

/* ─── Submit ─── */
.nk-login-submit {
    width:100%; padding:14px; border:none; border-radius:14px;
    background:linear-gradient(135deg,#34d399,#10b981);
    font-family:'Poppins',sans-serif; font-size:15px; font-weight:800;
    color:#041a0a; cursor:pointer; transition:all 0.2s;
    box-shadow:0 4px 20px rgba(52,211,153,0.25);
}
.nk-login-submit:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(52,211,153,0.40); }

/* ─── Social Login & Divider ─── */
.nk-login-divider {
    display: flex; align-items: center; margin: 24px 0;
    color: rgba(255,255,255,0.3); font-family: 'Poppins', sans-serif;
    font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px;
}
.nk-login-divider::before, .nk-login-divider::after {
    content: ''; flex: 1; height: 1px; background: rgba(255,255,255,0.1);
}
.nk-login-divider span { padding: 0 14px; }

.nk-login-google {
    display: flex; align-items: center; justify-content: center; gap: 12px;
    width: 100%; padding: 14px; border-radius: 14px;
    background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12);
    color: #fff; font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 700;
    text-decoration: none; transition: all 0.2s;
}
.nk-login-google:hover {
    background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.25);
    transform: translateY(-1px);
}

.nk-login-signup {
    text-align: center; margin-top: 24px; font-size: 13px; color: rgba(255,255,255,0.5);
    font-family: 'DM Sans', sans-serif;
}
.nk-login-signup a {
    color: #34d399; font-weight: 700; text-decoration: none; transition: color 0.15s;
}
.nk-login-signup a:hover { color: #6ee7b7; text-decoration: underline; }


/* ═══════════════════════════════════════════════════
   LIGHT MODE — login
═══════════════════════════════════════════════════ */
[data-theme="light"] .nk-login-page { background:#f2faf5; }
[data-theme="light"] .nk-login-page::before { background:radial-gradient(circle,rgba(16,185,129,0.06) 0%,transparent 65%); }

[data-theme="light"] .nk-login-card {
    background:rgba(255,255,255,0.92);
    border-color:rgba(52,211,153,0.18);
    box-shadow:0 12px 50px rgba(0,0,0,0.10);
}
[data-theme="light"] .nk-login-card::before { opacity:0.5; }

[data-theme="light"] .nk-login-title { color:#0a1f12; }
[data-theme="light"] .nk-login-sub { color:rgba(10,31,18,0.50); }
[data-theme="light"] .nk-login-label { color:rgba(5,150,105,0.65); }

[data-theme="light"] .nk-login-input {
    background:rgba(255,255,255,0.95);
    border-color:rgba(10,31,18,0.12);
    color:#0a1f12;
}
[data-theme="light"] .nk-login-input::placeholder { color:rgba(10,31,18,0.28); }
[data-theme="light"] .nk-login-input:focus {
    background:#fff;
    border-color:rgba(52,211,153,0.45);
    box-shadow:0 0 0 3px rgba(52,211,153,0.09);
}

[data-theme="light"] .nk-login-error {
    background:rgba(239,68,68,0.06);
    border-color:rgba(239,68,68,0.20);
    color:#dc2626;
}

[data-theme="light"] .nk-pwd-toggle { color:rgba(10,31,18,0.30); }
[data-theme="light"] .nk-pwd-toggle:hover { color:#059669; }

[data-theme="light"] .nk-login-link { color:#059669; }
[data-theme="light"] .nk-login-link:hover { color:#065f46; }

/* Light mode pour Social Login */
[data-theme="light"] .nk-login-divider { color: rgba(10,31,18,0.4); }
[data-theme="light"] .nk-login-divider::before, [data-theme="light"] .nk-login-divider::after { background: rgba(10,31,18,0.1); }

[data-theme="light"] .nk-login-google {
    background: #fff; border-color: rgba(10,31,18,0.15); color: #0a1f12;
    box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}
[data-theme="light"] .nk-login-google:hover {
    border-color: rgba(10,31,18,0.25); box-shadow: 0 6px 16px rgba(0,0,0,0.08);
}

[data-theme="light"] .nk-login-signup { color: rgba(10,31,18,0.6); }