@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css');

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Vazirmatn', sans-serif;
}

html, body {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background: #051815;
}

.main-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.login-frame-container {
    position: relative;
    width: 100vw;
    height: 100vh;
}

/* ==================== ورود دسکتاپ ==================== */
.bg-holder {
    width: 100%;
    height: 100%;
    background: url('https://samavie.ir/wp-content/uploads/2026/08/bg.jpg') no-repeat center center;
    background-size: 100% 100%;
}

.login-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}

.input-field {
    position: absolute;
    width: 28%;
    height: 7.5%;
    right: 12.8%;
}

.username-field { top: 38.5%; }
.password-field { top: 51.5%; display: flex; align-items: center; }

.input-field input {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    font-size: 1.1rem;
    font-weight: bold;
    color: #2b1a08 !important;
    padding: 0 50px 0 15px;
    text-align: right;
    box-shadow: none !important;
}

.input-field input:-webkit-autofill,
.input-field input:-webkit-autofill:hover, 
.input-field input:-webkit-autofill:focus, 
.input-field input:-webkit-autofill:active {
    -webkit-transition: background-color 9999s ease-in-out 0s;
    transition: background-color 9999s ease-in-out 0s;
    -webkit-text-fill-color: #2b1a08 !important;
}

.toggle-password {
    position: absolute;
    left: 12px;
    color: #0b5043;
    cursor: pointer;
    font-size: 1.2rem;
    z-index: 20;
}

.submit-hidden {
    position: absolute;
    top: 64.5%;
    right: 18.5%;
    width: 17%;
    height: 7%;
    background: transparent;
    border: none;
    cursor: pointer;
    border-radius: 40px;
    z-index: 15;
}

.register-hidden {
    position: absolute;
    bottom: 21%;
    right: 21.5%;
    width: 11%;
    height: 4%;
    background: transparent;
    cursor: pointer;
    z-index: 15;
}

/* ==================== ثبت‌نام دسکتاپ (BG2-1.jpg) ==================== */
.register-bg {
    background: url('https://samavie.ir/wp-content/uploads/2026/08/BG2-1.jpg') no-repeat center center !important;
    background-size: 100% 100% !important;
}

.reg-field input {
    font-size: 0.95rem;
    text-align: center !important;
    padding: 0 5px !important;
}

.firstname-field { top: 38.8%; right: 25.4%; width: 10.5%; height: 6.8%; }
.lastname-field  { top: 38.8%; right: 12.8%; width: 10.5%; height: 6.8%; }
.mobile-field    { top: 50.8%; right: 12.8%; width: 23.2%; height: 6.8%; }

/* اصلاح دقیق موقعیت ایمیل در دسکتاپ */
.email-field     { top: 62.8%; right: 25.4%; width: 10.5%; height: 6.8%; pointer-events: auto; z-index: 20; }
.reg-username-field { top: 62.8%; right: 12.8%; width: 10.5%; height: 6.8%; }

.reg-password-field {
    top: 74.5%;
    right: 25.4%;
    width: 10.5%;
    height: 6.8%;
    display: flex;
    align-items: center;
}

.reg-password-field .toggle-password { left: 8px; font-size: 1rem; }
.reg-submit-btn { top: 85.8%; right: 18.2%; width: 17.5%; height: 6.8%; }
.back-to-login-link { position: absolute; top: 26%; right: 12.5%; width: 25.5%; height: 8%; z-index: 20; }

/* ==================== تنظیمات اختصاصی موبایل (BG03.jpg) ==================== */
@media (max-width: 768px) {
    .bg-holder {
        background: url('https://samavie.ir/wp-content/uploads/2026/08/BG1.jpg') no-repeat center center;
        background-size: 100% 100%;
    }

    .input-field { width: 63%; height: 5.2%; right: 18.5%; }
    .username-field { top: 66.8%; }
    .password-field { top: 74.2%; }
    .input-field input { font-size: 0.95rem; padding: 0 40px 0 10px; }
    .submit-hidden { top: 80.8%; right: 33%; width: 34%; height: 4.8%; }
    .register-hidden { bottom: 11%; right: 40%; width: 20%; height: 3%; }

    /* پوستر عمودی جدید ثبت‌نام (BG03.jpg) */
    .register-bg {
        background: url('https://samavie.ir/wp-content/uploads/2026/08/BG03.jpg') no-repeat center center !important;
        background-size: 100% 100% !important;
    }

    /* سطر اول: نام (چپ) | نام خانوادگی (راست) */
    .firstname-field { top: 60.8%; right: 51.5%; width: 24.5%; height: 4.8%; }
    .lastname-field  { top: 60.8%; right: 24.0%; width: 24.5%; height: 4.8%; }

    /* سطر دوم: شماره موبایل (چپ) | نام کاربری (راست) */
    .mobile-field    { top: 68.4%; right: 51.5%; width: 24.5%; height: 4.8%; }
    .reg-username-field { top: 68.4%; right: 24.0%; width: 24.5%; height: 4.8%; }

    /* سطر سوم: رمز عبور (چپ) | ایمیل (راست) */
    .reg-password-field { top: 76.0%; right: 51.5%; width: 24.5%; height: 4.8%; }
    .email-field        { top: 76.0%; right: 24.0%; width: 24.5%; height: 4.8%; }

    /* دکمه ایجاد حساب کاربری */
    .reg-submit-btn { top: 82.8%; right: 32.0%; width: 36.0%; height: 4.8%; }

    /* لینک بازگشت به ورود */
    .back-to-login-link { top: 95.0%; right: 40.0%; width: 20.0%; height: 3.5%; }
}