/* Start:/local/templates/main/css/vendor/normalize.min.css?17841810141830*/ /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none} /*# sourceMappingURL=normalize.min.css.map */ /* End */ /* Start:/local/templates/main/css/vendor/swiper-bundle.min.css?178418101415834*/ /** * Swiper 8.0.6 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2022 Vladimir Kharlampidi * * Released under the MIT License * * Released on: February 14, 2022 */ @font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-pointer-events{touch-action:pan-y}.swiper-pointer-events.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d,.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;text-transform:none;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:10px;right:auto}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:10px;left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:50%;background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active,.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-next+.swiper-slide,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden} /* End */ /* Start:/local/templates/main/css/vendor/fancybox.min.css?178418101425343*/ :root{--f-spinner-width: 36px;--f-spinner-height: 36px;--f-spinner-color-1: rgba(0, 0, 0, 0.1);--f-spinner-color-2: rgba(17, 24, 28, 0.8);--f-spinner-stroke: 2.75}.f-spinner{margin:auto;padding:0;width:var(--f-spinner-width);height:var(--f-spinner-height)}.f-spinner svg{width:100%;height:100%;vertical-align:top;animation:f-spinner-rotate 2s linear infinite}.f-spinner svg *{stroke-width:var(--f-spinner-stroke);fill:none}.f-spinner svg *:first-child{stroke:var(--f-spinner-color-1)}.f-spinner svg *:last-child{stroke:var(--f-spinner-color-2);animation:f-spinner-dash 2s ease-in-out infinite}@keyframes f-spinner-rotate{100%{transform:rotate(360deg)}}@keyframes f-spinner-dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}100%{stroke-dasharray:90,150;stroke-dashoffset:-124}}.f-throwOutUp{animation:var(--f-throw-out-duration, 0.175s) ease-out both f-throwOutUp}.f-throwOutDown{animation:var(--f-throw-out-duration, 0.175s) ease-out both f-throwOutDown}@keyframes f-throwOutUp{to{transform:translate3d(0, calc(var(--f-throw-out-distance, 150px) * -1), 0);opacity:0}}@keyframes f-throwOutDown{to{transform:translate3d(0, var(--f-throw-out-distance, 150px), 0);opacity:0}}.f-zoomInUp{animation:var(--f-transition-duration, 0.2s) ease .1s both f-zoomInUp}.f-zoomOutDown{animation:var(--f-transition-duration, 0.2s) ease both f-zoomOutDown}@keyframes f-zoomInUp{from{transform:scale(0.975) translate3d(0, 16px, 0);opacity:0}to{transform:scale(1) translate3d(0, 0, 0);opacity:1}}@keyframes f-zoomOutDown{to{transform:scale(0.975) translate3d(0, 16px, 0);opacity:0}}.f-fadeIn{animation:var(--f-transition-duration, 0.2s) var(--f-transition-easing, ease) var(--f-transition-delay, 0s) both f-fadeIn;z-index:2}.f-fadeOut{animation:var(--f-transition-duration, 0.2s) var(--f-transition-easing, ease) var(--f-transition-delay, 0s) both f-fadeOut;z-index:1}@keyframes f-fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes f-fadeOut{100%{opacity:0}}.f-fadeFastIn{animation:var(--f-transition-duration, 0.2s) ease-out both f-fadeFastIn;z-index:2}.f-fadeFastOut{animation:var(--f-transition-duration, 0.1s) ease-out both f-fadeFastOut;z-index:2}@keyframes f-fadeFastIn{0%{opacity:.75}100%{opacity:1}}@keyframes f-fadeFastOut{100%{opacity:0}}.f-fadeSlowIn{animation:var(--f-transition-duration, 0.5s) ease both f-fadeSlowIn;z-index:2}.f-fadeSlowOut{animation:var(--f-transition-duration, 0.5s) ease both f-fadeSlowOut;z-index:1}@keyframes f-fadeSlowIn{0%{opacity:0}100%{opacity:1}}@keyframes f-fadeSlowOut{100%{opacity:0}}.f-crossfadeIn{animation:var(--f-transition-duration, 0.2s) ease-out both f-crossfadeIn;z-index:2}.f-crossfadeOut{animation:calc(var(--f-transition-duration, 0.2s)*.5) linear .1s both f-crossfadeOut;z-index:1}@keyframes f-crossfadeIn{0%{opacity:0}100%{opacity:1}}@keyframes f-crossfadeOut{100%{opacity:0}}.f-slideIn.from-next{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideInNext}.f-slideIn.from-prev{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideInPrev}.f-slideOut.to-next{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideOutNext}.f-slideOut.to-prev{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideOutPrev}@keyframes f-slideInPrev{0%{transform:translateX(100%)}100%{transform:translate3d(0, 0, 0)}}@keyframes f-slideInNext{0%{transform:translateX(-100%)}100%{transform:translate3d(0, 0, 0)}}@keyframes f-slideOutNext{100%{transform:translateX(-100%)}}@keyframes f-slideOutPrev{100%{transform:translateX(100%)}}.f-classicIn.from-next{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicInNext;z-index:2}.f-classicIn.from-prev{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicInPrev;z-index:2}.f-classicOut.to-next{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicOutNext;z-index:1}.f-classicOut.to-prev{animation:var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicOutPrev;z-index:1}@keyframes f-classicInNext{0%{transform:translateX(-75px);opacity:0}100%{transform:translate3d(0, 0, 0);opacity:1}}@keyframes f-classicInPrev{0%{transform:translateX(75px);opacity:0}100%{transform:translate3d(0, 0, 0);opacity:1}}@keyframes f-classicOutNext{100%{transform:translateX(-75px);opacity:0}}@keyframes f-classicOutPrev{100%{transform:translateX(75px);opacity:0}}:root{--f-button-width: 40px;--f-button-height: 40px;--f-button-border: 0;--f-button-border-radius: 0;--f-button-color: #374151;--f-button-bg: #f8f8f8;--f-button-hover-bg: #e0e0e0;--f-button-active-bg: #d0d0d0;--f-button-shadow: none;--f-button-transition: all 0.15s ease;--f-button-transform: none;--f-button-svg-width: 20px;--f-button-svg-height: 20px;--f-button-svg-stroke-width: 1.5;--f-button-svg-fill: none;--f-button-svg-filter: none;--f-button-svg-disabled-opacity: 0.65}.f-button{display:flex;justify-content:center;align-items:center;box-sizing:content-box;position:relative;margin:0;padding:0;width:var(--f-button-width);height:var(--f-button-height);border:var(--f-button-border);border-radius:var(--f-button-border-radius);color:var(--f-button-color);background:var(--f-button-bg);box-shadow:var(--f-button-shadow);pointer-events:all;cursor:pointer;transition:var(--f-button-transition)}@media(hover: hover){.f-button:hover:not([disabled]){color:var(--f-button-hover-color);background-color:var(--f-button-hover-bg)}}.f-button:active:not([disabled]){background-color:var(--f-button-active-bg)}.f-button:focus:not(:focus-visible){outline:none}.f-button:focus-visible{outline:none;box-shadow:inset 0 0 0 var(--f-button-outline, 2px) var(--f-button-outline-color, var(--f-button-color))}.f-button svg{width:var(--f-button-svg-width);height:var(--f-button-svg-height);fill:var(--f-button-svg-fill);stroke:currentColor;stroke-width:var(--f-button-svg-stroke-width);stroke-linecap:round;stroke-linejoin:round;transition:opacity .15s ease;transform:var(--f-button-transform);filter:var(--f-button-svg-filter);pointer-events:none}.f-button[disabled]{cursor:default}.f-button[disabled] svg{opacity:var(--f-button-svg-disabled-opacity)}.f-carousel__nav .f-button.is-prev,.f-carousel__nav .f-button.is-next,.fancybox__nav .f-button.is-prev,.fancybox__nav .f-button.is-next{position:absolute;z-index:1}.is-horizontal .f-carousel__nav .f-button.is-prev,.is-horizontal .f-carousel__nav .f-button.is-next,.is-horizontal .fancybox__nav .f-button.is-prev,.is-horizontal .fancybox__nav .f-button.is-next{top:50%;transform:translateY(-50%)}.is-horizontal .f-carousel__nav .f-button.is-prev,.is-horizontal .fancybox__nav .f-button.is-prev{left:var(--f-button-prev-pos)}.is-horizontal .f-carousel__nav .f-button.is-next,.is-horizontal .fancybox__nav .f-button.is-next{right:var(--f-button-next-pos)}.is-horizontal.is-rtl .f-carousel__nav .f-button.is-prev,.is-horizontal.is-rtl .fancybox__nav .f-button.is-prev{left:auto;right:var(--f-button-next-pos)}.is-horizontal.is-rtl .f-carousel__nav .f-button.is-next,.is-horizontal.is-rtl .fancybox__nav .f-button.is-next{right:auto;left:var(--f-button-prev-pos)}.is-vertical .f-carousel__nav .f-button.is-prev,.is-vertical .f-carousel__nav .f-button.is-next,.is-vertical .fancybox__nav .f-button.is-prev,.is-vertical .fancybox__nav .f-button.is-next{top:auto;left:50%;transform:translateX(-50%)}.is-vertical .f-carousel__nav .f-button.is-prev,.is-vertical .fancybox__nav .f-button.is-prev{top:var(--f-button-next-pos)}.is-vertical .f-carousel__nav .f-button.is-next,.is-vertical .fancybox__nav .f-button.is-next{bottom:var(--f-button-next-pos)}.is-vertical .f-carousel__nav .f-button.is-prev svg,.is-vertical .f-carousel__nav .f-button.is-next svg,.is-vertical .fancybox__nav .f-button.is-prev svg,.is-vertical .fancybox__nav .f-button.is-next svg{transform:rotate(90deg)}.f-carousel__nav .f-button:disabled,.fancybox__nav .f-button:disabled{pointer-events:none}html.with-fancybox{width:auto;overflow:visible;scroll-behavior:auto}html.with-fancybox body{touch-action:none}html.with-fancybox body.hide-scrollbar{width:auto;margin-right:calc(var(--fancybox-body-margin, 0px) + var(--fancybox-scrollbar-compensate, 0px));overflow:hidden !important;overscroll-behavior-y:none}.fancybox__container{--fancybox-color: #dbdbdb;--fancybox-hover-color: #fff;--fancybox-bg: rgba(24, 24, 27, 0.98);--fancybox-slide-gap: 10px;--f-spinner-width: 50px;--f-spinner-height: 50px;--f-spinner-color-1: rgba(255, 255, 255, 0.1);--f-spinner-color-2: #bbb;--f-spinner-stroke: 3.65;position:fixed;top:0;left:0;bottom:0;right:0;direction:ltr;display:flex;flex-direction:column;box-sizing:border-box;margin:0;padding:0;color:#f8f8f8;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:visible;z-index:var(--fancybox-zIndex, 1050);outline:none;transform-origin:top left;-webkit-text-size-adjust:100%;-moz-text-size-adjust:none;-ms-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior-y:contain}.fancybox__container *,.fancybox__container *::before,.fancybox__container *::after{box-sizing:inherit}.fancybox__container::backdrop{background-color:rgba(0,0,0,0)}.fancybox__backdrop{position:fixed;top:0;left:0;bottom:0;right:0;z-index:-1;background:var(--fancybox-bg);opacity:var(--fancybox-opacity, 1);will-change:opacity}.fancybox__carousel{position:relative;box-sizing:border-box;flex:1;min-height:0;z-index:10;overflow-y:visible;overflow-x:clip}.fancybox__viewport{width:100%;height:100%}.fancybox__viewport.is-draggable{cursor:move;cursor:grab}.fancybox__viewport.is-dragging{cursor:move;cursor:grabbing}.fancybox__track{display:flex;margin:0 auto;height:100%}.fancybox__slide{flex:0 0 auto;position:relative;display:flex;flex-direction:column;align-items:center;width:100%;height:100%;margin:0 var(--fancybox-slide-gap) 0 0;padding:4px;overflow:auto;overscroll-behavior:contain;transform:translate3d(0, 0, 0);backface-visibility:hidden}.fancybox__container:not(.is-compact) .fancybox__slide.has-close-btn{padding-top:40px}.fancybox__slide.has-iframe,.fancybox__slide.has-video,.fancybox__slide.has-html5video{overflow:hidden}.fancybox__slide.has-image{overflow:hidden}.fancybox__slide.has-image.is-animating,.fancybox__slide.has-image.is-selected{overflow:visible}.fancybox__slide::before,.fancybox__slide::after{content:"";flex:0 0 0;margin:auto}.fancybox__backdrop:empty,.fancybox__viewport:empty,.fancybox__track:empty,.fancybox__slide:empty{display:block}.fancybox__content{align-self:center;display:flex;flex-direction:column;position:relative;margin:0;padding:2rem;max-width:100%;color:var(--fancybox-content-color, #374151);background:var(--fancybox-content-bg, #fff);cursor:default;border-radius:0;z-index:20}.is-loading .fancybox__content{opacity:0}.is-draggable .fancybox__content{cursor:move;cursor:grab}.can-zoom_in .fancybox__content{cursor:zoom-in}.can-zoom_out .fancybox__content{cursor:zoom-out}.is-dragging .fancybox__content{cursor:move;cursor:grabbing}.fancybox__content [data-selectable],.fancybox__content [contenteditable]{cursor:auto}.fancybox__slide.has-image>.fancybox__content{padding:0;background:rgba(0,0,0,0);min-height:1px;background-repeat:no-repeat;background-size:contain;background-position:center center;transition:none;transform:translate3d(0, 0, 0);backface-visibility:hidden}.fancybox__slide.has-image>.fancybox__content>picture>img{width:100%;height:auto;max-height:100%}.is-animating .fancybox__content,.is-dragging .fancybox__content{will-change:transform,width,height}.fancybox-image{margin:auto;display:block;width:100%;height:100%;min-height:0;object-fit:contain;user-select:none;filter:blur(0px)}.fancybox__caption{align-self:center;max-width:100%;flex-shrink:0;margin:0;padding:14px 0 4px 0;overflow-wrap:anywhere;line-height:1.375;color:var(--fancybox-color, currentColor);opacity:var(--fancybox-opacity, 1);cursor:auto;visibility:visible}.is-loading .fancybox__caption,.is-closing .fancybox__caption{opacity:0;visibility:hidden}.is-compact .fancybox__caption{padding-bottom:0}.f-button.is-close-btn{--f-button-svg-stroke-width: 2;position:absolute;top:0;right:8px;z-index:40}.fancybox__content>.f-button.is-close-btn{--f-button-width: 34px;--f-button-height: 34px;--f-button-border-radius: 4px;--f-button-color: var(--fancybox-color, #fff);--f-button-hover-color: var(--fancybox-color, #fff);--f-button-bg: transparent;--f-button-hover-bg: transparent;--f-button-active-bg: transparent;--f-button-svg-width: 22px;--f-button-svg-height: 22px;position:absolute;top:-38px;right:0;opacity:.75}.is-loading .fancybox__content>.f-button.is-close-btn{visibility:hidden}.is-zooming-out .fancybox__content>.f-button.is-close-btn{visibility:hidden}.fancybox__content>.f-button.is-close-btn:hover{opacity:1}.fancybox__footer{padding:0;margin:0;position:relative}.fancybox__footer .fancybox__caption{width:100%;padding:24px;opacity:var(--fancybox-opacity, 1);transition:all .25s ease}.is-compact .fancybox__footer{position:absolute;bottom:0;left:0;right:0;z-index:20;background:rgba(24,24,27,.5)}.is-compact .fancybox__footer .fancybox__caption{padding:12px}.is-compact .fancybox__content>.f-button.is-close-btn{--f-button-border-radius: 50%;--f-button-color: #fff;--f-button-hover-color: #fff;--f-button-outline-color: #000;--f-button-bg: rgba(0, 0, 0, 0.6);--f-button-active-bg: rgba(0, 0, 0, 0.6);--f-button-hover-bg: rgba(0, 0, 0, 0.6);--f-button-svg-width: 18px;--f-button-svg-height: 18px;--f-button-svg-filter: none;top:5px;right:5px}.fancybox__nav{--f-button-width: 50px;--f-button-height: 50px;--f-button-border: 0;--f-button-border-radius: 50%;--f-button-color: var(--fancybox-color);--f-button-hover-color: var(--fancybox-hover-color);--f-button-bg: transparent;--f-button-hover-bg: rgba(24, 24, 27, 0.3);--f-button-active-bg: rgba(24, 24, 27, 0.5);--f-button-shadow: none;--f-button-transition: all 0.15s ease;--f-button-transform: none;--f-button-svg-width: 26px;--f-button-svg-height: 26px;--f-button-svg-stroke-width: 2.5;--f-button-svg-fill: none;--f-button-svg-filter: drop-shadow(1px 1px 1px rgba(24, 24, 27, 0.5));--f-button-svg-disabled-opacity: 0.65;--f-button-next-pos: 1rem;--f-button-prev-pos: 1rem;opacity:var(--fancybox-opacity, 1)}.fancybox__nav .f-button:before{position:absolute;content:"";top:-30px;right:-20px;left:-20px;bottom:-30px;z-index:1}.is-idle .fancybox__nav{animation:.15s ease-out both f-fadeOut}.is-idle.is-compact .fancybox__footer{pointer-events:none;animation:.15s ease-out both f-fadeOut}.fancybox__slide>.f-spinner{position:absolute;top:50%;left:50%;margin:var(--f-spinner-top, calc(var(--f-spinner-width) * -0.5)) 0 0 var(--f-spinner-left, calc(var(--f-spinner-height) * -0.5));z-index:30;cursor:pointer}.fancybox-protected{position:absolute;top:0;left:0;right:0;bottom:0;z-index:40;user-select:none}.fancybox-ghost{position:absolute;top:0;left:0;width:100%;height:100%;min-height:0;object-fit:contain;z-index:40;user-select:none;pointer-events:none}.fancybox-focus-guard{outline:none;opacity:0;position:fixed;pointer-events:none}.fancybox__container:not([aria-hidden]){opacity:0}.fancybox__container.is-animated[aria-hidden=false]>*:not(.fancybox__backdrop,.fancybox__carousel),.fancybox__container.is-animated[aria-hidden=false] .fancybox__carousel>*:not(.fancybox__viewport),.fancybox__container.is-animated[aria-hidden=false] .fancybox__slide>*:not(.fancybox__content){animation:var(--f-interface-enter-duration, 0.25s) ease .1s backwards f-fadeIn}.fancybox__container.is-animated[aria-hidden=false] .fancybox__backdrop{animation:var(--f-backdrop-enter-duration, 0.35s) ease backwards f-fadeIn}.fancybox__container.is-animated[aria-hidden=true]>*:not(.fancybox__backdrop,.fancybox__carousel),.fancybox__container.is-animated[aria-hidden=true] .fancybox__carousel>*:not(.fancybox__viewport),.fancybox__container.is-animated[aria-hidden=true] .fancybox__slide>*:not(.fancybox__content){animation:var(--f-interface-exit-duration, 0.15s) ease forwards f-fadeOut}.fancybox__container.is-animated[aria-hidden=true] .fancybox__backdrop{animation:var(--f-backdrop-exit-duration, 0.35s) ease forwards f-fadeOut}.has-iframe .fancybox__content,.has-map .fancybox__content,.has-pdf .fancybox__content,.has-youtube .fancybox__content,.has-vimeo .fancybox__content,.has-html5video .fancybox__content{max-width:100%;flex-shrink:1;min-height:1px;overflow:visible}.has-iframe .fancybox__content,.has-map .fancybox__content,.has-pdf .fancybox__content{width:calc(100% - 120px);height:90%}.fancybox__container.is-compact .has-iframe .fancybox__content,.fancybox__container.is-compact .has-map .fancybox__content,.fancybox__container.is-compact .has-pdf .fancybox__content{width:100%;height:100%}.has-youtube .fancybox__content,.has-vimeo .fancybox__content,.has-html5video .fancybox__content{width:960px;height:540px;max-width:100%;max-height:100%}.has-map .fancybox__content,.has-pdf .fancybox__content,.has-youtube .fancybox__content,.has-vimeo .fancybox__content,.has-html5video .fancybox__content{padding:0;background:rgba(24,24,27,.9);color:#fff}.has-map .fancybox__content{background:#e5e3df}.fancybox__html5video,.fancybox__iframe{border:0;display:block;height:100%;width:100%;background:rgba(0,0,0,0)}.fancybox-placeholder{border:0 !important;clip:rect(1px, 1px, 1px, 1px) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;height:1px !important;margin:-1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important;white-space:nowrap !important}.f-carousel__thumbs{--f-thumb-width: 96px;--f-thumb-height: 72px;--f-thumb-outline: 0;--f-thumb-outline-color: #5eb0ef;--f-thumb-opacity: 1;--f-thumb-hover-opacity: 1;--f-thumb-selected-opacity: 1;--f-thumb-border-radius: 2px;--f-thumb-offset: 0px;--f-button-next-pos: 0;--f-button-prev-pos: 0}.f-carousel__thumbs.is-classic{--f-thumb-gap: 8px;--f-thumb-opacity: 0.5;--f-thumb-hover-opacity: 1;--f-thumb-selected-opacity: 1}.f-carousel__thumbs.is-modern{--f-thumb-gap: 4px;--f-thumb-extra-gap: 16px;--f-thumb-clip-width: 46px}.f-thumbs{position:relative;flex:0 0 auto;margin:0;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0);user-select:none;perspective:1000px;transform:translateZ(0)}.f-thumbs .f-spinner{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:2px;background-image:linear-gradient(#ebeff2, #e2e8f0);z-index:-1}.f-thumbs .f-spinner svg{display:none}.f-thumbs.is-vertical{height:100%}.f-thumbs__viewport{width:100%;height:auto;overflow:hidden;transform:translate3d(0, 0, 0)}.f-thumbs__track{display:flex}.f-thumbs__slide{position:relative;flex:0 0 auto;box-sizing:content-box;display:flex;align-items:center;justify-content:center;padding:0;margin:0;width:var(--f-thumb-width);height:var(--f-thumb-height);overflow:visible;cursor:pointer}.f-thumbs__slide.is-loading img{opacity:0}.is-classic .f-thumbs__viewport{height:100%}.is-modern .f-thumbs__track{width:max-content}.is-modern .f-thumbs__track::before{content:"";position:absolute;top:0;bottom:0;left:calc((var(--f-thumb-clip-width, 0))*-0.5);width:calc(var(--width, 0)*1px + var(--f-thumb-clip-width, 0));cursor:pointer}.is-modern .f-thumbs__slide{width:var(--f-thumb-clip-width);transform:translate3d(calc(var(--shift, 0) * -1px), 0, 0);transition:none;pointer-events:none}.is-modern.is-resting .f-thumbs__slide{transition:transform .33s ease}.is-modern.is-resting .f-thumbs__slide__button{transition:clip-path .33s ease}.is-using-tab .is-modern .f-thumbs__slide:focus-within{filter:drop-shadow(-1px 0px 0px var(--f-thumb-outline-color)) drop-shadow(2px 0px 0px var(--f-thumb-outline-color)) drop-shadow(0px -1px 0px var(--f-thumb-outline-color)) drop-shadow(0px 2px 0px var(--f-thumb-outline-color))}.f-thumbs__slide__button{appearance:none;width:var(--f-thumb-width);height:100%;margin:0 -100% 0 -100%;padding:0;border:0;position:relative;border-radius:var(--f-thumb-border-radius);overflow:hidden;background:rgba(0,0,0,0);outline:none;cursor:pointer;pointer-events:auto;touch-action:manipulation;opacity:var(--f-thumb-opacity);transition:opacity .2s ease}.f-thumbs__slide__button:hover{opacity:var(--f-thumb-hover-opacity)}.f-thumbs__slide__button:focus:not(:focus-visible){outline:none}.f-thumbs__slide__button:focus-visible{outline:none;opacity:var(--f-thumb-selected-opacity)}.is-modern .f-thumbs__slide__button{--clip-path: inset( 0 calc( ((var(--f-thumb-width, 0) - var(--f-thumb-clip-width, 0))) * (1 - var(--progress, 0)) * 0.5 ) round var(--f-thumb-border-radius, 0) );clip-path:var(--clip-path)}.is-classic .is-nav-selected .f-thumbs__slide__button{opacity:var(--f-thumb-selected-opacity)}.is-classic .is-nav-selected .f-thumbs__slide__button::after{content:"";position:absolute;top:0;left:0;right:0;height:auto;bottom:0;border:var(--f-thumb-outline, 0) solid var(--f-thumb-outline-color, transparent);border-radius:var(--f-thumb-border-radius);animation:f-fadeIn .2s ease-out;z-index:10}.f-thumbs__slide__img{overflow:hidden;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:var(--f-thumb-offset);box-sizing:border-box;pointer-events:none;object-fit:cover;border-radius:var(--f-thumb-border-radius)}.f-thumbs.is-horizontal .f-thumbs__track{padding:8px 0 12px 0}.f-thumbs.is-horizontal .f-thumbs__slide{margin:0 var(--f-thumb-gap) 0 0}.f-thumbs.is-vertical .f-thumbs__track{flex-wrap:wrap;padding:0 8px}.f-thumbs.is-vertical .f-thumbs__slide{margin:0 0 var(--f-thumb-gap) 0}.fancybox__thumbs{--f-thumb-width: 96px;--f-thumb-height: 72px;--f-thumb-border-radius: 2px;--f-thumb-outline: 2px;--f-thumb-outline-color: #ededed;position:relative;opacity:var(--fancybox-opacity, 1);transition:max-height .35s cubic-bezier(0.23, 1, 0.32, 1)}.fancybox__thumbs.is-classic{--f-thumb-gap: 8px;--f-thumb-opacity: 0.5;--f-thumb-hover-opacity: 1}.fancybox__thumbs.is-classic .f-spinner{background-image:linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05))}.fancybox__thumbs.is-modern{--f-thumb-gap: 4px;--f-thumb-extra-gap: 16px;--f-thumb-clip-width: 46px;--f-thumb-opacity: 1;--f-thumb-hover-opacity: 1}.fancybox__thumbs.is-modern .f-spinner{background-image:linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05))}.fancybox__thumbs.is-horizontal{padding:0 var(--f-thumb-gap)}.fancybox__thumbs.is-vertical{padding:var(--f-thumb-gap) 0}.is-compact .fancybox__thumbs{--f-thumb-width: 64px;--f-thumb-clip-width: 32px;--f-thumb-height: 48px;--f-thumb-extra-gap: 10px}.fancybox__thumbs.is-masked{max-height:0px !important}.is-closing .fancybox__thumbs{transition:none !important}.fancybox__toolbar{--f-progress-color: var(--fancybox-color, rgba(255, 255, 255, 0.94));--f-button-width: 46px;--f-button-height: 46px;--f-button-color: var(--fancybox-color);--f-button-hover-color: var(--fancybox-hover-color);--f-button-bg: rgba(24, 24, 27, 0.65);--f-button-hover-bg: rgba(70, 70, 73, 0.65);--f-button-active-bg: rgba(90, 90, 93, 0.65);--f-button-border-radius: 0;--f-button-svg-width: 24px;--f-button-svg-height: 24px;--f-button-svg-stroke-width: 1.5;--f-button-svg-filter: drop-shadow(1px 1px 1px rgba(24, 24, 27, 0.15));--f-button-svg-fill: none;--f-button-svg-disabled-opacity: 0.65;display:flex;flex-direction:row;justify-content:space-between;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI Adjusted","Segoe UI","Liberation Sans",sans-serif;color:var(--fancybox-color, currentColor);opacity:var(--fancybox-opacity, 1);text-shadow:var(--fancybox-toolbar-text-shadow, 1px 1px 1px rgba(0, 0, 0, 0.5));pointer-events:none;z-index:20}.fancybox__toolbar :focus-visible{z-index:1}.fancybox__toolbar.is-absolute,.is-compact .fancybox__toolbar{position:absolute;top:0;left:0;right:0}.is-idle .fancybox__toolbar{pointer-events:none;animation:.15s ease-out both f-fadeOut}.fancybox__toolbar__column{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start}.fancybox__toolbar__column.is-left,.fancybox__toolbar__column.is-right{flex-grow:1;flex-basis:0}.fancybox__toolbar__column.is-right{display:flex;justify-content:flex-end;flex-wrap:nowrap}.fancybox__infobar{padding:0 5px;line-height:var(--f-button-height);text-align:center;font-size:17px;font-variant-numeric:tabular-nums;-webkit-font-smoothing:subpixel-antialiased;cursor:default;user-select:none}.fancybox__infobar span{padding:0 5px}.fancybox__infobar:not(:first-child):not(:last-child){background:var(--f-button-bg)}[data-fancybox-toggle-slideshow]{position:relative}[data-fancybox-toggle-slideshow] .f-progress{height:100%;opacity:.3}[data-fancybox-toggle-slideshow] svg g:first-child{display:flex}[data-fancybox-toggle-slideshow] svg g:last-child{display:none}.has-slideshow [data-fancybox-toggle-slideshow] svg g:first-child{display:none}.has-slideshow [data-fancybox-toggle-slideshow] svg g:last-child{display:flex}[data-fancybox-toggle-fullscreen] svg g:first-child{display:flex}[data-fancybox-toggle-fullscreen] svg g:last-child{display:none}:fullscreen [data-fancybox-toggle-fullscreen] svg g:first-child{display:none}:fullscreen [data-fancybox-toggle-fullscreen] svg g:last-child{display:flex}.f-progress{position:absolute;top:0;left:0;right:0;height:3px;transform:scaleX(0);transform-origin:0;transition-property:transform;transition-timing-function:linear;background:var(--f-progress-color, var(--f-carousel-theme-color, #0091ff));z-index:30;user-select:none;pointer-events:none} /* End */ /* Start:/local/templates/main/css/vendor/contacts.css?17841810232356*/ .y-map{ width: 100%; height: 500px; max-width: 100%; display: grid; } .marker-container { display: flex; gap: 30px; position: relative; top: -24px; } .marker-tip-container { padding: 16px; padding-bottom: 40px; box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); min-height: 160px; position: absolute; left: -350px; background-color: var(--color-white); max-width: 330px; z-index: 101; border-radius: 10px; opacity: 1; transition: all var(--transition); } .marker-tip-container .tip_close { position: absolute; right: 0; top: 0; margin: 20px; cursor: pointer; } .marker-tip-container .marker-content { display: flex; flex-direction: column; gap: 8px; text-align: start; } .marker-tip-container .marker-content .marker-title { font-size: 16px; font-weight: 400; } .marker-tip-container .marker-content .marker-text-item { display: flex; flex-direction: column; gap: 3px; text-align: start; } .marker-tip-container .marker-content .marker-text-item .marker-text-item-title { font-size: 14px; font-weight: 400; } .marker-tip-container .marker-content .marker-text-item .marker-text-item-text { color: var(--color-gray); font-size: 14px; font-weight: 300; } .marker-tip-container .marker-content .marker-text-item .marker-text-item-text p { margin: 0; } .marker-tip-container._hide { opacity: 0; pointer-events: none; } .marker-tip-container._modal { max-width: max-content; border-bottom-left-radius: 0; border-bottom-right-radius: 0; bottom: 0; top: auto; left: 0; right: 0; width: 100%; max-width: 100%; } .ymap-circle { background-color: var(--color-white); border-radius: 100%; border: 10px solid #5b7fff; display: flex; align-items: center; justify-content: center; color: #000; text-align: center; font-size: 18px; font-weight: 600; line-height: 130%; width: 64px; height: 64px; position: relative; left: -32px; top: -64px; cursor: pointer; } .ymap-tip{ width: 24px; height: 24px; position: relative; left: -12px; cursor: pointer; } @media (max-width: 1199px) { .ymap-circle { width: 32px; height: 32px; left: -16px; top: -32px; font-size: 16px; border: 5px solid #5b7fff; } .y-map{ height: 400px; } } /* End */ /* Start:/local/templates/main/css/foundation/variables.css?17877361552431*/ :root { --color-black: #2D2D2D; --color-white: #FFF; --color-gray: #615F5F; --color-light: #F2F2F2; --color-border: #F6F6F6; --color-bg-white: #F9F9F9; --color-light-gray: #B1B1B1; --color-mid-grey-text: #8E8E93; --color-primary-dark-gray: #858585; --color-gray-2: #AAA; --color-gray-title: #636363; --color-red: #E31E25; --color-hover-red: #B92228; --color-bg-red: rgba(227, 30, 37, 0.2); --color-card-bg: #F6F7F9; --color-text: #333; --color-text-black: #1E1E1E; --color-dark-black: #0D0C22; --color-full-black: #000; --color-border-gray: #D9D9D9; --color-neutral-500: #94A3B8; --color-neutral-600: #475569; --color-neutral-800: #1E293B; --color-light-blue: #F2F6FB; --color-scrollbar: #F7F4F4; --color-yellow: #E7C890; --color-yellow-light: #ffe797; --color-green: #258715; --color-green-count: #169605; --color-bg-green-positive-secondary: #CFF7D3; --color-bg-green: rgba(5, 150, 105, 0.20); --color-bg-gray: rgba(97, 95, 95, 0.2); --color-bg-yellow: #FFF8DD; --color-yellow: #FF9900; --color-bg-blue: rgba(37, 99, 235, 0.20); --color-blue: #2D74CE; --color-blue-hover: #2563B8; --color-dark-blue: #1E40AF; --color-status-blue: #4F81ED; --color-green-positive-secondary: #02542D; --color--card-hover: rgba(211, 210, 210, 0.60); --color-default-hover: #F5F5F5; --color-grade-fill: #E7C890; --color-green-positive: #059669; --color-bg-slider: #E6E6E6; --color-schemes-outline-variant: #CAC4D0; --color-heading: #1E2B4A; --color-header-bg: #01243C; --color-header-text: #0A2540; --color-plate: #F1F5F9; --color-plate-hover: #DFE6EE; --color-footer-bg: #020202; --color-footer-text: #F2F5F9; --color-footer-border: #F2F2F2; --color-in-stock: #3AA225; --color-btn-primary: var(--color-blue); --color-btn-primary-hover: var(--color-blue-hover); --color-btn-outline: var(--color-blue); --color-btn-outline-hover-bg: var(--color-blue); --color-btn-outline-hover-color: var(--color-white); --color-checkbox-border: rgba(158, 180, 204, 0.25); --color-checkbox-checked: var(--color-blue); --sok-container-max-width: 1540px; --sok-container-padding: 20px; --font-family-base: "Montserrat", "Montserrat Fallback", Arial, sans-serif; --font-family-accent: "Manrope", "Montserrat Fallback", Arial, sans-serif; --font-12: 12px; --font-14: 14px; --font-16: 16px; --font-20: 20px; --transition: 0.3s; } /* End */ /* Start:/local/templates/main/css/foundation/typography.css?178478317911394*/ *, :after, :before { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-font-smoothing: antialiased !important; -webkit-tap-highlight-color: transparent; outline: 0 !important; } * { margin: 0; padding: 0; box-sizing: border-box; } body, html { margin: 0; padding: 0; } img { max-width: 100%; height: auto; } a { text-decoration: none; color: inherit; } a:focus, a:hover { text-decoration: none; color: var(--color-red); } a[href="/sales/"]:focus, a[href="/sales/"]:hover { color: var(--color-blue) !important; } li, ul { margin: 0; padding: 0; list-style: none; } body { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; color: var(--color-black); font-family: var(--font-family-base, "Geologica", sans-serif); font-size: 16px; } /* Sticky footer: при коротком контенте футер у низа viewport */ body > main._content { flex: 1 0 auto; } body > footer.sok_footer { flex-shrink: 0; margin-top: auto; } body.fixed { overflow: hidden; } .fields-col-2 { display: flex; justify-content: space-between; gap: 20px; } .fields-cols-2 { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 20px; } ._content h1 { font-size: 36px; font-weight: 500; } ._content h2 { font-size: 32px; font-weight: 500; margin-bottom: 20px; } ._content h3 { font-size: 20px; font-weight: 500; line-height: 21px; margin-bottom: 20px; } ._content h4 { font-size: 18px; font-weight: 500; margin-bottom: 20px; } ._content h5 { font-size: 16px; font-weight: 300; margin-bottom: 20px; } ._content p { font-size: 16px; font-weight: 200; line-height: 21px; margin-bottom: 20px; } ._content ul, ._content ol { padding-left: 30px; display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; } ._content ul ul, ._content ul ol, ._content ol ul, ._content ol ol { padding-left: 0; } ._content ul li, ._content ol li { list-style: auto; font-size: 16px; font-weight: 200; line-height: 21px; } ._content ol[type="1"] { margin-top: 10px; counter-reset: item; padding-left: 0; } ._content ol[type="1"] li { display: block; } ._content ol[type="1"] li:last-child ul { margin-bottom: 0; } ._content ol[type="1"] li ul { margin-top: 10px; } ._content ol[type="1"] li::before { content: counters(item, ".") ". "; counter-increment: item; } ._content ul[type="3"] { gap: 20px; list-style-type: none; padding-left: 0; } ._content ul[type="3"] li { display: grid; grid-template-columns: 24px auto; gap: 10px; } ._content ul[type="3"] li::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM11.0026 16L18.0737 8.92893L16.6595 7.51472L11.0026 13.1716L8.17421 10.3431L6.75999 11.7574L11.0026 16Z' fill='%23E31E25'/%3E%3C/svg%3E"); width: 24px; height: 24px; display: inline-block; } ._content ul[type="2"] li::marker { color: var(--color-red); } ._content ul[type="1"] { padding-left: 0; } ._content ul[type="1"] li { display: block; } ._content ul[type="1"] li::before { content: "— " !important; counter-increment: none; } ._content ul[type="0"] { padding-left: 0; } ._content ul[type="0"] li { display: block; } ._content ul[type="0"] li::before { content: "" !important; counter-increment: none; } ._content li[type="0"]::before { content: "" !important; counter-increment: none; } ._content ul { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; } ._content ul li { list-style: disc; } ._content ul li::marker { color: var(--color-gray); } .catalog-message-text { font-size: 15px; font-weight: 300; line-height: 18px; margin: 0 !important; } .catalog-message-text a { color: var(--color-black); font-weight: 400; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .order_cart_p { margin-bottom: 0px !important; margin-top: 20px !important; text-align: center !important; font-size: 12px !important; line-height: normal !important; } fieldset { min-width: 0; padding: 0; margin: 0; border: 0; display: flex; flex-direction: column; row-gap: 8px; font-size: 14px; font-weight: 400; width: 100%; margin-bottom: 20px; } fieldset label { color: var(--color-gray); font-weight: 200; font-size: 14px; } fieldset label a { color: var(--color-text-black) !important; font-weight: 400; line-height: 20px; text-decoration-line: underline; } fieldset .input-text, fieldset .input-textarea { font-size: 14px; } fieldset.textarea label { color: var(--color-gray); font-weight: 200; } fieldset.textarea textarea::placeholder { color: var(--color-primary-dark-gray); } .required-field label::before { content: "*"; color: var(--color-red); margin-right: 2px; } button { border: none; font-family: inherit; } .input-text { border-radius: 8px; border: 1px solid var(--color-border); background-color: var(--color-light); padding: 11px 10px; font-weight: 400; width: 100%; color: var(--color-gray); display: flex; gap: 8px; align-items: center; } .input-text:focus { color: var(--color-black); } .input-text input { border: none; display: flex; width: 100%; height: 100%; background: transparent; } .input-text input[type=password]::-ms-reveal, .input-text input[type=password]::-ms-clear { display: none; } .input-text[type=password]::-ms-reveal, .input-text[type=password]::-ms-clear { display: none; } .input-checkbox { display: none; } .checkboxLabel { display: inline-flex; align-items: center; flex-shrink: 0; user-select: none; } .checkboxIcon { display: flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 3px; border: 1px solid var(--color-checkbox-border); background-color: var(--color-white); cursor: pointer; flex-shrink: 0; box-sizing: border-box; } .checkboxIcon:hover { border-color: rgba(158, 180, 204, 0.5); } .input-checkbox:checked + .checkboxLabel .checkboxIcon { background-color: var(--color-checkbox-checked); border-color: var(--color-checkbox-checked); } .input-checkbox:checked + .checkboxLabel .checkboxIcon::before { content: ""; display: block; width: 16px; height: 16px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M6.667 10.114L12.795 3.986L13.738 4.928L6.667 11.999L2.424 7.757L3.367 6.814L6.667 10.114Z' fill='white'/%3E%3C/svg%3E") center / 16px 16px no-repeat; } .input-checkbox:checked + .checkboxLabel .checkboxIcon:hover { background-color: var(--color-blue-hover); border-color: var(--color-blue-hover); } .input-textarea { border-radius: 8px; border: 1px solid var(--color-border); background-color: var(--color-light); padding-top: 20px; padding-left: 20px; padding-right: 8px; padding-bottom: 8px; width: 100%; max-height: 200px; min-height: min-content; resize: vertical; color: var(--color-gray); display: flex; gap: 8px; } .input-textarea:focus { color: var(--color-black); } .input-textarea textarea { border: none; display: flex; width: 100%; height: 100%; background: transparent; max-height: 200px; min-height: min-content; resize: vertical; color: var(--color-gray); } .input-textarea textarea:focus { color: var(--color-black); } .input-textarea:focus { color: var(--color-black); } .input-textarea::-webkit-resizer { background-color: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='13' viewBox='0 0 16 13' fill='none'%3E%3Cpath d='M12.8481 12.9794L16.0005 10.6151V9.59814L11.4922 12.9794H12.8481Z' fill='%23858585'/%3E%3Cpath d='M7.09809 12.9801L15.9996 6.30403V5.28711L5.74219 12.9801H7.09809Z' fill='%23858585'/%3E%3Cpath d='M0 12.9797H1.3559L15.9996 1.9969V0.97998L0 12.9797Z' fill='%23858585'/%3E%3C/svg%3E"); background-repeat: no-repeat; width: 16px; height: 12px; position: absolute; top: 0; right: 0; padding: 8px; } .input-radio { display: none; } .input-radio:checked + .radioLabel .radioIcon { background-color: var(--color-red); border: none; } .radioLabel { display: inline-flex; align-items: center; user-select: none; } .radioIcon { width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--color-light-gray); display: flex; justify-content: center; align-items: center; position: relative; cursor: pointer; } .radioIcon:hover { border: 1px solid var(--color-black); } .input-radio:checked + .radioLabel .radioIcon::after { content: ""; /* добавляем псевдоэлемент */ content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8.00016 14.6666C4.31826 14.6666 1.3335 11.6818 1.3335 7.99992C1.3335 4.31802 4.31826 1.33325 8.00016 1.33325C11.682 1.33325 14.6668 4.31802 14.6668 7.99992C14.6668 11.6818 11.682 14.6666 8.00016 14.6666ZM8.00016 13.3333C10.9457 13.3333 13.3335 10.9455 13.3335 7.99992C13.3335 5.0544 10.9457 2.66659 8.00016 2.66659C5.05464 2.66659 2.66683 5.0544 2.66683 7.99992C2.66683 10.9455 5.05464 13.3333 8.00016 13.3333ZM8.00016 11.3333C6.15922 11.3333 4.66683 9.84085 4.66683 7.99992C4.66683 6.15897 6.15922 4.66659 8.00016 4.66659C9.8411 4.66659 11.3335 6.15897 11.3335 7.99992C11.3335 9.84085 9.8411 11.3333 8.00016 11.3333Z' fill='white'/%3E%3C/svg%3E"); position: absolute; width: 20px; height: 20px; padding: 2px; } .input-radio:checked + .radioLabel .radioIcon::after { display: block; /* показываем при выбранном радиокнопке */ } .input-wrapper { display: inline-flex; align-items: flex-start; gap: 7px; cursor: pointer; user-select: none; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; color: #010117; } .input-wrapper .checkboxLabel { flex-shrink: 0; margin-top: 1px; } .input-wrapper:hover .radioIcon { border: 1px solid var(--color-black); } .input-error { border: 1px solid var(--color-red) !important; } .text-error._hide { display: none; } .text-error._show { display: block; } .text-error { color: var(--color-red); font-size: 14px; font-weight: 200; line-height: 140%; margin: 0 !important; } @media (max-width: 1199px) { ._h1 { font-size: 32px; } ._h2 { font-size: 20px; } ._content h1 { font-size: 32px; } ._content h2 { font-size: 20px; } } @media (max-width: 1199px) { .page-top .page-top__inner ._h1 { margin-bottom: 20px; } ._content h1 { font-size: 24px; } ._content h3 { font-size: 18px; } ._content h5 { font-size: 12px; font-weight: 400; } .fields-col-2 { flex-direction: column; } .fields-cols-2 { grid-template-columns: repeat(1, 1fr); } } /* End */ /* Start:/local/templates/main/css/foundation/buttons.css?17878203476011*/ .sok_btn-primary { border-radius: 4px !important; background: var(--color-btn-primary) !important; font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1; color: var(--color-white) !important; border: none !important; cursor: pointer; padding: 8px 28px !important; display: inline-flex; align-items: center; justify-content: center; text-align: center; gap: 8px; height: 40px; transition: background-color var(--transition); } .sok_btn-primary:hover { background-color: var(--color-btn-primary-hover) !important; color: var(--color-white) !important; } .sok_btn-primary.disabled, .sok_btn-primary[blocked=true] { opacity: 0.6; } .sok_btn-primary._disable { background-color: var(--color-gray) !important; } .sok_btn-primary._disable:hover { background: var(--color-btn-primary) !important; } .sok_btn-primary._sm { padding: 6px 10px !important; height: 32px; } /* Loading / preloader — спиннер через ::after (как в UI Kit Беркут) */ .sok_btn-primary._loading, .sok_btn-outline._loading { position: relative; pointer-events: none; color: transparent !important; } .sok_btn-primary._loading > *, .sok_btn-outline._loading > * { visibility: hidden; } .sok_btn-primary._loading::after, .sok_btn-outline._loading::after { content: ""; position: absolute; left: 50%; top: 50%; width: 20px; height: 20px; margin: -10px 0 0 -10px; background: var(--color-white); -webkit-mask: url("/local/templates/main/css/foundation/../../img/icons/buttons/icon-spinner.svg") center / contain no-repeat; mask: url("/local/templates/main/css/foundation/../../img/icons/buttons/icon-spinner.svg") center / contain no-repeat; animation: sok_btn-spin 0.8s linear infinite; } .sok_btn-outline._loading::after { background: var(--sok-btn-outline-color, var(--color-btn-outline, var(--color-btn-primary))); } @keyframes sok_btn-spin { to { transform: rotate(360deg); } } .sok_btn-outline { --sok-btn-outline-color: var(--color-btn-outline, var(--color-btn-primary)); --sok-btn-outline-border: var(--color-btn-outline, var(--color-btn-primary)); --sok-btn-outline-bg: transparent; --sok-btn-outline-bg-hover: var(--color-btn-outline-hover-bg, var(--color-btn-primary)); --sok-btn-outline-color-hover: var(--color-btn-outline-hover-color, var(--color-white)); --sok-btn-outline-border-hover: var(--color-btn-outline, var(--color-btn-primary)); display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 8px 28px; border-radius: 4px; border: 1px solid var(--sok-btn-outline-border); background: var(--sok-btn-outline-bg); color: var(--sok-btn-outline-color); font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1; text-align: center; text-decoration: none; cursor: pointer; box-sizing: border-box; transition: background-color var(--transition), color var(--transition), border-color var(--transition); } .sok_btn-outline:hover, .sok_btn-outline:focus-visible { background: var(--sok-btn-outline-bg-hover); color: var(--sok-btn-outline-color-hover); border-color: var(--sok-btn-outline-border-hover); text-decoration: none; } .sok_btn-outline_on-dark { --sok-btn-outline-color: var(--color-white); --sok-btn-outline-border: var(--color-white); --sok-btn-outline-bg: transparent; --sok-btn-outline-bg-hover: rgba(255, 255, 255, 0.1); --sok-btn-outline-color-hover: var(--color-white); --sok-btn-outline-border-hover: var(--color-white); } .sok_btn-primary-invert { border-radius: 8px; border: 1px solid var(--color-red); background: var(--color-white); color: var(--color-red); font-size: 14px; cursor: pointer; padding: 0px 24px; display: flex; align-items: center; justify-content: center; text-align: center; gap: 8px; height: 40px; font-weight: 400; transition: all var(--transition); } .sok_btn-primary-invert:hover { background: var(--color-red); color: var(--color-white); } .sok_btn-invert { border-radius: 10px; border: 1px solid var(--color-gray); background: var(--color-white); font-size: 14px; font-style: normal; color: var(--color-gray); cursor: pointer; padding: 0px 24px; font-weight: 400; height: 40px; transition: all var(--transition); } .sok_btn-invert:hover { background: var(--color-red); color: var(--color-white); border: 1px solid var(--color-red); } .sok_btn-opacity { border-radius: 10px; background: var(--color-white); font-size: 14px; color: var(--color-gray) !important; cursor: pointer; padding: 0px 24px; display: flex; align-items: center; justify-content: center; text-align: center; gap: 8px; height: 40px; font-weight: 400; transition: all var(--transition); } .sok_btn-opacity:hover { background: var(--color--card-hover); /* Shadow-100 */ box-shadow: 0px 1px 2px 0px rgba(30, 41, 59, 0.12); } .sok_btn-light-hover { border-radius: 10px; background: var(--color-white); font-size: 14px; color: var(--color-black) !important; cursor: pointer; padding: 0px 24px; border: 1px solid var(--color-light); display: flex; align-items: center; justify-content: center; text-align: center; gap: 8px; height: 40px; font-weight: 400; transition: all var(--transition); } .sok_btn-light-hover:hover { background: linear-gradient(0deg, rgba(229, 229, 229, 0.6) 0%, rgba(229, 229, 229, 0.6) 100%), var(--color-light); } .sok_btn-light { border-radius: 10px; font-size: 14px; color: var(--color-black) !important; cursor: pointer; display: flex; align-items: center; justify-content: center; text-align: center; gap: 8px; height: 40px; padding: 0px 24px; background: var(--color-light); font-weight: 400; transition: all var(--transition); } .sok_btn-light:hover { background: var(--color--card-hover); } @media (max-width: 1199px) { .sok_btn-primary { width: 100%; } .sok_btn-primary-invert { width: 100%; } } /* End */ /* Start:/local/templates/main/css/foundation/utilities.css?17841810141162*/ /* Утилиты раскладки */ .w-max { width: max-content; } .w-100 { width: 100%; } .mt-0 { margin-top: 0px; } .mt-4 { margin-top: 4px; } .mt-5 { margin-top: 5px; } .mt-6 { margin-top: 6px; } .mt-8 { margin-top: 8px; } .mt-10 { margin-top: 10px; } .mt-12 { margin-top: 12px; } .mt-14 { margin-top: 14px; } .mt-16 { margin-top: 16px; } .mt-20 { margin-top: 20px; } .mt-24 { margin-top: 24px; } .mt-30 { margin-top: 30px; } .mt-40 { margin-top: 40px; } .mt-60 { margin-top: 60px; } .mb-0 { margin-bottom: 0px; } .mb-4 { margin-bottom: 4px; } .mb-5 { margin-bottom: 5px; } .mb-6 { margin-bottom: 6px; } .mb-8 { margin-bottom: 8px; } .mb-10 { margin-bottom: 10px; } .mb-12 { margin-bottom: 12px; } .mb-14 { margin-bottom: 14px; } .mb-16 { margin-bottom: 16px; } .mb-20 { margin-bottom: 20px; } .mb-24 { margin-bottom: 24px; } .mb-30 { margin-bottom: 30px; } .mb-40 { margin-bottom: 40px; } .mb-60 { margin-bottom: 60px; } .overflow-visible { overflow: visible; } ._thin { font-weight: 100 !important; } ._thin::placeholder { font-weight: 100 !important; } /* End */ /* Start:/local/templates/main/css/layout/sections.css?17841826003720*/ section.page_section { padding-top: 40px; padding-bottom: 40px; margin-bottom: 0; } section.big-section { padding-top: 60px; padding-bottom: 60px; } section.medium-section { padding-top: 40px; padding-bottom: 40px; } section.subscribe-section { padding-top: 40px; padding-bottom: 40px; } section.main { padding-top: 30px; padding-bottom: 30px; } section.sok_row { display: flex; flex-direction: column; row-gap: 35px; } /* Универсальная шапка секций (base home.css) */ section .section-top { display: flex; justify-content: space-between; align-items: center; } section .section-top ._mobile { display: none; } section .section-top .button_switches { display: flex; align-items: center; gap: 20px; } section .section-top .button_switches .btn-switch._active { background-color: var(--color-light); } section .section-top .button_switches .btn-switch { padding: 12px 24px; border-radius: 10px; cursor: pointer; font-size: 24px; font-weight: 400; } section .section-top .top-btn { border: 0; background: transparent; cursor: pointer; height: auto; } section .section-top .top-btn a { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 20px; gap: 4px; border-radius: 4px; background: var(--color-plate); border: 1px solid var(--color-plate); color: var(--color-heading); font-weight: 600; font-size: 14px; line-height: 1; text-decoration: none; } section .section-top .top-btn a span { line-height: 1; } section .section-top .top-btn a img, section .section-top .top-btn a svg { display: block; flex-shrink: 0; } section .section-top .top-btn a img { width: 16px; height: 16px; } section .section-top .top-btn a:hover { background: transparent; border-color: transparent; } /* Универсальная типографика заголовка секции (макет) */ section .section-top ._h2 { margin: 0; color: var(--color-heading); font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -0.03em; } section.sok_row-sm { display: flex; flex-direction: column; row-gap: 20px; } .bg-white { background-color: var(--color-bg-white); } .bg-light { background-color: var(--color-light); } .bg-light-white { background-color: var(--color-white); } .svg-icons { display: none; } /* tablet ≤1199 (legacy 992) */ @media (max-width: 1199px) { section.big-section { padding-top: 40px; padding-bottom: 40px; } section.subscribe-section { padding-top: 30px; padding-bottom: 30px; } section.sok_row { row-gap: 20px; } section .section-top .button_switches .btn-switch { font-size: 16px; } section .section-top ._h2 { font-size: 20px; } } /* mobile ≤767 (legacy 768 + 360) */ @media (max-width: 767px) { section.page_section { padding-top: 20px; padding-bottom: 20px; } section.big-section, section.medium-section, section.subscribe-section { padding-top: 20px; padding-bottom: 20px; } .top-btn._desktop-hide { display: none; } section .section-top .button_switches { gap: 10px; } section .section-top .button_switches .btn-switch { font-size: 14px; } section .section-top ._mobile { display: flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 300; color: var(--color-light-gray); text-decoration: none; } section .section-top ._mobile svg { fill: var(--color-light-gray); } section .section-top ._mobile:hover { color: var(--color-red); } section .section-top ._mobile:hover svg { fill: var(--color-red); } } /* End */ /* Start:/local/templates/main/css/layout/grid.css?17841826001402*/ .sok__container { box-sizing: border-box; width: 100%; max-width: var(--sok-container-max-width); padding-right: var(--sok-container-padding); padding-left: var(--sok-container-padding); margin-right: auto; margin-left: auto; } .page-container { font-weight: 200; } .page-container .page__sidebar { display: none; } .content__grid { display: grid; grid-template-columns: 360px auto; gap: 40px; } .content__grid .page__sidebar { display: block; } .wide__content { max-width: 100%; padding: 0; } .narrow__content { max-width: 1120px; margin: 0 auto; } .content__grid .sok__container { max-width: 1140px; } .content__grid .container-swiper { max-width: 1120px; width: calc(100vw - 450px); } .content__grid.narrow__content .container-swiper { max-width: 720px; } /* laptop ≤1440 (legacy 1600) */ @media (max-width: 1440px) { .container-swiper { padding-right: 0 !important; } } /* tablet ≤1199 (legacy 992 + container padding с 768) */ @media (max-width: 1199px) { .content__grid { grid-template-columns: auto; } .content__grid .page__sidebar { display: none; } .content__grid .container-swiper { width: calc(100vw - 45px); } .content__grid.narrow__content .container-swiper { max-width: max-content; width: calc(100vw - 45px); } .sok__container { padding-right: 10px; padding-left: 10px; } } /* End */ /* Start:/local/templates/main/css/layout/container.css?17878022119325*/ .page-top .page-top__inner ._h1 { margin-bottom: 40px; } ._h2 { margin: 0 !important; } ._h3 { margin: 0 !important; } ._h5 { margin: 0 !important; } ._p { margin: 0 !important; } .fw-200 { font-weight: 200; } .fw-300 { font-weight: 300; } .fw-400 { font-weight: 400; } .fw-500 { font-weight: 500; } .fw-600 { font-weight: 600; } .fs-14 { font-size: 14px !important; } .form_container { display: flex; flex-direction: column; margin-bottom: -20px; } .form_container fieldset .input-text { color: var(--color-gray); } .form_container fieldset .input-text:focus { color: var(--color-black); } .form_container fieldset .input-text input { color: var(--color-gray); } .form_container fieldset .input-text input:focus { color: var(--color-black); } .form_container .form_link { color: var(--color-gray); font-size: 16px; font-weight: 300; line-height: 140%; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .form_container .button_group { display: flex; justify-content: space-between; margin-bottom: 20px; } .form_container .button_group button._end { margin-left: auto; } .form_container .validate_form { display: flex; flex-direction: column; gap: 5px; } .form_container .form_nav { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; } .validate_text { margin-bottom: 20px; } .tel_confirm { display: flex; justify-content: space-between; flex-wrap: wrap; } .tel_confirm .text-error._hide { display: none !important; } .tel_confirm .btn_tel_code { display: none; box-shadow: 0px 1px 2px 0px rgba(30, 41, 59, 0.12); padding: 10px 24px; font-weight: 300; } .tel_confirm .btn_tel_code._active { display: block; } .tel_confirm .tel_get_code { display: flex; justify-content: space-between; gap: 20px; width: 100%; } .tel_confirm .tel_get_code input[readonly] { background-color: var(--color-white); border: 1px solid var(--color-light); } .tel_confirm .btn_tel_code_new { display: none; box-shadow: 0px 1px 2px 0px rgba(30, 41, 59, 0.12); padding: 10px 24px; font-weight: 300; } .tel_confirm .btn_tel_code_new._active { display: block; } .tel_confirm button { white-space: nowrap; } .tel_confirm ._tel._basis { flex-basis: 258px; } .tel_confirm ._сode { display: none; flex-basis: 142px; } .tel_confirm ._сode._active { display: flex; } .tel_confirm .tel_confirmed { display: none; align-items: center; color: var(--color-green-positive); font-weight: 300; line-height: 20px; gap: 8px; padding: 10px 0; } .tel_confirm .tel_confirmed._active { display: flex; } .tel_confirm .new_code_container._hide { display: none !important; } .tel_confirm .new_code_container { display: flex; align-items: center; margin-bottom: 20px; color: var(--color-gray); font-weight: 200; } .main-profile-block-shown .tel_confirm ._tel._basis { flex-basis: 100%; } .text-personal-privacy { font-size: 14px; color: var(--color-gray); font-weight: 200; } .wrapper { border-radius: 20px; background: var(--color-white); box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); padding: 20px; } .dropzone-wrapper { padding: 20px; position: relative; border-radius: 8px; border: 1px dashed var(--color-light-gray); background: var(--color-light); } .dropzone-wrapper .dropzone-content { align-items: flex-start; display: grid; grid-template-columns: 40px auto; gap: 40px; min-width: 160px; /* Добавьте минимальную ширину */ min-height: 40px; /* Добавьте минимальную высоту */ } .dropzone-wrapper .dropzone-content .dropzone-text-container .dropzone-text-title { font-size: 14px; font-weight: 400; } .dropzone-wrapper .dropzone-content .dropzone-text-container .dropzone-text { color: var(--color-primary-dark-gray, #858585); font-size: 14px; font-weight: 200; } .dropzone-wrapper input { position: absolute; outline: none !important; cursor: pointer; opacity: 0; top: 0; bottom: 0; left: 0; right: 0; } .password_field { display: flex; position: relative; justify-content: space-between; align-items: center; padding: 0 20px; padding-right: 0; } .password_field ._password { padding: 10px 0px; border: none; display: flex; width: 100%; background: transparent; } .password_field .password_icon { cursor: pointer; display: flex; align-items: center; padding: 10px 0; padding-right: 20px; user-select: none; } .password_field._sm { padding: 0 10px; } .password_field._sm .password_icon { padding-right: 0px; } .loading-state-before::before { content: ""; display: block; background-color: rgba(255, 255, 255, 0.5); background-position-x: center; background-position-y: 170px; background-size: initial; background-repeat: no-repeat; background-attachment: initial; background-origin: initial; background-clip: initial; position: absolute; z-index: 2; top: 0; left: 0; right: 0; bottom: 0; backdrop-filter: blur(2px); user-select: none; } .loading-state-before::after { content: ""; display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='82' height='82' viewBox='0 0 82 82' fill='none'%3E%3Cpath d='M41.0006 6.8335C42.8877 6.8335 44.4173 8.36321 44.4173 10.2502V20.5002C44.4173 22.3871 42.8877 23.9168 41.0006 23.9168C39.1136 23.9168 37.584 22.3871 37.584 20.5002V10.2502C37.584 8.36321 39.1136 6.8335 41.0006 6.8335ZM41.0006 58.0835C42.8877 58.0835 44.4173 59.6131 44.4173 61.5002V71.7502C44.4173 73.6372 42.8877 75.1668 41.0006 75.1668C39.1136 75.1668 37.584 73.6372 37.584 71.7502V61.5002C37.584 59.6131 39.1136 58.0835 41.0006 58.0835ZM75.1673 41.0002C75.1673 42.8872 73.6377 44.4168 71.7506 44.4168H61.5006C59.6136 44.4168 58.084 42.8872 58.084 41.0002C58.084 39.1131 59.6136 37.5835 61.5006 37.5835H71.7506C73.6377 37.5835 75.1673 39.1131 75.1673 41.0002ZM23.9173 41.0002C23.9173 42.8872 22.3876 44.4168 20.5007 44.4168H10.2507C8.36369 44.4168 6.83398 42.8872 6.83398 41.0002C6.83398 39.1131 8.36369 37.5835 10.2507 37.5835H20.5007C22.3876 37.5835 23.9173 39.1131 23.9173 41.0002ZM65.1602 65.1598C63.8257 66.494 61.6626 66.494 60.3284 65.1598L53.0803 57.9116C51.7461 56.5774 51.7461 54.4143 53.0803 53.0798C54.4148 51.7456 56.5779 51.7456 57.9121 53.0798L65.1602 60.3279C66.4944 61.6621 66.4944 63.8252 65.1602 65.1598ZM28.9209 28.9204C27.5866 30.2547 25.4233 30.2547 24.089 28.9204L16.8412 21.6726C15.5069 20.3383 15.5069 18.175 16.8412 16.8407C18.1755 15.5064 20.3388 15.5064 21.6731 16.8407L28.9209 24.0885C30.2552 25.4228 30.2552 27.5861 28.9209 28.9204ZM16.8412 65.1598C15.5069 63.8252 15.5069 61.6621 16.8412 60.3279L24.089 53.0798C25.4233 51.7456 27.5866 51.7456 28.9209 53.0798C30.2552 54.4143 30.2552 56.5774 28.9209 57.9116L21.6731 65.1598C20.3388 66.494 18.1755 66.494 16.8412 65.1598ZM53.0803 28.9204C51.7461 27.5861 51.7461 25.4228 53.0803 24.0885L60.3284 16.8407C61.6626 15.5064 63.8257 15.5064 65.1602 16.8407C66.4944 18.175 66.4944 20.3383 65.1602 21.6726L57.9121 28.9204C56.5779 30.2547 54.4148 30.2547 53.0803 28.9204Z' fill='%23B1B1B1'/%3E%3C/svg%3E"); background-position-x: center; background-size: initial; background-repeat: no-repeat; background-attachment: initial; background-origin: initial; background-clip: initial; position: absolute; z-index: 2; top: 170px; left: 0; right: 0; bottom: 0; max-height: 80px; animation: 1.2s linear 0s normal none infinite running rot; -webkit-animation: 1.2s linear 0s normal none infinite running rot; user-select: none; } /* Figma 889:32211 — прелоадер каталога (оверлей + loading-01) */ .sok_preloader { position: absolute; z-index: 50; inset: 0; display: flex; align-items: center; justify-content: center; box-sizing: border-box; margin: 0; padding: 0; border: 0; background: rgba(255, 255, 255, 0.6); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); pointer-events: all; user-select: none; } .sok_preloader__spinner { display: block; width: 100px; height: 100px; flex: 0 0 100px; background: transparent url("/local/templates/main/css/layout/../../img/ui/loading-01.svg") center / contain no-repeat; animation: sok-preloader-rot 1.2s linear infinite; } @keyframes sok-preloader-rot { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* Скрыть жёлтый wait Bitrix, если всплывёт (не трогаем наш .sok_preloader) */ .bx-core-waitwindow:not(.sok_preloader) { display: none !important; } @keyframes rot { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @media (max-width: 1199px) { .tel_confirm { display: grid; justify-content: normal; gap: 10px; } .tel_confirm .tel_get_code { flex-direction: column; gap: 10px; } .tel_confirm .tel_get_code .btn_tel_code { width: 100%; } .tel_confirm .tel_get_code .new_code_container .btn_tel_code_new { width: 100%; } .form_container .button_group { flex-direction: column; } } /* End */ /* Start:/local/templates/main/css/components/template.css?178418102320512*/ /*Стили шапки (header) */ header { display: flex; flex-direction: column; padding: 12px 0; color: var(--color-black); gap: 6px; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); transition: all var(--transition); position: relative; background-color: #fff; border-bottom: 1px solid var(--color-light); } header .header-top .sok__container, header .fixed-wrapper .sok__container { display: flex; align-items: center; gap: 40px; transition: all var(--transition); } header .header-top .sok__container { justify-content: space-between; font-size: 14px; font-weight: 300; line-height: 20px; color: var(--color-black); white-space: nowrap; min-height: 36px; margin-bottom: 16px; } header .header-top .header-dropdowns { display: flex; gap: 40px; transition: all var(--transition); } header .header-top .header-dropdowns svg { margin: 0 3px; } header .header-top .header-dropdowns .dropdown .dropdown_show { cursor: pointer; } header .header-top .header-dropdowns .dropdown .dropdown_show a { display: grid; height: 100%; align-content: center; } header .header-top .header-phone { font-size: 16px; font-weight: 500; white-space: nowrap; align-self: center; } header .fixed-wrapper._fixed { position: fixed; top: 0; right: 0; left: 0; background: var(--color-white); z-index: 100; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); padding-bottom: 12px; padding-top: 12px; } header .sticky .header-logo { display: flex; align-items: center; gap: 20px; color: var(--color-mid-grey-text); font-size: var(--font-14); white-space: nowrap; font-size: 14px; font-weight: 200; line-height: 16px; } header .sticky .header-logo img { max-width: 160px; height: auto; } header .sticky .header-catalog-search { display: flex; gap: 10px; width: 100%; justify-content: space-between; } header .sticky .header-catalog-search .catalog-btn { display: flex; border-radius: 999px; justify-content: center; align-items: center; gap: 12px; align-self: stretch; cursor: pointer; padding: 10px 20px; position: relative; background-color: var(--color-gray); transition: all var(--transition); border-radius: 10px; cursor: pointer; } header .sticky .header-catalog-search .catalog-btn span { font-size: 14px; color: var(--color-white); font-weight: 300; } header .sticky .header-catalog-search .catalog-btn .catalog-btn_content { display: none; position: absolute; top: 100%; margin-top: 10px; left: -390px; } header .sticky .header-catalog-search .catalog-btn:hover { background-color: var(--color-red); } header .sticky .header-catalog-search .catalog-btn._active { background-color: var(--color-red); } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content { border-radius: 20px; background: var(--color-white); box-shadow: 0px 2px 2px -1px rgba(30, 41, 59, 0.04), 0px 16px 24px -4px rgba(30, 41, 59, 0.16); padding: 20px; display: flex; z-index: 10; background-image: url(/local/templates/main/css/components/../../img/catalog-bg.png); background-repeat: no-repeat; background-size: 100%; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-item { border-radius: 10px; display: flex; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-item span { max-width: 280px; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-item._active { background-color: var(--color-light); } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content .catalog_menu { display: flex; flex-direction: column; row-gap: 5px; width: 394px; border-right: 1px solid var(--color-border-gray); padding-right: 30px; overflow-y: auto; max-height: calc(100vh - 160px); scrollbar-width: none; cursor: auto; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content .catalog_menu ._menu-item a { display: flex; justify-content: space-between; cursor: pointer; padding: 12px 16px; width: 394px; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content .catalog_menu ._menu-item span { color: var(--color-text-black); font-weight: 500; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content .catalog_menu ._menu-item ._menu-submenu-1 { display: flex; flex-direction: column; row-gap: 5px; width: 394px; display: none; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content .catalog_menu ._menu-item ._menu-submenu-1 ._menu-item { display: flex; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content .catalog_menu ._menu-item ._menu-submenu-1 ._menu-item a { display: flex; justify-content: space-between; cursor: pointer; padding: 12px 16px; width: 394px; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-1 { display: flex; flex-direction: column; row-gap: 5px; width: 394px; border-right: 1px solid var(--color-border-gray); padding: 0 30px; overflow-y: auto; max-height: calc(100vh - 160px); cursor: auto; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-1 ._menu-item { display: flex; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-1 ._menu-item a { display: flex; justify-content: space-between; cursor: pointer; padding: 12px 16px; width: 394px; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-1 ._menu-item a span { color: var(--color-text-black) !important; font-weight: 300; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-1 ._menu-item ._menu-submenu-2 { display: none; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-2 { display: flex; flex-direction: column; row-gap: 5px; width: 394px; padding-left: 30px; overflow-y: auto; max-height: calc(100vh - 160px); cursor: auto; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-2 ._menu-item { display: flex; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-2 ._menu-item a { display: flex; justify-content: space-between; cursor: pointer; padding: 12px 16px; width: 394px; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-2 ._menu-item a span { color: var(--color-text-black) !important; font-weight: 300; } header .sticky .header-catalog-search .catalog-btn._active .catalog-btn_content ._menu-submenu-2 ._menu-item ._menu-submenu-2 { display: none; } header .sticky .header-catalog-search .header-search { display: flex; justify-content: center; background: var(--color-light); width: 100%; transition: all 0.6s; position: relative; border-radius: 20px; height: 40px; } header .sticky .header-catalog-search .header-search .adaptive-back-btn { display: none; } header .sticky .header-catalog-search .header-search input { background: inherit; color: inherit; border: none; width: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; border-radius: 10px; padding: 0px 20px; transition: all var(--transition); } header .sticky .header-catalog-search .header-search input:focus { border: 1px solid var(--color-gray); background: var(--color-white); } header .sticky .header-catalog-search .header-search input::placeholder { color: var(--color-neutral-500); font-size: 14px; line-height: 16px; font-weight: 300; } header .sticky .header-catalog-search .header-search .search-btn { background: inherit; color: inherit; border: none; border-radius: 999px; cursor: pointer; position: absolute; right: 4px; top: 7px; bottom: 0; padding: 0 10px; height: 24px; transition: all var(--transition); } header .sticky .header-catalog-search .header-search input:focus + .search-btn { background: var(--color-white); } header .sticky .header-catalog-search .header-search .header-search_result { border-radius: 10px; background: var(--color-white); box-shadow: 0 2px 2px -1px rgba(30, 41, 59, 0.04), 0 16px 24px -4px rgba(30, 41, 59, 0.16); position: absolute; top: 100%; padding: 20px; overflow: hidden; color: var(--color-gray); text-overflow: ellipsis; font-size: 14px; font-weight: 300; line-height: 20px; display: flex; flex-direction: column; gap: 12px; z-index: 10; display: none; max-width: 685px; width: 100%; } header .sticky .header-menu { display: flex; gap: 30px; align-content: center; align-items: center; transition: all var(--transition); height: 40px; } header .sticky .header-menu .menu__item._mobile { display: none; } header .sticky .header-menu .menu__item._mobile svg { display: none; } header .sticky .header-menu .dropdown_show { height: 40px; } header .sticky .header-menu .menu__item_container.personal { height: 100%; display: flex; } header .sticky .header-menu .menu__item_container.personal .dropdown_content { right: 0; top: 40px; width: 240px; } header .sticky .header-menu .menu__item_container.personal .dropdown_content li svg { fill: var(--color-gray); } header .sticky .header-menu .menu__item_container.personal .dropdown_content li:hover svg { fill: var(--color-red); } header .sticky .header-menu .menu__item { display: flex; border-radius: 999px; justify-content: center; align-items: center; gap: 12px; align-self: stretch; cursor: pointer; position: relative; height: 100%; } header .sticky .header-menu .menu__item svg path { transition: all var(--transition); } header .sticky .header-menu .menu__item:hover._stroke svg path { stroke: var(--color-red); } header .sticky .header-menu .menu__item:hover._fill svg path { fill: var(--color-red); } header .sticky .header-menu .menu__item svg { transition: all var(--transition); } header .sticky .header-menu .menu__item .menu__item_count { position: absolute; border-radius: 20px; background: var(--color-green-count); width: 16px; height: 16px; display: flex; flex-direction: column; color: var(--color-white); font-size: 10px; font-weight: 400; align-items: center; justify-content: center; top: 6px; right: -4px; user-select: none; } header .sticky .header-menu .menu__item .item_btn { display: flex; border-radius: 999px; justify-content: center; align-items: center; gap: 12px; align-self: stretch; cursor: pointer; padding: 10px 20px; background-color: var(--color-light); border-radius: 10px; transition: all var(--transition); font-weight: 300; font-size: 14px; line-height: 20px; } header .sticky .header-menu .menu__item .item_btn:hover { background-color: var(--color-light-gray); } header .sticky .header-menu .menu__item.personal svg { fill: initial; stroke: initial; } header .header-bottom .bottom_menu { font-size: 14px; font-weight: 300; padding: 12px 0; display: flex; column-gap: 40px; row-gap: 20px; transition: all var(--transition); flex-wrap: wrap; } @media (max-width: 1440px) { header .header-top .sok__container, header .fixed-wrapper .sok__container { gap: 20px; } header .header-dropdowns { gap: 20px; } header .header-bottom .bottom_menu { column-gap: 30px; } } @media (max-width: 1280px) { header .sticky .header-catalog-search .catalog-btn .catalog-btn_content { left: -384px; max-width: 992px; } header .sticky .header-catalog-search .catalog-btn .catalog-btn_content ._menu-item span { max-width: 200px !important; } } @media (max-width: 1200px) { header .sticky .header-logo span { display: none; } header .sticky .header-catalog-search .catalog-btn .catalog-btn_content { left: -167px; max-width: 952px; } header .sticky .header-catalog-search .catalog-btn .catalog-btn_content .catalog_menu { padding-right: 20px; } header .sticky .header-catalog-search .catalog-btn .catalog-btn_content ._menu-submenu-1 { padding: 0 20px; } header .sticky .header-catalog-search .catalog-btn .catalog-btn_content ._menu-submenu-2 { padding-left: 20px; } header .sticky .header-menu .menu__item svg { width: 24px; height: 24px; } } @media (max-width: 1199px) { header { height: 60px; } header .header-top { display: none; } header .sticky .header-logo { font-size: var(--font-12); } header .sticky .header-logo span { display: block; } header .sticky .header-logo svg { width: 146px; height: 40px; } header .sticky .header-logo-link._hide { display: none; } header .sticky .header-menu .menu__item .menu__item_count { top: -3px; } header .sticky .header-catalog-search { justify-content: end; } header .sticky .header-catalog-search .catalog-btn { display: none; } header .sticky .header-catalog-search .header-search._hide { padding: 0; width: 0; } header .sticky .header-catalog-search .header-search._hide input { padding: 0; width: 0; } header .sticky .header-catalog-search .header-search._hide .search-btn { background-color: transparent; } header .sticky .header-menu .menu__item._desktop { display: none; } header .sticky .header-menu .menu__item._mobile { display: flex; } header .sticky .header-menu .menu__item._mobile svg { display: block; } header .header-bottom { display: none; } } @media (max-width: 1199px) { header .fixed-wrapper .sok__container { justify-content: space-between; } header .sticky { min-height: 40px; } header .sticky .header-logo svg { width: 87px; height: 24px; } header .sticky .header-logo span { display: none; } header .sticky .header-catalog-search._show { position: absolute; left: 0; top: 0; bottom: 0; right: 0; display: flex; align-items: center; } header .sticky .header-catalog-search._show .search-btn { background: var(--color-light); display: none; } header .sticky .header-catalog-search._show .header-search { justify-content: space-between; align-items: center; background: var(--color-white); } header .sticky .header-catalog-search._show .header-search input { background: var(--color-light); margin-left: 40px; width: calc(100% - 50px); } header .sticky .header-catalog-search._show .header-search .header-search_result { width: calc(100% - 20px); } header .sticky .header-catalog-search._show .adaptive-back-btn { display: block; z-index: 1; cursor: pointer; } header .sticky .header-catalog-search .header-search { padding: 0 10px; } header .sticky .header-catalog-search .header-search .search-btn { right: 0; padding: 0; } header .sticky .header-menu { gap: 20px; } header .sticky .header-menu .menu__item.sales { display: none; } } /*Стили шапки (header) END */ /*Стили футера (footer) */ .footer-no-pd { padding: 0; } .footer-no-pd .footer-container .footer-top .footer__inner { padding: 0; border: none; } .footer-no-pd .footer-container .footer-top .footer__inner .footer-list .footer_socials a path { fill: var(--color-red); } .footer-no-pd .footer-container .footer-top .footer__inner .footer-list .footer_socials a:hover path { fill: var(--color-hover-red); } footer { width: 100%; padding: 48px 0; border-top: 1px solid var(--color-light); } footer .footer-top .footer-logo { display: flex; align-items: center; column-gap: 30px; row-gap: 10px; margin-bottom: 12px; } footer .footer-top .footer-logo span { display: none; } footer .footer-top .footer__inner { display: flex; justify-content: space-between; padding-bottom: 30px; padding-top: 16px; border-bottom: 1px solid var(--color-light); row-gap: 20px; } footer .footer-top .footer__inner .footer__col._show { display: block !important; } footer .footer-top .footer__inner .footer__col { font-size: 16px; font-weight: 300; line-height: 24px; transition: all var(--transition); width: 100%; } footer .footer-top .footer__inner .footer__col .footer_logo_title { color: var(--color-neutral-600); } footer .footer-top .footer__inner .footer__col .footer__col_title { font-size: 20px; font-weight: 500; line-height: 24px; display: flex; justify-content: space-between; align-items: center; } footer .footer-top .footer__inner .footer__col .footer__col_title svg { display: none; } footer .footer-top .footer__inner .footer__col .footer_dropdown-menu { display: flex; flex-direction: column; row-gap: 12px; } footer .footer-top .footer__inner .footer__col .footer-list { display: flex; flex-direction: column; row-gap: 12px; } footer .footer-top .footer__inner .footer__col .footer-list a { color: var(--color-gray); } footer .footer-top .footer__inner .footer__col .footer-list a:hover { color: var(--color-red); } footer .footer-top .footer__inner .footer__col .footer_phone { font-size: 20px; } footer .footer-top .footer__inner .footer__col .footer_phone, footer .footer-top .footer__inner .footer__col .footer_email { color: var(--color-neutral-600); } footer .footer-top .footer__inner .footer__col .footer_socials { display: flex; column-gap: 8px; } footer .footer-top .footer__inner .footer__col .footer_socials a path { transition: all var(--transition); fill: var(--color-gray); } footer .footer-top .footer__inner .footer__col .footer_socials a:hover path { fill: var(--color-red); } footer .footer-bottom { display: flex; justify-content: space-between; padding-top: 30px; } footer .footer-bottom .footer_copytight { font-size: 14px; font-weight: 100; line-height: 20px; } footer .footer-bottom .developers { font-size: 14px; font-weight: 400; line-height: 20px; } @media (max-width: 1199px) { .footer-bg { background-size: auto; } footer { padding: 40px 0; border: none; } footer .footer-container .footer-logo { padding-bottom: 30px; border-bottom: 1px solid var(--color-light); } footer .footer-container .footer-logo span { display: block; } footer .footer-container .footer__inner { padding-top: 30px; } footer .footer-container .footer__inner .footer__col:first-child { display: none; } } @media (max-width: 600px) { footer { padding: 30px 0; } footer .footer-container .footer-logo { flex-direction: column; align-items: start; padding-left: 20px; padding-right: 20px; border: none; padding-bottom: 20px; } footer .footer-container .footer-logo span { font-size: 14px; } footer .footer-container .footer__inner { flex-direction: column; padding-top: 0px; border: none; padding-bottom: 0px; } footer .footer-container .footer__inner .footer__col { font-size: 14px; } footer .footer-container .footer__inner .footer__col .footer-list { padding: 0 20px; row-gap: 10px; } footer .footer-container .footer__inner .footer__col .footer_dropdown-menu .footer_dropdown_show { cursor: pointer; padding: 10px 20px; transition: all var(--transition); border-radius: 20px; background-color: var(--color-bg-white); } footer .footer-container .footer__inner .footer__col .footer_dropdown-menu .footer_dropdown_show svg { transition: all var(--transition); transform: rotate(180deg); } footer .footer-container .footer__inner .footer__col .footer_dropdown-menu .footer_dropdown_show._active { background-color: var(--color-white); } footer .footer-container .footer__inner .footer__col .footer_dropdown-menu .footer_dropdown_show._active svg { transform: rotate(0deg); } footer .footer-container .footer__inner .footer__col .footer__col_title { font-size: 16px; } footer .footer-container .footer__inner .footer__col .footer__col_title svg { display: block; } footer .footer-container .footer-bottom { flex-direction: column; row-gap: 20px; padding-left: 20px; padding-right: 20px; padding-top: 20px; } } /* Стили футера (footer) END */ /* End */ /* Start:/local/templates/main/css/components/ruslava-template.css?178782042549007*/ /* Ruslava — переопределения header/footer (классы sok / base) */ /* Header shell — сброс дефолтов template.css */ .sok_header { padding: 0; background: transparent; box-shadow: none; border-bottom: 0; gap: 0; overflow: visible; } .sok_header .fixed-wrapper { width: 100%; background: var(--color-header-bg); overflow: visible; } .sok_header .header-top { width: 100%; background: var(--color-header-bg); border-bottom: 1px solid rgba(255, 255, 255, 0.3); } .sok_header .header-top .sok__container { padding-top: 18px; padding-bottom: 12px; margin-bottom: 0; font-size: 14px; font-weight: 400; line-height: 1.1; } header.sok_header .fixed-wrapper._fixed { background: var(--color-header-bg); box-shadow: none; border-bottom: 0; padding-top: 0; padding-bottom: 0; } .sok_header .header-top .sok_header-email { color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; letter-spacing: 0; } .sok_header-city { display: inline-flex; align-items: center; gap: 4px; border: 0; background: transparent; color: #fff; font: 500 14px/1.4 var(--font-family-accent), var(--font-family-base); cursor: pointer; padding: 0; } .sok_header-city svg { flex-shrink: 0; display: block; } .sok_header .header-top .sok_header-email.sok-copy-text::after { background-color: var(--color-blue); } .sok_header-top-menu { display: flex; align-items: center; gap: 20px; } header.sok_header .header-top .header-dropdowns.sok_header-top-menu { gap: 20px; } .sok_header-top-nav, .sok_header-top-contacts { display: flex; align-items: center; } .sok_header-top-nav { gap: 26px; } /* Внутренний ряд пунктов: Bitrix может обернуть компонент в block-обёртку */ /* Обёртка компонента в режиме правки — flex вместо display:contents (иначе нет иконки) */ .sok_header-top-nav > div[id^="bx_incl"], .sok_header-top-nav > .bx-component-block { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 26px; } .sok_header-top-nav__items { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 26px; } .sok_header-top-nav__items > .dropdown, .sok_header-top-nav__items > .sok_header-top-link { flex-shrink: 0; white-space: nowrap; } .sok_header-top-contacts { gap: 20px; } header.sok_header .header-top .sok_header-top-nav .sok_header-top-link { font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; letter-spacing: 0; color: #fff; text-decoration: none; } header.sok_header .header-top .sok_header-top-nav .sok_header-top-link:hover, header.sok_header .header-top .sok_header-top-nav .sok_header-top-link:focus, header.sok_header .header-top .sok_header-top-nav .sok_header-top-link:focus-visible { color: #fff; text-decoration: none; } /* Дропдауны шапки — Figma 985:34528, разметка base (.dropdown / .dropdown_show / .dropdown_content) */ header.sok_header .header-top { overflow: visible; } header.sok_header .header-top .sok__container { overflow: visible; } header.sok_header .header-top .dropdown .dropdown_show { color: #fff; cursor: pointer; } header.sok_header .header-top .dropdown .dropdown_show span { font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; letter-spacing: 0; color: #fff; } header.sok_header .header-top .dropdown .dropdown_show svg { fill: currentColor; stroke: currentColor; transform: none; } header.sok_header .header-top .dropdown:hover .dropdown_show, header.sok_header .header-top .dropdown._active .dropdown_show { color: #fff; } header.sok_header .header-top .dropdown:hover .dropdown_show svg:not(.no-rotate), header.sok_header .header-top .dropdown._active .dropdown_show svg:not(.no-rotate) { transform: rotate(180deg); fill: currentColor; stroke: currentColor; } header.sok_header .header-top .dropdown .dropdown_content { position: absolute; top: calc(100% + 10px); left: 0; width: 236px; margin: 0; padding: 15px; border-radius: 5px; box-shadow: 0 4px 6.5px rgba(0, 0, 0, 0.22); row-gap: 10px; font-family: var(--font-family-base); } header.sok_header .header-top .dropdown .dropdown_content::before { content: ''; position: absolute; top: -10px; left: 0; right: 0; height: 10px; } header.sok_header .header-top .dropdown .dropdown_content li { color: var(--color-gray); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: 0; } header.sok_header .header-top .dropdown .dropdown_content li a { color: var(--color-gray); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: 0; } header.sok_header .header-top .dropdown .dropdown_content li a:hover, header.sok_header .header-top .dropdown .dropdown_content li a:focus, header.sok_header .header-top .dropdown .dropdown_content li a:focus-visible { color: var(--color-blue); } header.sok_header .sok_header-phone-dropdown .dropdown_show { gap: 8px; } header.sok_header .header-top .dropdown:not(._active) .dropdown_content, header.sok_header .header-top .dropdown:not(._active) .dropdown_content:hover { visibility: hidden; } header.sok_header .sok_header-phone-dropdown .dropdown_content, header.sok_header .sok_header-phone-dropdown__panel { right: 0; left: auto; width: 231px; gap: 20px; border-radius: 8px; box-shadow: 0 4px 13px rgba(0, 0, 0, 0.22); display: none; visibility: visible; } header.sok_header .sok_header-phone-dropdown._active .dropdown_content { display: flex; } header.sok_header .sok_header-phone-dropdown__number { color: var(--color-gray); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: 0; text-decoration: none; white-space: nowrap; } header.sok_header .sok_header-phone-dropdown__number:hover, header.sok_header .sok_header-phone-dropdown__number:focus, header.sok_header .sok_header-phone-dropdown__number:focus-visible { color: var(--color-blue); } .sok_header-social { display: flex; align-items: center; gap: 8px; } .sok_header-social a { display: block; flex-shrink: 0; width: 20px; height: 20px; line-height: 0; } .sok_header-social a img { display: block; width: 20px; height: 20px; } .sok_header .fixed-wrapper .sok__container { gap: 20px; padding-top: 10px; padding-bottom: 10px; position: relative; } .sok_header .fixed-wrapper .sok__container > div:first-child { flex: 0 0 auto; min-width: 0; } .sok_header .header-logo { display: flex; align-items: center; gap: 20px; flex: 0 0 auto; min-width: 0; white-space: normal; color: #fff; } .sok_header .header-logo a { display: block; flex-shrink: 0; line-height: 0; } .sok_header .header-logo a img { display: block; width: 134px; height: 40px; max-width: none; object-fit: contain; } .sok_header .header-logo span { max-width: 252px; color: #fff; font-size: 12px; font-weight: 400; line-height: 1.1; white-space: normal; } .sok_header .header-catalog-search { flex: 1 1 0; min-width: 0; width: auto; } /* Обёртка bitrix:search.title не ломает flex шапки */ .sok_header .header-catalog-search .sok_title-search { display: contents; } /* Режим правки: bx-обёртка компонента должна растягиваться как сам поиск */ .sok_header .header-catalog-search > div[id^="bx_incl"], .sok_header .header-catalog-search > .bx-component-block { flex: 1 1 0; min-width: 0; width: auto; display: flex; align-items: center; position: relative; } .sok_header .header-catalog-search > div[id^="bx_incl"] .header-search, .sok_header .header-catalog-search > .bx-component-block .header-search { flex: 1 1 0; min-width: 0; width: 100%; } header.sok_header .sticky .header-catalog-search { gap: 20px; align-items: center; justify-content: flex-start; width: auto; position: relative; } header.sok_header .sticky .header-catalog-search .header-search { display: flex; align-items: center; gap: 8px; flex: 1 1 0; min-width: 0; width: 100%; height: 40px; margin: 0; padding-left: 16px; padding-right: 0; background: var(--color-plate); border-radius: 4px; position: relative; overflow: visible; box-sizing: border-box; } header.sok_header .sticky .header-catalog-search { overflow: visible; } header.sok_header .sticky .header-catalog-search .header-search .input-text { position: static; flex: 1 1 0; min-width: 0; width: auto; height: auto; padding: 0; border: 0; border-radius: 0; background: transparent; color: #2c4053; font-size: 14px; font-weight: 600; line-height: 1; } header.sok_header .sticky .header-catalog-search .header-search .input-text:focus { border: 0; background: transparent; outline: none; } header.sok_header .sticky .header-catalog-search .header-search .input-text::placeholder { color: #2c4053; opacity: 0.3; font-size: 14px; font-weight: 600; line-height: 1; } header.sok_header .sticky .header-catalog-search .header-search .search-btn { position: static; flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 4px; background: transparent; cursor: pointer; } header.sok_header .sticky .header-catalog-search .header-search .search-btn .sok_header-search-icon_desktop { display: block; width: 16px; height: 16px; } header.sok_header .sticky .header-catalog-search .header-search .search-btn .sok_header-search-icon_mobile { display: none; width: 24px; height: 24px; } header.sok_header .sticky .header-catalog-search .header-search .input-text:focus + .search-btn { background: transparent; } header.sok_header .sticky .header-catalog-search .header-search .header-search_result { display: none; flex-direction: column; gap: 12px; position: absolute; top: calc(100% + 8px); left: 0; right: 0; width: 100%; min-width: 100%; max-width: none; margin: 0; padding: 10px; border-radius: 4px; background: var(--color-plate); box-shadow: 0 2px 2px -1px rgba(30, 41, 59, 0.04), 0 16px 24px -4px rgba(30, 41, 59, 0.16); z-index: 30; overflow: visible; color: #010117; box-sizing: border-box; } header.sok_header .sticky .header-catalog-search .header-search .header-search_result._active { display: flex; } header.sok_header .sticky .header-catalog-search .header-search .search-result { display: flex; flex-direction: column; gap: 0; row-gap: 0; width: 100%; } header.sok_header .sticky .header-catalog-search .header-search .search-result .mobile-result-item { display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 5px 10px; border-radius: 10px; color: #010117; text-decoration: none; transition: background var(--transition); } header.sok_header .sticky .header-catalog-search .header-search .search-result .mobile-result-item:hover { background: var(--color-white); border-radius: 4px; } header.sok_header .sticky .header-catalog-search .header-search .search-result .mobile-result-image { flex-shrink: 0; width: 40px; height: 40px; border-radius: 20px; overflow: hidden; } header.sok_header .sticky .header-catalog-search .header-search .search-result .mobile-result-image img { display: block; width: 100%; height: 100%; object-fit: cover; } header.sok_header .sticky .header-catalog-search .header-search .search-result .result-name-prices { display: flex; flex-direction: column; gap: 4px; min-width: 0; } header.sok_header .sticky .header-catalog-search .header-search .search-result .result-name { font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1; color: #010117; } header.sok_header .sticky .header-catalog-search .header-search .search-result .result-prices { display: flex; align-items: center; gap: 10px; } header.sok_header .sticky .header-catalog-search .header-search .search-result .result-price { font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; color: #010117; white-space: nowrap; } header.sok_header .sticky .header-catalog-search .header-search .search-result .old-price { font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; color: rgba(158, 180, 204, 0.25); text-decoration: line-through; white-space: nowrap; } header.sok_header .sticky .header-catalog-search .header-search .sok_header-search-all { height: 40px; margin-top: 0; padding: 8px 20px; font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1; text-decoration: none; box-shadow: 0 1px 1px rgba(30, 41, 59, 0.12); } header.sok_header .sticky .header-menu { flex: 0 0 auto; height: 48px; gap: 0; align-items: center; } header.sok_header .sticky .header-menu .sok_header-request { display: flex; flex-direction: column; gap: 2px; width: 60px; height: 48px; align-items: center; justify-content: center; align-self: center; border-radius: 4px; padding: 0; color: #fff !important; font-family: var(--font-family-base); font-size: var(--font-12); font-weight: 400; line-height: 1.1; text-decoration: none; transition: background var(--transition); } header.sok_header .sticky .header-menu .sok_header-request:hover { background: rgba(255, 255, 255, 0.15); color: #fff !important; text-decoration: none; } header.sok_header .sticky .header-menu .sok_header-request img { display: block; width: 32px; height: 32px; flex-shrink: 0; } header.sok_header .sticky .header-menu .sok_header-request-icon { position: relative; display: block; width: 32px; height: 32px; flex-shrink: 0; } header.sok_header .sticky .header-menu .sok_header-request-count { position: absolute; top: -5px; right: -5px; z-index: 1; display: none; min-width: 14px; height: 14px; align-items: center; justify-content: center; padding: 0 3px; border-radius: 999px; background: var(--color-white); color: #2c4053; font-family: var(--font-family-base); font-size: 9px; font-weight: 400; line-height: 1; letter-spacing: 0.18px; text-align: center; } header.sok_header .sticky .header-menu .sok_header-request._active .sok_header-request-count { display: flex; } header.sok_header .sticky .header-menu .sok_header-request span { line-height: 1.1; white-space: nowrap; } header.sok_header .sticky .header-catalog-search .catalog-btn { display: flex; align-items: center; align-self: center; background-color: var(--color-blue); border: 0; border-radius: 4px; color: #fff; flex-shrink: 0; height: 40px; padding: 8px 28px 8px 20px; gap: 4px; } header.sok_header .sticky .header-catalog-search .catalog-btn .nav-toggle { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 16px; height: 16px; padding: 0; border: 0; background: transparent; cursor: pointer; } header.sok_header .sticky .header-catalog-search .catalog-btn .nav-toggle img { display: block; width: 16px; height: 16px; } header.sok_header .sticky .header-catalog-search .catalog-btn:hover, header.sok_header .sticky .header-catalog-search .catalog-btn._active { background-color: var(--color-blue); } header.sok_header .sticky .header-catalog-search .catalog-btn span { color: #fff; font-weight: 600; line-height: 1; } /* Мега-меню каталога — на всю ширину .sok__container */ header.sok_header .sticky.sok__container .catalog-btn_content { display: none; position: absolute; top: 100%; left: 0; right: 0; width: auto; z-index: 102; margin: 0; padding: 60px 40px; background: #fff; border-radius: 0 0 10px 10px; box-shadow: 4px 3px 4.5px rgba(0, 0, 0, 0.25); background-image: none; cursor: auto; box-sizing: border-box; } /* Обёртка компонента в режиме правки не должна становиться containing block */ header.sok_header .sticky.sok__container .catalog-btn_content > div[id^="bx_incl"], header.sok_header .sticky.sok__container .catalog-btn_content > .bx-component-block, header.sok_header .sticky.sok__container .catalog-btn_content > .bx-component-opener { position: static !important; display: block; width: 100%; } header.sok_header .sticky.sok__container:has(.catalog-btn._active) .catalog-btn_content { display: block; } .sok_header-catalog-mega__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 50px 120px; width: 100%; margin: 0 auto; } .sok_header-catalog-mega__item { display: flex; align-items: flex-start; gap: 20px; min-width: 0; } .sok_header-catalog-mega__image { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 90px; height: 90px; line-height: 0; } .sok_header-catalog-mega__image img { display: block; width: 90px; height: 90px; object-fit: contain; } .sok_header-catalog-mega__body { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; min-width: 0; } .sok_header-catalog-mega__title { color: var(--color-heading); font-size: 18px; font-weight: 600; line-height: 1.2; text-decoration: none; } .sok_header-catalog-mega__title:hover, .sok_header-catalog-mega__title:focus, .sok_header-catalog-mega__title:focus-visible { color: var(--color-blue); } .sok_header-catalog-mega__links { display: flex; flex-direction: column; gap: 5px; margin: 0; padding: 0; list-style: none; } .sok_header-catalog-mega__links a { color: #000; font-size: 15px; font-weight: 400; line-height: 1.4; text-decoration: none; } .sok_header-catalog-mega__links a:hover, .sok_header-catalog-mega__links a:focus, .sok_header-catalog-mega__links a:focus-visible { color: var(--color-blue); } .sok_header-catalog-mega__link._hidden { display: none; } .sok_header-catalog-mega__links._expanded .sok_header-catalog-mega__link._hidden { display: list-item; } .sok_header-catalog-mega__toggle { display: inline-flex; align-items: center; gap: 5px; margin: 0; padding: 0; border: 0; background: transparent; color: #000; font-family: inherit; font-size: 15px; font-weight: 400; line-height: 1.4; cursor: pointer; } .sok_header-catalog-mega__toggle-label { display: block; line-height: 1.4; } .sok_header-catalog-mega__toggle:hover, .sok_header-catalog-mega__toggle:focus, .sok_header-catalog-mega__toggle:focus-visible { color: var(--color-blue); } .sok_header-catalog-mega__toggle-icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 18px; height: 18px; line-height: 0; } .sok_header-catalog-mega__toggle-icon svg { display: block; width: 18px; height: 18px; fill: currentColor; } .sok_header .header-bottom { width: 100%; background: #fff; border-top: 1px solid rgba(163, 163, 163, 0.2); border-bottom: 1px solid rgba(163, 163, 163, 0.2); } .sok_header .bottom_menu a { color: var(--color-header-text); font-size: 14px; font-weight: 500; } /* Footer — Figma 719:27181 */ footer.sok_footer { position: relative; background: var(--color-footer-bg); overflow: hidden; border-top: 1px solid var(--color-footer-border); padding: 40px 0 20px; font-family: var(--font-family-base); } footer.sok_footer .sok_footer__bg { position: absolute; top: -100px; left: 50%; width: 100%; max-width: 1920px; height: 1079px; transform: translateX(-50%); background: url(/local/templates/main/css/components/../../img/home/footer/bg.png) center top / cover no-repeat; opacity: 0.2; pointer-events: none; mix-blend-mode: plus-lighter; } footer.sok_footer .footer-container { position: relative; z-index: 1; } footer.sok_footer .footer-top .footer__inner { justify-content: initial; padding: 0; border-bottom: 0; } footer.sok_footer .footer-top .footer__inner.sok_footer__cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); column-gap: 12px; row-gap: 0; align-items: start; width: 100%; } footer.sok_footer .footer-bottom { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); width: 100%; } footer.sok_footer .footer-bottom { align-items: center; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--color-footer-border); } footer.sok_footer .footer-bottom .footer_copytight { grid-column: 1; min-width: 0; color: var(--color-footer-text); font-size: 14px; font-weight: 500; line-height: 1.1; } footer.sok_footer .footer-bottom .sok_footer-legal { grid-column: 3; justify-self: start; min-width: 0; color: var(--color-footer-text); font-size: 14px; font-weight: 500; line-height: 1.1; text-decoration: none; } footer.sok_footer .footer-top .footer__inner .footer__col { display: flex; flex-direction: column; gap: 8px; width: auto; font-size: inherit; font-weight: inherit; line-height: inherit; } footer.sok_footer .footer-top .footer__inner .footer__col .footer__col_title { margin: 0; font-size: inherit; font-weight: inherit; line-height: inherit; } footer.sok_footer .footer-top .footer__inner .footer__col .footer__col_title span { color: #fff; font-size: 16px; font-weight: 700; line-height: 1.2; } footer.sok_footer .footer-top .footer__inner .footer__col .footer-list { display: flex; flex-direction: column; gap: 8px; row-gap: 8px; margin: 0; padding: 0; list-style: none; } footer.sok_footer .footer-top .footer__inner .footer__col .footer-list li { margin: 0; padding: 0; } footer.sok_footer .footer-top .footer__inner .footer__col .footer-list a { color: var(--color-footer-text); font-size: 14px; font-weight: 500; line-height: 1.1; text-decoration: none; } footer.sok_footer .footer-top .footer__inner .footer__col .footer-list a:hover { color: #fff; } footer.sok_footer .footer-top .footer__inner .footer__col.sok_footer__contacts { gap: 12px; } footer.sok_footer .sok_footer__contacts-list { display: flex; flex-direction: column; gap: 12px; } footer.sok_footer .footer-top .footer__inner .footer__col .footer_phone, footer.sok_footer .footer-top .footer__inner .footer__col .footer_email, footer.sok_footer .footer-top .footer__inner .footer__col .footer_address { color: #fff; font-size: 16px; font-weight: 700; line-height: 1.2; text-decoration: none; } footer.sok_footer .footer-top .footer__inner .footer__col .footer_socials.sok_footer-social { display: flex; gap: 12px; margin-top: 0; } footer.sok_footer .footer-top .footer__inner .footer__col .footer_socials.sok_footer-social a { display: block; flex-shrink: 0; width: 24px; height: 24px; border-radius: 0; background: transparent; line-height: 0; } footer.sok_footer .footer-top .footer__inner .footer__col .footer_socials.sok_footer-social img { display: block; width: 24px; height: 24px; object-fit: contain; } /* Footer — tablet 768 (Figma 1:5612) */ @media (max-width: 1199px) { footer.sok_footer { padding: 40px 0 20px; border-top: 1px solid var(--color-footer-border); } footer.sok_footer .sok_footer__bg { top: 0; left: calc(50% - 240px); transform: none; } footer.sok_footer .footer-bottom { display: flex; flex-direction: row; align-items: center; gap: 12px; } footer.sok_footer .footer-bottom .footer_copytight, footer.sok_footer .footer-bottom .sok_footer-legal { flex: 1 0 0; grid-column: auto; } /* base template.css — не скрывать «Компанию», не добавлять отступы спискам */ footer.sok_footer .footer-top .footer__inner .footer__col:first-child { display: flex; } footer.sok_footer .footer-top .footer__inner .footer__col .footer-list { padding: 0; row-gap: 8px; } footer.sok_footer .footer-top .footer__inner { padding-top: 0; padding-bottom: 0; border: none; } footer.sok_footer .footer-bottom { padding-left: 0; padding-right: 0; } } @media (max-width: 1440px) { .sok_header-catalog-mega__grid { gap: 40px 60px; } header.sok_header .sticky.sok__container .catalog-btn_content { padding: 40px 24px; } } /* Footer — 2 колонки: 361px … 1024px */ @media (min-width: 361px) and (max-width: 1024px) { footer.sok_footer .footer-top .footer__inner.sok_footer__cols, footer.sok_footer .footer-bottom { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } footer.sok_footer .footer-top .footer__inner.sok_footer__cols { row-gap: 40px; column-gap: 12px; } footer.sok_footer .footer-bottom .sok_footer-legal { grid-column: 2; } } /* Footer — mobile 360 (Figma 719:27330) */ @media (max-width: 767px) { footer.sok_footer .sok_footer__bg { left: 50%; transform: translateX(-50%); } footer.sok_footer .footer-top .footer__inner.sok_footer__cols { grid-template-columns: 1fr; row-gap: 40px; column-gap: 0; } footer.sok_footer .footer-bottom { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; } footer.sok_footer .footer-bottom .footer_copytight, footer.sok_footer .footer-bottom .sok_footer-legal { flex: none; width: 100%; grid-column: auto; } } .sok_header-actions { display: contents; } .sok_header-search-icon_mobile { display: none; } header.sok_header .sticky .header-menu .menu__item._mobile { display: none; } header.sok_header .sticky .header-menu .sok_header-burger { flex-direction: column; gap: 0; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: #fff; cursor: pointer; transition: background var(--transition); } header.sok_header .sticky .header-menu .sok_header-burger:hover { background: rgba(255, 255, 255, 0.15); } header.sok_header .sticky .header-menu .sok_header-burger img { display: block; width: 24px; height: 24px; } @media (min-width: 993px) and (max-width: 1200px) { .sok_header .header-logo span { display: none; } } @media (max-width: 1199px) { header.sok_header { height: 56px; padding: 0; } .sok_header .header-top, .sok_header .header-bottom { display: none; } .sok_header .fixed-wrapper .sok__container { gap: 20px; padding-top: 8px; padding-bottom: 8px; justify-content: space-between; } .sok_header .header-logo { gap: 20px; min-width: 0; } .sok_header-actions { display: flex; align-items: center; gap: 20px; flex: 0 0 auto; } header.sok_header .sticky .header-catalog-search { flex: 0 0 auto; width: auto; justify-content: flex-end; gap: 0; } header.sok_header .sticky .header-catalog-search .catalog-btn { display: none; } header.sok_header .sticky .header-catalog-search .header-search._hide { width: auto; height: 40px; padding: 0; background: transparent; flex: 0 0 auto; } header.sok_header .sticky .header-catalog-search .header-search._hide .input-text { display: none; } header.sok_header .sticky .header-catalog-search .header-search._hide .search-btn { width: 40px; height: 40px; border-radius: 4px; background: transparent; } header.sok_header .sticky .header-catalog-search .header-search._hide .search-btn:hover { background: rgba(255, 255, 255, 0.15); } header.sok_header .sticky .header-catalog-search .header-search .search-btn .sok_header-search-icon_desktop { display: none; } header.sok_header .sticky .header-catalog-search .header-search .search-btn .sok_header-search-icon_mobile { display: block; width: 24px; height: 24px; } header.sok_header .sticky .header-menu { height: auto; gap: 20px; } header.sok_header .sticky .header-menu .sok_header-request { width: 40px; height: 40px; gap: 0; } header.sok_header .sticky .header-menu .sok_header-request img, header.sok_header .sticky .header-menu .sok_header-request-icon { width: 24px; height: 24px; } header.sok_header .sticky .header-menu .sok_header-request span:not(.sok_header-request-icon):not(.sok_header-request-count) { display: none; } header.sok_header .sticky .header-menu .menu__item._mobile { display: flex; } } @media (max-width: 767px) { .sok_header .fixed-wrapper .sok__container { gap: 12px; } header.sok_header .sticky .header-logo span { display: none; } header.sok_header .sticky .header-logo a img { width: 107px; height: 32px; } .sok_header-actions { gap: 12px; } header.sok_header .sticky .header-menu { gap: 12px; } } /* Мобильное меню — Figma 303:23441 */ .modal._active:has(#modal-content.sok_mobile-menu) { align-items: stretch; justify-content: stretch; } .modal._active:has(#modal-content.sok_mobile-menu) .modal_bg { opacity: 0; } #modal-content.sok_mobile-menu.fullsreen_modal_container { position: fixed; inset: 0; left: 0 !important; width: 100%; height: 100%; min-height: 100%; margin: 0; padding: 0; gap: 0; border: 0; border-radius: 0; background: var(--color-header-bg); overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; box-sizing: border-box; } #modal-content.sok_mobile-menu .fullsreen_side_menu_container { width: 100%; height: 100%; transform: translateX(0); } #modal-content.sok_mobile-menu .fullsreen_side_menu_container::after { display: none; } #modal-content.sok_mobile-menu .fullsreen_side_menu_content { height: 100%; overflow: visible; row-gap: 0; } #modal-content.sok_mobile-menu .sok_mobile-menu__panel { display: flex; flex-direction: column; gap: 10px; width: 100%; min-height: 100%; padding: 10px 15px; overflow: visible; box-sizing: border-box; } #modal-content.sok_mobile-menu .sok_mobile-menu__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 2px 0; } #modal-content.sok_mobile-menu .sok_mobile-menu__logo { display: block; flex: 1 1 auto; line-height: 0; } #modal-content.sok_mobile-menu .sok_mobile-menu__logo img { display: block; width: 107px; height: 32px; object-fit: contain; } #modal-content.sok_mobile-menu .sok_mobile-menu__close { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; } #modal-content.sok_mobile-menu .sok_mobile-menu__close img { display: block; width: 24px; height: 24px; } #modal-content.sok_mobile-menu .sok_mobile-menu__divider { width: 100%; flex-basis: 100%; height: 0; border-top: 1px solid rgba(255, 255, 255, 0.15); } #modal-content.sok_mobile-menu .sok_mobile-menu__search { display: flex; align-items: center; gap: 8px; width: 100%; height: 40px; padding: 0 0 0 16px; border: 0; border-radius: 4px; background: rgba(241, 245, 249, 0.1); color: #fff; cursor: pointer; text-align: left; box-sizing: border-box; } #modal-content.sok_mobile-menu .sok_mobile-menu__search-placeholder { flex: 1 1 0; min-width: 0; color: #fff; opacity: 0.7; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; } #modal-content.sok_mobile-menu .sok_mobile-menu__search-icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 40px; height: 40px; opacity: 0.7; } #modal-content.sok_mobile-menu .sok_mobile-menu__search-icon img { display: block; width: 16px; height: 16px; } #modal-content.sok_mobile-menu .sok_mobile-menu__nav { display: flex; flex-direction: column; width: 100%; } #modal-content.sok_mobile-menu .side-menu-list.sok_mobile-menu__nav-list { display: flex; flex-direction: column; width: 100%; margin: 0; padding: 0; list-style: none; border: 0; } #modal-content.sok_mobile-menu .sok_mobile-menu__item { display: block; width: 100%; border: 0; border-radius: 0; color: #fff; } #modal-content.sok_mobile-menu .sok_mobile-menu__link { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 40px; padding: 4px; border: 0; border-radius: 8px; background: transparent; color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; text-align: left; text-decoration: none; cursor: pointer; box-sizing: border-box; } #modal-content.sok_mobile-menu .sok_mobile-menu__link:hover, #modal-content.sok_mobile-menu .sok_mobile-menu__link:focus-visible { color: #fff; text-decoration: none; } #modal-content.sok_mobile-menu .sok_mobile-menu__link_icon { justify-content: flex-start; gap: 10px; } #modal-content.sok_mobile-menu .sok_mobile-menu__link_icon img { display: block; width: 16px; height: 16px; flex-shrink: 0; } #modal-content.sok_mobile-menu .sok_mobile-menu__arrow { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 24px; height: 24px; padding: 4px 0 4px 8px; box-sizing: border-box; } #modal-content.sok_mobile-menu .sok_mobile-menu__arrow img { display: block; width: 16px; height: 16px; transform: rotate(-90deg); } #modal-content.sok_mobile-menu .sok_mobile-menu__contacts { display: flex; flex-direction: column; gap: 25px; width: 100%; } #modal-content.sok_mobile-menu .sok_mobile-menu__contact-list { display: flex; flex-direction: column; gap: 10px; width: 100%; } #modal-content.sok_mobile-menu .sok_mobile-menu__city { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent; color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; cursor: pointer; } #modal-content.sok_mobile-menu .sok_mobile-menu__city img { display: block; flex-shrink: 0; } #modal-content.sok_mobile-menu .sok_mobile-menu__city > img:first-child { width: 18px; height: 18px; color: #fff; filter: brightness(0) invert(1); } #modal-content.sok_mobile-menu .sok_mobile-menu__city-arrow { width: 14px; height: 14px; transform: rotate(-90deg); } #modal-content.sok_mobile-menu .sok_mobile-menu__contact { display: inline-flex; align-items: center; gap: 5px; color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; text-decoration: none; } #modal-content.sok_mobile-menu .sok_mobile-menu__contact:hover { color: #fff; text-decoration: none; } #modal-content.sok_mobile-menu .sok_mobile-menu__contact_email { display: inline-flex; align-items: center; gap: 5px; } #modal-content.sok_mobile-menu .sok_mobile-menu__contact-link { color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; text-decoration: none; } #modal-content.sok_mobile-menu .sok_mobile-menu__contact-link:hover { color: #fff; text-decoration: none; } #modal-content.sok_mobile-menu .sok-copy-text__btn { color: #fff; } #modal-content.sok_mobile-menu .sok_mobile-menu__contact-icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 20px; height: 20px; padding: 3px; box-sizing: border-box; } #modal-content.sok_mobile-menu .sok_mobile-menu__contact-icon img { display: block; width: 13px; height: 13px; } #modal-content.sok_mobile-menu .sok_mobile-menu__social { display: flex; align-items: center; gap: 10px; } #modal-content.sok_mobile-menu .sok_mobile-menu__social a { display: block; line-height: 0; } #modal-content.sok_mobile-menu .sok_mobile-menu__social img { display: block; width: 28px; height: 28px; } #modal-content.sok_mobile-menu .mobilemenu__menu-dropdown.sok_mobile-menu__dropdown { display: none; flex-direction: column; gap: 0; position: absolute; top: 0; left: 100%; width: 100%; height: 100%; margin: 0; padding: 10px 15px; border: 0; background: var(--color-header-bg); overflow: visible; box-sizing: border-box; z-index: 5; } #modal-content.sok_mobile-menu .mobilemenu__menu-dropdown.sok_mobile-menu__dropdown::after { display: none; } #modal-content.sok_mobile-menu .mobilemenu__menu-dropdown.sok_mobile-menu__dropdown._active { display: flex; } #modal-content.sok_mobile-menu .sok_mobile-menu__dropdown-head { display: flex; flex-direction: column; gap: 10px; width: 100%; margin: 0 0 10px; padding: 0 0 10px; list-style: none; } #modal-content.sok_mobile-menu .sok_mobile-menu__subhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 36px; margin: 0; padding: 2px 0; border-bottom: 0; list-style: none; } #modal-content.sok_mobile-menu .sok_mobile-menu__back { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; } #modal-content.sok_mobile-menu .sok_mobile-menu__back img { display: block; width: 24px; height: 24px; } #modal-content.sok_mobile-menu .sok_mobile-menu__subtitle { flex: 1 1 0; min-width: 0; color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; text-align: center; } #modal-content.sok_mobile-menu .sok_mobile-menu__catalog-link { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 4px; border: 0; border-radius: 8px; background: transparent; color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; text-align: left; text-decoration: none; cursor: pointer; box-sizing: border-box; } #modal-content.sok_mobile-menu .sok_mobile-menu__catalog-link_parent { justify-content: space-between; } #modal-content.sok_mobile-menu .sok_mobile-menu__catalog-item { width: 100%; } #modal-content.sok_mobile-menu .sok_mobile-menu__catalog-link:hover, #modal-content.sok_mobile-menu .sok_mobile-menu__catalog-link:focus-visible { color: #fff; text-decoration: none; } #modal-content.sok_mobile-menu .side-menu-item { display: block; width: 100%; border: 0; border-radius: 0; color: #fff; } #modal-content.sok_mobile-menu .side-menu-item:hover { background: transparent; } #modal-content.sok_mobile-menu .side-menu-item-parent { display: block; } #modal-content.sok_mobile-menu .side-menu-top.side-menu-top-parent { display: flex; justify-content: space-between; align-items: center; width: 100%; min-height: 40px; padding: 4px; border: 0; border-radius: 8px; background: transparent; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; color: #fff; cursor: pointer; } #modal-content.sok_mobile-menu .side-menu-item .item-title { color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; } /* Мобильный поиск — Figma 303:23592, 303:23597 */ .modal._active:has(#modal-content.sok_mobile-search) { align-items: stretch; justify-content: stretch; } .modal._active:has(#modal-content.sok_mobile-search) .modal_bg { opacity: 0; } #modal-content.sok_mobile-search.fullsreen_modal_container { position: fixed; inset: 0; left: 0 !important; width: 100%; height: 100%; min-height: 100%; margin: 0; padding: 10px 15px; gap: 10px; border: 0; border-radius: 0; background: var(--color-header-bg); overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; box-sizing: border-box; } .sok_mobile-search__top { display: flex; align-items: center; gap: 14px; width: 100%; } .sok_mobile-search__back { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; } .sok_mobile-search__back img { display: block; width: 24px; height: 24px; } .sok_mobile-search__field { display: flex; align-items: center; gap: 8px; flex: 1 1 0; min-width: 0; height: 40px; margin: 0; padding-left: 16px; border-radius: 4px; background: rgba(241, 245, 249, 0.1); box-sizing: border-box; } .sok_mobile-search__input { flex: 1 1 0; min-width: 0; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; color: #fff; caret-color: #fff; -webkit-text-fill-color: #fff; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; appearance: none; } .sok_mobile-search__input:focus { outline: none; border: 0; background: transparent; color: #fff; caret-color: #fff; -webkit-text-fill-color: #fff; } .sok_mobile-search__input::placeholder { color: #fff; opacity: 0.7; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; } .sok_mobile-search__input:focus::placeholder { opacity: 0; } .sok_mobile-search__submit { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; cursor: pointer; opacity: 0.7; } .sok_mobile-search__submit img { display: block; width: 16px; height: 16px; } .sok_mobile-search__results { display: flex; flex-direction: column; gap: 20px; width: 100%; padding-top: 10px; box-sizing: border-box; } .sok_mobile-search__results[hidden] { display: none !important; } .sok_mobile-search__list { display: flex; flex-direction: column; gap: 20px; width: 100%; } .sok_mobile-search__item { display: flex; align-items: center; gap: 15px; min-height: 54px; color: #fff; text-decoration: none; } .sok_mobile-search__image { flex-shrink: 0; width: 52px; height: 53px; border-radius: 4px; overflow: hidden; line-height: 0; } .sok_mobile-search__image img { display: block; width: 100%; height: 100%; object-fit: cover; } .sok_mobile-search__info { display: flex; flex-direction: column; gap: 8px; justify-content: center; min-width: 0; } .sok_mobile-search__name { color: #fff; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; } .sok_mobile-search__prices { display: flex; align-items: center; gap: 10px; } .sok_mobile-search__price { color: #fff; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; white-space: nowrap; } .sok_mobile-search__old-price { color: #94a3b8; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; text-decoration: line-through; opacity: 0.5; white-space: nowrap; } /* Модалка выбора города — Figma 268:22623 */ .modal .modal_dialog.sok_city-modal { width: 100%; max-width: 496px; padding: 40px; gap: 40px; row-gap: 40px; font-family: var(--font-family-base); } .modal .modal_dialog.sok_city-modal .sok_city-modal__title { margin: 0; padding-right: 0; font-family: var(--font-family-base); font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -1px; color: var(--color-heading); } .sok_city-modal__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; } .sok_city-modal__item { border: 0; background: transparent; padding: 0; font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; color: var(--color-heading); cursor: pointer; text-align: left; } .sok_city-modal__item._active { color: var(--color-blue); } .sok_city-modal__item:hover, .sok_city-modal__item:focus, .sok_city-modal__item:focus-visible { color: var(--color-blue); } /* Модалка «Перезвоните мне» — Figma 596:27088 */ .modal .modal_dialog.sok_callback-modal { width: 100%; max-width: 600px; padding: 40px; gap: 40px; row-gap: 40px; font-family: var(--font-family-base); } /* AJAX-обёртка bitrix:form.result.new — сохраняем gap между заголовком и формой */ .modal .modal_dialog.sok_callback-modal > [id^="comp_"] { display: flex; flex-direction: column; gap: 40px; row-gap: 40px; width: 100%; } .modal .modal_dialog.sok_callback-modal .sok_callback-modal__title { margin: 0; padding-right: 0; font-family: var(--font-family-base); font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -1px; color: var(--color-heading); } .modal .modal_dialog.sok_callback-modal .modal_form { gap: 25px; } .modal .modal_dialog.sok_callback-modal .modal_form fieldset { margin-bottom: 0; row-gap: 10px; } .modal .modal_dialog.sok_callback-modal .modal_form fieldset label { color: #010117; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; } .modal .modal_dialog.sok_callback-modal .modal_form .input-text { height: 44px; padding: 8px 10px; border-radius: 4px; border-color: var(--color-plate); background-color: var(--color-plate); color: #010117; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; } .modal .modal_dialog.sok_callback-modal .modal_form .input-text::placeholder { color: var(--color-primary-dark-gray); } .modal .modal_dialog.sok_callback-modal .modal_form .input-text:focus { background-color: var(--color-white); border-color: #f2f5f9; color: #010117; } .modal .modal_dialog.sok_callback-modal .modal_nav { margin-bottom: 0; } .modal .modal_dialog.sok_callback-modal .sok_callback-modal__agreement { align-items: flex-start; gap: 7px; color: #010117; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; } .modal .modal_dialog.sok_callback-modal .sok_callback-modal__agreement a { color: #010117; } .modal .modal_dialog.sok_callback-modal .sok_callback-modal__agreement a:hover { color: var(--color-blue); } .modal .modal_dialog.sok_callback-modal .button_group { margin-bottom: 0; } .modal .modal_dialog.sok_callback-modal .modal_btn { height: 40px; padding: 8px 24px; font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1; } /* page-top — крошки + h1 (внутренние страницы) */ .page-top { background: var(--color-white); } .page-top .page-top__inner { display: flex; flex-direction: column; } .page-top .breadcrumbs { padding: 40px 0 24px; margin: 0; column-gap: 10px; row-gap: 0; color: var(--color-gray); overflow-x: auto; } .page-top .breadcrumbs .breadcrumbs__item, .page-top .breadcrumbs .separator { font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; color: var(--color-gray); white-space: nowrap; } .page-top .breadcrumbs a.breadcrumbs__item:hover, .page-top .breadcrumbs a.breadcrumbs__item:focus-visible { color: var(--color-gray); text-decoration: none; } .page-top .page-top__inner ._h1 { margin: 0 0 32px; color: var(--color-heading); font-family: var(--font-family-base); font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -0.03em; } @media (max-width: 1199px) { .page-top .breadcrumbs { padding-top: 40px; padding-bottom: 24px; margin-bottom: 0; } .page-top .page-top__inner ._h1 { margin-bottom: 32px; } } @media (max-width: 767px) { .page-top .breadcrumbs { padding: 24px 0; column-gap: 5px; } .page-top .breadcrumbs .breadcrumbs__item, .page-top .breadcrumbs .separator { font-size: 10px; } .page-top .page-top__inner ._h1 { font-size: 21px; letter-spacing: -0.01em; margin-bottom: 20px; } } /* main_content — контентные страницы (!widePage) */ .main_content { padding-bottom: 60px; } @media (max-width: 1199px) { .main_content { padding-bottom: 40px; } } /* End */ /* Start:/local/templates/main/css/components/swiper.css?17841810238806*/ /*Стили Свайпер (swiper) */ .swiper-vertical .swiper-wrapper { flex-direction: column; } .swiper { user-select: none; } .swiper:hover .swiper-button-prev:not(.swiper-button-disabled), .swiper:hover .swiper-button-next:not(.swiper-button-disabled) { opacity: 1; } .swiper .swiper-wrap { overflow: hidden; } .swiper .swiper-buttons { position: absolute; display: flex; justify-content: space-between; width: 100%; top: calc(50% - 30px); } .swiper .swiper-button-prev svg, .swiper .swiper-button-next svg { width: auto; height: auto; } .swiper .swiper-button-next[aria-disabled=true], .swiper .swiper-button-prev[aria-disabled=true] { display: none; } .swiper .swiper-button-prev::after, .swiper .swiper-button-next::after { display: none; } .swiper .swiper-button-prev, .swiper .swiper-button-next { width: 60px; height: 60px; background-color: var(--color-white); border-radius: 100%; transition: all var(--transition); filter: drop-shadow(0px 8px 16px rgba(30, 41, 59, 0.12)) drop-shadow(0px 2px 2px rgba(30, 41, 59, 0.04)); opacity: 0; } .swiper .swiper-button-prev { left: -30px; } .swiper .swiper-button-next { right: -30px; } .swiper .swiper-pagination { display: flex; gap: 10px; justify-content: center; } .swiper .swiper-pagination-bullet { background-color: var(--color-light-gray); opacity: 0.2; width: 10px; height: 10px; } .swiper .swiper-pagination-bullet-active, .swiper .swiper-pagination-bullet:hover { opacity: 1; } @media (max-width: 1440px) { .swiper .swiper-button-prev { left: 0px; } .swiper .swiper-button-next { right: 0px; } } .main-slider .swiper-buttons { top: 50%; } .main-slider .swiper-wrapper .swiper-slide img { width: 100%; height: 25vw; min-height: 100px; max-height: 400px; border-radius: 30px; background-size: 100% 100%; background-repeat: no-repeat; overflow: hidden; transition: all var(--transition); } @media (max-width: 1440px) { .main-slider { overflow: auto; } } @media (max-width: 1199px) { .main-slider .swiper-wrapper .swiper-slide img { border-radius: 16px; } } @media (max-width: 1199px) { .main-slider .swiper-wrapper .swiper-slide img { min-height: 140px; height: 100%; } } .catalog-slider .swiper-wrapper .catalog-slide { width: max-content; height: max-content; } .catalog-slider .swiper-wrapper .catalog-slide .section-carousel-card { padding: 0; } .catalog-slider .swiper-wrapper .catalog-slide .section-carousel-card span { padding: 20px; /* max-height: 65px; */ } @media (max-width: 1440px) { .catalog-slider { overflow: auto; } } .manufacture-slider .swiper-wrap { margin-bottom: -20px; margin-top: -20px; margin-left: -10px; margin-right: -10px; } .manufacture-slider .swiper-wrapper { padding: 20px 10px; } .manufacture-slider .swiper-wrapper .swiper-slide { width: max-content; height: max-content; } .manufacture-slider .swiper-wrapper .manufacture-slide { width: 197px; height: 87px; display: flex; align-items: center; justify-content: center; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); background-color: var(--color-white); border-radius: 20px; filter: grayscale(100%); transition: all var(--transition); padding: 10px; } .manufacture-slider .swiper-wrapper .manufacture-slide:hover { /* new hover */ box-shadow: 0px 0px 12px 4px rgba(30, 41, 59, 0.08), 0px 0px 16px -1px rgba(30, 41, 59, 0.16); } .manufacture-slider .swiper-wrapper .manufacture-slide:hover { filter: grayscale(0%); } .manufacture-slider .swiper-wrapper .manufacture-slide img { max-width: 177px; width: max-content; max-height: 67px; background-size: 100%; } @media (max-width: 1440px) { .manufacture-slider .swiper-wrap { margin-right: 0px; } .manufacture-slider .swiper-wrapper { padding-right: 0; } } @media (max-width: 1199px) { .manufacture-slider .swiper-wrapper .manufacture-slide { width: 216px; height: 120px; } .manufacture-slider .swiper-wrapper .manufacture-slide img { max-width: 210px; max-height: 73px; object-fit: contain; } } @media (max-width: 767px) { .manufacture-slider .swiper-wrapper .manufacture-slide { width: 140px; height: 78px; } .manufacture-slider .swiper-wrapper .manufacture-slide img { max-width: 140px; max-height: 49px; object-fit: contain; } } .products-slider .swiper-wrap { margin-bottom: -20px; margin-top: -20px; margin-left: -10px; margin-right: -10px; } .products-slider .swiper-wrapper { padding: 20px 10px; } .products-slider .swiper-wrapper .products-slide { width: max-content; height: max-content; } @media (max-width: 1440px) { .products-slider .swiper-wrap { margin-right: 0px; } .products-slider .swiper-wrapper { padding-right: 0; } } @media (max-width: 1199px) { .products-slider .swiper-wrapper .products-slide { width: max-content; } } .service-slider .swiper-wrapper .service-slide { width: max-content; height: max-content; } .service-slider .swiper-wrapper .service-slide a:hover { color: inherit; } .service-slider._hide { display: none; } .service-slider._show { display: block; } @media (max-width: 1440px) { .service-slider { overflow: auto; } } .you-watch-slider .swiper-wrap { margin-bottom: -20px; margin-top: -20px; margin-left: -10px; margin-right: -10px; } .you-watch-slider .swiper-wrapper { padding: 20px 10px; } .you-watch-slider .swiper-wrapper .you-watch-slide { width: max-content !important; height: max-content; } @media (max-width: 1440px) { .you-watch-slider .swiper-wrap { margin-right: 0px; } .you-watch-slider .swiper-wrapper { padding-right: 0; } } .detail_swiper .swiper-wrapper .swiper-slide { display: flex; justify-content: center; } .detail_swiper .swiper-wrapper .swiper-slide .product-img { display: flex; justify-content: center; max-width: 500px; height: max-content; max-height: 500px; display: flex; justify-content: center; align-items: center; min-height: 500px; min-width: 500px; } .detail_swiper .swiper-wrapper .swiper-slide .product-img img { max-width: 100%; height: 100%; max-height: 500px; border-radius: 10px; object-fit: contain; } .detail_swiper .swiper-pagination { display: none; } .detail_swiper .swiper-button { display: none; } @media (max-width: 1199px) { .detail_swiper { height: 362px; } .detail_swiper .swiper-wrapper .swiper-slide .product-img { max-width: 320px; max-height: 320px; min-height: 320px; min-width: 320px; } .detail_swiper .swiper-wrapper .swiper-slide .product-img img { max-height: 320px; } .detail_swiper .swiper-pagination { display: flex; flex-wrap: wrap; } } .detail_swiper_thumbs { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; } .detail_swiper_thumbs .swiper-wrap { height: calc(100% - 56px); } .detail_swiper_thumbs .swiper-button-prev, .detail_swiper_thumbs .swiper-button-next { opacity: 1; padding: 4px; width: 28px; height: 28px; position: relative; filter: none; background-color: transparent; } .detail_swiper_thumbs .swiper-button-prev svg, .detail_swiper_thumbs .swiper-button-next svg { fill: var(--color-neutral-600); } .detail_swiper_thumbs .swiper-button-prev { left: 0; top: 0; } .detail_swiper_thumbs .swiper-button-next { right: 0; top: auto; bottom: -20px; } .detail_swiper_thumbs .swiper-button-next[aria-disabled=true], .detail_swiper_thumbs .swiper-button-prev[aria-disabled=true] { display: block; } .detail_swiper_thumbs .swiper-button-next[aria-disabled=true] svg, .detail_swiper_thumbs .swiper-button-prev[aria-disabled=true] svg { fill: var(--color-light-gray); } .detail_swiper_thumbs .swiper-wrapper { max-height: 440px; max-width: 110px; } .detail_swiper_thumbs .swiper-wrapper .swiper-slide { width: max-content; height: max-content; cursor: pointer; } .detail_swiper_thumbs .swiper-wrapper .swiper-slide .product-img { width: 100px; height: 100px; display: flex; justify-content: center; } .detail_swiper_thumbs .swiper-wrapper .swiper-slide .product-img img { width: max-content; max-width: 100px; height: auto; border-radius: 8px; } .detail_swiper_thumbs .swiper-wrapper .swiper-slide-thumb-active { border: 1px solid var(--color-light-gray); border-radius: 8px; } @media (max-width: 1199px) { .swiper .swiper-button-prev, .swiper .swiper-button-next { display: none; width: 36px; height: 36px; } .swiper .swiper-button-prev svg, .swiper .swiper-button-next svg { width: 24px; height: 24px; } } /*Стили Свайпер (swiper) END */ /* End */ /* Start:/local/templates/main/css/components/fancybox.css?17841810233468*/ /*Стили FancyBox */ .fancybox__backdrop { background-color: var(--color-white) !important; opacity: 1 !important; } .fancybox-button--zoom, .fancybox-button--play, .fancybox-button--thumbs { display: none !important; } .f-button { background-color: transparent !important; } .fancybox__footer { display: none !important; } .fancybox__slide { padding: 20px; } .f-thumbs__slide { width: 80px !important; height: 80px !important; } .f-thumbs__slide__button { max-width: 80px; max-height: 80px; min-width: 80px; min-height: 80px; display: grid; align-items: center; justify-content: center; align-content: center; justify-items: center; } .f-thumbs__slide__img { height: max-content !important; max-width: 80px; max-height: 80px; width: max-content !important; align-items: center; align-content: center; place-self: center; width: max-content; } .is-modern .f-thumbs__slide__button { clip-path: none !important; } .fancybox__toolbar__column.is-left { display: none; } .is-horizontal .fancybox__nav .f-button.is-prev, .is-horizontal .fancybox__nav .f-button.is-next { width: 60px; height: 60px; background-color: var(--color-white) !important; border-radius: 100%; transition: all var(--transition); filter: drop-shadow(0px 8px 16px rgba(30, 41, 59, 0.12)) drop-shadow(0px 2px 2px rgba(30, 41, 59, 0.04)); display: flex; justify-content: center; } .is-horizontal .fancybox__nav .f-button.is-prev::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38' height='38' viewBox='0 0 38 38' fill='none'%3E%3Cpath d='M12.7085 17.4372H31.7266V20.5622H12.7085L21.0897 28.9433L18.88 31.1529L6.72656 18.9997L18.88 6.84619L21.0897 9.05589L12.7085 17.4372Z' fill='%23475569' fill-opacity='0.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; position: relative; width: 36px; height: 36px; top: 0; bottom: 0; left: 0; right: 0; } .is-horizontal .fancybox__nav .f-button.is-prev svg { display: none; } .is-horizontal .fancybox__nav .f-button.is-next::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38' height='38' viewBox='0 0 38 38' fill='none'%3E%3Cpath d='M25.7447 17.4372L17.3634 9.05589L19.5731 6.84619L31.7266 18.9997L19.5731 31.1529L17.3634 28.9433L25.7447 20.5622H6.72656V17.4372H25.7447Z' fill='%23475569' fill-opacity='0.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; position: relative; width: 36px; height: 36px; top: 0; bottom: 0; left: 0; right: 0; } .is-horizontal .fancybox__nav .f-button.is-next svg { display: none; } button[data-fancybox-close=""]::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12.0007 10.5865L16.9504 5.63672L18.3646 7.05093L13.4149 12.0007L18.3646 16.9504L16.9504 18.3646L12.0007 13.4149L7.05093 18.3646L5.63672 16.9504L10.5865 12.0007L5.63672 7.05093L7.05093 5.63672L12.0007 10.5865Z' fill='%23B1B1B1'/%3E%3C/svg%3E"); background-repeat: no-repeat; width: 24px; height: 24px; content: ""; } button[data-fancybox-close=""] svg { display: none; } @media (max-width: 1199px) { .fancybox__footer { display: block !important; } .is-horizontal .fancybox__nav .f-button.is-prev, .is-horizontal .fancybox__nav .f-button.is-next { display: none; } } /*Стили FancyBox END */ /* End */ /* Start:/local/templates/main/css/components/modal.css?178418102319820*/ /*Стили модального окна (modal) */ .modal { position: fixed !important; left: 0 !important; top: 0 !important; bottom: 0; right: 0; width: 100% !important; height: 100%; overflow-y: auto !important; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 100; opacity: 0; -webkit-overflow-scrolling: touch; pointer-events: none; display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; transition: opacity var(--transition); } .modal .modal_bg { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 2; background: rgba(0, 0, 0, 0.5); opacity: 0; transition: opacity var(--transition); } .modal .modal_buttons { display: flex; justify-content: space-between; gap: 10px; } .modal .modal_buttons._end { justify-content: end; } .modal._active { opacity: 1; pointer-events: all; } .modal._active .modal_bg { opacity: 1; } .modal .modal_back { z-index: 1 !important; position: absolute !important; } .modal a._underline { text-decoration-line: underline; text-underline-offset: 4px; } .modal .validate_form { display: none; } .modal .validate_form._active { display: block; } .modal .modal_dialog { border-radius: 20px; background: var(--color-white); box-shadow: 0px 2px 2px -1px rgba(30, 41, 59, 0.04), 0px 16px 24px -4px rgba(30, 41, 59, 0.16); padding: 40px; display: flex; flex-direction: column; row-gap: 20px; overflow-y: auto; position: relative; z-index: 10000; font-size: 14px; max-height: 100%; } .modal .modal_dialog ._hide { display: none !important; } .modal .modal_dialog .modal_top { display: flex; align-items: center; padding-right: 32px; } .modal .modal_dialog span { font-weight: 200; } .modal .modal_dialog .modal-icon { cursor: pointer; display: flex; } .modal .modal_dialog .modal_close-icon { position: absolute; top: 15px; right: 15px; margin: 0; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; align-items: center; justify-content: center; z-index: 1; } .modal .modal_dialog .modal_close-icon svg { display: block; } .modal .modal_dialog .nav-arrow { margin-right: 20px; } .modal .modal_dialog .modal_title { display: flex; font-size: 24px; font-weight: 500; align-items: center; } .modal .modal_dialog .modal_title .success_title { color: var(--color-green-positive); } .modal .modal_dialog .modal_title .success_icon { display: flex; padding-right: 8px; } .modal .modal_dialog .modal_btn { padding: 11px 24px; box-shadow: 0px 1px 2px 0px rgba(30, 41, 59, 0.12); font-weight: 500; } .modal .modal_dialog .modal_form { display: flex; flex-direction: column; } .modal .modal_dialog .modal_form ._pass { font-weight: 400; line-height: 20px; } .modal .modal_dialog .modal_form .password_field { padding: 0 10px; } .modal .modal_dialog .modal_form .password_field .password_icon { padding-right: 0; } .modal .modal_dialog .modal_form .modal_nav { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; } .modal .modal_dialog .modal_form .modal_nav .personal-data-agreement { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 7px; color: var(--color-gray); font-weight: 300; line-height: 1.1; } .modal .modal_dialog .modal_form .modal_nav .personal-data-agreement .checkboxLabel { flex-shrink: 0; margin-top: 1px; } .modal .modal_dialog .modal_form .modal_nav .personal-data-agreement > span { flex: 1; min-width: 0; } .modal .modal_dialog .modal_form .modal_nav .personal-data-agreement a { color: var(--color-black); } .modal .modal_dialog .modal_form .modal_nav .personal-data-agreement a:hover { color: var(--color-red); } .modal .modal_dialog .forgot_password { color: var(--color-gray); font-weight: 200; line-height: 20px; cursor: pointer; } .modal .modal_dialog .forgot_password:hover { color: var(--color-red); } .modal .modal_dialog .modal_info { display: flex; flex-direction: column; row-gap: 10px; color: var(--color-black); font-weight: 300; line-height: 140%; font-size: 16px; } .modal .modal_dialog .product_content_top .product_name { font-size: 20px; font-weight: 500; } .modal .modal_dialog .product_content_top .article { color: var(--color-neutral-500); font-size: 12px; font-weight: 400; line-height: 18px; } .modal .modal_dialog .modal_product_container { display: flex; gap: 20px; justify-content: space-between; } .modal .modal_dialog .modal_product_container .product_img { display: flex; justify-content: center; align-items: center; max-width: 214px; max-height: 214px; width: 100%; } .modal .modal_dialog .modal_product_container .product_img img { height: max-content; max-width: 214px; max-height: 214px; border-radius: 10px; object-fit: cover; } .modal .modal_dialog .modal_product_container .product_info { display: flex; } .modal .modal_dialog .modal_product_container .product_img_content { display: flex; gap: 20px; } .modal .modal_dialog .modal_product_container .product_content { display: flex; flex-direction: column; gap: 20px; width: 100%; } .modal .modal_dialog .modal_product_container .product_content .product_price { display: flex; flex-direction: column; gap: 10px; } .modal .modal_dialog .modal_product_container .product_content .product_price .price { font-size: 20px; font-weight: 600; line-height: 120%; } .modal .modal_dialog .modal_product_container .product_content .product_price .old_price { font-size: 14px; font-style: normal; font-weight: 200; line-height: 120%; } .modal .modal_dialog .modal_product_container .product_content .product_price .old_price span { text-decoration: line-through; } .modal .modal_dialog .modal_product_container .product_nav { display: flex; flex-direction: column; row-gap: 20px; } .modal .modal_dialog .modal_product_container .product_nav .modal_buttons { flex-direction: column; gap: 10px; text-align: center; } .modal .modal_dialog .modal_product_container .product_nav .modal_buttons .modal_close-icon { position: relative; margin: 0; } .modal .modal_dialog .modal_product_container .product_nav .product_messages { font-size: 15px; font-weight: 300; line-height: 18px; } .modal .modal_dialog .modal-flex-col-40 { display: flex; flex-direction: column; gap: 40px; } .modal .modal_dialog .ask_question_product { display: flex; gap: 20px; margin-bottom: 20px; } .modal .modal_dialog .ask_question_product .product_img { width: 78px; display: flex; justify-content: center; } .modal .modal_dialog .ask_question_product .product_img img { height: 78px; width: max-content; max-width: 78px; border-radius: 20px; object-fit: contain; } .modal .modal_dialog .ask_question_product .product_content_top { display: flex; flex-direction: column; gap: 10px; } .modal .modal_dialog .ask_question_content ._textarea label { color: var(--color-text-black); font-size: 13px; font-weight: 400; line-height: 140%; } .modal .modal_dialog._sm { width: 100%; max-width: 400px; } .modal .modal_dialog._md { width: 100%; max-width: 500px; } .modal .modal_dialog._lg { width: 100%; max-width: 600px; row-gap: 40px; } .modal .modal_dialog._lg .modal_title { font-size: 30px; } .modal .modal_dialog._xl { width: 100%; max-width: 980px; row-gap: 40px; } .modal .modal_dialog._xl .modal_title { font-size: 30px; } @media (max-width: 1199px) { .modal .modal_buttons { flex-direction: column; } .modal .modal_dialog { max-width: 100% !important; height: 100%; border-radius: 0; padding: 20px 10px; } .modal .modal_dialog .modal-icon._hide { display: flex !important; pointer-events: all; visibility: visible; } .modal .modal_dialog ._hide { visibility: hidden; pointer-events: none; display: flex !important; } .modal .modal_dialog .modal_btn { padding: 11px 12px; } .modal .modal_dialog .modal_title { font-size: 18px !important; } .modal .modal_dialog .modal_top { display: flex; justify-content: space-between; position: relative; padding-bottom: 10px; border-bottom: 1px solid var(--color-light); } .modal .modal_dialog .modal_top .modal_close-icon { position: relative; margin: 0; top: 0; right: 0; } .modal .modal_dialog .sok_btn-primary-invert { width: 100%; } .modal .modal_dialog .modal_product_container { flex-direction: column; } .modal .modal_dialog .modal_product_container .product_img_content { gap: 10px; } .modal .modal_dialog .modal_product_container .product_img { max-height: 144px; max-width: 144px; } .modal .modal_dialog .modal_product_container .product_img img { height: max-content; max-width: 144px; max-height: 144px; } .modal .modal_dialog .modal_product_container .product_info { flex-direction: column; gap: 20px; } .modal .modal_dialog .ask_question_content .modal_buttons .sok_btn-primary { width: 100%; } .modal .modal_dialog._xl { row-gap: 20px; } } @media (max-width: 480px) { .modal .modal_dialog .modal_product_container .product_img { max-height: 78px; max-width: 78px; } .modal .modal_dialog .modal_product_container .product_img img { max-height: 78px; max-width: 78px; } } @media (max-width: 480px) { .modal .modal_dialog .modal_title { font-size: 14px !important; } } .fullsreen_modal_container.fullsreen_image_bg { background-size: cover; /* Заполнение по ширине */ background-color: #fff; /* Цвет фона */ } /* Используем псевдоэлемент для достижения эффекта contain по вертикали */ .fullsreen_side_menu_container::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; background: url(/local/templates/main/css/components/../../img/catalog_mob_menu.png) no-repeat bottom; background-size: 100%; z-index: -1; } .fullsreen_modal_container { display: flex; flex-direction: column; row-gap: 10px; width: 100%; height: 100%; background-color: var(--color-white); z-index: 1000; padding: 20px; min-width: 240px; left: -100%; transition: all var(--transition); overflow-y: auto; -webkit-overflow-scrolling: touch; } .fullsreen_modal_container .fullsreen-catalog-search { color: inherit; border: none; width: 100%; border-radius: 10px; padding: 0px 20px; transition: all var(--transition); background: var(--color-light); min-height: 32px; height: 32px; } .fullsreen_modal_container .fullsreen-catalog-search:focus { border: 1px solid var(--color-gray); background: var(--color-white); outline: none; } .fullsreen_modal_container .fullsreen-catalog-search::placeholder { border-radius: 999px; color: var(--color-neutral-500); font-size: 12px; line-height: 16px; font-weight: 300; } .fullsreen_modal_container .fullsreen_modal_close { cursor: pointer; -webkit-tap-highlight-color: transparent; } .fullsreen_modal_container .catalog_mobile_back._hide { display: none; } .fullsreen_modal_container .fullsreen_modal_top { display: flex; border-bottom: 1px solid var(--color-light); padding-bottom: 10px; } .fullsreen_modal_container .fullsreen_modal_top span._hide { display: none; } .fullsreen_modal_container .fullsreen_modal_top .fullsreen_modal_title { font-size: 20px; font-weight: 500; line-height: normal; } .fullsreen_modal_container .fullsreen_modal_top.search_top { align-items: center; gap: 10px; } .fullsreen_modal_container .fullsreen_modal_top.search_top .adaptive-back-btn { display: flex; align-items: center; cursor: pointer; } .fullsreen_modal_container .fullsreen_modal_top.catalog_top { align-items: center; justify-content: space-between; } .fullsreen_modal_container .fullsreen_modal_top.catalog_top span { width: 100%; text-align: center; } .fullsreen_modal_container .fullsreen_modal_top.catalog_top .catalog_mobile_back { cursor: pointer; } .fullsreen_modal_container .catalog-list { display: flex; flex-direction: column; row-gap: 10px; width: 100%; } .fullsreen_modal_container .catalog-list ._menu-item { border-radius: 10px; display: flex; justify-content: space-between; cursor: pointer; padding: 12px 16px; pointer-events: all; width: 100%; } .fullsreen_modal_container .catalog-list ._menu-item .item_title { max-width: 70vw; } .fullsreen_modal_container .catalog-list ._menu-item:hover { background-color: var(--color-light); } .fullsreen_modal_container .catalog-list ._menu-item a { width: 100%; } .fullsreen_modal_container .catalog-list ._menu-item a:hover { color: inherit; } .fullsreen_modal_container .catalog-list ._menu-submenu._active { display: flex; } .fullsreen_modal_container .catalog-list ._menu-submenu { display: none; flex-direction: column; row-gap: 10px; width: 100%; } .fullsreen_modal_container .fullsreen_catalog_content { display: flex; flex-direction: column; row-gap: 10px; } .fullsreen_modal_container .fullsreen_catalog_content .fullsreen-catalog-search._hide { display: none; } .fullsreen_modal_container .fullsreen_modal_top.side_menu_top { justify-content: space-between; } .fullsreen_modal_container .fullsreen_modal_top.side_menu_top .side-menu-logo svg { width: 114px; height: 24px; } .fullsreen_modal_container .fullsreen_side_menu_container { transition: var(--transition); transform: translateX(0px); height: 100%; } .fullsreen_modal_container .mobilemenu__menu-dropdown { padding: 20px; display: flex; flex-direction: column; gap: 10px; } .fullsreen_modal_container .fullsreen_side_menu_content .mobilemenu__menu-dropdown._active { display: flex; } .fullsreen_modal_container .fullsreen_side_menu_content .mobilemenu__menu-dropdown { left: 100%; top: 0; width: 100%; border: medium none; box-shadow: none; visibility: visible; opacity: 1; display: none; position: absolute; z-index: 5; margin: 0; height: 100%; } .fullsreen_modal_container .fullsreen_side_menu_content .mobilemenu__menu-dropdown::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; background: url(/local/templates/main/css/components/../../img/catalog_mob_menu.png) no-repeat bottom; background-size: 100%; z-index: -1; } .fullsreen_modal_container .fullsreen_side_menu_content { display: flex; flex-direction: column; row-gap: 10px; overflow-y: auto; width: 100%; -webkit-overflow-scrolling: touch; } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list { display: flex; flex-direction: column; padding-bottom: 10px; border-bottom: 1px solid var(--color-light); } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item { display: flex; align-items: center; gap: 10px; display: flex; justify-content: space-between; border-radius: 10px; width: 100%; color: var(--color-black); } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item .item-title { display: flex; gap: 6px; align-items: center; max-width: 90vw; } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item .item-title svg { margin: 0 !important; fill: var(--color-black); stroke: var(--color-black); } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item:hover { background-color: var(--color-light); } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item a { color: var(--color-black) !important; width: 100%; } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item a:hover { color: var(--color-black) !important; } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item .side-menu-top { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 18px; font-weight: 400; padding: 10px 4px; width: 100%; border-radius: 10px; cursor: pointer; pointer-events: all; } .fullsreen_modal_container .fullsreen_side_menu_content .side-menu-list .side-menu-item .side-menu-top svg { margin: 0 8px; } .fullsreen_modal_container .fullsreen_side_menu_content .footer-list { padding: 0 !important; color: var(--color-black) !important; } .fullsreen_modal_container .fullsreen_side_menu_content .footer-list .footer_phone { font-size: 16px !important; } .fullsreen_modal_container .fullsreen_side_menu_content .footer-list .footer_email { font-size: 14px; } .fullsreen_modal_container .fullsreen_side_menu_content .footer-list .footer_phone, .fullsreen_modal_container .fullsreen_side_menu_content .footer-list .footer_email { color: var(--color-gray) !important; } .fullsreen_modal_container .mobile_filter-menu { max-width: 100%; width: 100%; } .fullsreen_modal_container .mobile_filter-menu .mobile_filter-menu-content .catalog_filter_container { max-width: 100%; box-shadow: none; padding: 0; background: none; border-radius: 0; } .fullsreen_modal_container.side_menu { padding: 0; overflow-x: hidden !important; overflow-y: auto; -webkit-overflow-scrolling: touch; } .search-input { color: inherit; border: none; width: 100%; border-radius: 10px; padding: 0px 20px; transition: all var(--transition); background: var(--color-light); height: 30px; } .search-input::placeholder { color: var(--color-neutral-500); font-size: 12px; font-weight: 300; color: var(--colors-neutral-400, #94a3b8); line-height: 20px; } .search-result { display: flex; flex-direction: column; row-gap: 12px; } .search-result .mobile-result-item { display: flex; align-items: center; column-gap: 12px; color: inherit; border-radius: 10px; padding: 5px 10px; } .search-result .mobile-result-item:hover { background-color: var(--color-light); } .search-result .mobile-result-item .mobile-result-image { display: flex; align-items: center; column-gap: 12px; } .search-result .mobile-result-item .mobile-result-image img { width: 40px; height: 40px; object-fit: contain; } .search-result .mobile-result-item .result-name-prices { display: flex; flex-direction: column; row-gap: 10px; } .search-result .mobile-result-item .result-name-prices .result-name { font-size: 14px; font-weight: 200; transition: all var(--transition); } .search-result .mobile-result-item .result-name-prices .result-prices { display: flex; column-gap: 10px; } .search-result .mobile-result-item .result-name-prices .result-prices .result-price { font-size: 14px; font-weight: 400; white-space: nowrap; } .search-result .mobile-result-item .result-name-prices .result-prices .old-price { color: var(--color-light-gray); font-size: 12px; font-weight: 200; text-decoration: line-through; } .show-all-results { margin-top: 10px; border-radius: 10px; background: var(--color-light); box-shadow: 0px 1px 2px 0px rgba(30, 41, 59, 0.12); font-size: 14px; font-weight: 400; line-height: 20px; padding: 10px 0; cursor: pointer; text-align: center; transition: all var(--transition); } .show-all-results:hover { background: var(--color-red); color: var(--color-white); } @media (max-width: 1199px) { .fullsreen_modal_container { padding-left: 10px; padding-right: 10px; } .fullsreen_modal_container .mobilemenu__menu-dropdown { padding: 10px; padding-top: 20px; } } /* Стили модального окна (modal) END */ /* End */ /* Start:/local/templates/main/css/components/notifications.css?17841810233066*/ /*Стили уведомлений (избранное) */ .notification_container { position: fixed; top: 156px; display: flex; flex-direction: column; gap: 10px; z-index: 100000000; transition: all var(--transition); } .notification_container._fixed { top: 60px; } .notification.fade-out { opacity: 0 !important; /* Исчезает */ transform: translateY(-20px) !important; /* Смещение вверх */ } .notification.show { opacity: 1; /* Полная непрозрачность */ transform: translateY(0); /* Вернуться в начальное положение */ } .notification { user-select: none; opacity: 0; /* Начальная непрозрачность */ transform: translateY(-20px); /* Смещение вверх */ transition: opacity 0.5s ease, transform 0.5s ease; /* Плавный переход */ border-radius: var(--S, 20px); background: var(--color-white); box-shadow: 0px -5px 5.8px -1px rgba(30, 41, 59, 0.04), 0px 16px 24px -4px rgba(30, 41, 59, 0.16); width: 500px; position: relative; display: flex; gap: 10px; padding: 20px; } .notification .notification_img { display: flex; justify-content: center; max-width: 80px; max-height: 65px; width: 100%; height: 100%; } .notification .notification_img img { height: max-content; max-width: 80px; max-height: 65px; border-radius: 10px; } .notification .notification_icon { max-width: 40px; width: 100%; display: flex; align-items: center; } .notification .notification-content { display: flex; flex-direction: column; gap: 5px; width: 100%; } .notification .notification-content .notification-top { display: flex; align-items: center; justify-content: space-between; } .notification .notification-content .notification-top .notification-title { color: var(--color-black); font-size: 16px; font-weight: 500; } .notification .notification-content .notification-text { color: var(--color-black); font-size: 14px; font-weight: 300; line-height: 140%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; } .notification .notification-content .notification-close { cursor: pointer; } .notification.center { align-items: center; } @media (max-width: 1199px) { .notification { width: 440px; } } @media (max-width: 1199px) { .notification_container { top: 60px; } .notification { width: 400px; } .notification .notification-content .notification-top .notification-title { font-size: 14px; } .notification .notification-content .notification-text { font-size: 12px; } } @media (max-width: 480px) { .notification { height: max-content; width: 310px; padding: 16px; } .notification .notification_img { width: 60px; } .notification .notification_img img { height: 60px; max-width: 60px; } .notification .notification-content { gap: 5px; } } /*Стили уведомлений (избранное) END */ /* End */ /* Start:/local/templates/main/css/components/dropdown.css?17841810142257*/ .dropdown { position: relative; } .dropdown .dropdown_show { display: flex; align-items: center; } .dropdown .dropdown_show svg { transition: all var(--transition); fill: var(--color-black); stroke: var(--color-black); } .dropdown .dropdown_content { display: flex; position: absolute; z-index: 1000; border-radius: 10px; background: var(--color-white); box-shadow: 0px 2px 2px -1px rgba(30, 41, 59, 0.04), 0px 16px 24px -4px rgba(30, 41, 59, 0.16); padding: 16px; flex-direction: column; row-gap: 10px; width: 250px; visibility: hidden; } .dropdown .dropdown_content li { color: var(--color-gray); font-size: 14px; line-height: 20px; white-space: normal; } .dropdown .dropdown_content li a { display: flex; align-items: center; gap: 6px; } .dropdown .dropdown_content:hover { visibility: visible; } .dropdown:hover .dropdown_show svg:not(.no-rotate) { transform: rotate(180deg); fill: var(--color-red); stroke: var(--color-red); } .dropdown:hover .dropdown_show { color: var(--color-red); } .dropdown._active .dropdown_content { visibility: visible; } .dropdown_click { position: relative; cursor: pointer; } .dropdown_click .dropdown_click_show { display: flex; align-items: center; gap: 4px; cursor: pointer; } .dropdown_click .dropdown_click_show svg { transition: all var(--transition); fill: var(--color-black); stroke: var(--color-black); } .dropdown_click .dropdown_click_content { display: none; position: absolute; z-index: 1000; border-radius: 10px; background: var(--color-white); box-shadow: 0px 2px 2px -1px rgba(30, 41, 59, 0.04), 0px 16px 24px -4px rgba(30, 41, 59, 0.16); padding: 16px; flex-direction: column; row-gap: 10px; width: 250px; top: 100%; cursor: auto; } .dropdown_click .dropdown_click_content li { font-size: 14px; line-height: 20px; width: 100%; font-weight: 400; list-style: none; cursor: pointer; } .dropdown_click .dropdown_click_content li a { color: var(--color-gray); } .dropdown_click .dropdown_click_content li:hover { color: var(--color-black); } .dropdown_click._active .dropdown_click_show { color: var(--color-red); } .dropdown_click._active .dropdown_click_content { display: flex; } /* End */ /* Start:/local/templates/main/css/components/misc.css?17878254608311*/ .breadcrumbs { display: flex; align-items: center; column-gap: 12px; row-gap: 6px; padding: 24px 0; color: var(--color-gray); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; } .breadcrumbs::-webkit-scrollbar { display: none; } .breadcrumbs .breadcrumbs__item { font-size: 14px; font-weight: 200; line-height: 20px; white-space: nowrap; } @media (max-width: 1199px) { .breadcrumbs { padding: 12px 0; margin-bottom: 10px; } } .btn-loader.disabled, [data-save-button=true][blocked=true] { background-color: var(--color-default-hover); pointer-events: none; } .btn-loader.disabled span, [data-save-button=true][blocked=true] span { position: relative; line-height: 20px; } .btn-loader.disabled span::after, [data-save-button=true][blocked=true] span::after { content: ""; display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='82' height='82' viewBox='0 0 82 82' fill='none'%3E%3Cpath d='M41.0006 6.8335C42.8877 6.8335 44.4173 8.36321 44.4173 10.2502V20.5002C44.4173 22.3871 42.8877 23.9168 41.0006 23.9168C39.1136 23.9168 37.584 22.3871 37.584 20.5002V10.2502C37.584 8.36321 39.1136 6.8335 41.0006 6.8335ZM41.0006 58.0835C42.8877 58.0835 44.4173 59.6131 44.4173 61.5002V71.7502C44.4173 73.6372 42.8877 75.1668 41.0006 75.1668C39.1136 75.1668 37.584 73.6372 37.584 71.7502V61.5002C37.584 59.6131 39.1136 58.0835 41.0006 58.0835ZM75.1673 41.0002C75.1673 42.8872 73.6377 44.4168 71.7506 44.4168H61.5006C59.6136 44.4168 58.084 42.8872 58.084 41.0002C58.084 39.1131 59.6136 37.5835 61.5006 37.5835H71.7506C73.6377 37.5835 75.1673 39.1131 75.1673 41.0002ZM23.9173 41.0002C23.9173 42.8872 22.3876 44.4168 20.5007 44.4168H10.2507C8.36369 44.4168 6.83398 42.8872 6.83398 41.0002C6.83398 39.1131 8.36369 37.5835 10.2507 37.5835H20.5007C22.3876 37.5835 23.9173 39.1131 23.9173 41.0002ZM65.1602 65.1598C63.8257 66.494 61.6626 66.494 60.3284 65.1598L53.0803 57.9116C51.7461 56.5774 51.7461 54.4143 53.0803 53.0798C54.4148 51.7456 56.5779 51.7456 57.9121 53.0798L65.1602 60.3279C66.4944 61.6621 66.4944 63.8252 65.1602 65.1598ZM28.9209 28.9204C27.5866 30.2547 25.4233 30.2547 24.089 28.9204L16.8412 21.6726C15.5069 20.3383 15.5069 18.175 16.8412 16.8407C18.1755 15.5064 20.3388 15.5064 21.6731 16.8407L28.9209 24.0885C30.2552 25.4228 30.2552 27.5861 28.9209 28.9204ZM16.8412 65.1598C15.5069 63.8252 15.5069 61.6621 16.8412 60.3279L24.089 53.0798C25.4233 51.7456 27.5866 51.7456 28.9209 53.0798C30.2552 54.4143 30.2552 56.5774 28.9209 57.9116L21.6731 65.1598C20.3388 66.494 18.1755 66.494 16.8412 65.1598ZM53.0803 28.9204C51.7461 27.5861 51.7461 25.4228 53.0803 24.0885L60.3284 16.8407C61.6626 15.5064 63.8257 15.5064 65.1602 16.8407C66.4944 18.175 66.4944 20.3383 65.1602 21.6726L57.9121 28.9204C56.5779 30.2547 54.4148 30.2547 53.0803 28.9204Z' fill='%23fff'/%3E%3C/svg%3E"); background-position-x: center; background-size: initial; background-repeat: no-repeat; background-attachment: initial; background-origin: initial; background-clip: initial; position: absolute; z-index: 2; right: -34px; bottom: 0; width: 20px; height: 20px; background-size: 100%; animation: 1.2s linear 0s normal none infinite running rot; -webkit-animation: 1.2s linear 0s normal none infinite running rot; user-select: none; } @keyframes rot { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .btn_show_more { border-radius: 10px; background-color: var(--color-light); color: var(--color-black); font-size: 14px; font-weight: 400; line-height: 20px; padding: 10px 24px; cursor: pointer; width: 100%; transition: all var(--transition); position: relative; display: flex; justify-content: center; align-items: center; transition: all var(--transition); } .btn_show_more:hover { background-color: var(--color-light-gray); } .btn_show_more.disabled span { color: var(--color-light-gray); position: relative; } .btn_show_more.disabled span::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='82' height='82' viewBox='0 0 82 82' fill='none'%3E%3Cpath d='M41.0006 6.8335C42.8877 6.8335 44.4173 8.36321 44.4173 10.2502V20.5002C44.4173 22.3871 42.8877 23.9168 41.0006 23.9168C39.1136 23.9168 37.584 22.3871 37.584 20.5002V10.2502C37.584 8.36321 39.1136 6.8335 41.0006 6.8335ZM41.0006 58.0835C42.8877 58.0835 44.4173 59.6131 44.4173 61.5002V71.7502C44.4173 73.6372 42.8877 75.1668 41.0006 75.1668C39.1136 75.1668 37.584 73.6372 37.584 71.7502V61.5002C37.584 59.6131 39.1136 58.0835 41.0006 58.0835ZM75.1673 41.0002C75.1673 42.8872 73.6377 44.4168 71.7506 44.4168H61.5006C59.6136 44.4168 58.084 42.8872 58.084 41.0002C58.084 39.1131 59.6136 37.5835 61.5006 37.5835H71.7506C73.6377 37.5835 75.1673 39.1131 75.1673 41.0002ZM23.9173 41.0002C23.9173 42.8872 22.3876 44.4168 20.5007 44.4168H10.2507C8.36369 44.4168 6.83398 42.8872 6.83398 41.0002C6.83398 39.1131 8.36369 37.5835 10.2507 37.5835H20.5007C22.3876 37.5835 23.9173 39.1131 23.9173 41.0002ZM65.1602 65.1598C63.8257 66.494 61.6626 66.494 60.3284 65.1598L53.0803 57.9116C51.7461 56.5774 51.7461 54.4143 53.0803 53.0798C54.4148 51.7456 56.5779 51.7456 57.9121 53.0798L65.1602 60.3279C66.4944 61.6621 66.4944 63.8252 65.1602 65.1598ZM28.9209 28.9204C27.5866 30.2547 25.4233 30.2547 24.089 28.9204L16.8412 21.6726C15.5069 20.3383 15.5069 18.175 16.8412 16.8407C18.1755 15.5064 20.3388 15.5064 21.6731 16.8407L28.9209 24.0885C30.2552 25.4228 30.2552 27.5861 28.9209 28.9204ZM16.8412 65.1598C15.5069 63.8252 15.5069 61.6621 16.8412 60.3279L24.089 53.0798C25.4233 51.7456 27.5866 51.7456 28.9209 53.0798C30.2552 54.4143 30.2552 56.5774 28.9209 57.9116L21.6731 65.1598C20.3388 66.494 18.1755 66.494 16.8412 65.1598ZM53.0803 28.9204C51.7461 27.5861 51.7461 25.4228 53.0803 24.0885L60.3284 16.8407C61.6626 15.5064 63.8257 15.5064 65.1602 16.8407C66.4944 18.175 66.4944 20.3383 65.1602 21.6726L57.9121 28.9204C56.5779 30.2547 54.4148 30.2547 53.0803 28.9204Z' fill='%23B1B1B1'/%3E%3C/svg%3E"); } .content-nav { display: flex; flex-direction: column; row-gap: 40px; align-items: center; margin-top: 20px; row-gap: 20px; margin-bottom: 40px; } .content-nav .pagination { display: flex; align-items: center; justify-content: center; column-gap: 10px; } .content-nav .pagination .pagination__prev, .content-nav .pagination .pagination__next { height: max-content; display: flex; } .content-nav .pagination .pagination__prev svg use, .content-nav .pagination .pagination__next svg use { stroke: var(--color-gray); } .content-nav .pagination .pagination__prev._disable, .content-nav .pagination .pagination__next._disable { pointer-events: none; } .content-nav .pagination .pagination__prev._disable svg use, .content-nav .pagination .pagination__next._disable svg use { stroke: var(--color-light); } .content-nav .pagination .pagination__btn { color: var(--color-gray); font-size: 14px; font-weight: 400; line-height: 20px; padding: 2px 8px; } .content-nav .pagination .pagination__btn:hover { border-radius: 10px; background: var(--color-light); } .content-nav .pagination .pagination__btn._active { background: var(--color-gray); color: var(--color-white); border-radius: 10px; } @media (max-width: 1199px) { .content-nav { row-gap: 20px; } } /* Копирование текста в буфер — .sok-copy-text, .sok-copy-text__btn */ .sok-copy-text { display: inline-flex; align-items: center; gap: 3px; } .sok-copy-text::after { content: ''; width: 16px; height: 16px; flex-shrink: 0; background-color: currentColor; mask: url('/local/templates/main/css/components/../../img/icons/icon-file-copy.svg') center / contain no-repeat; -webkit-mask: url('/local/templates/main/css/components/../../img/icons/icon-file-copy.svg') center / contain no-repeat; } .sok-copy-text__btn { display: inline-flex; flex-shrink: 0; width: 16px; height: 16px; padding: 0; border: 0; background-color: currentColor; cursor: pointer; mask: url('/local/templates/main/css/components/../../img/icons/icon-file-copy.svg') center / contain no-repeat; -webkit-mask: url('/local/templates/main/css/components/../../img/icons/icon-file-copy.svg') center / contain no-repeat; } .footer-list__copy-row { display: inline-flex; align-items: center; gap: 5px; } /* End */ /* Start:/local/templates/main/css/components/home.css?1787648187553*/ /* Ruslava — главная (классы sok / base) * Hero-слайдер: bx/news.list/main_slider/style.css * Каталог (карусель): bx/catalog.section.list/carousel/style.css * О компании: bx/news.list/advantages/style.css * Узкий баннер: bx/news.detail/narrow_banner/style.css * Популярные товары: bx/catalog.section/carousel/style.css + bx/catalog.item/card/style.css * Услуги: bx/news.list/service_carousel/style.css * Партнёры: bx/news.list/partners_carousel/style.css */ /* End */ /* Start:/local/templates/main/css/components/catalog-list.css?178418102331111*/ /*Стили страниц каталога */ .catalog-menu-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(233px, 1fr)); grid-auto-flow: dense; flex-wrap: wrap; gap: 20px; margin-bottom: 60px; } .catalog-menu-list .catalog_menu-card { width: 100%; } .catalog-list__grid_container .catalog-list__grid { display: grid; grid-template-columns: 360px auto; gap: 20px; transition: all var(--transition); } .catalog-list__grid_container .catalog-list__grid .catalog_filter_container .dropdown_click { cursor: auto; } .catalog-list__grid_container .catalog-list__grid .catalog_filter_container .dropdown_click .dropdown_click_show { cursor: auto; } .catalog-list__grid_container .catalog-list__grid .catalog_categories_container .catalog_categories { border-radius: 20px; background: var(--color-white); box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); padding: 20px; display: flex; flex-direction: column; gap: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog_categories_container .catalog_categories .categories_list { display: flex; flex-direction: column; gap: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog_categories_container .catalog_categories .categories_list .category_item { display: flex; justify-content: space-between; align-items: center; font-size: 16px; font-weight: 200; } .catalog-list__grid_container .catalog-list__grid .catalog_categories_container .catalog_categories .categories_list .categories_title { display: flex; justify-content: space-between; align-items: center; font-size: 16px; font-weight: 600; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu { display: flex; flex-direction: column; row-gap: 40px; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections { display: flex; flex-direction: column; gap: 7px; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_title { color: var(--color-gray-title); font-size: 20px; font-weight: 500; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list { display: flex; flex-direction: column; gap: 7px; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list .section_item { color: var(--color-full-black); font-size: 16px; font-weight: 300; line-height: 20px; padding: 10px 20px; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list .section_item:hover { color: var(--color-red); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content { display: grid; grid-template-rows: max-content; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container { display: none; overflow: hidden; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container .catalog_categories { width: 100%; /* Или любое другое значение/максимальная ширина */ box-shadow: none; background: transparent; padding: 0; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container .catalog_categories .categories_list { display: flex; overflow: hidden; overflow-x: auto; flex-direction: row; gap: 12px; /* Стилизация скроллбара */ padding-bottom: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container .catalog_categories .categories_list::-webkit-scrollbar { transition: all var(--transition); height: 8px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container .catalog_categories .categories_list::-webkit-scrollbar-track { transition: all var(--transition); min-height: 8px; background-color: var(--color-scrollbar); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container .catalog_categories .categories_list::-webkit-scrollbar-thumb { transition: all var(--transition); border-radius: 10px; background-clip: content-box; background-color: var(--color-bg-slider); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container .catalog_categories .categories_list .category_item._active { border-radius: 40px; background-color: var(--color-light); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container .catalog_categories .categories_list .category_item { display: flex; white-space: nowrap; padding: 8px 10px; gap: 8px; font-size: 14px; font-weight: 400; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top._end { justify-content: end !important; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top { display: flex; justify-content: end; gap: 10px; column-gap: 20px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .btn_top { height: 100%; display: flex; align-items: center; border-radius: 10px; border: 1px solid var(--color-light-gray); cursor: pointer; padding: 8px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons { display: none; gap: 10px; align-items: center; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons .top_filter-btn { display: flex; gap: 10px; align-items: center; cursor: pointer; height: 100%; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons .top_filter-btn .top_filter-icon { position: relative; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons .top_filter-btn .top_filter-icon .top_filter-count._show { display: flex; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons .top_filter-btn .top_filter-icon .top_filter-count { position: absolute; border-radius: 20px; background: var(--color-red); width: 16px; height: 16px; display: none; flex-direction: column; color: var(--color-white); font-size: 10px; font-weight: 400; align-items: center; justify-content: center; top: -6px; right: -6px; user-select: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons .top_filter-btn .top_filter_text { color: var(--color-gray); font-size: 14px; font-weight: 400; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons._show { display: flex; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort._space { width: 100%; justify-content: space-between; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort { display: flex; gap: 10px; align-items: center; max-height: 40px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .btn_top { opacity: 0.4; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .btn_top._active { opacity: 1; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .buttons_grid_menu { display: flex; gap: 6px; align-items: center; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click { opacity: 1; max-height: 40px; border: 1px solid var(--color-light); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_show { padding: 6px 0; padding-left: 14px; padding-right: 4px; color: var(--color-gray); font-size: 14px; font-weight: 500; line-height: 20px; white-space: nowrap; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_show svg { fill: var(--color-gray); stroke: var(--color-gray); margin: 8px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_content { margin-top: 15px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_content li a:hover { color: var(--color-black); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click._active .dropdown_click_show svg { rotate: 180deg; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter { flex-direction: row; flex-wrap: wrap; gap: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params { display: flex; flex-wrap: wrap; gap: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param { border: none; padding: 0; flex-direction: row; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .catalog-filter-popup_result { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .btn_top { border: 1px solid var(--color-light); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .input-wrapper { font-size: 14px; font-weight: 400; color: #010117; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .filter-param-title { color: var(--color-gray) !important; font-size: 14px !important; font-weight: 500 !important; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .form-checkbox input, .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .form-checkbox label { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .form-checkbox .delete_filter { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .form-checkbox { padding: 6px 14px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .dropdown_click { padding: 6px 14px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .dropdown_click .dropdown_click_content { left: 0; margin-top: 15px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .dropdown_click._active { border: 1px solid var(--color-light); background-color: transparent; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .filter-param-title-flex { display: flex; gap: 4px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .filter-param-title-flex .filter_arrow_down { display: flex; padding-left: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .filter-param-title-flex .filter_arrow_down svg { fill: var(--color-gray); stroke: var(--color-gray); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param .delete_filter { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select { background-color: var(--color-red); color: var(--color-white); border-radius: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .form-checkbox { border: none; flex-direction: row; padding: 0; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .form-checkbox .input-wrapper { padding-left: 14px; padding-right: 10px; color: var(--color-white); } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .dropdown_click { border: none; padding: 0; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .dropdown_click .dropdown_click_show { height: 100%; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .dropdown_click .dropdown_click_show .filter-param-title-flex { height: 100%; align-items: center; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .dropdown_click .dropdown_click_show .filter-param-title-flex .filter-param-title { padding-right: 10px; color: var(--color-white) !important; padding-left: 14px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .dropdown_click .dropdown_click_show .filter-param-title-flex .filter-param-title .filter_arrow_down { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .delete_filter { display: flex; height: 100%; align-items: center; border-left: 1px solid var(--color-hover-red); padding-left: 10px; padding-right: 14px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .delete_filter svg { fill: var(--color-white) !important; stroke: var(--color-white) !important; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-params .catalog-filter-param._select .filter_arrow_down { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-bottom { flex-direction: row; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .catalog_filter-simple .catalog_filter .catalog-filter-bottom .sok_btn-primary { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top._space { justify-content: space-between; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view { display: flex; flex-direction: column; row-gap: 40px; position: relative; margin-top: 20px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items { display: grid; grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); gap: 20px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items .sok_card_product { width: 100%; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items .sok_card_product .product-img img { max-width: 100%; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items._hide { display: none !important; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items._list { display: flex; flex-direction: column; } .catalog-list__grid_container .catalog-list__grid._auto { grid-template-columns: auto; } .catalog_filter_container { border-radius: 20px; background: var(--color-white); box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); max-width: 360px; width: 100%; padding: 20px; height: max-content; } .catalog_filter_container .catalog-filter-params .catalog-filter-popup_result._hide { display: none; } .catalog_filter_container .catalog-filter-params .catalog-filter-popup_result { position: absolute; right: -140px; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; fill: var(--color-white); z-index: 10; filter: drop-shadow(0px 0px 8px rgba(30, 41, 59, 0.12)) drop-shadow(0px 0px 2px rgba(30, 41, 59, 0.04)); } .catalog_filter_container .catalog-filter-params .catalog-filter-popup_result::before { content: ""; display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='168' height='106' viewBox='0 0 168 106' fill='none'%3E%3Cg filter='url(%23filter0_dd_2212_32433)'%3E%3Cpath d='M18.9226 17C18.9226 11.4772 23.3997 7 28.9226 7H151C156.523 7 161 11.4772 161 17V89C161 94.5229 156.523 99 151 99H28.9226C23.3997 99 18.9226 94.5228 18.9226 89V76V68.7482C18.9226 66.0335 17.8189 63.4354 15.8649 61.5507L7.7462 53.7197C7.33851 53.3265 7.33851 52.6735 7.7462 52.2803L15.8649 44.4493C17.8189 42.5646 18.9226 39.9665 18.9226 37.2518V30V17Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_dd_2212_32433' x='0.44043' y='0' width='167.56' height='106' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeMorphology radius='1' operator='erode' in='SourceAlpha' result='effect1_dropShadow_2212_32433'/%3E%3CfeOffset/%3E%3CfeGaussianBlur stdDeviation='4'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.117647 0 0 0 0 0.160784 0 0 0 0 0.231373 0 0 0 0.12 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_2212_32433'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeMorphology radius='1' operator='dilate' in='SourceAlpha' result='effect2_dropShadow_2212_32433'/%3E%3CfeOffset/%3E%3CfeGaussianBlur stdDeviation='1'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.117647 0 0 0 0 0.160784 0 0 0 0 0.231373 0 0 0 0.04 0'/%3E%3CfeBlend mode='normal' in2='effect1_dropShadow_2212_32433' result='effect2_dropShadow_2212_32433'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect2_dropShadow_2212_32433' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E"); width: 168px; height: 106px; } .catalog_filter_container .catalog-filter-params .catalog-filter-popup_result .catalog-filter-popup_result-content { position: absolute; padding-right: 20px; padding-left: 32px; display: flex; flex-direction: column; gap: 8px; } .catalog_filter_container .catalog-filter-params .catalog-filter-popup_result .catalog-filter-popup_result-content .catalog-filter_result-text { color: var(--color-gray); font-size: 14px; font-weight: 300; line-height: 130%; } .catalog_filter_container .catalog-filter-params .catalog-filter-param { position: relative; } .catalog_filter_container .catalog-filter-params .catalog-filter-param._price .dropdown_click { row-gap: 24px; } .catalog_filter_container .delete_filter { display: none; } .catalog_filter_container .dropdown_click { display: flex; flex-direction: column; row-gap: 12px; } .catalog_filter_container .dropdown_click .dropdown_click_show .filter-param-title-flex .filter-param-title { color: var(--color-text-black); font-size: 16px; font-weight: 600; line-height: 140%; word-break: break-word; } .catalog_filter_container .dropdown_click .dropdown_click_content { display: block; position: relative; border-radius: 0; box-shadow: none; background: none; width: 100%; padding: 0; z-index: 0; } .catalog_filter_container .filter_arrow_down { display: none; } .catalog_filter { display: flex; flex-direction: column; } .catalog_filter .input-wrapper { display: flex; gap: 7px; color: #010117; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; cursor: pointer; width: max-content; } .catalog_filter .catalog-filter-params .catalog-filter-param { display: flex; flex-direction: column; row-gap: 12px; padding-top: 30px; padding-bottom: 30px; border-bottom: 1px solid var(--color-light); } .catalog_filter .catalog-filter-params .catalog-filter-param .btn_top { justify-content: center; } .catalog_filter .catalog-filter-params .catalog-filter-param .catalog-flex-title { display: flex; justify-content: space-between; align-items: center; width: 100%; } .catalog_filter .catalog-filter-params .catalog-filter-param .catalog-flex-title .filter-param-title { color: var(--color-text-black); font-size: 16px; font-weight: 600; line-height: 140%; } .catalog_filter .catalog-filter-params .catalog-filter-param .catalog-flex-title .side-close { display: none; } .catalog_filter .catalog-filter-params .catalog-filter-param .catalog-flex-title .side-close._show { display: block; } .catalog_filter .catalog-filter-params .catalog-filter-param .filter-list { display: flex; flex-direction: column; row-gap: 12px; } .catalog_filter .catalog-filter-params .catalog-filter-param .filter-list .input-wrapper { display: flex; align-items: flex-start; width: 100%; max-width: 100%; } .catalog_filter .catalog-filter-params .catalog-filter-param .filter-list .filter-prices { display: flex; align-items: center; justify-content: space-between; } .catalog_filter .catalog-filter-params .catalog-filter-param .filter-list .filter-prices .filter-price { font-size: 14px; font-weight: 300; line-height: 20px; border: 1px solid var(--color-light-gray); background-color: var(--color-white); } .catalog_filter .catalog-filter-params .catalog-filter-param .filter-list .filter-prices .filter-price:focus { border: 1px solid var(--color-black); } .catalog_filter .catalog-filter-params .catalog-filter-param .filter-list .filter-prices .filter-price::placeholder { font-size: 14px; font-weight: 300; line-height: 20px; color: var(--color-light-gray); } .catalog_filter .catalog-filter-params .catalog-filter-param .filter-list .filter-prices .prices_separator { user-select: none; color: var(--color-light-gray); font-size: 14px; font-weight: 300; line-height: 20px; } .catalog_filter .catalog-filter-params .catalog-filter-param:first-child { padding-top: 0px; } .catalog_filter .catalog-filter-params .catalog-filter-param:last-child { border: none; } .catalog_filter .catalog-filter-params .catalog-filter-param._price .filter-list { row-gap: 24px; } .catalog_filter .catalog-filter-bottom { display: flex; flex-direction: column; gap: 10px; } .catalog_filter .catalog-filter-bottom button { font-weight: 400; line-height: 20px; padding: 10px 24px; } .price-slider-container * { box-sizing: border-box; outline: none; } .price-slider-container:after { content: ""; clear: both; display: table; } .price-slider-container .ui-slider { position: relative; background: var(--color-bg-slider); height: 8px; border-radius: 999px; } .price-slider-container .ui-slider .ui-slider-handle { position: absolute; width: 16px; height: 16px; cursor: pointer; border-radius: 50%; background: var(--color-red); z-index: 2; top: -4px; margin-left: -5px; } .price-slider-container .ui-slider .ui-slider-handle:hover, .price-slider-container .ui-slider .ui-slider-handle:focus { transform: scale(1.2); } .polzunok-input-5-right { float: right; } .price-slider-container .ui-slider .ui-slider-range { position: absolute; z-index: 1; height: 8px; border: 0; background: var(--color-red); border-radius: 10px; box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.3), 1px 1px 5px rgb(255, 255, 255); } @media (max-width: 1280px) { .catalog-list__grid_container .catalog-list__grid { grid-template-columns: 300px auto; } } @media (max-width: 1199px) { .catalog_filter-simple { display: none; } .catalog-list__grid_container .catalog-list__grid { grid-template-columns: auto; } .catalog-list__grid_container .catalog-list__grid .catalog_categories_container { display: none; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_title { font-size: 16px; font-weight: 400; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list .section_item { padding: 8px 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog_categories_container { display: block; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top { justify-content: space-between; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons { display: flex; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items { grid-template-columns: repeat(auto-fill, minmax(185px, 1fr)); } .catalog-list__grid_container .catalog-list__grid .catalog_filter_container { display: none; } .catalog-menu-list { margin-bottom: 20px; } } @media (max-width: 1199px) { .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections { gap: 6px; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list { gap: 6px; } .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list .section_item { padding: 4px 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top { column-gap: 10px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filer_buttons button { width: 100%; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort { max-height: 32px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_show { font-size: 12px; flex: 1 0 0; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_show span { max-width: 80px; overflow: hidden; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_show svg { margin: 8px 4px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .dropdown_click .dropdown_click_content { width: 200px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top .top_filter_sort .btn_top { padding: 4px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view { row-gap: 20px; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items { grid-template-columns: repeat(2, 1fr); gap: 10px; } .catalog-menu-list { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 10px; } .catalog-menu-list .catalog_menu-card { height: 154px; padding: 14px; row-gap: 0 !important; } .catalog-menu-list .catalog_menu-card .catalog_menu-card-img { /* max-width: 116px; max-height: 100px; */ } .catalog-menu-list .catalog_menu-card .catalog_menu-card-img img { max-width: 100%; max-height: 100%; } .catalog-menu-list .catalog_menu-card span { font-size: 14px; min-height: 32px; } } @media (max-width: 480px) { .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__top { flex-direction: column; } .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items { grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)); } .catalog-menu-list { grid-template-columns: repeat(2, 1fr); } .catalog-menu-list .catalog_menu-card { width: 100%; height: 100%; padding: 14px; row-gap: 10px; } .catalog-menu-list .catalog_menu-card img { max-width: 90px; } } /* End */ /* Start:/local/templates/main/css/components/catalog-detail.css?178418102340333*/ .product-container .catalog-detail .catalog-detail__item { display: flex; flex-direction: column; gap: 40px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info { display: flex; row-gap: 30px; gap: 40px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container { display: flex; gap: 20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-main { max-width: 500px; max-height: 500px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-main .swiper-slide { max-width: 500px; max-height: 500px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-main .swiper-slide { cursor: zoom-in; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-thumbs._hide { display: none; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-thumbs { display: flex; align-items: center; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info-price_cart { display: flex; gap: 40px; width: 100%; justify-content: end; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info { display: flex; flex-direction: column; gap: 20px; width: 100%; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-description { font-size: 16px; font-weight: 200; line-height: 130%; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews { display: flex; gap: 20px; flex-wrap: wrap; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews .article-stars { display: flex; align-items: center; gap: 20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews .article-stars .article { display: flex; align-items: center; column-gap: 5px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews .article-stars .article .article-name { color: var(--color-mid-grey-text); font-size: 16px; font-weight: 200; line-height: 18px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews .article-stars .article .article-value { font-size: 16px; font-weight: 200; line-height: 18px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews .article-stars .stars { display: flex; justify-content: space-between; column-gap: 2px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews .article-stars .stars .grade { color: var(--color-text); font-size: 16px; font-weight: 400; line-height: 18px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-top .article-stars-reviews .reviews_count { white-space: nowrap; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-in-stock .in-stock { font-size: 16px; font-weight: 300; line-height: 100%; padding: 7px 20px; border-radius: 10px; background: var(--color-bg-green-positive-secondary); color: var(--color-green-positive-secondary); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-in-stock .in-sale { font-size: 16px; font-weight: 300; line-height: 100%; padding: 7px 20px; border-radius: 10px; background: var(--color-status-blue); color: var(--color-white); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-in-stock .waiting { font-size: 16px; font-weight: 300; line-height: 100%; display: flex; gap: 10px; align-items: center; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-in-stock .waiting .waiting-btn { padding: 7px 20px; border-radius: 10px; background: var(--color-light-gray); color: var(--color-white); font-weight: 300; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-in-stock .waiting .waiting-date { padding: 7px 20px; border-radius: 10px; color: var(--color-gray); font-weight: 300; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-all-features { color: var(--color-gray); font-size: 16px; font-weight: 300; line-height: 18px; display: flex; gap: 10px; align-items: center; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-all-features svg { fill: var(--color-gray); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features { display: flex; flex-direction: column; gap: 10px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature { display: flex; gap: 10px; flex-wrap: wrap; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature .feature_name { color: var(--color-mid-grey-text); font-size: 16px; font-weight: 300; line-height: 21px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature .feature_value { font-size: 16px; font-style: normal; font-weight: 200; line-height: 21px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product-manufacture { display: flex; flex-direction: column; gap: 10px; max-width: 327px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product-manufacture:hover { cursor: pointer; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product-manufacture .product-manufacture-brand { display: flex; justify-content: space-between; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product-manufacture .product-manufacture-brand .manufacture-brand-content { display: flex; flex-direction: column; gap: 10px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product-manufacture .product-manufacture-brand .manufacture-brand-content span { color: var(--color-full-black); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product-manufacture .product-manufacture-brand .manufacture-brand-content a { color: var(--color-mid-grey-text); font-weight: 200; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product-manufacture .product-manufacture-brand .manufacture-brand-image img { width: 90px; height: 24px; object-fit: contain; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .manufacture-country { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .manufacture-country svg { max-width: 19px; max-height: 13px; width: 100%; height: 100%; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .manufacture-country .manufacture-country__name { color: var(--color-black); font-weight: 200; line-height: 1.15; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .manufacture-country .manufacture-country__property { color: var(--color-mid-grey-text); font-weight: 200; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart { display: flex; flex-direction: column; gap: 20px; width: 100%; max-width: 360px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .detail_add_in_fav { position: relative; display: flex; gap: 8px; align-items: center; color: var(--color-gray); font-size: 16px; font-weight: 300; line-height: 18px; width: max-content; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .detail_add_in_fav .detail_add_in_fav-icons { display: flex; align-items: center; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .in_favorite { margin: 0; position: relative; padding: 0; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container { border-radius: 20px; background: var(--color-white); padding: 20px; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart { display: flex; flex-direction: column; gap: 20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .price { font-size: 24px; font-weight: 600; line-height: 120%; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .old_price { color: var(--color-neutral-500); font-size: 14px; font-weight: 400; line-height: 120%; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .old_price span { text-decoration: line-through; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .in_card_buttons { display: flex; flex-direction: column; gap: 12px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .in_card_buttons .in_card { display: flex; box-shadow: 0px 1px 2px 0px rgba(30, 41, 59, 0.12); transition: all var(--transition); gap: 8px; justify-content: center; font-size: 14px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .in_card_buttons .in_card svg path { transition: all var(--transition); stroke: var(--color-white); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .in_card_buttons .in_card._active { background-color: var(--color-hover-red); color: var(--color-red); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .in_card_buttons .fast_sale { text-align: center; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question { border-radius: 20px; background: var(--color-bg-white); display: flex; gap: 16px; padding: 20px; cursor: pointer; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question:hover .ask_question_title { color: var(--color-red); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question .ask_question_text_container .ask_question_title { font-size: 14px; font-weight: 500; line-height: 20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question .ask_question_text_container .ask_question_text { color: var(--color-neutral-800); font-size: 12px; font-weight: 100; line-height: 20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav { height: 50px; display: flex; gap: 40px; align-items: center; overflow: hidden; overflow-x: auto; /* Стилизация скроллбара */ scroll-padding-top: 100px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav::-webkit-scrollbar { transition: all var(--transition); height: 8px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav::-webkit-scrollbar-track { transition: all var(--transition); min-height: 8px; background-color: var(--color-scrollbar); } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav::-webkit-scrollbar-thumb { transition: all var(--transition); border-radius: 10px; background-clip: content-box; background-color: var(--color-bg-slider); } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav .catalog-nav_item._active { border-bottom: 2px solid var(--color-black); font-weight: 500; } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav .catalog-nav_item { color: var(--color-black); font-size: 20px; font-weight: 300; line-height: 18px; margin: 16px 0; white-space: nowrap; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info { display: flex; flex-direction: column; gap: 20px; max-width: 865px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features { margin-top: -20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features .catalog_list_features { display: flex; flex-direction: column; gap: 16px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dl { width: 100%; overflow: hidden; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt { width: 100%; float: left; overflow: hidden; max-width: 490px; margin: 0px; color: var(--color-gray); font-size: 16px; font-weight: 200; line-height: 21px; margin-right: 10px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd { margin: 0px; font-size: 16px; font-weight: 400; line-height: 21px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd span { white-space: nowrap; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt span { display: block; white-space: nowrap; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt span:after { padding-left: 10px; content: " ................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................"; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_file { display: flex; align-items: center; gap: 10px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_file svg use { fill: var(--color-black); } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_file span { font-size: 16px; font-weight: 300; line-height: 18px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_file:hover svg use { fill: var(--color-red); } .detail_section { padding-top: 40px; padding-bottom: 20px; display: flex; flex-direction: column; gap: 40px; } .detail_section .reviews_container { display: flex; flex-direction: column; gap: 24px; } .detail_section .reviews_container .add_review_container._active { display: flex; } .detail_section .reviews_container .reviews_stars_group { display: flex; gap: 12px; align-items: center; } .detail_section .reviews_container .reviews_stars_group svg use { pointer-events: none; } .detail_section .reviews_container .review_cols_container { display: flex; gap: 40px; } .detail_section .reviews_container .review_cols_container .reviews_list_container { display: flex; flex-direction: column; gap: 24px; width: 100%; max-width: 700px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews-sort .dropdown_click._active .dropdown_click_show { color: var(--color-neutral-600); } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews-sort .dropdown_click._active .dropdown_click_show svg { rotate: 180deg; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews-sort .dropdown_click { color: var(--color-neutral-600); } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews-sort .dropdown_click .dropdown_click_show svg { stroke: var(--color-neutral-600); } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews-sort .dropdown_click .dropdown_click_content li { list-style: none; font-size: 14px; font-weight: 300; line-height: 20px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews-sort .dropdown_click .dropdown_click_content li:hover { color: var(--color-black); } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews-sort .dropdown_click .dropdown_click_content li._active { color: var(--color-black); } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content { display: flex; flex-direction: column; margin-bottom: -30px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container { display: flex; gap: 12px; flex-direction: column; padding-top: 30px; border-top: 1px solid var(--color-schemes-outline-variant); } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content { display: flex; gap: 12px; flex-direction: column; padding-bottom: 30px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .reviews_stars_group { gap: 8px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .reviews_stars_group svg { cursor: auto; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header { display: flex; justify-content: space-between; align-items: center; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_user_info { display: flex; gap: 12px; align-items: center; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_user_info .user_icon { border-radius: 30px; width: 36px; height: 36px; display: flex; padding: 8px; justify-content: center; align-items: center; user-select: none; cursor: pointer; text-align: center; font-size: 14px; font-weight: 600; line-height: 20px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_user_info .user_icon._green { background: rgba(139, 189, 95, 0.5); color: var(--color-white); } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_user_info .user_icon._blue { background-color: rgba(30, 64, 175, 0.2); /* Прозрачный синий */ color: #1e40af; /* Цвет текста остается без изменений */ } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_user_info .user_name { color: var(--color-dark-black); font-size: 14px; font-weight: 700; line-height: 18px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_user_info .comment_answer_to { color: var(--color-primary-dark-gray); font-size: 14px; font-weight: 500; line-height: 18px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_date { color: var(--color-primary-dark-gray); font-size: 14px; font-weight: 100; line-height: 20px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_job_title { color: var(--color-gray); font-size: 14px; font-weight: 500; line-height: 18px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_text { color: var(--color-black); font-size: 14px; font-weight: 200; line-height: 18px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_text_field { color: var(--color-black); font-size: 14px; font-weight: 200; display: flex; flex-direction: column; gap: 8px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_images { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_images .review-image { width: 100%; max-width: 50px; display: flex; justify-content: center; border-radius: 8px; cursor: pointer; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_images .review-image img { height: 50px; max-width: 50px; width: max-content; object-fit: cover; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_bottom_panel { display: flex; align-items: center; gap: 12px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_bottom_panel .vote-widget__thumb { display: flex; align-items: center; gap: 8px; color: var(--color-primary-dark-gray); font-size: 14px; font-weight: 400; line-height: 18px; user-select: none; cursor: pointer; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_bottom_panel .vote-widget__thumb.disabled { pointer-events: none; cursor: auto; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_bottom_panel .review_comments { display: flex; align-items: center; gap: 8px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_bottom_panel .review_comments .review_add_comment { color: var(--color-dark-black); font-size: 14px; font-weight: 400; line-height: 18px; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; cursor: pointer; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_bottom_panel .review_comments .review_comments { color: var(--color-gray-2); font-size: 14px; font-weight: 400; line-height: 18px; /* 128.571% */ } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .comments_container { padding-left: 40px; display: flex; gap: 12px; flex-direction: column; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container:first-child { border: none; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .comment_container .comment_add_form._active { display: flex; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .comment_container .comment_add_form { display: none; flex-direction: column; gap: 30px; border-radius: 20px; background: var(--color-white); margin-top: 18px; /* new sh 200 */ box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); width: 100%; max-width: 700px; padding: 20px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container { border-radius: 20px; background: var(--color-white); /* new sh 200 */ box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); width: 100%; max-width: 446px; padding: 20px; display: flex; flex-direction: column; gap: 40px; height: max-content; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top { display: flex; flex-direction: column; gap: 10px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .grade-title { color: var(--color-dark-black); font-size: 14px; font-weight: 500; margin-bottom: 6px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .grade-number { color: var(--color-full-black); font-size: 40px; font-weight: 700; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .reviews_text { color: var(--color-primary-dark-gray); font-size: 14px; font-weight: 500; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .grade-stars { position: relative; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .grade-stars .reviews_stars_group { position: relative; display: flex; width: max-content; height: 22px; overflow: hidden; /* скрыть части, вылезающие за пределы контейнера, если это необходимо */ z-index: 0; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .grade-stars .reviews_stars_group svg { cursor: auto; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .grade-stars .reviews_stars_group .stars_empty { display: flex; position: relative; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top .grade-stars .reviews_stars_group .stars_fill { position: absolute; left: 0; top: 0; z-index: 2; overflow: hidden; pointer-events: none; display: flex; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-bottom { display: flex; justify-content: end; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list { display: flex; flex-direction: column; gap: 4px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item { display: flex; gap: 14px; align-items: center; justify-content: space-between; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item:hover .grade-list-value { color: var(--color-red) !important; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item:hover .grade-list-count { color: var(--color-red) !important; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item .grade-list-value { color: var(--color-full-black); font-size: 22px; font-weight: 500; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item .grade-list-count { color: var(--color-dark-black); font-size: 12px; font-weight: 400; line-height: 18px; width: 20px; text-align: end; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item .grade-list-count._empty { color: var(--color-primary-dark-gray); } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item .grade-list-progress { width: 350px; height: 6px; border-radius: 8px; background: var(--color-light-blue); position: relative; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item .grade-list-progress .grade-list-progress-fill { position: absolute; border-radius: 8px; background: var(--color-grade-fill); height: 6px; } .detail_section .reviews_container .add_review_form { display: flex; flex-direction: column; } .detail_section .reviews_container .add_review_form .review_form_rating { margin-bottom: 20px; } .detail_section .reviews_container .add_review_form .review_form_rating label { display: none; } .detail_section .reviews_container .add_review_form .review_form_rating .reviews_stars_group svg { cursor: pointer; } .detail_section .reviews_container .add_review_form fieldset { row-gap: 10px; } .detail_section .reviews_container .add_review_form .preview-images { display: flex; flex-wrap: wrap; gap: 10px; } .detail_section .reviews_container .add_review_form .preview-images .preview-image-container { position: relative; padding: 10px; border-radius: 8px; border: 2px solid var(--color-default-hover); width: 100px; height: 100px; user-select: none; } .detail_section .reviews_container .add_review_form .preview-images .preview-image-container .preview-image-close { display: flex; position: absolute; top: 0; right: 0; padding: 4px; cursor: pointer; } .detail_section .reviews_container .add_review_form .preview-images .preview-image-container .preview-image { width: 100%; max-width: 80px; display: flex; justify-content: center; } .detail_section .reviews_container .add_review_form .preview-images .preview-image-container .preview-image img { height: 80px; max-width: 80px; width: max-content; object-fit: cover; } .detail_section .reviews_container .add_review_form .button_group { display: flex; justify-content: space-between; align-items: center; } .detail_section .reviews_container .add_review_form .button_group._end { justify-content: end; } .detail_section .reviews_container .add_review_container { display: none; flex-direction: column; border-radius: 20px; background: var(--color-white); /* new sh 200 */ box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); width: 100%; max-width: 700px; padding: 20px; } .detail_section .reviews_container .add_review_container .add_review_empty_title { color: var(--color-dark-black); font-size: 20px; font-weight: 600; margin-bottom: 20px; } .detail_section .reviews_container .reviews_empty_container { display: flex; flex-direction: column; gap: 20px; } .detail_section .reviews_container .reviews_empty_container .reviews_empty_title { color: var(--color-black); font-feature-settings: "liga" off, "clig" off; font-family: Geologica; font-size: 20px; font-weight: 500; line-height: 140%; } .detail_section .reviews_container .reviews_empty_container .reviews_empty { border-radius: 20px; background: var(--color-white); /* new sh 200 */ box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); width: 100%; max-width: 867px; padding: 20px; display: flex; flex-direction: column; gap: 20px; } .detail_section .reviews_container .reviews_empty_container .reviews_empty .reviews_empty_content { display: flex; justify-content: space-between; gap: 10px; } .detail_section .reviews_container .reviews_empty_container .reviews_empty .reviews_empty_content .reviews_empty_text { font-feature-settings: "liga" off, "clig" off; font-size: 16px; font-weight: 400; line-height: 140%; } .detail_section .reviews_container .reviews_empty_container .reviews_empty .reviews_empty_content .sok_btn-primary { white-space: nowrap; display: flex; align-items: center; max-height: 40px; justify-content: center; } .detail_section .delivery_payment_container { display: flex; flex-direction: column; gap: 20px; } .detail_section .delivery_payment_container .delivery_payment_item { border-radius: 20px; background: var(--color-white); padding: 20px; display: flex; flex-direction: column; gap: 20px; width: 100%; max-width: 867px; /* new sh 200 */ box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); } .detail_section .delivery_payment_container ul li p { font-size: 16px; font-weight: 500; line-height: 21px; margin-bottom: 10px; } .detail_section .delivery_payment_container ul li span { font-size: 16px; font-weight: 200; } @media (max-width: 1280px) { .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info { flex-wrap: wrap; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info-price_cart { max-width: 100%; justify-content: start; } } @media (max-width: 1199px) { .detail_section .reviews_container .review_cols_container { flex-wrap: wrap; flex-direction: column-reverse; } .detail_section .reviews_container .review_cols_container .reviews_grade_container { max-width: 100%; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list { max-width: 406px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav .catalog-nav_item { font-size: 16px; } } @media (max-width: 1199px) { .detail_section { padding-top: 0; } .detail_section h2 { font-size: 24px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container { gap: 20px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-bottom .sok_btn-primary { width: 100%; text-align: center; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-top { gap: 8px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list { gap: 2px; } .detail_section .reviews_container .review_cols_container .reviews_grade_container .grade-list .grade-list-item .grade-list-value { font-size: 20px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content { margin-bottom: -20px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container { padding-top: 20px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .comments_container { padding-left: 10px; } .detail_section .reviews_container .review_cols_container .reviews_list_container .reviews_content .review-cart-container .review-content .review_header .review_user_info .comment_answer_to { font-size: 12px; } .detail_section .reviews_container .reviews_empty_container .reviews_empty .reviews_empty_content { flex-direction: column; } .product-container .catalog-detail .catalog-detail__item { gap: 20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail_nav .catalog-nav_item { font-size: 14px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info { justify-content: center; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features { gap: 8px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-thumbs { display: none; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-main { max-width: 320px; max-height: 320px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-main .swiper-slide { max-width: 320px; max-height: 320px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info-price_cart { flex-direction: column; max-width: 100%; gap: 30px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info-price_cart .detail-info { max-width: 100%; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info-price_cart .detail_price_cart { max-width: 100%; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info { gap: 20px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt { font-size: 14px; max-width: 280px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd { font-size: 14px; } } @media (max-width: 480px) { .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt { overflow: visible; max-width: 150px; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd { text-align: end; } .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd span { background-color: var(--color-white); padding-left: 10px; } } /* End */ /* Start:/local/templates/main/css/components/catalog-detail-page.css?178782603233524*/ /* Детальная страница товара — дельта под Ruslava (поверх catalog-detail.css). Контейнер — штатный .sok__container (max-width + --sok-container-padding), не перебивать. */ /* page-top (в header): h1 по макету catalog-detail, без правки глобальной шапки */ main._content:has(.sok_catalog-detail-page) .page-top .page-top__inner ._h1 { font-size: 46px; letter-spacing: -3px; } .sok_catalog-detail-page.page_section { padding-top: 32px; padding-bottom: 40px; } .sok_catalog-detail-page .catalog-detail__article { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; line-height: 1.2; color: var(--color-text, #010117); } .sok_catalog-detail-page .catalog-detail__article .article-name { color: var(--color-secondary, #615f5f); font-size: 18px; font-weight: 400; } .sok_catalog-detail-page .catalog-detail__article .article-value { font-size: 18px; font-weight: 600; color: var(--color-heading, #1e2b4a); } /* Top row: gallery | info | price */ .sok_catalog-detail-page .catalog-detail .catalog-detail__item { gap: 50px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info { display: flex; align-items: flex-start; gap: 32px; row-gap: 32px; } .sok_catalog-detail-page .detail-gallery { flex: 0 0 auto; width: 613px; max-width: 100%; min-width: 0; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container { gap: 20px; align-items: flex-start; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-thumbs { width: 100px; flex-shrink: 0; } .sok_catalog-detail-page .detail_swiper_thumbs { display: flex; flex-direction: column; align-items: center; gap: 10px; height: 323px; } .sok_catalog-detail-page .detail_swiper_thumbs .swiper-wrapper { flex-direction: column; height: auto; max-height: 240px; } .sok_catalog-detail-page .detail_swiper_thumbs .swiper-slide { width: 100px !important; height: 100px !important; margin: 0 0 10px !important; border-radius: 8px; overflow: hidden; opacity: 0.55; border: 1px solid transparent; } .sok_catalog-detail-page .detail_swiper_thumbs .swiper-slide-thumb-active { opacity: 1; border-color: rgba(158, 180, 204, 0.45); } .sok_catalog-detail-page .detail_swiper_thumbs .product-img, .sok_catalog-detail-page .detail_swiper_thumbs .product-img img { width: 100%; height: 100%; min-width: 0; min-height: 0; object-fit: cover; display: block; } .sok_catalog-detail-page .detail_swiper_thumbs .swiper-button { position: static; left: auto; right: auto; top: auto; bottom: auto; width: 28px; height: 28px; margin: 0; padding: 0; background: transparent; border: none; border-radius: 0; box-shadow: none; filter: none; opacity: 1; } .sok_catalog-detail-page .detail_swiper_thumbs .swiper-button-prev, .sok_catalog-detail-page .detail_swiper_thumbs .swiper-button-next { width: 28px; height: 28px; left: auto; right: auto; top: auto; bottom: auto; opacity: 1; filter: none; background: transparent; } .sok_catalog-detail-page .sok_catalog-detail-thumb-arrow { display: block; width: 14px; height: 14px; margin: 0 auto; min-width: 0; min-height: 0; object-fit: contain; } .sok_catalog-detail-page .sok_catalog-detail-thumb-arrow._prev { transform: rotate(180deg); } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-main { flex: 1 1 auto; width: auto; max-width: 100%; max-height: 100%; min-width: 0; min-height: 0; overflow: hidden; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-main .swiper-slide { max-width: 100%; max-height: 100%; width: 100%; height: 100%; display: flex; align-items: stretch; justify-content: stretch; overflow: hidden; box-sizing: border-box; } .sok_catalog-detail-page .detail_swiper { border-radius: 20px; overflow: hidden; width: 100%; height: 346px; max-width: 100%; box-sizing: border-box; } .sok_catalog-detail-page .detail_swiper .swiper-wrapper { height: 100%; } /* Перебить base swiper.css: min/max 500px у .detail_swiper … .product-img */ .sok_catalog-detail-page .detail_swiper .swiper-wrapper .swiper-slide .product-img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; overflow: hidden; box-sizing: border-box; } .sok_catalog-detail-page .detail_swiper .swiper-wrapper .swiper-slide .product-img img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 20px; } .sok_catalog-detail-page .detail_swiper .swiper-button { display: none; } .sok_catalog-detail-page .detail_swiper .swiper-pagination { display: none; } .sok_catalog-detail-page .detail_swiper._single .swiper-button, .sok_catalog-detail-page .detail_swiper._single .swiper-pagination { display: none !important; } /* Info column */ .sok_catalog-detail-page .detail-info { flex: 1 1 0; min-width: 0; max-width: none; display: flex; flex-direction: column; gap: 24px; width: auto; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info { width: auto; gap: 24px; } .sok_catalog-detail-page .detail-info-in-stock { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; width: max-content; max-width: 100%; } .sok_catalog-detail-page .detail-info-in-stock._has-tooltip { cursor: pointer; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-in-stock .in-stock { display: inline-flex; align-items: center; gap: 10px; padding: 10px; border-radius: 8px; background: var(--color-plate, #f1f5f9); color: #3aa225; font-size: 14px; font-weight: 500; line-height: 1.1; opacity: 0.9; } .sok_catalog-detail-page .detail-info-in-stock .in-stock img { display: block; width: 16px; height: 16px; min-width: 0; min-height: 0; } /* Desktop: warehouses only in tooltip */ .sok_catalog-detail-page .stock-warehouses { display: none; list-style: none; margin: 0; padding: 0; flex-direction: column; gap: 8px; } .sok_catalog-detail-page .stock-warehouse { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; line-height: 1.1; color: #2c4053; } .sok_catalog-detail-page .stock-warehouse img { width: 16px; height: 16px; min-width: 0; min-height: 0; flex-shrink: 0; } .sok_catalog-detail-page .stock-tooltip { position: absolute; left: 0; top: calc(100% + 8px); z-index: 5; display: flex; flex-direction: column; gap: 10px; min-width: 240px; max-width: 320px; padding: 10px; border-radius: 7px; background: #fff; box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.15); } .sok_catalog-detail-page .stock-tooltip[hidden] { display: none !important; } .sok_catalog-detail-page .stock-tooltip__item { display: flex; align-items: center; gap: 10px; font-size: 15px; line-height: 1.4; color: #000; } .sok_catalog-detail-page .stock-tooltip__item img { width: 32px; height: 32px; min-width: 0; min-height: 0; flex-shrink: 0; } /* Short features — перебить base .feature_name/.feature_value (16px) */ .sok_catalog-detail-page .product_features { display: flex; flex-direction: column; gap: 10px; width: 100%; max-width: 391px; } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; width: 100%; padding-bottom: 10px; border-bottom: 1px solid rgba(158, 180, 204, 0.35); font-size: 15px; font-weight: 400; line-height: 1.4; color: var(--color-text, #010117); } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature .feature_name, .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature .feature_value { color: var(--color-text, #010117); font-size: 15px; font-weight: 400; font-style: normal; line-height: 1.4; } .sok_catalog-detail-page .product_feature .feature_dash { flex: 0 0 auto; } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-all-features { display: inline-flex; align-items: center; gap: 6px; padding: 0; border: none; background: none; color: var(--color-blue, #2d74ce); font-family: var(--font-family-base); font-size: 15px; font-weight: 500; line-height: 1.4; cursor: pointer; width: max-content; } .sok_catalog-detail-page .detail-info-all-features img { display: block; width: 12px; height: 12px; min-width: 0; min-height: 0; transform: rotate(90deg); } .sok_catalog-detail-page .detail-info-all-features:hover { opacity: 0.85; } /* Price / actions */ .sok_catalog-detail-page .detail_price_cart { flex: 0 0 282px; width: 282px; max-width: 100%; display: flex; flex-direction: column; gap: 10px; padding: 12px 10px; border: 1px dashed #a8c4e8; border-radius: 8px; box-sizing: border-box; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart { max-width: 282px; gap: 10px; } .sok_catalog-detail-page .price_cart_container { width: 100%; padding: 20px; border-radius: 10px; background: #fff; box-shadow: 0 0 1px rgba(30, 41, 59, 0.04), 0 0 4px rgba(30, 41, 59, 0.12); box-sizing: border-box; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container { border-radius: 10px; padding: 20px; box-shadow: 0 0 1px rgba(30, 41, 59, 0.04), 0 0 4px rgba(30, 41, 59, 0.12); } .sok_catalog-detail-page .product_price_cart { display: flex; flex-direction: column; gap: 20px; } /* Перебить base .price { font-size: 24px } */ .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .price { display: flex; align-items: flex-end; gap: 6px; font-size: 20px; font-weight: 600; line-height: 1.2; white-space: nowrap; } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .price-prefix { font-size: 18px; font-weight: 400; color: var(--color-text, #010117); } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .price-value { font-size: 20px; font-weight: 600; color: var(--color-heading, #1e2b4a); } .sok_catalog-detail-page .product_counter { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 20px; border-radius: 5px; background: var(--color-plate, #f1f5f9); width: max-content; box-sizing: border-box; } .sok_catalog-detail-page .product_counter .control_button { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; padding: 0; border: none; background: transparent; cursor: pointer; } .sok_catalog-detail-page .product_counter .control_button img { display: block; width: 16px; height: 16px; min-width: 0; min-height: 0; } .sok_catalog-detail-page .product_counter ._counter-input { width: 40px; border: none; background: transparent; text-align: center; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; color: #2c4053; padding: 0; } .sok_catalog-detail-page .in_card_buttons { display: flex; align-items: stretch; gap: 12px; width: 100%; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .in_card_buttons { flex-direction: row; gap: 12px; } .sok_catalog-detail-page .in_card_buttons .sok_btn-outline { flex: 1 1 auto; min-width: 0; padding-left: 12px !important; padding-right: 12px !important; border-radius: 4px; white-space: nowrap; } .sok_catalog-detail-page .in_card_buttons .in_card.sok_btn-primary { flex: 0 0 auto; width: 40px; min-width: 40px; padding-left: 12px !important; padding-right: 12px !important; border-radius: 2px; } .sok_catalog-detail-page .in_card_buttons .in_card.sok_btn-primary img { display: block; width: 16px; height: 16px; min-width: 0; min-height: 0; filter: brightness(0) invert(1); } .sok_catalog-detail-page .product_ask_question { display: flex; align-items: flex-start; gap: 15px; width: 100%; padding: 20px; border-radius: 8px; background: var(--color-plate, #f1f5f9); box-sizing: border-box; cursor: pointer; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question { border-radius: 8px; background: var(--color-plate, #f1f5f9); gap: 15px; } .sok_catalog-detail-page .product_ask_question img { display: block; width: 24px; height: 24px; min-width: 0; min-height: 0; flex-shrink: 0; } .sok_catalog-detail-page .ask_question_text_container { display: flex; flex-direction: column; gap: 10px; min-width: 0; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question .ask_question_text_container .ask_question_title { color: var(--color-blue, #2d74ce); font-size: 14px; font-weight: 500; line-height: 1.1; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question .ask_question_text_container .ask_question_text { color: var(--color-text, #010117); font-size: 11px; font-weight: 400; line-height: 1.1; } .sok_catalog-detail-page .product_ask_question:hover .ask_question_title { color: var(--color-blue, #2d74ce); opacity: 0.85; } /* Tabs */ .sok_catalog-detail-page .catalog-detail__tabs { display: flex; flex-direction: column; gap: 30px; max-width: 1023px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail_nav { height: 46px; gap: 64px; margin: 0; padding: 0; border-bottom: 1px solid rgba(158, 180, 204, 0.25); overflow-x: auto; overflow-y: hidden; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail_nav .catalog-nav_item { display: inline-flex; align-items: center; height: 46px; margin: 0; padding: 7px 0 20px; border: none; border-bottom: 2px solid transparent; background: none; color: var(--color-text, #010117); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; cursor: pointer; white-space: nowrap; box-sizing: border-box; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail_nav .catalog-nav_item._active { color: var(--color-blue, #2d74ce); border-bottom-color: var(--color-blue, #2d74ce); font-weight: 400; } .sok_catalog-detail-page .catalog-detail__panel[hidden] { display: none !important; } .sok_catalog-detail-page .catalog_detail_info { display: flex; flex-direction: column; gap: 16px; font-size: 15px; font-weight: 400; line-height: 1.4; color: var(--color-text, #010117); } /* Перебить foundation ._content p (16px) */ .sok_catalog-detail-page .catalog_detail_info p { margin: 0; font-size: 15px; font-weight: 400; line-height: 1.4; color: var(--color-text, #010117); } .sok_catalog-detail-page .catalog_list_features { display: flex; flex-direction: column; gap: 20px; padding: 30px; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 10px; box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; overflow: hidden; } /* Перебить base float/dots у .catalog_detail_features dt/dd */ .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features { margin-top: 0; width: 100%; max-width: 100%; min-width: 0; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features .catalog_list_features { gap: 20px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dl { display: flex; align-items: baseline; gap: 0; margin: 0; width: 100%; max-width: 100%; min-width: 0; overflow: hidden; float: none; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt { display: flex; align-items: baseline; flex: 1 1 auto; float: none; width: auto; max-width: none; min-width: 0; margin: 0; overflow: hidden; color: #2d2d2d; font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt span { display: inline; flex: 0 1 auto; min-width: 0; white-space: normal; background: #fff; padding-right: 0; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt span:after { content: none; padding: 0; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt::after { content: ""; flex: 1 1 auto; min-width: 12px; margin: 0 12px; border-bottom: 1px solid rgba(158, 180, 204, 0.35); transform: translateY(-0.35em); } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd { flex: 0 1 auto; float: none; width: auto; max-width: 50%; min-width: 0; margin: 0; font-size: 15px; font-weight: 400; line-height: 1.4; color: #2d2d2d; text-align: right; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd span { white-space: normal; word-break: break-word; } .sok_catalog-detail-page .delivery_payment_container { display: flex; flex-direction: column; gap: 32px; } .sok_catalog-detail-page .delivery_payment_item { display: flex; flex-direction: column; gap: 15px; } .sok_catalog-detail-page .delivery_payment_item h3 { margin: 0; font-size: 18px; font-weight: 600; line-height: 1.2; color: var(--color-heading, #1e2b4a); } .sok_catalog-detail-page .delivery_payment_box { display: flex; flex-direction: column; gap: 20px; padding: 20px; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 10px; color: #2d2d2d; font-size: 15px; line-height: 1.4; } .sok_catalog-detail-page .delivery_payment_box p { margin: 0; font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-detail-page .delivery_payment_box strong { font-size: 16px; font-weight: 500; line-height: 1.1; } /* Related */ .sok_catalog-detail-related.page_section { padding-top: 40px; padding-bottom: 80px; } /* Перебить foundation ._h2 ≤1199 (20px): в макете 768 заголовок остаётся 35px */ .sok_catalog-detail-related .section-top ._h2 { margin: 0; font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -0.03em; color: var(--color-heading, #1e2b4a); } /* Modal ask-question */ .modal .modal_dialog.sok_ask-question-product { width: 100%; max-width: 600px; gap: 40px; padding: 40px; border-radius: 20px; } .modal .sok_ask-question-product .modal_top { position: relative; display: block; padding-right: 36px; } .modal .sok_ask-question-product .modal_title { font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -1px; color: var(--color-heading, #1e2b4a); } .modal .sok_ask-question-product .modal_close-icon { position: absolute; top: 0; right: 0; } .modal .modal_dialog.sok_ask-question-product .ask_question_product { display: flex; align-items: center; gap: 40px; padding: 20px; border: 1px solid rgba(148, 163, 184, 0.15); border-radius: 10px; margin: 0; } .modal .sok_ask-question-product .ask_question_product .product_img { flex: 0 0 110px; width: 110px; height: 110px; border-radius: 8px; overflow: hidden; } .modal .sok_ask-question-product .ask_question_product .product_img img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; object-fit: contain; } .modal .sok_ask-question-product .ask_question_product .article { color: #94a3b8; font-size: 12px; line-height: 18px; letter-spacing: 0.24px; margin-bottom: 5px; } .modal .sok_ask-question-product .ask_question_product .product_content_top { min-width: 0; flex: 1 1 auto; } .modal .sok_ask-question-product .ask_question_product .product_name { font-size: 18px; font-weight: 600; line-height: 1.2; color: var(--color-heading, #1e2b4a); } .modal .sok_ask-question-product .ask_question_product .product_name span { display: -webkit-box; width: 100%; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; text-overflow: ellipsis; word-break: break-word; } .modal .modal_dialog.sok_ask-question-product .modal_form, .modal .sok_ask-question-product form { display: flex; flex-direction: column; gap: 0; } .modal .modal_dialog.sok_ask-question-product .ask_question_content { display: flex; flex-direction: column; gap: 15px; width: 100%; } .modal .modal_dialog.sok_ask-question-product .ask_question_content > input[type="hidden"] { display: none; } .modal .modal_dialog.sok_ask-question-product .modal_form fieldset, .modal .sok_ask-question-product fieldset { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; border: none; } .modal .modal_dialog.sok_ask-question-product .modal_form .modal_nav { margin-bottom: 0; } .modal .sok_ask-question-product fieldset label { font-size: 14px; font-weight: 400; line-height: 1.1; color: var(--color-text, #010117); } .modal .sok_ask-question-product .input-text, .modal .sok_ask-question-product .input-textarea { width: 100%; box-sizing: border-box; border: 1px solid #f2f5f9; border-radius: 4px; background: #f2f5f9; padding: 8px 10px; font-family: var(--font-family-base); font-size: 14px; color: var(--color-text, #010117); } .modal .sok_ask-question-product .input-text { height: 44px; } .modal .sok_ask-question-product .input-textarea { min-height: 112px; resize: vertical; } .modal .sok_ask-question-product .modal_buttons { width: 100%; } .modal .sok_ask-question-product .modal_buttons .sok_btn-primary { width: 100%; } .modal .sok_ask-question-product .ask_question_consent { display: flex; align-items: flex-start; gap: 10px; font-size: 12px; line-height: 1.1; color: var(--color-text, #010117); cursor: pointer; } .modal .sok_ask-question-product .ask_question_consent input { margin-top: 5px; flex-shrink: 0; } .modal .sok_ask-question-product .ask_question_consent a { color: inherit; text-decoration: underline; } .modal .modal_dialog.sok_ask-question-product .modal_form textarea.input-text, .modal .sok_ask-question-product textarea.input-text { min-height: 112px; height: auto; resize: vertical; } /* ===== Laptop ≤1440 ===== */ @media (max-width: 1440px) { .sok_catalog-detail-page .detail-gallery { width: 520px; } .sok_catalog-detail-page .detail_swiper { height: 300px; } .sok_catalog-detail-page .detail_swiper .swiper-wrapper .swiper-slide .product-img { height: 100%; max-width: 100%; max-height: 100%; } .sok_catalog-detail-page .detail_swiper_thumbs { height: 280px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info { gap: 24px; } } /* ===== Tablet ≤1199 ===== */ @media (max-width: 1199px) { .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info { flex-wrap: wrap; } .sok_catalog-detail-page .detail-gallery { flex: 1 1 100%; width: 100%; } .sok_catalog-detail-page .detail_swiper { height: 335px; } .sok_catalog-detail-page .detail_swiper .swiper-wrapper .swiper-slide .product-img { width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; } .sok_catalog-detail-page .detail_swiper .swiper-wrapper .swiper-slide .product-img img { max-width: 100%; max-height: 100%; } /* Tablet: превью остаются (base catalog-detail.css скрывает их ≤1199) */ .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-thumbs { display: flex; } .sok_catalog-detail-page .detail_swiper_thumbs { height: 335px; } .sok_catalog-detail-page .detail-info { flex: 1 1 0; order: 2; } .sok_catalog-detail-page .detail_price_cart { flex: 0 0 282px; order: 3; } /* Always show warehouse list; hide tooltip */ .sok_catalog-detail-page .detail-info-in-stock._has-tooltip { cursor: default; } .sok_catalog-detail-page .stock-warehouses { display: flex; } .sok_catalog-detail-page .stock-tooltip { display: none !important; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail_nav { gap: 40px; width: 100%; } .sok_catalog-detail-page .catalog-detail__tabs { max-width: none; } .sok_catalog-detail-related.page_section { padding-bottom: 60px; } } /* ===== Mobile ≤767 ===== */ @media (max-width: 767px) { main._content:has(.sok_catalog-detail-page) .page-top .page-top__inner ._h1 { font-size: 26px; letter-spacing: -1px; } .sok_catalog-detail-page.page_section { padding-top: 20px; padding-bottom: 32px; } .sok_catalog-detail-page .catalog-detail__article { gap: 5px; margin-bottom: 16px; } .sok_catalog-detail-page .catalog-detail__article .article-name { font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-detail-page .catalog-detail__article .article-value { font-size: 14px; font-weight: 500; line-height: 1.1; color: var(--color-text, #010117); } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .price, .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .price-prefix, .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .price_cart_container .product_price_cart .product_price .price-value { font-size: 18px; } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .detail-info-all-features { font-size: 14px; line-height: 1.3; } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature, .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature .feature_name, .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-info .product_features .product_feature .feature_value { font-size: 14px; line-height: 1.4; } .sok_catalog-detail-page .product_feature .feature_name, .sok_catalog-detail-page .product_feature .feature_value { white-space: normal; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail_nav .catalog-nav_item { font-size: 14px; line-height: 1.1; } .sok_catalog-detail-page .catalog_detail_info, .sok_catalog-detail-page .catalog_detail_info p { font-size: 12px; line-height: 1.4; } .sok_catalog-detail-page .catalog_list_features { padding: 20px; gap: 20px; } .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt, .sok_catalog-detail-page .product-container .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd { font-size: 12px; line-height: 1.1; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart .product_ask_question .ask_question_text_container .ask_question_text { font-size: 11px; } .sok_catalog-detail-page .delivery_payment_item h3 { font-size: 16px; } .sok_catalog-detail-page .delivery_payment_box, .sok_catalog-detail-page .delivery_payment_box p { font-size: 12px; } .sok_catalog-detail-page .delivery_payment_box { padding: 16px; } .sok_catalog-detail-page .delivery_payment_box strong { font-size: 14px; } .sok_catalog-detail-related .section-top ._h2 { font-size: 21px; letter-spacing: -1px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item { gap: 32px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info { flex-direction: column; gap: 24px; } .sok_catalog-detail-page .detail-gallery { order: 1; } .sok_catalog-detail-page .detail_price_cart { order: 2; flex: 1 1 auto; width: 100%; max-width: none; border-style: solid; border-color: rgba(158, 180, 204, 0.25); border-radius: 12px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail_price_cart { max-width: none; } .sok_catalog-detail-page .detail-info { order: 3; width: 100%; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__top-info .detail-gallery .gallery-wrapper__container .detail-gallery-slider-thumbs { display: none; } .sok_catalog-detail-page .detail_swiper { height: 220px; border-radius: 12px; } .sok_catalog-detail-page .detail_swiper .swiper-wrapper .swiper-slide .product-img { width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; } .sok_catalog-detail-page .detail_swiper .swiper-wrapper .swiper-slide .product-img img { max-width: 100%; max-height: 100%; border-radius: 12px; } .sok_catalog-detail-page .detail_swiper .swiper-pagination { display: block; bottom: 8px; } .sok_catalog-detail-page .detail_swiper._single .swiper-pagination { display: none !important; } .sok_catalog-detail-page .product_features { max-width: none; } .sok_catalog-detail-page .price_cart_container { border-radius: 15px; } .sok_catalog-detail-page .in_card_buttons .sok_btn-outline { flex: 1 1 auto; width: auto; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail_nav { gap: 30px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dt::after { margin: 0 8px; } .sok_catalog-detail-page .catalog-detail .catalog-detail__item .catalog-detail__bottom-info .catalog_detail_features dd { max-width: 48%; } .sok_catalog-detail-related.page_section { padding-top: 20px; padding-bottom: 40px; } .sok_catalog-detail-related .products-slider .swiper-button-prev, .sok_catalog-detail-related .products-slider .swiper-button-next { display: none; } .modal .modal_dialog.sok_ask-question-product { max-width: calc(100% - 24px); padding: 24px 16px; gap: 24px; margin: 12px; } .modal .sok_ask-question-product .modal_title { font-size: 21px; letter-spacing: -1px; } .modal .sok_ask-question-product .ask_question_product { gap: 16px; padding: 12px; } .modal .sok_ask-question-product .ask_question_product .product_img { flex-basis: 72px; width: 72px; height: 72px; } .modal .sok_ask-question-product .ask_question_product .product_name { font-size: 16px; line-height: 1.4; color: var(--color-text, #010117); } .modal .sok_ask-question-product .ask_question_consent { font-size: 10px; } } /* End */ /* Start:/local/templates/main/css/components/cart.css?17841810233637*/ /*Корзина*/ .cart__flex { display: flex; gap: 20px; } .cart__flex .cart__items { display: flex; flex-direction: column; gap: 20px; } .cart__flex .cart__col_cart_items { width: 100%; } .total_price_promo-container { border-radius: 20px; background: var(--color-white); padding: 20px; width: 100%; /* new sh 200 */ box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); display: flex; flex-direction: column; position: relative; } .total_price_promo-container .total_price_promo-item { border-bottom: 1px solid var(--color-light); margin-bottom: 20px; } .total_price_promo-container .total_price_container { display: flex; justify-content: space-between; align-items: center; overflow: hidden; gap: 10px; font-size: 24px; font-weight: 600; line-height: 120%; padding-bottom: 20px; margin-bottom: 20px; } .total_price_promo-container .promocode_container { display: flex; flex-direction: column; gap: 10px; } .total_price_promo-container .promocode_container .promocode_field { display: flex; flex-direction: column; gap: 4px; } .total_price_promo-container .promocode_container .promocode_field span { color: var(--color-gray); font-size: 16px; font-weight: 200; line-height: 140%; /* 22.4px */ } .total_price_promo-container .promocode_container .promocode_field input { text-transform: uppercase; font-weight: 500; font-size: 14px; } .total_price_promo-container .promocode_container .promocode_field input::placeholder { color: var(--color-light-gray); text-transform: none; font-size: 14px; font-weight: 100; } .total_price_promo-container .promocode_container .promocode_success { display: flex; align-items: center; padding-top: 10px; } .total_price_promo-container .promocode_container .promocode_success .success_title { color: var(--color-green-positive); font-size: 14px; font-weight: 300; } .total_price_promo-container .promocode_container .promocode_success .success_icon { display: flex; padding-right: 8px; } .total_price_promo-container .promocode_discount_container { display: flex; flex-direction: column; } .total_price_promo-container .promocode_discount_container .total_price_info { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; } .total_price_promo-container .promocode_discount_container .price_info_item { display: flex; justify-content: space-between; } .total_price_promo-container .promocode_discount_container .price_info_item .price_info-value.price-flex { font-weight: 600; color: var(--color-green-positive); justify-content: end; } .total_price_promo-container .promocode_discount_container .price_info_item .price_info-title { flex: 1; } .total_price_promo-container .promocode_discount_container .price_info_item .price_info-value { text-align: end; flex: 2; } .total_price_promo-container .sok_btn-primary { text-align: center; } .total_price_promo-container .buttons_container { display: flex; flex-direction: column; gap: 10px; } .total_price_promo-container.sticky { position: sticky; top: 80px; } .cart__col_price_promo { width: 100%; max-width: 360px; } .cart__col_price_promo.sticky { position: sticky; top: 80px; } .cart-section-container { display: flex; gap: 20px; flex-direction: column; } .cart-section-container .cart-section-buttons { display: flex; align-items: center; gap: 10px; } @media (max-width: 1199px) { .cart__flex { flex-direction: column; } .cart__flex .cart__col_price_promo { max-width: 100%; } } /*Корзина END*/ /* End */ /* Start:/local/templates/main/css/components/account.css?178418102316208*/ /*Стили страницы личный кабинет */ .status-sale { display: flex; padding: 7px 20px; align-items: center; text-align: center; font-size: 16px; font-weight: 300; border-radius: 10px; gap: 10px; background: var(--color-bg-gray); color: var(--color-gray); } .status-sale.in_work { background: var(--color-bg-green); color: var(--color-green-positive); } .status-sale._sent { background: var(--color-bg-yellow); color: var(--color-yellow); } .status-sale._complete { background: var(--color-bg-blue); color: var(--color-blue); } .status-sale._warning { background: var(--color-bg-red); color: var(--color-red); } .status-sale.not_shipped { background: var(--color-light); color: var(--color-black); } .change_password_container { display: flex; justify-content: center; } .change_password_container .change_password_form { display: flex; border-radius: 20px; padding: 40px; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); max-width: 400px; width: 100%; } .change_password_container .change_password_form .form_container { width: 100%; } .change_password_container .change_password_form .form_container fieldset label { font-weight: 400; color: var(--color-gray); } .left_menu_container { display: flex; flex-direction: column; border-radius: 20px; /* Shadow-200 */ box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); } .left_menu_container .left_menu_item { display: flex; align-items: center; gap: 20px; padding: 16px; } .left_menu_container .left_menu_item:hover { background: var(--color-light); } .left_menu_container .left_menu_item:first-child { border-top-left-radius: 20px; /* Скругление верхнего левого угла */ border-top-right-radius: 20px; /* Скругление верхнего правого угла */ } .left_menu_container .left_menu_item:last-child { border-bottom-left-radius: 20px; /* Скругление верхнего левого угла */ border-bottom-right-radius: 20px; /* Скругление верхнего правого угла */ } .left_menu_container .left_menu_item span { color: var(--color-black); font-size: 16px; font-weight: 400; line-height: 20px; } .left_menu_container .left_menu_item svg._fill { fill: var(--color-black); } .left_menu_container .left_menu_item svg._stroke { stroke: var(--color-black); } .left_menu_container .left_menu_item svg.arrow_right { margin-left: auto; } .left_menu_container .left_menu_item._active { background: var(--color--card-hover); cursor: auto; } .lk__cabinet { display: flex; flex-direction: column; border-radius: 20px; padding: 20px; /* Shadow-200 */ box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); } .lk__cabinet .form_container { max-width: 600px; } .lk__cabinet .form_container .input_tel_btn { display: flex; gap: 10px; } .lk__cabinet .form_container .input_tel_btn .btn_get_code { white-space: nowrap; } .lk__cabinet .form_container .input_tel_btn .btn_get_code._hide { display: none; } .lk__cabinet .form_container .change_tel { display: flex; justify-content: space-between; gap: 10px; } .lk__cabinet .form_container .change_tel input { border: none; display: flex; width: 100%; background: transparent; } .lk__cabinet .form_container .change_tel span { font-size: 14px; font-weight: 400; line-height: 20px; cursor: pointer; } .lk__cabinet .form_container .change_tel span._hide { display: none; } .lk__cabinet .form_container fieldset._hide { display: none; } .lk__cabinet .form_container .password_text_tip { color: var(--color-gray); font-size: 12px; font-weight: 400; line-height: 20px; margin: 0; } .lk__cabinet .form_container .change_pass._hide { display: none; } .lk__cabinet .form_container .password_text_tip._hide { display: none; } .lk__orders { display: flex; flex-direction: column; gap: 20px; } .lk__orders .order_cart { display: flex; flex-direction: column; border-radius: 20px; padding: 20px; gap: 20px; /* Shadow-200 */ box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); } .lk__orders .order_cart .order_cart-name-status { display: flex; justify-content: space-between; gap: 20px; } .lk__orders .order_cart .order_cart-name-status .order_cart-name-summ { display: flex; flex-direction: column; gap: 8px; } .lk__orders .order_cart .order_cart-name-status .order_cart-name-summ .order_cart-name { font-size: 20px; font-weight: 600; line-height: 32px; } .lk__orders .order_cart .order_cart-name-status .order_cart-name-summ .order_cart-summ { color: var(--color-gray); font-size: 16px; font-weight: 300; } .lk__orders .order_cart .order_cart-name-status .order_cart-name-summ .order_cart-summ .price { font-weight: 500; } .lk__orders .order_cart .order_buttons { display: flex; gap: 10px; } .lk__orders .order_cart .order_buttons .sok_btn-opacity { color: var(--color-black); white-space: nowrap; } .lk__order { display: grid; grid-template-columns: auto minmax(300px, 360px); gap: 20px; } .lk__order .order-col .payment-description { margin-bottom: 0; } .lk__order .order-col .order-right-col-container { display: flex; flex-direction: column; gap: 20px; } .lk__order .order-col .order-right-col-container .robokasskassa_payment_button { width: 100%; } .lk__order .order-col .order-left-col-container { display: flex; flex-direction: column; gap: 30px; } .lk__order .order-col .order-left-col-container .order_info-container { display: flex; flex-direction: column; border-radius: 20px; padding: 30px 20px; gap: 50px; /* Shadow-200 */ box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); } .lk__order .order-col .order-left-col-container .order_info-container .status-tip { position: relative; padding: 8px 10px; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-icon { cursor: pointer; display: flex; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-tip-container._hide { opacity: 0; pointer-events: none; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-tip-container { padding: 20px; /* Shadow-200 */ box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); min-height: 160px; position: absolute; top: 54px; left: 0; background-color: var(--color-white); max-width: 330px; z-index: 101; border-radius: 10px; opacity: 1; transition: all var(--transition); } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-tip-container .tip_close { position: absolute; right: 0; top: 0; margin: 20px; cursor: pointer; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-tip-container .status-content { display: flex; flex-direction: column; gap: 8px; text-align: start; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-tip-container .status-content .status-title { color: var(--color-black); font-size: 16px; font-weight: 400; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-tip-container .status-content .status-text { color: var(--color-gray); font-size: 14px; font-weight: 300; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-grid .order_info-fields { display: grid; grid-template-columns: repeat(1, 1fr); } .lk__order .order-col .order-left-col-container .order_info-container .order_info-grid .status { padding: 8px; font-size: 11px; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-grid .sok_btn-primary { font-size: 12px; font-weight: 300; padding: 6px 10px; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-field { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; grid-row-gap: 20px; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-field .order_order_info-field-name { color: var(--color-gray); font-size: 14px; font-weight: 200; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-field .order_order_info-field-value { color: var(--color-black); font-size: 14px; font-weight: 300; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); grid-row-gap: 8px; grid-column-gap: 20px; } .lk__order .order-col .order-left-col-container .order_products_container { display: flex; flex-direction: column; gap: 10px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container { display: flex; align-items: center; border-radius: 20px; gap: 20px; /* Shadow-200 */ box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); /* new sh 200 */ box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); position: relative; padding: 20px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .in_favorite { top: auto; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-image { display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; max-width: 80px; max-height: 80px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-image img { max-width: 80px; max-height: 80px; height: max-content; border-radius: 10px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container { display: flex; gap: 20px; align-items: center; justify-content: space-between; width: 100%; flex-wrap: wrap; margin-right: 30px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-description { display: flex; flex-direction: column; gap: 10px; max-width: 280px; width: 100%; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-description .order_product-title { font-size: 14px; font-weight: 500; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-description .article { color: var(--color-gray); font-size: 12px; font-weight: 400; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-total-count-price { display: flex; justify-content: space-between; gap: 20px; max-width: 240px; width: 100%; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-count-price { display: flex; gap: 6px; align-items: center; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-count-price .order_product-price { font-size: 16px; font-weight: 400; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-count-price .order_product-count { color: var(--color-gray); font-size: 14px; font-weight: 400; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-total-container { display: flex; font-size: 18px; font-weight: 600; } @media (max-width: 1280px) { .lk__order { grid-template-columns: auto; } } @media (max-width: 1199px) { .lk__cabinet .form_container .input_tel_btn { flex-direction: column; } .lk__orders .order_cart .order_cart-name-status { flex-direction: column; } .lk__orders .order_cart .order_buttons .sok_btn-light-hover { padding: 10px 14px; } .lk__orders .order_cart .order_buttons .sok_btn-opacity { padding: 10px 14px; } .lk__order .order-col .order-left-col-container .order_info-container { gap: 20px; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip { position: initial; } .lk__order .order-col .order-left-col-container .order_info-container .status-tip .status-tip-container { max-width: max-content; border-bottom-left-radius: 0; border-bottom-right-radius: 0; bottom: 0; top: auto; position: fixed; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-grid { grid-template-columns: repeat(1, 1fr); gap: 10px; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-fields { display: flex; flex-direction: column; grid-row-gap: 6px; } .lk__order .order-col .order-left-col-container .order_info-container .order_info-fields .order_info-field { grid-template-columns: 1fr; grid-row-gap: 3px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .in_favorite { top: 0; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container { justify-content: start; flex-direction: column; align-items: flex-start; margin-right: 10px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-total-count-price { justify-content: flex-start; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-description .order_product-title { font-size: 12px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-description .article { font-size: 10px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-count-price .order_product-price { font-size: 14px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-count-price .order_product-count { font-size: 12px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-description-price-total-container .order_product-total-container { font-size: 15px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-image { width: 50px; height: 50px; max-width: 50px; max-height: 50px; } .lk__order .order-col .order-left-col-container .order_products_container .order_product_container .order_product-image img { max-width: 50px; max-height: 50px; } } @media (max-width: 480px) { .change_password_container .change_password_form { padding: 20px; } } /*Стили страницы личный кабинет END */ /* End */ /* Start:/local/templates/main/css/components/manufacturer.css?17841810233637*/ /*Стили страницы производителя */ section.manufacture_section { margin-bottom: 40px; } .manufacture-item { border-radius: 20px; background: var(--color-white); box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); padding: 20px; display: flex; justify-content: center; align-items: center; width: 100%; min-height: 200px; transition: all var(--transition); } .manufacture-item:hover { /* new hover */ box-shadow: 0px 0px 12px 4px rgba(30, 41, 59, 0.08), 0px 0px 16px -1px rgba(30, 41, 59, 0.16); } .manufacture-item img { max-width: 320px; max-height: 160px; height: max-content; object-fit: contain; } .manufacture-container .manufactures_view { display: flex; flex-direction: column; position: relative; } .manufacture-container .manufactures_view .manufactures_list { display: grid; grid-template-columns: repeat(auto-fill, minmax(325px, 1fr)); margin-bottom: 20px; gap: 20px; } .manufacture-banner-container { border-radius: 20px; background: var(--color-white); padding: 60px; display: flex; gap: 20px; } .manufacture-banner-container .manufacture-banner-left { display: flex; flex-direction: column; } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-title { font-size: 52px; font-weight: 600; } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-list { display: flex; flex-direction: column; gap: 10px; } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-list li { font-size: 16px; font-weight: 200; list-style: disc; margin-left: 20px; } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-list li::marker { color: var(--color-red); } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-text { font-size: 24px; font-weight: 500; } .manufacture-banner-container .manufacture-banner-left .sok_btn-primary { height: 60px; font-weight: 500; } .manufacture-banner-container .manufacture-banner-right-image { border-radius: 30px; max-width: 568px; max-height: 435px; object-fit: cover; } .manufacture-description-container { display: flex; gap: 20px; } .manufacture-description-container .manufacture-description-left { width: 100%; max-width: 360px; } .manufacture-description-container .manufacture-description-right { font-size: 16px; font-weight: 200; line-height: 130%; } @media (max-width: 1280px) { .manufacture-banner-container { flex-direction: column; gap: 30px; } .manufacture-banner-container .manufacture-banner-right-image { max-width: max-content; } } @media (max-width: 1199px) { .manufacture-item img { max-width: 285px; } .manufacture-banner-container { padding: 40px; } } @media (max-width: 1199px) { .manufacture-description-container { flex-direction: column; } .manufacture-container .manufactures_view .manufactures_list { grid-template-columns: 1fr; } .manufacture-banner-container { padding: 20px; } .manufacture-banner-container .manufacture-banner-left { gap: 20px; } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-title { font-size: 35px; } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-list { gap: 8px; } .manufacture-banner-container .manufacture-banner-left .manufacture-banner-text { font-size: 20px; } } @media (max-width: 480px) { .manufacture-item img { max-width: 245px; } } /*Стили страницы производителя END */ /* End */ /* Start:/local/templates/main/css/components/news.css?17841810235681*/ /*Стили страницы новостей, статьей, проектов, скидок и акций */ .detail-text { margin-bottom: -20px; } .requisites-container { display: flex; flex-direction: column; gap: 14px; } .requisites-container .requisite_item { display: flex; column-gap: 10px; align-items: center; row-gap: 4px; flex-wrap: wrap; } .requisites-container .requisite_item .requisite_item-name { color: var(--color-mid-grey-text); font-size: 16px; font-weight: 200; line-height: 18px; } .requisites-container .requisite_item .requisite_item-value { color: var(--color-black); font-size: 16px; font-weight: 200; line-height: 130%; } .detail_nav-buttons { display: flex; flex-wrap: wrap; gap: 20px; } .detail_nav-buttons .sok_btn-light-hover { white-space: nowrap; padding: 10px 20px; } .detail_nav-buttons .sok_btn-light-hover svg use { fill: var(--color-black); } .detail_nav-buttons ._end { margin-left: auto; } .form_service_container._hide { display: none; } .form_service_container { box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); border-radius: 20px; padding: 20px; background-color: var(--color-white); display: flex; flex-direction: column; gap: 30px; } .form_service_container .button_group button._end { margin-left: auto; } .form_service_container .form_service_top { display: flex; flex-direction: column; gap: 10px; } .form_service_container .form_service_top .form_service_title { font-size: 20px; font-weight: 600; } .form_service_container .form_service_top .form_service_text { font-size: 16px; font-weight: 200; } .detail-container.detail__narrow { max-width: 1080px; margin: 0 auto; } .detail-container .detail_view { display: flex; flex-direction: column; position: relative; } .detail-container .detail_view .detail_list { display: grid; margin-bottom: 60px; grid-template-columns: repeat(auto-fill, minmax(325px, 1fr)); gap: 20px; } .detail-container .detail-content { display: flex; flex-direction: column; gap: 40px; max-width: 1080px; margin: 0 auto; } .detail-container .detail-content .text-title { color: var(--color-black); font-size: 16px; font-style: normal; font-weight: 500; line-height: normal; } .detail-container .detail-content .certificates_grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 40px; } .detail-container .detail-content .certificates_grid .certificate_item { display: flex; flex-direction: column; gap: 16px; } .detail-container .detail-content .certificates_grid .certificate_item .certificates_image { max-width: 100%; width: 100%; height: 280px; display: flex; position: relative; justify-content: center; align-items: center; } .detail-container .detail-content .certificates_grid .certificate_item .certificates_image img { max-height: 280px; border-radius: 10px; width: 100%; object-fit: contain; } .detail-container .detail-content .discounts_list { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-bottom: -20px; } .detail-container .detail-content .detail-date { color: var(--color-gray); font-size: 14px; font-weight: 100; } .detail-container .detail-content .detail-img { display: flex; flex-direction: column; justify-content: center; } .detail-container .detail-content .detail-img img { max-height: 400px; object-fit: cover; border-radius: 20px; box-shadow: 0px 2px 2px 1px rgba(30, 41, 59, 0.04), 0px 2px 8px -1px rgba(30, 41, 59, 0.12); } .detail-container .detail-content .detail-img .supplier-img { max-width: 745px; } .detail-container .detail-content .detail-img .advantages-img { box-shadow: none; object-fit: contain; } .detail-container .detail-content._normal { max-width: 100%; } .detail-container .sok_card_service { width: 100%; } .detail-container .sok_card_service .sok_card_service-img { max-width: 100%; } .detail-container .detail_nav-buttons { display: flex; flex-wrap: wrap; gap: 20px; } .detail-container .detail_nav-buttons .sok_btn-light-hover { white-space: nowrap; padding: 10px 20px; } .detail-container .detail_nav-buttons .sok_btn-light-hover svg use { fill: var(--color-black); } .detail-container .detail_nav-buttons ._end { margin-left: auto; } @media (max-width: 1199px) { .detail-container .detail-content .certificates_grid { gap: 18px; } } @media (max-width: 1199px) { .detail_nav-buttons { gap: 8px; row-gap: 20px; } .detail_nav-buttons .sok_btn-light-hover { font-size: 12px; gap: 6px; padding: 10px 13px; } .form_service_container { gap: 20px; } .detail-container .detail_view .detail_list { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); } .detail-container .detail-content { gap: 20px; } .detail-container .detail-content .certificates_grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); } .detail-container .detail-content .certificates_grid .certificate_item .certificates_image { height: 150px; } .detail-container .detail-content .certificates_grid .certificate_item .certificates_image img { max-height: 150px; } .detail-container .detail-content .discounts_list { margin-bottom: 0; } .detail-container .detail_nav-buttons { gap: 8px; row-gap: 20px; } .detail-container .detail_nav-buttons .sok_btn-light-hover { font-size: 12px; gap: 6px; padding: 10px 13px; } } /*Стили страницы новостей, статьей, проектов, скидок и акций END */ /* End */ /* Start:/local/templates/main/css/components/contacts-page.css?17841810233099*/ /*Стили страницы Контакты */ .write_message_form_container { padding: 40px; display: flex; gap: 40px; } .write_message_form_container h2 { margin: 0; } .write_message_form_container p { margin: 0; } .write_message_form_container .write_message_form_title_container { display: flex; flex-direction: column; gap: 20px; width: 100%; max-width: 500px; } .write_message_form_container .write_message_form_content { width: 100%; } .write_message_form_container .write_message_form_content .form_container fieldset label { font-weight: 200; } .write_message_form_container .write_message_form_content .form_container .button_group .text-send { color: var(--color-gray); } .contacts-container .contacts_detail { display: grid; } .contacts-container .contacts_detail .map_container { padding: 40px; margin-bottom: 40px; } .contacts-container .contacts_detail .contacts_info-container { padding: 40px; display: flex; flex-wrap: wrap; gap: 30px; margin-bottom: 40px; } .contacts-container .contacts_detail .contacts_info-container .contacts_info-item { display: grid; grid-template-columns: 24px auto; grid-column-gap: 16px; flex: 1; } .contacts-container .contacts_detail .contacts_info-container .contacts_info-item .contacts_info-text-container { display: flex; flex-direction: column; gap: 10px; } .contacts-container .contacts_detail .contacts_info-container .contacts_info-item .contacts_info-text-container .contacts_info-text-title { font-size: 20px; font-weight: 600; line-height: 130%; } .contacts-container .contacts_detail .contacts_info-container .contacts_info-item .contacts_info-text-container a.contacts_info-text-title { text-decoration-line: underline; text-decoration-style: dotted; text-decoration-skip-ink: auto; text-decoration-thickness: 5%; /* 1px */ text-underline-offset: 10%; /* 2px */ text-underline-position: from-font; } .contacts-container .contacts_detail .contacts_info-container .contacts_info-item .contacts_info-text-container p { margin: 0; } @media (max-width: 1199px) { .write_message_form_container { flex-direction: column; } .write_message_form_container .write_message_form_title_container { display: flex; flex-direction: column; gap: 20px; width: 100%; max-width: 500px; } .write_message_form_container .write_message_form_content .form_container .button_group .text-send p { font-size: 12px; } .write_message_form_container { order: 3; } .contacts-container .contacts_detail .map_container { order: 2; padding: 20px; } .contacts-container .contacts_detail .contacts_info-container { flex-direction: column; gap: 20px; order: 1; padding: 20px; } } @media (max-width: 1199px) { .write_message_form_container { padding: 40px 10px; } .write_message_form_container .write_message_form_content .form_container .button_group { gap: 10px; } .contacts-container .contacts_detail .map_container { padding: 10px; } } /*Стили страницы Контакты END */ /* End */ /* Start:/local/templates/main/css/components/error-404.css?17841810234297*/ /* Страница 404 */ /* Не давать слайдеру/стрелкам раздувать страницу по горизонтали */ main._content:has(.sok_error-404-hero) { overflow-x: hidden; } /* «Популярные товары» — без фона секции (Figma: прозрачная, не bg-white #F9F9F9) */ .sok_error-404-hero ~ .sok_products-section { background-color: transparent; overflow-x: hidden; } /* Вернуть правый padding: иначе стрелка next (right: -20px) вылезает за viewport */ .sok_error-404-hero ~ .sok_products-section .container-swiper { padding-right: var(--sok-container-padding) !important; } /* Hero */ .sok_error-404-hero.page_section { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; height: 520px; min-height: 520px; padding: 150px 260px; margin-bottom: 0; background-color: var(--color-white); } .sok_error-404-hero__decor { position: absolute; top: -106px; left: 50%; width: 1920px; max-width: none; transform: translateX(-50%); display: block; color: var(--color-blue); font-family: var(--font-family-base); font-size: 600px; font-weight: 800; line-height: normal; letter-spacing: -0.02em; text-align: center; opacity: 0.04; pointer-events: none; user-select: none; } .sok_error-404-hero__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 40px; max-width: 432px; width: 100%; opacity: 0.9; } .sok_error-404-hero__text { display: flex; flex-direction: column; align-items: center; gap: 15px; text-align: center; } .sok_error-404-hero__title { margin: 0; color: var(--color-heading); font-family: var(--font-family-base); font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -1px; } .sok_error-404-hero__desc { margin: 0; color: #2C4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_error-404-hero__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; } .sok_error-404-hero__actions .sok_btn-primary { width: auto; } .sok_error-404-hero__btn-outline { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 8px 28px; border: 1px solid var(--color-blue); border-radius: 4px; background: var(--color-white); color: var(--color-blue); font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1; text-align: center; text-decoration: none; box-sizing: border-box; transition: background-color var(--transition), color var(--transition), border-color var(--transition); } .sok_error-404-hero__btn-outline:hover, .sok_error-404-hero__btn-outline:focus-visible { background: var(--color-blue); border-color: var(--color-blue); color: var(--color-white); text-decoration: none; } /* Слайдер «Популярные товары» на 404: без стрелок на tablet/mobile */ @media (max-width: 1199px) { .sok_error-404-hero ~ .sok_products-section .products-slider .swiper-button-prev, .sok_error-404-hero ~ .sok_products-section .products-slider .swiper-button-next { display: none; } } @media (max-width: 1440px) { .sok_error-404-hero.page_section { padding-right: 40px; padding-left: 40px; } } @media (max-width: 1199px) { .sok_error-404-hero.page_section { height: 358px; min-height: 358px; padding: 150px 20px; } .sok_error-404-hero__decor { top: -32px; left: calc(50% - 5px); font-size: 350px; } } @media (max-width: 767px) { .sok_error-404-hero.page_section { height: 281px; min-height: 281px; padding: 50px 12px; } .sok_error-404-hero__decor { top: calc(50% - 121.5px); left: calc(50% - 5px); font-size: 200px; line-height: normal; } .sok_error-404-hero__inner { gap: 50px; } .sok_error-404-hero__title { max-width: 250px; font-size: 21px; letter-spacing: -0.63px; } .sok_error-404-hero__desc { max-width: 322px; font-size: 12px; } } /* End */ /* Start:/local/templates/main/css/components/side-menu.css?17841810141811*/ /*Стили side-menu */ .side-menu-bg .side-close { position: fixed; right: 0; top: 0; display: none; z-index: 1000; margin: 20px; cursor: pointer; } .side-menu-bg .side-close._show { display: block; } .side-menu-bg .side-menu { position: fixed; top: 0; right: -100%; width: 100%; max-width: 80vw; height: 100%; background-color: var(--color-white); z-index: 1000; padding: 20px; min-width: 240px; left: -100%; transition: all var(--transition); overflow-y: auto; } .side-menu-bg .side-menu .side-menu-content .side-menu_top { padding-bottom: 20px; display: flex; justify-content: space-between; } .side-menu-bg .side-menu .side-menu-content .side-menu_top .side-menu_title { font-size: 20px; font-weight: 500; line-height: normal; } .side-menu-bg._filter .side-close { position: relative; display: block; margin: 0; } .side-menu-bg._filter .side-menu { max-width: 100%; width: 100%; } .side-menu-bg._filter .side-menu .side-menu-content .catalog_filter_container { max-width: 100%; box-shadow: none; padding: 0; background: none; border-radius: 0; } .side-menu-bg._filter .side-menu .side-menu-content .catalog_filter_container .dropdown_click { cursor: auto; } .side-menu-bg._filter .side-menu .side-menu-content .catalog_filter_container .dropdown_click .dropdown_click_show { cursor: auto; } .side-menu-bg._filter .side-menu .side-menu-content .catalog_filter_container .catalog-filter-params .catalog-filter-param .catalog-filter-popup_result { display: none; } .side-menu-bg._filter .side-menu .side-menu-content .catalog_filter_container .catalog-filter-params .catalog-filter-param .catalog-flex-title .side-close svg { stroke: none; } .side-menu._open { display: block; left: 0; } /*Стили side-menu END */ /* End */ /* Start:/local/templates/main/css/components/product-card.css?178781878916008*/ /*Стили карточки товара (product) */ .stock { white-space: nowrap; } .stock .in-stock { color: var(--color-green); font-size: 12px; font-weight: 400; line-height: 18px; } .stock .in-wait { color: var(--color-gray); font-size: 12px; font-weight: 400; line-height: 18px; } .stock .to-order { color: var(--color-dark-blue); font-size: 12px; font-weight: 400; line-height: 18px; } .in_favorite { position: absolute; top: 0; right: 0; border-radius: 10px; background: rgba(255, 255, 255, 0.6); padding: 4px; margin: 10px; z-index: 1; cursor: pointer; max-height: 28px; } .in_favorite:after { content: ""; display: block; width: 20px; height: 20px; } .in_favorite:hover .icon { fill: #e31e25; } .in_favorite .icon { fill: #b1b1b1; transition: all var(--transition); position: absolute; } .in_favorite._active .icon { opacity: 1; fill: #e31e25; } .sok_card_product { width: 284px; height: 435px; } .sok_card_product._list { width: 100%; height: auto; max-height: none; overflow: visible; } .sok_card_product .product-img { height: 100%; align-items: center; } .sok_card_product .product-img img { /* max-width: 264px; height: 213px; height: auto; max-height: 213px; */ } .in_card { display: flex; border-radius: 999px; border: 1px solid var(--color-red); box-shadow: 0px 1px 2px 0px rgba(30, 41, 59, 0.12); padding: 12px; transition: all var(--transition); background: none; margin: 1px; color: var(--color-red); font-size: 12px; font-weight: 500; line-height: 18px; gap: 8px; cursor: pointer; } .in_card:hover { background-color: var(--color-red); color: var(--color-white); } .in_card svg path { transition: all var(--transition); } .in_card:hover svg path { stroke: var(--color-white); } .in_card._active { background-color: var(--color-red); color: var(--color-white); } .in_card._active svg path { stroke: var(--color-white); } .sok_card_product { position: relative; display: flex; flex-direction: column; align-items: center; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); border-radius: 20px; padding: 10px; background-color: var(--color-white); transition: all var(--transition); } .sok_card_product:hover { /* new hover */ box-shadow: 0px 0px 12px 4px rgba(30, 41, 59, 0.08), 0px 0px 16px -1px rgba(30, 41, 59, 0.16); } .sok_card_product .product-img { position: relative; width: 100%; display: flex; justify-content: center; min-height: 213px; } .sok_card_product .product-img img { border-radius: 10px; max-width: 100%; max-height: 100%; } .sok_card_product .product_name a { display: -webkit-box; width: 100%; min-height: 40px; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; font-size: 14px; font-weight: 200; } .sok_card_product .product_price { display: flex; flex-direction: column; } .sok_card_product .product_price .old_price { color: var(--color-light-gray); font-size: 14px; font-weight: 400; line-height: 120%; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .sok_card_product .product_price .old_price span { text-decoration: line-through; } .sok_card_product .product_price .price { display: flex; justify-content: space-between; align-items: center; overflow: hidden; text-overflow: ellipsis; font-size: 20px; font-weight: 600; line-height: 120%; height: 44px; white-space: nowrap; } .sok_card_product .product_content { display: flex; flex-direction: column; padding: 10px; row-gap: 10px; padding-bottom: 0; padding-left: 0; padding-right: 0; height: 100%; justify-content: space-between; width: 100%; } .sok_card_product .product_content .product_content_top { display: flex; flex-direction: column; row-gap: 10px; } .sok_card_product .product_content .product-manufacture-country { display: flex; align-items: center; gap: 4px; color: var(--color-mid-grey-text); font-size: 12px; line-height: 18px; } .sok_card_product .product_content .product-manufacture-country svg { max-width: 19px; max-height: 13px; width: 100%; height: 100%; } .sok_card_product .product_content .article-stars-stock { display: flex; flex-direction: column; row-gap: 4px; } .sok_card_product .product_content .article-stars-stock .article-stars { display: flex; justify-content: space-between; align-items: center; min-height: 18px; } .sok_card_product .product_content .article-stars-stock .article-stars .article { color: var(--color-neutral-500); font-size: 12px; font-weight: 400; line-height: 18px; display: block; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .sok_card_product .product_content .article-stars-stock .article-stars .stars { display: flex; justify-content: space-between; align-items: center; column-gap: 2px; margin-left: auto; } .sok_card_product .product_content .article-stars-stock .article-stars .stars .grade { color: var(--color-text); font-size: 12px; font-weight: 400; line-height: 18px; } @media (max-width: 1199px) { .in_card { padding: 7px; } .sok_card_product .product_content { row-gap: 8px; } .sok_card_product .product_content .product_price .old_price { font-size: 12px; } .sok_card_product .product_content .product_price .price { font-size: 14px; height: 34px; } } @media (max-width: 480px) { .sok_card_product { height: 350px; width: 160px; } .sok_card_product .product_content .product_name a { font-size: 14px; min-height: auto; -webkit-line-clamp: 4; } .sok_card_product .product-img { min-height: 120px; } .sok_card_product .product-img img { max-width: 140px; max-height: 120px; } } .sok_card_product._list { flex-direction: row; height: max-content; width: 100%; gap: 20px; padding: 20px; justify-content: space-between; align-items: self-start; } .sok_card_product._list .product_name a { min-height: auto; } .sok_card_product._list .product_img_content { display: flex; gap: 20px; height: auto; max-height: none; align-items: flex-start; display: grid; grid-template-columns: 214px 1fr; /* 1fr — это оставшееся пространство */ width: 100%; } .sok_card_product._list .product_img_content .product-img { max-width: 214px; max-height: 214px; align-items: center; height: 100%; } .sok_card_product._list .product_img_content .product-img img { /* height: auto; max-height: 214px; */ } .sok_card_product._list .product_img_content .product_content { padding: 0; row-gap: 20px; height: max-content; align-self: self-start; } .sok_card_product._list .product_img_content .product_content .product_content_top .article-stars-stock { flex-direction: row; gap: 10px; } .sok_card_product._list .product_img_content .product_content .product_content_top .article-stars-stock .article-stars { justify-content: flex-start; gap: 10px; } .sok_card_product._list .product_img_content .product_content .product_features { display: flex; flex-direction: column; } .sok_card_product._list .product_img_content .product_content .product_features .product_feature { display: flex; flex-wrap: wrap; align-items: center; column-gap: 10px; } .sok_card_product._list .product_img_content .product_content .product_features .product_feature .feature_name { font-size: 14px; font-weight: 200; line-height: 21px; } .sok_card_product._list .product_img_content .product_content .product_features .product_feature .feature_value { font-size: 14px; font-weight: 400; line-height: 21px; } .sok_card_product._list .product_img_content .product_content .product_features .product_feature .feature-value__country { display: flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 400; line-height: 21px; } .sok_card_product._list .product_img_content .product_content .product_features .product_feature .feature-value__country svg { max-width: 19px; max-height: 13px; width: 100%; height: 100%; } .sok_card_product._list .product_price_cart { display: flex; flex-direction: column; } .sok_card_product._list .product_price_cart .product_price { align-items: end; } .sok_card_product._list .product_price_cart .product_price .old_price { margin-top: 3px; } .sok_card_product._list .product_price_cart .in_card_favorite { display: flex; gap: 10px; margin-top: 14px; align-items: center; } .sok_card_product._list .product_price_cart .in_card_favorite .in_favorite { position: relative; margin: 0; } .sok_card_product._list .in_card { border-radius: 10px; padding: 10px 24px; } @media (max-width: 1280px) { .sok_card_product._list .product_img_content { width: 100%; grid-template-columns: 120px 1fr; } } @media (max-width: 1199px) { .sok_card_product._list { flex-wrap: wrap; } .sok_card_product._list .product_img_content { height: max-content; align-items: self-start; grid-template-columns: 90px 1fr; gap: 10px; } .sok_card_product._list .product_img_content .product-img { height: max-content; min-height: auto; } .sok_card_product._list .product_img_content .product_content { row-gap: 10px; } .sok_card_product._list .product_img_content .product_content .product_features .product_feature .feature_name { font-size: 12px; line-height: 17px; } .sok_card_product._list .product_img_content .product_content .product_features .product_feature .feature_value { font-size: 12px; line-height: 17px; } .sok_card_product._list .product_price_cart { width: 100%; justify-content: end; flex-direction: row; justify-content: space-between; } .sok_card_product._list .product_price_cart .product_price { align-items: self-start; } .sok_card_product._list .product_price_cart .in_card_favorite { justify-content: end; margin: 0; } } @media (max-width: 480px) { .sok_card_product._list { padding: 20px 10px; height: max-content !important; } .sok_card_product._list .product_img_content { grid-template-columns: 60px 1fr; } .sok_card_product._list .product_img_content .product_content .product_content_top .article-stars-stock { flex-wrap: wrap; } .sok_card_product._list .product_img_content .product-img { min-width: 60px; width: max-content; max-width: 60px; } .sok_card_product._list .product_img_content .product-img img { height: auto !important; max-height: 110px; } .sok_card_product._list .product_price_cart { flex-direction: column; } } /* Ruslava — карточка товара */ .sok_card_product:not(._list) { position: relative; display: flex; flex-direction: column; align-items: stretch; width: 240px; height: auto; min-height: 310px; padding: 0; border: 0; border-radius: 8px; background: var(--color-plate); box-shadow: none; overflow: hidden; transition: background var(--transition); } .sok_card_product:not(._list):hover { background: var(--color-plate-hover); box-shadow: none; } .sok_card_product:not(._list) .product-img { position: relative; width: 100%; height: 160px; min-height: 160px; padding: 10px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; } .sok_card_product:not(._list) .product-img img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; mix-blend-mode: darken; border-radius: 0; } .sok_card_product:not(._list) .product_content { display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 150px; padding: 12px 8px; box-sizing: border-box; row-gap: 0; } .sok_card_product:not(._list) .product_content_top { display: flex; flex-direction: column; row-gap: 4px; } .sok_card_product:not(._list) .article span { display: block; font-size: 12px; font-weight: 400; line-height: 1.1; color: #2c4053; opacity: 0.7; word-break: break-word; } .sok_card_product:not(._list) .product_name a { display: -webkit-box; width: 100%; min-height: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; text-overflow: ellipsis; font-size: 16px; font-weight: 700; line-height: 1.2; color: var(--color-heading); word-break: break-word; } .sok_card_product:not(._list) .product_name a:hover { color: var(--color-blue); } .sok_card_product:not(._list) .product_price { display: grid; grid-template-columns: 1fr 40px; column-gap: 4px; align-items: end; width: 100%; } .sok_card_product:not(._list) .product_price-left { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .sok_card_product:not(._list) .stock .in-stock { display: inline-flex; align-items: center; gap: 2px; padding: 2px 4px; border-radius: 2px; font-size: 10px; font-weight: 500; line-height: 1.1; color: var(--color-in-stock); opacity: 0.7; } .sok_card_product:not(._list) .stock .in-stock img { width: 8px; height: 8px; flex-shrink: 0; } .sok_card_product:not(._list) .old_price { display: flex; align-items: flex-start; gap: 6px; min-height: 21px; font-size: 15px; font-weight: 400; line-height: 1.4; color: #94a3b8; white-space: nowrap; } .sok_card_product:not(._list) .old_price span { text-decoration: line-through; } .sok_card_product:not(._list) .product_price-cart { display: flex; align-items: end; justify-content: flex-end; } .sok_card_product:not(._list) .price { display: flex; align-items: flex-end; justify-content: flex-start; gap: 5px; flex: 1; min-width: 0; min-height: 24px; color: var(--color-heading); white-space: nowrap; overflow: hidden; } .sok_card_product:not(._list) .price-prefix { font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_card_product:not(._list) .price-value { font-size: 20px; font-weight: 600; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; flex-shrink: 0; } .sok_card_product:not(._list) .in_card { flex-shrink: 0; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 2px; background: var(--color-blue); box-shadow: none; display: flex; align-items: center; justify-content: center; cursor: pointer; } .sok_card_product:not(._list) .in_card img { width: 16px; height: 16px; display: block; } .sok_card_product:not(._list) .in_card:hover, .sok_card_product:not(._list) .in_card._active { background-color: var(--color-blue-hover); color: var(--color-white); } @media (max-width: 767px) { .sok_card_product:not(._list) { width: 140px; min-height: auto; } .sok_card_product:not(._list) .product-img { height: 120px; min-height: 120px; } .sok_card_product:not(._list) .product_content { height: auto; padding: 8px; gap: 12px; justify-content: flex-start; } .sok_card_product:not(._list) .article span { font-size: 10px; } .sok_card_product:not(._list) .product_name a { font-size: 11px; -webkit-line-clamp: 3; } .sok_card_product:not(._list) .old_price { min-height: 17px; } .sok_card_product:not(._list) .price-prefix { font-size: 11px; } .sok_card_product:not(._list) .price-value { font-size: 15px; } .sok_card_product:not(._list) .product_price { grid-template-columns: 1fr; align-items: start; } .sok_card_product:not(._list) .price { min-height: 0; } .sok_card_product:not(._list) .in_card { width: 100%; height: 32px; margin-top: 0; } .sok_card_product:not(._list) .in_card img { width: 13px; height: 13px; } } /*Стили карточки товара (product) END */ /* End */ /* Start:/local/templates/main/css/components/service-card.css?17841810232940*/ /*Стили карточки услуги (service) */ .discount { padding: 4px 8px; border-radius: 8px; background: var(--color-yellow-light); box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); color: var(--color-black); font-size: 12px; font-weight: 400; display: flex; align-items: center; gap: 4px; height: 26px; } .discount._yellow { background-color: var(--color-yellow-light); } .discount._white { background-color: var(--color-white); } .sok_card_service { width: 366px; min-height: 0; display: flex; flex-direction: column; row-gap: 12px; border: 0; background: transparent; border-radius: 4px; transition: color var(--transition); position: relative; color: inherit; text-decoration: none; } .sok_card_service:hover, .sok_card_service:focus { background: transparent; color: inherit; } .sok_card_service .sok_card_service-img { position: relative; width: 100%; aspect-ratio: 331 / 240; display: block; overflow: hidden; border-radius: 8px; } .sok_card_service .sok_card_service-img::after { content: ""; position: absolute; inset: 0; background: var(--color-plate-hover); opacity: 0; transition: opacity var(--transition); pointer-events: none; } .sok_card_service:hover .sok_card_service-img::after, .sok_card_service:focus .sok_card_service-img::after { opacity: 0.5; } .sok_card_service .sok_card_service-img img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; display: block; transition: transform var(--transition); } .sok_card_service:hover .sok_card_service-img img, .sok_card_service:focus .sok_card_service-img img { transform: none; } .sok_card_service .sok_card_service-img .discounts_list { position: absolute; display: flex; align-items: center; flex-wrap: wrap; bottom: 0; padding: 10px; gap: 7px; z-index: 1; } .sok_card_service .sok_card_content { display: flex; flex-direction: column; row-gap: 0; padding: 0; font-size: 16px; font-weight: 700; } .sok_card_service .sok_card_content p { color: var(--color-gray); font-size: 14px; font-weight: 400; margin: 0; } .sok_card_service .sok_card_content span { display: -webkit-box; width: 100%; min-height: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; font-size: 16px; font-weight: 700; line-height: 1.2; color: var(--color-heading); transition: color var(--transition); } .sok_card_service:hover .sok_card_content span, .sok_card_service:focus .sok_card_content span { color: var(--color-blue); } @media (max-width: 1199px) { .sok_card_service { width: 216px; } } @media (max-width: 767px) { .sok_card_service { width: 189px; } .sok_card_service .sok_card_content span { font-size: 11px; } } /*Стили карточки услуги (service) END */ /* End */ /* Start:/local/templates/main/css/components/sections.css?17878014942421*/ /* Страница «Разделы каталога» — сетка; карточки как в carousel */ .sok_catalog-sections.page_section { padding-top: 0; padding-bottom: 40px; } .sok_catalog-sections .catalog-menu-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-bottom: 0; } .sok_catalog-sections .catalog_menu-card { width: 100%; height: auto; min-height: 200px; padding: 10px; border-radius: 8px; background: var(--color-plate); display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 0; box-sizing: border-box; } .sok_catalog-sections .catalog_menu-card:hover { background: var(--color-plate-hover); } .sok_catalog-sections .catalog_menu-card span { min-height: 50px; font-size: 16px; font-weight: 700; color: var(--color-heading); text-align: center; display: flex; align-items: center; justify-content: center; width: 100%; } .sok_catalog-sections .catalog_menu-card .catalog_menu-card-img { width: 190px; height: 100%; min-height: 130px; max-height: 160px; display: flex; align-items: center; justify-content: center; } .sok_catalog-sections .catalog_menu-card-img img { width: 150px; height: auto; max-width: none; max-height: 122px; object-fit: contain; } @media (max-width: 1199px) { .sok_catalog-sections.page_section { padding-bottom: 60px; } .sok_catalog-sections .catalog-menu-list { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } } @media (max-width: 767px) { .sok_catalog-sections.page_section { padding-bottom: 40px; } .sok_catalog-sections .catalog-menu-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } /* Перебить legacy .catalog-menu-list из catalog-list.css */ .sok_catalog-sections .catalog-menu-list .catalog_menu-card { height: auto; min-height: 200px; padding: 10px; } .sok_catalog-sections .catalog-menu-list .catalog_menu-card .catalog_menu-card-img { width: 190px; min-height: 130px; max-height: 160px; } .sok_catalog-sections .catalog-menu-list .catalog_menu-card-img img { width: 150px; height: auto; max-width: none; max-height: 122px; } .sok_catalog-sections .catalog-menu-list .catalog_menu-card span { font-size: 16px; min-height: 50px; } } /* End */ /* Start:/local/templates/main/css/components/services.css?17878014949341*/ /* Страница «Услуги» — корневой список */ .sok_services-page.page_section { padding-top: 0; padding-bottom: 40px; } .sok_services-page.page_section + .sok_services-page.page_section { padding-top: 0; } .sok_services-page .sok_services-intro { max-width: 817px; margin: 0; color: var(--color-text); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } /* featured-card — блок «Металлообработка» */ .sok_service-featured { display: flex; align-items: flex-start; gap: 30px; padding: 30px; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 10px; background: var(--color-white); } .sok_service-featured__media { flex: 0 0 326px; width: 326px; min-width: 0; min-height: 0; } .sok_service-featured__media img { display: block; width: 100%; height: 229px; min-width: 0; min-height: 0; object-fit: cover; border-radius: 4px; } .sok_service-featured__content { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 24px; } .sok_service-featured__content ._h2 { margin: 0; font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; color: var(--color-heading); } .sok_service-featured__links { display: flex; flex-wrap: wrap; gap: 7px; } .sok_service-subsection { display: inline-flex; align-items: center; gap: 5px; padding: 12px 10px; border-radius: 4px; background: var(--color-plate); color: var(--color-text); font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; text-decoration: none; word-break: break-word; transition: background-color var(--transition), color var(--transition); } .sok_service-subsection span { word-break: break-word; } .sok_service-subsection img { flex-shrink: 0; width: 18px; height: 18px; min-width: 0; min-height: 0; } .sok_service-subsection:hover, .sok_service-subsection:focus-visible { background: var(--color-plate-hover); color: var(--color-blue); text-decoration: none; } /* Сетка корневых услуг — Figma card-uslugi: * 1920: 4×366 | 1440: 4×331 | 768: 2×358 | ≤570: 1 col | 360: padding 12 */ .sok_services-page .detail_list.sok_services-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(366px, 1fr)); gap: 12px; margin-bottom: 0; align-items: stretch; } /* card-uslugi — дельта поверх service-card.css (карточка не ссылка целиком) */ .sok_services-page .sok_card_service, .sok_service-list-page .sok_card_service { width: 100%; min-width: 0; min-height: 0; height: 100%; padding: 20px; gap: 20px; border-radius: 8px; background: var(--color-plate); } .sok_services-page .sok_card_service:hover, .sok_services-page .sok_card_service:focus, .sok_service-list-page .sok_card_service:hover, .sok_service-list-page .sok_card_service:focus { background: var(--color-plate); } .sok_services-page .sok_card_service .sok_card_service-img::after, .sok_service-list-page .sok_card_service .sok_card_service-img::after { display: none; } .sok_services-page .sok_card_service .sok_card_content, .sok_service-list-page .sok_card_service .sok_card_content { flex: 1 1 auto; min-height: 0; } .sok_services-page .sok_card_service-actions, .sok_service-list-page .sok_card_service-actions { display: flex; flex-direction: column; gap: 20px; margin-top: auto; width: 100%; } .sok_services-page .sok_card_service-title, .sok_service-list-page .sok_card_service-title { display: block; color: inherit; text-decoration: none; } .sok_services-page .sok_card_service-title span, .sok_service-list-page .sok_card_service-title span { display: block; -webkit-line-clamp: unset; overflow: visible; font-size: 18px; font-weight: 600; line-height: 1.2; color: var(--color-heading); word-break: break-word; transition: color var(--transition); } .sok_services-page .sok_card_service-title:hover span, .sok_services-page .sok_card_service-title:focus-visible span, .sok_service-list-page .sok_card_service-title:hover span, .sok_service-list-page .sok_card_service-title:focus-visible span { color: var(--color-blue); } .sok_services-page .sok_card_service-more, .sok_service-list-page .sok_card_service-more { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; padding: 0; border: 0; background: transparent; color: var(--color-heading); font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1; text-decoration: none; transition: color var(--transition); } .sok_services-page .sok_card_service-more img, .sok_service-list-page .sok_card_service-more img { flex-shrink: 0; width: 16px; height: 16px; min-width: 0; min-height: 0; } .sok_services-page .sok_card_service-more:hover, .sok_services-page .sok_card_service-more:focus-visible, .sok_service-list-page .sok_card_service-more:hover, .sok_service-list-page .sok_card_service-more:focus-visible { color: var(--color-blue); text-decoration: none; } .sok_services-page .sok_card_service-request, .sok_service-list-page .sok_card_service-request { height: 40px; padding: 0 28px; border-radius: 4px; } /* Модалка «Заказать услугу» — дельта поверх sok_callback-modal (ruslava-template.css) */ .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__head { padding-right: 32px; border-bottom: 0; } .modal .modal_dialog.sok_service-request-modal .modal_close-icon { top: 20px; right: 20px; } .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__form { gap: 15px; } .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__body, .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__fields { display: flex; flex-direction: column; gap: 25px; } .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px; } .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__comment { min-height: 112px; height: 112px; resize: vertical; padding-top: 8px; padding-bottom: 8px; } @media (max-width: 1440px) { .sok_services-page .sok__container { padding-left: 40px; padding-right: 40px; } .sok_services-page .detail_list.sok_services-grid { grid-template-columns: repeat(auto-fill, minmax(331px, 1fr)); } } @media (max-width: 1199px) { .sok_services-page.page_section { padding-bottom: 32px; } .sok_services-page .sok__container { padding-left: 20px; padding-right: 20px; } .sok_service-featured { flex-direction: column; padding: 20px; gap: 20px; } .sok_service-featured__media { flex: none; width: 100%; } .sok_service-featured__media img { height: auto; aspect-ratio: 326 / 229; } .sok_services-page .detail_list.sok_services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .modal .modal_dialog.sok_service-request-modal { max-width: 100% !important; width: 100%; height: 100%; max-height: 100%; border-radius: 0; padding: 20px 40px; gap: 30px; } .modal .modal_dialog.sok_service-request-modal .sok_callback-modal__title { font-size: 35px !important; letter-spacing: -1px; } .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__head { padding-right: 0; padding-bottom: 20px; border-bottom: 1px solid var(--color-light); } .modal .modal_dialog.sok_service-request-modal .modal_top .modal_close-icon { top: 0; right: 0; } .modal .modal_dialog.sok_service-request-modal .modal_form .input-text { font-size: 14px; } } @media (max-width: 570px) { .sok_services-page .sok__container { padding-left: 12px; padding-right: 12px; } .sok_services-page .detail_list.sok_services-grid { grid-template-columns: 1fr; } .sok_services-page .sok_card_service, .sok_service-list-page .sok_card_service { padding: 12px; gap: 12px; } .sok_services-page .sok_card_service-title span, .sok_service-list-page .sok_card_service-title span { font-size: 16px; } } @media (max-width: 430px) { .modal .modal_dialog.sok_service-request-modal { padding: 20px; } .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__fields, .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__row { gap: 15px; } .modal .modal_dialog.sok_service-request-modal .sok_service-request-modal__row { display: flex; flex-direction: column; } } @media (max-width: 767px) { .sok_services-page.page_section { padding-bottom: 24px; } .sok_service-featured { padding: 16px; } .sok_service-subsection { font-size: 12px; padding: 10px 8px; } .modal .modal_dialog.sok_service-request-modal .sok_callback-modal__title { font-size: 21px !important; letter-spacing: -0.03em; } .modal .modal_dialog.sok_service-request-modal .sok_callback-modal__agreement { font-size: 10px; line-height: 1.1; } } /* End */ /* Start:/local/templates/main/css/components/service-list.css?17878014946159*/ /* Страница «Список услуг в подразделе» */ .sok_service-list-page.page_section { padding-top: 0; padding-bottom: 40px; } .sok_service-list-page.page_section + .sok_service-list-page.page_section { padding-top: 0; } .sok_service-list-layout { display: flex; align-items: flex-start; gap: 30px; min-width: 0; max-width: 100%; } .sok_service-list-content { flex: 1 1 auto; min-width: 0; max-width: 100%; } /* Desktop-навигация */ .sok_service-nav__desktop { flex: 0 0 288px; width: 288px; min-width: 0; } .sok_service-nav__mobile { display: none; } .sok_service-nav__block { border: 1px solid rgba(158, 180, 204, 0.4); border-radius: 10px; overflow: hidden; } .sok_service-nav__section { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 9px 16px; border: 0; border-radius: 10px 10px 0 0; background: transparent; color: #010117; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; text-align: left; cursor: pointer; } .sok_service-nav__section span { flex: 1 1 auto; min-width: 0; word-break: break-word; } .sok_service-nav__chevron { flex-shrink: 0; width: 18px; height: 18px; min-width: 0; min-height: 0; transition: transform var(--transition); } .sok_service-nav__block._expanded .sok_service-nav__chevron { transform: rotate(180deg); } .sok_service-nav__list { display: flex; flex-direction: column; gap: 15px; margin: 0; padding: 10px 16px 10px 20px; list-style: none; } ._content .sok_service-nav__list { margin-bottom: 0; } ._content .sok_service-nav__list li { list-style: none; font-size: inherit; font-weight: inherit; line-height: inherit; } ._content .sok_service-nav__list li::marker { content: none; } .sok_service-nav__block._collapsed .sok_service-nav__list { display: none; } .sok_service-nav__link { display: block; color: var(--color-gray); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; text-decoration: none; word-break: break-word; transition: color var(--transition); } .sok_service-nav__link:hover, .sok_service-nav__link:focus-visible { color: var(--color-blue); text-decoration: none; } .sok_service-nav__link._active { color: var(--color-blue); } /* Сетка услуг подраздела */ .sok_service-list-page .detail_list.sok_service-list-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 0; align-items: stretch; } .sok_service-list-content .sok_list-pagination { margin-top: 30px; } @media (max-width: 1440px) { .sok_service-list-page .sok__container { padding-left: 40px; padding-right: 40px; } } @media (max-width: 1199px) { .sok_service-list-layout { flex-direction: column; gap: 0; } .sok_service-nav__desktop { display: none; } .sok_service-nav { width: 100%; max-width: 100%; min-width: 0; } .sok_service-nav__mobile { display: flex; flex-direction: column; width: 100%; max-width: 100%; min-width: 0; margin-bottom: 10px; } .sok_service-nav__tabs { display: flex; align-items: stretch; width: 100%; max-width: 100%; min-width: 0; border-bottom: 1px solid rgba(158, 180, 204, 0.25); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; } .sok_service-nav__tabs::-webkit-scrollbar { display: none; } .sok_service-nav__tab { flex: 0 0 auto; padding: 7px 0 20px; margin-right: 24px; border-bottom: 2px solid transparent; color: var(--color-text); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; text-decoration: none; white-space: nowrap; transition: color var(--transition), border-color var(--transition); } .sok_service-nav__tab:last-child { margin-right: 0; } .sok_service-nav__tab._active { border-bottom-color: var(--color-blue); color: var(--color-blue); } .sok_service-nav__chips { display: flex; flex-wrap: nowrap; gap: 8px; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; padding: 15px 0 24px; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none; } .sok_service-nav__chips::-webkit-scrollbar { display: none; } .sok_service-nav__chip { flex: 0 0 auto; max-width: none; padding: 14px; border: 1px solid rgba(158, 180, 204, 0.4); border-radius: 5px; background: var(--color-white); color: var(--color-text); font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; text-decoration: none; white-space: nowrap; transition: background-color var(--transition), border-color var(--transition), color var(--transition); } .sok_service-nav__chip:hover, .sok_service-nav__chip:focus-visible { border-color: var(--color-blue); color: var(--color-blue); text-decoration: none; } .sok_service-nav__chip._active { border-color: var(--color-blue); background: var(--color-blue); color: var(--color-white); } } .sok_service-list-content .sok_list-pagination { margin-top: 30px; } @media (max-width: 1199px) { .sok_service-list-page.page_section { padding-bottom: 32px; overflow-x: clip; } .sok_service-list-page .sok__container { padding-left: 20px; padding-right: 20px; min-width: 0; max-width: 100%; } .sok_service-list-page .detail_list.sok_service-list-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 570px) { .sok_service-list-page .sok__container { padding-left: 12px; padding-right: 12px; } } @media (max-width: 767px) { .sok_service-list-page.page_section { padding-bottom: 24px; } .sok_service-list-page .detail_list.sok_service-list-grid { grid-template-columns: 1fr; } } /* End */ /* Start:/local/templates/main/css/components/service-detail.css?17841810235908*/ /* Страница «Детальная услуга» */ .sok_service-detail-page.page_section { /* 32px (h1 margin-bottom) + 28px = 60px до контента по макету (без лишнего py у h1) */ padding-top: 28px; padding-bottom: 60px; } .sok_service-detail-page .sok__container { max-width: none; padding-left: 210px; padding-right: 210px; } .sok_service-detail { max-width: 1080px; margin: 0 auto; } .sok_service-detail .detail-content { display: flex; flex-direction: column; gap: 32px; max-width: none; margin: 0; } /* Кнопка «Вернуться к списку» */ .sok_service-detail__back { display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 20px; border-radius: 4px; border: 1px solid var(--color-plate); background: var(--color-plate); color: var(--color-heading); font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1; text-decoration: none; width: max-content; } .sok_service-detail__back:hover { background: var(--color-plate-hover); border-color: var(--color-plate-hover); } .sok_service-detail__back img { display: block; width: 16px; height: 16px; min-width: 0; min-height: 0; transform: rotate(180deg); } /* Hero-image */ .sok_service-detail .detail-img.sok_service-detail__media { width: 100%; min-width: 0; } .sok_service-detail .detail-img.sok_service-detail__media img { display: block; width: 100%; height: 520px; min-width: 0; min-height: 0; max-height: none; object-fit: cover; border-radius: 10px; box-shadow: none; } /* CTA «Заказать услугу» */ .sok_service-detail__order { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 30px; border-radius: 8px; background: var(--color-plate); } .sok_service-detail__order-text { display: flex; flex: 1 1 auto; flex-direction: column; gap: 12px; min-width: 0; } .sok_service-detail__order-text ._h2 { margin: 0; font-family: var(--font-family-base); font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -1px; color: var(--color-heading); } .sok_service-detail__order-text p { margin: 0; max-width: 556px; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; color: #2C4053; } .sok_service-detail__order-btn { flex-shrink: 0; } /* Табы */ .sok_service-detail__tabs { display: flex; flex-direction: column; gap: 24px; } .sok_service-detail__tab-nav { display: flex; gap: 64px; height: 46px; border-bottom: 1px solid rgba(158, 180, 204, 0.25); } .sok_service-detail__tab { display: flex; align-items: center; justify-content: center; padding: 7px 0 20px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: transparent; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; color: var(--color-gray); cursor: pointer; } .sok_service-detail__tab._active { color: #010117; border-bottom-color: var(--color-blue); } .sok_service-detail__tab-panel { display: none; flex-direction: column; gap: 60px; } .sok_service-detail__tab-panel._active { display: flex; } .sok_service-detail__description { display: flex; flex-direction: column; gap: 15px; } .sok_service-detail__description p { margin: 0; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; color: #010117; } /* «Как мы работаем?» */ .sok_service-detail__how-we-work { display: flex; flex-direction: column; gap: 24px; } .sok_service-detail__how-we-work ._h3 { margin: 0; font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; color: var(--color-heading); } ._content .sok_service-detail__steps { display: block; margin: 0; padding-left: 22px; gap: 0; } ._content .sok_service-detail__steps li { list-style: disc; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; color: #010117; } ._content .sok_service-detail__steps li::marker { color: #010117; } .sok_service-detail__how-we-work-footer { margin: 0; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; color: #010117; } @media (max-width: 1440px) { .sok_service-detail-page .sok__container { padding-left: 40px; padding-right: 40px; } } @media (max-width: 1199px) { .sok_service-detail-page .sok__container { padding-left: 20px; padding-right: 20px; } .sok_service-detail .detail-img.sok_service-detail__media img { height: 410px; } .sok_service-detail__order { flex-direction: column; align-items: flex-start; gap: 20px; padding: 20px; } .sok_service-detail__order-text ._h2 { font-size: 21px; } .sok_service-detail__order-text p { max-width: none; } .sok_service-detail__order-btn { width: auto; } } @media (max-width: 767px) { .sok_service-detail-page.page_section { /* 20px (h1 margin-bottom) + 20px = 40px до контента */ padding-top: 20px; padding-bottom: 40px; } .sok_service-detail-page .sok__container { padding-left: 12px; padding-right: 12px; } .sok_service-detail__back { padding: 0 15px; font-size: 12px; line-height: 1.1; } .sok_service-detail .detail-img.sok_service-detail__media img { height: 207px; } .sok_service-detail__tab { font-size: 14px; } .sok_service-detail__description p, .sok_service-detail__how-we-work-footer, ._content .sok_service-detail__steps li { font-size: 12px; } .sok_service-detail__how-we-work ._h3 { font-size: 16px; } .sok_service-detail__order-text p { font-size: 12px; } } /* End */ /* Start:/local/templates/main/css/components/viewed.css?17841810142520*/ /*Стили карточки Вы смотрели */ .swiper .you_watch_card_product { width: 233px; height: 337px; } .swiper .you_watch_card_product .product-img { display: flex; align-items: center; height: 100%; max-width: 213px; max-height: 213px; } .swiper .you_watch_card_product .product-img img { max-width: 213px; max-height: 213px; height: max-content; object-fit: contain; } .you_watch_card_product { display: flex; flex-direction: column; align-items: center; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); border-radius: 20px; padding: 10px; background-color: var(--color-white); transition: all var(--transition); } .you_watch_card_product:hover { /* new hover */ box-shadow: 0px 0px 12px 4px rgba(30, 41, 59, 0.08), 0px 0px 16px -1px rgba(30, 41, 59, 0.16); } .you_watch_card_product .product-img { position: relative; width: 100%; display: flex; justify-content: center; } .you_watch_card_product .product-img img { border-radius: 10px; } .you_watch_card_product .product_content { display: flex; flex-direction: column; padding-top: 10px; row-gap: 10px; width: 100%; } .you_watch_card_product .product_content .product_price_in_cart { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; } .you_watch_card_product .product_content .product_price_in_cart .price { display: flex; justify-content: space-between; align-items: center; overflow: hidden; text-overflow: ellipsis; font-size: 20px; font-weight: 600; line-height: 120%; } .you_watch_card_product .product_content .product_price_in_cart .in_card { padding: 7px; margin: 5px 1px; margin-left: auto; } .you_watch_card_product .product_content .product_name a { display: -webkit-box; width: 100%; min-height: 36px; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; font-size: 14px; font-weight: 300; } @media (max-width: 480px) { .swiper .you_watch_card_product { width: 160px; height: 264px; } .swiper .you_watch_card_product .product_content .product_name a { font-size: 14px; min-height: 30px; -webkit-line-clamp: 4; } .swiper .you_watch_card_product .product_content .product_price_in_cart .price { font-size: 16px; } .swiper .you_watch_card_product .product-img img { width: 140px; height: 140px; } } /*Стили карточки Вы смотрели END */ /* End */ /* Start:/local/templates/main/css/components/pagination.css?17841810236011*/ /*Стили карточки Корзины */ /* .cart-item { border-radius: 20px; background: var(--color-white); padding: 20px; width: 100%; box-shadow: 0px 0px 2px 1px rgba(30, 41, 59, 0.04), 0px 0px 8px -1px rgba(30, 41, 59, 0.12); display: flex; gap: 40px; position: relative; display: grid; grid-template-columns: 1fr 1fr; } .cart-item .cart_close { position: absolute; top: 0; right: 0; margin: 20px; cursor: pointer; display: flex; } .cart-item .cart_close svg { fill: var(--color-light-gray); margin: 4px; } .cart-item .cart_close:hover svg { fill: var(--color-red); } .cart-item .cart-image-description { display: flex; gap: 40px; align-items: center; width: 100%; } .cart-item .cart-image-description .cart-image { max-width: 140px; height: max-content; max-height: 140px; display: flex; justify-content: center; min-height: 140px; min-width: 140px; align-items: center; } .cart-item .cart-image-description .cart-image img { max-width: 100%; height: 100%; max-height: 140px; border-radius: 10px; } .cart-item .cart-image-description .cart-description { max-width: 466px; display: flex; flex-direction: column; gap: 10px; } .cart-item .cart-image-description .cart-description .cart-title { font-size: 18px; font-weight: 500; } .cart-item .cart-image-description .cart-description .article-status { display: flex; gap: 10px; align-items: center; } .cart-item .cart-image-description .cart-description .article-status .article { color: var(--color-neutral-500); font-size: 12px; font-weight: 400; line-height: 18px; } .cart-item .cart-counter-price { display: flex; align-items: center; gap: 40px; justify-content: space-between; margin-right: 60px; } .cart-item .cart-counter-price .cart-counter { display: flex; flex-direction: column; gap: 10px; } .cart-item .cart-counter-price .cart-counter .cart-counter-per-price { color: var(--color-neutral-500); font-size: 14px; font-weight: 200; line-height: 120%; white-space: nowrap; } .cart-item .cart-counter-price .cart-price { display: flex; flex-direction: column; gap: 4px; } .cart-item .cart-counter-price .cart-price .price { text-overflow: ellipsis; font-size: 20px; font-weight: 600; line-height: 120%; white-space: nowrap; } .cart-item .cart-counter-price .cart-price .old-price { color: var(--color-neutral-500); font-size: 14px; font-weight: 300; line-height: 120%; white-space: nowrap; } .cart-item._remove { display: flex; justify-content: space-between; align-items: center; } .cart-item._remove .cart-remove-info { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .cart-item._remove .cart-remove-info .cart-item-name { font-size: 14px; font-weight: 500; } .cart-item._remove .cart-remove-info .cart-item-message { font-size: 16px; font-weight: 200; line-height: 130%; } .cart-item._remove .cart-save-close { position: relative; display: flex; align-items: center; gap: 30px; } .cart-item._remove .cart-save-close .cart-save { color: var(--color-red); font-size: 16px; font-weight: 200; line-height: 130%; cursor: pointer; } .cart-item._remove .cart-save-close .cart_close { position: relative; margin: 0; } */ .price-flex { display: flex; align-items: center; gap: 6px; white-space: nowrap; } .product_counter_container{ display: flex; align-items: center; gap: 25px; } .product_counter { display: flex; gap: 8px; padding: 3px 20px; border-radius: 10px; align-items: center; background: var(--color-light); width: max-content; height: 40px; transition: all var(--transition); user-select: none; } .product_counter:hover { background: var(--color--card-hover); } .product_counter .control_button { cursor: pointer; user-select: none; } .product_counter ._counter-input { background: none; border: none; width: max-content; text-align: center; width: 47px; user-select: none; } .ratio_info{ display: flex; gap: 6px; align-items: center; } .ratio_info span{ font-weight: 400; } @media (max-width: 1280px) { /* .cart-item { gap: 10px; } .cart-item .cart-image-description { gap: 10px; } .cart-item .cart-image-description .cart-image { min-width: 70px; min-height: 70px; width: 70px; } .cart-item .cart-counter-price { margin-right: 40px; gap: 10px; } */ } @media (max-width: 1199px) { /* .cart-item { gap: 20px; } .cart-item .cart-image-description { gap: 20px; } .cart-item .cart-image-description .cart-description { max-width: 396px; } .cart-item .cart-counter-price { gap: 20px; } */ .product_counter_container{ display: flex; align-items: flex-start; gap: 25px; flex-direction: column; } } @media (max-width: 1199px) { /* .cart-item._remove { flex-direction: row; align-items: center; } .cart-item._remove .cart-remove-info { gap: 2px; } .cart-item._remove .cart-remove-info .cart-item-name { font-size: 14px; } .cart-item._remove .cart-remove-info .cart-item-message { font-size: 14px; } .cart-item._remove .cart-save-close .cart-save { font-size: 14px; } .cart-item._remove .cart-save-close { gap: 4px; } .cart-item { display: flex; column-gap: 12px; row-gap: 14px; flex-direction: column; } .cart-item .cart-image-description { align-items: flex-start; } .cart-item .cart-image-description .cart-image { min-width: 60px; min-height: 60px; } .cart-item .cart-image-description .cart-description { gap: 6px; margin-right: 30px; } .cart-item .cart-image-description .cart-description .cart-title { font-size: 14px; } .cart-item .cart-counter-price { margin: 0; flex-wrap: wrap; } */ } @media (max-width: 480px) { /* .cart-item .cart-image-description { flex-wrap: wrap; } */ } /*Стили карточки Корзины END */ /* End */ /* Start:/local/templates/main/css/components/list-pagination.css?17878203503256*/ /* Универсальный блок: «Показать ещё» + постраничная навигация (Figma 146:12230) */ .sok_list-pagination.content-nav { gap: 30px; margin-top: 0; margin-bottom: 0; padding: 20px 0; } .sok_list-pagination .sok_list-pagination__more { min-width: 0; } .sok_list-pagination.content-nav .pagination { gap: 8px; } .sok_list-pagination.content-nav .pagination .pagination__prev, .sok_list-pagination.content-nav .pagination .pagination__next { display: inline-flex; flex-shrink: 0; width: 49px; height: 49px; align-items: center; justify-content: center; border: 0; border-radius: 5px; background: var(--color-white); text-decoration: none; transition: opacity var(--transition); } .sok_list-pagination.content-nav .pagination .pagination__prev:hover:not(._disable), .sok_list-pagination.content-nav .pagination .pagination__next:hover:not(._disable) { text-decoration: none; } .sok_list-pagination.content-nav .pagination .pagination__prev img, .sok_list-pagination.content-nav .pagination .pagination__next img { display: block; width: 20px; height: 20px; min-width: 0; min-height: 0; } .sok_list-pagination.content-nav .pagination .pagination__prev._disable, .sok_list-pagination.content-nav .pagination .pagination__next._disable { pointer-events: none; } .sok_list-pagination.content-nav .pagination .pagination__prev._disable img, .sok_list-pagination.content-nav .pagination .pagination__next._disable img { opacity: 0.35; } .sok_list-pagination.content-nav .pagination .pagination__btn { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 49px; width: 49px; height: 49px; padding: 0; border: 1.235px solid rgba(158, 180, 204, 0.4); border-radius: 5px; background: var(--color-white); color: #2c4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; text-decoration: none; transition: border-color var(--transition), color var(--transition), background-color var(--transition); } .sok_list-pagination.content-nav .pagination .pagination__btn:hover { border-color: var(--color-blue); border-radius: 5px; color: var(--color-blue); background: var(--color-white); text-decoration: none; } .sok_list-pagination.content-nav .pagination .pagination__btn._active { border: 1.235px solid var(--color-blue); border-radius: 5px; background: var(--color-blue); color: var(--color-white); } .sok_list-pagination.content-nav .pagination .pagination__btn._ellipsis { width: auto; min-width: 0; padding: 0 4px; border: 0; border-radius: 0; background: transparent; color: #2c4053; pointer-events: none; } @media (max-width: 1199px) { .sok_list-pagination.content-nav { gap: 24px; padding: 16px 0; } } @media (max-width: 767px) { .sok_list-pagination.content-nav .pagination .pagination__prev, .sok_list-pagination.content-nav .pagination .pagination__next, .sok_list-pagination.content-nav .pagination .pagination__btn { width: 44px; min-width: 44px; height: 44px; } .sok_list-pagination.content-nav .pagination .pagination__btn { font-size: 14px; } } /* End */ /* Start:/local/templates/main/css/components/content-left-menu.css?1787801494381*/ /* Сетка контентных страниц с левым меню (sidebar + page-content) */ .page-container.content__grid { grid-template-columns: 288px minmax(0, 1fr); gap: 40px; } .page-container.content__grid .page__sidebar { width: 288px; min-width: 0; } @media (max-width: 1199px) { .page-container.content__grid { grid-template-columns: auto; } } /* End */ /* Start:/local/templates/main/css/components/content-page.css?17841810231881*/ /* Универсальные стили контентных страниц Ruslava (.page-content) */ .page-content { display: flex; flex-direction: column; gap: 10px; } .page-content > p { margin: 0; color: #2d2d2d; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .page-content > ul { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; } .page-content > ul > li { position: relative; padding-left: 1em; list-style: none; color: #2d2d2d; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .page-content > ul > li::before { content: "•"; position: absolute; left: 0; } .page-content > h2 { margin: 0; color: var(--color-heading); font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; } .page-content > h2:not(:first-child) { margin-top: 50px; } .page-content > h2 + .detail-block { margin-top: 5px; } .page-content > .detail-block { display: flex; flex-direction: column; gap: 20px; padding: 20px; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 10px; } .page-content > .detail-block p { margin: 0; color: #2d2d2d; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .page-content > .detail-block p strong { font-weight: 500; font-size: 16px; line-height: 1.1; } @media (max-width: 767px) { .page-content > p, .page-content > .detail-block p, .page-content > ul > li { font-size: 12px; } .page-content > h2 { font-size: 16px; } .page-content > h2:not(:first-child) { margin-top: 22px; } .page-content > h2 + .detail-block { margin-top: 0; } .page-content > .detail-block p strong { font-size: 14px; } } /* End */ /* Start:/local/templates/main/css/components/faq-list.css?17877288913706*/ /* BX news.list / faq — Figma 102:9387, 102:9395 */ /* FAQ-аккордеон и блок «Задать вопрос» (Figma 102:9387, 102:9395) */ .sok_faq-list { display: flex; flex-direction: column; gap: 9px; width: 100%; } .sok_faq-item { border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 8px; padding: 10px 20px; } .sok_faq-item__toggle { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 43px; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; } .sok_faq-item__question { flex: 1; min-width: 0; color: var(--color-heading); font-family: var(--font-family-base); font-size: 16px; font-weight: 600; line-height: 1.2; } .sok_faq-item__icon { position: relative; flex-shrink: 0; width: 18px; height: 18px; } .sok_faq-item__icon::before, .sok_faq-item__icon::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; background: #2c4053; transform: translate(-50%, -50%); transition: opacity 0.25s ease, transform 0.25s ease; } .sok_faq-item__icon::before { width: 2px; height: 18px; } .sok_faq-item__icon::after { width: 18px; height: 2px; } .sok_faq-item._active .sok_faq-item__icon::before { opacity: 0; transform: translate(-50%, -50%) rotate(90deg); } .sok_faq-item__answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.3s ease; } .sok_faq-item._active .sok_faq-item__answer { grid-template-rows: 1fr; } .sok_faq-item__answer-inner { overflow: hidden; min-height: 0; opacity: 0; padding-top: 0; transition: opacity 0.25s ease, padding-top 0.3s ease; } .sok_faq-item._active .sok_faq-item__answer-inner { opacity: 1; padding-top: 9px; } .sok_faq-item__answer p { margin: 0; color: #2d2d2d; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.4; } .sok_faq-ask { display: flex; align-items: center; gap: 150px; margin-top: 50px; padding: 20px; border-radius: 8px; background: var(--color-plate); font-family: var(--font-family-base); } .sok_faq-ask__content { display: flex; flex: 1; flex-direction: column; gap: 12px; min-width: 0; } .sok_faq-ask .sok_faq-ask__title { margin: 0; color: var(--color-heading); font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; } .sok_faq-ask .sok_faq-ask__text { margin: 0; color: #2d2d2d; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_faq-ask__btn { flex-shrink: 0; min-width: 218px; padding-left: 52px !important; padding-right: 52px !important; } @media (max-width: 1440px) { .sok_faq-ask { gap: 40px; } } @media (max-width: 1199px) { .sok_faq-ask { flex-direction: column; align-items: stretch; gap: 20px; margin-top: 30px; } .sok_faq-ask__btn { width: 100%; min-width: 0; } } @media (max-width: 767px) { .sok_faq-item { padding: 10px 16px; } .sok_faq-item__question { font-size: 14px; } .sok_faq-item__answer p { font-size: 12px; } .sok_faq-ask { margin-top: 22px; padding: 16px; gap: 16px; } .sok_faq-ask .sok_faq-ask__title { font-size: 16px; } .sok_faq-ask .sok_faq-ask__text { font-size: 12px; } } /* Модалка «Задать вопрос» — дельта поверх sok_service-request-modal */ @media (max-width: 1199px) { .modal .modal_dialog.sok_faq-question-modal .sok_service-request-modal__row:has(fieldset:only-child) { grid-template-columns: 1fr; } } /* End */ /* Start:/local/templates/main/css/components/contacts.css?17877336653355*/ /* Контакты: карточка + карта (Figma 111:7184) */ .sok_contacts-panel { display: flex; align-items: stretch; gap: 12px; width: 100%; min-width: 0; } .sok_contacts-info { display: flex; flex: 0 0 470px; flex-direction: column; gap: 28px; width: 470px; min-width: 0; padding: 20px; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 10px; } .sok_contacts-info .sok_contacts-info__list { display: flex; flex-direction: column; gap: 12px; flex-shrink: 0; margin: 0; margin-bottom: 0; padding: 0; list-style: none; } .sok_contacts-info__row { display: flex; align-items: center; gap: 10px; min-width: 0; } .sok_contacts-info__icon { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 40px; height: 40px; } .sok_contacts-info__icon img { display: block; width: 26px; height: 26px; min-width: 0; min-height: 0; object-fit: contain; } .sok_contacts-info__icon._map img { width: 40px; height: 40px; } .sok_contacts-info .sok_contacts-info__text { flex: 1; min-width: 0; color: #2d2d2d; font-family: var(--font-family-base); font-size: 18px; font-weight: 400; line-height: 1.2; text-decoration: none; } a.sok_contacts-info__text:hover, a.sok_contacts-info__text:focus-visible { color: var(--color-blue); text-decoration: none; } .sok_contacts-info__social { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; min-height: 88px; margin-top: auto; } .sok_contacts-info__social-link { display: block; flex-shrink: 0; line-height: 0; text-decoration: none; } .sok_contacts-info__social-link img { display: block; width: 46px; height: 46px; min-width: 0; min-height: 0; object-fit: contain; } .sok_contacts-map { flex: 1; min-width: 0; } .sok_contacts-map__canvas { width: 100%; height: 356px; overflow: hidden; border-radius: 10px; background: var(--color-plate); } /* Оболочка кастомного balloon (позиционирование — в JS layout) */ .sok_contacts-map__balloon-shell { position: absolute; background: transparent; box-shadow: none; border: 0; } /* Скрываем дефолтное оформление balloon Яндекс.Карт */ .sok_contacts-map [class*="balloon_layout_normal"], .sok_contacts-map [class*="balloon__layout"], .sok_contacts-map [class*="balloon__content"], .sok_contacts-map [class*="balloon__tail"], .sok_contacts-map [class*="balloon__close"] { background: transparent !important; box-shadow: none !important; border: 0 !important; padding: 0 !important; } .sok_contacts-map [class*="balloon__tail"], .sok_contacts-map [class*="balloon__close"] { display: none !important; } @media (max-width: 1200px) { .sok_contacts-panel { flex-direction: column; gap: 20px; } .sok_contacts-info { flex: none; width: 100%; } .sok_contacts-info__social { min-height: 0; margin-top: 0; } } @media (max-width: 1199px) { .sok_contacts-map__canvas { height: 280px; } } @media (max-width: 767px) { .sok_contacts-panel { gap: 16px; } .sok_contacts-info { padding: 16px; } .sok_contacts-info .sok_contacts-info__text { font-size: 14px; } .sok_contacts-map__canvas { height: 240px; } } /* End */ /* Start:/local/templates/main/css/components/branches.css?17841810234483*/ /* Филиалы: карта + карточки (Figma 122:8003) */ .sok_branches-panel { display: flex; flex-direction: column; gap: 10px; width: 100%; min-width: 0; } .sok_branches-map { padding: 30px; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 20px; background: #ffffff; } .sok_branches-map__canvas { width: 100%; height: 400px; overflow: hidden; border-radius: 10px; background: var(--color-plate); } .sok_branches-list { display: flex; flex-direction: column; gap: 10px; width: 100%; min-width: 0; } .sok_branch-card { width: 100%; min-width: 0; padding: 30px; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 20px; background: #ffffff; } .sok_branch-card._active { border-color: rgba(30, 43, 74, 0.35); } .sok_branch-card__inner { display: flex; gap: 30px; align-items: flex-start; width: 100%; min-width: 0; } .sok_branch-card__row { display: flex; flex: 1; gap: 10px; align-items: flex-start; min-width: 0; } .sok_branch-card__icon { display: flex; flex-shrink: 0; align-items: flex-start; justify-content: center; width: 24px; min-height: 24px; } .sok_branch-card__icon img { display: block; min-width: 0; min-height: 0; object-fit: contain; } .sok_branch-card__icon._map img { width: 24px; height: 24px; } .sok_branch-card__icon._time img { width: 16px; height: 16px; } .sok_branch-card__icon._phone img { width: 18px; height: 18px; } .sok_branch-card__icon._mail img { width: 20px; height: 20px; } .sok_branch-card__body { display: flex; flex: 1; flex-direction: column; gap: 10px; min-width: 0; } .sok_branch-card .sok_branch-card__city { margin: 0; padding: 0; border: 0; background: none; color: #1e2b4a; font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; text-align: left; text-decoration: underline; cursor: pointer; } .sok_branch-card .sok_branch-card__city:hover, .sok_branch-card .sok_branch-card__city:focus-visible { color: var(--color-blue); } .sok_branch-card .sok_branch-card__title, .sok_branch-card .sok_branch-card__address, .sok_branch-card .sok_branch-card__text, .sok_branch-card .sok_branch-card__hint { margin: 0; padding: 0; font-family: var(--font-family-base); } .sok_branch-card .sok_branch-card__title { color: #1e2b4a; font-size: 18px; font-weight: 600; line-height: 1.2; } .sok_branch-card .sok_branch-card__address, .sok_branch-card .sok_branch-card__text, .sok_branch-card .sok_branch-card__hint { color: #010117; font-size: 15px; font-weight: 400; line-height: 1.4; } /* Balloon — те же правила, что у contacts */ .sok_branches-map [class*="balloon_layout_normal"], .sok_branches-map [class*="balloon__layout"], .sok_branches-map [class*="balloon__content"], .sok_branches-map [class*="balloon__tail"], .sok_branches-map [class*="balloon__close"] { background: transparent !important; box-shadow: none !important; border: 0 !important; padding: 0 !important; } .sok_branches-map [class*="balloon__tail"], .sok_branches-map [class*="balloon__close"] { display: none !important; } @media (max-width: 1199px) { .sok_branches-map { padding: 20px; } .sok_branches-map__canvas { height: 340px; } .sok_branches-list { flex-direction: column; gap: 10px; } .sok_branch-card { width: 100%; padding: 30px; } .sok_branch-card__inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 10px; } .sok_branch-card__row { flex: none; width: 100%; min-width: 0; } } @media (max-width: 480px) { .sok_branch-card__inner { display: flex; flex-direction: column; gap: 30px; } } @media (max-width: 767px) { .sok_branches-list { flex-direction: column; } .sok_branch-card { width: 100%; padding: 20px; } .sok_branches-map__canvas { height: 226px; } .sok_branch-card__inner { display: flex; flex-direction: column; gap: 15px; } .sok_branch-card__row { width: 100%; } .sok_branch-card .sok_branch-card__body { gap: 5px; } .sok_branch-card .sok_branch-card__city, .sok_branch-card .sok_branch-card__title { font-size: 14px; } .sok_branch-card .sok_branch-card__address, .sok_branch-card .sok_branch-card__text, .sok_branch-card .sok_branch-card__hint { font-size: 12px; } } /* End */ /* Start:/local/templates/main/css/components/order.css?178783107613492*/ /* Страница «Заявка» (order) — desktop-first 1920 */ /* Убираем gap:10px у .page-content — иначе intro→список = 50px вместо 40 */ .page-content:has(> .sok_order) { gap: 0; } .main_content:has(.sok_order) { padding-bottom: 0; } .page-content .sok_order-intro { margin: 0 0 40px; color: #2c4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_order { display: flex; flex-direction: column; width: 100%; max-width: 1000px; margin: 0 auto; } .sok_order[hidden], .sok_order-intro[hidden] { display: none !important; } .sok_order .page_section { padding-top: 0; padding-left: 0; padding-right: 0; margin: 0; } .sok_order .sok_order-items-section { padding-bottom: 60px; } .sok_order .sok_order-form-section { padding-bottom: 80px; } /* --- Список товаров --- */ .sok_order-items { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; width: 100%; } .sok_order-slot { width: 100%; } .sok_order-item { position: relative; display: flex; align-items: center; gap: 23px; width: 100%; min-height: 180px; padding: 20px; background: var(--color-white); border: 1px solid rgba(148, 163, 184, 0.15); border-radius: 10px; box-sizing: border-box; } .sok_order-item__image { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 140px; height: 140px; overflow: hidden; border-radius: 10px; } .sok_order-item__image img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; object-fit: contain; } .sok_order-item__info { display: flex; flex: 1 1 auto; flex-direction: column; gap: 5px; min-width: 0; justify-content: center; } .sok_order-item__article { color: var(--color-neutral-500); font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 18px; letter-spacing: 0.24px; } .sok_order-item__title { color: var(--color-heading); font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; text-decoration: none; } .sok_order-item__title:hover, .sok_order-item__title:focus-visible { color: var(--color-blue); } .sok_order-item__specs { display: flex; flex-direction: column; gap: 10px; margin-top: 5px; color: #2c4053; font-family: var(--font-family-base); font-size: 14px; line-height: 1.1; } .sok_order-item__spec { display: flex; flex-wrap: wrap; gap: 5px; align-items: flex-start; } .sok_order-item__spec-label { font-weight: 400; } .sok_order-item__spec-value { font-weight: 500; } .sok_order-item__controls { display: flex; flex-shrink: 0; align-items: center; gap: 23px; } .sok_order-item__qty { display: flex; flex-shrink: 0; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 20px; background: var(--color-plate); border-radius: 5px; box-sizing: border-box; } .sok_order-item__qty-btn { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; padding: 0; border: 0; background: transparent; cursor: pointer; } .sok_order-item__qty-btn img { display: block; width: 16px; height: 16px; } .sok_order-item__qty-input { width: auto; min-width: 1.5em; max-width: 3em; height: auto; padding: 0; margin: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; text-align: center; color: #2c4053; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; } .sok_order-item__prices { display: flex; flex-direction: column; gap: 3px; justify-content: center; min-width: 119px; } .sok_order-item__total, .sok_order-item__unit { display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; } .sok_order-item__total { font-size: 18px; line-height: 1.2; } .sok_order-item__total .sok_order-item__price-prefix { color: #010117; font-weight: 400; } .sok_order-item__total .sok_order-item__price-amount { color: var(--color-heading); font-weight: 600; } .sok_order-item__unit { gap: 5px; color: #2c4053; font-size: 14px; font-weight: 400; line-height: 1.1; } .sok_order-item__unit .sok_order-item__price-prefix, .sok_order-item__unit .sok_order-item__price-amount { color: inherit; font-weight: 400; } .sok_order-item__remove { align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 4px; border: 0; border-radius: 8px; background: var(--color-white); cursor: pointer; } .sok_order-item__remove img, .sok_order-item-removed__close img { display: block; width: 20px; height: 20px; } /* --- Строка «удалён» --- */ .sok_order-item[hidden], .sok_order-slot._is-removed .sok_order-item { display: none !important; } .sok_order-item-removed[hidden] { display: none !important; } .sok_order-slot._is-removed .sok_order-item-removed { display: flex !important; } .sok_order-item-removed { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; padding: 20px; background: var(--color-white); border: 1px solid rgba(148, 163, 184, 0.15); border-radius: 6px; box-sizing: border-box; } .sok_order-item-removed__text { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 12px; align-items: center; min-width: 0; color: #010117; } .sok_order-item-removed__name { font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; } .sok_order-item-removed__message { font-family: var(--font-family-base); font-size: 15px; font-weight: 500; line-height: 1.4; } .sok_order-item-removed__actions { display: flex; flex-shrink: 0; align-items: center; gap: 30px; } .sok_order-item-removed__restore { padding: 0; border: 0; background: transparent; color: var(--color-blue); font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; cursor: pointer; white-space: nowrap; } .sok_order-item-removed__restore:hover, .sok_order-item-removed__restore:focus-visible { text-decoration: underline; } .sok_order-item-removed__close { display: inline-flex; align-items: center; justify-content: center; padding: 4px; border: 0; border-radius: 8px; background: var(--color-white); cursor: pointer; } /* --- Итого --- */ .sok_order-total { display: flex; align-items: center; align-self: flex-end; gap: 6px; /* gap списка 12 + 20 = 32px до «Итого» (Figma 218:19563) */ margin-top: 20px; } .sok_order-total__label { color: var(--color-heading); font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; } .sok_order-total__value { color: var(--color-heading); font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; white-space: nowrap; } /* --- Форма --- */ .sok_order-form { display: flex; flex-direction: column; gap: 20px; width: 100%; padding: 20px; margin-bottom: 0; background: var(--color-white); border: 1px solid rgba(148, 163, 184, 0.15); border-radius: 10px; box-sizing: border-box; } /* ._content p даёт 16px/200 — переопределяем по макету (h4 SemiBold 18) */ ._content .sok_order-form__title, .sok_order-form .sok_order-form__title { margin: 0; padding: 0; color: var(--color-heading); font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; } .sok_order-form__fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; width: 100%; } .sok_order-form__field { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; border: 0; min-width: 0; } .sok_order-form__field label { color: #010117; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_order-form__field .input-text { height: 48px; padding: 8px 10px; border: 1px solid var(--color-plate); border-radius: 4px; background: var(--color-plate); color: #2c4053; font-family: var(--font-family-base); font-size: 14px; font-weight: 400; line-height: 1.1; box-sizing: border-box; } .sok_order-form__field .input-text::placeholder { color: #7c7c7c; } .sok_order-form__input-email { background: var(--color-white) !important; border-color: rgba(158, 180, 204, 0.25) !important; } .sok_order-form .sok_order-form__submit { width: 100%; } .sok_order-form__agreement { display: flex; gap: 14px; align-items: flex-start; max-width: 640px; } .sok_order-form__agreement > span { color: #2c4053; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; } .sok_order-form__agreement a { color: inherit; text-decoration: underline; } .sok_order-form__agreement a:hover, .sok_order-form__agreement a:focus-visible { color: var(--color-blue); } /* --- 1440 --- */ @media (max-width: 1440px) { .sok_order { max-width: 1000px; } } /* --- tablet ≤1199 (Figma 768) --- */ @media (max-width: 1199px) { .page-content .sok_order-intro { margin-bottom: 40px; } .sok_order { max-width: 728px; } .sok_order .sok_order-items-section { padding-bottom: 40px; } .sok_order .sok_order-form-section { padding-bottom: 40px; } .sok_order-item { gap: 20px; min-height: 202px; } .sok_order-item__image { margin-left: 6px; } .sok_order-item__info { flex: 0 0 203px; max-width: 203px; } .sok_order-item__controls { flex: 1 1 auto; justify-content: flex-start; gap: 23px; } .sok_order-item__prices { min-width: 117px; } .sok_order-form__fields { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } } /* --- mobile ≤767 (Figma 360) --- */ @media (max-width: 767px) { .page-content .sok_order-intro { margin-bottom: 24px; } .sok_order { max-width: 336px; } .sok_order .sok_order-items-section { padding-bottom: 40px; } .sok_order .sok_order-form-section { padding-bottom: 40px; } .sok_order-item { display: grid; grid-template-columns: 130px 1fr auto; grid-template-areas: "image info remove" "controls controls controls"; column-gap: 12px; row-gap: 32px; align-items: start; min-height: 0; padding: 15px; } .sok_order-item__image { width: 130px; height: 103px; margin-left: 0; } .sok_order-item__info { flex: 1 1 auto; max-width: none; } .sok_order-item__title { font-size: 16px; } .sok_order-item__specs { gap: 5px; font-size: 12px; } .sok_order-item__image { grid-area: image; } .sok_order-item__info { grid-area: info; } .sok_order-item__remove { grid-area: remove; } .sok_order-item__controls { grid-area: controls; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; } .sok_order-item__qty { height: 37px; padding: 0 18px; gap: 7px; border-radius: 5px; } .sok_order-item__prices { min-width: 0; } .sok_order-item-removed { flex-direction: row; align-items: flex-start; padding: 15px; } .sok_order-slot._is-removed .sok_order-item-removed { display: flex !important; } .sok_order-item-removed__text { flex-direction: column; gap: 10px; align-items: flex-start; } .sok_order-item-removed__name, .sok_order-item-removed__message { font-size: 12px; line-height: 1.1; } .sok_order-item-removed__actions { flex-direction: column; align-items: flex-end; gap: 10px; } .sok_order-item-removed__restore { font-size: 12px; } .sok_order-form__fields { grid-template-columns: 1fr; gap: 20px; } .sok_order-form__agreement { max-width: none; } } /* BX sale.basket.basket wrappers */ .sok_order-basket { display: flex; flex-direction: column; width: 100%; } .sok_order #basket-items-list-wrapper, .sok_order #basket-items-list-container, .sok_order #basket-item-list, .sok_order #basket-item-table { display: flex; flex-direction: column; width: 100%; align-self: stretch; } .sok_order #basket-item-table { gap: 12px; } .sok_order-items > [data-entity="basket-total-block"] { align-self: flex-end; } .sok_order .basket-items-list-overlay { display: none !important; } .sok_order-warning { margin-bottom: 20px; padding: 12px 16px; border: 1px solid rgba(220, 38, 38, 0.25); border-radius: 8px; background: #fff; color: var(--color-red); font-size: 14px; } .sok_order-warning__close { float: right; padding: 0; border: 0; background: transparent; color: inherit; font-size: 20px; line-height: 1; cursor: pointer; } .sok_order-form .text-error[data-order-form-error] { margin: 0; } .sok_order-form._inactive { opacity: 0.55; pointer-events: none; } .sok_order-form._inactive .input-text, .sok_order-form._inactive .input-checkbox, .sok_order-form._inactive .sok_order-form__submit { cursor: not-allowed; } .sok_order-form__submit:disabled { opacity: 0.65; pointer-events: none; } /* End */ /* Start:/local/templates/main/css/components/order-success.css?17875465991634*/ /* Страница «Заявка оформлена» — desktop-first 1920 */ .main_content:has(.sok_order-success) { padding-bottom: 0; } .page-content:has(> .sok_order-success) { gap: 0; } .sok_order-success { display: flex; flex-direction: column; align-items: flex-start; gap: 32px; width: 100%; margin: 0; padding: 32px 0 80px; box-sizing: border-box; } .sok_order-success__text { display: flex; flex-direction: column; align-items: flex-start; gap: 32px; width: 100%; max-width: 1400px; } .sok_order-success__title-row { display: flex; align-items: center; gap: 10px; width: 100%; } .sok_order-success__icon { flex-shrink: 0; width: 51px; height: 51px; min-width: 0; min-height: 0; display: block; } .sok_order-success__title { margin: 0; flex: 1 1 auto; min-width: 0; color: var(--color-heading); font-family: var(--font-family-base); font-size: 46px; font-weight: 700; line-height: 1; letter-spacing: -1px; } .sok_order-success__desc { margin: 0; width: 100%; color: #2c4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_order-success .sok_btn-primary { flex-shrink: 0; width: auto; } @media (max-width: 1440px) { .sok_order-success { padding-bottom: 80px; } } @media (max-width: 1199px) { .sok_order-success { padding-bottom: 60px; } } @media (max-width: 767px) { .sok_order-success { padding-bottom: 40px; } .sok_order-success__title { font-size: 26px; } .sok_order-success__desc { font-size: 14px; line-height: 1.1; } } /* End */ /* Start:/local/templates/main/css/components/order-empty.css?17878308242288*/ /* Страница «Заявка пуста» — desktop-first 1920 */ .main_content:has(.sok_order-empty) { padding-bottom: 0; } .page-content:has(> .sok_order-empty) { gap: 0; } section.page_section.sok_order-empty { display: flex; flex-direction: column; align-items: flex-start; gap: 32px; width: 100%; margin: 0; padding: 0 0 80px; box-sizing: border-box; } section.page_section.sok_order-empty[hidden] { display: none !important; } .sok_order-empty__card { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; width: 100%; max-width: 583px; padding: 20px; box-sizing: border-box; border: 1px solid rgba(158, 180, 204, 0.25); border-radius: 10px; background: var(--color-white); } .sok_order-empty__title-row { display: flex; align-items: center; gap: 20px; width: 100%; min-height: 24px; } .sok_order-empty__icon { flex-shrink: 0; width: 24px; height: 24px; min-width: 24px; min-height: 24px; display: block; object-fit: contain; } ._content .sok_order-empty__title, .sok_order-empty__title { margin: 0; color: #2d2d2d; font-family: var(--font-family-base); font-size: 16px; font-weight: 500; line-height: 1.1; } ._content .sok_order-empty__desc, .sok_order-empty__desc { margin: 0; width: 100%; color: #2d2d2d; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_order-empty__actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; } .sok_order-empty__actions .sok_btn-primary, .sok_order-empty__actions .sok_btn-outline { flex-shrink: 0; width: auto; } @media (max-width: 1440px) { section.page_section.sok_order-empty { padding-bottom: 80px; } .sok_order-empty__card { max-width: 570px; } } @media (max-width: 1199px) { section.page_section.sok_order-empty { padding-bottom: 60px; } .sok_order-empty__card { max-width: none; } } @media (max-width: 767px) { section.page_section.sok_order-empty { padding-bottom: 40px; } ._content .sok_order-empty__title, .sok_order-empty__title { font-size: 14px; } ._content .sok_order-empty__desc, .sok_order-empty__desc { font-size: 12px; line-height: 1.4; } } /* End */ /* Start:/local/templates/main/css/components/search-empty.css?17847831821987*/ /* Страница «Результаты поиска — ничего не найдено» — desktop-first 1920 */ /* Sticky footer — глобально в foundation/typography.css */ section.page_section.sok_search-empty { display: block; width: 100%; margin: 0; padding: 0 0 80px; box-sizing: border-box; } .sok_search-empty > .sok__container { display: flex; flex-direction: column; align-items: flex-start; gap: 32px; } .sok_search-empty__row { display: flex; align-items: center; gap: 12px; width: 100%; min-width: 0; } .sok_search-empty__icon { flex-shrink: 0; display: block; width: 24px; height: 24px; min-width: 0; min-height: 0; object-fit: contain; } ._content .sok_search-empty__text, .sok_search-empty__text { margin: 0; min-width: 0; color: #2c4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_search-empty .sok_btn-primary { flex-shrink: 0; width: 190px; min-width: 190px; box-sizing: border-box; } @media (max-width: 1440px) { section.page_section.sok_search-empty { padding-bottom: 80px; } .sok_search-empty > .sok__container { padding-right: 40px; padding-left: 40px; } } @media (max-width: 1199px) { section.page_section.sok_search-empty { padding-bottom: 60px; } .sok_search-empty > .sok__container { padding-right: 20px; padding-left: 20px; } .sok_search-empty .sok_btn-primary { width: 190px; min-width: 190px; } } @media (max-width: 767px) { section.page_section.sok_search-empty { padding-bottom: 40px; } .sok_search-empty > .sok__container { padding-right: 12px; padding-left: 12px; } .sok_search-empty__row { align-items: flex-start; } .sok_search-empty__icon { width: 16px; height: 16px; margin-top: 1px; } ._content .sok_search-empty__text, .sok_search-empty__text { font-size: 12px; line-height: 1.4; } } /* End */ /* Start:/local/templates/main/css/components/catalog-items-empty.css?17847831801731*/ /* Empty-state списка товаров раздела — desktop-first 1920 */ /* Sticky footer — глобально в foundation/typography.css */ .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view:has(.sok_catalog-items-empty) { gap: 0; } .sok_catalog-items-empty { display: flex; flex-direction: column; align-items: flex-start; gap: 32px; width: 100%; padding-bottom: 80px; box-sizing: border-box; } .sok_catalog-items-empty__row { display: flex; align-items: center; gap: 12px; width: 100%; min-width: 0; } .sok_catalog-items-empty__icon { flex-shrink: 0; display: block; width: 24px; height: 24px; min-width: 0; min-height: 0; object-fit: contain; } ._content .sok_catalog-items-empty__text, .sok_catalog-items-empty__text { margin: 0; min-width: 0; color: #2c4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-items-empty .sok_btn-primary { flex-shrink: 0; width: auto; min-width: 0; padding-right: 28px; padding-left: 28px; box-sizing: border-box; } @media (max-width: 1440px) { .sok_catalog-items-empty { padding-bottom: 80px; } } @media (max-width: 1199px) { .sok_catalog-items-empty { padding-bottom: 60px; } } @media (max-width: 767px) { .sok_catalog-items-empty { padding-bottom: 40px; } .sok_catalog-items-empty__row { align-items: flex-start; } .sok_catalog-items-empty__icon { width: 16px; height: 16px; margin-top: 1px; } ._content .sok_catalog-items-empty__text, .sok_catalog-items-empty__text { font-size: 12px; line-height: 1.4; } } /* End */ /* Start:/local/templates/main/css/components/catalog-items-page.css?178781758316546*/ /* catalog-items-page — общая оболочка страницы списка товаров */ .sok_catalog-items-topbar > .sok__container > .top_filter-btn { display: none; } .sok_catalog-items-topbar { min-height: 100px; background: var(--color-white); overflow: visible; } .sok_catalog-items-topbar > .sok__container { display: flex; align-items: flex-start; gap: 10px; min-height: 100px; padding-top: 20px; padding-bottom: 40px; overflow: visible; } .sok_catalog-items-topbar .catalog_filter-simple { flex: 1 1 auto; min-width: 0; overflow: visible; } .sok_catalog-items-topbar .top_filter_sort .btn_top { display: flex; height: 40px; align-items: center; justify-content: center; gap: 4px; padding: 0 4px 0 14px; border: 1px solid rgba(158, 180, 204, 0.4); border-radius: 5px; background: var(--color-white); color: #2c4053; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; cursor: pointer; } .sok_catalog-items-topbar .top_filter_sort { display: flex; flex: 0 0 auto; align-items: center; gap: 10px; margin-left: auto; } .sok_catalog-items-topbar .sok_catalog-sort { position: relative; cursor: pointer; } .sok_catalog-items-topbar .sok_catalog-sort-show { display: flex; width: 100%; height: 100%; align-items: center; gap: 4px; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; } .sok_catalog-items-topbar .sok_catalog-sort-show svg, .sok_catalog-items-topbar .catalog-filter-param .dropdown_click_show svg { pointer-events: none; transition: transform var(--transition); } .sok_catalog-items-topbar .sok_catalog-sort._active .sok_catalog-sort-show svg { transform: rotate(180deg); } .sok_catalog-items-topbar .sok_catalog-sort-content { position: absolute; z-index: 1000; top: calc(100% + 8px); right: 0; left: auto; display: none; width: 244px; margin: 0; padding: 0; overflow: hidden; list-style: none; border-radius: 10px; background: var(--color-white); box-shadow: 0 2px 2px -1px rgba(30, 41, 59, 0.04), 0 16px 24px -4px rgba(30, 41, 59, 0.16); } .sok_catalog-items-topbar .sok_catalog-sort._active .sok_catalog-sort-content { display: block; } .sok_catalog-items-topbar .sok_catalog-sort-content li { margin: 0; padding: 0; line-height: 0; } .sok_catalog-items-topbar .sok_catalog-sort-content button, .sok_catalog-items-topbar .sok_catalog-sort-content a { display: block; width: 100%; margin: 0; padding: 15px; border: 0; background: var(--color-white); color: #2c4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; text-align: left; text-decoration: none; box-sizing: border-box; cursor: pointer; } .sok_catalog-items-topbar .sok_catalog-sort-content button:hover, .sok_catalog-items-topbar .sok_catalog-sort-content a:hover { background: var(--color-plate); } .sok_catalog-items-topbar .buttons_grid_menu { display: flex; align-items: center; gap: 6px; } .sok_catalog-items-topbar .buttons_grid_menu .btn_top { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 1px solid rgba(158, 180, 204, 0.4); border-radius: 5px; background: var(--color-white); color: rgba(158, 180, 204, 0.25); opacity: 1; text-decoration: none; box-sizing: border-box; cursor: pointer; font: inherit; appearance: none; -webkit-appearance: none; } .sok_catalog-items-topbar .buttons_grid_menu .btn_top._active { border-color: rgba(158, 180, 204, 0.25); color: #2c4053; } .sok_catalog-items-topbar .catalog-view-icon { display: block; width: 24px; height: 24px; background: currentColor; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; -webkit-mask-size: contain; mask-position: center; mask-repeat: no-repeat; mask-size: contain; } .sok_catalog-items-topbar .btn_top._grid .catalog-view-icon { -webkit-mask-image: url("/local/templates/main/css/components/../../img/catalog/view-grid-desktop.svg"); mask-image: url("/local/templates/main/css/components/../../img/catalog/view-grid-desktop.svg"); } .sok_catalog-items-topbar .btn_top._menu .catalog-view-icon { -webkit-mask-image: url("/local/templates/main/css/components/../../img/catalog/view-list-desktop.svg"); mask-image: url("/local/templates/main/css/components/../../img/catalog/view-list-desktop.svg"); } section.page_section.sok_catalog-items-section { padding-top: 0; } .sok_catalog-items-section .catalog-list__grid { display: grid; grid-template-columns: 288px minmax(0, 1fr); gap: 34px; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view { display: flex; flex-direction: column; gap: 40px; margin-top: 0; } /* Модалка «Добавлено в заявку» */ :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request { width: 100%; max-width: 980px; padding: 40px; row-gap: 30px; border-radius: 16px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_top { position: relative; align-items: center; padding-right: 40px; border-bottom: 0; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_title { color: #1e2b4a; font-family: var(--font-family-base); font-size: 35px; font-weight: 700; line-height: 1; letter-spacing: -1px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_close-icon { top: 0; right: 0; color: #94a3b8; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_close-icon svg { fill: currentColor; stroke: currentColor; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_content { margin: 0; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_product_container { display: flex; align-items: stretch; justify-content: space-between; gap: 40px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_img_content { display: flex; flex: 1 1 auto; gap: 24px; min-width: 0; padding: 0; border: 0; border-radius: 0; background: var(--color-white); } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_img { display: flex; flex: 0 0 150px; align-items: center; justify-content: center; width: 150px; max-width: 150px; max-height: 150px; overflow: hidden; border-radius: 10px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_img img { width: 100%; height: 100%; max-width: 150px; max-height: 150px; object-fit: cover; border-radius: 10px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_content { display: flex; flex: 1 1 auto; flex-direction: column; gap: 16px; justify-content: center; min-width: 0; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .article { color: #94a3b8; font-family: var(--font-family-base); font-size: 12px; font-weight: 400; line-height: 1.1; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .article span { font-weight: 400; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_name a { color: #1e2b4a; font-family: var(--font-family-base); font-size: 18px; font-weight: 600; line-height: 1.2; text-decoration: none; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_price { display: flex; flex-direction: column; gap: 0; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_price .price { display: flex; align-items: baseline; gap: 6px; font-size: 18px; line-height: 1.2; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_price .price-prefix, :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_price .price-currency { color: #010117; font-weight: 500; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_price .price-value { color: #1e2b4a; font-weight: 600; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_counter { gap: 8px; height: 40px; padding: 0 20px; border-radius: 5px; background: var(--color-plate); } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_counter:hover { background: var(--color-plate); } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_counter ._counter-input { width: 40px; color: #2c4053; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_counter .control_button { display: flex; align-items: center; justify-content: center; padding: 0; border: 0; background: transparent; color: #2c4053; cursor: pointer; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_info { display: flex; flex: 0 0 280px; align-items: center; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_nav { display: flex; width: 100%; flex-direction: column; gap: 20px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons { display: flex; flex-direction: column; gap: 10px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons .sok_btn-primary, :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons .sok_btn-outline { width: 100%; min-height: 40px; justify-content: center; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_messages { color: #010117; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } @media (max-width: 1440px) { .sok_catalog-items-topbar > .sok__container, .sok_catalog-items-section > .sok__container { padding-right: 40px; padding-left: 40px; } .sok_catalog-items-section .catalog-list__grid { gap: 36px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request { max-width: 900px; padding: 32px; } } @media (max-width: 1199px) { .sok_catalog-items-topbar { min-height: 70px; } .sok_catalog-items-topbar > .sok__container { min-height: 70px; align-items: center; padding: 15px 20px; } .sok_catalog-items-topbar .catalog_filter-simple { display: none; } .sok_catalog-items-topbar > .sok__container > .top_filter-btn { position: relative; display: flex; height: 40px; align-items: center; gap: 10px; padding: 0 15px; border: 1px solid rgba(158, 180, 204, 0.4); border-radius: 5px; background: var(--color-white); color: #2c4053; font-family: var(--font-family-base); font-size: 14px; } .sok_catalog-items-topbar .top_filter-icon { position: relative; display: flex; } .sok_catalog-items-topbar .top_filter-count { position: absolute; top: -8px; right: -8px; display: flex; min-width: 16px; height: 16px; align-items: center; justify-content: center; border-radius: 999px; background: var(--color-blue); color: var(--color-white); font-size: 10px; } .sok_catalog-items-topbar .top_filter_sort { margin-left: auto; } .sok_catalog-items-section > .sok__container { padding-right: 20px; padding-left: 20px; } section.page_section.sok_catalog-items-section { padding-top: 17px; } .sok_catalog-items-section .catalog-list__grid { display: block; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request { max-width: 100% !important; height: auto; min-height: 100%; padding: 25px 40px 40px; border-radius: 0; row-gap: 30px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_title { font-size: 35px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_top { padding-bottom: 20px; border-bottom: 1px solid rgba(158, 180, 204, 0.25); } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_product_container { flex-direction: column; gap: 30px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_img_content { gap: 40px; align-items: center; padding: 20px; border: 1px solid rgba(148, 163, 184, 0.15); border-radius: 10px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_info { flex: 0 0 auto; width: 100%; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons { flex-direction: row; gap: 10px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons .sok_btn-primary, :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons .sok_btn-outline { flex: 1 1 0; width: auto; max-width: none; } } @media (max-width: 767px) { .sok_catalog-items-topbar > .sok__container { gap: 8px; padding: 17px 12px; } .sok_catalog-items-topbar > .sok__container > .top_filter-btn { height: 33px; padding: 0 12px; gap: 6px; font-size: 10px; } .sok_catalog-items-topbar .top_filter_sort { gap: 8px; } .sok_catalog-items-topbar .top_filter_sort .btn_top { height: 33px; padding-left: 10px; font-size: 10px; } .sok_catalog-items-topbar .buttons_grid_menu { gap: 6px; } .sok_catalog-items-topbar .buttons_grid_menu .btn_top { width: 33px; height: 33px; padding: 0; border-radius: 4.5px; } .sok_catalog-items-topbar .btn_top._grid .catalog-view-icon { width: 18px; height: 18px; -webkit-mask-image: url("/local/templates/main/css/components/../../img/catalog/view-grid-mobile.svg"); mask-image: url("/local/templates/main/css/components/../../img/catalog/view-grid-mobile.svg"); } .sok_catalog-items-topbar .btn_top._menu .catalog-view-icon { width: 19.44px; height: 19.44px; -webkit-mask-image: url("/local/templates/main/css/components/../../img/catalog/view-list-mobile.svg"); mask-image: url("/local/templates/main/css/components/../../img/catalog/view-list-mobile.svg"); } .sok_catalog-items-section > .sok__container { padding-right: 12px; padding-left: 12px; } section.page_section.sok_catalog-items-section { padding-top: 10px; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view { gap: 20px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request { padding: 20px; row-gap: 30px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_top { padding-right: 32px; padding-bottom: 20px; border-bottom: 1px solid rgba(158, 180, 204, 0.25); } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_title { font-size: 21px; letter-spacing: -1px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_img_content { gap: 15px; padding: 15px; align-items: center; border: 1px solid rgba(158, 180, 204, 0.15); border-radius: 10px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_img { flex-basis: 110px; width: 110px; max-width: 110px; max-height: 102px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_img img { max-width: 110px; max-height: 102px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_content { gap: 15px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_name a { color: #010117; font-size: 16px; line-height: 1.4; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_counter { height: 37px; padding: 0 18px; border-radius: 5px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_counter ._counter-input { font-size: 13px; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons { flex-direction: column; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons .sok_btn-primary, :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .modal_buttons .sok_btn-outline { width: 100%; } :is(.modal, .sok_basket-added-modal) .modal_dialog.sok_added-request .product_messages { font-size: 12px; line-height: 1.1; } } /* End */ /* Start:/local/templates/main/css/components/catalog-items-filter.css?178781372311700*/ /* catalog-items-filter — фильтры desktop / tablet / mobile */ .sok_catalog-filter_desktop { display: flex; width: fit-content; max-width: 100%; flex-flow: row wrap; gap: 10px; } .sok_catalog-filter_desktop .catalog-filter-params { display: flex; flex: 0 1 auto; min-width: 0; flex-wrap: wrap; gap: 10px; } .sok_catalog-filter_desktop .catalog-filter-param { position: relative; padding: 0; border: 0; } .sok_catalog-filter_desktop .dropdown_click_show { display: flex; height: 40px; align-items: center; justify-content: center; gap: 4px; padding: 0 4px 0 14px; border: 1px solid rgba(158, 180, 204, 0.4); border-radius: 5px; background: var(--color-white); color: #2c4053; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; cursor: pointer; } .sok_catalog-filter_desktop .dropdown_click_show svg { pointer-events: none; } .sok_catalog-filter_desktop .filter_arrow_down { display: block; margin: 8px; transition: transform var(--transition); } .sok_catalog-filter_desktop .catalog-filter-param._open .filter_arrow_down { transform: rotate(180deg); } .sok_catalog-filter_desktop .catalog-filter-param._select .dropdown_click_show { border-color: var(--color-blue); background: var(--color-blue); color: var(--color-white); } .sok_catalog-filter_desktop .catalog-filter-param._select .filter_arrow_down { display: none; } .sok_catalog-filter_desktop .delete_filter { display: none; width: 36px; height: 40px; margin: 0 -4px 0 6px; align-items: center; justify-content: center; border-left: 1px solid rgba(255, 255, 255, 0.25); } .sok_catalog-filter_desktop .catalog-filter-param._select .delete_filter { display: flex; } .sok_catalog-filter_desktop .dropdown_click_content { position: absolute; z-index: 40; top: calc(100% + 8px); left: 0; display: none; width: 203px; padding: 15px; border-radius: 8px; background: var(--color-white); box-shadow: 4px 4px 2px rgba(0, 0, 0, 0.25); box-sizing: border-box; } .sok_catalog-filter_desktop .catalog-filter-param._open .dropdown_click_content { display: flex; flex-direction: column; gap: 20px; } .sok_catalog-filter_desktop .dropdown_click_content > .sok_btn-primary { width: 100%; min-width: 0; } .sok_catalog-filter_desktop .dropdown_click_content .filter-list { gap: 20px; } .sok_catalog-filter .filter-list { display: flex; flex-direction: column; gap: 12px; } .sok_catalog-filter .input-wrapper { display: flex; align-items: center; gap: 7px; color: #010117; font-size: 14px; font-weight: 400; line-height: 1.1; cursor: pointer; } .sok_catalog-filter .input-wrapper input { position: absolute; opacity: 0; pointer-events: none; } .sok_catalog-filter .input-wrapper.disabled, .sok_catalog-filter .input-wrapper:has(input:disabled) { color: #9eb4cc; cursor: not-allowed; opacity: 0.55; pointer-events: none; } /* Отмеченный, но недоступный: видно галочку, клик заблокирован, значение уходит в фильтр */ .sok_catalog-filter .input-wrapper.disabled:has(input:checked), .sok_catalog-filter .input-wrapper:has(input:disabled:checked) { color: #6b7c93; opacity: 0.85; cursor: default; } .sok_catalog-filter .input-wrapper.disabled .checkboxIcon, .sok_catalog-filter .input-wrapper.disabled .radioIcon, .sok_catalog-filter .input-wrapper:has(input:disabled) .checkboxIcon, .sok_catalog-filter .input-wrapper:has(input:disabled) .radioIcon { border-color: #c5d3e3; background: #eef2f6; } .sok_catalog-filter .input-wrapper.disabled:has(input:checked) .checkboxIcon, .sok_catalog-filter .input-wrapper:has(input:disabled:checked) .checkboxIcon { border-color: #9eb4cc; background-color: #9eb4cc; background-image: url("/local/templates/main/css/components/../../img/catalog/icon-check-line.svg"); background-position: center; background-repeat: no-repeat; background-size: 16px 16px; box-shadow: none; opacity: 0.9; } .sok_catalog-filter .input-wrapper.disabled:has(input:checked) .radioIcon, .sok_catalog-filter .input-wrapper:has(input:disabled:checked) .radioIcon { border-color: #9eb4cc; background-color: #9eb4cc; box-shadow: inset 0 0 0 3px var(--color-white); opacity: 0.9; } .sok_catalog-filter .checkboxIcon, .sok_catalog-filter .radioIcon { position: relative; display: block; width: 16px; height: 16px; flex: 0 0 16px; border: 1px solid var(--color-checkbox-border); border-radius: 3px; background: var(--color-white); } .sok_catalog-filter .radioIcon { border-radius: 50%; } .sok_catalog-filter input:checked + .checkboxIcon, .sok_catalog-filter input:checked + .radioIcon { border-color: var(--color-checkbox-checked); background-color: var(--color-checkbox-checked); box-shadow: inset 0 0 0 3px var(--color-white); } .sok_catalog-filter input:checked + .checkboxIcon { box-shadow: none; background-image: url("/local/templates/main/css/components/../../img/catalog/icon-check-line.svg"); background-position: center; background-repeat: no-repeat; background-size: 16px 16px; } .sok_catalog-filter .filter-prices { display: flex; align-items: center; gap: 7px; } .sok_catalog-filter .filter-prices label { position: relative; display: flex; width: 115px; flex: 0 0 115px; align-items: center; } .sok_catalog-filter .filter-prices input { width: 100%; min-width: 0; height: 31px; padding: 8px 22px 8px 8px; border: 1px solid rgba(44, 64, 83, 0.15); border-radius: 4px; font-size: 12px; } .sok_catalog-filter .filter-prices label > span:last-child { position: absolute; right: 8px; color: #7c7c7c; font-size: 12px; } .sok_catalog-filter .price-slider-container { position: relative; width: 100%; height: 16px; } .sok_catalog-filter .price-slider-track { position: absolute; top: 4px; right: 0; left: 0; height: 8px; overflow: hidden; border-radius: 999px; background: rgba(44, 64, 83, 0.15); } .sok_catalog-filter .price-slider-range { position: absolute; top: 1px; bottom: 1px; left: 0; width: 100%; background: var(--color-blue); } .sok_catalog-filter .price-slider { position: absolute; top: 0; left: 0; width: 100%; height: 16px; margin: 0; appearance: none; background: transparent; pointer-events: none; } .sok_catalog-filter .price-slider::-webkit-slider-runnable-track { height: 8px; background: transparent; } .sok_catalog-filter .price-slider::-webkit-slider-thumb { width: 16px; height: 16px; margin-top: -4px; border: 0; border-radius: 50%; appearance: none; background: var(--color-blue); cursor: pointer; pointer-events: auto; } .sok_catalog-filter .price-slider::-moz-range-track { height: 8px; background: transparent; } .sok_catalog-filter .price-slider::-moz-range-thumb { width: 16px; height: 16px; border: 0; border-radius: 50%; background: var(--color-blue); cursor: pointer; pointer-events: auto; } .sok_catalog-filter_desktop .catalog-filter-param._price .dropdown_click_content { width: 257px; padding: 10px; border-radius: 8px; } .sok_catalog-filter_desktop .catalog-filter-param._price .prices_separator { display: none; width: 20px; flex: 0 0 20px; text-align: center; } .sok_catalog-filter_desktop .catalog-filter-param._price._price-filled .dropdown_click_content { width: 284px; } .sok_catalog-filter_desktop .catalog-filter-param._price._price-filled .prices_separator, .sok_catalog-filter_mobile .prices_separator { display: block; } .sok_catalog-filter_desktop .catalog-filter-param._price .filter-list { gap: 20px; } .sok_catalog-filter_desktop .catalog-filter-param._price .dropdown_click_content > .sok_btn-primary { height: 35px; } .sok_catalog-filter.sok_catalog-filter_desktop .catalog-filter-params > .catalog-filter-param { display: block; padding: 0; border: 0; row-gap: 0; } .sok_catalog-filter.sok_catalog-filter_desktop .catalog-filter-params > .catalog-filter-param .filter-list, .sok_catalog-filter.sok_catalog-filter_desktop .catalog-filter-params > .catalog-filter-param._price .filter-list { gap: 20px; row-gap: 20px; } .sok_catalog-filter_desktop .sok_catalog-filter-reset { align-self: flex-start; height: 40px; padding: 0 14px; white-space: nowrap; } .sok_catalog-filter-modal { position: fixed; z-index: 10000; inset: 0; display: flex; align-items: stretch; justify-content: center; overflow: hidden; } .sok_catalog-filter-modal[hidden] { display: none; } .sok_catalog-filter-backdrop { position: fixed; inset: 0; border: 0; background: rgba(0, 0, 0, 0.2); } .sok_catalog-filter-dialog { position: relative; z-index: 1; display: flex; flex-direction: column; width: min(100%, 768px); max-height: 100dvh; background: var(--color-white); box-shadow: 0 2px 2px -1px rgba(30, 41, 59, 0.04), 0 16px 24px -4px rgba(30, 41, 59, 0.16); } .sok_catalog-filter-modal-top { display: flex; flex-shrink: 0; align-items: center; padding: 20px 10px; } .sok_catalog-filter-modal-top h2 { flex: 1; color: var(--color-heading); font-size: 18px; font-weight: 600; line-height: 1.2; } .sok_catalog-filter-modal-top .modal_close { width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; } .sok_catalog-filter_mobile { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; padding: 0; } .sok_catalog-filter_mobile .catalog-filter-params { display: flex; flex: 1 1 auto; flex-direction: column; gap: 0; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 0 20px 20px; -webkit-overflow-scrolling: touch; } .sok_catalog-filter.sok_catalog-filter_mobile .catalog-filter-params > .catalog-filter-param { display: flex; flex-direction: column; gap: 16px; padding: 20px 0 30px; border-bottom: 1px solid rgba(158, 180, 204, 0.4); } .sok_catalog-filter.sok_catalog-filter_mobile .catalog-filter-params > .catalog-filter-param .filter-list { display: flex; flex-direction: column; gap: 12px; row-gap: 12px; } .sok_catalog-filter.sok_catalog-filter_mobile .catalog-filter-params > .catalog-filter-param:first-child { padding-top: 10px; } .sok_catalog-filter.sok_catalog-filter_mobile .catalog-filter-params > .catalog-filter-param:last-child { border-bottom: 0; padding-bottom: 10px; } .sok_catalog-filter_mobile .filter-param-title { margin: 0; color: #010117; font-size: 15px; font-weight: 500; line-height: 1.4; } .sok_catalog-filter_mobile .catalog-filter-param .dropdown_click_show, .sok_catalog-filter_mobile .catalog-filter-param [data-filter-apply], .sok_catalog-filter_mobile .sok_catalog-filter-reset { display: none !important; } .sok_catalog-filter_mobile .catalog-filter-bottom { display: flex; flex-shrink: 0; flex-direction: column; gap: 10px; margin-top: auto; padding: 16px 20px calc(16px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(158, 180, 204, 0.35); background: var(--color-white); box-shadow: 0 -8px 24px -12px rgba(30, 41, 59, 0.18); } .sok_catalog-filter_mobile .catalog-filter-bottom button { width: 100%; } body._filter-open { overflow: hidden; } @media (max-width: 767px) { .sok_catalog-filter-dialog { width: 100%; max-height: 100dvh; margin: 0; border-radius: 0; } .sok_catalog-filter_mobile .catalog-filter-params { padding: 0 16px 16px; } .sok_catalog-filter_mobile .catalog-filter-bottom { padding-right: 16px; padding-left: 16px; } .sok_catalog-filter .filter-prices input { min-width: 0; } } /* End */ /* Start:/local/templates/main/css/components/catalog-items-sections.css?17878017682715*/ /* catalog-items-sections — левое меню разделов */ .sok_catalog-items-section .catalog-left-menu { display: block; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections { display: flex; flex-direction: column; padding: 10px 0; overflow: hidden; border: 1px solid rgba(158, 180, 204, 0.4); border-radius: 10px; gap: 10px; } .sok_catalog-items-section .catalog-left-menu .sok_catalog-section { display: flex; flex-direction: column; gap: 10px; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_title { display: flex; min-height: 39px; align-items: center; justify-content: space-between; padding: 9px 16px; color: #010117; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sok_catalog-section._active .sections_title { background: var(--color-blue); color: var(--color-white); } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_title svg { flex: 0 0 18px; fill: currentColor; color: inherit; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sok_catalog-section._active .sections_title svg { transform: rotate(180deg); fill: currentColor; color: inherit; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list { display: none; flex-direction: column; gap: 15px; padding: 10px 0; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sok_catalog-section._active > .sections_list { display: flex; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list .section_item { min-height: 21px; padding: 0 20px; color: #615f5f; font-family: var(--font-family-base); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu .catalog_sections .sections_list .section_item._active { min-height: 41px; padding: 10px 20px; border-radius: 0; background: var(--color-plate); color: #615f5f; font-weight: 400; } @media (max-width: 1199px) { .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu { display: none; } } /* End */ /* Start:/local/templates/main/css/components/search-catalog-items.css?17846311731241*/ /* search-catalog-items — дельта страницы результатов поиска */ /* catalog-list.css: .catalog-list__grid_container .catalog-list__grid .catalog-left-menu { row-gap: 40px } — выше специфичность; на search не нужен */ .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-left-menu { row-gap: 0; } .sok_catalog-items-section .catalog-left-menu .sok_search-found, .sok_search-catalog-nav .sok_search-found { margin: 0 0 24px; color: #2c4053; font-family: var(--font-family-base); font-size: 15px; font-weight: 500; line-height: 1.4; } .sok_search-catalog-nav { display: none; } @media (max-width: 1199px) { .sok_catalog-items-section .catalog-left-menu .sok_search-found { display: none; } .sok_search-catalog-nav { display: block; } .sok_search-catalog-nav .sok__container { padding-right: 20px; padding-left: 20px; } .sok_search-catalog-nav .sok_service-nav__mobile { margin-bottom: 0; } } @media (max-width: 767px) { .sok_search-catalog-nav .sok__container { padding-right: 12px; padding-left: 12px; } .sok_search-catalog-nav .sok_search-found { font-size: 14px; } } /* End */ /* Start:/local/templates/main/css/components/catalog-product-card-grid.css?17878187547930*/ /* catalog-product-card-grid — плитка в каталоге (не зависит от дельт product-card) */ .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items:not(._list) { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; align-items: start; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product { position: relative; display: flex; flex-direction: column; align-items: stretch; box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; height: auto; min-height: 310px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: var(--color-plate); box-shadow: none; overflow: hidden; transition: background var(--transition); } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product:hover { background: var(--color-plate-hover); box-shadow: none; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product-img { position: relative; display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; height: 160px; min-height: 160px; max-height: 160px; padding: 10px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product-img img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; min-width: 0; min-height: 0; object-fit: contain; mix-blend-mode: darken; border-radius: 0; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_content { display: flex; flex-direction: column; justify-content: space-between; box-sizing: border-box; width: 100%; height: 150px; padding: 12px 8px; row-gap: 0; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_content_top { display: flex; flex-direction: column; row-gap: 4px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .article span { display: block; font-size: 12px; font-weight: 400; line-height: 1.1; color: #2c4053; opacity: 0.7; word-break: break-word; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_name a { display: -webkit-box; width: 100%; min-height: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; text-overflow: ellipsis; font-size: 16px; font-weight: 700; line-height: 1.2; color: var(--color-heading); text-decoration: none; word-break: break-word; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_name a:hover { color: var(--color-blue); } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_price { display: grid; grid-template-columns: 1fr 40px; column-gap: 4px; align-items: end; width: 100%; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_price-left { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .stock .in-stock { display: inline-flex; align-items: center; gap: 2px; padding: 2px 4px; border-radius: 2px; font-size: 10px; font-weight: 500; line-height: 1.1; color: var(--color-in-stock); opacity: 0.7; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .stock .in-stock img { width: 8px; height: 8px; flex-shrink: 0; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .old_price { display: flex; align-items: flex-start; gap: 6px; min-height: 21px; margin: 0; font-size: 15px; font-weight: 400; line-height: 1.4; color: var(--color-neutral-500); white-space: nowrap; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .old_price span { text-decoration: line-through; color: inherit; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_price-cart { display: flex; align-items: end; justify-content: flex-end; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .price { display: flex; align-items: flex-end; justify-content: flex-start; gap: 5px; flex: 1; min-width: 0; min-height: 24px; height: auto; color: var(--color-heading); white-space: nowrap; overflow: hidden; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .price-prefix { font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .price-value { font-size: 20px; font-weight: 600; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; flex-shrink: 0; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .in_card { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 2px; background: var(--color-blue); box-shadow: none; color: var(--color-white); cursor: pointer; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .in_card img { width: 16px; height: 16px; display: block; filter: brightness(0) invert(1); } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .in_card:hover, .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .in_card._active { background-color: var(--color-blue-hover); color: var(--color-white); } @media (max-width: 1199px) { .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items:not(._list) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 767px) { .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items:not(._list) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product { min-height: auto; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product-img { height: 120px; min-height: 120px; max-height: 120px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_content { height: auto; padding: 8px; gap: 12px; justify-content: flex-start; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .article span { font-size: 10px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_name a { font-size: 11px; -webkit-line-clamp: 3; line-clamp: 3; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .old_price { min-height: 17px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .price-prefix { font-size: 11px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .price-value { font-size: 15px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .product_price { grid-template-columns: 1fr; align-items: start; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .price { min-height: 0; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .in_card { width: 100%; height: 32px; } .sok_catalog-items-section .catalog-list__items:not(._list) .sok_card_product .in_card img { width: 13px; height: 13px; } } /* End */ /* Start:/local/templates/main/css/components/catalog-product-card-list.css?178781735313378*/ /* catalog-product-card-list — Card List в каталоге (самодостаточно, без опоры на product-card) */ .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items._list { display: flex; flex-direction: column; gap: 12px; width: 100%; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list { position: relative; display: flex; box-sizing: border-box; width: 100%; max-width: 100%; height: auto; min-height: 200px; max-height: none; margin: 0; padding: 20px; gap: 20px; flex-direction: row; flex-wrap: nowrap; align-items: stretch; justify-content: space-between; overflow: visible; background: var(--color-plate); border-radius: 10px; box-shadow: none; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list:hover { box-shadow: none; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content { display: flex; flex-direction: row; align-items: flex-start; gap: 20px; width: auto; flex: 1 1 auto; min-width: 0; height: auto; grid-template-columns: none; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product-img { position: relative; display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 219px; max-width: 219px; height: 160px; min-height: 0; max-height: 160px; padding: 10px; box-sizing: border-box; overflow: hidden; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product-img img { display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; min-width: 0; min-height: 0; object-fit: contain; mix-blend-mode: darken; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product_content { display: flex; flex-direction: column; gap: 20px; flex: 1 1 auto; min-width: 0; max-width: none; width: auto; height: auto; min-height: 0; max-height: none; overflow: visible; padding: 0; row-gap: 20px; align-self: stretch; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_content_top { display: flex; flex-direction: column; gap: 10px; width: 100%; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .article span { color: var(--color-neutral-500); font-size: 12px; font-weight: 400; line-height: 1.1; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_name a { display: block; min-height: 0; max-height: none; overflow: visible; -webkit-line-clamp: unset; line-clamp: unset; -webkit-box-orient: unset; color: var(--color-heading); font-size: 18px; font-weight: 600; line-height: 1.2; text-decoration: none; word-break: break-word; overflow-wrap: anywhere; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_name a:hover { color: var(--color-blue); } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_features { display: flex; flex-direction: column; flex: 0 0 auto; gap: 10px; margin-top: 0; width: 100%; overflow: visible; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature { display: flex; flex-wrap: wrap; align-items: flex-start; column-gap: 5px; color: var(--color-black); font-size: 14px; line-height: 1.1; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature .feature_name { font-size: 14px; font-weight: 400; line-height: 1.1; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature .feature_value { font-size: 14px; font-weight: 500; line-height: 1.1; word-break: break-word; overflow-wrap: anywhere; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_price_cart { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; flex: 0 0 auto; gap: 14px; min-width: 140px; align-self: stretch; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_price_cart .product_price { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; width: 100%; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .stock .in-stock { display: inline-flex; align-items: center; gap: 2px; padding: 2px 4px; color: var(--color-in-stock); font-size: 10px; font-weight: 500; line-height: 1.1; opacity: 0.7; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .stock .in-stock img { width: 8px; height: 8px; display: block; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .old_price { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--color-neutral-500); font-size: 14px; font-weight: 500; line-height: 1.1; text-decoration: line-through; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .old_price span { color: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price { display: flex; align-items: flex-start; gap: 6px; height: auto; justify-content: flex-start; color: var(--color-heading); font-size: 18px; line-height: 1.2; white-space: nowrap; overflow: visible; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price-prefix, .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price-currency { color: var(--color-black); font-size: 18px; font-weight: 500; line-height: 1.2; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price-value { color: var(--color-heading); font-size: 18px; font-weight: 600; line-height: 1.2; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card.sok_btn-primary { flex-shrink: 0; width: auto; min-width: 0; height: 40px; margin: 0; padding: 0 24px !important; border: 0 !important; border-radius: 4px !important; box-shadow: none; gap: 8px; background: var(--color-btn-primary) !important; color: var(--color-white) !important; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card.sok_btn-primary:hover, .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card.sok_btn-primary._active { background: var(--color-btn-primary-hover) !important; color: var(--color-white) !important; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card.sok_btn-primary img { width: 16px; height: 16px; display: block; flex-shrink: 0; filter: brightness(0) invert(1); } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card-label { font-size: 14px; font-weight: 600; line-height: 1; } @media (max-width: 1440px) { .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product_content { max-width: none; } } @media (max-width: 1199px) { .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list { flex-direction: row; flex-wrap: nowrap; align-items: stretch; min-height: 200px; gap: 16px; padding: 20px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; flex: 1 1 0; width: auto; max-width: none; min-width: 0; gap: 16px; grid-template-columns: none; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product-img { flex: 0 0 157px; width: 157px; max-width: 157px; height: 160px; min-height: 0; max-height: 160px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product_content { flex: 1 1 0; width: auto; max-width: none; min-width: 0; row-gap: 16px; gap: 16px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_name a { overflow: visible; text-overflow: unset; white-space: normal; -webkit-line-clamp: unset; line-clamp: unset; display: block; -webkit-box-orient: unset; word-break: break-word; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_price_cart { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; flex: 0 0 auto; width: auto; min-width: 0; max-width: none; gap: 14px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_price_cart .product_price { align-items: flex-end; width: auto; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature .feature_name, .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature .feature_value { font-size: 14px; line-height: 1.1; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card.sok_btn-primary { width: auto; align-self: flex-end; } } @media (max-width: 767px) { .sok_catalog-items-section .catalog-list__grid_container .catalog-list__grid .catalog-list__content .catalog-list__view .catalog-list__items._list { gap: 12px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list { flex-direction: column; align-items: stretch; gap: 14px; min-height: 216px; padding: 12px 8px; border-radius: 8px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content { gap: 15px; width: 100%; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product-img { width: 137px; max-width: 137px; height: 118px; min-height: 0; max-height: 118px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_img_content .product_content { gap: 4px; row-gap: 4px; max-width: none; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_content_top { gap: 4px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .article span { color: #2c4053; opacity: 0.7; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_name a { font-size: 16px; overflow: visible; text-overflow: unset; -webkit-line-clamp: unset; line-clamp: unset; display: block; word-break: break-word; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_features { gap: 5px; margin-top: 14px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature, .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature .feature_name, .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_feature .feature_value { font-size: 12px; line-height: 1.1; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_price_cart { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 4px; width: 100%; min-width: 0; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .product_price_cart .product_price { align-items: flex-start; gap: 2px; flex: 1 1 auto; min-width: 0; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .old_price { gap: 10px; font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price { align-items: flex-end; gap: 4px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price-prefix { color: var(--color-header-text); font-size: 15px; font-weight: 400; line-height: 1.4; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price-value, .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .price-currency { font-size: 20px; font-weight: 600; line-height: 1.2; color: var(--color-heading); } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card.sok_btn-primary { width: 40px; padding: 8px 12px !important; border-radius: 2px !important; gap: 4px; } .sok_catalog-items-section .catalog-list__items._list .sok_card_product._list .in_card-label { display: none; } } /* End */ /* Start:/local/templates/main/components/bitrix/sale.basket.basket.line/header/style.css?1787811162741*/ /* sale.basket.basket.line / header */ .sok-basket-line { display: inline-flex; align-items: center; vertical-align: middle; } .sok_basket-added-modal { position: fixed; z-index: 10050; inset: 0; display: flex; align-items: center; justify-content: center; padding: 16px; } .sok_basket-added-modal[hidden] { display: none !important; } .sok_basket-added-modal__backdrop { position: absolute; inset: 0; border: 0; background: rgba(0, 0, 0, 0.35); cursor: pointer; } .sok_basket-added-modal .modal_dialog { position: relative; z-index: 1; max-width: 100%; max-height: calc(100dvh - 32px); overflow: auto; background: var(--color-white, #fff); } body._basket-modal-open { overflow: hidden; } /* End */ /* Start:/local/templates/main/components/bitrix/menu/sidemenu/style.css?17877267521196*/ /* bitrix:menu / sidemenu — левое меню раздела (Figma Sidebar 96:6835) */ .sok_content-left-menu { display: flex; flex-direction: column; overflow: hidden; border-radius: 10px; background: var(--color-plate); } .sok_content-left-menu__item { display: block; padding: 16px; border: 0; background: var(--color-plate); color: #010117; font-family: var(--font-family-base); font-size: 14px; font-weight: 500; line-height: 1.1; text-decoration: none; cursor: pointer; } .sok_content-left-menu__item:first-child { border-top-left-radius: 10px; border-top-right-radius: 10px; } .sok_content-left-menu__item:last-child { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .sok_content-left-menu__item:hover, .sok_content-left-menu__item:focus-visible { background: var(--color-plate-hover); color: #010117; text-decoration: none; } .sok_content-left-menu__item._active { background: var(--color-blue); color: var(--color-white); cursor: default; } .sok_content-left-menu__item._active:hover, .sok_content-left-menu__item._active:focus-visible { background: var(--color-blue); color: var(--color-white); } /* End */ /* Start:/local/templates/main/styles.css?1787547043101*/ /* Bitrix auto-loads this file. Core styles are connected via Asset in header.php (css/main.css). */ /* End */ /* Start:/local/templates/main/template_styles.css?178754704681*/ /* Page-specific overrides via Asset::addCss / $APPLICATION->SetAdditionalCSS */ /* End */ /* /local/templates/main/css/vendor/normalize.min.css?17841810141830 */ /* /local/templates/main/css/vendor/swiper-bundle.min.css?178418101415834 */ /* /local/templates/main/css/vendor/fancybox.min.css?178418101425343 */ /* /local/templates/main/css/vendor/contacts.css?17841810232356 */ /* /local/templates/main/css/foundation/variables.css?17877361552431 */ /* /local/templates/main/css/foundation/typography.css?178478317911394 */ /* /local/templates/main/css/foundation/buttons.css?17878203476011 */ /* /local/templates/main/css/foundation/utilities.css?17841810141162 */ /* /local/templates/main/css/layout/sections.css?17841826003720 */ /* /local/templates/main/css/layout/grid.css?17841826001402 */ /* /local/templates/main/css/layout/container.css?17878022119325 */ /* /local/templates/main/css/components/template.css?178418102320512 */ /* /local/templates/main/css/components/ruslava-template.css?178782042549007 */ /* /local/templates/main/css/components/swiper.css?17841810238806 */ /* /local/templates/main/css/components/fancybox.css?17841810233468 */ /* /local/templates/main/css/components/modal.css?178418102319820 */ /* /local/templates/main/css/components/notifications.css?17841810233066 */ /* /local/templates/main/css/components/dropdown.css?17841810142257 */ /* /local/templates/main/css/components/misc.css?17878254608311 */ /* /local/templates/main/css/components/home.css?1787648187553 */ /* /local/templates/main/css/components/catalog-list.css?178418102331111 */ /* /local/templates/main/css/components/catalog-detail.css?178418102340333 */ /* /local/templates/main/css/components/catalog-detail-page.css?178782603233524 */ /* /local/templates/main/css/components/cart.css?17841810233637 */ /* /local/templates/main/css/components/account.css?178418102316208 */ /* /local/templates/main/css/components/manufacturer.css?17841810233637 */ /* /local/templates/main/css/components/news.css?17841810235681 */ /* /local/templates/main/css/components/contacts-page.css?17841810233099 */ /* /local/templates/main/css/components/error-404.css?17841810234297 */ /* /local/templates/main/css/components/side-menu.css?17841810141811 */ /* /local/templates/main/css/components/product-card.css?178781878916008 */ /* /local/templates/main/css/components/service-card.css?17841810232940 */ /* /local/templates/main/css/components/sections.css?17878014942421 */ /* /local/templates/main/css/components/services.css?17878014949341 */ /* /local/templates/main/css/components/service-list.css?17878014946159 */ /* /local/templates/main/css/components/service-detail.css?17841810235908 */ /* /local/templates/main/css/components/viewed.css?17841810142520 */ /* /local/templates/main/css/components/pagination.css?17841810236011 */ /* /local/templates/main/css/components/list-pagination.css?17878203503256 */ /* /local/templates/main/css/components/content-left-menu.css?1787801494381 */ /* /local/templates/main/css/components/content-page.css?17841810231881 */ /* /local/templates/main/css/components/faq-list.css?17877288913706 */ /* /local/templates/main/css/components/contacts.css?17877336653355 */ /* /local/templates/main/css/components/branches.css?17841810234483 */ /* /local/templates/main/css/components/order.css?178783107613492 */ /* /local/templates/main/css/components/order-success.css?17875465991634 */ /* /local/templates/main/css/components/order-empty.css?17878308242288 */ /* /local/templates/main/css/components/search-empty.css?17847831821987 */ /* /local/templates/main/css/components/catalog-items-empty.css?17847831801731 */ /* /local/templates/main/css/components/catalog-items-page.css?178781758316546 */ /* /local/templates/main/css/components/catalog-items-filter.css?178781372311700 */ /* /local/templates/main/css/components/catalog-items-sections.css?17878017682715 */ /* /local/templates/main/css/components/search-catalog-items.css?17846311731241 */ /* /local/templates/main/css/components/catalog-product-card-grid.css?17878187547930 */ /* /local/templates/main/css/components/catalog-product-card-list.css?178781735313378 */ /* /local/templates/main/components/bitrix/sale.basket.basket.line/header/style.css?1787811162741 */ /* /local/templates/main/components/bitrix/menu/sidemenu/style.css?17877267521196 */ /* /local/templates/main/styles.css?1787547043101 */ /* /local/templates/main/template_styles.css?178754704681 */