body { font-family: Arial, sans-serif; background-color: #000; color: #fff; margin: 0; padding: 0; } .container { max-width: 800px; margin: 20px auto; padding: 20px; background-color: #111; box-shadow: 0 0 10px rgba(255, 255, 255, 0.1); border-radius: 10px; } h1, h2 { text-align: center; color: #fff; } form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; } input { padding: 10px; font-size: 16px; border: 1px solid #444; border-radius: 5px; background-color: #222; color: #fff; } button { padding: 10px; font-size: 16px; background-color: #28a745; color: #fff; border: none; border-radius: 5px; cursor: pointer; } button:hover { background-color: #218838; } .search-container { margin-bottom: 20px; } #searchInput { width: 100%; padding: 10px; font-size: 16px; border: 1px solid #444; border-radius: 5px; background-color: #222; color: #fff; } table { width: 100%; border-collapse: collapse; margin-top: 20px; } th, td { padding: 12px; text-align: left; border-bottom: 1px solid #444; } th { background-color: #333; color: #fff; } tr:hover { background-color: #222; } .actions { display: flex; gap: 5px; } .add-to-cart-btn, .add-stock-btn, .delete-btn { padding: 5px 10px; border: none; border-radius: 3px; cursor: pointer; font-size: 14px; } .add-to-cart-btn { background-color: #17a2b8; color: #fff; } .add-to-cart-btn:hover { background-color: #138496; } .add-stock-btn { background-color: #ffc107; color: #000; } .add-stock-btn:hover { background-color: #e0a800; } .delete-btn { background-color: #dc3545; color: #fff; } .delete-btn:hover { background-color: #c82333; } .cart { margin-top: 30px; padding: 20px; background-color: #222; border-radius: 10px; } .cart h2 { margin-top: 0; } #sellCartBtn { margin-top: 10px; background-color: #28a745; } #sellCartBtn:hover { background-color: #218838; } .stats { margin-top: 30px; padding: 20px; background-color: #222; border-radius: 10px; } .stats h2 { margin-top: 0; } .stats p { font-size: 18px; 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; } }