.product-card{border:1px solid #e0e0e0;border-radius:12px;padding:16px;cursor:pointer;transition:all .3s ease;background:#fff;box-shadow:0 2px 8px #00000014;height:100%;display:flex;flex-direction:column}.product-card:hover{border-color:#2196f3;box-shadow:0 8px 24px #2196f326;transform:translateY(-4px)}.product-image{position:relative;width:100%;height:200px;margin-bottom:16px;border-radius:8px;overflow:hidden;background:#f5f5f5;display:flex;align-items:center;justify-content:center}.product-image img{width:100%;height:100%;transition:opacity .3s ease,object-fit .2s ease,transform .3s ease}.product-image.image-cover img{object-fit:cover}.product-image.image-contain{background:linear-gradient(135deg,#f8f9fa,#e9ecef);background-size:20px 20px;background-image:radial-gradient(circle at 10px 10px,rgba(255,255,255,.1) 1px,transparent 0)}.product-image.image-contain img{object-fit:contain}.product-card:hover .product-image img{transform:scale(1.02)}.product-image.image-contain:hover img{transform:scale(1.05)}.no-image{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#999;font-style:italic}.product-brand-badge{position:absolute;top:8px;right:8px;background:#2196f3e6;color:#fff;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:500;text-transform:uppercase}.product-info{flex:1;display:flex;flex-direction:column;text-align:left}.product-title{font-size:16px;font-weight:600;margin:0 0 8px;color:#333;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-meta{margin-bottom:8px}.product-meta p{margin:0 0 4px;font-size:12px;color:#666}.product-sku{font-family:monospace;font-weight:500}.product-model{color:#888}.product-description{font-size:13px;color:#666;margin:0 0 12px;line-height:1.4;flex:1}.product-pricing{margin-bottom:12px}.product-price{font-size:18px;font-weight:700;color:#2196f3;margin:0 0 4px}.price-tiers-info{font-size:11px;color:#888;margin:0;font-style:italic}.product-details{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}.product-category,.product-supplier{font-size:11px;padding:4px 8px;border-radius:12px;background:#f0f7ff;color:#1976d2;border:1px solid #e3f2fd}.product-supplier{background:#f3e5f5;color:#7b1fa2;border-color:#f8bbd9}.product-color{display:flex;align-items:center;gap:6px;font-size:12px;margin-top:auto}.color-label{color:#666;font-weight:500}.color-name{color:#333}.color-swatch{width:16px;height:16px;border-radius:50%;border:1px solid #ddd;flex-shrink:0}@media (max-width: 768px){.product-card{padding:12px}.product-image{height:160px;margin-bottom:12px}.product-card:hover .product-image img{transform:scale(1.01)}.product-image.image-contain:hover img{transform:scale(1.02)}.product-title{font-size:14px}.product-price{font-size:16px}}@media (max-width: 480px){.product-image{height:140px}.product-image.image-contain{background-size:15px 15px;background-image:radial-gradient(circle at 7.5px 7.5px,rgba(255,255,255,.1) 1px,transparent 0)}}.filter-bar{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:20px;margin-bottom:20px;box-shadow:0 2px 8px #00000014}.filter-section h3{margin:0 0 20px;color:#333;font-size:18px;font-weight:600;border-bottom:2px solid #2196f3;padding-bottom:8px}.filter-group{margin-bottom:16px}.filter-group label{display:block;margin-bottom:6px;font-weight:500;color:#555;font-size:14px}.filter-group input,.filter-group select{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;background:#fff;transition:border-color .2s ease}.filter-group input:focus,.filter-group select:focus{outline:none;border-color:#2196f3;box-shadow:0 0 0 2px #2196f31a}.filter-group input:disabled,.filter-group select:disabled{background:#f5f5f5;color:#999;cursor:not-allowed}.price-range{display:flex;align-items:center;gap:8px}.price-range input{flex:1}.price-range span{color:#666;font-size:14px;white-space:nowrap}.reset-filters-btn{width:100%;padding:12px;background:#f44336;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease;margin-top:8px}.reset-filters-btn:hover:not(:disabled){background:#d32f2f}.reset-filters-btn:disabled{background:#ccc;cursor:not-allowed}@media (max-width: 768px){.filter-bar{padding:16px;margin-bottom:16px}.filter-section h3{font-size:16px;margin-bottom:16px}.filter-group{margin-bottom:12px}.price-range{flex-direction:column;gap:8px}.price-range span{align-self:center}}@media (min-width: 769px) and (max-width: 1024px){.filter-bar{padding:18px}}.product-list-page{max-width:1400px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.page-header h1{margin:0;color:#333;font-size:32px;font-weight:700}.page-actions{display:flex;align-items:center;gap:20px}.sort-section{display:flex;align-items:center;gap:8px}.sort-section label{font-weight:500;color:#555;white-space:nowrap}.sort-section select{padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;background:#fff;min-width:160px}.sort-section select:focus{outline:none;border-color:#2196f3;box-shadow:0 0 0 2px #2196f31a}.product-list-content{display:grid;grid-template-columns:300px 1fr;gap:30px;align-items:start}.sidebar{position:sticky;top:20px}.main-content{min-height:500px}.error-message{background:#ffebee;border:1px solid #f44336;border-radius:8px;padding:20px;text-align:center;margin-bottom:20px}.loading-state{text-align:center;padding:60px 20px;color:#666}.loading-state p{font-size:18px;margin:0}.results-summary{margin-bottom:20px;padding:12px 16px;background:#f8f9fa;border-radius:6px;border-left:4px solid #2196f3}.results-summary p{margin:0;color:#555;font-weight:500}.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-bottom:30px}.pagination{display:flex;justify-content:center;align-items:center;gap:20px;padding:20px 0;border-top:1px solid #e0e0e0}.pagination-btn{padding:10px 20px;background:#2196f3;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:500;transition:background-color .2s ease}.pagination-btn:hover:not(:disabled){background:#1976d2}.pagination-btn:disabled{background:#ccc;cursor:not-allowed}.pagination-info{display:flex;align-items:center;gap:10px}.pagination-info span{font-weight:500;color:#555}.no-products{text-align:center;padding:60px 20px;color:#666}.no-products h3{margin:0 0 10px;color:#333;font-size:24px}.no-products p{margin:0;font-size:16px}@media (max-width: 1024px){.product-list-content{grid-template-columns:280px 1fr;gap:20px}.products-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}}@media (max-width: 768px){.product-list-page{padding:16px}.page-header{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:20px}.page-header h1{font-size:28px}.page-actions{width:100%;justify-content:flex-end}.product-list-content{grid-template-columns:1fr;gap:20px}.sidebar{position:static;order:2}.main-content{order:1}.products-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.pagination{flex-direction:column;gap:12px}.pagination-btn{width:100%;max-width:200px}}@media (max-width: 480px){.product-list-page{padding:12px}.page-header h1{font-size:24px}.products-grid{grid-template-columns:1fr;gap:12px}.sort-section{flex-direction:column;align-items:flex-start;gap:6px}.sort-section select{width:100%;min-width:unset}}.product-detail-page{max-width:1400px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid #f0f0f0}.back-btn{display:flex;align-items:center;padding:10px 16px;background:#2196f3;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:500;font-size:14px;transition:background-color .2s ease}.back-btn:hover{background:#1976d2}.product-status{display:flex;align-items:center}.status-badge{padding:6px 12px;border-radius:16px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-badge.active{background:#e8f5e8;color:#2e7d32}.status-badge.inactive{background:#ffebee;color:#c62828}.loading-state,.error-message{text-align:center;padding:60px 20px;color:#666}.error-message{background:#ffebee;border:1px solid #f44336;border-radius:8px;margin:20px 0}.error-message p{margin:0 0 15px;color:#d32f2f;font-weight:500}.error-message button{background:#f44336;color:#fff;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;font-weight:500}.error-message button:hover{background:#d32f2f}.product-detail-content{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}.product-images{position:sticky;top:20px}.main-image{position:relative;margin-bottom:16px;border-radius:12px;overflow:hidden;box-shadow:0 4px 20px #0000001a}.main-image img{width:100%;height:auto;max-height:500px;display:block;transition:object-fit .3s ease}.main-image.image-cover img{object-fit:cover}.main-image.image-contain{background:linear-gradient(135deg,#f8f9fa,#e9ecef);background-size:30px 30px;background-image:radial-gradient(circle at 15px 15px,rgba(255,255,255,.1) 2px,transparent 0)}.main-image.image-contain img{object-fit:contain}.image-type-badge{position:absolute;top:12px;left:12px;background:#000000b3;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.image-thumbnails{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:8px}.thumbnail{border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;transition:border-color .2s ease;background:linear-gradient(135deg,#f8f9fa,#e9ecef);padding:0}.thumbnail:hover{border-color:#2196f3}.thumbnail.active{border-color:#2196f3;box-shadow:0 0 0 2px #2196f333}.thumbnail img{width:100%;height:80px;object-fit:contain;display:block}.no-images{background:#f5f5f5;border:2px dashed #ddd;border-radius:12px;padding:60px 20px;text-align:center;color:#666}.product-info{max-width:100%}.product-header{display:flex;align-items:flex-start;gap:20px;margin-bottom:30px}.product-header h1{margin:0;color:#333;font-size:32px;font-weight:700;line-height:1.2;flex:1}.brand-badge{background:#2196f3;color:#fff;padding:8px 16px;border-radius:20px;font-weight:600;font-size:14px;white-space:nowrap}.product-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-bottom:30px;padding:20px;background:#f8f9fa;border-radius:12px}.meta-item{display:flex;align-items:center;gap:8px}.meta-item .label{font-weight:600;color:#555;min-width:100px}.meta-item .value{color:#333;font-family:Monaco,Menlo,monospace;font-size:14px}.product-description,.product-categories,.price-tiers,.product-details,.technical-info{margin-bottom:30px;padding:20px;background:#fff;border:1px solid #e0e0e0;border-radius:12px}.product-description h3,.product-categories h3,.price-tiers h3,.product-details h3,.technical-info h3{margin:0 0 16px;color:#333;font-size:20px;font-weight:600;border-bottom:2px solid #2196f3;padding-bottom:8px}.product-description p{margin:0;line-height:1.6;color:#555}.category-tags{display:flex;flex-wrap:wrap;gap:8px}.category-tag{background:#e3f2fd;color:#1976d2;padding:6px 12px;border-radius:16px;font-size:14px;font-weight:500}.price-table{border-radius:8px;overflow:hidden;border:1px solid #e0e0e0}.price-header{display:grid;grid-template-columns:1fr 1fr 1fr;background:#f5f5f5;font-weight:600;color:#333}.price-header span{padding:12px 16px;border-right:1px solid #e0e0e0}.price-header span:last-child{border-right:none}.price-row{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid #e0e0e0}.price-row span{padding:12px 16px;border-right:1px solid #e0e0e0;color:#555}.price-row span:last-child{border-right:none}.price-row:nth-child(2n){background:#fafafa}.details-grid,.tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.detail-item,.tech-item{display:flex;align-items:center;gap:8px;padding:12px;background:#f8f9fa;border-radius:8px}.detail-item .label,.tech-item .label{font-weight:600;color:#555;min-width:120px}.detail-item .value,.tech-item .value{color:#333;flex:1}.detail-item .value.mono,.tech-item .value.mono{font-family:Monaco,Menlo,monospace;font-size:12px}.color-info{display:flex;align-items:center;gap:8px}.color-swatch{width:20px;height:20px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0000001a;cursor:pointer}@media (max-width: 1024px){.product-detail-content{grid-template-columns:1fr;gap:30px}.product-images{position:static}.product-meta{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}@media (max-width: 768px){.product-detail-page{padding:16px}.page-header{flex-direction:column;align-items:flex-start;gap:16px}.product-header{flex-direction:column;gap:12px}.product-header h1{font-size:24px}.product-meta{grid-template-columns:1fr;gap:12px}.meta-item{flex-direction:column;align-items:flex-start;gap:4px}.meta-item .label{min-width:unset}.details-grid,.tech-grid{grid-template-columns:1fr;gap:12px}.detail-item,.tech-item{flex-direction:column;align-items:flex-start;gap:4px}.detail-item .label,.tech-item .label{min-width:unset}.price-header,.price-row{grid-template-columns:1fr 1fr;font-size:14px}.price-header span:last-child,.price-row span:last-child{display:none}.image-thumbnails{grid-template-columns:repeat(auto-fit,minmax(60px,1fr))}.thumbnail img{height:60px}}@media (max-width: 480px){.product-detail-page{padding:12px}.product-header h1{font-size:20px}.brand-badge{padding:6px 12px;font-size:12px}.product-description,.product-categories,.price-tiers,.product-details,.technical-info{padding:16px;margin-bottom:20px}.category-tags{gap:6px}.category-tag{padding:4px 8px;font-size:12px}}.app{min-height:100vh;display:flex;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#f5f5f5}.app-header{background:#fff;border-bottom:1px solid #e0e0e0;box-shadow:0 2px 4px #0000001a;position:sticky;top:0;z-index:100}.header-content{max-width:1400px;margin:0 auto;padding:16px 20px;display:flex;justify-content:space-between;align-items:center}.logo{margin:0;color:#2196f3;font-size:24px;font-weight:700;text-decoration:none}.main-nav{display:flex;gap:20px}.nav-link{color:#555;text-decoration:none;font-weight:500;padding:8px 16px;border-radius:6px;transition:all .2s ease}.nav-link:hover{color:#2196f3;background:#f0f8ff}.nav-link.active{color:#2196f3;background:#e3f2fd}.app-main{flex:1;padding:0}.app-footer{background:#fff;border-top:1px solid #e0e0e0;margin-top:auto}.footer-content{max-width:1400px;margin:0 auto;padding:20px;text-align:center;color:#666;font-size:14px}*{box-sizing:border-box}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;color:#333}@media (max-width: 768px){.header-content{padding:12px 16px;flex-direction:column;gap:12px}.logo{font-size:20px}.main-nav{gap:12px}.nav-link{padding:6px 12px;font-size:14px}.footer-content{padding:16px}}@media (max-width: 480px){.header-content{padding:10px 12px}.logo{font-size:18px}.nav-link{padding:4px 8px;font-size:13px}}