/* Start:/local/templates/dresscodeV2/components/dresscode/slider/promoSlider_tsk/style.css?17736576033396*/ /* TSK Main Slider — вписывается в колонку head-slider, ширина как у контента шапки, закругление 8px, соотношение сторон 6636×2032 */ .tsk-swiper { position: relative; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; overflow: hidden; border-radius: 8px; /* Изолируем слайдер по размеру и раскладке, чтобы огромные transform от Swiper не раздували страницу */ } /* Соотношение 6636×2032 — высота считается от ширины контейнера */ .tsk-swiper .tsk-swiper-container { width: 100%; aspect-ratio: 6636 / 2032; overflow: hidden; border-radius: 8px; } .tsk-swiper .tsk-swiper-container .swiper-wrapper { height: 100%; border-radius: 8px; } .tsk-swiper .tsk-swiper-container.swiper { height: auto; } /* fallback для старых браузеров: высота через padding */ @supports not (aspect-ratio: 6636 / 2032) { .tsk-swiper .tsk-swiper-container { height: 0; padding-bottom: 30.6235%; /* 2032/6636 */ position: relative; } .tsk-swiper .tsk-swiper-container .swiper-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } } .tsk-swiper .swiper-slide { position: relative; height: 100%; } .tsk-slide-content { display: block; width: 100%; height: 100%; border-radius: 8px; overflow: hidden; text-decoration: none; color: inherit; } .tsk-image-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .tsk-slide-image { width: 100%; height: 100%; display: block; object-fit: cover; } .tsk-slide-video { width: 100%; height: 100%; display: block; object-fit: cover; } /* Кнопки навигации — по центру по вертикали, отступы от краёв */ .tsk-swiper-nav { position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); display: flex; justify-content: space-between; align-items: center; padding: 0 32px; margin: 0; z-index: 10; pointer-events: none; box-sizing: border-box; } .tsk-swiper-btn { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; min-width: 48px; min-height: 48px; padding: 0; border: none; background: rgba(255, 255, 255, 0.95); border-radius: 50%; overflow: hidden; cursor: pointer; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(0, 0, 0, 0.08); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); pointer-events: auto; flex-shrink: 0; } .tsk-swiper-btn:hover { background: #fff; transform: scale(1.05); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); } .tsk-swiper-btn:active { transform: scale(0.95); } .tsk-swiper-icon { flex-shrink: 0; color: #1f2937; } @media (max-width: 768px) { .tsk-swiper { margin: 10px auto; } .tsk-swiper .tsk-swiper-container { aspect-ratio: 6636 / 2032; } @supports not (aspect-ratio: 6636 / 2032) { .tsk-swiper .tsk-swiper-container { padding-bottom: 30.6235%; } } .tsk-swiper-nav { display: none; } .tsk-swiper-btn { width: 44px; height: 44px; min-width: 44px; min-height: 44px; border-radius: 50%; } } /* End */ /* Start:/local/templates/dresscodeV2/vendor/swiper/swiper-bundle.min.css?177271543818454*/ /** * Swiper 11.2.10 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2025 Vladimir Kharlampidi * * Released under the MIT License * * Released on: June 28, 2025 */ @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}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.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-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.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-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.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-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-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .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{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.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:var(--swiper-navigation-top-offset,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.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display: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;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.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-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);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:var(--swiper-pagination-bullet-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:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);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-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,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:var(--swiper-pagination-progressbar-size,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:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-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;touch-action:none}.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{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.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-prev{pointer-events:auto;visibility:visible}.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-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.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-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-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.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/dresscodeV2/components/bitrix/news.list/indexBanners_tsk/style.css?177365783612419*/ /** * Компактные калькуляторы под слайдером (indexBanners_tsk) * Две аккуратные "пилюли" с иконкой и описанием. * Адаптированы под колонку .head-calculators и под использование в контенте. */ .tsk-index-banners-wrap { margin: 24px 0; font-family: "Montserrat", Arial, sans-serif; } /* В колонке калькуляторов убираем внешний отступ */ .head-calculators .tsk-index-banners-wrap { margin: 0; } .tsk-index-banners { display: flex; flex-direction: column; gap: 10px; width: 100%; } .tsk-index-banners__card { display: block; text-decoration: none; color: inherit; width: 100%; } .tsk-index-banners__card--widget { cursor: pointer; } .tsk-index-banners__inner { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 8px; background: #f9fafb; border: 1px solid #e5e7eb; box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.8); transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.15s ease; } .tsk-index-banners__card:hover .tsk-index-banners__inner, .tsk-index-banners__card:focus-visible .tsk-index-banners__inner { background-color: #fffdf5; border-color: rgba(252, 181, 20, 0.7); box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(252, 181, 20, 0.35); transform: translateY(-1px); } .tsk-index-banners__card:focus-visible { outline: none; } .tsk-index-banners__icon { position: relative; z-index: 1; flex: 0 0 28px; height: 28px; background: #fff7cc; display: flex; align-items: center; justify-content: center; color: #1a1a1a; box-shadow: 0 0 0 1px rgba(255, 215, 80, 0.6); overflow: hidden; } .tsk-index-banners__icon-img { display: block; width: 18px; height: 18px; position: absolute; inset: 0; margin: auto; } .tsk-index-banners__icon-img--bottom { filter: none; transform: translate(1px, 1px); } .tsk-index-banners__icon-img--top { filter: brightness(0) saturate(100%); opacity: 0.95; } .tsk-index-banners__text { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 2px; color: #111827; } .tsk-index-banners__text .name { display: block; font-size: 14px; line-height: 1.4; font-weight: 600; color: #111827; } /* Здесь желательно держать 1–3 коротких предложения с объяснением, что делает калькулятор */ .tsk-index-banners__text .descr { display: block; font-size: 12px; line-height: 1.5; color: #4b5563; max-width: 28ch; } /* На 960px и меньше описания убираем, чтобы кнопки были компактнее */ @media (max-width: 960px) { .tsk-index-banners__text .descr { display: none; } } /* Хэлперы для старой вёрстки с фоновыми блоками — прячем их */ .tsk-index-banners__bg, .tsk-index-banners__overlay { display: none !important; } /* ===== Адаптивность ===== */ @media (min-width: 1024px) { /* В контенте (не в колонке) можно расположить 2–3 карточки в ряд */ /* В колонке калькуляторов — строго вертикальный стек компактных кнопок одинаковой ширины */ .head-calculators .tsk-index-banners { flex-direction: column; flex-wrap: nowrap; gap: 10px; width: 100%; } .head-calculators .tsk-index-banners__card { flex: 0 0 auto; width: 100%; } .head-calculators .tsk-index-banners__inner { padding: 9px 12px; } } @media (max-width: 1023px) { .tsk-index-banners-wrap { margin: 20px 0; } .tsk-index-banners__inner { padding: 9px 12px; } } @media (max-width: 768px) { .tsk-index-banners { flex-direction: column; gap: 8px; } .tsk-index-banners__inner { padding: 8px 10px; } .tsk-index-banners__icon { flex-basis: 24px; height: 24px; } .tsk-index-banners__icon-img { width: 16px; height: 16px; } .tsk-index-banners__text .name { font-size: 13px; } .tsk-index-banners__text .descr { font-size: 11px; max-width: 32ch; } } @media (max-width: 480px) { .tsk-index-banners__inner { padding: 8px 10px; gap: 8px; } .tsk-index-banners__icon { display: none; } .tsk-index-banners__text { align-items: flex-start; } .tsk-index-banners__text .name { font-size: 13px; } .tsk-index-banners__text .descr { max-width: 100%; } } /** * Баннеры главной (Калькуляторы, Система штукатурного фасада) — стиль ТСК, под шапку и слайдер. * Ширина в limiter 1366px, закругление 8px, акцент #fcb514. */ .tsk-index-banners-wrap { margin: 60px 0; padding-top: 0; box-sizing: border-box; } .tsk-index-banners { display: flex; flex-wrap: nowrap; flex-direction: row; gap: 20px; width: 100%; font-family: "Montserrat", Arial, sans-serif; } .tsk-index-banners__card { display: block; text-decoration: none; color: inherit; border-radius: 10px; /* overflow оставляем видимым, чтобы не обрезать тень/рамку при наведении */ overflow: visible; /* визуальный фон и рамка задаются на .tsk-index-banners__inner */ } /* Если вёрстка ещё с фоновой картинкой — прячем её */ .tsk-index-banners__bg, .tsk-index-banners__overlay { display: none !important; } .tsk-index-banners__icon { position: relative; z-index: 1; flex: 0 0 40px; height: 40px; border-radius: 0; background: transparent; display: flex; align-items: center; justify-content: center; color: #1a1a1a; box-shadow: none; } .tsk-index-banners__icon-img { display: block; width: 32px; height: 32px; position: absolute; top: 0; left: 0; } .tsk-index-banners__icon-img--bottom { filter: none; transform: translate(2px, 2px); } .tsk-index-banners__icon-img--top { filter: brightness(0) saturate(100%); opacity: 0.9; /* визуально ближе к #1a1a1a, а не к чистому чёрному */ } .tsk-index-banners__text { position: relative; z-index: 2; width: 100%; color: #1a1a1a; font-size: 15px; line-height: 1.5; font-weight: 600; text-shadow: none; } /* Карточки без фонового фото — оставляем светлый фон */ .tsk-index-banners__card--no-img .tsk-index-banners__inner { background: #f9fafb; } .tsk-index-banners__card--no-img .tsk-index-banners__overlay { display: none; } .tsk-index-banners__card::after { content: none; } /* Стили для контента внутри DETAIL_TEXT (имя, описание, кнопка) */ .tsk-index-banners__text .name { display: block; font-size: 16px; margin-bottom: 4px; color: #1a1a1a; } .tsk-index-banners__text .descr { display: block; font-size: 13px; font-weight: 400; opacity: 0.95; margin-bottom: 0; color: #4b5563; } .tsk-index-banners__text .btn-simple, .tsk-index-banners__text .btn { display: inline-block; padding: 4px 10px; font-size: 12px; font-weight: 600; background: #fcb514; color: #1a1a1a; text-decoration: none; } .tsk-index-banners__text .btn-simple:hover, .tsk-index-banners__text .btn:hover { background: #faba4a; color: #1a1a1a; } /* ====== Адаптив для блока баннеров на главной (indexBanners_tsk) ====== */ @media (max-width: 1024px) { .tsk-index-banners { gap: 16px; } .tsk-index-banners__inner { padding: 18px 18px; gap: 14px; } .tsk-index-banners__text .name { font-size: 14px; } .tsk-index-banners__text .descr { font-size: 11px; } /* В колонке калькуляторов на этой ширине тоже делаем кнопки в одну колонку и на всю ширину */ .head-calculators .tsk-index-banners { flex-direction: column; flex-wrap: nowrap; gap: 8px; } .head-calculators .tsk-index-banners__card { flex: 0 0 auto; width: 100%; max-width: 100%; } } @media (max-width: 768px) { .tsk-index-banners { flex-wrap: nowrap; justify-content: space-between; gap: 8px; } .tsk-index-banners__card { flex: 0 0 calc(50% - 8px); max-width: none; } .tsk-index-banners__inner { align-items: center; min-height: 60px; padding: 8px 8px; gap: 6px; } /* Для блока калькуляторов переопределяем ширину карточек, чтобы они были по одной в строке */ .head-calculators .tsk-index-banners__card { flex: 0 0 auto; max-width: 100%; } .tsk-index-banners__icon { flex: 0 0 20px; height: 20px; } .tsk-index-banners__icon-img { width: 18px; height: 18px; } } @media (max-width: 480px) { .tsk-index-banners__inner { padding: 8px 8px; gap: 6px; } .tsk-index-banners__icon { display: none; } .tsk-index-banners__text { font-size: 12px; text-align: center; display: flex; flex-direction: column; align-items: center; } .tsk-index-banners__text .name { font-size: 11px; margin-bottom: 0; } .tsk-index-banners__text .descr { display: none; } .tsk-index-banners__text .btn-simple, .tsk-index-banners__text .btn { padding: 3px 8px; font-size: 10px; } } /* Дополнительная ужатая версия именно для калькуляторов под слайдером на мобильных */ @media (max-width: 768px) { .head-calculators .tsk-index-banners { flex-direction: row; flex-wrap: nowrap; justify-content: space-between; gap: 6px; } .head-calculators .tsk-index-banners__card { flex: 0 0 calc(50% - 4px); max-width: none; } .head-calculators .tsk-index-banners__inner { min-height: 44px; padding: 6px 8px; gap: 6px; } .head-calculators .tsk-index-banners__icon { flex: 0 0 18px; height: 18px; } .head-calculators .tsk-index-banners__icon-img { width: 16px; height: 16px; } .head-calculators .tsk-index-banners__text .name { font-size: 11px; } /* На мобильных калькуляторы выглядят как две компактные кнопки — без длинного описания */ .head-calculators .tsk-index-banners__text .descr { display: none; } } @media (max-width: 480px) { .head-calculators .tsk-index-banners__inner { min-height: 40px; padding: 6px 8px; } .head-calculators .tsk-index-banners__icon { display: none; } .head-calculators .tsk-index-banners__text { font-size: 11px; text-align: center; align-items: flex-start; } } /* Калькуляторы под слайдером (index.calculators внутри .head-calculators): две компактные кнопки фиксированной высоты */ @media (min-width: 1024px) { .head-calculators .tsk-index-banners-wrap { margin: 0; padding-top: 0; height: 100%; } .head-calculators .tsk-index-banners { display: flex; flex-direction: column; height: 100%; gap: 12px; align-items: stretch; } .head-calculators .tsk-index-banners__card { display: flex; flex: 1 1 0; min-height: 0; width: 100%; } .head-calculators .tsk-index-banners__inner { flex: 1 1 auto; align-items: center; padding: 10px 14px; gap: 10px; } .head-calculators .tsk-index-banners__icon { flex: 0 0 28px; height: 28px; } .head-calculators .tsk-index-banners__icon-img { width: 24px; height: 24px; } .head-calculators .tsk-index-banners__text .name { font-size: 14px; margin-bottom: 0; } .head-calculators .tsk-index-banners__text .descr { font-size: 11px; opacity: 0.8; } } /* Режим редактирования Bitrix: служебная обертка ломает flex-растяжение карточек */ .head-calculators .bx-context-toolbar-empty-area .tsk-index-banners__card { display: block !important; flex: 0 0 auto !important; min-height: auto !important; width: 100% !important; } /* Accessibility: повышаем контраст вторичного текста в карточках */ .tsk-index-banners__text .descr { color: #374151; opacity: 1; } .head-calculators .tsk-index-banners__text .descr { color: #374151; opacity: 1; } /* End */ /* Start:/bitrix/components/dresscode/cast.smart.filter/templates/.default/style.css?171386452614799*/ #smartFilter { margin-top: 24px; border: 1px solid #e7e8ea; position: relative; border-radius: 4px; } #smartFilterForm{ padding-bottom: 24px; } #smartFilter a{ -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } #smartFilter span.heading{ font-family: 'robotobold'; text-transform: uppercase; background: #f3f3f3; text-align: center; padding-left: 0px; font-size: 14px; cursor: pointer; color: #000000; } #smartFilter .paramsBox { border-bottom: 1px solid #e7e8ea; padding: 24px; position: relative; clear: both; font-size: 14px; } #smartFilter .paramsBoxTitle { display: inline-block; margin-bottom: 18px; position: relative; font-size: 14px; line-height: 20px; } #smartFilter .paramsBoxTitle span{ cursor: pointer; } #smartFilter .propExpander { background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/expander.png) 50% 8px no-repeat transparent; vertical-align: middle; display: inline-block; position: relative; line-height: 16px; cursor: pointer; height: 26px; width: 21px; top: 0px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } #smartFilter .propExpander.expanded { -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } #smartFilter .showALL { -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } #smartFilter .showALL:active{ position: relative; top: 1px; } #smartFilter .params { transition: all .2s ease; clear: both; opacity: 1; } #smartFilter .params.collapsed { display: block; margin-top: -18px; overflow: hidden; opacity: 0; max-height: 0; } #smartFilter .radio, #smartFilter .checkbox { list-style: none; padding: 0; margin: 0; } #smartFilter .radio li, #smartFilter .checkbox li { padding-bottom: 12px; } #smartFilter .radio label, #smartFilter .checkbox label{ -webkit-transition: all 0.1s; -o-transition: all 0.1s; transition: all 0.1s; } #smartFilter .radio .off, #smartFilter .checkbox .off { display: none; } #smartFilter .radio li:last-child, #smartFilter .checkbox li:last-child { padding-bottom: 0; } #smartFilter .disabled { cursor: default !important; color: #888; } #smartFilter .disabled .wrap { opacity: .6; } #smartFilter .dropdown { background-color: #ffffff; border: 1px solid #e7e8ea; position: relative; line-height: 13px; font-size: 13px; display: block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; border-radius: 4px; } #smartFilter .checkedItem { padding: 12px 30px 12px 8px !important; border-radius: 4px; background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/selectArrow.png) 97% 50% no-repeat transparent; display: block; cursor: pointer; } #smartFilter .dropdown label:before, #smartFilter .checkboxList label:before { display: none; } #smartFilter .dropdownList { background-color: #ffffff; border: 1px solid #e7e8ea; position: absolute; list-style: none; margin: 0 -1px; opacity: 0; padding: 0; z-index: 2; top: 47px; right: 0; left: 0; visibility: hidden; } #smartFilter .dropdownList.opened { visibility: visible; opacity: 1; } #smartFilter .pics .dropdownList { top: 52px; } #smartFilter .dropdownList .item { padding: 8px !important; display: block; } #smartFilter .dropdownList .selected, #smartFilter .dropdownList .item:hover { cursor: pointer; color: #ffffff; } #smartFilter .dropdown input { top: -44px; } #smartFilter .rangeSlider input[type="text"] { -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; background-color: #ffffff; border-color: #e7e8ea; border-radius: 4px; color: #888888; height: 26px; width: 68px; } #smartFilter .rangeSlider input[type="text"]:nth-of-type(1) { margin-right: 12px; } #smartFilter .rangeSlider label { display: inline-block; margin-right: 12px; } #smartFilter .slider { background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/uiBg.png) 3px 0 repeat-x transparent; margin: 24px auto 0; position: relative; max-width: 300px; height: 54px; width: 100%; } #smartFilter .slider .trans { -webkit-transition: width 0.2s ease-in-out, visibility 0.2s linear; -moz-transition: width 0.2s ease-in-out, visibility 0.2s linear; -o-transition: width 0.2s ease-in-out, visibility 0.2s linear; transition: width 0.2s ease-in-out, visibility 0.2s linear; } #smartFilter .handler { position: absolute; cursor: pointer; height: 14px; width: 100%; top: 19px; } #smartFilter .slider .blackoutLeft, #smartFilter .slider .blackoutRight { background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/handler.png) 0 0 repeat-x transparent; position: absolute; height: 14px; width: 0; top: 0; } #smartFilter .slider .blackoutLeft { -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 0px; } #smartFilter .slider .blackoutRight { -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; right: 0px; } #smartFilter .slider ins { background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/motionButton.png) 0 0 no-repeat transparent; position: absolute; cursor: pointer; display: block; height: 34px; width: 34px; z-index: 10; top: -10px; } #smartFilter .slider ins:hover { background-position: -34px 0; } #smartFilter .slider ins:active { background-position: -68px 0; } #smartFilter .slider .left { right: -24px; } #smartFilter .slider .right { left: -24px; } #smartFilterControls { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: center; padding: 0px 12px; margin: 24px 0 0; overflow: hidden; list-style: none; } #smartFilterControls li { width: 48%; float: left; } #smartFilterControls li:last-child{ float: right; } #set_filter, #del_filter { line-height: 46px; font-size: 16px; height: 46px; } #set_filter { -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; text-decoration: none; border-radius: 4px; font-size: 13px; display: block; color: #fff; } #set_filter:active{ position: relative; top: 1px; } #del_filter { -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; background-color: #2b2b2b; text-decoration: none; border-radius: 4px; text-align: center; color: #ffffff; font-size: 13px; display: block; border: none; } #del_filter:hover{ background-color: #1e1e1e; } #del_filter:active{ position: relative; top: 1px; } #smartFilter .checkboxList { list-style: none; padding: 0; margin: 0; } #smartFilter .checkboxList li { padding-bottom: 12px; position: relative; cursor: pointer; } #smartFilter .checkboxList li:last-child { padding-bottom: 0; } #smartFilter .checkboxList label { padding-left: 0 !important; display: block; vertical-align: middle; } #smartFilter .checkboxList.inline li { display: inline-block; } #smartFilter .checkboxList input { top: 10px; } #smartFilter .checkboxList .icon, #smartFilter .dropdown .icon { vertical-align: middle; border: 1px solid #e7e8ea; display: inline-block; margin-right: 12px; padding: 6px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-transition: border-color .3s ease; -moz-transition: border-color .3s ease; -o-transition: border-color .3s ease; transition: border-color .3s ease; } #smartFilter .checkboxList .disabled .icon, #smartFilter .dropdown .disabled .icon { border-color: #e7e8ea !important; } #smartFilter .checkboxList .icon .wrap, #smartFilter .dropdown .icon .wrap { -webkit-background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; background-size: contain; vertical-align: middle; display: inline-block; height: 24px; width: 24px; } #smartFilter .dropdown .icon { padding: 4px; } #smartFilter .dropdown .icon .wrap { height: 20px; width: 20px; } #smartFilter .checkboxList .value, #smartFilter .dropdown .value { vertical-align: middle; display: inline-block; line-height: 16px; } #smartFilter .filterCalendar { position: relative; display: block; float: left; width: 45%; } #smartFilter .filterCalendar + .filterCalendar { margin-left: 10%; } #smartFilter .filterCalendar .calendar-icon { position: absolute; top: 5px; right: 5px; z-index: 2; opacity: 0; } #smartFilter .filterCalendar .fakeCalendarIcon { position: absolute; top: 6px; right: 5px; z-index: 1; height: 20px; width: 20px; background-color: #ccc; } #smartFilter .filterCalendar input[type="text"] { background-color: #2d2d2d; border-color: #454545; padding-right: 30px; text-align: center; display: block; height: 32px; width: 100%; } #smartFilter .hint { display: inline-block; vertical-align: top; position: relative; margin-right: 6px; cursor: pointer; height: 18px; width: 18px; } #smartFilter .hint:hover { background-position: -18px 0; } #smartFilter .hintValue { background-color: #ffffff; border: 1px solid #e7e8ea; position: absolute; line-height: 18px; min-width: 250px; margin-top: 8px; font-size: 13px; cursor: default; display: none; padding: 16px; z-index: 3; top: 100%; } #smartFilter .hintValue .heading { line-height: 18px; font-size: 16px; margin: 0 0 8px; color: #FFF; padding: 0; } #smartFilter .hintValue .close { text-decoration: none; position: absolute; font-size: 22px; cursor: pointer; z-index: 2; right: 6px; top: 6px; } #smartFilter button, #smartFilter input, #smartFilter select, #smartFilter textarea { box-sizing: border-box; } #smartFilter button:focus, #smartFilter input:focus, #smartFilter select:focus, #smartFilter textarea:focus { outline: none; } #smartFilter button, #smartFilter select { text-transform: none; } #smartFilter button { overflow: visible; } #smartFilter input[type="submit"], #smartFilter input[type="reset"], #smartFilter button { cursor: pointer; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } #smartFilter input[type="file"] { background: transparent; border: 1px solid transparent; } #smartFilter input[type="text"], #smartFilter input[type="password"], #smartFilter input[type="email"], #smartFilter input[type="tel"], #smartFilter input[type="url"], #smartFilter textarea, #smartFilter select { background: rgba(0,0,0,.5); border: 1px solid #373737; height: 42px; padding: 0px 8px; font-size: 13px; color: #fff; margin: 0; } #smartFilter textarea{ padding: 4px 8px; } #smartFilter input[type="text"]:focus, #smartFilter input[type="email"]:focus, #smartFilter input[type="password"]:focus, #smartFilter input[type="tel"]:focus, #smartFilter input[type="url"]:focus, #smartFilter textarea:focus, #smartFilter select:focus { border-color: #cccccc; } #smartFilter input[type="checkbox"] + label, #smartFilter input[type="radio"] + label { cursor: pointer; } #smartFilter input[type="checkbox"]:not(checked), #smartFilter input[type="radio"]:not(checked) { position: absolute; opacity: 0; } #smartFilter input[type="checkbox"]:not(checked) + label, #smartFilter input[type="radio"]:not(checked) + label { position: relative; padding-left: 28px; } #smartFilter input[type="checkbox"] + label:before { background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/checkBox.png) 0 0 no-repeat transparent; } #smartFilter input[type="radio"] + label:before { background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/radio.png) 0 0 no-repeat transparent; } #smartFilter input[type="checkbox"]:not(checked) + label:before, #smartFilter input[type="radio"]:not(checked) + label:before { position: absolute; content: " "; height: 17px; width: 17px; left: 0; top: 0px; } #smartFilter input[type="checkbox"]:not(checked) + label:hover:before, #smartFilter input[type="radio"]:not(checked) + label:hover:before { background-position: 0 -17px; } #smartFilter input[type="checkbox"]:checked + label:before, #smartFilter input[type="radio"]:checked + label:before { background-position: 0 -34px; } #smartFilter input[type="checkbox"]:checked + label:hover:before, #smartFilter input[type="radio"]:checked + label:hover:before { background-position: 0 -51px; } #smartFilter input[type="checkbox"]:disabled + label, #smartFilter input[type="radio"]:disabled + label { cursor: default; } #smartFilter input[type="checkbox"]:disabled + label:before, #smartFilter input[type="radio"]:disabled + label:before { background-position: 0 -68px !important; } #smartFilter textarea { resize: vertical; overflow: auto; height: auto; } #smartFilter button::-moz-focus-inner, #smartFilter input::-moz-focus-inner { padding:0; border:0 } #smartFilter input::-moz-placeholder, #smartFilter textarea::-moz-placeholder { color: #fff; } #smartFilter input:focus::-moz-placeholder, #smartFilter textarea:focus::-moz-placeholder { color: transparent; } #smartFilter input::-ms-input-placeholder, #smartFilter textarea::-ms-input-placeholder { color: #fff; } #smartFilter input:focus::-webkit-input-placeholder, #smartFilter textarea:focus::-webkit-input-placeholder { color: #fff; } #smartFilter input:focus::-webkit-input-placeholder { color: transparent; } #smartFilter textarea:focus::-webkit-input-placeholder{ color: transparent; } #smartFilter input[type="search"] { -webkit-appearance: textfield; } #smartFilter input[type="search"]::-webkit-search-cancel-button, #smartFilter input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } #modef { -webkit-transition: top .2s ease; -moz-transition: top .2s ease; -o-transition: top .2s ease; transition: top .2s ease; position: absolute; line-height: 38px; padding-left: 7px; text-align: center; font-size: 12px; width: 193px; height: 38px; left: 400px; color: #fff; z-index: 99; } #modef .close { background: url(/bitrix/components/dresscode/cast.smart.filter/templates/.default/images/closeModef.png) 0 0 no-repeat; vertical-align: middle; display: inline-block; margin-right: 8px; margin-top: -2px; height: 12px; width: 12px; } #modef .close:hover { opacity: .8; } #modef .close:active { position: relative; top: 1px; } #modef_send { margin-left: 8px; color: #ffffff; } #modef_send:hover { opacity: 0.9; } #modef_num{ display: inline-block; } #modef_send{ display: inline-block; } #smartFilter .elCount { text-decoration: none; } /* End */ /* Start:/local/templates/dresscodeV2/components/bitrix/system.pagenavigation/round/style.css?17727030592400*/ .bx-pagination { margin: 10px 0; } .bx-pagination .bx-pagination-container { text-align: center; position: relative; } .bx-pagination .bx-pagination-container ul { padding: 0; margin: 0; list-style: none; display: inline-block; } .bx-pagination .bx-pagination-container ul li { display: inline-block; margin: 0 2px 15px 2px; } .bx-pagination .bx-pagination-container ul li span { -webkit-transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; -moz-transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; -ms-transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; -o-transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; background: #eff0f1; padding: 0 8px; display: block; height: 32px; min-width: 32px; line-height: 32px; color: #444; font-size: 14px; border-radius: 16px; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .bx-pagination .bx-pagination-container ul li a { text-decoration: none; display: block; border-radius: 16px; display: block; height: 32px; min-width: 32px; line-height: 32px; color: #444; vertical-align: middle; } .bx-pagination .bx-pagination-container ul li a:hover span { background: #dadada; } .bx-pagination .bx-pagination-container ul li.bx-pag-all a span, .bx-pagination .bx-pagination-container ul li.bx-pag-prev a span, .bx-pagination .bx-pagination-container ul li.bx-pag-next a span { background: #fff; border: 2px solid #eff0f1; line-height: 28px; padding: 0 18px; color: #444; } .bx-pagination .bx-pagination-container ul li.bx-pag-all span, .bx-pagination .bx-pagination-container ul li.bx-pag-prev span, .bx-pagination .bx-pagination-container ul li.bx-pag-next span { color: #aab1b4; background: #fff; border: 2px solid #eff0f1; line-height: 28px; padding: 0 18px; } .bx-pagination .bx-pagination-container ul li.bx-pag-all a:hover span, .bx-pagination .bx-pagination-container ul li.bx-pag-prev a:hover span, .bx-pagination .bx-pagination-container ul li.bx-pag-next a:hover span { background: #fff; border-color: #dadada; color: #1a1a1a; } /* End */ /* Start:/local/templates/dresscodeV2/components/dresscode/catalog.section/squares3_newtabs/style.css?1773836576824*/ /* Сетка товаров в таб-компоненте на главной: 4 карточки в строку */ .items.productList { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; width: 100%; margin: 0; box-sizing: border-box; } .items.productList .product-card, .items.productList .tsk-product-card { box-sizing: border-box; width: auto !important; min-width: 0; max-width: none !important; } @media (max-width: 1100px) { .items.productList { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } } @media (max-width: 700px) { .items.productList { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; } } @media (max-width: 450px) { .items.productList { grid-template-columns: 1fr; gap: 10px; } } /* End */ /* Start:/local/templates/dresscodeV2/components/dresscode/catalog.item/tsk_react/style.css?177390454215302*/ /* Карточка товара в стиле React PageProduct (tskdiplomat) */ /* Важно: саму сетку (.items.productList) строим через grid в section.css, здесь не задаем display/flex/width для контейнера, чтобы не ломать ширину. */ .tsk-product-card { cursor: pointer; position: relative; z-index: 1; padding: 12px; padding-bottom: 16px; background: #fff; border-radius: 12px; border: 1px solid transparent; transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1); display: flex; flex-direction: column; min-height: 0; font-family: "Montserrat", sans-serif; justify-content: space-between; } .tsk-product-card:hover { box-shadow: 0 4px 16px rgba(255, 204, 51, 0.2); border-color: rgba(255, 204, 51, 0.3); } /* Ссылка на товар: растянута на всю карточку, клик по карточке ведёт в карточку товара */ .tsk-product-card__link { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; pointer-events: auto; } /* Верхний блок: клики проходят к ссылке карточки */ .tsk-product-card__top { flex: 0 0 auto; display: flex; flex-direction: column; position: relative; z-index: 0; pointer-events: none; } /* Нижний блок поверх ссылки, но клики проходят кроме кнопок и табов цен */ .tsk-product-card__bottom { flex: 0 0 auto; display: flex; flex-direction: column; position: relative; z-index: 2; pointer-events: none; } .tsk-product-card__buttons, .tsk-product-card__price-tabs, .tsk-product-card__availability { pointer-events: auto; } .tsk-product-card__buttons a { transition: all 0.25s ease; } /* Ссылка "В наличии на складах" — пунктирное подчёркивание */ .tsk-product-card__availability-link { position: relative; color: #059669; text-decoration: none; border-bottom: 1px dashed rgba(5, 150, 105, 0.7); padding-bottom: 1px; cursor: pointer; } .tsk-product-card__availability-link:hover { color: #047857; border-bottom-color: rgba(4, 120, 87, 0.9); } /* Модалка "Наличие на складах" как оверлей */ .modal-window.js-stores-modal { position: fixed; inset: 0; z-index: 1400; display: none; background: rgba(15, 23, 42, 0.45); } .modal-window.js-stores-modal .modal-header { font-family: "Montserrat", sans-serif; font-size: 16px; font-weight: 600; margin-bottom: 10px; } .modal-window.js-stores-modal .modal-content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #ffffff; border-radius: 12px; padding: 16px 18px 18px; min-width: 260px; max-width: 360px; box-shadow: 0 18px 40px rgba(15, 23, 42, 0.4); box-sizing: border-box; } .modal-window.js-stores-modal .modal-close { position: absolute; top: 8px; right: 10px; font-size: 20px; cursor: pointer; color: #4b5563; } .modal-window.js-stores-modal .store-info { font-size: 13px; color: #111827; } .modal-window.js-stores-modal .store-label { font-weight: 600; margin-right: 4px; } .tsk-product-card__img { position: relative; margin-bottom: 12px; border-radius: 8px; overflow: hidden; height: 200px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } /* Иконки избранного / сравнения поверх изображения */ .tsk-product-card .icons-wish-and-compare { position: absolute; top: 10px; right: 10px; display: flex; flex-direction: column; gap: 6px; z-index: 3; pointer-events: auto; } .tsk-product-card .icons-wish-and-compare .row { margin: 0; } .tsk-product-card .icons-wish-and-compare .custom-icon { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 999px; background: rgba(255, 255, 255, 0.95); color: #6b7280; text-decoration: none; box-shadow: 0 1px 4px rgba(15, 23, 42, 0.18); transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease, opacity 0.15s ease; } .tsk-product-card .icons-wish-and-compare .custom-icon:hover { background: #ffffff; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(15, 23, 42, 0.32); opacity: 0.98; } /* Состояние «добавлено в избранное» — красное сердце */ .tsk-product-card .icons-wish-and-compare .addWishlist.custom-icon.added { color: #ef4444; } .tsk-product-card .icons-wish-and-compare .addWishlist.custom-icon.added .icon-svg path { fill: #ef4444; stroke: #ef4444; } /* Состояние «в сравнении» — жёлтые столбики */ .tsk-product-card .icons-wish-and-compare .addCompare.custom-icon.added { color: var(--primary-color, #fcb514); } .tsk-product-card .icons-wish-and-compare .icon-svg { pointer-events: none; } /* Скрытые старые иконки для JS-логики addWishlist/addCompare */ .tsk-product-card .icons-wish-and-compare img.icon { display: none; } .tsk-product-card__img img { max-width: 100%; max-height: 100%; object-fit: contain; transition: transform 0.3s ease; } .tsk-product-card:hover .tsk-product-card__img img { opacity: 0.95; } .tsk-product-card__badges { position: absolute; top: 10px; left: 10px; display: flex; flex-wrap: wrap; gap: 6px; z-index: 2; pointer-events: none; } .tsk-badge { display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; padding: 4px 8px; border-radius: 999px; font-family: "Montserrat", sans-serif; line-height: 1.2; color: #0f172a; background: rgba(255, 255, 255, 0.92); border: 1px solid rgba(15, 23, 42, 0.08); box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12); white-space: nowrap; } .tsk-badge--new { color: #fff; background: rgba(34, 197, 94, 0.95); border-color: rgba(34, 197, 94, 0.55); } .tsk-badge--hit { color: #1a1a1a; background: rgba(251, 191, 36, 0.95); border-color: rgba(251, 191, 36, 0.6); } .tsk-badge--sale { color: #fff; background: rgba(239, 68, 68, 0.95); border-color: rgba(239, 68, 68, 0.5); } .tsk-product-card__name { font-size: 14px; line-height: 1.4; margin: 0 0 10px 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; min-height: 60px; /* резерв под 3 строки, чтобы артикул/цена/кнопки были на одной высоте */ color: #1f2937; font-weight: 500; flex-shrink: 0; position: relative; z-index: 2; } .tsk-product-card__art-wrap { min-height: 28px; margin-bottom: 2px; flex-shrink: 0; } .tsk-product-card__art { font-size: 12px; color: #4b5563; margin: 0; position: relative; z-index: 1; } .tsk-product-card__avoid { display: flex; align-items: center; gap: 6px; font-size: 13px; margin: 0 0 10px 0; padding: 4px 0; min-height: 24px; flex-shrink: 0; position: relative; z-index: 2; } .tsk-product-card__avoid-icon { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; flex-shrink: 0; font-size: 14px; color: #10b981; font-weight: bold; } .tsk-product-card__avoid--backorder .tsk-product-card__avoid-icon { color: #9ca3af; filter: grayscale(100%) brightness(0.7); } .tsk-product-card__availability--instock { color: #047857; margin: 0; font-weight: 500; } .tsk-product-card__availability--backorder { color: #6b7280; margin: 0; font-weight: 500; } .tsk-product-card__price-block { font-size: 13px; display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; padding: 8px 0; min-height: 40px; flex-shrink: 0; position: relative; z-index: 2; } .tsk-product-card__price-tabs { display: flex; align-items: center; gap: 6px; flex: 1; flex-wrap: wrap; } .tsk-tab { cursor: pointer; padding: 4px 8px; border-radius: 4px; font-size: 12px; color: #6b7280; font-weight: 400; transition: all 0.2s ease; } .tsk-tab:hover { background: #f3f4f6; color: #374151; } .tsk-tab--active { font-weight: 600; color: #1f2937; background: #fef3c7; } .tsk-product-card__price { font-size: 20px; font-weight: 700; margin: 0; white-space: nowrap; color: #1f2937; } .tsk-product-card__buttons { display: flex; flex-direction: column; gap: 4px; margin-top: auto; flex-shrink: 0; position: relative; z-index: 2; } /* Базовые кнопки: фиксированная высота и выравнивание, чтобы не ломались при смене текста */ .tsk-btn { display: inline-flex; width: 100%; min-height: 38px; padding: 8px 16px; align-items: center; justify-content: center; text-align: center; font-size: 13px; font-weight: 700; font-family: "Montserrat", sans-serif; border-radius: 12px; text-decoration: none; cursor: pointer; transition: background 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease; border: 1px solid transparent; box-sizing: border-box; white-space: nowrap; line-height: 1.2; } @media (max-width: 450px) { .tsk-btn { min-height: 34px !important; padding: 6px 10px !important; font-size: 11px !important; } } .tsk-btn span { white-space: nowrap; } /* «В корзину» — основное состояние */ .tsk-btn--cart { background: linear-gradient(135deg, #ffcc33 0%, #ffd700 50%, #ffcc33 100%); background-size: 200% 200%; background-position: 0 0; color: #1a1a1a; border-color: rgba(255, 204, 51, 0.4); box-shadow: 0 2px 8px rgba(255, 204, 51, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.4); } .tsk-btn--cart:hover:not(.disabled):not(.added) { background-position: 100% 0; box-shadow: 0 4px 12px rgba(255, 204, 51, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.5); transform: translateY(-1px); } .tsk-btn--cart:active:not(.disabled) { transform: translateY(0); box-shadow: 0 1px 4px rgba(255, 204, 51, 0.35), inset 0 1px 2px rgba(0, 0, 0, 0.08); } /* «В корзине» — тёмный фон, белый текст, при наведении аккуратное выцветание */ .tsk-btn--cart.added, .tsk-btn--cart.cart-add { background: #1a1a1a !important; color: #fff !important; border: 1px solid #2d2d2d !important; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); cursor: pointer; transition: opacity 0.25s ease, background 0.25s ease; } .tsk-btn--cart.added:hover, .tsk-btn--cart.cart-add:hover { background: #2d2d2d !important; color: #fff !important; border-color: #3d3d3d !important; opacity: 0.92; transform: none; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25); } .tsk-btn--cart.added:active, .tsk-btn--cart.cart-add:active { opacity: 0.88; } .tsk-btn--cart.disabled { background: #e5e7eb; color: #fff; cursor: not-allowed; box-shadow: none; } .tsk-btn--cart.disabled:hover { transform: none; } .tsk-btn.addCart.loading { pointer-events: none; opacity: 0.9; } /* Купить в 1 клик */ .tsk-btn--oneclick { background: #f9fafb; color: #1f2937; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); } .tsk-btn--oneclick:hover { background: #fff; border-color: #d1d5db; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); transform: translateY(-1px); } .tsk-btn--oneclick:active { transform: translateY(0); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06); } /* Запросить цену — тёмный фон, белый текст, без жёлтой обводки */ /* Убираем margin-top из глобального @media (max-width: 1800px) .addCart.requestPrice */ .tsk-btn--request, .tsk-product-card .addCart.requestPrice { margin-top: 0 !important; } .tsk-btn--request { background: #1a1a1a; color: #fff; border: 1px solid #2d2d2d; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); transition: opacity 0.25s ease, background 0.25s ease; } .tsk-btn--request:hover { background: #2d2d2d; color: #fff; border-color: #3d3d3d; opacity: 0.92; transform: none; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25); } .tsk-btn--request:active { opacity: 0.88; transform: none; } /* Запросить цену — после отправки (если добавляют .added) */ .tsk-btn--request.added { background: #252525; border-color: #353535; color: #e5e5e5; cursor: default; } .tsk-btn--request.added:hover { background: #2d2d2d; border-color: #3d3d3d; color: #e5e5e5; opacity: 0.92; transform: none; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); } /* Фокус для доступности */ .tsk-btn:focus { outline: none; } .tsk-btn:focus-visible { outline: 2px solid #ffcc33; outline-offset: 2px; } /* У тёмных кнопок — нейтральная обводка фокуса, без жёлтого */ .tsk-btn--request:focus-visible, .tsk-btn--cart.added:focus-visible, .tsk-btn--cart.cart-add:focus-visible { outline-color: rgba(255, 255, 255, 0.7); } /* Переопределение глобальных .addCart.added — тёмный фон, белый текст */ .tsk-product-card .tsk-btn--cart.added, .tsk-product-card .tsk-btn--cart.cart-add { background: #1a1a1a !important; color: #fff !important; border-color: #2d2d2d !important; } .tsk-product-card .tsk-btn--cart.added:hover, .tsk-product-card .tsk-btn--cart.cart-add:hover { background: #2d2d2d !important; color: #fff !important; border-color: #3d3d3d !important; } @media (max-width: 1400px) { .tsk-product-card { flex: 0 0 25%; } } @media (max-width: 1100px) { .tsk-product-card { flex: 0 0 33.333%; } } @media (max-width: 700px) { .tsk-product-card { flex: 0 0 50%; } } /* Мобильный: компактные карточки — меньше места между названием и блоком «под заказ» */ @media (max-width: 768px) { .tsk-product-card { padding: 10px 10px 12px; } .tsk-product-card__top { min-height: 0; } .tsk-product-card__img { margin-bottom: 8px; height: 180px; } .tsk-product-card__name { margin-bottom: 4px; -webkit-line-clamp: 2; line-clamp: 2; min-height: 40px; } .tsk-product-card__art-wrap { min-height: 0; margin-bottom: 0; } .tsk-product-card__art { font-size: 11px; } .tsk-product-card__avoid { margin: 0 0 6px 0; padding: 2px 0; min-height: 20px; font-size: 12px; } .tsk-product-card__price-block { margin-bottom: 8px; padding: 4px 0; min-height: 36px; } .tsk-product-card__buttons { gap: 3px; } .tsk-btn { min-height: 36px; padding: 6px 12px; font-size: 12px; } } @media (max-width: 450px) { .tsk-product-card { flex: 0 0 100%; max-width: 360px; margin-left: auto; margin-right: auto; } .tsk-product-card__img { height: 160px; margin-bottom: 6px; } .tsk-product-card__name { margin-bottom: 3px; font-size: 13px; } .tsk-product-card__avoid { margin: 0 0 4px 0; min-height: 18px; font-size: 11px; } .tsk-product-card__price-block { margin-bottom: 6px; min-height: 32px; } .tsk-product-card__price { font-size: 18px; } .tsk-btn { min-height: 34px; padding: 6px 10px; font-size: 11px; } } /* End */ /* Start:/local/templates/dresscodeV2/components/dresscode/pop.section/.default/style.css?17738244224823*/ #popSection { margin: 60px 0; padding-bottom: 0; overflow: hidden; } #popSection a { text-decoration: none; } .blueprint { margin: 40px 0; position: relative; } .blueprint-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; position: relative; } .blueprint-title { position: relative; } .blueprint-title-stamp { margin: 0; padding: 0; font-family: "Montserrat", Arial, sans-serif; font-weight: 700; font-size: 32px; line-height: 1.2; color: #111827; } .tsk-brand-title-stamp { text-transform: none; color: #1a1a1a; } .blueprint-title-sub { font-weight: 700; color: #ffcc33; line-height: 1.2; } @media (max-width: 992px) { .blueprint-title-stamp, .tsk-brand-title-stamp { font-size: 28px; } } @media (max-width: 576px) { .blueprint-title-stamp, .tsk-brand-title-stamp { font-size: 24px; } } .blueprint-controls { display: none; } .blueprint-control { width: 40px; height: 43px; border-radius: 50%; background: #fff; color: #ffcc33; border: 2px solid #ffcc33; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.3s; font-weight: bold; box-shadow: 0 2px 10px rgba(252, 176, 64, 0.1); } .blueprint-control:hover { background: #ffcc33; color: #fff; box-shadow: 0 5px 15px rgba(252, 176, 64, 0.2); } .blueprint-content { position: relative; padding: 10px 0 0; } .blueprint-slider { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 1fr; grid-auto-flow: dense; gap: 16px; } .blueprint-item { margin: 0; box-sizing: border-box; grid-column: span 4; } /* Кастомный паттерн ширин для первых 7 элементов: 1 ряд: 5 + 4 + 3 = 12 2 ряд: 3 + 3 + 3 + 3 = 12 */ .blueprint-item:nth-child(1) { grid-column: span 5; } .blueprint-item:nth-child(2) { grid-column: span 4; } .blueprint-item:nth-child(3) { grid-column: span 3; } .blueprint-item:nth-child(4) { grid-column: span 3; } .blueprint-item:nth-child(5) { grid-column: span 3; } .blueprint-item:nth-child(6) { grid-column: span 3; } .blueprint-item:nth-child(7) { grid-column: span 3; } .blueprint-card-link { display: block; height: 100%; color: inherit; text-decoration: none; } .blueprint-item-inner { position: relative; background-color: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; transition: box-shadow 0.2s ease, border-color 0.2s ease; height: 100%; display: flex; flex-direction: column; } .blueprint-item-inner:hover { box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08); border-color: #ffcc33; } .blueprint-marker { position: absolute; top: 15px; right: 15px; background-color: #ffcc33; color: #111827; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; z-index: 2; box-shadow: 0 2px 6px rgba(255, 204, 51, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0.5); border: 1px solid rgba(255, 204, 51, 0.3); text-transform: uppercase; letter-spacing: 0.08em; } .blueprint-image { display: flex; align-items: center; justify-content: center; height: 32px; width: 32px; overflow: hidden; position: absolute; top: 14px; right: 16px; border-bottom: none; background: transparent; padding: 0; } .blueprint-image img { width: 32px; height: 32px; object-fit: contain; transition: none; } .blueprint-item-inner:hover .blueprint-image img { transform: none; } .blueprint-name { padding: 16px 16px 16px; padding-right: 72px; text-align: left; flex-grow: 1; display: flex; align-items: flex-start; justify-content: flex-start; position: relative; min-height: auto; flex-direction: column; } .blueprint-name-title { color: #111827; font-size: 15px; font-weight: 600; text-decoration: none; transition: color 0.2s; margin-bottom: 4px; } .blueprint-desc { font-size: 13px; line-height: 1.4; color: #6b7280; max-height: none; overflow: visible; display: block; } .blueprint-card-link:hover .blueprint-name-title { color: #111827; } @media (max-width: 1200px) { .blueprint-slider { grid-template-columns: repeat(8, minmax(0, 1fr)); } .blueprint-item, .blueprint-item:nth-child(3n + 1), .blueprint-item:nth-child(3n + 2), .blueprint-item:nth-child(3n + 3) { grid-column: span 4; } } @media (max-width: 992px) { .blueprint-slider { grid-template-columns: repeat(2, minmax(0, 1fr)); } .blueprint-item, .blueprint-item:nth-child(3n + 1), .blueprint-item:nth-child(3n + 2), .blueprint-item:nth-child(3n + 3) { grid-column: span 1; } } @media (max-width: 576px) { .blueprint-slider { grid-template-columns: repeat(1, minmax(0, 1fr)); } .blueprint-header { flex-direction: column; align-items: center; gap: 20px; } .blueprint-controls { align-self: center; } } /* End */ /* Start:/local/templates/dresscodeV2/components/dresscode/brands.list/.default/style.css?17738243834946*/ /* NOTE: В файле ранее было 2 версии одних и тех же правил (#brandList / .tabloid / hover и т.д.). Оставляем одну финальную, чтобы стили не "перебивались" между собой. */ /* Шапка блока брендов в общем стиле сайта */ .tsk-brand-list-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; } .tsk-brand-title-stamp { font-family: "Montserrat", Arial, sans-serif; font-weight: 700; font-size: 32px; line-height: 1.2; color: #1a1a1a; border: none; padding: 0; text-transform: none; } /* Однострочный заголовок в стиле blueprint-тайтла, но в h2 */ .tsk-brand-title-stamp .blueprint-title-text { display: inline-flex; align-items: baseline; gap: 8px; } .tsk-brand-title-stamp .blueprint-title-main { font-size: 24px; font-weight: 700; color: #111827; line-height: 1.2; } .tsk-brand-title-stamp .blueprint-title-sub { color: #ffcc33; } .tsk-brand-list-all-link { display: inline-flex; align-items: center; justify-content: center; padding: 6px 16px; border-radius: 999px; color: #1a1a1a; font-family: "Montserrat", Arial, sans-serif; font-weight: 600; font-size: 12px; text-decoration: none; background: linear-gradient(135deg, #ffcc33, #ffd700 50%, #ffcc33); background-size: 200% 200%; border: 1px solid rgba(255, 204, 51, 0.3); box-shadow: 0 2px 6px rgba(255, 204, 51, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0.5); transition: background-position 0.3s ease, box-shadow 0.2s ease, transform 0.15s ease; } .tsk-brand-list-all-link:hover { background-position: 100% 0; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(255, 204, 51, 0.35), inset 0 1px 2px rgba(255, 255, 255, 0.5); } @media (max-width: 576px) { .tsk-brand-list-header { flex-direction: column; align-items: center; gap: 0; } } /* .tsk-brand-list-wrapper — обёртка, если понадобятся отступы/фон */ /* Убираем подчёркивающую линию под заголовком только в блоке брендов */ #brandList .news-block-title:after { display: none; } #brandList .ajaxContainer.brand-cont { padding: 8px 0; border: none; } /* Сетка карточек брендов в стиле tsk_react */ #brandList .items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 16px; border: none; } @media (max-width: 480px) { #brandList .items { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 360px) { #brandList .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } } #brandList .item { box-sizing: border-box; background-color: transparent; border: none; height: auto; line-height: normal; overflow: visible; float: none; } #brandList .tabloid { position: relative; padding: 16px; background-color: #f9fafb; border-radius: 12px; border: 1px solid #e5e7eb; display: flex; align-items: center; justify-content: center; min-height: 96px; transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease, background-color 0.2s ease; } #brandList .tabloid:hover { border-color: #ffcc33; background-color: #fffdf5; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12); transform: translateY(-2px); } #brandList .markerContainer { position: absolute; z-index: 2; left: 10px; top: 10px; } #brandList .marker { font: normal normal 11px "Montserrat", Arial, sans-serif; background-color: #424242; margin-bottom: 6px; color: #fff; padding: 2px 8px; line-height: 1.4; border-radius: 999px; } #brandList .picture { text-align: center; display: block; } #brandList .picture img { vertical-align: middle; max-height: 56px; max-width: 100%; object-fit: contain; filter: grayscale(100%); transition: filter 0.25s ease, transform 0.2s ease; } #brandList .tabloid:hover .picture img { filter: grayscale(0%); transform: scale(1.03); } /* Защита от конфликтов со старыми стилями страницы /brands/ (там тоже есть #brandList и правила для .tabloid). */ #brandList.brandlist-line .items { display: grid; } #brandList.brandlist-line .items .item { float: none; width: auto; height: auto; line-height: normal; background: transparent; border: 0; } #brandList.brandlist-line .items .item .tabloid { padding: 16px; background-color: #f9fafb; border-radius: 12px; border: 1px solid #e5e7eb; display: flex; align-items: center; justify-content: center; min-height: 96px; } #brandList.brandlist-line .items .item .tabloid:hover { border-color: #ffcc33; background-color: #fffdf5; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12); transform: translateY(-2px); } /* End */ /* Start:/local/templates/dresscodeV2/components/bitrix/news.list/mainNews/style.css?17736575615103*/ /** * Блок новостей на главной — стиль ТСК * Под шапку/карточки товаров: аккуратные карточки, акцент #fcb514. */ .tsk-news { max-width: 1366px; margin: 60px auto; box-sizing: border-box; font-family: "Montserrat", Arial, sans-serif; } .tsk-news__header { display: flex; justify-content: flex-start; align-items: center; gap: 20px; margin-bottom: 18px; } .tsk-news__slider-wrap { position: relative; overflow: hidden; padding: 4px 0; } .tsk-news__slider { padding: 0; width: 100%; } .tsk-news__card { background: #ffffff; border-radius: 10px; overflow: hidden; border: 1px solid transparent; box-shadow: none; cursor: pointer; display: flex; flex-direction: column; min-height: 280px; box-sizing: border-box; transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease, background-color 0.15s ease; } .tsk-news__card:hover { border-color: rgba(255, 204, 51, 0.3); background-color: #ffffff; box-shadow: 0 4px 16px rgba(255, 204, 51, 0.2); transform: translateY(-2px); } .tsk-news__card-inner { display: flex; flex-direction: column; height: 100%; flex: 1; } .tsk-news__image { position: relative; width: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden; background: transparent; border-radius: 12px; } .tsk-news__image img { width: 100%; max-width: 267px; height: auto; max-height: 400px; object-fit: cover; display: block; border-radius: 12px; } /* градиенты для новостей удалены */ .tsk-news__content { position: relative; padding: 14px 14px 12px; box-sizing: border-box; display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 150px; } .tsk-news__meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; } .tsk-news__date { font-size: 12px; line-height: 1.4; color: #6b7280; font-weight: 500; } .tsk-news__card-title { margin: 0; font-size: 15px; line-height: 1.4; font-weight: 600; color: #111827; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-height: 2.8em; } .tsk-news__excerpt { margin: 0; font-size: 13px; line-height: 1.5; color: #4b5563; max-height: 3.1em; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .tsk-news__more { margin-top: auto; align-self: flex-start; display: inline-flex; min-height: 38px; padding: 8px 16px; align-items: center; justify-content: center; text-align: center; font-size: 13px; font-weight: 700; font-family: "Montserrat", sans-serif; border-radius: 12px; text-decoration: none; cursor: pointer; background: #f9fafb; color: #1f2937; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); box-sizing: border-box; white-space: nowrap; line-height: 1.2; gap: 6px; transition: background 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, transform 0.2s ease; } .tsk-news__more:hover { background: #ffffff; border-color: #d1d5db; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); transform: translateY(-1px); } .tsk-news__more:active { transform: translateY(0); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06); } .tsk-news__more:focus { outline: none; } .tsk-news__more:focus-visible { outline: 2px solid #ffcc33; outline-offset: 2px; } /* Таб в шапке блока (если используется SetViewTarget) */ .tsk-news-tab { display: inline-flex; align-items: center; justify-content: center; padding: 6px 14px; border-radius: 999px; background: #f3f4f6; color: #111827; font-size: 13px; font-weight: 600; text-decoration: none; } .tsk-news-tab a { color: inherit; text-decoration: none; } .tsk-news-tab a:hover { text-decoration: underline; } /* Адаптивность */ @media (max-width: 1024px) { .tsk-news { margin-top: 30px; } .tsk-news__card { /* Ширину слайдов контролирует Swiper, чтобы корректно работал loop на мобильных */ flex: 0 0 auto; } } @media (max-width: 768px) { .tsk-news__header { flex-direction: column; align-items: flex-start; } .tsk-news__card { /* Ширину слайдов контролирует Swiper, чтобы корректно работал loop на мобильных */ flex: 0 0 auto; } } @media (max-width: 576px) { .tsk-news { padding-inline: 12px; } .tsk-news__header { flex-direction: column; align-items: flex-start; gap: 10px; } .tsk-news__nav { align-self: flex-start; } .tsk-news__card { /* Ширину слайдов контролирует Swiper, чтобы корректно работал loop на мобильных */ flex: 0 0 auto; } .tsk-news__image { /* на мобильных допускаем чуть меньшую высоту за счёт сжатия по ширине */ } } .tsk-news__content { padding: 10px 10px 10px; } /* End */ /* /local/templates/dresscodeV2/components/dresscode/slider/promoSlider_tsk/style.css?17736576033396 */ /* /local/templates/dresscodeV2/vendor/swiper/swiper-bundle.min.css?177271543818454 */ /* /local/templates/dresscodeV2/components/bitrix/news.list/indexBanners_tsk/style.css?177365783612419 */ /* /bitrix/components/dresscode/cast.smart.filter/templates/.default/style.css?171386452614799 */ /* /local/templates/dresscodeV2/components/bitrix/system.pagenavigation/round/style.css?17727030592400 */ /* /local/templates/dresscodeV2/components/dresscode/catalog.section/squares3_newtabs/style.css?1773836576824 */ /* /local/templates/dresscodeV2/components/dresscode/catalog.item/tsk_react/style.css?177390454215302 */ /* /local/templates/dresscodeV2/components/dresscode/pop.section/.default/style.css?17738244224823 */ /* /local/templates/dresscodeV2/components/dresscode/brands.list/.default/style.css?17738243834946 */ /* /local/templates/dresscodeV2/components/bitrix/news.list/mainNews/style.css?17736575615103 */