<!--
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⡤⠴⠒⠒⠒⢒⡶⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⠞⠁⠀⠀⠀⠀⠀⡾⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⡴⠁⠀⠀⠀⠀⠀⠀⠀⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⠞⠁⠀⢀⣀⣀⣀⡀⠀⠀⢧⠀⠀⠀⠀⠀⡴⣄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⢀⣰⠿⠒⠋⠉⠉⠀⠀⠀⠈⠉⠓⠾⢄⣀⠀⠀⢠⡇⠸⡄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⣩⠏⠉⠒⢒⣲⡤⠤⣀⣀⠀⠀⠀⠀⠀⠈⠑⢤⡘⡄⠀⢳⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⠀
⠀⠀⠀⠀⠀⢰⠾⣣⠴⠚⠉⠉⠀⠀⠀⠀⠀⠉⠓⠀⠀⠀⠀⠀⠀⠙⣧⠀⠀⢣⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⡤⣔⡿⡍⡇
⠀⠀⠀⠀⠀⢸⡼⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⠆⠀⠀⢳⡀⠀⠀⠀⠀⠀⣀⡤⠞⠋⣡⠞⠉⠀⣇⡇
⠀⠀⠀⠀⣴⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡠⠴⠒⠛⠓⠚⠉⠉⠉⠁⠀⣴⡟⠁⠀⠀⠀⣿⠁
⠀⠀⠀⣼⣁⣠⡤⢴⠖⠒⠒⠦⠤⢴⣶⣢⠤⠤⠔⠚⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣞⡞⠀⠀⠀⠀⢰⢿⠀
⠀⠀⠀⠉⠉⢙⣦⠞⠀⡠⠞⠉⢉⡷⡄⠉⢙⡶⠃⠀⠀⠀⢀⣠⣦⣤⣄⡀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡎⡼⠀⠀⠀⠀⠀⡜⡞⠀
⠀⠀⠀⣤⡖⠛⠀⠀⡜⠁⠀⡴⢋⣀⣹⣠⠋⠀⠀⠀⠀⣰⣿⠿⠛⠛⠿⣿⣷⣄⡀⠀⠀⠀⠀⠀⡼⢰⠃⠀⠀⠀⠀⡼⢱⠃⠀
⠀⢀⣴⠛⠀⠀⠀⢼⠁⠀⣼⢁⣿⡬⣿⠃⠀⠀⠀⠀⠐⠋⠁⠀⠀⠀⠀⠀⠙⢿⣷⣄⠀⠀⠀⣸⢃⡏⠀⠀⠀⢀⡜⢡⠏⠀⠀
⠀⠸⡿⠀⠀⠀⠀⢻⡀⠀⠀⠀⠉⢠⠇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⣿⠁⣀⡜⠁⡼⠀⠀⠀⡠⠋⣰⠋⠀⠀⠀
⠀⠀⣧⠀⠀⠀⠀⠈⢳⣀⣙⣦⡤⠋⠀⠀⠀⠀⠀⠀⠀⣰⠄⠀⠀⠀⠀⠀⠀⢤⠀⣹⠌⢩⠏⢠⣇⣠⠴⠊⢀⡼⠁⠀⠀⠀⠀
⠀⠀⠘⡆⢀⡴⠖⠋⠉⠉⠀⠀⠀⠀⠀⠀⠀⠘⢧⣤⣾⣷⣿⣿⣿⣷⣦⡀⠀⢸⠀⠻⣾⠉⠀⠀⠀⠀⢀⣠⠋⠀⠀⠀⠀⠀⠀
⠀⠀⢠⡟⣥⠤⠦⠤⠤⢤⣀⣀⠀⠀⠀⠀⠀⠀⠀⠉⠁⠀⠀⠉⠛⠿⣿⣿⣄⣸⠀⠈⠻⣇⠀⢀⣀⠤⠟⠓⠃⠀⠀⠀⠀⠀⠀
⠀⠀⠸⡆⢧⡀⠀⠀⠀⠀⠀⠈⠙⠲⡄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠉⠉⠁⠀⠀⠀⣸⡍⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⢳⡄⠙⢦⡀⠀⠀⠀⣀⡤⠞⠁⠀⠀⠀⠀⢀⣀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⡿⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠙⢦⣀⣉⣷⡚⠉⠀⠀⠀⠀⠀⠀⠀⢀⡾⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⠼⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⣦⣴⠚⢁⡾⠋⠉⠳⢤⣀⢀⣀⣀⣠⠔⠋⠀⠀⠀⠀⠀⠀⣀⣠⠤⠖⠋⠁⢀⣺⣆⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⢰⣷⡇⠀⡞⠀⠀⠀⠀⠀⡼⠋⠉⠁⠀⠀⣀⣀⠤⠴⠒⠊⠉⠉⠀⠀⠀⠀⠀⣼⣿⠻⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠈⢯⡛⢦⡀⠀⠀⠀⢀⡾⠥⠤⠔⠒⠊⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠰⡆⣸⣹⠛⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⢠⡿⠀⢹⣶⣶⣖⡋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠹⡟⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⢀⡿⠿⠉⠉⠋⠀⠀⠉⠙⠶⣄⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⡀⠹⢤⣀⣀⣀⣀⣀⡠⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⡰⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠢⣄⠀⠀⠀⡀⠀⠀⠀⠀⠀⠀⠀⣼⠇⠀⠀⠀⠀⠀⠙⠋⠩⠿⢿⣁⠀⠀⠀⠀⠀⠀
⡼⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠳⡄⠀⠉⠑⠶⢤⣀⣀⣠⣴⡟⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⠿⣅⠀⠀⠀⠀⠀
⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⠂⠀⠀⠀⠀⠀⠉⠉⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⢦⠀⠀⠀⠀
⡅⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⡇⠀⠀⠀
⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣇⠀⠀⠀
⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠀⠀⠀
Yep, this project is made by a furry owo >;3 -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <meta http-equiv="X-Frame-Options" content="DENY">
    <meta http-equiv="Referrer-Policy" content="no-referrer">
    
    <link href="/static/css/main.css?v=1777713660" rel="stylesheet">
    <link href="/static/themes.php?v=1777713660" rel="stylesheet">
    <link rel="stylesheet" href="/static/js/sweetalert2.min.css?v=1747740437">
    <link rel="stylesheet" href="/static/lib/tippy/tippy.css?v=1747740437">
    <link rel="stylesheet" href="/static/css/bootstrap-icons.css?v=1747740437">

    <script src="/static/js/sweetalert2.min.js?v=1747740437" defer></script>
    <script src="/static/header_scripts.js?v=1777713660" defer></script>
    <script src="/static/js/notifications.js?v=1747740437" defer></script>
    <script src="/static/lib/tippy/popper.min.js?v=1747740437" defer></script>
    <script src="/static/lib/tippy/tippy.umd.min.js?v=1747740437" defer></script>

    <link rel="icon" type="image/png" href="/static/favicon/favicon-96x96.png" sizes="96x96" />
    <link rel="icon" type="image/svg+xml" href="/static/favicon/favicon.svg" />
    <link rel="shortcut icon" href="/static/favicon/favicon.ico" />
    <link rel="apple-touch-icon" sizes="180x180" href="/static/favicon/apple-touch-icon.png" />
    <meta name="apple-mobile-web-app-title" content="goSupertools" />

    <script>
        if (localStorage.getItem("dark-mode") === "enabled") {
            document.documentElement.classList.add("dark-mode");
        }
    </script>
    
        
        <style>
        .dark-mode body {
            background-image: url('/static/backgrounds/testt.png');
        }
    </style>
        
        
    <style>
                
            </style>
