*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}body{color:#333;background-color:#f4f7f6}.navbar{color:#fff;z-index:100;background:#0f172a;justify-content:space-between;align-items:center;padding:15px 40px;display:flex;position:sticky;top:0;box-shadow:0 2px 8px #0000001a}.navbar h2{font-size:22px;font-weight:700}.nav-links{align-items:center;gap:20px;display:flex}.nav-links a{color:#e2e8f0;font-size:15px;text-decoration:none;transition:all .2s}.nav-links a:hover{color:#38bdf8}.nav-links span{color:#fff;background:#ef4444;border-radius:50%;margin-left:5px;padding:2px 6px;font-size:12px}.nav-links button{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:6px;padding:6px 12px}.nav-links button:hover{background:#dc2626}.products{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;max-width:1200px;margin:auto;padding:40px;display:grid}.card{text-align:center;background:#fff;border-radius:12px;flex-direction:column;align-items:center;padding:20px;transition:all .3s;display:flex;box-shadow:0 4px 10px #0000000d}.card:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0000001a}.card img{object-fit:contain;width:150px;height:150px}.card h1{margin:10px 0;font-size:16px}.card p{color:#27ae60;font-size:18px;font-weight:700}.card button{color:#fff;cursor:pointer;background:#3498db;border:none;border-radius:6px;width:100%;margin-top:10px;padding:10px}.card button:hover{background:#2980b9}.cart-container{background:#fff;border-radius:12px;max-width:1000px;margin:40px auto;padding:20px;box-shadow:0 4px 15px #0000000d}.cart-item{border-bottom:1px solid #eee;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;padding:15px;display:flex}.cart-item img{object-fit:contain;width:80px;height:80px}.cart-item h3{flex:1;min-width:150px}.quantity{background:#f1f2f6;border-radius:6px;align-items:center;gap:10px;padding:5px;display:flex}.quantity button{cursor:pointer;background:#fff;border:1px solid #ddd;width:28px;height:28px;font-weight:700}.quantity button:hover{background:#e0e0e0}.remove-btn{color:#fff;cursor:pointer;background:#e74c3c;border:none;border-radius:6px;padding:8px 15px}.remove-btn:hover{background:#c0392b}.total-box{text-align:right;margin-top:30px}.total-box h2{margin-bottom:10px}.clear-btn{color:#fff;cursor:pointer;background:#7f8c8d;border:none;border-radius:6px;padding:10px 20px}.clear-btn:hover{background:#95a5a6}.empty{text-align:center;color:#7f8c8d;padding:40px}.product-link{text-decoration:none}@media (width<=768px){.navbar{flex-direction:column;gap:10px}.nav-links{flex-wrap:wrap;justify-content:center}}.product-details-container{background-color:#fff;border-radius:8px;gap:4rem;max-width:1200px;margin:2rem auto;padding:2rem;display:flex;box-shadow:0 2px 10px #0000001a}.product-image-section{border:1px solid #eee;border-radius:8px;flex:1;justify-content:center;align-items:center;padding:2rem;display:flex}.product-image-section img{object-fit:contain;max-width:100%;max-height:400px}.product-info-section{flex-direction:column;flex:1;gap:1rem;display:flex}.product-category{color:#888;letter-spacing:1px;font-size:.9rem}.product-title{color:#333;margin:0;font-size:2rem}.product-rating{color:#007185;font-weight:700}.product-price{color:#b12704;margin:0;font-size:2.5rem}.product-description{color:#555;margin-bottom:1.5rem;line-height:1.6}.add-to-cart-btn-large{color:#0f1111;cursor:pointer;background-color:#ffd814;border:none;border-radius:50px;width:100%;max-width:300px;padding:1rem 2rem;font-size:1.1rem;font-weight:700;transition:background-color .2s}.add-to-cart-btn-large:hover{background-color:#f7ca00}@media (width<=768px){.product-details-container{flex-direction:column;gap:2rem;padding:1rem}}.search-container{flex:1;max-width:600px;margin:0 24px;display:flex}.search-container input{border:none;border-radius:6px;outline:none;width:100%;padding:10px 16px;font-size:1rem;transition:box-shadow .2s ease-in-out}.search-container input:focus{box-shadow:0 0 0 3px #f90}@media (width<=768px){.search-container{width:100%;margin:10px 0}}.category-container{margin-right:20px}.category-select{color:#0f172a;cursor:pointer;appearance:auto;background-color:#f1f5f9;border:none;border-radius:6px;outline:none;padding:10px 16px;font-size:1rem;font-weight:500;transition:all .2s ease-in-out}.category-select:focus{background-color:#fff;box-shadow:0 0 0 3px #f90}.category-select:hover{background-color:#e2e8f0}@media (width<=768px){.category-container{width:100%;margin-bottom:10px;margin-right:0}.category-select{width:100%}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-grid{animation:.4s ease-out forwards fadeSlideUp}.product-page{background:#f5f5f5;padding:30px;font-family:Segoe UI,sans-serif}.back-btn{cursor:pointer;color:#007bff;background:0 0;border:none;margin-bottom:20px;font-size:16px}.back-btn:hover{text-decoration:underline}.product-card{background:#fff;border-radius:15px;gap:40px;padding:30px;display:flex;box-shadow:0 5px 20px #0000001a}.image-section{flex:1;justify-content:center;align-items:center;display:flex}.image-section img{object-fit:contain;max-width:100%;max-height:400px}.details-section{flex-direction:column;flex:1;display:flex}.category{color:gray;margin-bottom:5px;font-size:14px}.title{margin-bottom:10px;font-size:28px}.rating{color:#f5a623;margin-bottom:10px}.rating-count{color:#555;margin-left:10px}.price{color:#e63946;margin:15px 0;font-size:26px;font-weight:700}.description{color:#444;margin-bottom:20px;line-height:1.6}.quantity{align-items:center;gap:15px;margin-bottom:20px;display:flex}.quantity button{cursor:pointer;padding:5px 12px;font-size:18px}.add-btn{cursor:pointer;background:#ff9f00;border:none;border-radius:8px;padding:12px;font-size:16px;transition:all .3s}.add-btn:hover{background:#fb8c00;transform:scale(1.05)}.loading,.error{text-align:center;margin-top:50px}@media (width<=768px){.product-card{flex-direction:column}.image-section img{max-height:250px}}.login-container{background:linear-gradient(135deg,#667eea,#764ba2);justify-content:center;align-items:center;height:100vh;display:flex}.login-card{text-align:center;background:#fff;border-radius:12px;width:350px;padding:30px;box-shadow:0 10px 25px #0003}.login-card h2{color:#333;margin-bottom:20px}.input-group{text-align:left;flex-direction:column;margin-bottom:15px;display:flex}.input-group label{color:#555;margin-bottom:5px;font-size:14px}.input-group input{border:1px solid #ccc;border-radius:6px;outline:none;padding:10px;font-size:14px;transition:all .3s}.input-group input:focus{border-color:#667eea;box-shadow:0 0 5px #667eea80}.login-btn{color:#fff;cursor:pointer;background-color:#667eea;border:none;border-radius:6px;width:100%;margin-top:10px;padding:10px;font-size:15px;transition:all .3s}.login-btn:hover{background-color:#5a67d8}.login-btn[style]{background-color:red!important}.login-btn[style]:hover{background-color:#8b0000!important}.secondary{background-color:#48bb78}.secondary:hover{background-color:#38a169}.orders-container{max-width:900px;margin:40px auto;padding:20px}.title{text-align:center;margin-bottom:30px;font-size:28px;font-weight:700}.order-card{background:#fff;border-radius:12px;margin-bottom:20px;padding:20px;transition:transform .2s;box-shadow:0 4px 10px #0000001a}.order-card:hover{transform:scale(1.02)}.order-header{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.status{color:#fff;background:#28a745;border-radius:20px;padding:5px 12px;font-size:12px}.order-items{border-top:1px solid #eee;padding-top:10px}.order-item{justify-content:space-between;padding:5px 0;display:flex}.order-footer{text-align:right;margin-top:10px;font-size:18px;font-weight:700}.empty{text-align:center;margin-top:100px}.status.pending{background:orange}.status.delivered{background:green}