@font-face {
    font-family: "Vazirmatn";
    src: url("../../fonts/Vazirmatn-RD-Medium.woff2") format("woff2");
    font-weight: 600;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("../../fonts/Vazirmatn-RD-Bold.woff2") format("woff2");
    font-weight: 800;
}

:root {
    --primary: #6a5af9;
    --primary-light: #8e7dff;
    --glass: rgba(255,255,255,0.25);
    --glass-border: rgba(255,255,255,0.35);
    --text-main: #2a2a2a;
    --text-soft: #666;
}

*{
    box-sizing: border-box;
    font-family: "Vazirmatn";
}

body{
    margin:0;
    min-height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    background:#eee;
    overflow:hidden;
}

/* دایره های نور پس زمینه */

body::before,
body::after{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    border-radius:50%;
    filter:blur(160px);
    opacity:0.85;
}

body::before{
    top:-150px;
    right:-100px;
    background:#8e7dff;
    animation:float1 7s ease-in-out infinite;
}

body::after{
    bottom:-150px;
    left:-100px;
    background:#6a5af9;
    animation:float2 8s ease-in-out infinite;
}

@keyframes float1{
    0%{transform:translate(0,0) scale(1);}
    50%{transform:translate(120px,80px) scale(1.15);}
    100%{transform:translate(0,0) scale(1);}
}

@keyframes float2{
    0%{transform:translate(0,0) scale(1);}
    50%{transform:translate(-120px,-70px) scale(1.15);}
    100%{transform:translate(0,0) scale(1);}
}

/* کارت فرم */

.container{
    backdrop-filter: blur(22px);
    background: var(--glass);
    border:1px solid var(--glass-border);
    border-radius:26px;
    padding:2.3rem 2rem;
    width:100%;
    max-width:360px;
    box-shadow:0 20px 60px rgba(0,0,0,0.1);
}

/* عنوان */

.container h2{
    text-align:center;
    margin-bottom:1.8rem;
    color:var(--text-main);
}

/* فیلد */

label{
    font-size:0.9rem;
    color:var(--text-main);
}

input{
    width:100%;
    padding:1rem 1.2rem;
    margin-top:0.4rem;
    margin-bottom:1.4rem;
    border-radius:14px;
    border:1px solid #ddd;
    font-size:1rem;
    background:transparent;
    outline:none;
    transition:0.25s;
}

input:focus{
    border-color:var(--primary);
    box-shadow:0 0 0 3px rgba(120,85,255,0.2);
}

/* دکمه */

button{
    width:100%;
    padding:1rem;
    border:none;
    border-radius:14px;
    background:var(--primary);
    color:white;
    font-size:1rem;
    cursor:pointer;
    transition:0.3s;
}

button:hover{
    background:var(--primary-light);
    transform:translateY(-3px);
    box-shadow:0 10px 30px rgba(120,85,255,0.3);
}

/* پیام ها */

.alert{
    padding:0.8rem 1rem;
    border-radius:12px;
    margin-bottom:1rem;
    font-size:0.9rem;
}

.alert-success{
    background:#e6ffe6;
    color:#2a8f2a;
}

.alert-danger{
    background:#ffe5e5;
    color:#c33;
}