</head>
<body>
    
        
        
    <div class="topbar">
        <div class="topbar-container">
            <div class="logo-container">
                <div class="topbar-title logo">
                    <a href="/">
                        <img src="/static/logos/logo.png" alt="Logo" width="180">
                    </a>
                </div>
                <div id="banner" class="banner">
                    <div class="note" id="bannerNote">The new Marketplace is live! Be sure to check it out &lt;3 - more info in the newspost: https://gosuper.tools/news.php?id=75</div>
                    <button id="closeBanner">&times;</button>
                </div>
                <div class="topbar-subtitle">goSupertools
                </div>
            </div>
            <div class="topbar-button-container">

                <a href="/" class="topbar-button">Home</a>
                <a href="/list/" class="topbar-button">Item
                    Database</a>
                <a href="/sale/"
                    class="topbar-button">Marketplace</a>
                <a href="/list/catwalk.php"
                    class="topbar-button">Catwalk</a>
                <a href="/analyzer-v2/"
                    class="topbar-button">Wardrobe
                    Analyzer</a>

                                </div>
                <div class="topbar-links">
                    <button id="registerButton" class="profile-button"><i class="bi bi-person-plus-fill" style="font-size: 18px; font-weight: bold; margin-right: 8px;"></i>Register</button>
                    <button id="loginButton" class="log-in"><i class="bi bi-box-arrow-in-right" style="font-size: 18px; font-weight: bold; margin-right: 8px;"></i>Login</button>
                                <div class="search-container">
                    <input type="text" id="linkInput" name="searchInput" class="search-input"
                        placeholder="Enter Item Link" autocomplete="off">
                    <button id="srchButton" class="search-button">
                        <i class="bi bi-search" style="font-size: 18px; font-weight: bold;"></i>
                    </button>
                </div>

                <div id="dark-mode-toggle" class="toggle-container">
                    <div class="toggle-switch">
                        <i class="bi bi-moon-fill moon-icon" style="font-size: 18px; color: #D9D9D9;"></i>
                        <i class="bi bi-sun-fill sun-icon" style="font-size: 18px; color: #606060;"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
        <div class="footer">    
    <div class="footer-links">
        <span><a href="/item/jGIV41dXIO8kT9tSWVvOX">Random Item</a></span> | 
        <span><a href="/help/">Help</a></span> | 
        <span><a href="/help/info.php">Information</a></span> | 
        <span><a href="/help/safety.php">Safety</a></span> | 
        <span><a href="/help/terms.php">Terms</a></span> | 
        <span><a href="/help/rules.php">Rules</a></span> | 
        <span><a href="/help/thanks.php">Credits</a></span> | 
        <span><a href="/help/feedback.php">Feedback</a></span> | 
        <span><a href="/help/imprint.php">Imprint</a></span>
            </div>
    <div class="footer-note">
        <span>Thanks to © 2024 Momio Aps. All Rights Reserved. Used with permission.</span>
    </div>
