.product-filter-area{background:var(--bg-light);min-height:100vh}.product-filter-container{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:2rem}.filter-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;display:flex}.filter-header h3{color:var(--text-primary);margin:0;font-size:1.25rem;font-weight:600}.filter-grid{flex-direction:column;gap:1.5rem;display:flex}.filter-row{grid-template-columns:repeat(5,1fr);align-items:end;gap:1rem;display:grid}.filter-item{flex-direction:column;display:flex;position:relative}.filter-item label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.875rem;font-weight:500}.nice-select{border:1px solid var(--border-light);border-radius:var(--radius-sm);background:var(--bg-white);width:100%;height:40px;color:var(--text-primary);transition:var(--transition-normal);cursor:pointer;z-index:10;user-select:none;box-sizing:border-box;padding:0 40px 0 12px;font-size:.875rem;line-height:38px;display:block;position:relative}.nice-select:hover{border-color:var(--primary-color)}.nice-select:focus,.nice-select.open{border-color:var(--primary-color);box-shadow:0 0 0 .2rem var(--primary-alpha-20)}.nice-select .current{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.875rem;line-height:38px;display:block;overflow:hidden}.nice-select .list{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);z-index:9999;max-height:200px;margin-top:2px;display:none;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.nice-select.open .list{z-index:9999;display:block}.nice-select .list .option{color:var(--text-primary);background:var(--bg-white);cursor:pointer;transition:var(--transition-fast);border:none;padding:.5rem .75rem;font-size:.875rem;line-height:1.5;display:block;z-index:10!important}.nice-select .list .option:hover{background:var(--bg-hover);color:var(--primary-color)}.nice-select .list .option.selected{background:var(--primary-color);color:var(--text-white)}.nice-select .list .option.focus{background:var(--bg-hover);color:var(--primary-color)}.filter-item select{display:none}.results-header{background:var(--bg-white);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);justify-content:space-between;align-items:center;padding:1rem;display:flex}.results-count{color:var(--text-secondary);font-size:.9rem}.results-count strong{color:var(--primary-color);font-weight:600}.view-controls{gap:.5rem;display:flex}.view-btn{background:var(--bg-white);border:1px solid var(--border-light);color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-normal);padding:.5rem .75rem;font-size:.875rem}.view-btn:hover{background:var(--bg-hover);border-color:var(--primary-color);color:var(--primary-color)}.view-btn.active{background:var(--primary-color);border-color:var(--primary-color);color:var(--text-white)}.loading-state{min-height:300px;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;display:flex}.spinner-border{border-color:var(--primary-color);border-right-color:#0000;width:3rem;height:3rem}.no-results{min-height:300px;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;display:flex}.no-results h4{color:var(--text-secondary);margin-bottom:1rem}.btn-primary{background:var(--primary-color);border-color:var(--primary-color);color:var(--text-white);transition:var(--transition-normal)}.btn-primary:hover{background:var(--primary-hover);border-color:var(--primary-hover);color:var(--text-white)}.btn-outline-primary{border-color:var(--primary-color);color:var(--primary-color);transition:var(--transition-normal);background:0 0}.btn-outline-primary:hover{background:var(--primary-color);border-color:var(--primary-color);color:var(--text-white)}.pagination .page-link{color:var(--text-secondary);border-color:var(--border-light);background:var(--bg-white);transition:var(--transition-normal)}.pagination .page-link:hover{color:var(--primary-color);background:var(--bg-hover);border-color:var(--primary-color)}.pagination .page-item.active .page-link{background:var(--primary-color);border-color:var(--primary-color);color:var(--text-white)}@media (width<=1200px){.filter-row{grid-template-columns:repeat(4,1fr)}}@media (width<=992px){.filter-row{grid-template-columns:repeat(3,1fr)}.product-filter-container{padding:1.5rem}}@media (width<=768px){.filter-row{grid-template-columns:repeat(2,1fr)}.filter-header{flex-direction:column;align-items:stretch;gap:1rem}.results-header{text-align:center;flex-direction:column;gap:1rem}.view-controls{justify-content:center}}@media (width<=576px){.filter-row{grid-template-columns:1fr}.product-filter-container{border-radius:var(--radius-sm);padding:1rem}.filter-grid{gap:1rem}.filter-row{gap:.75rem}.nice-select{height:36px;font-size:.8rem;line-height:34px}.nice-select .current{line-height:34px}}.nice-select .list::-webkit-scrollbar{width:4px}.nice-select .list::-webkit-scrollbar-track{background:var(--bg-light)}.nice-select .list::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:2px}.nice-select .list::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.product-filter-container{animation:.3s ease-out fadeIn}.filter-item{z-index:auto;position:relative}.filter-item .nice-select.open{z-index:9999}.nice-select .list .option.selected:hover{background:var(--primary-hover);color:var(--text-white)}.product-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-md);height:100%;transition:var(--transition-normal);flex-direction:column;padding:1.5rem;display:flex}.product-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.product-card-header{border-bottom:1px solid var(--border-light);margin-bottom:1rem;padding-bottom:1rem}.product-model{color:var(--text-primary);margin-bottom:.25rem;font-size:1.125rem;font-weight:600}.product-series{color:var(--primary-color);font-size:.875rem}.product-card-body{flex:1}.product-specs{flex-direction:column;gap:.75rem;display:flex}.spec-item{justify-content:space-between;align-items:center;font-size:.875rem;display:flex}.spec-label{color:var(--text-muted);font-weight:500}.spec-value{color:var(--text-primary);text-align:right;text-overflow:ellipsis;word-wrap:break-word;word-break:break-all;max-width:60%;overflow:hidden}.product-card-footer{border-top:1px solid var(--border-light);text-align:center;margin-top:1.5rem;padding-top:1rem}.product-list-wrapper{flex-direction:column;gap:1rem;display:flex}.product-list-item{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-md);transition:var(--transition-normal);padding:1.5rem}.product-list-item:hover{box-shadow:var(--shadow-md)}.product-list-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:1rem;display:flex}.product-list-specs{margin-bottom:1rem}.product-list-action{text-align:right}@media (width<=768px){.product-card{padding:1rem}.spec-item{font-size:.8rem}.product-list-header{flex-direction:column;align-items:flex-start;gap:.5rem}}.product-table-wrapper{background:var(--bg-white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border-color:var(--bs-body-color);overflow:hidden}.product-table{margin-bottom:0;font-size:.875rem}.product-table thead{background-color:var(--bg-light)}.product-table thead th{border-bottom:2px solid var(--border-light);color:var(--text-secondary);white-space:nowrap;text-align:center;vertical-align:middle;padding:.75rem .5rem;font-size:.8rem;font-weight:600}.product-table thead th:first-child,.product-table tbody td:first-child{width:150px;max-width:150px}.product-table tbody tr{transition:var(--transition-fast);cursor:pointer}.product-table tbody tr:hover{background-color:var(--bg-hover)}.product-table tbody td{vertical-align:middle;border-bottom:1px solid var(--border-light);color:var(--text-primary);text-align:center;padding:.75rem .5rem;font-size:.6rem}.product-table tbody tr:last-child td{border-bottom:none}.product-model{font-weight:500}.model-link{color:var(--primary-color);text-overflow:ellipsis;white-space:nowrap;font-size:.7rem;font-weight:500;text-decoration:none;display:block;overflow:hidden}.model-link:hover{color:var(--primary-hover);text-decoration:underline}.product-table thead th:nth-child(2),.product-table tbody td:nth-child(2){width:100px}.product-table thead th:nth-child(3),.product-table tbody td:nth-child(3){width:140px}.product-table thead th:nth-child(4),.product-table tbody td:nth-child(4){width:90px}.product-table thead th:nth-child(5),.product-table tbody td:nth-child(5){width:100px}.product-table thead th:nth-child(6),.product-table tbody td:nth-child(6){white-space:normal;word-break:break-word;width:140px;line-height:1.4}.product-table thead th:nth-child(7),.product-table tbody td:nth-child(7){white-space:normal;word-break:break-word;width:100px}.product-table thead th:nth-child(8),.product-table tbody td:nth-child(8){width:100px}.product-table thead th:nth-child(9),.product-table tbody td:nth-child(9){text-align:center;width:60px}.product-table{table-layout:fixed;width:100%}@media (width<=1400px){.product-table thead th:first-child,.product-table tbody td:first-child{width:130px}.product-table thead th,.product-table tbody td{padding:.5rem .25rem}}@media (width<=1800px){.product-table-wrapper{-webkit-overflow-scrolling:touch;overflow-x:auto}.product-table{min-width:1700px}}@media (width<=768px){.product-table{min-width:1000px}.product-table thead th,.product-table tbody td{padding:.4rem .25rem;font-size:.75rem}.model-link{font-size:.75rem}.color-icon{width:14px;height:14px}}.product-table.compact-mode thead th,.product-table.compact-mode tbody td{padding:.5rem .25rem;font-size:.75rem}.product-table.compact-mode .model-link{font-size:.75rem}.product-table tbody td{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.product-table tbody td:nth-child(7){white-space:normal;word-break:break-word}.color-cell{text-align:center}.color-icon{vertical-align:middle;border-radius:50%;width:20px;height:20px;display:inline-block;position:relative}.color-icon-rgb{background:conic-gradient(red 0deg,#f80 60deg,#ff0 120deg,#0f0 180deg,#08f 240deg,#00f 300deg,red 360deg);box-shadow:0 2px 4px #0003}.color-icon-mono{background:linear-gradient(90deg,#000 50%,#fff 50%);border:1px solid #ccc;box-shadow:0 2px 4px #0003}@media (width<=1200px){.product-table-wrapper{-webkit-overflow-scrolling:touch;overflow-x:auto}.product-table{min-width:900px}}@media (width<=768px){.product-table{min-width:1000px;font-size:.5rem}.product-table thead th,.product-table tbody td{padding:.5rem}}@keyframes tableRowFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.product-table tbody tr{animation:.3s ease-out tableRowFadeIn}.product-table tbody tr:first-child{animation-delay:50ms}.product-table tbody tr:nth-child(2){animation-delay:.1s}.product-table tbody tr:nth-child(3){animation-delay:.15s}.product-table tbody tr:nth-child(4){animation-delay:.2s}.product-table tbody tr:nth-child(5){animation-delay:.25s}.product-table tbody tr:nth-child(6){animation-delay:.3s}.product-table tbody tr:nth-child(7){animation-delay:.35s}.product-table tbody tr:nth-child(8){animation-delay:.4s}.product-table tbody tr:nth-child(9){animation-delay:.45s}.product-table tbody tr:nth-child(10){animation-delay:.5s}.product-table tbody tr:nth-child(11){animation-delay:.55s}.product-table tbody tr:nth-child(12){animation-delay:.6s}.product-table tbody tr:nth-child(13){animation-delay:.65s}.product-table tbody tr:nth-child(14){animation-delay:.7s}.product-table tbody tr:nth-child(15){animation-delay:.75s}.product-table-wrapper.sticky-header{max-height:600px;overflow-y:auto}.product-table-wrapper.sticky-header thead{z-index:10;background-color:var(--bg-light);position:sticky;top:0}.product-table thead th.sortable{cursor:pointer;user-select:none;padding-right:1.5rem;position:relative}.product-table thead th.sortable:hover{background-color:var(--bg-hover)}.product-table thead th.sortable:after{content:"";opacity:.3;font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;right:.5rem}.product-table thead th.sortable.asc:after{content:"";opacity:1}.product-table thead th.sortable.desc:after{content:"";opacity:1}