:root { --primary:#0050ff; --bg:#f4f7ff; --border:#e0e7ff; --input-bg:#fcfdff; }
    body { background:var(--bg); font-family:'Segoe UI',sans-serif; display:flex; justify-content:center; align-items:center; min-height:100vh; margin:0; padding:20px 0; }
    .card { background:#fff; width:90%; max-width:320px; padding:30px; border-radius:20px; box-shadow:0 15px 35px rgba(0,80,255,0.08); }
    
    input:-webkit-autofill,
    input:-webkit-autofill:hover, 
    input:-webkit-autofill:focus {
        -webkit-box-shadow: 0 0 0px 1000px var(--input-bg) inset !important;
        -webkit-text-fill-color: #333 !important;
        transition: background-color 5000s ease-in-out 0s;
    }

    .form-group { margin-bottom:15px; }
    label { font-size:11px; font-weight:800; color:var(--primary); margin-bottom:6px; display:block; }
    .input-box { position:relative; }
    .input-box i.left-icon { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--primary); font-size:15px; }
    .chevron { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#999; font-size:11px; }
    input { width:100%; height:50px; padding:0 42px; border:1.5px solid var(--border); border-radius:10px; font-size:14px; box-sizing:border-box; outline:none; background:var(--input-bg); }
    .input-error { border-color: #ff4d4d !important; }
    .phone-row { display:flex; height:50px; border:1.5px solid var(--border); border-radius:10px; overflow:hidden; background:var(--input-bg); transition: 0.3s; }
    .prefix { background:#f0f4ff; padding:0 10px; display:flex; align-items:center; gap:5px; font-weight:700; color:var(--primary); border-right:1.5px solid var(--border); min-width:80px; font-size:13px; }
    .btn { width:100%; height:52px; background:var(--primary); color:#fff; border:none; border-radius:10px; font-weight:700; cursor:pointer; margin-top:10px; }
    
    .login-link { text-align:center; margin-top:20px; font-size:13px; color:#666; }
    .login-link a { color:var(--primary); text-decoration:none; font-weight:700; }

    #countryModal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:1000; align-items:center; justify-content:center; }
    .modal-content { background:#fff; width:300px; border-radius:15px; height:450px; display:flex; flex-direction:column; overflow:hidden; }
    .search-box { padding:15px; border-bottom:1px solid #eee; }
    .search-box input { height:38px; padding:0 12px; font-size:13px; }
    #countryList { overflow-y:auto; flex:1; }
    .country-item { display:flex; justify-content:space-between; align-items:center; padding:12px 15px; border-bottom:1px solid #f9f9f9; cursor:pointer; font-size:13px; }
    .footer-links { text-align:center; margin-top:20px; font-size:13px; color:#666; line-height: 1.6; }

        .footer-links a { color:var(--primary); text-decoration:none; font-weight:700; }

        
        .input-box i.left-icon { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--primary); font-size:15px; }
        .forgot-link { text-align: right; margin-top: -10px; margin-bottom: 15px; }

        .forgot-link a { font-size: 11px; color: var(--primary); text-decoration: none; font-weight: 700; }