Update styles.css

styles.css

@@ -161,43 +161,81 @@ tr:hover {
     margin: 10px 0;
 }
 
-/* Адаптация для мобильных устройств */
-@media (max-width: 600px) {
-    .container {
-        padding: 10px;
-    }
-
-    h1 {
-        font-size: 24px;
-    }
-
-    h2 {
-        font-size: 20px;
-    }
-
-    input, button {
-        font-size: 14px;
-    }
-
-    table {
-        font-size: 14px;
-    }
-
-    th, td {
-        padding: 8px;
-    }
-
-    .actions {
-        flex-direction: column;
-        gap: 3px;
-    }
-
-    .add-to-cart-btn, .add-stock-btn, .delete-btn {
-        font-size: 12px;
-        padding: 3px 6px;
-    }
-
-    .cart, .stats {
-        padding: 10px;
-    }
+/* Стили для модального окна */
+.modal {
+    display: none;
+    position: fixed;
+    z-index: 1000;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.5);
+    justify-content: center;
+    align-items: center;
+}
+
+.modal-content {
+    background-color: #222;
+    padding: 20px;
+    border-radius: 10px;
+    width: 400px;
+    max-width: 90%;
+    color: #fff;
+    position: relative;
+}
+
+.modal-content .close {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    font-size: 24px;
+    cursor: pointer;
+}
+
+.modal-content h2 {
+    margin-top: 0;
+}
+
+#receiptTable {
+    width: 100%;
+    border-collapse: collapse;
+    margin: 10px 0;
+}
+
+#receiptTable th, #receiptTable td {
+    padding: 8px;
+    border-bottom: 1px solid #444;
+    text-align: left;
+}
+
+#receiptTable th {
+    background-color: #333;
+}
+
+#confirmSaleBtn, #cancelSaleBtn {
+    padding: 10px;
+    margin: 5px;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+    font-size: 16px;
+}
+
+#confirmSaleBtn {
+    background-color: #28a745;
+    color: #fff;
+}
+
+#confirmSaleBtn:hover {
+    background-color: #218838;
+}
+
+#cancelSaleBtn {
+    background-color: #dc3545;
+    color: #fff;
+}
+
+#cancelSaleBtn:hover {
+    background-color: #c82333;
 }