</div>

<style>
    .gsm-ad-container {
        width: 100%;
        max-width: inherit;
        padding: 20px 0;
        text-align: center;
        margin: 10px auto 80px auto;
    }
    
    .gsm-ad-banner {
        background-color: var(--gst-background-columncontainer-opacity);
        border-radius: 25px;
        padding: 10px;
        display: inline-block;
        max-width: 100%;
    }
    
    .dark-mode .gsm-ad-banner {
        background-color: #2a2a2a;
        color: #e0e0e0;
    }
    
    .gsm-ad-content {
        min-height: 90px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
    }
    
    .column-container {
        margin-bottom: 100px;
    }
</style>

<title>goSupertools - Puffin. Shop :)</title>
<link rel="stylesheet" href="shop.css">
<script src="sale_shared.js" defer></script>
<style>
.swal2-btn-success  { background-color: #4CAF50 !important; }
.swal2-btn-danger   { background-color: #d33 !important; border-radius: 15px !important; }
.swal2-btn-secondary { background-color: #6c757d !important; }
.item-edit-popup .swal2-html-container { margin: 0.5em 1em; }
.swal2-title        { font-size: 1.5em !important; }
.swal2-html-container { font-size: 13px !important; }
.swal2-popup input, .swal2-popup textarea, .swal2-popup label, .swal2-popup select { font-size: 13px !important; }
.swal2-confirm, .swal2-cancel, .swal2-deny { font-size: 14px !important; }
</style>
<script>
const shop = {
    openEditPopup(i = null) {
        const shopData = {"name":"Puffin. Shop :)","desc":"X","public":1};

        if (i === null) {
            Swal.fire({
                title: 'Edit Shop',
                html: `
                    <div style="text-align:left;padding:5px 10px">
                        <label for="n" style="font-weight:600;margin-bottom:3px;display:block">Shop Name</label>
                        <input id="n" class="swal2-input" value="${shopData.name}" maxlength="60"
                               style="width:100%;margin:5px 0 10px 0;padding:6px;border-radius:6px;border:1px solid #ddd">
                        <label for="d" style="font-weight:600;margin-bottom:3px;display:block">Description</label>
                        <textarea id="d" class="swal2-textarea" rows="3" maxlength="240"
                                  style="width:100%;margin:5px 0;padding:6px;border-radius:6px;border:1px solid #ddd;resize:none">${shopData.desc}</textarea>
                        <div style="display:flex;align-items:center;margin-top:10px">
                            <input type="checkbox" id="p" ${shopData.public == 1 ? 'checked' : ''} style="margin-right:6px;width:14px;height:14px">
                            <label for="p" style="margin:0;cursor:pointer;font-size:12px">Make Shop Public</label>
                        </div>
                    </div>
                    <div style="font-size:11px;margin-top:10px;background:#f8f9fa;padding:6px;border-radius:6px;color:#666">
                        <b>NOTE:</b> Inactive shops will be deleted after one month
                    </div>`,
                background: '#ffffff',
                showCancelButton: true,
                confirmButtonText: 'Save Changes',
                cancelButtonText: 'Cancel',
                showDenyButton: true,
                denyButtonText: 'Delete Shop',
                denyButtonColor: '#d33',
                confirmButtonColor: '#4CAF50',
                cancelButtonColor: '#6c757d',
                focusConfirm: false,
                customClass: {
                    confirmButton: 'swal2-btn-success',
                    cancelButton: 'swal2-btn-secondary',
                    denyButton: 'swal2-btn-danger'
                },
                preConfirm: () => ({
                    shop_name: document.getElementById('n').value.trim(),
                    shop_description: document.getElementById('d').value.trim(),
                    makeshopPublic: document.getElementById('p').checked
                })
            }).then(r => {
                if (r.isConfirmed) this.saveShop(r.value);
                if (r.isDenied)    this.deleteShop();
            });
        } else {
            const itemData = this.getItemData(i);
            Swal.fire({
                title: `Edit Item ${i}`,
                width: 420,
                html: `
                    <div style="text-align:left;padding:5px 0">
                        <label for="link" style="font-weight:600;margin-bottom:5px;display:block">Item Link</label>
                        <input id="link" class="swal2-input" value="${itemData.itemLink || ''}"
                               placeholder="https://gosupermodel.com/item/s__4Y209KSmz"
                               oninput="updatePreview(this)"
                               style="width:100%;margin:5px 0;border-radius:6px;border:1px solid #ddd">
                        <div id="preview" style="margin:12px 0;min-height:90px;display:flex;justify-content:center;align-items:center;background:#f8f9fa;border-radius:8px"></div>
                        <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0">
                            <div>
                                <label for="gm" style="font-weight:600;margin-bottom:3px;display:block">goMoney</label>
                                <div style="display:flex;align-items:center">
                                    <img src="../static/icons/money.png" style="width:16px;height:16px;margin-right:5px">
                                    <input id="gm" class="swal2-input" style="flex:1;margin:0;padding:3px;height:24px;border-radius:4px;border:1px solid #ddd;font-size:12px;width:50%"
                                           oninput="this.value=this.value.replace(/[^0-9]/g,'')" value="${itemData.goMoney || ''}" maxlength="7">
                                </div>
                            </div>
                            <div>
                                <label for="dia" style="font-weight:600;margin-bottom:3px;display:block">Diamonds</label>
                                <div style="display:flex;align-items:center">
                                    <img src="../static/icons/dia.png" style="width:16px;height:16px;margin-right:5px">
                                    <input id="dia" class="swal2-input" style="flex:1;margin:0;padding:3px;height:24px;border-radius:4px;border:1px solid #ddd;font-size:12px;width:50%"
                                           oninput="this.value=this.value.replace(/[^0-9]/g,'')" value="${itemData.diamonds || ''}" maxlength="6">
                                </div>
                            </div>
                            <div>
                                <label for="vip" style="font-weight:600;margin-bottom:3px;display:block">VIP days</label>
                                <div style="display:flex;align-items:center">
                                    <img src="../static/icons/vip.png" style="width:16px;height:16px;margin-right:5px">
                                    <input id="vip" class="swal2-input" style="flex:1;margin:0;padding:3px;height:24px;border-radius:4px;border:1px solid #ddd;font-size:12px;width:50%"
                                           oninput="this.value=this.value.replace(/[^0-9]/g,'')" value="${itemData.vipDays || ''}" maxlength="6">
                                </div>
                            </div>
                            <div>
                                <label for="greet" style="font-weight:600;margin-bottom:3px;display:block">Greetings</label>
                                <div style="display:flex;align-items:center">
                                    <img src="../static/icons/greet.png" style="width:16px;height:16px;margin-right:5px">
                                    <input id="greet" class="swal2-input" style="flex:1;margin:0;padding:3px;height:24px;border-radius:4px;border:1px solid #ddd;font-size:12px;width:50%"
                                           oninput="this.value=this.value.replace(/[^0-9]/g,'')" value="${itemData.greetings || ''}" maxlength="6">
                                </div>
                            </div>
                        </div>
                        <div style="display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:10px;background:#f8f9fa;padding:8px;border-radius:6px;color:#333">
                            <div style="display:flex;align-items:center">
                                <input type="checkbox" id="off" ${itemData.makeAnOffer ? 'checked' : ''} style="margin-right:6px;width:14px;height:14px">
                                <label for="off" style="margin:0;cursor:pointer;font-size:12px">Make an Offer</label>
                            </div>
                            <div style="display:flex;align-items:center">
                                <input type="checkbox" id="sold" ${itemData.markAsSold ? 'checked' : ''} style="margin-right:6px;width:14px;height:14px">
                                <label for="sold" style="margin:0;cursor:pointer;font-size:12px">Mark as Sold</label>
                            </div>
                            <div style="display:flex;align-items:center">
                                <input type="checkbox" id="res" ${itemData.reserved ? 'checked' : ''} style="margin-right:6px;width:14px;height:14px">
                                <label for="res" style="margin:0;cursor:pointer;font-size:12px">Reserved</label>
                            </div>
                            <div style="display:flex;align-items:center">
                                <input type="checkbox" id="both" ${itemData.bothlayer ? 'checked' : ''} style="margin-right:6px;width:14px;height:14px">
                                <label for="both" style="margin:0;cursor:pointer;font-size:12px">Include Backlayer</label>
                            </div>
                        </div>
                    </div>`,
                background: '#ffffff',
                showCancelButton: true,
                confirmButtonText: 'Save Item',
                cancelButtonText: 'Cancel',
                showDenyButton: true,
                denyButtonText: 'Clear Item',
                denyButtonColor: '#d33',
                confirmButtonColor: '#4CAF50',
                cancelButtonColor: '#6c757d',
                focusConfirm: false,
                customClass: {
                    confirmButton: 'swal2-btn-success',
                    cancelButton: 'swal2-btn-secondary',
                    denyButton: 'swal2-btn-danger',
                    container: 'item-edit-popup'
                },
                didOpen: () => updatePreview(document.getElementById('link')),
                preConfirm: () => {
                    const itemLink = document.getElementById('link').value.trim();
                    if (itemLink && !validateItemLink(itemLink)) {
                        Swal.showValidationMessage('Item link must start with "https://gosupermodel.com/item/" or "https://gosuper.tools/item/"');
                        return false;
                    }
                    return {
                        itemLink,
                        goMoney:     document.getElementById('gm').value.trim(),
                        diamonds:    document.getElementById('dia').value.trim(),
                        vipDays:     document.getElementById('vip').value.trim(),
                        greetings:   document.getElementById('greet').value.trim(),
                        makeAnOffer: document.getElementById('off').checked,
                        markAsSold:  document.getElementById('sold').checked,
                        reserved:    document.getElementById('res').checked,
                        bothlayer:   document.getElementById('both').checked
                    };
                }
            }).then(r => {
                if (r.isConfirmed) this.saveItem(i, r.value);
                if (r.isDenied)    this.clearItem(i);
            });
        }
    },

    getItemData(num) {
        const items = [];
        const def   = { itemLink:'', goMoney:'', diamonds:'', vipDays:'', greetings:'',
                        makeAnOffer:false, markAsSold:false, reserved:false, bothlayer:false };
        if (!items[num]) return def;
        const item = items[num];
        if (!item.itemLink) {
            if (item.back_uiid && item.back_uiid !== 'null') {
                item.itemLink = 'https://gosupermodel.com/item/' + item.back_uiid.substr(0, 12);
            } else if (item.front_uiid) {
                item.itemLink = 'https://gosupermodel.com/item/' + item.front_uiid.substr(0, 12);
            }
        }
        return item;
    },

    saveShop(data) {
        if (!data.shop_name || !data.shop_description) {
            return Swal.fire({ icon:'error', text:'Please fill in all required fields' });
        }
        Swal.showLoading();
        fetch('../api/sale/save_item.php', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({
                id: 5863,
                shop_name: data.shop_name,
                shop_description: data.shop_description,
                makeshopPublic: data.makeshopPublic
            })
        })
        .then(r => r.json())
        .then(res => {
            if (!res.success) return Swal.fire({ icon:'error', text:res.message });
            Swal.fire({ icon:'success', title:'Shop saved!', showConfirmButton:false, timer:1200, timerProgressBar:true,
                        willClose: () => location.reload() });
        })
        .catch(() => Swal.fire({ icon:'error', text:'An error occurred' }));
    },

    deleteShop() {
        Swal.fire({
            title: 'Delete shop?',
            icon: 'warning',
            text: 'This will permanently delete your shop and all its items. This action cannot be undone.',
            showCancelButton: true,
            confirmButtonText: 'Yes, delete it',
            cancelButtonText: 'Cancel',
            cancelButtonColor: '#6c757d',
            confirmButtonColor: '#d33',
            focusCancel: true
        }).then(r => {
            if (!r.isConfirmed) return;
            Swal.showLoading();
            fetch('../api/sale/save_item.php', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({ id: 5863, delete: true })
            })
            .then(r => r.json())
            .then(res => {
                if (!res.success) return Swal.fire({ icon:'error', text:res.message });
                window.location.href = '/sale/';
            })
            .catch(() => Swal.fire({ icon:'error', text:'An error occurred' }));
        });
    },

    saveItem(num, data) {
        Swal.showLoading();
        fetch('../api/sale/save_item.php', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ id: 5863, item_number: num, item_data: data })
        })
        .then(r => r.json())
        .then(res => {
            if (!res.success) return Swal.fire({ icon:'error', text:res.message });
            Swal.fire({ icon:'success', title:'Item saved!', showConfirmButton:false, timer:1200, timerProgressBar:true,
                        willClose: () => location.reload() });
        })
        .catch(() => Swal.fire({ icon:'error', text:'An error occurred' }));
    },

    clearItem(num) {
        Swal.fire({
            title: 'Clear this item?',
            text: 'This will remove all data for this item slot. This action cannot be undone.',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Yes, clear it',
            cancelButtonText: 'Cancel',
            cancelButtonColor: '#6c757d',
            confirmButtonColor: '#d33',
            focusCancel: true
        }).then(r => {
            if (r.isConfirmed) this.saveItem(num, {
                itemLink:'', goMoney:'', diamonds:'', vipDays:'', greetings:'',
                makeAnOffer:false, markAsSold:false, reserved:false, bothlayer:false
            });
        });
    },

    findEmptySlot() {
        const items  = [];
        let nextSlot = 1;
        while (items[nextSlot] && nextSlot <= 100) nextSlot++;
        if (nextSlot > 100) {
            return Swal.fire({ icon:'error', title:'Maximum Items Reached', text:'You have reached the maximum limit of 100 items per shop.' });
        }
        this.openEditPopup(nextSlot);
    },

    init() {
        tippy('[data-tippy-content]');

        const owned = JSON.parse(localStorage.getItem('loggedUiids') || '[]');
        document.querySelectorAll('.owned-span').forEach(s => {
            if (owned.some(u => u.includes(s.id.replace('owned-', '')))) {
                s.classList.remove('hidden');
            }
        });

        const categoryData   = [];
        const byUiid         = {};
        categoryData.forEach(item => {
            if (!byUiid[item.uiid]) byUiid[item.uiid] = [];
            byUiid[item.uiid].push({ tags: item.tags, hex: item.hex });
        });

        const abbr = {
            'Premium Advent Calendar 2023': 'Pr. Adv. Calendar 2023',
            'Premium Advent Calendar 2024': 'Pr. Adv. Calendar 2024',
            'Premium Refreshment 2023': 'Pr. Refreshment 2023',
            'Premium Refreshment 2024': 'Pr. Refreshment 2024',
            'Premium Refreshment 2025': 'Pr. Refreshment 2025'
        };

        document.querySelectorAll('.tagcontainer').forEach(el => {
            const data = byUiid[el.getAttribute('data-uiid')]?.[0];
            if (!data) return;
            el.innerHTML          = abbr[data.tags] ?? data.tags;
            el.style.backgroundColor = data.hex || '#CC934F';
        });
    }
};

