feat: add price filter and dynamic slider to catalog

- Implemented JavaScript-based price slider for catalog filtering
- Updated catalog views to handle min/max price inputs and compute slider bounds
- Enhanced templates (`index.html`, `side-bar.html`) with filtering form and updated URLs
- Added CSS for price slider styling and form layout
- Introduced utility functions for URL building and price parsing
- Expanded tests for price filtering, sliders, and sidebar active states
- Updated context processor and header for dynamic navigation with price filters

static/css/catalog.css

@@ -50,6 +50,116 @@ aside {
     line-height: 1.4;
 }
 
+.catalog-filter-form {
+    display: flex;
+    flex-direction: column;
+}
+
+.catalog-price-slider {
+    display: grid;
+    gap: 14px;
+}
+
+.catalog-price-slider__values {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    color: #554971;
+    font-size: 16px;
+    line-height: 1.2;
+}
+
+.catalog-price-slider__controls {
+    position: relative;
+    height: 32px;
+}
+
+.catalog-price-slider__track {
+    position: absolute;
+    top: 50%;
+    left: 0;
+    right: 0;
+    height: 4px;
+    transform: translateY(-50%);
+    background: rgba(99, 118, 141, 0.18);
+}
+
+.catalog-price-slider__track-fill {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    background: #63768d;
+}
+
+.catalog-price-slider__range {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 32px;
+    margin: 0;
+    pointer-events: none;
+    appearance: none;
+    background: transparent;
+}
+
+.catalog-price-slider__range::-webkit-slider-thumb {
+    width: 18px;
+    height: 18px;
+    border: 2px solid #63768d;
+    border-radius: 50%;
+    background: #ffffff;
+    appearance: none;
+    pointer-events: auto;
+    cursor: pointer;
+    box-shadow: 0 0 0 3px rgba(99, 118, 141, 0.08);
+}
+
+.catalog-price-slider__range::-moz-range-thumb {
+    width: 18px;
+    height: 18px;
+    border: 2px solid #63768d;
+    border-radius: 50%;
+    background: #ffffff;
+    pointer-events: auto;
+    cursor: pointer;
+    box-shadow: 0 0 0 3px rgba(99, 118, 141, 0.08);
+}
+
+.catalog-price-slider__range::-webkit-slider-runnable-track {
+    height: 4px;
+    background: transparent;
+}
+
+.catalog-price-slider__range::-moz-range-track {
+    height: 4px;
+    background: transparent;
+}
+
+.catalog-price-slider__range:focus-visible {
+    outline: none;
+}
+
+.catalog-filter-submit {
+    min-height: 42px;
+    margin-top: 16px;
+    border: 1px solid #63768d;
+    background: #63768d;
+    color: #ffffff;
+    font-family: 'Noah', sans-serif;
+    font-size: 15px;
+    line-height: 1;
+    text-transform: uppercase;
+    cursor: pointer;
+    transition: background-color 0.2s, border-color 0.2s;
+}
+
+.catalog-filter-submit:hover {
+    background: #554971;
+    border-color: #554971;
+}
+
 .item-list {
     flex: 1 1 auto;
     min-width: 0;