/* RESET */
* {margin:0; padding:0; box-sizing:border-box;}
body {font-family: "Segoe UI", Arial, sans-serif; background:#f9f9f9;}

/* CENTER CONTAINER */
.admin-dashboard {height:100vh; display:flex; justify-content:center; align-items:center;}

/* LOGIN CARD */
.admin-form {
    width:100%; max-width:380px;
    background:#fff; padding:35px 30px;
    border-radius:12px; border:1px solid #e5e7eb;
    box-shadow:0 8px 20px rgba(0,0,0,0.08);
}

/* HEADER */
.admin-header {text-align:center; margin-bottom:20px;}
.admin-header h2 {font-size:24px; font-weight:600; color:#111827;}

/* FORM */
.admin-form form {display:flex; flex-direction:column; gap:16px;}
.admin-form input {height:45px; padding:0 14px; border:1px solid #d1d5db; border-radius:8px; font-size:14px; transition:0.2s;}
.admin-form input:focus {border-color:#2563eb; box-shadow:0 0 0 2px rgba(37,99,235,0.15); outline:none;}

/* PASSWORD FIELD WRAPPER */
.password-wrapper {position:relative;}
.password-wrapper input {width:100%; padding-right:40px;}
.password-wrapper .toggle-password {
    position:absolute;
    right:10px; top:50%;
    transform:translateY(-50%);
    cursor:pointer;
    font-size:16px; color:#888;
    transition:0.3s;
}
.password-wrapper .toggle-password:hover {color:#2563eb;}

/* BUTTON */
.admin-form button {
    height:45px; border:none; border-radius:8px;
    background:#0b1f3a; color:#fff; font-size:15px;
    font-weight:600; cursor:pointer; transition:0.3s;
}
.admin-form button:hover {background:#2563eb;}

/* MOBILE */
@media(max-width:480px){
    .admin-form {padding:25px 20px;}
    .admin-header h2 {font-size:20px;}
}