/* ═══════════════════════════════════════════════════════
   ADMIN-AUTH.CSS  —  Login & Signup
   ═══════════════════════════════════════════════════════ */
:root{--bg:#F5F6FA;--card:#FFFFFF;--accent:#D44A3C;--accent-g:linear-gradient(135deg,#E8574A,#C03A2E);--accent-soft:rgba(212,74,60,.08);--success:#22C55E;--success-soft:rgba(34,197,94,.08);--info:#6366F1;--info-soft:rgba(99,102,241,.08);--t1:#0F1120;--t2:#4B5068;--t3:#8B90A5;--t4:#B4B8CC;--border:#ECEDF2;--r:16px;--r-sm:12px;--r-xs:8px;--shadow:rgba(0,0,0,.12) 0px 1px 3px,rgba(0,0,0,.24) 0px 1px 2px;--dark:#0F1117}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;-webkit-font-smoothing:antialiased}
body{font-family:'Inter',system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--t1);line-height:1.55;min-height:100vh;display:flex}

/* layout */
.auth-page{display:flex;min-height:100vh;width:100%}
.auth-left{flex:1;display:flex;align-items:center;justify-content:center;padding:40px 20px}
.auth-right{flex:0 0 480px;background:linear-gradient(160deg,#0F1117,#1A1D2E);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 48px;position:relative;overflow:hidden}
.auth-right::before{content:'';position:absolute;top:-20%;right:-20%;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(212,74,60,.08),transparent 70%);pointer-events:none}
.auth-right::after{content:'';position:absolute;bottom:-15%;left:-15%;width:350px;height:350px;border-radius:50%;background:radial-gradient(circle,rgba(99,102,241,.06),transparent 70%);pointer-events:none}

/* left side — form */
.auth-box{width:100%;max-width:420px}
.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:36px}
.auth-brand-icon{width:46px;height:46px;border-radius:12px;display:flex;box-shadow:0 6px 18px -4px rgba(212,74,60,.45)}
.auth-brand-icon svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.auth-brand h1{font-size:1.1rem;font-weight:800;letter-spacing:-.5px}
.auth-brand p{font-size:.7rem;color:var(--t3);margin-top:1px}

.auth-heading{font-size:1.6rem;font-weight:800;letter-spacing:-.8px;margin-bottom:6px}
.auth-subtext{font-size:.84rem;color:var(--t3);margin-bottom:32px}
.auth-subtext a{color:var(--accent);text-decoration:none;font-weight:600}
.auth-subtext a:hover{text-decoration:underline}

/* form */
.auth-form{display:flex;flex-direction:column;gap:18px}
.field{display:flex;flex-direction:column;gap:6px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field label{font-size:.76rem;font-weight:600;color:var(--t2)}
.field label .req{color:var(--accent)}
.field-input{position:relative}
.field-input svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:var(--t4);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.field-input input{width:100%;padding:12px 14px 12px 44px;background:var(--card);border:1.5px solid var(--border);border-radius:var(--r-sm);font-family:inherit;font-size:.88rem;font-weight:500;color:var(--t1);outline:none;transition:border-color .2s,box-shadow .2s;box-shadow:var(--shadow)}
.field-input input:focus{border-color:var(--accent);box-shadow:var(--shadow),0 0 0 4px rgba(212,74,60,.08)}
.field-input input::placeholder{color:var(--t4);font-weight:400}

/* password toggle */
/* password toggle */
.field-input .pw-toggle {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;
}

.field-input .pw-toggle svg {
    position: static;
    width: 18px;
    height: 18px;
    transform: none;
    stroke: var(--t4);
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

.field-input .pw-toggle:hover svg {
    stroke: var(--t2);
}

/* Prevent password text from going underneath eye */
.field-input input[type="password"],
.field-input input[type="text"] {
    padding-right: 48px;
}

/* remember + forgot row */
.auth-options{display:flex;align-items:center;justify-content:space-between}
.auth-check{display:flex;align-items:center;gap:8px;cursor:pointer}
.auth-check input[type="checkbox"]{width:18px;height:18px;border-radius:5px;accent-color:var(--accent);cursor:pointer}
.auth-check span{font-size:.78rem;font-weight:500;color:var(--t2)}
.auth-forgot{font-size:.78rem;font-weight:600;color:var(--accent);text-decoration:none}
.auth-forgot:hover{text-decoration:underline}

/* submit */
.auth-submit{width:100%;padding:14px;border:none;border-radius:var(--r-sm);background:var(--accent-g);color:#fff;font-family:inherit;font-size:.92rem;font-weight:700;cursor:pointer;transition:all .2s;box-shadow:0 4px 16px rgba(212,74,60,.25);letter-spacing:-.2px}
.auth-submit:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(212,74,60,.3)}
.auth-submit:active{transform:translateY(0)}

/* divider */
.auth-divider{display:flex;align-items:center;gap:14px;color:var(--t4);font-size:.72rem;font-weight:600}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--border)}

/* errors */
.auth-errors{background:var(--accent-soft);border:1px solid rgba(212,74,60,.15);border-radius:var(--r-xs);padding:12px 16px}
.auth-errors ul{list-style:none;padding:0;margin:0}
.auth-errors li{font-size:.78rem;color:var(--accent);font-weight:500;padding:2px 0;display:flex;align-items:center;gap:6px}
.auth-errors li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}

/* right side — decorative */
.auth-right-content{position:relative;z-index:1;text-align:center;color:rgba(255,255,255,.85)}
.auth-right-icon{width:80px;height:80px;border-radius:24px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;margin:0 auto 24px}
.auth-right-icon svg{width:38px;height:38px;stroke:rgba(255,255,255,.6);fill:none;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.auth-right h2{font-size:1.3rem;font-weight:800;letter-spacing:-.5px;margin-bottom:10px}
.auth-right p{font-size:.82rem;color:rgba(255,255,255,.4);line-height:1.6;max-width:320px}
.auth-features{margin-top:36px;display:flex;flex-direction:column;gap:14px;text-align:left}
.auth-feature{display:flex;align-items:center;gap:12px;padding:14px 18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:var(--r-sm)}
.auth-feature-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.auth-feature span{font-size:.78rem;color:rgba(255,255,255,.5);font-weight:500}

@media(max-width:1024px){.auth-right{display:none}.auth-left{padding:32px 20px}}
@media(max-width:540px){.auth-box{max-width:100%}.auth-heading{font-size:1.35rem}.field-row{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}