document.addEventListener('DOMContentLoaded', () => shop.init());
</script>
</head>

<body>
<div class="column-container">
<a href="/help/help.php?id=8"><div id="questionIcon">Help</div></a>
        <div class='shop-info'>
    <div class='modelBox'><img src='https://gosupermodel.com/dollservlet.png?model=8271&large=1' ></div><h3 style='margin-left:80px;'>Puffin. Shop :)</h3><p><a style='margin-left:80px;color:var(--gst-text-555);' href='/profile/?id=2938'>by Puffin.</a> <a href='https://gosupermodel.com/profiles/?id=8271' target='_blank' class='gsm-visit-btn'><i class="bi bi-box-arrow-up-right" style="font-size:15px;font-weight:bold;color:white;margin-right:8px;vertical-align:middle;"></i>Visit on GSM</a></p>    </div>

    <div class='last-updated-info'>
        <p><strong>Last Updated:</strong> 27 July 2026, 12:50</p>
    </div>

    <div class='visitorBox' data-tippy-content='Shop Visits'>
        <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='var(--gst-svg-pink)'><path d='M480-320q75 0 127.5-52.5T660-500q0-75-52.5-127.5T480-680q-75 0-127.5 52.5T300-500q0 75 52.5 127.5T480-320Zm0-72q-45 0-76.5-31.5T372-500q0-45 31.5-76.5T480-608q45 0 76.5 31.5T588-500q0 45-31.5 76.5T480-392Zm0 192q-146 0-266-81.5T40-500q54-137 174-218.5T480-800q146 0 266 81.5T920-500q-54 137-174 218.5T480-200Zm0-300Zm0 220q113 0 207.5-59.5T832-500q-50-101-144.5-160.5T480-720q-113 0-207.5 59.5T128-500q50 101 144.5 160.5T480-280Z'/></svg>
        <div style='margin-top:-2px;margin-left:2px;font-weight:bold;'>20</div>
    </div>

    <div class='shopdesc-info'>
        <p>X</p>
    </div>

    <div class='items-info'>
        </div>

</div>
</body>
</html>