.products-page-section{padding:var(--spacing-xl)0;background:var(--color-gray-50);min-height:60vh}.products-layout{gap:var(--spacing-xl);grid-template-columns:280px 1fr;display:grid;position:relative}.mobile-filter-toggle{justify-content:center;align-items:center;gap:var(--spacing-sm);width:100%;padding:var(--spacing-md);background:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-md);color:var(--color-deep-blue);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-base);margin-bottom:var(--spacing-md);display:none;position:relative}.mobile-filter-toggle:hover{background:var(--color-gray-50);border-color:var(--color-light-blue)}.mobile-filter-toggle .filter-badge{background:var(--color-light-blue);border-radius:50%;width:10px;height:10px;position:absolute;top:12px;right:12px}.filters-sidebar{background:var(--color-white);border-radius:var(--radius-lg);border:1px solid var(--color-gray-200);padding:var(--spacing-lg);height:fit-content;position:sticky;top:100px}.filters-header{margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:2px solid var(--color-gray-100);justify-content:space-between;align-items:center;display:flex}.filters-header h3{align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-deep-blue);margin:0;display:flex}.close-filters{background:var(--color-gray-100);border-radius:var(--radius-md);width:36px;height:36px;color:var(--color-gray-600);cursor:pointer;transition:all var(--transition-base);border:none;justify-content:center;align-items:center;display:none}.close-filters:hover{background:var(--color-gray-200);color:var(--color-deep-blue)}.clear-filters-btn{justify-content:center;align-items:center;gap:var(--spacing-xs);width:100%;padding:var(--spacing-sm)var(--spacing-md);background:var(--color-gray-100);border-radius:var(--radius-md);color:var(--color-gray-700);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base);margin-bottom:var(--spacing-lg);border:none;display:flex}.clear-filters-btn:hover{background:var(--color-gray-200);color:var(--color-deep-blue)}.filter-group{margin-bottom:var(--spacing-md);border-bottom:1px solid var(--color-gray-100);padding-bottom:var(--spacing-md)}.filter-group:last-of-type{border-bottom:none;margin-bottom:0;padding-bottom:0}.filter-group-header{width:100%;padding:var(--spacing-sm)0;color:var(--color-deep-blue);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:color var(--transition-base);background:0 0;border:none;justify-content:space-between;align-items:center;display:flex}.filter-group-header:hover{color:var(--color-light-blue)}.filter-options{gap:var(--spacing-xs);margin-top:var(--spacing-sm);max-height:250px;padding-right:var(--spacing-xs);flex-direction:column;display:flex;overflow-y:auto}.filter-options::-webkit-scrollbar{width:4px}.filter-options::-webkit-scrollbar-track{background:var(--color-gray-100);border-radius:2px}.filter-options::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:2px}.filter-option{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-xs)var(--spacing-sm);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-base);font-size:var(--font-size-sm);color:var(--color-gray-700);display:flex}.filter-option:hover{background:var(--color-gray-50)}.filter-option.active{color:var(--color-light-blue);background:#007bff14}.filter-option input[type=radio],.filter-option input[type=checkbox]{display:none}.filter-option .option-label{flex:1}.filter-option .option-count{font-size:var(--font-size-xs);color:var(--color-gray-500);background:var(--color-gray-100);border-radius:var(--radius-full);padding:2px 8px}.filter-option.active .option-count{color:var(--color-light-blue);background:#007bff26}.filter-option.checkbox .checkmark{border:2px solid var(--color-gray-300);border-radius:var(--radius-sm);width:18px;height:18px;transition:all var(--transition-base);flex-shrink:0;position:relative}.filter-option.checkbox.active .checkmark{background:var(--color-light-blue);border-color:var(--color-light-blue)}.filter-option.checkbox.active .checkmark:after{content:"";border:2px solid #fff;border-width:0 2px 2px 0;width:5px;height:9px;position:absolute;top:2px;left:5px;transform:rotate(45deg)}.price-filter{padding:var(--spacing-sm)0}.price-inputs{align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);display:flex}.price-input-group{flex:1}.price-input-group label{font-size:var(--font-size-xs);color:var(--color-gray-500);margin-bottom:var(--spacing-xs);display:block}.price-input-group input{width:100%;padding:var(--spacing-sm);border:1px solid var(--color-gray-200);border-radius:var(--radius-sm);font-size:var(--font-size-sm);color:var(--color-deep-blue);transition:border-color var(--transition-base)}.price-input-group input:focus{border-color:var(--color-light-blue);outline:none}.price-separator{color:var(--color-gray-400);padding-top:var(--spacing-md)}.price-slider{appearance:none;background:var(--color-gray-200);border-radius:3px;outline:none;width:100%;height:6px}.price-slider::-webkit-slider-thumb{appearance:none;background:var(--color-light-blue);cursor:pointer;border:2px solid var(--color-white);border-radius:50%;width:18px;height:18px;box-shadow:0 2px 4px #0003}.price-slider::-moz-range-thumb{background:var(--color-light-blue);cursor:pointer;border:2px solid var(--color-white);border-radius:50%;width:18px;height:18px;box-shadow:0 2px 4px #0003}.apply-filters-btn{width:100%;padding:var(--spacing-md);background:linear-gradient(135deg,var(--color-light-blue)0%,var(--color-medium-blue)100%);border-radius:var(--radius-md);color:var(--color-white);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;margin-top:var(--spacing-lg);transition:all var(--transition-base);border:none;display:none}.apply-filters-btn:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.products-main{min-width:0}.products-toolbar{background:var(--color-white);padding:var(--spacing-md)var(--spacing-lg);border-radius:var(--radius-lg);border:1px solid var(--color-gray-200);margin-bottom:var(--spacing-lg);justify-content:space-between;align-items:center;gap:var(--spacing-md);flex-wrap:wrap;display:flex}.results-info{align-items:center;gap:var(--spacing-sm);flex-wrap:wrap;display:flex}.results-count{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-deep-blue)}.current-category{font-size:var(--font-size-sm);color:var(--color-gray-600)}.sort-select{align-items:center;gap:var(--spacing-sm);display:flex}.sort-select label{font-size:var(--font-size-sm);color:var(--color-gray-600);white-space:nowrap}.sort-select select{padding:var(--spacing-sm)var(--spacing-md);padding-right:var(--spacing-xl);border:1px solid var(--color-gray-200);border-radius:var(--radius-md);background:var(--color-white);font-size:var(--font-size-sm);color:var(--color-deep-blue);cursor:pointer;appearance:none;transition:border-color var(--transition-base);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat}.sort-select select:focus{border-color:var(--color-light-blue);outline:none}.products-grid{gap:var(--spacing-lg);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.empty-state{text-align:center;padding:var(--spacing-3xl)var(--spacing-xl);background:var(--color-white);border-radius:var(--radius-lg);border:1px solid var(--color-gray-200);color:var(--color-gray-600)}.empty-state svg{color:var(--color-gray-400);margin-bottom:var(--spacing-md)}.empty-state p{font-size:var(--font-size-lg);margin-bottom:var(--spacing-lg)}.btn-reset-filter{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm)var(--spacing-lg);background:linear-gradient(135deg,var(--color-light-blue)0%,var(--color-medium-blue)100%);color:var(--color-white);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);border:none;display:inline-flex}.btn-reset-filter:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}@media (max-width:1024px){.products-layout{gap:var(--spacing-lg);grid-template-columns:250px 1fr}.products-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}}@media (max-width:768px){.products-page-section{padding:var(--spacing-lg)0}.products-layout{display:block}.mobile-filter-toggle{display:flex}.filters-sidebar{z-index:1000;padding:var(--spacing-lg);-webkit-overflow-scrolling:touch;border-radius:0;padding-bottom:100px;transition:transform .3s;position:fixed;inset:0;overflow-y:auto;transform:translate(-100%)}.filters-sidebar.show{transform:translate(0)}.filters-header{background:var(--color-white);z-index:10;margin:calc(-1*var(--spacing-lg));margin-bottom:var(--spacing-lg);padding:var(--spacing-lg);border-bottom:1px solid var(--color-gray-200);position:sticky;top:0}.close-filters{width:40px;height:40px;display:flex}.apply-filters-btn{z-index:1001;padding:var(--spacing-lg);border-radius:0;display:block;position:fixed;bottom:0;left:0;right:0}.filter-options{max-height:none}.products-toolbar{padding:var(--spacing-md);flex-direction:column;align-items:stretch}.results-info,.sort-select{justify-content:center}.products-grid{gap:var(--spacing-md);grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}@media (max-width:480px){.products-grid{grid-template-columns:1fr}.empty-state{padding:var(--spacing-2xl)var(--spacing-md)}.price-inputs{flex-direction:column}.price-separator{display:none}.price-input-group{width:100%}}