Shop

Running

App Files Files Community

Shveiauto commited on May 12, 2025

Commit

42fac02

verified ·

1 Parent(s): dded8ad

Update app.py

Browse files

Files changed (1) hide show

app.py +138 -195

app.py CHANGED Viewed

@@ -1,5 +1,4 @@
-# --- START OF FILE app.py ---
 from flask import Flask, render_template_string, request, redirect, url_for, send_file, flash, jsonify
 import json
@@ -18,10 +17,9 @@ import uuid
 load_dotenv()
 app = Flask(__name__)
-app.secret_key = 'your_unique_secret_key_soola_cosmetics_67890_no_login' # Secret key still needed for flash messages
 DATA_FILE = 'data.json'
 SYNC_FILES = [DATA_FILE]
 REPO_ID = "Kgshop/dakokg"
@@ -34,12 +32,10 @@ CURRENCY_CODE = 'KGS'
 CURRENCY_NAME = 'Кыргызский сом'
 DOWNLOAD_RETRIES = 3
-DOWNLOAD_DELAY = 5 # seconds
 logging.basicConfig(level=logging.INFO, format='%(asctime)s - %(levelname)s - %(message)s')
-# --- Hugging Face Sync Functions ---
 def download_db_from_hf(specific_file=None, retries=DOWNLOAD_RETRIES, delay=DOWNLOAD_DELAY):
     if not HF_TOKEN_READ and not HF_TOKEN_WRITE:
         logging.warning("HF_TOKEN_READ/HF_TOKEN_WRITE not set. Download might fail for private repos.")
@@ -139,8 +135,6 @@ def periodic_backup():
         upload_db_to_hf()
         logging.info("Periodic backup finished.")
-# --- Data Loading and Saving Functions ---
 def load_data():
     default_data = {'products': [], 'categories': [], 'orders': {}}
     try:
@@ -207,104 +201,79 @@ def save_data(data):
     except Exception as e:
         logging.error(f"Error saving data to {DATA_FILE}: {e}", exc_info=True)
-# --- Templates ---
 CATALOG_TEMPLATE = '''
     <!DOCTYPE html>
     <html lang="ru">
     <head>
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>MedinaTurkey.kz - Каталог</title>
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
         <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/10.2.0/swiper-bundle.min.css">
         <style>
             * { margin: 0; padding: 0; box-sizing: border-box; }
-            body { font-family: 'Poppins', sans-serif; background: #f0f9f4; color: #2d332f; line-height: 1.6; transition: background 0.3s, color 0.3s; }
-            body.dark-mode { background: #1a2b26; color: #c8d8d3; }
             .container { max-width: 1300px; margin: 0 auto; padding: 20px; }
-            .header { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; border-bottom: 1px solid #d1e7dd; }
-            body.dark-mode .header { border-bottom-color: #2c4a41; }
-            .header h1 { font-size: 1.8rem; font-weight: 600; color: #1C6758; }
-            .theme-toggle { background: none; border: none; font-size: 1.5rem; cursor: pointer; color: #7a8d85; transition: color 0.3s ease; }
-            .theme-toggle:hover { color: #3D8361; }
-            body.dark-mode .theme-toggle { color: #8aa39a; }
-            body.dark-mode .theme-toggle:hover { color: #55a683; }
-            .store-address { padding: 15px; text-align: center; background-color: #ffffff; margin: 20px 0; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.05); font-size: 1rem; color: #44524c; }
-            body.dark-mode .store-address { background-color: #253f37; color: #b0c8c1; }
             .filters-container { margin: 20px 0; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
             .search-container { margin: 20px 0; text-align: center; }
-            #search-input { width: 90%; max-width: 600px; padding: 12px 18px; font-size: 1rem; border: 1px solid #d1e7dd; border-radius: 25px; outline: none; box-shadow: 0 2px 5px rgba(0,0,0,0.05); transition: all 0.3s ease; }
-            body.dark-mode #search-input { background-color: #253f37; border-color: #2c4a41; color: #c8d8d3; }
-            #search-input:focus { border-color: #1C6758; box-shadow: 0 0 0 3px rgba(28, 103, 88, 0.2); }
-            body.dark-mode #search-input:focus { border-color: #3D8361; box-shadow: 0 0 0 3px rgba(61, 131, 97, 0.3); }
-            .category-filter { padding: 8px 16px; border: 1px solid #d1e7dd; border-radius: 20px; background-color: #fff; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); font-size: 0.9rem; font-weight: 400; color: #1C6758; }
-            body.dark-mode .category-filter { background-color: #253f37; border-color: #2c4a41; color: #97b7ae; }
-            .category-filter.active, .category-filter:hover { background-color: #1C6758; color: white; border-color: #1C6758; box-shadow: 0 2px 10px rgba(28, 103, 88, 0.3); }
-            body.dark-mode .category-filter.active, body.dark-mode .category-filter:hover { background-color: #3D8361; border-color: #3D8361; color: #1a2b26; box-shadow: 0 2px 10px rgba(61, 131, 97, 0.4); }
             .products-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 20px; padding: 10px; }
             @media (min-width: 600px) { .products-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } }
             @media (min-width: 900px) { .products-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); } }
-            .product { background: #fff; border-radius: 15px; padding: 0; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; height: 100%; border: 1px solid #e1f0e9;}
-            body.dark-mode .product { background: #253f37; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); border-color: #2c4a41; }
-            .product:hover { transform: translateY(-5px) scale(1.02); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12); }
-            body.dark-mode .product:hover { box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3); }
-            .product-image { width: 100%; aspect-ratio: 1 / 1; background-color: #fff; border-radius: 10px 10px 0 0; overflow: hidden; display: flex; justify-content: center; align-items: center; margin-bottom: 0; }
             .product-image img { max-width: 100%; max-height: 100%; object-fit: contain; transition: transform 0.3s ease; }
             .product-info { padding: 15px; flex-grow: 1; display: flex; flex-direction: column; justify-content: center; }
-            .product h2 { font-size: 1.1rem; font-weight: 600; margin: 0 0 8px 0; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #2d332f; }
-            body.dark-mode .product h2 { color: #c8d8d3; }
-            .product-price { font-size: 1.2rem; color: #1C6758; font-weight: 700; text-align: center; margin: 5px 0; }
-            body.dark-mode .product-price { color: #55a683; }
-            .product-description { font-size: 0.85rem; color: #7a8d85; text-align: center; margin-bottom: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-            body.dark-mode .product-description { color: #8aa39a; }
             .product-actions { padding: 0 15px 15px 15px; display: flex; flex-direction: column; gap: 8px; }
-            .product-button { display: block; width: 100%; padding: 10px; border: none; border-radius: 8px; background-color: #1C6758; color: white; font-size: 0.9rem; font-weight: 500; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); text-align: center; text-decoration: none; }
-            .product-button:hover { background-color: #164B41; box-shadow: 0 4px 15px rgba(22, 75, 65, 0.4); transform: translateY(-2px); }
             .product-button i { margin-right: 5px; }
-            .add-to-cart { background-color: #38a169; }
-            .add-to-cart:hover { background-color: #2f855a; box-shadow: 0 4px 15px rgba(47, 133, 90, 0.4); }
-            #cart-button { position: fixed; bottom: 25px; right: 25px; background-color: #1C6758; color: white; border: none; border-radius: 50%; width: 55px; height: 55px; font-size: 1.5rem; cursor: pointer; display: none; align-items: center; justify-content: center; box-shadow: 0 4px 15px rgba(28, 103, 88, 0.4); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); z-index: 1000; }
             #cart-button .fa-shopping-cart { margin-right: 0; }
-            #cart-button span { position: absolute; top: -5px; right: -5px; background-color: #38a169; color: white; border-radius: 50%; padding: 2px 6px; font-size: 0.7rem; font-weight: bold; }
-            .modal { display: none; position: fixed; z-index: 1001; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); backdrop-filter: blur(5px); overflow-y: auto; }
-            .modal-content { background: #f8fcfb; margin: 5% auto; padding: 25px; border-radius: 15px; width: 90%; max-width: 700px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); animation: slideIn 0.3s ease-out; position: relative; }
-            body.dark-mode .modal-content { background: #253f37; color: #c8d8d3; }
             @keyframes slideIn { from { transform: translateY(-30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
-            .close { position: absolute; top: 15px; right: 15px; font-size: 1.8rem; color: #aaa; cursor: pointer; transition: color 0.3s; line-height: 1; }
-            .close:hover { color: #333; }
-            body.dark-mode .close { color: #7a8d85; }
-            body.dark-mode .close:hover { color: #b0c8c1; }
-            .modal-content h2 { margin-top: 0; margin-bottom: 20px; color: #1C6758; display: flex; align-items: center; gap: 10px;}
-            body.dark-mode .modal-content h2 { color: #55a683; }
-            .cart-item { display: grid; grid-template-columns: auto 1fr auto auto; gap: 15px; align-items: center; padding: 15px 0; border-bottom: 1px solid #d1e7dd; }
-            body.dark-mode .cart-item { border-bottom-color: #2c4a41; }
             .cart-item:last-child { border-bottom: none; }
-            .cart-item img { width: 60px; height: 60px; object-fit: contain; border-radius: 8px; background-color: #fff; padding: 5px; grid-column: 1; }
             .cart-item-details { grid-column: 2; }
-            .cart-item-details strong { display: block; margin-bottom: 5px; font-size: 1rem; }
-            .cart-item-price { font-size: 0.9rem; color: #44524c; }
-            body.dark-mode .cart-item-price { color: #8aa39a; }
-            .cart-item-total { font-weight: bold; text-align: right; grid-column: 3; font-size: 1rem;}
             .cart-item-remove { grid-column: 4; background:none; border:none; color:#f56565; cursor:pointer; font-size: 1.3em; padding: 5px; line-height: 1; }
             .cart-item-remove:hover { color: #c53030; }
-            .quantity-input, .color-select { width: 100%; max-width: 180px; padding: 10px; border: 1px solid #d1e7dd; border-radius: 8px; font-size: 1rem; margin: 10px 0; box-sizing: border-box; }
-            body.dark-mode .quantity-input, body.dark-mode .color-select { background-color: #1a2b26; border-color: #2c4a41; color: #c8d8d3; }
-            .cart-summary { margin-top: 20px; text-align: right; border-top: 1px solid #d1e7dd; padding-top: 15px; }
-            body.dark-mode .cart-summary { border-top-color: #2c4a41; }
-            .cart-summary strong { font-size: 1.2rem; }
             .cart-actions { margin-top: 25px; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
             .cart-actions .product-button { width: auto; flex-grow: 1; }
-            .clear-cart { background-color: #7a8d85; }
-            .clear-cart:hover { background-color: #5e6e68; box-shadow: 0 4px 15px rgba(94, 110, 104, 0.4); }
-            .formulate-order-button { background-color: #38a169; }
-            .formulate-order-button:hover { background-color: #2f855a; box-shadow: 0 4px 15px rgba(47, 133, 90, 0.4); }
-            .notification { position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%); background-color: #38a169; color: white; padding: 10px 20px; border-radius: 20px; box-shadow: 0 4px 10px rgba(0,0,0,0.2); z-index: 1002; opacity: 0; transition: opacity 0.5s ease; font-size: 0.9rem;}
             .notification.show { opacity: 1;}
-            .no-results-message { grid-column: 1 / -1; text-align: center; padding: 40px; font-size: 1.1rem; color: #5e6e68; }
-            body.dark-mode .no-results-message { color: #8aa39a; }
             .top-product-indicator { position: absolute; top: 8px; right: 8px; background-color: rgba(255, 215, 0, 0.8); color: #333; padding: 2px 6px; font-size: 0.7rem; border-radius: 4px; font-weight: bold; z-index: 10; backdrop-filter: blur(2px); }
             .product { position: relative; }
         </style>
@@ -312,10 +281,7 @@ CATALOG_TEMPLATE = '''
     <body>
         <div class="container">
             <div class="header">
