<!DOCTYPE html>
<html dir="rtl" lang="he">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Diamond IL - חנות</title>
    <link rel="icon" href="favcon.ico" type="image/x-icon">
    <link rel="shortcut icon" href="favcon.ico" type="image/x-icon">
    <link rel="stylesheet" href="css/style.css">
    <style>
        body {
            background: linear-gradient(45deg, #000066, #000033);
            background-image: url('image/diamond.png');
        }
    </style>   
</head>

<body>
    <a href="https://discord.gg/DDtcXQVVuy" target="_blank" class="discord-icon">
        <img src="https://www.freeiconspng.com/uploads/discord-black-icon-1.png" alt="Discord">
    </a>

    
    <div id="bthn" lang="he"></div>
    <div class="header">
        <h1> החנות של דיימונד - אזרח</h1>
        <nav>
            <a href="home">ראשי</a>
            <a href="packages">ספיישל</a>
            <a href="crime">פשע</a>
            <a href="vehicles">רכבים</a>
            <a href="solocrime">סולו קריים</a>
            <a href="unban">ביטול באנים</a>
            <a href="rules">תקנון</a>
        </nav>
       <!--- <button class="menu-button" onclick="toggleMenu()"> -->
        <!--    &#9776;  אייקון המבורגר (שלוש קווים) -->
       <!---- </button> -->

    </div>


    <div class="cart-wrapper">

        <button class="cart-button" onclick="showCart()">
            סל קניות
            <span class="cart-count" id="cartCount">0</span>
        </button>
    </div>

    <div class="products-grid" id="products"></div>

    <div class="modal-overlay" id="modalOverlay" onclick="closeModals()"></div>

        <div id="cartModal">
            <h2>סל קניות</h2>
            <div id="cartItems"></div>
            <div class="coupon-section">
                <input type="text" id="couponCode" class="coupon-input" placeholder="הכנס קוד קופון">
                <button class="coupon-button" onclick="applyCoupon()">החל קופון</button>
                <div id="discountMessage" class="discount-text"></div>
            </div>
        <div id="cartTotal"></div>
        <form id="userDetailsForm" class="user-form" style="display: none;">
            <input type="email" id="userEmail" placeholder="אימייל" required>
            <input type="text" id="discordUsername" placeholder="שם משתמש בדיסקורד" required>
            <button type="submit">המשך לתשלום</button>
        </form> 
        <div id="paymentOptions" class="payment-options" style="display: none;">
            <div class="payment-button" onclick="handlePayment('paypal')">
                <img class="payment-logo" src="https://www.paypalobjects.com/webstatic/mktg/logo/pp_cc_mark_37x23.jpg" alt="PayPal">
                <span>שלם באמצעות PayPal</span>
            </div>
            <div class="payment-button" onclick="handlePayment('bit')">
                <img class="payment-logo" src="https://upload.wikimedia.org/wikipedia/he/thumb/e/eb/Bit_logo_2024.svg/1200px-Bit_logo_2024.svg.png" alt="Bit">
                <span> Bit - דיסקורד</span>
            </div>
        </div>
        <div style="display: flex; gap: 10px; justify-content: center; margin-top: 20px;">
            <button id="continueShoppingButton" onclick="closeModals()" class="buy-button">המשך בקניות</button>
            <button id="proceedToPaymentButton" onclick="proceedToCheckout()" class="buy-button">המשך לתשלום</button>
        </div>
    </div>

    <div id="notification"></div>

    <div class="footer">
        <p>כל הזכויות שמורות ל- דיימונד ישראל Ⓒ</p>
    </div>
    <script src="js/data.js"></script>
    <script src="js/cart.js"></script>
    <script src="js/products.js"></script>
    <script>
        // טוען את המוצרים לדף זה
        displayProducts('player');
    </script>
</body>
</html>