-                <h1>MedinaTurkey.kz</h1>
-                <button class="theme-toggle" onclick="toggleTheme()" aria-label="Переключить тему">
-                    <i class="fas fa-moon"></i>
-                </button>
             </div>
             <div class="store-address">Наш адрес: {{ store_address }}</div>
@@ -421,24 +387,6 @@ CATALOG_TEMPLATE = '''
             let selectedProductIndex = null;
             let cart = JSON.parse(localStorage.getItem('soolaCart') || '[]');
-            function toggleTheme() {
-                document.body.classList.toggle('dark-mode');
-                const icon = document.querySelector('.theme-toggle i');
-                const isDarkMode = document.body.classList.contains('dark-mode');
-                icon.classList.toggle('fa-moon', !isDarkMode);
-                icon.classList.toggle('fa-sun', isDarkMode);
-                localStorage.setItem('soolaTheme', isDarkMode ? 'dark' : 'light');
-            }
-            function applyInitialTheme() {
-                const savedTheme = localStorage.getItem('soolaTheme');
-                if (savedTheme === 'dark') {
-                    document.body.classList.add('dark-mode');
-                    const icon = document.querySelector('.theme-toggle i');
-                    if (icon) icon.classList.replace('fa-moon', 'fa-sun');
-                }
-            }
             function openModal(index) {
                 loadProductDetails(index);
                 const modal = document.getElementById('productModal');
@@ -462,7 +410,7 @@ CATALOG_TEMPLATE = '''
             function loadProductDetails(index) {
                 const modalContent = document.getElementById('modalContent');
                 if (!modalContent) return;
-                modalContent.innerHTML = '<p style="text-align:center; padding: 40px;">Загрузка...</p>';
                 fetch('/product/' + index)
                     .then(response => {
                         if (!response.ok) throw new Error(`Ошибка ${response.status}: ${response.statusText}`);
@@ -474,7 +422,7 @@ CATALOG_TEMPLATE = '''
                     })
                     .catch(error => {
                         console.error('Ошибка загрузки деталей продукта:', error);
-                        modalContent.innerHTML = `<p style="color: red; text-align:center; padding: 40px;">Не удалось загрузить информацию о товаре. ${error.message}</p>`;
                     });
             }
@@ -551,7 +499,7 @@ CATALOG_TEMPLATE = '''
                     return;
                  }
-                const cartItemId = `${product.name}-${color}`; // Use name + color as ID
                 const existingItemIndex = cart.findIndex(item => item.id === cartItemId);
                 if (existingItemIndex > -1) {
@@ -598,7 +546,7 @@ CATALOG_TEMPLATE = '''
                 let total = 0;
                 if (cart.length === 0) {
-                    cartContent.innerHTML = '<p style="text-align: center; padding: 20px;">Ваша корзина пуста.</p>';
                     cartTotalElement.textContent = '0.00';
                 } else {
                     cartContent.innerHTML = cart.map(item => {
@@ -690,7 +638,6 @@ CATALOG_TEMPLATE = '''
                 });
             }
             function filterProducts() {
                 const searchTerm = document.getElementById('search-input').value.toLowerCase().trim();
                 const activeCategoryButton = document.querySelector('.category-filter.active');
@@ -760,7 +707,6 @@ CATALOG_TEMPLATE = '''
                     placeholder = newPlaceholder;
                  }
                 const notification = document.createElement('div');
                 notification.className = 'notification';
                 notification.textContent = message;
@@ -777,7 +723,6 @@ CATALOG_TEMPLATE = '''
              }
             document.addEventListener('DOMContentLoaded', () => {
-                applyInitialTheme();
                 updateCartButton();
                 setupFilters();
@@ -803,8 +748,8 @@ CATALOG_TEMPLATE = '''
 PRODUCT_DETAIL_TEMPLATE = '''
     <div style="padding: 10px;">
-        <h2 style="font-size: 1.6rem; font-weight: 600; margin-bottom: 15px; text-align: center; color: #1C6758;">{{ product['name'] }}</h2>
-        <div class="swiper-container" style="max-width: 450px; margin: 0 auto 20px; border-radius: 10px; overflow: hidden; background-color: #fff;">
             <div class="swiper-wrapper">
                 {% if product.get('photos') and product['photos']|length > 0 %}
                     {% for photo in product['photos'] %}
@@ -823,15 +768,15 @@ PRODUCT_DETAIL_TEMPLATE = '''
                 {% endif %}
             </div>
             {% if product.get('photos') and product['photos']|length > 1 %}
-            <div class="swiper-pagination" style="position: relative; bottom: 5px;"></div>
-            <div class="swiper-button-next" style="color: #1C6758;"></div>
-            <div class="swiper-button-prev" style="color: #1C6758;"></div>
             {% endif %}
         </div>
-        <div style="margin-top: 20px; font-size: 1rem; line-height: 1.7;">
             <p><strong>Категория:</strong> {{ product.get('category', 'Без категории') }}</p>
-            <p style="font-size: 1.2rem; font-weight: bold; color: #1C6758;"><strong>Цена:</strong> {{ "%.2f"|format(product['price']) }} {{ currency_code }}</p>
             <p><strong>Описание:</strong><br> {{ product.get('description', 'Описание отсутствует.')|replace('\\n', '<br>')|safe }}</p>
             {% set colors = product.get('colors', []) %}
             {% if colors and colors|select('ne', '')|list|length > 0 %}
@@ -847,35 +792,35 @@ ORDER_TEMPLATE = '''
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Заказ №{{ order.id }} - MedinaTurkey.kz</title>
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
     <style>
-        body { font-family: 'Poppins', sans-serif; background: #f0f9f4; color: #2d332f; line-height: 1.6; padding: 20px; }
-        .container { max-width: 800px; margin: 20px auto; padding: 30px; background: #fff; border-radius: 15px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); border: 1px solid #d1e7dd; }
-        h1 { text-align: center; color: #1C6758; margin-bottom: 25px; font-size: 1.8rem; font-weight: 600; }
-        h2 { color: #164B41; margin-top: 30px; margin-bottom: 15px; font-size: 1.4rem; border-bottom: 1px solid #d1e7dd; padding-bottom: 8px;}
-        .order-meta { font-size: 0.9rem; color: #5e6e68; margin-bottom: 20px; text-align: center; }
-        .order-item { display: grid; grid-template-columns: 60px 1fr auto; gap: 15px; align-items: center; padding: 15px 0; border-bottom: 1px solid #e1f0e9; }
         .order-item:last-child { border-bottom: none; }
-        .order-item img { width: 60px; height: 60px; object-fit: contain; border-radius: 8px; background-color: #fff; padding: 5px; border: 1px solid #e1f0e9;}
-        .item-details strong { display: block; margin-bottom: 5px; font-size: 1.05rem; color: #2d332f;}
-        .item-details span { font-size: 0.9rem; color: #44524c; display: block;}
-        .item-total { font-weight: bold; text-align: right; font-size: 1rem; color: #1C6758;}
-        .order-summary { margin-top: 30px; padding-top: 20px; border-top: 2px solid #1C6758; text-align: right; }
         .order-summary p { margin-bottom: 10px; font-size: 1.1rem; }
-        .order-summary strong { font-size: 1.3rem; color: #1C6758; }
-        .customer-info { margin-top: 30px; background-color: #f8fcfb; padding: 20px; border-radius: 8px; border: 1px solid #e1f0e9;}
-        .customer-info p { margin-bottom: 8px; font-size: 0.95rem; }
-        .customer-info strong { color: #164B41; }
         .actions { margin-top: 30px; text-align: center; }
         .button { padding: 12px 25px; border: none; border-radius: 8px; background-color: #25D366; color: white; font-weight: 600; cursor: pointer; transition: background-color 0.3s ease, transform 0.1s ease; font-size: 1rem; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
         .button:hover { background-color: #128C7E; }
         .button:active { transform: scale(0.98); }
         .button i { font-size: 1.2rem; }
-        .catalog-link { display: block; text-align: center; margin-top: 25px; color: #3D8361; text-decoration: none; font-size: 0.9rem; }
         .catalog-link:hover { text-decoration: underline; }
-        .not-found { text-align: center; color: #c53030; font-size: 1.2rem; padding: 40px 0;}
     </style>
 </head>
 <body>
@@ -921,9 +866,9 @@ ORDER_TEMPLATE = '''
                 function sendOrderViaWhatsApp() {
                     const orderId = '{{ order.id }}';
                     const orderUrl = `{{ request.url }}`;
-                    const whatsappNumber = "77479003212";
-                    let message = `Здравствуйте! Хочу подтвердить свой заказ на MedinaTurkey.kz:%0A%0A`;
                     message += `*Номер заказа:* ${orderId}%0A`;
                     message += `*Ссылка на заказ:* ${encodeURIComponent(orderUrl)}%0A%0A`;
                     message += `Пожалуйста, свяжитесь со мной для уточнения деталей оплаты и доставки.`;
@@ -949,77 +894,81 @@ ADMIN_TEMPLATE = '''
     <head>
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>Админ-панель - MedinaTurkey.kz</title>
         <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
         <style>
-            body { font-family: 'Poppins', sans-serif; background-color: #e9f5f0; color: #2d332f; padding: 20px; line-height: 1.6; }
-            .container { max-width: 1200px; margin: 0 auto; background-color: #fff; padding: 25px; border-radius: 10px; box-shadow: 0 3px 10px rgba(0,0,0,0.05); }
-            .header { padding-bottom: 15px; margin-bottom: 25px; border-bottom: 1px solid #d1e7dd; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px;}
-            h1, h2, h3 { font-weight: 600; color: #1C6758; margin-bottom: 15px; }
-            h1 { font-size: 1.8rem; }
             h2 { font-size: 1.5rem; margin-top: 30px; display: flex; align-items: center; gap: 8px; }
-            h3 { font-size: 1.2rem; color: #164B41; margin-top: 20px; }
-            .section { margin-bottom: 30px; padding: 20px; background-color: #f8fcfb; border: 1px solid #d1e7dd; border-radius: 8px; }
             form { margin-bottom: 20px; }
-            label { font-weight: 500; margin-top: 10px; display: block; color: #44524c; font-size: 0.9rem;}
-            input[type="text"], input[type="number"], input[type="password"], input[type="tel"], textarea, select { width: 100%; padding: 10px 12px; margin-top: 5px; border: 1px solid #c4d9d1; border-radius: 6px; font-size: 0.95rem; box-sizing: border-box; transition: border-color 0.3s ease; }
-            input:focus, textarea:focus, select:focus { border-color: #1C6758; outline: none; box-shadow: 0 0 0 2px rgba(28, 103, 88, 0.1); }
             textarea { min-height: 80px; resize: vertical; }
-            input[type="file"] { padding: 8px; background-color: #f0f9f4; cursor: pointer; border: 1px solid #c4d9d1;}
-            input[type="file"]::file-selector-button { padding: 5px 10px; border-radius: 4px; background-color: #e0f0e9; border: 1px solid #c4d9d1; cursor: pointer; margin-right: 10px;}
             input[type="checkbox"] { margin-right: 5px; vertical-align: middle; }
-            label.inline-label { display: inline-block; margin-top: 10px; font-weight: normal; }
-            button, .button { padding: 10px 18px; border: none; border-radius: 6px; background-color: #1C6758; color: white; font-weight: 500; cursor: pointer; transition: background-color 0.3s ease, transform 0.1s ease; margin-top: 15px; font-size: 0.95rem; display: inline-flex; align-items: center; gap: 5px; text-decoration: none; line-height: 1.2;}
-            button:hover, .button:hover { background-color: #164B41; }
             button:active, .button:active { transform: scale(0.98); }
             button[type="submit"] { min-width: 120px; justify-content: center; }
-            .delete-button { background-color: #f56565; }
-            .delete-button:hover { background-color: #e53e3e; }
-            .add-button { background-color: #38a169; }
-            .add-button:hover { background-color: #2f855a; }
             .item-list { display: grid; gap: 20px; }
-            .item { background: #fff; padding: 15px 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.07); border: 1px solid #e1f0e9; }
-            .item p { margin: 5px 0; font-size: 0.9rem; color: #44524c; }
-            .item strong { color: #2d332f; }
-            .item .description { font-size: 0.85rem; color: #5e6e68; max-height: 60px; overflow: hidden; text-overflow: ellipsis; }
             .item-actions { margin-top: 15px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
-            .item-actions button:not(.delete-button) { background-color: #1C6758; }
-            .item-actions button:not(.delete-button):hover { background-color: #164B41; }
-            .edit-form-container { margin-top: 15px; padding: 20px; background: #f0f9f4; border: 1px dashed #c4d9d1; border-radius: 6px; display: none; }
-            details { background-color: #f8fcfb; border: 1px solid #d1e7dd; border-radius: 8px; margin-bottom: 20px; }
-            details > summary { cursor: pointer; font-weight: 600; color: #164B41; display: block; padding: 15px; border-bottom: 1px solid #d1e7dd; list-style: none; position: relative; }
-            details > summary::after { content: '\\f078'; font-family: 'Font Awesome 6 Free'; font-weight: 900; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); transition: transform 0.2s ease; color: #1C6758; }
             details[open] > summary::after { transform: translateY(-50%) rotate(180deg); }
-            details[open] > summary { border-bottom: 1px solid #d1e7dd; }
             details .form-content { padding: 20px; }
             .color-input-group { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
             .color-input-group input { flex-grow: 1; margin: 0; }
-            .remove-color-btn { background-color: #f56565; padding: 6px 10px; font-size: 0.8rem; margin-top: 0; line-height: 1; }
-            .remove-color-btn:hover { background-color: #e53e3e; }
-            .add-color-btn { background-color: #63b3ed; }
-            .add-color-btn:hover { background-color: #4299e1; }
-            .photo-preview img { max-width: 70px; max-height: 70px; border-radius: 5px; margin: 5px 5px 0 0; border: 1px solid #d1e7dd; object-fit: cover;}
             .sync-buttons { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
-            .download-hf-button { background-color: #7a8d85; }
-            .download-hf-button:hover { background-color: #5e6e68; }
             .flex-container { display: flex; flex-wrap: wrap; gap: 20px; }
             .flex-item { flex: 1; min-width: 350px; }
             .message { padding: 10px 15px; border-radius: 6px; margin-bottom: 15px; font-size: 0.9rem;}
-            .message.success { background-color: #d4edda; color: #155724; border: 1px solid #c3e6cb;}
-            .message.error { background-color: #f8d7da; color: #721c24; border: 1px solid #f5c6cb;}
-            .message.warning { background-color: #fff3cd; color: #856404; border: 1px solid #ffeeba; }
             .status-indicator { display: inline-block; padding: 3px 8px; border-radius: 12px; font-size: 0.8rem; font-weight: 500; margin-left: 10px; vertical-align: middle; }
-            .status-indicator.in-stock { background-color: #c6f6d5; color: #2f855a; }
-            .status-indicator.out-of-stock { background-color: #fed7d7; color: #c53030; }
-            .status-indicator.top-product { background-color: #feebc8; color: #9c4221; margin-left: 5px;}
         </style>
     </head>
     <body>
         <div class="container">
             <div class="header">
-                <h1><i class="fas fa-tools"></i> Админ-панель MedinaTurkey.kz</h1>
-                <a href="{{ url_for('catalog') }}" class="button" style="background-color: #3D8361;"><i class="fas fa-store"></i> Перейти в каталог</a>
             </div>
             {% with messages = get_flashed_messages(with_categories=true) %}
@@ -1040,7 +989,7 @@ ADMIN_TEMPLATE = '''
                         <button type="submit" class="button download-hf-button" title="Скачать файлы  (перезапишет локальные)"><i class="fas fa-download"></i> Скачать БД</button>
                     </form>
                 </div>
-                 <p style="font-size: 0.85rem; color: #5e6e68;">Резервное копирование происходит автоматически каждые 30 минут, а также после каждого сохранения данных. Используйте эти кнопки для немедленной синхронизации.</p>
             </div>
             <div class="flex-container">
@@ -1064,7 +1013,7 @@ ADMIN_TEMPLATE = '''
                          <div class="item-list">
                              {% for category in categories %}
                              <div class="item" style="display: flex; justify-content: space-between; align-items: center;">
-                                 <span>{{ category }}</span>
                                  <form method="POST" style="margin: 0;" onsubmit="return confirm('Вы уверены, что хотите удалить категорию \'{{ category }}\'? Товары этой категории будут помечены как \'Без категории\'.');">
                                      <input type="hidden" name="action" value="delete_category">
                                      <input type="hidden" name="category_name" value="{{ category }}">
@@ -1074,7 +1023,7 @@ ADMIN_TEMPLATE = '''
                              {% endfor %}
                          </div>
                          {% else %}
-                         <p>Категорий пока нет.</p>
                          {% endif %}
                      </div>
                  </div>
@@ -1082,8 +1031,8 @@ ADMIN_TEMPLATE = '''
                  <div class="flex-item">
                       <div class="section">
                         <h2><i class="fas fa-info-circle"></i> Информация</h2>
-                         <p>Управление пользователями отключено, так как сайт не требует входа.</p>
-                         <p>Заказы создаются анонимно и должны быть подтверждены через WhatsApp.</p>
                      </div>
                  </div>
             </div>
@@ -1149,7 +1098,7 @@ ADMIN_TEMPLATE = '''
                                 {% endif %}
                             </div>
                             <div style="flex-grow: 1;">
-                                <h3 style="margin-top: 0; margin-bottom: 5px; color: #2d332f;">
                                     {{ product['name'] }}
                                      {% if product.get('in_stock', True) %}
                                         <span class="status-indicator in-stock">В наличии</span>
@@ -1166,7 +1115,7 @@ ADMIN_TEMPLATE = '''
                                 {% set colors = product.get('colors', []) %}
                                 <p><strong>Цвета/Вар-ты:</strong> {{ colors|select('ne', '')|join(', ') if colors|select('ne', '')|list|length > 0 else 'Нет' }}</p>
                                 {% if product.get('photos') and product['photos']|length > 1 %}
-                                    <p style="font-size: 0.8rem; color: #5e6e68;">(Всего фото: {{ product['photos']|length }})</p>
                                 {% endif %}
                             </div>
                         </div>
@@ -1201,7 +1150,7 @@ ADMIN_TEMPLATE = '''
                                 <label>Заменить фотографии (выберите новые файлы, до 10 шт.):</label>
                                 <input type="file" name="photos" accept="image/*" multiple>
                                  {% if product.get('photos') %}
-                                    <p style="font-size: 0.85rem; margin-top: 5px;">Текущие фото:</p>
                                     <div class="photo-preview">
                                         {% for photo in product['photos'] %}
                                         <img src="https://huggingface.co/datasets/{{ repo_id }}/resolve/main/photos/{{ photo }}" alt="Фото {{ loop.index }}">
@@ -1245,7 +1194,7 @@ ADMIN_TEMPLATE = '''
                     {% endfor %}
                 </div>
                 {% else %}
-                <p>Товаров пока нет.</p>
                 {% endif %}
             </div>
@@ -1299,8 +1248,6 @@ ADMIN_TEMPLATE = '''
     </html>
 '''
-# --- Flask Routes ---
 @app.route('/')
 def catalog():
     data = load_data()
@@ -1381,7 +1328,7 @@ def create_order():
         "created_at": order_timestamp,
         "cart": processed_cart,
         "total_price": round(total_price, 2),
-        "user_info": None, # Explicitly set to None as users are anonymous
         "status": "new"
     }
@@ -1709,7 +1656,6 @@ def admin():
              flash(f"Произошла внутренняя ошибка при выполнении действия '{action}'. Подробности в логе сервера.", 'error')
              return redirect(url_for('admin'))
-    # --- GET request ---
     current_data = load_data()
     display_products = sorted(current_data.get('products', []), key=lambda p: p.get('name', '').lower())
     display_categories = sorted(current_data.get('categories', []))
@@ -1739,7 +1685,7 @@ def force_download():
     try:
         if download_db_from_hf():
             flash("Данные успешно скачаны с Hugging Face. Локальные файлы обновлены.", 'success')
-            load_data() # Reload data in memory after download
         else:
             flash("Не удалось скачать данные с Hugging Face после нескольких попыток. Проверьте логи.", 'error')
     except Exception as e:
@@ -1747,9 +1693,6 @@ def force_download():
         flash(f"Ошибка при скачивании с Hugging Face: {e}", 'error')
     return redirect(url_for('admin'))
-# --- App Initialization ---
 if __name__ == '__main__':
     logging.info("Application starting up. Performing initial data load/download...")
     download_db_from_hf()
@@ -1767,4 +1710,4 @@ if __name__ == '__main__':
     logging.info(f"Starting Flask app on host 0.0.0.0 and port {port}")
     app.run(debug=False, host='0.0.0.0', port=port)
-# --- END OF FILE app.py ---

 from flask import Flask, render_template_string, request, redirect, url_for, send_file, flash, jsonify
 import json
 load_dotenv()
 app = Flask(__name__)
+app.secret_key = 'your_unique_secret_key_soola_cosmetics_67890_no_login'
 DATA_FILE = 'data.json'
 SYNC_FILES = [DATA_FILE]
 REPO_ID = "Kgshop/dakokg"
 CURRENCY_NAME = 'Кыргызский сом'
 DOWNLOAD_RETRIES = 3
+DOWNLOAD_DELAY = 5
 logging.basicConfig(level=logging.INFO, format='%(asctime)s - %(levelname)s - %(message)s')
 def download_db_from_hf(specific_file=None, retries=DOWNLOAD_RETRIES, delay=DOWNLOAD_DELAY):
     if not HF_TOKEN_READ and not HF_TOKEN_WRITE:
         logging.warning("HF_TOKEN_READ/HF_TOKEN_WRITE not set. Download might fail for private repos.")
         upload_db_to_hf()
         logging.info("Periodic backup finished.")
 def load_data():
     default_data = {'products': [], 'categories': [], 'orders': {}}
     try:
     except Exception as e:
         logging.error(f"Error saving data to {DATA_FILE}: {e}", exc_info=True)
 CATALOG_TEMPLATE = '''
     <!DOCTYPE html>
     <html lang="ru">
     <head>
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Dako_kg - Каталог</title>
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
         <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/10.2.0/swiper-bundle.min.css">
         <style>
             * { margin: 0; padding: 0; box-sizing: border-box; }
+            body { font-family: 'Poppins', sans-serif; background: #1a1a1a; color: #eee; line-height: 1.6;}
             .container { max-width: 1300px; margin: 0 auto; padding: 20px; }
+            .header { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; border-bottom: 1px solid #444; }
+            .header h1 { font-size: 1.8rem; font-weight: 600; color: #ffcc00; display: flex; align-items: center;}
+            .header img { height: 40px; margin-right: 10px;}
+            .store-address { padding: 15px; text-align: center; background-color: #2a2a2a; margin: 20px 0; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.2); font-size: 1rem; color: #ccc; border: 1px solid #444;}
             .filters-container { margin: 20px 0; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
             .search-container { margin: 20px 0; text-align: center; }
+            #search-input { width: 90%; max-width: 600px; padding: 12px 18px; font-size: 1rem; border: 1px solid #444; border-radius: 25px; outline: none; box-shadow: 0 2px 5px rgba(0,0,0,0.2); transition: all 0.3s ease; background-color: #333; color: #eee;}
+            #search-input:focus { border-color: #ffcc00; box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.3); }
+            .category-filter { padding: 8px 16px; border: 1px solid #444; border-radius: 20px; background-color: #2a2a2a; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); font-size: 0.9rem; font-weight: 400; color: #ffcc00; }
+            .category-filter.active, .category-filter:hover { background-color: #ffcc00; color: #1a1a1a; border-color: #ffcc00; box-shadow: 0 2px 10px rgba(255, 215, 0, 0.3); }
             .products-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 20px; padding: 10px; }
             @media (min-width: 600px) { .products-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } }
             @media (min-width: 900px) { .products-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); } }
+            .product { background: #2a2a2a; border-radius: 15px; padding: 0; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; height: 100%; border: 1px solid #444;}
+            .product:hover { transform: translateY(-5px) scale(1.02); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4); }
+            .product-image { width: 100%; aspect-ratio: 1 / 1; background-color: #333; border-radius: 10px 10px 0 0; overflow: hidden; display: flex; justify-content: center; align-items: center; margin-bottom: 0; }
             .product-image img { max-width: 100%; max-height: 100%; object-fit: contain; transition: transform 0.3s ease; }
             .product-info { padding: 15px; flex-grow: 1; display: flex; flex-direction: column; justify-content: center; }
+            .product h2 { font-size: 1.1rem; font-weight: 600; margin: 0 0 8px 0; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #eee; }
+            .product-price { font-size: 1.2rem; color: #ffd700; font-weight: 700; text-align: center; margin: 5px 0; }
+            .product-description { font-size: 0.85rem; color: #ccc; text-align: center; margin-bottom: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
             .product-actions { padding: 0 15px 15px 15px; display: flex; flex-direction: column; gap: 8px; }
+            .product-button { display: block; width: 100%; padding: 10px; border: none; border-radius: 8px; background-color: #444; color: #eee; font-size: 0.9rem; font-weight: 500; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); text-align: center; text-decoration: none; border: 1px solid #555;}
+            .product-button:hover { background-color: #555; box-shadow: 0 4px 15px rgba(255, 215, 0, 0.2); transform: translateY(-2px); border-color: #ffcc00;}
             .product-button i { margin-right: 5px; }
+            .add-to-cart { background-color: #ffd700; color: #1a1a1a; border-color: #ffcc00;}
+            .add-to-cart:hover { background-color: #ffcc00; box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4); border-color: #fff;}
+            #cart-button { position: fixed; bottom: 25px; right: 25px; background-color: #ffd700; color: #1a1a1a; border: none; border-radius: 50%; width: 55px; height: 55px; font-size: 1.5rem; cursor: pointer; display: none; align-items: center; justify-content: center; box-shadow: 0 4px 15px rgba(255, 215, 0, 0.5); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); z-index: 1000; }
+            #cart-button:hover { background-color: #ffcc00; transform: scale(1.05); }
             #cart-button .fa-shopping-cart { margin-right: 0; }
+            #cart-button span { position: absolute; top: -5px; right: -5px; background-color: #c53030; color: white; border-radius: 50%; padding: 2px 6px; font-size: 0.7rem; font-weight: bold; }
+            .modal { display: none; position: fixed; z-index: 1001; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); backdrop-filter: blur(5px); overflow-y: auto; }
+            .modal-content { background: #2a2a2a; margin: 5% auto; padding: 25px; border-radius: 15px; width: 90%; max-width: 700px; box-shadow: 0 10px 30px rgba(0,0,0,0.4); animation: slideIn 0.3s ease-out; position: relative; color: #eee; border: 1px solid #444;}
             @keyframes slideIn { from { transform: translateY(-30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
+            .close { position: absolute; top: 15px; right: 15px; font-size: 1.8rem; color: #ccc; cursor: pointer; transition: color 0.3s; line-height: 1; }
+            .close:hover { color: #ffcc00; }
+            .modal-content h2 { margin-top: 0; margin-bottom: 20px; color: #ffcc00; display: flex; align-items: center; gap: 10px;}
+            .cart-item { display: grid; grid-template-columns: auto 1fr auto auto; gap: 15px; align-items: center; padding: 15px 0; border-bottom: 1px solid #444; }
             .cart-item:last-child { border-bottom: none; }
+            .cart-item img { width: 60px; height: 60px; object-fit: contain; border-radius: 8px; background-color: #333; padding: 5px; grid-column: 1; border: 1px solid #555; }
             .cart-item-details { grid-column: 2; }
+            .cart-item-details strong { display: block; margin-bottom: 5px; font-size: 1rem; color: #eee;}
+            .cart-item-price { font-size: 0.9rem; color: #ccc; }
+            .cart-item-total { font-weight: bold; text-align: right; grid-column: 3; font-size: 1rem; color: #ffcc00;}
             .cart-item-remove { grid-column: 4; background:none; border:none; color:#f56565; cursor:pointer; font-size: 1.3em; padding: 5px; line-height: 1; }
             .cart-item-remove:hover { color: #c53030; }
+            .quantity-input, .color-select { width: 100%; max-width: 180px; padding: 10px; border: 1px solid #444; border-radius: 8px; font-size: 1rem; margin: 10px 0; box-sizing: border-box; background-color: #333; color: #eee;}
+            .cart-summary { margin-top: 20px; text-align: right; border-top: 1px solid #444; padding-top: 15px; }
+            .cart-summary strong { font-size: 1.2rem; color: #ffcc00;}
             .cart-actions { margin-top: 25px; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
             .cart-actions .product-button { width: auto; flex-grow: 1; }
+            .clear-cart { background-color: #555; border-color: #666;}
+            .clear-cart:hover { background-color: #666; box-shadow: 0 4px 15px rgba(0,0,0,0.4); }
+            .formulate-order-button { background-color: #ffd700; color: #1a1a1a; border-color: #ffcc00;}
+            .formulate-order-button:hover { background-color: #ffcc00; box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4); border-color: #fff;}
+            .notification { position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%); background-color: #ffd700; color: #1a1a1a; padding: 10px 20px; border-radius: 20px; box-shadow: 0 4px 10px rgba(0,0,0,0.3); z-index: 1002; opacity: 0; transition: opacity 0.5s ease; font-size: 0.9rem;}
             .notification.show { opacity: 1;}
+            .no-results-message { grid-column: 1 / -1; text-align: center; padding: 40px; font-size: 1.1rem; color: #ccc; }
             .top-product-indicator { position: absolute; top: 8px; right: 8px; background-color: rgba(255, 215, 0, 0.8); color: #333; padding: 2px 6px; font-size: 0.7rem; border-radius: 4px; font-weight: bold; z-index: 10; backdrop-filter: blur(2px); }
             .product { position: relative; }
         </style>
     <body>
         <div class="container">
             <div class="header">
+                <h1><img src="https://cdn-avatars.huggingface.co/v1/production/uploads/67effb9055fe17a33d83fcb5/9kkn1DmDQ2jNz-0tFFZ2Q.jpeg" alt="Dako_kg Logo">Dako_kg</h1>
             </div>
             <div class="store-address">Наш адрес: {{ store_address }}</div>
             let selectedProductIndex = null;
             let cart = JSON.parse(localStorage.getItem('soolaCart') || '[]');
             function openModal(index) {
                 loadProductDetails(index);
                 const modal = document.getElementById('productModal');
             function loadProductDetails(index) {
                 const modalContent = document.getElementById('modalContent');
                 if (!modalContent) return;
+                modalContent.innerHTML = '<p style="text-align:center; padding: 40px; color: #ccc;">Загрузка...</p>';
                 fetch('/product/' + index)
                     .then(response => {
                         if (!response.ok) throw new Error(`Ошибка ${response.status}: ${response.statusText}`);
                     })
                     .catch(error => {
                         console.error('Ошибка загрузки деталей продукта:', error);
+                        modalContent.innerHTML = `<p style="color: #f56565; text-align:center; padding: 40px;">Не удалось загрузить информацию о товаре. ${error.message}</p>`;
                     });
             }
                     return;
                  }
+                const cartItemId = `${product.name}-${color}`;
                 const existingItemIndex = cart.findIndex(item => item.id === cartItemId);
                 if (existingItemIndex > -1) {
                 let total = 0;
                 if (cart.length === 0) {
+                    cartContent.innerHTML = '<p style="text-align: center; padding: 20px; color: #ccc;">Ваша корзина пуста.</p>';
                     cartTotalElement.textContent = '0.00';
                 } else {
                     cartContent.innerHTML = cart.map(item => {
                 });
             }
             function filterProducts() {
                 const searchTerm = document.getElementById('search-input').value.toLowerCase().trim();
                 const activeCategoryButton = document.querySelector('.category-filter.active');
                     placeholder = newPlaceholder;
                  }
                 const notification = document.createElement('div');
                 notification.className = 'notification';
                 notification.textContent = message;
              }
             document.addEventListener('DOMContentLoaded', () => {
                 updateCartButton();
                 setupFilters();
 PRODUCT_DETAIL_TEMPLATE = '''
     <div style="padding: 10px;">
+        <h2 style="font-size: 1.6rem; font-weight: 600; margin-bottom: 15px; text-align: center; color: #ffcc00;">{{ product['name'] }}</h2>
+        <div class="swiper-container" style="max-width: 450px; margin: 0 auto 20px; border-radius: 10px; overflow: hidden; background-color: #333; border: 1px solid #444;">
             <div class="swiper-wrapper">
                 {% if product.get('photos') and product['photos']|length > 0 %}
                     {% for photo in product['photos'] %}
                 {% endif %}
             </div>
             {% if product.get('photos') and product['photos']|length > 1 %}
+            <div class="swiper-pagination" style="position: relative; bottom: 5px; color: #ffd700 !important;"></div>
+            <div class="swiper-button-next" style="color: #ffcc00;"></div>
+            <div class="swiper-button-prev" style="color: #ffcc00;"></div>
             {% endif %}
         </div>
+        <div style="margin-top: 20px; font-size: 1rem; line-height: 1.7; color: #ccc;">
             <p><strong>Категория:</strong> {{ product.get('category', 'Без категории') }}</p>
+            <p style="font-size: 1.2rem; font-weight: bold; color: #ffd700;"><strong>Цена:</strong> {{ "%.2f"|format(product['price']) }} {{ currency_code }}</p>
             <p><strong>Описание:</strong><br> {{ product.get('description', 'Описание отсутствует.')|replace('\\n', '<br>')|safe }}</p>
             {% set colors = product.get('colors', []) %}
             {% if colors and colors|select('ne', '')|list|length > 0 %}
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Заказ №{{ order.id }} - Dako_kg</title>
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
     <style>
+        body { font-family: 'Poppins', sans-serif; background: #1a1a1a; color: #eee; line-height: 1.6; padding: 20px; }
+        .container { max-width: 800px; margin: 20px auto; padding: 30px; background: #2a2a2a; border-radius: 15px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); border: 1px solid #444; }
+        h1 { text-align: center; color: #ffcc00; margin-bottom: 25px; font-size: 1.8rem; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 10px;}
+        h2 { color: #ffcc00; margin-top: 30px; margin-bottom: 15px; font-size: 1.4rem; border-bottom: 1px solid #444; padding-bottom: 8px; display: flex; align-items: center; gap: 8px;}
+        .order-meta { font-size: 0.9rem; color: #ccc; margin-bottom: 20px; text-align: center; }
+        .order-item { display: grid; grid-template-columns: 60px 1fr auto; gap: 15px; align-items: center; padding: 15px 0; border-bottom: 1px solid #333; }
         .order-item:last-child { border-bottom: none; }
+        .order-item img { width: 60px; height: 60px; object-fit: contain; border-radius: 8px; background-color: #333; padding: 5px; border: 1px solid #555;}
+        .item-details strong { display: block; margin-bottom: 5px; font-size: 1.05rem; color: #eee;}
+        .item-details span { font-size: 0.9rem; color: #ccc; display: block;}
+        .item-total { font-weight: bold; text-align: right; font-size: 1rem; color: #ffd700;}
+        .order-summary { margin-top: 30px; padding-top: 20px; border-top: 2px solid #ffcc00; text-align: right; }
         .order-summary p { margin-bottom: 10px; font-size: 1.1rem; }
+        .order-summary strong { font-size: 1.3rem; color: #ffd700; }
+        .customer-info { margin-top: 30px; background-color: #333; padding: 20px; border-radius: 8px; border: 1px solid #444;}
+        .customer-info p { margin-bottom: 8px; font-size: 0.95rem; color: #ccc; }
+        .customer-info strong { color: #ffcc00; }
         .actions { margin-top: 30px; text-align: center; }
         .button { padding: 12px 25px; border: none; border-radius: 8px; background-color: #25D366; color: white; font-weight: 600; cursor: pointer; transition: background-color 0.3s ease, transform 0.1s ease; font-size: 1rem; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
         .button:hover { background-color: #128C7E; }
         .button:active { transform: scale(0.98); }
         .button i { font-size: 1.2rem; }
+        .catalog-link { display: block; text-align: center; margin-top: 25px; color: #ffd700; text-decoration: none; font-size: 0.9rem; }
         .catalog-link:hover { text-decoration: underline; }
+        .not-found { text-align: center; color: #f56565; font-size: 1.2rem; padding: 40px 0;}
     </style>
 </head>
 <body>
                 function sendOrderViaWhatsApp() {
                     const orderId = '{{ order.id }}';
                     const orderUrl = `{{ request.url }}`;
+                    const whatsappNumber = "996558757157";
+                    let message = `Здравствуйте! Хочу подтвердить свой заказ на Dako_kg:%0A%0A`;
                     message += `*Номер заказа:* ${orderId}%0A`;
                     message += `*Ссылка на заказ:* ${encodeURIComponent(orderUrl)}%0A%0A`;
                     message += `Пожалуйста, свяжитесь со мной для уточнения деталей оплаты и доставки.`;
     <head>
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Админ-панель - Dako_kg</title>
         <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
         <style>
+            body { font-family: 'Poppins', sans-serif; background-color: #1a1a1a; color: #eee; padding: 20px; line-height: 1.6; }
+            .container { max-width: 1200px; margin: 0 auto; background-color: #2a2a2a; padding: 25px; border-radius: 10px; box-shadow: 0 3px 10px rgba(0,0,0,0.3); border: 1px solid #444;}
+            .header { padding-bottom: 15px; margin-bottom: 25px; border-bottom: 1px solid #444; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px;}
+            h1, h2, h3 { font-weight: 600; color: #ffcc00; margin-bottom: 15px; }
+            h1 { font-size: 1.8rem; display: flex; align-items: center; gap: 10px;}
+             h1 img { height: 40px; }
             h2 { font-size: 1.5rem; margin-top: 30px; display: flex; align-items: center; gap: 8px; }
+            h3 { font-size: 1.2rem; color: #ffcc00; margin-top: 20px; }
+            .section { margin-bottom: 30px; padding: 20px; background-color: #333; border: 1px solid #444; border-radius: 8px; }
             form { margin-bottom: 20px; }
+            label { font-weight: 500; margin-top: 10px; display: block; color: #ccc; font-size: 0.9rem;}
+            input[type="text"], input[type="number"], input[type="password"], input[type="tel"], textarea, select { width: 100%; padding: 10px 12px; margin-top: 5px; border: 1px solid #555; border-radius: 6px; font-size: 0.95rem; box-sizing: border-box; transition: border-color 0.3s ease; background-color: #444; color: #eee; }
+            input:focus, textarea:focus, select:focus { border-color: #ffcc00; outline: none; box-shadow: 0 0 0 2px rgba(255, 215, 0, 0.1); }
             textarea { min-height: 80px; resize: vertical; }
+            input[type="file"] { padding: 8px; background-color: #333; cursor: pointer; border: 1px solid #555; color: #eee;}
+            input[type="file"]::file-selector-button { padding: 5px 10px; border-radius: 4px; background-color: #555; border: 1px solid #666; cursor: pointer; margin-right: 10px; color: #eee;}
+             input[type="file"]::file-selector-button:hover { background-color: #666;}
             input[type="checkbox"] { margin-right: 5px; vertical-align: middle; }
+            label.inline-label { display: inline-block; margin-top: 10px; font-weight: normal; color: #eee;}
+            button, .button { padding: 10px 18px; border: none; border-radius: 6px; background-color: #555; color: #eee; font-weight: 500; cursor: pointer; transition: background-color 0.3s ease, transform 0.1s ease; margin-top: 15px; font-size: 0.95rem; display: inline-flex; align-items: center; gap: 5px; text-decoration: none; line-height: 1.2;}
+            button:hover, .button:hover { background-color: #666; }
             button:active, .button:active { transform: scale(0.98); }
             button[type="submit"] { min-width: 120px; justify-content: center; }
+            .delete-button { background-color: #c53030; color: white;}
+            .delete-button:hover { background-color: #9b2c2c; }
+            .add-button { background-color: #ffd700; color: #1a1a1a;}
+            .add-button:hover { background-color: #ffcc00; }
+             .catalog-link-button { background-color: #444; color: #eee; }
+             .catalog-link-button:hover { background-color: #555; }
             .item-list { display: grid; gap: 20px; }
+            .item { background: #333; padding: 15px 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.2); border: 1px solid #444; }
+            .item p { margin: 5px 0; font-size: 0.9rem; color: #ccc; }
+            .item strong { color: #eee; }
+            .item .description { font-size: 0.85rem; color: #bbb; max-height: 60px; overflow: hidden; text-overflow: ellipsis; }
             .item-actions { margin-top: 15px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
+            .item-actions button:not(.delete-button) { background-color: #444; color: #eee;}
+            .item-actions button:not(.delete-button):hover { background-color: #555; }
+            .edit-form-container { margin-top: 15px; padding: 20px; background: #3a3a3a; border: 1px dashed #555; border-radius: 6px; display: none; }
+            details { background-color: #333; border: 1px solid #444; border-radius: 8px; margin-bottom: 20px; }
+            details > summary { cursor: pointer; font-weight: 600; color: #ffcc00; display: block; padding: 15px; border-bottom: 1px solid #444; list-style: none; position: relative; }
+            details > summary::after { content: '\\f078'; font-family: 'Font Awesome 6 Free'; font-weight: 900; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); transition: transform 0.2s ease; color: #ffcc00; }
             details[open] > summary::after { transform: translateY(-50%) rotate(180deg); }
+            details[open] > summary { border-bottom: 1px solid #444; }
             details .form-content { padding: 20px; }
             .color-input-group { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
             .color-input-group input { flex-grow: 1; margin: 0; }
+            .remove-color-btn { background-color: #c53030; padding: 6px 10px; font-size: 0.8rem; margin-top: 0; line-height: 1; color: white;}
+            .remove-color-btn:hover { background-color: #9b2c2c; }
+            .add-color-btn { background-color: #ffd700; color: #1a1a1a;}
+            .add-color-btn:hover { background-color: #ffcc00; }
+            .photo-preview img { max-width: 70px; max-height: 70px; border-radius: 5px; margin: 5px 5px 0 0; border: 1px solid #555; object-fit: cover;}
             .sync-buttons { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
+            .download-hf-button { background-color: #444; color: #eee; }
+            .download-hf-button:hover { background-color: #555; }
             .flex-container { display: flex; flex-wrap: wrap; gap: 20px; }
             .flex-item { flex: 1; min-width: 350px; }
             .message { padding: 10px 15px; border-radius: 6px; margin-bottom: 15px; font-size: 0.9rem;}
+            .message.success { background-color: #28a745; color: white; border: 1px solid #28a745;}
+            .message.error { background-color: #dc3545; color: white; border: 1px solid #dc3545;}
+            .message.warning { background-color: #ffc107; color: #212529; border: 1px solid #ffc107; }
             .status-indicator { display: inline-block; padding: 3px 8px; border-radius: 12px; font-size: 0.8rem; font-weight: 500; margin-left: 10px; vertical-align: middle; }
+            .status-indicator.in-stock { background-color: #28a745; color: white; }
+            .status-indicator.out-of-stock { background-color: #dc3545; color: white; }
+            .status-indicator.top-product { background-color: #ffd700; color: #1a1a1a; margin-left: 5px;}
         </style>
     </head>
     <body>
         <div class="container">
             <div class="header">
+                <h1><img src="https://cdn-avatars.huggingface.co/v1/production/uploads/67effb9055fe17a33d83fcb5/9kkn1DmDQ2jNz-0tFFZ2Q.jpeg" alt="Dako_kg Logo"> Админ-панель Dako_kg</h1>
+                <a href="{{ url_for('catalog') }}" class="button catalog-link-button"><i class="fas fa-store"></i> Перейти в каталог</a>
             </div>
             {% with messages = get_flashed_messages(with_categories=true) %}
                         <button type="submit" class="button download-hf-button" title="Скачать файлы  (перезапишет локальные)"><i class="fas fa-download"></i> Скачать БД</button>
                     </form>
                 </div>
+                 <p style="font-size: 0.85rem; color: #ccc;">Резервное копирование происходит автоматически каждые 30 минут, а также после каждого сохранения данных. Используйте эти кнопки для немедленной синхронизации.</p>
             </div>
             <div class="flex-container">
                          <div class="item-list">
                              {% for category in categories %}
                              <div class="item" style="display: flex; justify-content: space-between; align-items: center;">
+                                 <span style="color: #eee;">{{ category }}</span>
                                  <form method="POST" style="margin: 0;" onsubmit="return confirm('Вы уверены, что хотите удалить категорию \'{{ category }}\'? Товары этой категории будут помечены как \'Без категории\'.');">
                                      <input type="hidden" name="action" value="delete_category">
                                      <input type="hidden" name="category_name" value="{{ category }}">
                              {% endfor %}
                          </div>
                          {% else %}
+                         <p style="color: #ccc;">Категорий пока нет.</p>
                          {% endif %}
                      </div>
                  </div>
                  <div class="flex-item">
                       <div class="section">
                         <h2><i class="fas fa-info-circle"></i> Информация</h2>
+                         <p style="color: #ccc;">Управление пользователями отключено, так как сайт не требует входа.</p>
+                         <p style="color: #ccc;">Заказы создаются анонимно и должны быть подтверждены через WhatsApp.</p>
                      </div>
                  </div>
             </div>
                                 {% endif %}
                             </div>
                             <div style="flex-grow: 1;">
+                                <h3 style="margin-top: 0; margin-bottom: 5px; color: #eee;">
                                     {{ product['name'] }}
                                      {% if product.get('in_stock', True) %}
                                         <span class="status-indicator in-stock">В наличии</span>
                                 {% set colors = product.get('colors', []) %}
                                 <p><strong>Цвета/Вар-ты:</strong> {{ colors|select('ne', '')|join(', ') if colors|select('ne', '')|list|length > 0 else 'Нет' }}</p>
                                 {% if product.get('photos') and product['photos']|length > 1 %}
+                                    <p style="font-size: 0.8rem; color: #bbb;">(Всего фото: {{ product['photos']|length }})</p>
                                 {% endif %}
                             </div>
                         </div>
                                 <label>Заменить фотографии (выберите новые файлы, до 10 шт.):</label>
                                 <input type="file" name="photos" accept="image/*" multiple>
                                  {% if product.get('photos') %}
+                                    <p style="font-size: 0.85rem; margin-top: 5px; color: #ccc;">Текущие фото:</p>
                                     <div class="photo-preview">
                                         {% for photo in product['photos'] %}
                                         <img src="https://huggingface.co/datasets/{{ repo_id }}/resolve/main/photos/{{ photo }}" alt="Фото {{ loop.index }}">
                     {% endfor %}
                 </div>
                 {% else %}
+                <p style="color: #ccc;">Товаров пока нет.</p>
                 {% endif %}
             </div>
     </html>
 '''
 @app.route('/')
 def catalog():
     data = load_data()
         "created_at": order_timestamp,
         "cart": processed_cart,
         "total_price": round(total_price, 2),
+        "user_info": None,
         "status": "new"
     }
              flash(f"Произошла внутренняя ошибка при выполнении действия '{action}'. Подробности в логе сервера.", 'error')
              return redirect(url_for('admin'))
     current_data = load_data()
     display_products = sorted(current_data.get('products', []), key=lambda p: p.get('name', '').lower())
     display_categories = sorted(current_data.get('categories', []))
     try:
         if download_db_from_hf():
             flash("Данные успешно скачаны с Hugging Face. Локальные файлы обновлены.", 'success')
+            load_data()
         else:
             flash("Не удалось скачать данные с Hugging Face после нескольких попыток. Проверьте логи.", 'error')
     except Exception as e:
         flash(f"Ошибка при скачивании с Hugging Face: {e}", 'error')
     return redirect(url_for('admin'))
 if __name__ == '__main__':
     logging.info("Application starting up. Performing initial data load/download...")
     download_db_from_hf()
     logging.info(f"Starting Flask app on host 0.0.0.0 and port {port}")
     app.run(debug=False, host='0.0.0.0', port=port)