diff --git a/wp-content/themes/cosmopet/functions.php b/wp-content/themes/cosmopet/functions.php index ed584db..d6bc95f 100644 --- a/wp-content/themes/cosmopet/functions.php +++ b/wp-content/themes/cosmopet/functions.php @@ -24,5 +24,52 @@ require_once __DIR__ . '/temp-functions/filters-logic.php'; +function theme_enqueue_scripts() { + $base_dir = get_template_directory_uri() . '/static/js/'; + // Библиотеки + wp_enqueue_script('materialize', $base_dir . 'libs/materialize.min.js', array(), null, true); + wp_enqueue_script('swiper-bundle', $base_dir . 'libs/swiper-bundle.min.js', array(), null, true); + // Скрипты из js-single-product + wp_enqueue_script('gp-form', $base_dir . 'js-single-product/gp-form.js', array(), null, true); + wp_enqueue_script('gp-main', $base_dir . 'js-single-product/gp-main.js', array(), null, true); + wp_enqueue_script('gp-product', $base_dir . 'js-single-product/gp-product.js', array(), null, true); + wp_enqueue_script('tabs', $base_dir . 'js-single-product/tabs.js', array(), null, true); + wp_enqueue_script('toggle', $base_dir . 'js-single-product/toggle.js', array(), null, true); + // Основные скрипты + $scripts = array( + 'about-page', 'author-posts-ajax', 'blog', 'cart', 'checkout', 'comments', + 'footer', 'forms', 'front-page', 'header', 'layout-core', 'layout-form', + 'layout-main', 'layout-product', 'modal', 'popups', 'production-page', + 'profile', 'script', 'tags-in-wpf_filter', 'wtb-page' + ); + + foreach ($scripts as $script) { + wp_enqueue_script($script, $base_dir . $script . '.js', array(), null, true); + } +} +add_action('wp_enqueue_scripts', 'theme_enqueue_scripts'); + + +function theme_enqueue_styles() { + $base_dir = get_template_directory_uri() . '/static/css/'; + $libs_dir = $base_dir . 'libs/'; + + // CSS из папки libs + wp_enqueue_style('materialize', $libs_dir . 'materialize.min.css'); + wp_enqueue_style('swiper-bundle', $libs_dir . 'swiper-bundle.css'); + + // Основные CSS-файлы + $styles = array( + 'about-page', 'author-style', 'blog-style', 'checkout', 'footer', + 'forms', 'front-page', 'gp-layout-core', 'gp-layout-full', + 'gp-normalize', 'header', 'production-page', 'profile', 'shop', + 'single-product', 'style', 'wtb-page' + ); + + foreach ($styles as $style) { + wp_enqueue_style($style, $base_dir . $style . '.css'); + } +} +add_action('wp_enqueue_scripts', 'theme_enqueue_styles'); diff --git a/wp-content/themes/cosmopet/modules/author/assets/css/author-style.css.bak b/wp-content/themes/cosmopet/modules/author/assets/css/author-style.css.bak new file mode 100644 index 0000000..36811eb --- /dev/null +++ b/wp-content/themes/cosmopet/modules/author/assets/css/author-style.css.bak @@ -0,0 +1,722 @@ +/* Authors */ +.authors { + padding-bottom: 120px; +} + +.authors h2 { + font-weight: bold; + font-size: 64px; + line-height: 120%; + color: white; + text-transform: uppercase; + margin-bottom: 36px; +} + +.authors ul { + display: flex; + flex-wrap: wrap; + align-items: stretch; + justify-content: center; + gap: 24px; +} + +.authors li { + background: #F5F5F5; + border-radius: 48px; + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + width: calc(100% / 3 - 16px); +} + +.authors a { + padding: 52px 17px 57px; + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; +} + +.authors .main-img { + width: 200px; + height: 200px; + border-radius: 50%; + overflow: hidden; + flex-shrink: 0; + margin-bottom: 31px; +} + +.authors .main-img img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.authors-name { + font-size: 24px; + font-weight: bold; + text-transform: uppercase; + line-height: 28px; + color: #121212; + margin-bottom: 5px; +} + +.authors-type { + color: #121212; + font-size: 24px; + font-weight: 500; + line-height: 32px; + margin-bottom: 31px; +} + +.authors p { + color: #666666; + font-weight: 500; + font-size: 20px; + line-height: 24px; +} +/* Authors end */ + +/* author-head */ +.author-head { + padding-bottom: 36px; +} + +.author-head-content { + display: flex; + align-items: center; + gap: 31px; + margin-bottom: 17.5px; +} + +.author-head .main-img { + width: 278px; + height: 278px; + flex-shrink: 0; + border-radius: 48px; + overflow: hidden; +} + +.author-head .main-img img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.author-name { + font-size: 24px; + font-weight: bold; + line-height: 28px; + color: white; + margin-bottom: 5px; + text-transform: uppercase; +} + +.author-type { + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: white; + margin-bottom: 5px; +} + +.author-description { + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: white; + margin-bottom: 45px; +} + +.author-head p { + font-size: 20px; + font-weight: 500; + line-height: 24px; + color: white; +} + +.author-head h2 { + font-size: 64px; + font-weight: bold; + line-height: 120%; + color: white; +} +/* author-head end */ + +.home-title { + font-size: 82px; + font-weight: bold; + line-height: 96px; + color: var(--main_white); + margin-bottom: 16px; +} + +.home-description { + font-size: 32px; + font-weight: bold; + line-height: 40px; + color: var(--main_white); + text-transform: uppercase; + margin-bottom: 68px; +} + +.home-swp { + position: relative; +} + +.home-swp__btn { + position: absolute; + bottom: 22px; + left: 50%; + transform: translateX(-50%); + z-index: 2; + display: flex; + align-items: center; + gap: 24px; +} + +.home-swp__btn button { + border: 1px solid var(--main_black); + background: var(--main_white); + width: 56px; + height: 56px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 20px; +} + +.home-swp .swiper-slide:not(.swiper-slide-active) { + height: 0; + overflow: hidden; +} + +.home-card { + border-radius: 60px; + overflow: hidden; + display: flex; + align-items: flex-start; + gap: 24px; + position: relative; +} + +.home-card.bg-yellow { + background: var(--orange_80); +} + +.home-card.bg-green { + background: var(--green_90); +} + +.home-card.bg-violet { + background: var(--violet_90); +} + +.home-card__img { + width: 395px; + border-radius: 60px; + overflow: hidden; + height: 393px; + flex-shrink: 0; +} + +.home-card__img img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.home-card__content { + padding: 32px 79px 0 0; +} + +.home-card__content-title { + font-size: 36px; + font-weight: bold; + line-height: 40px; + text-transform: uppercase; + max-width: 660px; + margin-bottom: 10px; + color: var(--interface_title); +} + +.home-card__content-description { + color: var(--interface_title); + margin-bottom: 10px; + font-size: 20px; + font-weight: 500; + line-height: 24px; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; +} + +.home-card__content-body { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 12px; +} + +.home-card__content-body__alerts { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 12px; +} + +.home-card__content-body__alerts li { + background: var(--interface_hover); + color: var(--background); + border-radius: 16px; + padding: 6px 8px; + font-size: 16px; + font-weight: 500; + line-height: 20px; +} + +.home-card__content-body__day { + color: var(--interface_hover); + font-size: 14px; + font-weight: 500; + line-height: 16px; +} + +.home-card__content-body__time { + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.home-card__content-body__data { + display: flex; + align-items: center; + gap: 12px; +} + +.home-card__content-body__data>div { + display: flex; + align-items: center; + gap: 4px; + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.home-card__content-body__data>div .main-img { + width: 32px; + height: 32px; + border-radius: 50%; + object-fit: cover; +} + +.home-card__content-body__link { + border: 1px solid #000000; + border-radius: 28px; + background: var(--main_white); + position: absolute; + right: 37px; + bottom: 26px; + padding: 8.5px 16px 12.5px; + font-style: 20px; + font-weight: 500; + line-height: 24px; +} +/* Home end */ + + +/* Anons */ +.anons { + background: var(--main_white); + border-radius: 60px; + padding: 51px 0; +} + +.anons-theme__title { + color: var(--main_black); + font-size: 24px; + font-weight: bold; + line-height: 28px; + text-transform: uppercase; + margin-bottom: 20px; +} + +.anons-theme { + margin-bottom: 60px; +} + +.anons-theme ul { + max-width: 1022px; + display: flex; + flex-wrap: wrap; + gap: 12px; +} + +.anons-theme ul a { + font-size: 20px; + font-weight: 600; + line-height: 24px; + color: var(--main_black); + padding: 4px 24px; + border: 1px solid #000; + border-radius: 20px; +} + +.anons-theme ul a:hover, +.anons-theme ul a.active { + background: var(--main_black); + color: var(--main_white); +} + +.anons-best { + margin-bottom: 60px; +} + +.anons-best__title { + font-size: 36px; + line-height: 40px; + font-weight: bold; + color: var(--main_black); + margin-bottom: 20px; +} + +.anons-best__card-wrap { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 24px; +} + +.anons-best__card { + padding-top: 293px; + border-radius: 48px; + overflow: hidden; + position: relative; + z-index: 1; +} + +.anons-best__card.light { + padding-top: 0; + border-radius: 0; +} + +.anons-best__card .main-img { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 360px; + z-index: -1; +} + +.anons-best__card .main-img img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.anons-best__card.light .main-img { + position: static; + height: 265px; +} +.anons-best__card.light .main-img img { + border-radius: 30px; +} + +.anons-best__card-alerts { + position: absolute; + top: 21px; + left: 17px; + width: calc(100% - 34px); + display: flex; + flex-wrap: wrap; + gap: 7px; + z-index: 1; +} + +.anons-best__card-alerts li { + padding: 6px 8px; + font-size: 16px; + line-height: 20px; + font-weight: 500; + color: var(--background); + background: var(--main_black); + border-radius: 30px; +} + +.anons-best__card-body { + background: var(--accent-1); + padding: 30px 17px 22px; + border-radius: 48px 48px 0 0; + color: var(--main_white); + position: relative; + height: 100%; +} + +.anons-best__card.light .anons-best__card-body { + background: transparent; + color: var(--main_black); + padding: 12px 0 34px; +} + +.anons-best__card-body__title { + font-size: 28px; + font-weight: bold; + line-height: 32px; + text-transform: uppercase; + margin-bottom: 14px; +} + +.anons-best__card.light .anons-best__card-body__title { + font-size: 26px; +} + +.anons-best__card-body__datas { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 6px 10px; + max-width: 264px; +} + +.anons-best__card.light .anons-best__card-body__datas { + color: var(--placeholder); +} + +.anons-best__card-body__datas p { + font-size: 14px; + line-height: 16px; + font-weight: 500; +} + +.anons-best__card-body__datas ul { + display: flex; + align-items: center; + gap: 10px; +} + +.anons-best__card-body__datas ul li { + display: flex; + align-items: center; + gap: 4px; + font-size: 14px; + line-height: 16px; + font-weight: 500; +} + +.anons-best__card-body__datas ul .logo img { + width: 24px; + height: 24px; + border-radius: 50%; + object-fit: cover; +} + +.anons-article { + margin-bottom: 40px; +} + +.anons-article__title { + font-size: 36px; + line-height: 40px; + font-weight: bold; + color: var(--main_black); + margin-bottom: 20px; +} + +.anons-article__card-wrap { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 40px 25px; +} + +.anons-article__more-link { + display: flex; + align-items: center; + justify-content: center; +} + +.anons-article__more-link a { + background: var(--accent-3); + color: var(--main_white); + border-radius: 20px; + border: 1px solid var(--main_white); + padding: 16px 24px; + font-size: 20px; + font-weight: 600; + line-height: 24px; + text-transform: uppercase; +} +/* Anons end */ + + +/* Стили для планшетов */ +@media only screen and (max-width: 992px) { + + .authors h2 { + font-size: 48px; + margin-bottom: 24px; + } + + .authors li { + border-radius: 32px; + width: calc(50% - 12px); + } + + .authors .main-img { + margin-bottom: 24px; + } + + .author { + padding-bottom: 24px; + } + + .author h2 { + font-size: 48px; + } + + .author-head-content { + flex-direction: column; + align-items: flex-start; + } +} + + + +/* Стили для планшетов */ +@media only screen and (max-width: 992px) { + + .author { + padding: 188px 0 36px; + } + + + + +} + + + +@media only screen and (max-width: 576px) { + .anons-best__title { + font-size: 26px; + line-height: 32px; + margin-bottom: 12px; + } + + .anons-best__card { + padding-top: 205px; + } + + .anons-best__card .main-img { + height: 300px; + } + + .anons-best__card-body { + padding: 20px 17px; + } + + .anons-best__card-body__title { + font-size: 20px; + line-height: 24px; + margin-bottom: 16px; + } + + .anons-best__card.light .main-img { + height: 197px; + } + + .anons-best__card.light .anons-best__card-body__title { + font-size: 20px; + line-height: 24px; + } + + + + .authors { + padding-bottom: 138px; + } + + .authors h2 { + font-size: 32px; + line-height: 38px; + margin-bottom: 15px; + } + + .authors li { + border-radius: 24px; + width: 100%; + } + + .authors a { + padding: 32px 17px 52px; + } + + .authors .main-img { + width: 180px; + height: 180px; + margin-bottom: 20px; + } + + .authors-name { + font-size: 20px; + line-height: 24px; + } + + .authors-type { + font-size: 18px; + line-height: 24px; + margin-bottom: 20px; + } + + .authors p { + font-size: 16px; + line-height: 20px; + } + + .author-head { + padding-bottom: 15px; + } + + .author-head-content { + margin-bottom: 23px; + } + + .author-head .main-img { + width: 100%; + } + + .author-head h2 { + font-size: 32px; + line-height: 38px; + } + + .author-name { + font-size: 20px; + line-height: 24px; + } + + .author-type { + font-size: 18px; + line-height: 24px; + } + + .author-description { + font-size: 18px; + line-height: 24px; + margin-bottom: 24px; + } + + .author-head p { + font-size: 16px; + line-height: 20px; + } +} + + + + diff --git a/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-mobile.css deleted file mode 100644 index 5b3fc9f..0000000 --- a/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-mobile.css +++ /dev/null @@ -1,120 +0,0 @@ -/* Стили для мобильных устройств */ -@media only screen and (max-width: 576px) { - .anons-best__title { - font-size: 26px; - line-height: 32px; - margin-bottom: 12px; - } - - .anons-best__card { - padding-top: 205px; - } - - .anons-best__card .main-img { - height: 300px; - } - - .anons-best__card-body { - padding: 20px 17px; - } - - .anons-best__card-body__title { - font-size: 20px; - line-height: 24px; - margin-bottom: 16px; - } - - .anons-best__card.light .main-img { - height: 197px; - } - - .anons-best__card.light .anons-best__card-body__title { - font-size: 20px; - line-height: 24px; - } - - - - .authors { - padding-bottom: 138px; - } - - .authors h2 { - font-size: 32px; - line-height: 38px; - margin-bottom: 15px; - } - - .authors li { - border-radius: 24px; - width: 100%; - } - - .authors a { - padding: 32px 17px 52px; - } - - .authors .main-img { - width: 180px; - height: 180px; - margin-bottom: 20px; - } - - .authors-name { - font-size: 20px; - line-height: 24px; - } - - .authors-type { - font-size: 18px; - line-height: 24px; - margin-bottom: 20px; - } - - .authors p { - font-size: 16px; - line-height: 20px; - } - - .author-head { - padding-bottom: 15px; - } - - .author-head-content { - margin-bottom: 23px; - } - - .author-head .main-img { - width: 100%; - } - - .author-head h2 { - font-size: 32px; - line-height: 38px; - } - - .author-name { - font-size: 20px; - line-height: 24px; - } - - .author-type { - font-size: 18px; - line-height: 24px; - } - - .author-description { - font-size: 18px; - line-height: 24px; - margin-bottom: 24px; - } - - .author-head p { - font-size: 16px; - line-height: 20px; - } -} - - - - diff --git a/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-tablet.css deleted file mode 100644 index 00bae10..0000000 --- a/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-tablet.css +++ /dev/null @@ -1,44 +0,0 @@ -/* Стили для планшетов */ -@media only screen and (max-width: 992px) { - - .authors h2 { - font-size: 48px; - margin-bottom: 24px; - } - - .authors li { - border-radius: 32px; - width: calc(50% - 12px); - } - - .authors .main-img { - margin-bottom: 24px; - } - - .author { - padding-bottom: 24px; - } - - .author h2 { - font-size: 48px; - } - - .author-head-content { - flex-direction: column; - align-items: flex-start; - } -} - - - -/* Стили для планшетов */ -@media only screen and (max-width: 992px) { - - .author { - padding: 188px 0 36px; - } - - - - -} diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/bars.svg b/wp-content/themes/cosmopet/modules/author/assets/img/bars.svg deleted file mode 100644 index 0ff9b2e..0000000 --- a/wp-content/themes/cosmopet/modules/author/assets/img/bars.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - - - diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/logo.svg b/wp-content/themes/cosmopet/modules/author/assets/img/logo.svg deleted file mode 100644 index d3929b8..0000000 --- a/wp-content/themes/cosmopet/modules/author/assets/img/logo.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/wp-content/themes/cosmopet/modules/author/assets/js/author-posts-ajax.js b/wp-content/themes/cosmopet/modules/author/assets/js/author-posts-ajax.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/js/author-posts-ajax.js rename to wp-content/themes/cosmopet/modules/author/assets/js/author-posts-ajax.js.bak diff --git a/wp-content/themes/cosmopet/modules/author/components/author-archive/component-controller.php b/wp-content/themes/cosmopet/modules/author/components/author-archive/component-controller.php index 92c3a0a..21042e7 100644 --- a/wp-content/themes/cosmopet/modules/author/components/author-archive/component-controller.php +++ b/wp-content/themes/cosmopet/modules/author/components/author-archive/component-controller.php @@ -51,4 +51,4 @@ foreach ($authors_arr as $author) { } $context['authors'] = $authors_arr; -Timber::render('blog_author/author-archive.twig', $context); +Timber::render('blog_author/author-archive-page.twig', $context); diff --git a/wp-content/themes/cosmopet/modules/author/components/author-single/component-controller.php b/wp-content/themes/cosmopet/modules/author/components/author-single/component-controller.php index 832d82d..512cd7b 100644 --- a/wp-content/themes/cosmopet/modules/author/components/author-single/component-controller.php +++ b/wp-content/themes/cosmopet/modules/author/components/author-single/component-controller.php @@ -38,4 +38,4 @@ $author->posts = Timber::get_posts([ $context['author'] = $author; $context['total_pages'] = ceil($author->post_count / 9); -Timber::render('blog_author/author-single.twig', $context); \ No newline at end of file +Timber::render('blog_author/author-single-page.twig', $context); \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/author/module-ajax-controller.php b/wp-content/themes/cosmopet/modules/author/module-ajax-controller.php index 5ed693d..933df28 100644 --- a/wp-content/themes/cosmopet/modules/author/module-ajax-controller.php +++ b/wp-content/themes/cosmopet/modules/author/module-ajax-controller.php @@ -27,7 +27,7 @@ function get_author_posts() { $context = Timber::context(); $context['posts'] = $remaining_posts; - Timber::render('blog_author/author-posts-list.twig', $context); + Timber::render('blog_author/author-posts-list-block.twig', $context); wp_die(); } diff --git a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-desktop.css.bak similarity index 79% rename from wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-desktop.css rename to wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-desktop.css.bak index d6fb152..4b6316b 100644 --- a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-desktop.css.bak @@ -89,5 +89,25 @@ main{ width: max-content; } +@media (max-width: 1200px) { + .header-navs { + gap: 12px; + } + .header-navs__link { + font-size: 14px; + } + .header-right { + gap: 4px; + } +} - +@media(max-width:600px) { + .article-content h2 { + max-width: 661px; + font-size: 24px!important; + line-height: 40px; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); + } +} diff --git a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-mobile.css deleted file mode 100644 index 05bb28b..0000000 --- a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-mobile.css +++ /dev/null @@ -1,10 +0,0 @@ -@media(max-width:600px) { - .article-content h2 { - max-width: 661px; - font-size: 24px!important; - line-height: 40px; - font-weight: bold; - text-transform: uppercase; - color: var(--grey-black); - } -} diff --git a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-tablet.css deleted file mode 100644 index 5220caa..0000000 --- a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-tablet.css +++ /dev/null @@ -1 +0,0 @@ -/* Стили для планшетов */ diff --git a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-ultra.css b/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-ultra.css deleted file mode 100644 index c149baa..0000000 --- a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-ultra.css +++ /dev/null @@ -1,4 +0,0 @@ -/* Стили для ультрашироких экранов */ -@media only screen and (min-width: 1400px) { - -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-xl.css b/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-xl.css deleted file mode 100644 index 478ccf2..0000000 --- a/wp-content/themes/cosmopet/modules/blog/assets/css/gp-style-xl.css +++ /dev/null @@ -1,11 +0,0 @@ -@media (max-width: 1200px) { - .header-navs { - gap: 12px; - } - .header-navs__link { - font-size: 14px; - } - .header-right { - gap: 4px; - } -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/assets/js/comments.js b/wp-content/themes/cosmopet/modules/blog/assets/js/comments.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/assets/js/comments.js rename to wp-content/themes/cosmopet/modules/blog/assets/js/comments.js.bak diff --git a/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php index 61c4425..125b96f 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php @@ -17,4 +17,4 @@ $context['blog_desc'] = get_field('blog_desc', 'options'); $context['post_count'] = wp_count_posts()->publish; // Количество опубликованных постов $context['total_pages'] = ceil($context['post_count'] / get_option('posts_per_page')); // Общее количество страниц -Timber::render('blog/blog-archive.twig', $context); +Timber::render('blog/blog-archive-page.twig', $context); diff --git a/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/css/style.css b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/css/style.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/css/style.css rename to wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/css/style.css.bak diff --git a/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/css/style.css b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/css/style.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/editorial/assets/css/style.css rename to wp-content/themes/cosmopet/modules/blog/components/editorial/assets/css/style.css.bak diff --git a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css.bak similarity index 63% rename from wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css rename to wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css.bak index c06abc9..f2fec8c 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css.bak @@ -177,4 +177,100 @@ .blog-home{ padding-bottom: 4rem; -} \ No newline at end of file +} + +@media only screen and (max-width: 992px) { + .home-swp__btn { + bottom: auto; + top: 93px; + left: -10px; + width: calc(100% + 20px); + justify-content: space-between; + transform: translateX(0); + } + + .home-swp__btn button { + width: 48px; + height: 48px; + border-radius: 20px; + } + + .home-card { + flex-direction: column; + border-radius: 24px; + gap: 17px; + } + + .home-card__img { + height: 234px; + width: 100%; + border-radius: 24px; + } + + .home-card__content { + padding: 0 16px 89px; + } + + .home-card__content-title { + font-size: 20px; + line-height: 24px; + margin-bottom: 15px; + } + + .home-card__content-description { + font-size: 16px; + line-height: 20px; + margin-bottom: 15px; + display: -webkit-box; + -webkit-line-clamp: 5; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; + } + + .home-card__content-body { + gap: 7px; + } + + .home-card__content-body__alerts { + gap: 7px; + } + + .home-card__content-body__alerts li { + font-size: 14px; + line-height: 16px; + padding: 8px; + } + + .home-card__content-body__day { + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__time { + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__data { + gap: 7px; + } + + .home-card__content-body__data>div { + gap: 4px; + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__data .main-img { + width: 32px; + height: 32px; + } + + .home-card__content-body__link { + right: 50%; + bottom: 27px; + transform: translateX(50%); + width: max-content; + } +} diff --git a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-tablet.css deleted file mode 100644 index 59eb0fb..0000000 --- a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-tablet.css +++ /dev/null @@ -1,96 +0,0 @@ -/* Стили для планшетов */ -@media only screen and (max-width: 992px) { - .home-swp__btn { - bottom: auto; - top: 93px; - left: -10px; - width: calc(100% + 20px); - justify-content: space-between; - transform: translateX(0); - } - - .home-swp__btn button { - width: 48px; - height: 48px; - border-radius: 20px; - } - - .home-card { - flex-direction: column; - border-radius: 24px; - gap: 17px; - } - - .home-card__img { - height: 234px; - width: 100%; - border-radius: 24px; - } - - .home-card__content { - padding: 0 16px 89px; - } - - .home-card__content-title { - font-size: 20px; - line-height: 24px; - margin-bottom: 15px; - } - - .home-card__content-description { - font-size: 16px; - line-height: 20px; - margin-bottom: 15px; - display: -webkit-box; - -webkit-line-clamp: 5; - -webkit-box-orient: vertical; - overflow: hidden; - text-overflow: ellipsis; - } - - .home-card__content-body { - gap: 7px; - } - - .home-card__content-body__alerts { - gap: 7px; - } - - .home-card__content-body__alerts li { - font-size: 14px; - line-height: 16px; - padding: 8px; - } - - .home-card__content-body__day { - font-size: 14px; - line-height: 16px; - } - - .home-card__content-body__time { - font-size: 14px; - line-height: 16px; - } - - .home-card__content-body__data { - gap: 7px; - } - - .home-card__content-body__data>div { - gap: 4px; - font-size: 14px; - line-height: 16px; - } - - .home-card__content-body__data .main-img { - width: 32px; - height: 32px; - } - - .home-card__content-body__link { - right: 50%; - bottom: 27px; - transform: translateX(50%); - width: max-content; - } -} diff --git a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/js/slider.js b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/js/slider.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/js/slider.js rename to wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/js/slider.js.bak diff --git a/wp-content/themes/cosmopet/modules/blog/components/news-list/assets/js/posts-ajax.js b/wp-content/themes/cosmopet/modules/blog/components/news-list/assets/js/posts-ajax.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/news-list/assets/js/posts-ajax.js rename to wp-content/themes/cosmopet/modules/blog/components/news-list/assets/js/posts-ajax.js.bak diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.bak similarity index 77% rename from wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.css rename to wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.bak index 2b7ced0..5b14787 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.bak @@ -454,4 +454,150 @@ p.discount-description__2 { .other-home { padding-top: 36px !important; } -/* comment */ \ No newline at end of file +/* comment */ + +@media (max-width: 992px) { + .discount { + padding: 32px 24px; + border-radius: 32px; + margin-bottom: 48px; + } + + .discount-title { + font-size: 26px; + line-height: 32px; + margin-bottom: 21px; + } + + .discount-bg { + display: none; + } + + .discount-bg.mb { + display: inline-block; + position: static; + margin-bottom: 21px; + } + + .discount-form { + flex-direction: column; + gap: 21px; + margin-bottom: 21px; + } + + .discount-form img { + display: none; + } + + .discount-form input { + width: 100%; + text-align: center; + } + + .discount-form button { + width: 100%; + text-align: center; + } + + .discount-descriptions { + display: flex; + flex-direction: column-reverse; + } + + p.discount-description__2 { + font-size: 18px; + line-height: 24px; + font-weight: 500; + grid-area: 21px; + margin-bottom: 21px; + } + + p.discount-description__1 { + margin-bottom: 0; + font-size: 12px; + line-height: 120%; + } + + .article-home { + padding-bottom: 36px; + } + + .article-home .container { + display: flex; + flex-direction: column; + } + + .article-home h1 { + order: 1; + font-size: 32px; + line-height: 38px; + margin-bottom: 15px; + } + + .article-home__card { + order: 2; + + } + + .article-home__card img { + border-radius: 32px; + } + + .article-home__data { + gap: 8px 16px; + order: 3; + margin: 15px 0 0; + } + + .article-home__data-alerts { + gap: 16px; + } + + .article-home__data-alerts a { + padding: 6px 8px; + } + + .article-content { + padding: 48px 0; + border-radius: 64px; + } + + .comment .comment-block { + padding: 20px 24px; + margin-top: 28px; + } + + .comment .comment-title { + padding-bottom: 20px; + } + + .comment .answer-block { + margin: 10px 0 0 42px; + } + + .comment .comment-user h6 { + font-size: 16px; + line-height: 24px; + } + + .comment .comment-block p { + font-size: 16px; + line-height: 24px; + } + + .comment .comment-btns { + gap: 14px; + } + + .comment .comment-btns button { + font-size: 12px; + line-height: 16px; + } + + .comment .comment-user span { + font-size: 12px; + line-height: 16px; + } + + +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-tablet.css deleted file mode 100644 index 0f2d485..0000000 --- a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-tablet.css +++ /dev/null @@ -1,145 +0,0 @@ -@media (max-width: 992px) { - .discount { - padding: 32px 24px; - border-radius: 32px; - margin-bottom: 48px; - } - - .discount-title { - font-size: 26px; - line-height: 32px; - margin-bottom: 21px; - } - - .discount-bg { - display: none; - } - - .discount-bg.mb { - display: inline-block; - position: static; - margin-bottom: 21px; - } - - .discount-form { - flex-direction: column; - gap: 21px; - margin-bottom: 21px; - } - - .discount-form img { - display: none; - } - - .discount-form input { - width: 100%; - text-align: center; - } - - .discount-form button { - width: 100%; - text-align: center; - } - - .discount-descriptions { - display: flex; - flex-direction: column-reverse; - } - - p.discount-description__2 { - font-size: 18px; - line-height: 24px; - font-weight: 500; - grid-area: 21px; - margin-bottom: 21px; - } - - p.discount-description__1 { - margin-bottom: 0; - font-size: 12px; - line-height: 120%; - } - - .article-home { - padding-bottom: 36px; - } - - .article-home .container { - display: flex; - flex-direction: column; - } - - .article-home h1 { - order: 1; - font-size: 32px; - line-height: 38px; - margin-bottom: 15px; - } - - .article-home__card { - order: 2; - - } - - .article-home__card img { - border-radius: 32px; - } - - .article-home__data { - gap: 8px 16px; - order: 3; - margin: 15px 0 0; - } - - .article-home__data-alerts { - gap: 16px; - } - - .article-home__data-alerts a { - padding: 6px 8px; - } - - .article-content { - padding: 48px 0; - border-radius: 64px; - } - - .comment .comment-block { - padding: 20px 24px; - margin-top: 28px; - } - - .comment .comment-title { - padding-bottom: 20px; - } - - .comment .answer-block { - margin: 10px 0 0 42px; - } - - .comment .comment-user h6 { - font-size: 16px; - line-height: 24px; - } - - .comment .comment-block p { - font-size: 16px; - line-height: 24px; - } - - .comment .comment-btns { - gap: 14px; - } - - .comment .comment-btns button { - font-size: 12px; - line-height: 16px; - } - - .comment .comment-user span { - font-size: 12px; - line-height: 16px; - } - - -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/js/post-likes.js b/wp-content/themes/cosmopet/modules/blog/components/single/assets/js/post-likes.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/single/assets/js/post-likes.js rename to wp-content/themes/cosmopet/modules/blog/components/single/assets/js/post-likes.js.bak diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/single/component-controller.php index 85e5737..ac8c047 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/single/component-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/single/component-controller.php @@ -4,4 +4,4 @@ include_component('blog', 'featured-slider'); $context = Timber::get_context(); $post = Timber::get_post(); $context['post'] = $post; -Timber::render('blog/blog-single.twig', $context); +Timber::render('blog/blog-single-page.twig', $context); diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-desktop.css deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-mobile.css deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-tablet.css deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/footer/assets/css/footer.css.bak similarity index 75% rename from wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-desktop.css rename to wp-content/themes/cosmopet/modules/footer/assets/css/footer.css.bak index 958d07b..80f73f6 100644 --- a/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/footer/assets/css/footer.css.bak @@ -205,3 +205,72 @@ .login_btn { margin-bottom: 24px; } + + +@media only screen and (max-width: 576px) { + .footer { + padding: 24px 0 58px; + } + + .footer-top { + align-items: flex-start; + text-align: left; + gap: 24px; + } + + .footer-content__wrap { + align-items: flex-start; + gap: 24px; + } + + .footer-content { + align-items: flex-start; + } + + .footer-content .logo { + font-size: 20px; + margin-bottom: 24px; + } + + .footer-content__address { + font-size: 18px; + line-height: 24px; + margin-bottom: 32px; + } + + .footer-content ul { + gap: 24px; + } + + .footer-content ul p { + font-size: 16px; + line-height: 20px; + } + + .footer-content ul a { + font-size: 24px; + line-height: 32px; + } + + .footer-top__link .link-white { + display: none; + } + + .footer-contact { + width: 100%; + padding: 16px; + border-radius: 24px; + } + + .footer-contact__title { + color: var(--main_white); + } + + .footer-bottom { + margin-top: 0; + padding-top: 24px; + border: 0; + align-items: flex-start; + gap: 17px; + } +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-tablet.css deleted file mode 100644 index ffc5b2e..0000000 --- a/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-tablet.css +++ /dev/null @@ -1,4 +0,0 @@ -/* Стили для планшетов */ -@media only screen and (max-width: 992px) { - -} diff --git a/wp-content/themes/cosmopet/modules/footer/assets/js/footer.js b/wp-content/themes/cosmopet/modules/footer/assets/js/footer.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/footer/assets/js/footer.js rename to wp-content/themes/cosmopet/modules/footer/assets/js/footer.js.bak diff --git a/wp-content/themes/cosmopet/modules/forms/assets/js/form.js b/wp-content/themes/cosmopet/modules/forms/assets/js/form.js index 8fa3faf..e69de29 100644 --- a/wp-content/themes/cosmopet/modules/forms/assets/js/form.js +++ b/wp-content/themes/cosmopet/modules/forms/assets/js/form.js @@ -1,143 +0,0 @@ -// Функция для показа модальных окон -function showModal(modalClass) { - - - const modal = document.querySelector('.' + modalClass); - if (modal) { - modal.style.display = 'flex'; - - } -} - - // Функция для закрытия модальных окон - function closeModals() { - const modals = document.querySelectorAll('.mform'); - modals.forEach(modal => { - modal.style.display = 'none'; - }); - } - - // Инициализация после загрузки DOM - document.addEventListener('DOMContentLoaded', function() { - // Обработчики для кнопок закрытия - const closeButtons = document.querySelectorAll('.close-button'); - closeButtons.forEach(button => { - button.addEventListener('click', function() { - closeModals(); - }); - }); - - // Закрытие при клике вне контента - window.addEventListener('click', function(event) { - - const modals = document.querySelectorAll('.mform'); - modals.forEach(modal => { - if (event.target === modal) { - modal.style.display = 'none'; - } - }); - }); - }); - - // Закрытие при клике вне контента - window.addEventListener('click', function(event) { - const modals = document.querySelectorAll('.modal-success, .modal-offer'); - modals.forEach(modal => { - if (event.target === modal) { - modal.style.display = 'none'; - } - }); -}); - - - -jQuery(document).ready(function($) { - $('.form-process').submit(function(event) { - event.preventDefault(); - let validate = validateForm(this); - if (validate){ - action = $(this).attr('action') - let formData = $(this).serialize(); - $.ajax({ - type: 'POST', - url: '/wp-admin/admin-ajax.php', - data: { - action: action, - formData: formData - }, - success: function(response) { - closeModals() - showModal('mform-success') - - } - }); - } - }); -}); - -const metaLocale = document.querySelector('meta[property="og:locale"]'); -const localeValue = metaLocale.getAttribute('content'); - - - // Функция валидации формы - function validateForm(form) { - // Очищаем предыдущие сообщения об ошибках внутри этой формы - clearErrorMessages(form); - let validated = true - // Валидация поля имени - const nameInput = form.querySelector('input[name="name"]'); - - if (nameInput && !nameInput.value.trim()) { - if(localeValue == 'en_US'){ - showError(nameInput, 'The name is requeried field'); - } - if(localeValue == 'ru_RU'){ - showError(nameInput, 'Поле имени обязательно для заполнения.'); - } - validated = false - } - - // Валидация поля email - const emailInput = form.querySelector('input[name="email"]'); - const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; - if (emailInput && !emailPattern.test(emailInput.value.trim())) { - - if(localeValue == 'en_US'){ - showError(emailInput, 'Email is incorrect.'); - } - if(localeValue == 'ru_RU'){ - showError(emailInput, 'Введите корректный email.'); - } - validated = false - } - - // Валидация поля телефона - const phoneInput = form.querySelector('input[name="phone"]'); - const phonePattern = /^\+?\d{10,15}$/; - if (phoneInput && !phonePattern.test(phoneInput.value.trim())) { - if(localeValue == 'en_US'){ - showError(phoneInput, 'The phone is incorrect.'); - } - if(localeValue == 'ru_RU'){ - showError(phoneInput, 'Введите корректный номер телефона.'); - } - validated = false - } - return validated - } - - // Функция для отображения сообщения об ошибке - function showError(input, message) { - const errorMessage = document.createElement('div'); - errorMessage.className = 'error-message'; - errorMessage.textContent = message; - input.insertAdjacentElement('afterend', errorMessage); - } - - // Функция для очистки сообщений об ошибках внутри конкретной формы - function clearErrorMessages(form) { - const errorMessages = form.querySelectorAll('.error-message'); - errorMessages.forEach(errorMessage => { - errorMessage.remove(); - }); - } diff --git a/wp-content/themes/cosmopet/modules/forms/components/discount/assets/css/discount-form.css b/wp-content/themes/cosmopet/modules/forms/components/discount/assets/css/discount-form.css deleted file mode 100644 index f98192b..0000000 --- a/wp-content/themes/cosmopet/modules/forms/components/discount/assets/css/discount-form.css +++ /dev/null @@ -1,4007 +0,0 @@ - - -/* .sellers_card .sellers_card-img { - width: auto!important; - height: 330px; -} */ - - -/* Home start */ -.home{ - position: relative; - /* GP | fix */ - background: var(--radial); -} -.home .container{ - padding: 157px 30px 245px; - position: relative; -} -@media (min-width: 1281px){ - .home .container{ - - max-width: 1350px !important; - } - -} - -@media (min-width: 1600px){ - .home .container{ - - max-width: 1440px !important; - } - -} -.home .home_dog{ - position: absolute; - bottom: 200px; - right: 8px; - opacity: .5; - z-index: 0; -} -.home_block-dog{ - width: 100%; - display: none; - margin: 0 auto; - opacity: .5; -} -.home .home_line2, -.home .home_line{ - position: absolute; - top: 70px; - left: 0; - width: 100%; - z-index: 1; - scale: 1.01; -} -.home .home_line2{ - display: none; - /* top: 37px; - left: -24px; */ - left: -2%; - top: 7%; - width: 108%; - z-index: 0; -} -.home .home_block{ - position: relative; - z-index: 1; - display: flex; - flex-direction: column; - gap: 32px; -} -.home_block .home_title{ - font-size: 82px; - line-height: 98.4px; - color: var(--creme-white, #F4F1F0); - text-transform: uppercase; -} -/* Home end */ - -/* Abour start */ -.about{ - box-shadow: 6px 9px 20px 0px #00000026; - background: var(--creme-white, #F4F1F0); - border-radius: 60px; - position: relative; - z-index: 2; - margin-top: -114px; - padding: 46px 0px 97px; -} -.about .about_block{ - display: flex; - flex-direction: column; - gap: 0; -} -.about .about_info-wrap{ - display: flex; - align-items: center; - gap: 70px; -} -.about_block .about_info{ - display: flex; - flex-direction: column; - gap: 25px; -} -.about_info-wrap .about_img{ - width: 40%; -} -.about_img .entoprotein-img{ - display: none; -} -.about_info-wrap .about_img img{ - width: 100%; - height: 720px; -} - -.about_info .about_title{ - font-size: 82px; - font-weight: 700; - line-height: 98.4px; - color: var(--grey-black, #121212); - text-transform: uppercase; -} -.about_info .about_text{ - font-size: 24px; - line-height: 28.8px; - letter-spacing: -0.01em; - color: var(--grey-black, #121212); -} - - -.about_block .about_cards{ - display: grid; - grid-template-columns: 31.5% 31.5% 31.5%; - gap: 58px 26px; -} -.about_cards .about_card{ - display: flex; - flex-direction: column; - gap: 24px; -} -.about_card .about_card-gif{ - width: 168px; - height: 168px; -} - -.about_card .about_card-info{ - display: flex; - flex-direction: column; - gap: 20px; -} -.about_card .about_card-title{ - font-size: 24px; - font-weight: 700; - line-height: 28.8px; - color: var(--grey-black, #121212); - text-transform: uppercase; -} -.about_card .about_card-text{ - font-size: 20px; - line-height: 24px; - color: var(--grey-black, #121212); - max-width: 278px; -} -.about_cards .about_company{ - position: relative; - padding: 25px 12px 30px 30px; - background: #F4F1F0; - border-radius: 60px; - display: flex; - flex-direction: column; - gap: 16px; -} -.about_cards .about_company::after{ - content: ''; - display: block; - position: absolute; - width: calc(100% + 4px); - height: calc(100% + 4px); - background: linear-gradient(21.69deg, #F44242 23.69%, #569EF0 66.57%); - border-radius: 60px; - top: -2px; - left: -2px; - z-index: -1; -} -.about_company .about_company-text{ - font-size: 20px; - line-height: 24px; - font-weight: 500; - color: var(--grey-black, #121212); -} -.about_company .about_company-logo{ - display: grid; - grid-template-columns: 29% 65%; - gap: 20px 10px; -} -.about_company .about_company-logo img{ - width: 100%; -} -.about_company .about_company-logo img:nth-child(4){ - height: 80px; -} - - -.about_slider{ - padding-top: 110px; -} -.about_slider .slider-container { - position: relative; - /* max-width: 636px; */ - height: 300px; - display: flex; - justify-content: center; - align-items: center; - margin: 0 auto; -} - -.about_slider .slide { - position: relative; - background: #FFF; - border-radius: 60px; - /* width: 429px; - height: 546px; */ - display: flex; - flex-direction: column; - align-items: center; - gap: 45px; - padding: 35px 50px 25px 50px; - opacity: 1; - z-index: 1; -} -.about_slider .carousel .carousel-item{ - width: 429px; - height: 546px; - padding: 35px 50px 25px 50px; - padding: 50px 53px; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - /* background: var(--creme-white, #F4F1F0); */ - background: #ffffff30; - backdrop-filter: blur(6px); - z-index: 1; - box-shadow: -2px 5px 22.9px 0px rgba(0, 0, 0, 0.25); -} - -.about_slider .carousel .carousel-item.active { - backdrop-filter: blur(6px); - z-index: 3; -} -.about_slider .carousel .carousel-item::after { - content: ''; - background-image: url(../img/border.png); - background-size: cover; - /* background: linear-gradient(21.69deg, #F44242 23.69%, #569EF0 66.57%); */ - display: block; - position: absolute; - width: calc(100% + 4px); - height: calc(100% + 4px); - border-radius: 60px; - top: -2px; - left: -2px; - z-index: -2; - transform: translateZ(-1px); -} -.about_slider .carousel .carousel-item img{ - width: auto; -} - -.about_slider .slide_info{ - display: flex; - flex-direction: column; - gap: 15px; -} -.about_slider .slide--prev, -.about_slider .slide--next{ - z-index: 2; - opacity: 0.75; -} - -.about_slider .prev, .about_slider .next { - position: absolute; - top: 50%; - transform: translateY(-50%); - cursor: pointer; - z-index: 99; - background-color: unset; -} - -.about_slider .prev { - left: 29vw; -} - -.about_slider .next { - right: 29vw; -} - -.about_slider .slide_title{ - text-transform: uppercase; - font-size: 24px; - font-weight: 700; - line-height: 28.8px; - color: var(--grey-black, #121212); -} -.about_slider .slide_text{ - font-size: 20px; - font-weight: 500; - line-height: 24px; - color: var(--grey-black, #121212); -} -/* About end */ - -.section_wrap{ - margin-top: -70px; - padding: 178px 0 90px; - /* GP | fix */ - -} -/* Sellers start */ -.sellers{ - padding-bottom: 113px; - -} -.sellers .seller_block{ - display: flex; - flex-direction: column; -} -.seller_block .sellers_top{ - display: flex; - align-items: center; - justify-content: space-between; - gap: 30px; - margin-bottom: 34px; -} -.sellers_top .sellers_title{ - font-size: 82px; - font-weight: 700; - line-height: 98.4px; - color: var(--creme-white, #F4F1F0); - text-transform: uppercase; -} - -.sellers_slider .swiper{ - /* padding-left: 10%; - padding-right: 20px; */ - display: flex; - align-items: center; - /* width: 1000px; */ - height: 540px; - margin: auto; - overflow: hidden; -} -.seller_name { - text-transform:lowercase; - color:var(--grey-black, #121212); - font-size: 20px; - font-weight: 400; - line-height: 24px; - text-align: left; - /* min-width: 280px; */ -} -.seller_price { -font-size: 20px; -font-weight: bold; -line-height: 30px; -text-align: left; -margin-bottom: 8px; -margin-top: 8px; -} - -.seller_full { - display: flex; - flex-direction: row; - justify-content: start; - margin-top: 48px; -} -.seller_full-link { -color:#121212; -font-size: 20px; -font-weight: bold; -line-height: 24px; -text-align: left; -text-decoration: none; -padding: 0px 0px 4px 0px; -gap: 8px; -border-bottom: 2px solid var(--interface-main_black, rgba(18, 18, 18, 1)) -} -.swiper .swiper-wrapper{ - display: flex; - height: unset; -} -.sellers .sellers_card{ - min-height: 490px; - display: flex; - flex-direction: column; - justify-content: space-between; - gap: 11px; - align-items: center; - padding: 16px; - /* border: 2px solid var(--creme-white, #F4F1F0); */ - border-radius: 24px; - background: rgba(255, 255, 255, 0.5); -} - -.sellers_card .sellers_card-text{ - font-size: 24px; - font-weight: 500; - line-height: 28.8px; - color: var(--grey-black, #121212); - -} -/* Sellers end */ - - -/* Reviews start */ -.reviews{ - position: relative; - padding: 112px 0px 56px; - background: var(--creme-white, #F4F1F0); - border-radius: 60px 60px 0 0; -} -.reviews .reviews_person{ - position: absolute; - right: -80px; - top: 0; -} -.reviews_person-mob{ - display: none; -} -.reviews .reviews_title{ - color: var(--grey-black, #121212); - font-family: "Craftwork Grotest"; - font-size: 79px; - font-style: normal; - font-weight: 700; - line-height: normal; - text-transform: uppercase; - position: relative; - z-index: 1; -} -.reviews .reviews_block{ - margin-top: 35px; -} -.reviews_block .reviews_items{ - position: relative; - z-index: 1; - display: flex; - flex-wrap: wrap; - gap: 23px; - align-items: center; -} - -.reviews_items .reviews_item{ - position: relative; - display: flex; - flex-direction: column; - gap: 7px; - background: #F4F1F0; - padding: 23px; - border-radius: 60px; - width: 100%; - height: fit-content; - z-index: 1; -} -/* Пустой блок, чтоб на десктопе в первой строке справой стороны не загораживать картинку */ -.reviews_items .reviews_item.reviews_item--empty{ - background: none; -} -@media screen and (max-width: 480px) { - .reviews_items .reviews_item.reviews_item--empty { - display: none; - } -} - -.reviews_item .reviews_item-top{ - display: flex; - align-items: center; - gap: 8px; -} -.reviews_item .reviews_item-top img{ - width: 78px; -} -.reviews_item .reviews_item-top b{ - text-transform: uppercase; - display: block; - font-size: 24px; - font-weight: 700; - line-height: 28.8px; - color: var(--grey-black, #121212); -} -.reviews_item .reviews_item-top span{ - margin: 14px 0; - width: 100%; - display: block; - font-size: 12px; - font-weight: 500; - line-height: 14.4px; - color: var(--grey-black, #121212); -} -.reviews_item .reviews_item-text{ - font-size: 20px; - font-weight: 500; - line-height: 24px; - color: var(--grey-black, #121212); -} -.reviews_items .reviews_item1, -.reviews_items .reviews_item6{ - position: relative; - /* transform: rotate(-2.35deg); */ - transform-style: preserve-3d; -} -/* GP | fix */ -.reviews_items .reviews_item1::after, -.reviews_items .reviews_item6::after{ - content: ''; - display: block; - position: absolute; - width: calc(100% + 4px); - height: calc(100% + 4px); - background: linear-gradient(21.69deg, #F44242 23.69%, #569EF0 66.57%); - border-radius: 60px; - top: -2px; - left: -2px; - z-index: -1; - transform: translateZ(-1px); -} - -.reviews_items .reviews_item6{ - transform: rotate(-7deg); -} - -.reviews_items .reviews_item3{ - transform: rotate(-5deg); -} -.reviews_items .reviews_item5, -.reviews_items .reviews_item4{ - background: radial-gradient(1073.72% 191.15% at -371.63% -32.65%, #0F5881 0%, #1EA49C 36.98%, #76CE75 66.67%, #ECF39F 91.15%); - /* transform: rotate(4deg); - margin-top: 25px; */ -} - -.reviews_items .reviews_item2{ - background: var(--grey-black, #121212); - /* transform: rotate(5deg); - margin: 30px 0 0 20px; */ -} -.reviews_items .reviews_item4{ - /* transform: rotate(8deg); - margin: -30px 0 0 20%; */ -} - -.reviews_item2 .reviews_item-top b, -.reviews_item2 .reviews_item-top span, -.reviews_item2 .reviews_item-text, -.reviews_item3 .reviews_item-top b, -.reviews_item3 .reviews_item-top span, -.reviews_item3 .reviews_item-text, -.reviews_item4 .reviews_item-top b, -.reviews_item4 .reviews_item-top span, -.reviews_item4 .reviews_item-text, -.reviews_item5 .reviews_item-top b, -.reviews_item5 .reviews_item-top span, -.reviews_item5 .reviews_item-text{ - color: #F4F1F0; -} -.reviews_item2 .reviews_item-text, -.reviews_item3 .reviews_item-text, -.reviews_item4 .reviews_item-text, -.reviews_item5 .reviews_item-text{ - font-weight: 400; -} - - -/* Reviews end */ - -/* About us start */ -.about_us{ - padding-bottom: 54px; - background-color: #F4F1F0; - margin-top: -1px; -} -.about_us .about_us-title{ - font-size: 82px; - line-height: 98.4px; - text-transform: uppercase; - color: var(--grey-black, #121212); -} -.about_us .about_us-block{ - display: flex; - flex-direction: column; - gap: 15px; - margin-top: 25px; -} -.about_us-block .about_us-cards{ - display: grid; - align-items: start; - grid-template-columns: 59% 39.2%; - gap: 15px; -} -.about_us-block .about_us-card{ - position: relative; - border-radius: 60px; - overflow: hidden; - height: 324px; - width: 100%; - overflow: unset; -} -.about_us-block .about_us-card::after{ - content: ''; - display: block; - position: absolute; - width: calc(100% + 4px); - height: calc(100% + 4px); - background: linear-gradient(21.69deg, #F44242 23.69%, #569EF0 66.57%); - border-radius: 60px; - top: -2px; - left: -2px; - z-index: 0; -} -.about_us-card .about_us-card-img{ - border-radius: 60px; - height: 100%; - width: 100%; - object-fit: cover; - position: relative; - z-index: 1; -} -.about_us-card .card_date{ - z-index: 1; - position: absolute; - top: 27px; - right: 35px; - background: #FFFFFF; - border-radius: 62px; - padding: 5px 15px 4px 17px; - font-size: 24px; - font-weight: 400; - line-height: 28.8px; - color: var(--grey-black, #121212); -} -/* GP | fix */ - - -.about_us-card .about_us-card-info { - position: absolute; - padding: 10% 33px 21px ; - width: 100%; - z-index: 1; - display: flex; - flex-direction: column; - gap: 14px; - left: 0px; - bottom: 0; - border-radius: 0 0 60px 60px; - background: linear-gradient(0deg, #F4F1F0 45%, rgba(244, 241, 240, 0) 100%); -} - -.about_us-card-info.card-info--half-gradient { - background: unset; -} - -.about_us-card .about_us-card-info h2{ - /* max-width: 440px; */ - font-size: 24px; - line-height: 32px; - text-transform: uppercase; - color: var(--grey-black, #121212); -} -.about_us-card .about_us-card-info span{ - display: block; - font-weight: 400; - -} -.about_us-card .about_us-card-info span a{ - text-decoration: underline; - font-size: 24px; - line-height: 28.8px; - color: var(--grey-black, #121212); -} -/* About us end */ - -/* Truth start */ -.truth{ - border-radius: 0 0 60px 60px; - background: var(--creme-white, #F4F1F0); - padding-bottom: 119px; - margin-top: -1px; -} -.truth .truth_top{ - position: relative; - display: flex; - align-items: center; - justify-content: space-between; -} -.truth .truth_title{ - font-size: 82px; - font-weight: 700; - line-height: 98.4px; - text-align: end; - text-transform: uppercase; - width: 723px; -} -.truth .truth_title span{ - color: #76CE75; - -} -.truth_top .gift_img{ - margin-left: -180px; -} -.truth_top .gift_line-img{ - position: absolute; - display: none; - bottom: 150px; - right: 0; - width: 245px; -} -.truth_content { - position: relative; - display: none; -} - -.truth_content::after{ - content: ''; - display: block; - position: absolute; - width: calc(100% + 4px); - height: calc(100% + 4px); - background: linear-gradient(21.69deg, #F44242 23.69%, #569EF0 66.57%); - border-radius: 60px; - top: -2px; - left: -2px; - z-index: 0; -} -.truth_content.active { - display: block; -} -.truth .truth_block{ - position: relative; - z-index: 1; - display: flex; - flex-direction: column; - width: 100%; - height: 480px; - overflow: hidden; - background: var(--creme-white, #F4F1F0); - border-radius: 60px; - box-shadow: 0px 3px 13.5px 0px #00000040; - padding: 25px 34px 0px 63px; -} -.truth .truth_success, -.truth .truth_error { - display: none; -} -.truth .truth_success.show, -.truth .truth_error.show { - display: flex; -} - -.truth_block .truth_line{ - display: flex; - align-items: center; - justify-content: center; - gap: 24px; - margin-bottom: 24px; -} -.truth_block .truth_line span{ - border: 1px solid var(--grey-black, #121212); - opacity: .6; - width: 73px; - border-radius: 10px; -} -.truth_block .truth_line span.active{ - opacity: 1; -} -.truth_block .truth_block-title{ - font-size: 82px; - font-weight: 700; - line-height: 98.4px; - color: var(--grey-black, #121212); - margin-bottom: 33px; - text-transform: uppercase; -} -.truth_content-end .truth_block-title, -.truth_success .truth_block-title{ - background: -webkit-radial-gradient(#0F5881 0%, #1EA49C 36.98%, #76CE75 66.67%, #ECF39F 91.15%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} -.truth_error .truth_block-title{ - background: -webkit-radial-gradient(#F21E6A 0%, #FF6543 112.38%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} -.truth_block .truth_block-text{ - position: relative; - z-index: 1; - display: flex; - align-items: start; - gap: 26px; -} -.truth_block .truth_end-text{ - display: flex; - flex-direction: column; - gap: 21px; -} -.truth_block .truth_block-text p{ - font-size: 24px; - font-weight: 700; - line-height: 28.8px; - max-width: 559px; -} -.truth_block .truth_block-text p span{ - font-weight: 500; -} -.truth_default .truth_block-text p{ - text-transform: uppercase; -} -.truth_error .truth_block-text p, -.truth_success .truth_block-text p { - max-width: 592px; - font-size: 20px; - line-height: 24px; - font-weight: 500; -} -.truth_block .truth_info{ - position: absolute; - width: 91%; - bottom: 0; - display: flex; - align-items: end; - justify-content: space-between; - margin-top: -100px; - z-index: 0; -} -.truth_content-end .truth_info{ - display: flex; - align-items: center; - justify-content: end; -} -.truth_block .truth_links{ - display: flex; - align-items: center; - gap: 15px; - padding-bottom: 56px; -} -.truth_error .truth_links, -.truth_success .truth_links{ - gap: 20px; -} -.truth_block .truth_result{ - display: flex; - align-items: center; - gap: 23px; -} -.truth_block .truth_result img{ - width: 100%; -} -.truth_block .truth_link{ - width: 141px; - height: 50px; - display: flex; - align-items: center; - justify-content: center; - font-size: 24px; - font-weight: 500; - line-height: 28.8px; - text-align: center; - color: var(--grey-black, #121212); - border: 2px solid var(--grey-black, #121212); - border-radius: 48px; -} - -.truth_content-end .truth_info img{ - margin-right: -34px; -} -.truth_content-end .truth_block .truth_link{ - width: 221px; -} - -.truth_content-end .truth_xn{ - position: relative; - width: 270px; - height: 158px; - background-image: url(../img/xn-border.svg); - background-repeat: no-repeat; - background-size: 100% 100%; - display: flex; - align-items: center; - justify-content: center; -} - -.truth_points { - font-size: 450%; - font-weight: 700; -} - -/* Truth end */ - - -/* Blog start */ -.blog{ - padding-top: 89px; -} -.blog .blog_block{ - display: flex; - flex-direction: column; - gap: 15px; -} -.blog_block .blog_top{ - display: flex; - align-items: center; - justify-content: space-between; - gap: 30px; -} -.blog_block .blog_title{ - font-size: 82px; - font-weight: 700; - line-height: 98.4px; - color: var(--creme-white, #F4F1F0); - text-transform: uppercase; -} -.blog_block .blog_text{ - font-size: 24px; - line-height: 28.8px; - color: var(--creme-white, #F4F1F0); -} -.blog .blog_slider{ - margin-top: 30px; -} -.blog_slider .swiper{ - padding-left: 9%; - padding-right: 20px; -} -.blog_slider .blog_card { - display: flex; - flex-direction: column; - border-radius: 60px; - transition: .3s ease all; - height: auto; -} -.blog_slider .blog_card:hover{ - border-color: #121212; - overflow: initial; -} - -/* .blog_slider .blog_card:hover .card-line-img{ - opacity: 1; -} */ - -.blog_slider .blog_card:hover .blog_card-text, -.blog_slider .blog_card:hover .blog_card-title{ - color: #F4F1F0; -} - -.blog_card .blog_card-img{ - object-fit: cover; - border: 2px solid var(--creme-white, #F4F1F0); - border-width: 2px 2px 0 2px; - width: 100%; - height: 40%; - border-radius: 60px 60px 0 0; -} -.blog_card .card-line-img{ - opacity: 0; - transition: .3s ease all; -} -.blog_card .blog_card-info-wrap{ - border: 2px solid var(--creme-white, #F4F1F0); - width: 100%; - height: 60%; - display: flex; - background: linear-gradient(355.81deg, #F4F1F0 5.04%, rgba(244, 241, 240, 0.3) 87.4%); - border-radius: 0 0 60px 60px; - padding: 25px 25px 30px 30px; -} -.blog_slider .blog_card:hover .blog_card-info-wrap{ - background: var(--grey-black, #121212); - /* padding-right: 15px; */ -} -.blog_card .blog_card-info{ - display: flex; - flex-direction: column; - margin-top: -2px; - gap: 16px; - -} -.blog_card .blog_card-title{ - /* font-size: 36px; */ - font-size: 2.1vw; - font-weight: 700; - line-height: 43.2px; - color: var(--grey-black, #121212); - text-transform: uppercase; - transition: .3s ease all; -} -.blog_card .blog_card-text{ - font-size: 24px; - font-weight: 500; - line-height: 28.8px; - color: var(--grey-black, #121212); - transition: .3s ease all; -} -/* Blog end */ - -.marketplace{ - margin-top: 5rem; -} -/* Discount start */ -.discount{ - padding-top: 50px; - padding-bottom: 50px; -} -.discount .discount_block{ - display: flex; - flex-direction: column; -} -.discount .discount_top{ - position: relative; - margin-bottom: 50px; -} -.discount_top .discount_title{ - font-size: 82px; - font-weight: 700; - line-height: 98.4px; - color: var(--creme-white, #F4F1F0); - text-transform: uppercase; -} -.discount_top .discount_top-imgs{ - position: absolute; - top: 55px; - right: -80px; -} -.discount_block .discount_form{ - position: relative; - z-index: 1; - display: flex; - align-items: center; - gap: 16px; - margin-bottom: 6px; -} -.discount_form .discount_form-btn { - background: inherit; - min-height: unset; -} -.discount_form .discount_form-btn:hover{ - background: #121212; - border-color: #121212; - color: #3ab18f; -} -.discount_form .discount_form-inp{ - width: 280px; - height: 50px; - border: 2px solid var(--creme-white, #F4F1F0); - padding: 10px 18px; - font-size: 24px; - font-weight: 500; - line-height: 28.8px; - color: var(--creme-white, #F4F1F0); - border-radius: 28px; - opacity: .6; -} -.discount_form .discount_form-inp::placeholder{ - font-size: 24px; - font-weight: 500; - line-height: 28.8px; - color: var(--creme-white, #F4F1F0); -} -.discount_form .discount_form-btn { - text-transform: lowercase; -} -.discount_block .discount_form-text{ - font-size: 14px; - line-height: 16.8px; - color: var(--creme-white, #F4F1F0); - opacity: .6; - max-width: 778px; - margin-bottom: 27px; -} -.discount_block .discount_text{ - font-size: 20px; - line-height: 24px; - color: var(--creme-white, #F4F1F0); -} - -.discount_block .discount_cosmodog{ - position: relative; - width: 100%; - height: 626px; - border-radius: 60px; - border: 2px solid var(--creme-white, #F4F1F0); - display: flex; - align-items: end; - justify-content: center; - overflow: hidden; - cursor: pointer; -} -.discount_cosmodog .discount_cosmodog-img{ - - width: 100%; - height: 100%; - object-fit: cover; - -} - -.discount_cosmodog__slider{ - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; -} -.discount_cosmodog .discount_cosmodog-img.active{ - opacity: 1; -} -.discount_cosmodog:hover .discount_cosmodog-img:nth-child(2) { - opacity: 1; -} -.discount_cosmodog .discount_cosmodog_info{ - position: relative; - z-index: 1; - padding: 33px; - display: flex; - flex-direction: column; - align-items: center; - justify-content: end; - background: linear-gradient(0deg, #F4F1F0 56%, rgba(244, 241, 240, 0) 100%); - width: 100%; - height: 219px; -} -.discount_cosmodog .discount_cosmodog-title{ - font-size: 40px; - font-weight: 700; - line-height: 48px; - text-align: center; - color: var(--grey-black, #121212); - text-transform: uppercase; -} -.discount_cosmodog .discount_cosmodog-text{ - font-size: 24px; - font-weight: 500; - line-height: 28.8px; - text-align: center; -} - -/* Discount end */ - -.gp_tags { - border: 1px solid #121212; - border-radius: 48px; - padding:3px 6px 3px 6px; - margin-right: 6px; - margin-bottom: 6px; - font-size: 16px; - line-height: 16px; - height: 27px; - text-transform: lowercase; -} -.gp_tags:last-child { - margin-right: 0; -} -.tags_block { - display: flex; - flex-direction: row; - justify-content:start; - flex-wrap: wrap; - width: 100%; -} - -.seller_buy { - text-transform: capitalize; - width: 100%; - height: 48px; - padding: 12px 24px 12px 24px; - gap: 8px; - border-radius: 20px; - color:#fff; - background: var(--interface-main_black, #121212); -} -.seller_link { - width: 100%; -} -.truth-form{ - display: flex; - gap: 10px; -} -.truth-form button{ - flex-shrink: 0; -} -input.truth-input{ - width: 200px; - height: 50px; - border-color: #121212 !important; - border-radius: 48px; - border: 2px solid #121212; - flex-shrink: 1; - margin-right: 12px; - padding: 20px; - font-size: 18px; -} -@media (max-width: 776px) { - .truth-form{ - flex-direction: column; - margin-bottom: 30px; -} -.truth-form button{ - width: 100%; - text-align: center; - justify-content: center; -} -input.truth-input{ - width: 100%; -} -} - -.smi-card-wrapper{ - border-radius: 60px; - background: linear-gradient(21.69deg, #F44242 23.69%, #569EF0 66.57%); - border-radius: 60px; - padding: 2px; - width: 100%; - height: 484px; -} -.smiSlider{ - margin-top: 3rem; -} -.smi-card{ - display: flex; - flex-direction: column; - justify-content: flex-end; - width: 100%; - height: 480px; - border-radius: 60px; - position: relative; - overflow: hidden; - padding: 28px 35px; - color: #121212; - -} -.smi-card::before{ - background: linear-gradient(to top, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0) 100%); -content: ''; -height: 100%; -width: 100%; -position: absolute; -bottom: 0; -left: 0; -z-index: 2; -} -.smi-card-img{ - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - object-fit: cover; -} -.smi-card-date, .smi-card-title, .smi-card-label{ - position: relative; - z-index: 2; -} -.smi-card-label{ - display: flex; - border: 1px solid #121212; - border-radius: 28px; - padding: 4px 15px; - align-items: center; - font-weight: 500; - font-size: 16px; - gap: 6px; - background-color: #fff; - width: max-content; -} -.smi-card-label p{ - margin-bottom: 0; -} -.smi-card-title{ - font-weight: 700; -font-size: 22px; -text-transform: uppercase; line-height: 120%; -margin-bottom: 7px; -margin-top: 10px; -} -.smi-card-date{ - font-weight: 500; -font-size: 12px; -} -.smiSlider.swiper{ - overflow: visible; - } - .about_us{ - width: 100%; - overflow: hidden; - } - .smi-card-label img{ - max-height: 25px; - width: auto; - } - .smi-card-label{ - height: 35px; - } -@media (max-width: 640px) { - .smi-card{ - padding: 16px; - height: 420px; - border-radius: 30px; - } - .smi-card-title{ - font-size: 18px; - } - .smi-card-wrapper{ - height: 424px; - border-radius: 30px; - } - -} - -.slider-arrows{ - position: relative; - /* top: 50%; - left: 50%; - transform: translate(-52.5%, -50%); - width: 78%; */ - display: flex; - justify-content: space-between; - z-index: 40; - pointer-events: none; -} -@media (max-width: 640px) { - .slider-arrows{ - display: none; - } - .sellers_slider .swiper{ -width: 330px; - } -} -.blogSlider .slider-arrows{ - position: absolute; - top: 50%; - left: 50%; - transform: translate(-55%, -50%); - width: 76.5%; - display: flex; - justify-content: space-between; - z-index: 40; - pointer-events: none; -} -.smiSlider .slider-arrows { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-47%, -50%); - width: 112%; - display: flex; - justify-content: space-between; - z-index: 40; - pointer-events: none; - -} -.slider-arrow{ - background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='56' height='56' viewBox='0 0 56 56' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='0.5' y='0.5' width='55' height='55' rx='19.5' fill='white'/%3e%3crect x='0.5' y='0.5' width='55' height='55' rx='19.5' stroke='%23121212'/%3e%3cpath d='M37 28.3633H20.5' stroke='%23121212' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3cpath d='M37 28.3633L30.636 34.7272' stroke='%23121212' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3cpath d='M37 28.3633L30.636 21.9993' stroke='%23121212' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e "); - height: 56px; - width: 56px; - background-size: contain; - pointer-events: all; - -} -.slider-arrow[disabled]{ - visibility: none; -} -.slider-arrow-prev{ - transform: scaleX(-1); - margin-right: 24px; -} - -.header-lang{ - font-size: 16px; - font-weight: 500; - line-height: normal; - text-transform: uppercase; - color: var(--creme-white); - border-radius: 45px; - border: 1px solid var(--creme-white); - opacity: 0.6; - appearance: none; - background-color: transparent; - background-image: url(../img/i-arr_down.svg); - background-position: center right 10px; - background-repeat: no-repeat; - background-size: 16px; - padding: 11px 36px 11px 23px; - cursor: pointer; - outline: none; - position: relative; - z-index: 10; - } - - .header-lang ul{ - border: 1px solid #f3f1f0; - border-radius: 20px; - width: 100%; - padding-top: 11px; - padding-bottom: 11px; - padding-left: 23px; - padding-right: 23px; - background: #57da7d; - text-align: center; - opacity: 1; - left: 0; - bottom: -30px; - transform: translateY(100%); - - position: absolute; - display: none; - } - - .header-lang ul li a{ - font-weight: 500; - font-size: 16px; - text-transform: uppercase; - color: var(--creme-white); - } - - .category-back{ - width: 124px; - color: #121212; -height: 28px;border: 1px solid #121212; -border-radius: 65px; -background-color: transparent; -font-weight: 500; -font-size: 16px; -display: flex; -align-items:center; -justify-content: center; -margin-bottom:1.5rem; -margin-top: 14px; -} -.category-back::before{ - background-image: url("data:image/svg+xml,%3Csvg width='10' height='15' viewBox='0 0 10 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 1L2 7.5L9 14' stroke='%23121212' stroke-width='2' /%3E%3C/svg%3E"); - content: ''; - width: 10px; - height: 15px; - flex-shrink: 0; - margin-right: 8px; -} -.category-back:hover{ - color: #121212; -} - -.main-page-wrapper{ - margin-top: 0 !important; -} - -.header_icon{ - flex-shrink: 0; -} - -[class*="wd-section-stretch"] { - position: relative; - min-width: 100vw !important; - width: 100vw; - left: calc(50% - 50vw)!important; -} - -.btn{ - padding: 0 30px; -} - -.header_icon{ - position: relative; -} - -.basket-btn__counter{ - position: absolute; - top: 0; - right: 0; - border-radius: 100%; -background: #76ce75; -height: 17px; -width: 17px; -font-weight: 700; -font-size: 10px; -text-align: center; -color: var(--creme-white); -display: flex; -align-items: center; -justify-content: center; -} - - -@media (max-width: 575px) { - .wpcf7-form-control-wrap{ - width: 100%; - } -} - -.seller_bt{ - display: flex; - align-items: center; - gap: 12px; -} - -/* discount sale */ - -.discount__sale { - padding: 69px 0 80px; - border-radius: 60px; - background: var(--creme-white, #F4F1F0); - box-shadow: 6px 9px 20px 0px rgba(0, 0, 0, 0.15); -} - -.discount__sale .discount_title { - color: var(--interface-main_black, #121212); - font-family: "Craftwork Grotest"; - font-size: 82px; - font-style: normal; - font-weight: 700; - line-height: normal; - text-transform: uppercase; -} - -.discount__sale .discount_title span { - background: var(--Accent-1, radial-gradient(200.43% 141.42% at 100% 0%, #76CE75 90%, #BBE38D 100%)); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} - -.discount__sale .discount_form { - display: flex; -} - -.discount__sale .discount_form .discount_form-inp { - color: var(--interface-main_black, #121212); - border: 2px solid var(--interface-main_black, #121212); -} - -.discount__sale .discount_form .discount_form-btn { - color: var(--interface-main_black, #121212); - border: 2px solid var(--interface-main_black, #121212); -} - -.discount__sale .discount_form .discount_form-btn:hover { - color: #FFF; -} - -.discount__sale .discount_form-text { - color: var(--interface-main_black, #121212); - font-family: "Craftwork Grotest"; - font-size: 14px; - font-style: normal; - font-weight: 500; - line-height: normal; - opacity: .6; - max-width: 750px; - margin-top: 6px; -} - -.discount__sale .discount_text { - margin-top: 27px; - color: var(--interface-main_black, #121212); - font-family: "Craftwork Grotest"; - font-size: 20px; - font-style: normal; - font-weight: 500; - line-height: normal; -} - -.discount__sale .discount_form .discount_form-inp::placeholder { - color: var(--interface-main_black, #121212); -} - -@media screen and (max-width: 576px) { - .discount__sale { - padding: 37px 0; - } - - .dicsount__body { - display: flex; - flex-direction: column; - margin-top: 26%; - } - - .discount__sale .discount_form { - flex-direction: column; - gap: 21px; - } - - .discount__sale .discount_top .discount_top-imgs .dicount_dog-img { - height: 356.534px; - width: 100%; - object-fit: contain; - object-position: right; - } - - .discount__sale .dicsount__body > { - order: 2; - } - - .discount__sale .discount_text { - order: 1; - margin-top: 0; - font-size: 18px; - } - - .discount__sale .discount_form-text { - order: 3; - font-size: 12px; - margin-top: 20px; - } - - .discount__sale .wpcf7 { - order: 2; - margin-top: 30px; - } - - .discount__sale .discount_form .discount_form-btn, - .discount__sale .discount_form .discount_form-inp { - text-align: center; - padding: 10px 10px 11px 10px; - font-size: 24px; - height: 50px; - justify-content: center; - } - - .discount__sale .discount_form .discount_form-inp::placeholder { - font-size: 24px; - } - - .discount__sale .discount_top .discount_top-imgs { - transform: unset; - } - - .discount__sale .discount_top .discount_top-imgs { - margin-top: -24px; - right: 15px; - width: calc(100% + 30px); - margin-bottom: -20%; - } -} - -.blog_card-title { - font-size: 28px; - font-style: normal; - font-weight: 700; - line-height: 32px; -} - -.blog__card-btn { - margin-top: 24px; - color: #000; - font-family: "Craftwork Grotest"; - font-size: 12px; - font-style: normal; - font-weight: 500; - line-height: normal; - padding: 6px 15px 10px 15px; - max-width: max-content; - display: block; - margin-left: auto; - border-radius: 28px; - border: 1px solid #000; - background: var(--wh, #FFF); - transition: all .24s; -} - - -.blog_slider .blog_card:hover .blog__card-btn { - border-radius: 28px; - border: 1px solid var(--interface-main_white, #FFF); - background: transparent; - color: var(--interface-main_white, #FFF); - transition: all .24s; -} - -.blog__row { - display: flex; - justify-content: space-between; - align-items: center; -} - -.blog__row .blog_text { - max-width: 627px; -} - -.truth_top { - position: relative; -} - -.truth_top picture img { - width: 315.563px; - height: 308.2px; - position: absolute; - right: 0; - top: -110px; -} - -.truth .truth_title { - text-align: left; - width: 100%; - font-size: 74px; - font-style: normal; - font-weight: 700; - line-height: normal; - margin-bottom: 62px; -} - -.truth_block .truth_end-text strong { - font-weight: 900; -} - -.truth__end-promo { - color: var(--grey-black, #121212); - font-family: "Craftwork Grotest"; - font-size: 24px; - font-style: normal; - font-weight: 900; - line-height: normal; - text-transform: uppercase; -} - -.truth__end-btns { - margin-top: 10px; - display: flex; - gap: 12px; -} - -.truth__end-btn { - padding: 10px 10px 11px 10px; - font-family: "Craftwork Grotest"; - font-size: 24px; - font-style: normal; - font-weight: 500; - line-height: normal; - border-radius: 48px; - max-width: 210px; - width: 100%; - text-align: center; - transition: all .3s; - text-transform: none; -} - -.truth__end-btn.--white { - color: var(--grey-black, #121212); - border: 2px solid var(--grey-black, #121212); - background-color: transparent; -} - -.truth__end-btn.--white:hover { - background: #121212; - color: #FFF; - transition: all .3s; -} - -.truth__end-btn.--black { - background: var(--interface-main_black, #121212); - color: var(--interface-main_white, #FFF); - border: 2px solid transparent; -} - -.truth__end-btn.--black span { - position: relative; - padding-right: 16px; -} - -.truth__end-btn.--black span::after { - content: ''; - position: absolute; - right: 0; - top: 50%; - transform: translateY(-50%); - width: 13px; - height: 13px; - background-size: 100%; - background-repeat: no-repeat; - transition: all .3s; - background-position: center; - background-image: url('data:image/svg+xml,'); -} - -.truth__end-btn.--black:hover { - background: transparent; - color: #121212; - border-color: #000; - transition: all .3s; -} - -.truth__end-btn.--black:hover span::after { - transition: all .3s; - background-image: url('data:image/svg+xml,'); -} - -@media screen and (max-width: 576px) { - .truth_top picture img { - position: relative; - top: unset; - right: unset; - left: 0; - width: 294.209px; - height: 198.713px; - } - - .truth .truth_title { - text-align: right; - } - - .truth__end-btns { - flex-direction: column; - } - - .truth__end-btn { - max-width: 100%; - } - - .truth .truth_title { - margin-bottom: 0; - } -} - -.home__block { - max-width: 50%; -} - -.home__title { - color: var(--interface-background, #F2F2F2); - font-family: "Craftwork Grotest"; - font-size: 48px; - font-style: normal; - font-weight: 700; - line-height: 56px; /* 116.667% */ - text-transform: uppercase; -} - -@media (min-width: 1600px){ - .home__title { - - font-size: 64px; - line-height: 120%; - } -} -.home__subtitle { - color: var(--interface-background, #F2F2F2); - font-family: "Craftwork Grotest"; - margin-top: 32px; - font-size: 20px; - font-style: normal; - font-weight: 500; - line-height: 24px; /* 120% */ -} - -.home__btn { - border-radius: 20px; - background: var(--interface-main_white, #FFF); - padding: 12px 24px; - color: var(--interface-main_black, #121212); - font-family: "Craftwork Grotest"; - font-size: 20px; - font-style: normal; - font-weight: 600; - line-height: 24px; /* 120% */ - display: block; - margin-top: 32px; - max-width: 290px; - text-align: center; - width: 100%; - border: 2px solid transparent; -} - -.home__btn span { - position: relative; - padding-right: 20px; -} - -.home__btn span::after { - content: ''; - width: 13px; - height: 13px; - background-size: 100%; - background-repeat: no-repeat; - background-position: center; - position: absolute; - right: 0; - top: 50%; - transform: translateY(-50%); - background-image: url('data:image/svg+xml,'); -} - -.home__btn:hover { - border-color: #FFF; - background: transparent; - color: #FFF; -} - -.home__btn:hover span::after { - background-image: url('data:image/svg+xml,'); -} - -.home__pagination { - margin-top: 120px; -} - -.home__pagination .swiper-pagination-bullet { - width: 39.278px; - height: 6px; - border-radius: 54px; - opacity: 0.5; - background: var(--interface-main_white, #FFF); -} - -.home__pagination .swiper-pagination-bullet-active { - opacity: 1; -} - -.home__item img { - position: absolute; - right: -142px; - top: -110px; - height: auto; - width: 70%; - max-width: 600px; -} - -@media (min-width: 1420px) { - .home__item img { - position: absolute; - right: -142px; - top: -110px; - height: auto; - width: 70%; - max-width: 800px; - } -} - -.home__swiper, -.home__swiper .swiper-wrapper { - height: auto; -} - -.blog .blog_slider { - margin-top: 128px; -} - -.cosmopet-x { - padding: 36px 0 0 0; - width: 100%; - overflow: hidden; -} - -.cosmopet-x__swiper, -.cosmopet-x__swiper .swiper-wrapper { - height: auto; -} - -.cosmopet-x__title { - color: var(--creme-white, #F4F1F0); - font-family: "Craftwork Grotest"; - font-size: 82px; - font-style: normal; - font-weight: 700; - line-height: normal; - text-transform: uppercase; -} - -.cosmopet-x__swiper { - margin-top: 52px; - position: relative; -} - -.cosmopet-x__item { - position: relative; - width: 100%; - height: 484px; -} - -.cosmopet-x__item::before { - content: ''; - position: absolute; - left: 0; - top: 0; - height: 100%; - z-index: 1; - width: 100%; - border-radius: 60px; - border: 2px solid var(--creme-white, #F4F1F0); - background: linear-gradient(180deg, rgba(255, 255, 255, 0.83) 0%, rgba(255, 255, 255, 0.00) 25.17%, rgba(255, 255, 255, 0.00) 65%, rgba(255, 255, 255, 0.83) 80%); -} - -.cosmopet-x__bg { - position: absolute; - top: 0; - left: 0; - height: 100%; - width: 100%; - object-fit: cover; - object-position: center; - border-radius: 60px; -} - -.cosmopet-x__body { - position: absolute; - z-index: 2; - bottom: 0; - left: 0; - width: 100%; - padding: 36px 35px; -} - -.cosmopet-x__heading { - color: var(--grey-black, #121212); - font-family: "Craftwork Grotest"; - font-size: 22px; - font-style: normal; - font-weight: 700; - line-height: normal; - text-transform: uppercase; -} - -.cosmopet-x__btn { - display: block; - max-width: max-content; - margin-top: 7px; - color: #000; - font-family: "Craftwork Grotest"; - font-size: 12px; - font-style: normal; - font-weight: 500; - line-height: normal; - padding: 6px 15px 10px 15px; - border-radius: 28px; - border: 1px solid #000; - background: var(--wh, #FFF); -} - -.cosmopet-x__top { - position: absolute; - height: auto; - width: 60%; - top: 43px; - left: 50%; - transform: translateX(-50%); - z-index: 2; -} - -.cosmopet-x .slider-arrows { - top: 50%; - transform: translateY(-50%); - position: absolute; - width: 100%; -} - -.cosmopet-x .slider-arrows .cosmopet-prev { - left: -30px; -} - -.cosmopet-x .slider-arrows .cosmopet-next { - right: -30px; -} - -.slider-arrow { - background-image: url('data:image/svg+xml,')!important; -} - -.discount_top { - position: relative; -} - -.dicsount__body { - margin-top: 39px; -} - -.reviews_items .reviews_item { - flex: 0 0 calc(50% - 23px); - min-height: 334px; -} - -.reviews__left { - flex: 0 0 50%; - display: flex; - flex-direction: column; - gap: 23px; -} - -.reviews_item-top + span { - color: var(--creme-white, #F4F1F0); - font-family: "Craftwork Grotest"; - font-size: 12px; - font-style: normal; - font-weight: 500; - line-height: normal; -} - -.reviews_item1 .reviews_item-top + span { - color: var(--interface-main_black, #121212); -} - -.reviews .container { - position: relative; -} - -.truth { - padding-top: 180px; -} - -.blogosphere{ - padding-bottom: 6vh; -} - -.blogosphere__item { - position: relative; - /* width: 100%; */ - /* width: auto; - height: 33vh; */ - /* padding-bottom: 177.6061776061776%; */ - height: 60vh; - width: 36vh; -} - -.blogosphere__item .blogosphere__preview { - position: relative; - height: 60vh; - width: 36vh; - object-fit: cover; - /* height: 100%; - width: 100%; */ - /* position: absolute; - top: 0; - left: 0; - height: 100%; - width: 100%; - object-fit: cover; - object-position: center; */ - border-radius: 33.6px; - box-shadow: 0px 4px 14.4px 0px rgba(0, 0, 0, 0.33); -} - -.blogosphere__content { - position: absolute; - /* width: 25vw; */ - width: 100%; - padding: 10px 15px; - display: flex; - align-items: center; - gap: 10px; - z-index: 1; -} - -.blogosphere__avatar -{ - position: relative; - width: 39.2px; - height: 39.2px; - flex-shrink: 0; - box-shadow: unset; - border: 1.4px solid #FFF; - border-radius: 100%; - flex-shrink: 0; -} - -.blogosphere__name { - color: #FFF; - font-family: "Craftwork Grotest"; - font-size: 16.8px; - font-style: normal; - font-weight: 700; - line-height: 22.4px; /* 133.333% */ -} - -.blogosphere__swiper.swiper { - position: relative; -} - -.blogosphere__swiper .carousel .carousel-item{ - width: auto; - height: auto; -} - -.blogosphere__swiper .slider-arrows { - position: absolute; - top: 50%; - transform: translate(-50%, -50%); - max-width: 421px; - width: 100%; - left: 50%; - pointer-events: none; -} - -.blogosphere { - padding-top: 60px; -} - -.blogosphere__top { - display: flex; - align-items: center; - gap: 30px; -} - -.blogosphere__title { - background-size: 100%; - background-repeat: no-repeat; - background-position: center; - width: 692.514px; - height: 71.298px; - background-image: url('data:image/svg+xml,'); -} - -.blogosphere__circle { - flex-shrink: 0; -} - -.marketplace__swiper, .marketplace__swiper .swiper-wrapper { - height: auto; -} - -.marketplace__swiper .swiper-slide { - max-width: max-content; -} - -.marketplace__title { - color: var(--grey-black, #121212); - font-family: "Craftwork Grotest"; - font-size: 36px; - font-style: normal; - font-weight: 700; - line-height: 40px; /* 111.111% */ - text-transform: uppercase; -} - -.marketplace__swiper { - margin-top: 50px; - margin-left: -70px; - margin-right: -70px; -} - -.marketplace { - position: relative; -} - -.marketplace:after { - content: ''; - position: absolute; - right: 0; - bottom: 0; - width: 222px; - height: 671px; - background: linear-gradient(270deg, #F6F4F3 0%, rgba(242, 242, 242, 0.00) 100%); - z-index: 1; -} - -.blog_card .blog__card-wrapper .blog_card-img { - width: 100%; - height: 100%; - position: absolute; -} - -.blog__card-wrapper { - position: relative; - width: 100%; - padding-bottom: 61.31687242798354%; -} - -.discount__sale .discount_form .discount_form-inp { - opacity: 1; -} - -.discount__sale .discount_form .discount_form-inp::placeholder { - opacity: .6; -} - -.discount__sale .discount_title span { - background: var(--Accent-1, radial-gradient(200.43% 141.42% at 100% 0%, #188892 0%, #1EA49C 45%, #76CE75 90%, #BBE38D 100%)); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} - -.blog_link.main_link:hover span { - background: var(--Accent-1, radial-gradient(200.43% 141.42% at 100% 0%, #188892 0%, #1EA49C 45%, #76CE75 90%, #BBE38D 100%)); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} - - - -@media screen and (max-width: 991px) { - .reviews__left { - width: 100%; - } -} - -@media screen and (max-width: 768px) { - .home__item img { - position: relative; - right: unset; - top: unset; - width: 100%; - height: auto; - } - - .home__item { - display: flex; - flex-direction: column-reverse; - } - - .home__block { - max-width: 100%; - margin-top: 12px; - } - - .home__title { - font-size: 32px; - font-style: normal; - font-weight: 700; - line-height: 38px; /* 118.75% */ - letter-spacing: -0.32px; - text-transform: uppercase; - } - - .home__subtitle { - margin-top: 16px; - } - - .home__btn { - margin-top: 16px; - max-width: 100%; - } - - .home__pagination { - margin-top: 12px; - text-align: center; - } - - .blog .blog_slider { - margin-top: 28px; - } - - .cosmopet-x__title { - font-size: 32px; - line-height: 38px; /* 118.75% */ - } - - .cosmopet-x__item { - height: 0; - padding-bottom: 151.25%; - } - - .cosmopet-x .slider-arrows { - display: flex; - } - - .cosmopet-x__swiper { - margin-top: 23px; - } - - .slider-arrows .cosmopet-prev { - left: -16px; - } - - .slider-arrows .cosmopet-next { - right: -16px; - } - - .reviews .reviews_title { - text-align: left!important; - font-size: 32px!important; - line-height: 38px!important; /* 118.75% */ - letter-spacing: -0.32px!important; - text-transform: uppercase!important; - margin: 0!important; - } - - .reviews_item .reviews_item-top { - justify-content: space-between; - } - - .reviews__left { - width: 100%; - } - - .reviews_items .reviews_item { - transform: unset!important; - } - - .reviews_items .reviews_item { - width: 100%!important; - } - - .reviews_items .reviews_person-mob { - display: none; - } - - .reviews_item .reviews_item-text { - font-size: 16px!important; - font-style: normal!important; - font-weight: 500!important; - line-height: 20px!important; - } - - .reviews_item .reviews_item-top b { - font-size: 19px!important; - font-style: normal!important; - font-weight: 700!important; - line-height: 24px!important; /* 120% */ - text-transform: uppercase!important; - } - - .reviews_item .reviews_item-text { - max-width: 100%!important; - } - - .truth { - padding-top: 78px; - } - - .blogosphere__circle { - display: none; - } - - .blogosphere__swiper.swiper { - margin-left: -15px; - width: calc(100% + 30px); - } - - .marketplace__title { - font-size: 32px; - line-height: 38px; /* 118.75% */ - letter-spacing: -0.32px; - } - - .marketplace__swiper { - margin-top: 24px; - margin-left: 0px; - margin-right: 0px; - } - - .smiSlider .slider-arrows { - transform: translate(-50%, -50%)!important; - width: 106%!important; - } - - .truth .truth_title span { - background: var(--Accent-1, radial-gradient(200.43% 141.42% at 100% 0%, #188892 0%, #1EA49C 45%, #76CE75 90%, #BBE38D 100%)); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - color: none; - } - - .truth { - padding-top: 20px!important; - } - - .truth_content-wrap { - padding: 0 30px; - } - -} - -@media screen and (max-width: 540px) { - .marketplace:after { - display: none; - } - - .truth .truth_content .truth_block, .truth .truth_content-end .truth_block { - height: auto!important; - } - - .truth .truth_block { - padding: 25px 15px 26px 15px!important; - } - - .blog_block .blog_text { - max-width: 100%!important; - font-size: 18px!important; - font-style: normal!important; - font-weight: 500!important; - line-height: 24px!important; - } - - .home { - background: var(--radial); - } - - .blogosphere__swiper .slider-arrows { - display: flex; - padding: 0 4.5px; - } - - .truth_block .truth_links { - padding-bottom: 0!important; - } - - .reviews_items .reviews_item { - padding: 32px 20px 35px 24px!important; - border-radius: 3.75rem!important; - } - - .reviews_items .reviews_item::after { - border-radius: 3.75rem!important; - } - - .blogosphere__top { - margin-bottom: -55px; - } - - .truth_block .truth_block-text { - min-height: unset!important; - } - - .discount { - margin-top: -50px; - } - - .sellers { - padding-top: 35px; - } - - .blogSlider .slider-arrows { - display: none!important; - } - - .blog_slider { - padding-bottom: 0!important; - } - - .cosmopet-x .slider-arrows .cosmopet-prev { - left: -10px; - } - - .cosmopet-x .slider-arrows .cosmopet-next { - right: -10px; - } - - .sellers { - padding-bottom: 120px!important; - } - - .discount__sale { - border-radius: 24px; - } - - .discount_form .discount_form-btn { - opacity: 1!important; - } - - .blogosphere { - padding-top: 40px; - } - - .reviews { - padding: 56px 0 62px!important; - } - - .reviews_item-top + span { - line-height: 15px; - } - - .reviews_block .reviews_items { - margin-left: 0!important; - } - - .reviews_item-name { - max-width: 70%; - } - - .reviews_item .reviews_item-top img { - width: 72px!important; - height: 72px!important; - } - - .reviews__left { - gap: 10px; - } -} - -.blogSlider .swiper-slide { - height: auto; -} - -.blogSlider .swiper-slide .blog_card { - height: 100%; -} - -.blogSlider .swiper-slide .blog_card .blog_card-info-wrap { - height: 100%; -} - -.blog_slider { - padding-bottom: 92px; -} - -.blog_card .blog_card-info { - justify-content: space-between; -} - -.blog_card-text { - flex: auto; -} - - -.carousel-item.active { - /* pointer-events: none; */ -} - -.sec-bf{ - position: relative; - z-index: 3; -} - -.copied{ - position: absolute; - top: -14px; - border-radius: 20px; - font-size: 13px; - right: -20px; - background: #fff; - padding: 5px; - opacity: 0; - pointer-events: none; - color: #000; -} - -.truth__end-btn.active .copied{ - opacity: 1; -} - -.home { - overflow: hidden; -} - - -.reviews_block { - position: relative; -} - -.reviews_items.--visible { - display: flex; - flex-wrap: wrap; - gap: 20px; -} - -.reviews_row { - flex: 1 1 100%; - display: flex; -} - -.reviews_row--left { - justify-content: flex-start; -} - -.reviews_row--right { - justify-content: flex-end; -} - -.reviews_item { - width: 50%; - /* Каждый блок занимает половину ширины */ -} - -.reviews_item-swiper { - width: 100%; -} - -.reviews_item-img { - border-radius: 50%; -} - -.reviews_item-top { - display: flex; - justify-content: space-between; - padding-bottom: 10px; -} - -.reviews_item-text { - margin-top: 10px; -} - -.reviews_item.reviews_item1 { - flex: 1 1 50%; - max-width: 50%; -} - -.reviews_item.reviews_item2, -.reviews_item.reviews_item4 { - flex: 1 1 calc(50% - 20px); - max-width: 50%; -} - -.reviews_item.reviews_item2 { - position: absolute; - max-width: 500px; - height: 360px; - right: -4%; - bottom: 25%; -} - -.reviews .reviews_person { - position: absolute; - right: -100px; - top: -20%; -} - -@media (max-width: 768px) { - .reviews_row { - justify-content: center !important; - /* На мобильных устройствах центрируем */ - } - - .reviews_item { - width: 100%; - /* На мобильных устройствах блоки на всю ширину */ - } - - .reviews_person { - position: static; - margin: 20px auto; - max-width: 150px; - } - - .reviews_item.reviews_item1 { - flex: 1 1 50%; - max-width: 100%; - } - - .reviews_item.reviews_item2, - .reviews_item.reviews_item4 { - flex: 1 1 calc(50% - 20px); - max-width: 100%; - } - - .reviews_item.reviews_item2 { - position: unset; - max-width: 500px; - height: 360px; - right: -4%; - bottom: 25%; - } - - .reviews .reviews_person { - position: absolute; - right: -100px; - top: -20%; - } - - .reviews_row { - justify-content: center !important; - display: contents; - } -} - - -.no-scroll { - overflow: hidden; -} -.img--mobile{ - display: none; -} -@media only screen and (max-width: 1170px) { - .about_block .about_cards { - grid-template-columns: 48.5% 48.5%; - gap: 30px 20px; - } - .about_cards .about_company{ - max-width: 380px; - } - - .sellers_slider .swiper { - padding-left: 0; - padding-right: 0; - } - .blog_slider .swiper { - padding-left: 30px; - padding-right: 30px; - } - - .truth_block .truth_block-title, - .truth .truth_title { - font-size: 60px; - line-height: 70px; - width: 100%; - } - .discount_top .discount_title { - font-size: 60px; - max-width: 550px; - line-height: 65px; - } - .discount_top .discount_top-imgs { - position: absolute; - top: 20px; - right: -50px; - } - .discount_top .discount_top-imgs .dicount_dog-img { - width: 400px; - } - - .reviews_block .reviews_items{ - margin-left: -30px; - } - -} -@media only screen and (min-width: 600px){ -.swiper-slide-active .sellers_card { - - transform: scale(1.05); /* Увеличение на 1.2 */ - transition: transform 0.3s ease; - background: #fff; -} -} -@media only screen and (max-width: 950px){ - .about_us .about_us-title, - .sellers_top .sellers_title, - .about_info .about_title, - .home_block .home_title { - font-size: 65px; - line-height: 78px; - } - .about .about_block { - gap: 0; - } - .about_block .about_info-wrap{ - gap: 30px; - } - .about_info .about_text { - font-size: 20px; - line-height: 24px; - } - - .about_info-wrap .about_img img { - width: 230px; - height: 560px; - } - - .blog_card .blog_card-info-wrap { - width: 108%; - } - .sellers_top .slider-arrows { - display: none; -} - .seller_block .sellers_top { - align-items: start; - flex-direction: column; - gap: 10px; - } - .sellers_card .sellers_card-img { - /* width: 100%; */ - } - .sellers_card .sellers_card-text{ - text-align: center; - } - .about_us-block .about_us-cards { - grid-template-columns: 48% 48%; - gap: 17px; - } - - .truth_block .truth_block-text p{ - max-width: 400px; - } - .truth_top .gift_img { - margin-left: -120px; - width: 400px; - } - - .reviews_block .reviews_items{ - flex-direction: column; - margin-left: 0; - gap: 0; - align-items: center; - } - .reviews .reviews_title{ - text-align: center; - } - .reviews .reviews_person{ - display: none; - } - .reviews_person-mob{ - display: flex; - order: 3; - object-fit: contain; - margin-top: -80px; - z-index: -2; - } - .reviews_items .reviews_item{ - border-radius: 25px; - padding: 10px 14px; - } - .reviews_items .reviews_item::after{ - border-radius: 25px; - } - .reviews_items .reviews_item1{ - order: 1; - } - .reviews_items .reviews_item2{ - order: 2; - transform: rotate(7deg); - padding: 13px; - margin-top: 10px; - z-index: -1; - margin-left: -4px; - } - .reviews_items .reviews_item6{ - order: 4; - transform: rotate(2deg); - margin-top: -80px; - } - .reviews_items .reviews_item3{ - order: 6; - transform: rotate(2.18deg); - margin-top: 5px; - z-index: -2; - } - .reviews_items .reviews_item4{ - order: 5; - transform: rotate(-1.7deg); - margin-top: 0px; - z-index: -1; - } - .reviews_items .reviews_item5{ - order: 7; - transform: rotate(-3.14deg); - margin-top: -3px; - z-index: -3; - } - - .reviews_item .reviews_item-top b { - font-size: 20px; - line-height: 22px; - } - .reviews_item .reviews_item-text { - font-size: 12px; - line-height: 14.4px; - max-width: 228px; - } -} - -@media only screen and (max-width: 776px){ - .home_dog - { - display: none; - } - .sellers_slider .swiper { - width: 568px; - } - .sellers_card .sellers_card-img { - height: 260px; - } - .slider-arrows { - display: none; - } - .home_block-dog{ - display: flex; - margin-top: 20px; - } - .home .container { - padding: 68px 30px 180px; - } - - .blog_block .blog_title, - .about_info .about_title{ - font-size: 44px; - line-height: 50px; - } - .about_info-wrap .about_img { - max-width: 200px; - } - .about_card .about_card-title { - font-size: 20px; - line-height: 24px; - } - .blog_block .blog_text, - .about_card .about_card-text { - font-size: 16px; - line-height: 18px; - } - .about_card .about_card-info { - gap: 2px; - } - .about_us-card .about_us-card-info h2 { - font-size: 12px; - line-height: 16px; - font-weight: 700; - } - .about_us-card .about_us-card-info span { - font-size: 12px; - line-height: 14px; - } - .about_us-block .about_us-card { - border-radius: 25px; - height: 181px; - } - .about_us-card .about_us-card-info{ - gap: 4px; - padding: 55px 20px 40px; - } - .about_us-cards .about_us-card .about_us-card-info { - height: 131px; - } - .about_us-card .card_date { - top: auto; - right: auto; - bottom: 16px; - left: 20px; - right: 0; - z-index: 2; - padding: 0; - border-radius: 0; - height: fit-content; - width: fit-content; - font-size: 12px; - line-height: 14.4px; - background: transparent; - font-weight: 700; - } - - /* start: QUIZ - max-width: 776px */ - .truth_content-end .truth_block .truth_info { - margin-top: 0px; - } - .truth .truth_top { - flex-direction: column-reverse; - } - .truth_top .gift_line-img{ - display: flex; - } - .truth .truth_title{ - max-width: 500px; - margin-left: auto; - } - .truth_top .gift_img { - transform: rotate(-45deg); - margin-right: auto; - margin-left: -50px; - } - .truth_block .truth_info { - position: relative; - width: 100%; - margin-top: 0; - align-items: center; - flex-direction: column-reverse; - } - .truth_content::after{ - border-radius: 25px; - } - .truth_block .truth_links { - flex-direction: column; - gap: 12px; - padding-bottom: 26px; - width: 100%; - } - .truth_block .truth_link { - width: 100%; - height: 50px; - align-items: center; - justify-content: start; - padding: 8px 20px; - } - - .truth .truth_block { - border-radius: 25px; - height: auto; - padding: 25px 15px 0px 15px; - } - .truth_content-end .truth_block .truth_info{ - flex-direction: column; - } - .truth_content-end .truth_block .truth_links{ - padding-top: 30px; - } - .truth_content-end .truth_block .truth_link{ - width: 100%; - } - .truth_content-end .truth_block .truth_block-text{ - flex-direction: column; - } - .truth_content-end .truth_block .truth_block-text p{ - max-width: 230px; - } - .truth_content-end .truth_xn{ - width: 90px; - height: 58px; - } - .truth_content-end .truth_info img { - width: auto !important; - height: 26vh !important; - object-fit: cover; - position: absolute; - bottom: -21vh; - left: -62px; - } - .truth_content-end .truth_block .truth_link { - width: 100%; - background: #FFF; - } - .truth_content-end .truth_block .truth_end-text{ - width: 100%; - } - - /* end: QUIZ - max-width: 776px */ - - /* start: Наш блог - max-width: 776px*/ - .blog_card .blog_card-title { - font-size: 20px; - line-height: 25.4px; - } - .blog_card .blog_card-text { - font-size: 16px; - line-height: 18.4px; - } - .blog_card .blog_card-info{ - gap: 9px; - } - .blog_slider .blog_card { - border-radius: 30px; - } - .blog_card .blog_card-info-wrap{ - width: 100%; - border-radius: 0; - padding: 12px 14px 16px 16px; - } - .blog_slider .blog_card:hover .blog_card-info-wrap{ - padding-right: 14px; - } - .blog_slider .blog_card:hover { - overflow: hidden; - } - .blog_card .card-line-img{ - display: none; - } - .blog_card .blog_card-img{ - border-radius: 30px 30px 0 0; - } - /* end: Наш блог - max-width: 776px */ - - /* start: Узнайте о нас больше и получите скидку! - max-width: 776px */ - .discount .discount_top{ - margin-bottom: 148px; - order: 1; - } - .discount_block .discount_text{ - order: 2; - margin-bottom: 20px; - } - .discount_block .discount_form{ - order: 3; - margin-bottom: 20px; - } - .discount_block .discount_form-text{ - order: 4; - margin-bottom: 0; - } - .discount_block .discount_cosmodog{ - order: 5; - } - .discount_top .discount_title { - font-size: 48px; - line-height: 52px; - } - .discount_top .discount_top-imgs { - right: -165px; - top: 100px; - } - .discount_top .discount_top-imgs img{ - width: 314px; - } - - .discount_block .discount_form{ - flex-direction: column; - gap: 8px; - width: 100%; - } - .discount_form .discount-line{ - display: none; - } - .discount_form .discount_form-btn, - .discount_form .discount_form-inp{ - width: 100%; - } - /* end: Узнайте о нас больше и получите скидку! - max-width: 776px */ - - .post-single-page .article-body-container{ - padding-bottom: 100px; - } -} - -/* GP | Mobile */ -@media only screen and (max-width: 576px) { - - /*Слайдер*/ - .about .container-fluid { - padding-right: 0; - padding-left: 0; - } - - /*Бестселлеры*/ - .sellers .sellers_card { - background: #fff; - } - .sellers_slider { - height: 530px; - } - .gp_tags { - border: 1px solid #121212; - border-radius: 48px; - padding:2px 4px 2px 4px; - font-size: 14px; - line-height: 18px; - height: 24px; - } - /* .tags_block { - width: 200px; - } */ - .sellers_slider .swiper { - display: flex; - align-items: stretch; - width: 320px; - height: inherit; - } - .seller_name { -font-size: 20px; -font-weight: 500; -line-height: 24px; -text-align: left; - } - .seller_price { - font-size: 20px; - font-weight: bold; - line-height: 30px; - text-align: left; - margin-bottom: 8px; - margin-top: 8px; - } - /* start: Scrollbar */ - body::-webkit-scrollbar { - width: .2rem; - /* background: #fff0; */ - background: linear-gradient(#0F5881, #76CE75, #ECF39F); - } - - body::-webkit-scrollbar-thumb { - border-radius: 4px; - background: rgba(128, 128, 128, 0.9); - } - /* end: Scrollbar */ - - /* start: ОБЩИЕ */ - .img--desktop { - display: none; - } - - .img--mobile { - display: block; - } - /* end: ОБЩИЕ */ - - .main_link { - font-size: 12px; - line-height: 14.4px; - width: 129px; - height: 29px; - padding: 7px; - } - - - .home .home_line2 { - display: flex; - } - - .home .home_line { - display: none; - } - - .home .home_block { - gap: 8px; - } - - .home_block .home_title { - font-size: 26px; - line-height: 34px; - width: 80vw; - } - - .about { - border-radius: 25px; - padding-bottom: 0; - } - - .about > .container { - width: 100%; - margin-right: auto; - margin-left: auto; - } - - .about .about_info-wrap{ - flex-direction: column; - } - - .about_info-wrap .about_img{ - max-width: unset; - width: 100vw; - } - .about_info-wrap .about_img img{ - height: auto; - width: 100%; - } - - .about_cards .about_card { - gap: 0; - } - - .about_cards .about_card-right { - align-items: end; - text-align: end; - } - - .about_card-right .about_card-text { - margin-left: auto; - } - - .about_card .about_card-gif1, - .about_card .about_card-gif4 { - width: 87px; - height: 87px; - } - - .about_card .about_card-gif2 { - width: 99px; - height: 99px; - } - - .about_card .about_card-gif3 { - width: 117px; - height: 102px; - } - - .about_company { - margin-top: 4vh; - } - - .about_company .about_company-logo img { - height: 33px; - } - - .about_company .about_company-logo img:nth-child(1), - .about_company .about_company-logo img:nth-child(3), - .about_company .about_company-logo img:nth-child(4) { - height: 33px; - } - - .about_company .about_company-logo { - display: flex; - gap: 0px 5px; - margin-top: 2%; - justify-content: space-around; - } - - .about_company .about_company-text { - font-size: 12px; - line-height: 14.4px; - } - - .about_cards .about_company { - padding: 15px 16px 18px 16px; - gap: 5px; - border-radius: 25px; - } - - .about_cards .about_company::after { - border-radius: 25px; - } - - .about_company .about_company-logo img { - width: auto; - } - - .about_block .about_cards { - grid-template-columns: 100%; - gap: 10px; - } - - .about_us-cards .about_us-card .about_us-card-info { - height: 151px; - } - - .truth_block .truth_block-text p, - .about_card .about_card-title { - font-size: 12px; - line-height: 18.2px; - } - - .discount_block .discount_text, - .blog_card .blog_card-text, - .blog_block .blog_text, - .truth_block .truth_link, - .sellers_card .sellers_card-text, - .about_card .about_card-text { - font-size: 12px; - line-height: 14.2px; - } - - .about_card .about_card-gif { - margin-bottom: -17px; - } - - .about_slider { - padding: 0; - } - - .about_slider .carousel { - height: 55vh; - min-height: 55vh; - } - - .about .about_block { - gap: 55px; - } - - .about_slider .slide { - padding: 10px 39px; - width: 280px; - height: 280px; - border-radius: 100%; - gap: 12px; - } - - .about_slider .carousel .carousel-item { - padding: 10px 39px; - width: 290px; - height: 290px; - border-radius: 100%; - } - - .about_slider .carousel .carousel-item::after { - background-image: url(../img/border-mobile.png); - border-radius: 100%; - } - - .about_slider .prev { - left: 10vw; - } - - .about_slider .next { - right: 10vw; - } - - .about_slider .slide.active { - transform: translate(0, -20px); - } - - .about_slider .slide img { - width: 113px; - height: 113px; - } - - .about_slider .slide_info { - gap: 6px; - } - - .about_slider .slide_text, - .about_slider .slide_title { - font-size: 12px; - line-height: 14.4px; - text-align: center; - } - - .about_us-block .about_us-card::after, - .about_us-card .about_us-card-img { - border-radius: 25px; - } - - .about_us-card .about_us-card-info { - border-radius: 0 0 25px 25px; - } - - .discount_top .discount_title, - .blog_block .blog_title, - .truth_block .truth_block-title, - .about_us .about_us-title, - .sellers_top .sellers_title { - font-size: 30px; - line-height: 36px; - } - - .sellers_card .sellers_card-img { - width: 100%; - height: 290px; - object-fit: contain; - } - - .sellers .sellers_card { - border-radius: 24px; - height: 520px; - padding:31px 16px 31px 16px; - } - .sellers .swiper-slide{ - max-height: 35vh; - } - - .section_wrap { - padding: 110px 0 52px; - } - - .sellers { - position: relative; - padding-bottom: 87px; - } - - .sellers .sellers_link { - position: absolute; - bottom: 24px; - right: 22px; - } - - .seller_block .sellers_top { - gap: 0; - margin-bottom: 15px; - } - - .reviews { - padding: 90px 0px 36px; - border-radius: 25px 25px 0 0; - } - - /* QUIZ */ - .truth { - border-radius: 0 0 25px 25px; - padding-bottom: 47px; - } - - .truth .truth_content .truth_block, - .truth .truth_content-end .truth_block - { - height: 70vh; - } - - .truth .truth_title { - font-size: 30px; - line-height: 36px; - max-width: 260px; - } - - .truth_top .gift_img { - margin-left: -24px; - width: 160px; - } - - .truth_top .gift_line-img { - bottom: 44px; - width: auto; - } - - .truth_block .truth_block-text img { - width: 29px; - } - - .truth_block .truth_block-title { - max-width: 171px; - margin-bottom: 7px; - } - - .truth_block .truth_line { - gap: 16px; - margin-bottom: 10px; - } - - .truth_block .truth_line span { - width: 34px; - } - - .truth_block .truth_link { - height: 29px; - border-width: 2px; - } - - .truth_content-end .truth_info img { - width: 100%; - } - - .truth_block .truth_info img { - height: 170px; - width: auto; - } - - .truth_links .truth_result { - display: none; - } - - .truth_block .truth_block-text { - gap: 11px; - } - - .truth .truth_block { - height: 470px; - } - - .truth_block .truth_links { - width: 100%; - margin-right: 0; - } - .truth_error .truth_block-text, - .truth_success .truth_block-text - { - margin-bottom: 25%; - } - - /* 381 string in adaptive */ - .truth_content-end .truth_info img { - /* width: auto !important; - object-fit: cover; - position: absolute; - left: -62px; */ - height: 30vh !important; - bottom: 0; - left: unset; - right: 0; - } - - /* QUIZ - конец */ - - - /* Наш блог */ - .blog { - position: relative; - padding-top: 63px; - padding-bottom: 90px; - } - - .blog .blog_link { - position: absolute; - bottom: 35px; - right: 30px; - } - - .blog_card .blog_card-img { - height: 120px; - object-fit: cover; - } - - .blog_card .blog_card-title { - font-size: 12px; - line-height: 16px; - } - - .blog_block .blog_text { - max-width: 230px; - } - - .blog_slider .swiper { - padding-left: 15px; - padding-right: 15px; - } - /* Наш блог - конец */ - - - /* Узнайте о нас больше и получите скидку! */ - .discount { - padding: 0px 0 43px; - } - - .discount_block .discount_text { - max-width: 260px; - } - - .discount_top .discount_top-imgs { - right: -136px; - top: 87px; - } - - .discount_top .discount_top-imgs .dicount_dog-img { - width: 314px; - width: 110vw; - } - - .discount_form .discount_form-inp { - height: 29px; - padding: 6px 13px; - font-size: 12px; - line-height: 14.4px; - } - - .discount_form .discount_form-inp::placeholder { - font-size: 12px; - line-height: 14.4px; - } - - .discount_form .discount_form-btn { - justify-content: start; - padding: 5px 15px; - background: var(--creme-white, #F4F1F0); - color: #62c57e; - opacity: 0.6; - } - .discount_form img{ - display: none; - } - .discount_form span{ - width: 100%; - } - - .discount_block .discount_cosmodog { - border-radius: 25px; - height: 415px; - } - - .discount_cosmodog .discount_cosmodog_info { - height: 245px; - gap: 14px; - padding: 10px 19px; - } - - .discount_cosmodog .discount_cosmodog-title { - text-align: start; - font-size: 26px; - line-height: 31.2px; - max-width: 202px; - margin-right: auto; - } - - .discount_cosmodog .discount_cosmodog-text { - font-size: 12px; - line-height: 14.4px; - max-width: 231px; - text-align: start; - margin-right: auto; - } - - .discount_top .discount_top-imgs { - right: -20%; - top: 0; - transform: scale(1.8); - z-index: 0; - margin-bottom: -91%; - margin-top: 20%; - position: relative; - } - - .discount_block .wpcf7 { - order: 3; - } - - /* Узнайте о нас больше и получите скидку! - конец */ - - /* start: Отзывы ветеринаров */ - .reviews .reviews_title { - font-size: 26px; - line-height: 31px; - max-width: 278px; - margin: 0 auto; - } - - .reviews .reviews_block { - margin-top: 20px; - } - - .reviews_block .reviews_items { - flex-wrap: unset; - gap: 10px; - } - - .reviews_items .reviews_item { - width: 80vw; - gap: 10px; - } - - .reviews_items .reviews_item2 { - margin-top: -0px; - } - - .reviews_items .reviews_item1 { - transform: rotate(-5.35deg); - } - - .reviews_items .reviews_item3 { - margin-top: 3px; - } - - .reviews_items .reviews_item4 { - margin: unset; - } - - .reviews_items .reviews_person-mob { - margin-bottom: -10%; - } - - .reviews_item .reviews_item-name { - display: flex; - flex-direction: column; - gap: 20px; - } - - .reviews_item .reviews_item-top b { - font-size: 12px; - line-height: 16px; - text-transform: uppercase; - } - - .reviews_item .reviews_item-top span { - max-width: 134px; - } - - /* end: Отзывы ветеринаров */ - - /* start: О НАС ПИШУТ СМИ*/ - .about_us-card .about_us-card-info span a { - font-size: 14px; - } - - .about_us-block .about_us-cards { - grid-template-columns: 1fr; - } - - .about_us-card .card_date { - right: 20px; - left: unset; - } - - .about_us-cards .about_us-card-info { - height: 130px; - } - - .about_us-card .about_us-card-info { - padding: 55px 20px 20px; - } - - .about_us-card-info.card-info--half-gradient { - background: linear-gradient(0deg, #F4F1F0 45%, rgba(244, 241, 240, 0) 100%); - } - - .truth_content-end .truth_block .truth_end-text, - .truth_content-end .truth_block .truth_block-text { - position: static; - } - - .truth_content-end .truth_block .truth_link { - border-width: 2px; - position: static; - bottom: 28px; - right: 0; - width: 100%; - margin-bottom: 76px; - z-index: 2; - } - - .truth_content-end .truth_info { - bottom: 0; - left: 0; - position: absolute; - } - - /* end: О НАС ПИШУТ СМИ */ - - /* start: Проверьте свои знания и получите подарок! */ - .truth_top .gift_img { - width: 64vw; - margin: unset; - transform: translateX(-22%) rotate(-45deg); - } - - .truth_top .gift_line-img { - top: 40%; - } - - .truth .truth_block { - padding: 25px; - } - - .truth_block .truth_line { - gap: 10%; - } - - .truth_block .truth_block-text { - min-height: 20%; - } - - .truth_points { - font-size: 30px; - } - - /* end: О НАС ПИШУТ СМИ */ - - - /* start: Наш блог */ - .blog_slider .blog_card { - height: 290px; - } - - .blog_card .blog_card-img { - border-color: #121212; - } - - .blog_card .blog_card-info-wrap { - border-radius: 0 0 30px 30px; - border-color: #121212; - } - - .blog_slider .blog_card:hover .blog_card-info-wrap{ - border-radius: 0 0 30px 30px; - width: 100%; - } - /* end: Наш блог */ - - - - /* start: Футер */ - .footer_form .footer_form-title h2, - .footer_box .footer_box-title { - font-size: 12px; - line-height: 16.2px; - font-weight: 700; - } - - .footer_box .footer_box-link { - font-size: 12px; - line-height: 16.2px; - } - - .footer_form .footer_form-textarea textarea, - .footer_form .footer_form-inp input { - height: 28px; - border: 1px solid var(--grey-black, #121212); - padding: 5px 18px; - font-size: 12px; - line-height: 14.4px; - opacity: .5; - } - - .footer_form .footer_block .footer_bottom a, - .footer_form .footer_form-inp input::placeholder { - font-size: 12px; - line-height: 14.4px; - } - - .footer_form .footer_form-textarea textarea { - height: 123px; - min-height: unset; - padding: 7px 18px; - border-radius: 17px !important; - } - - .footer_form .footer_form-textarea { - display: flex; - flex-direction: column; - gap: 13px; - } - - .footer_form-textarea .footer_form-btn { - position: static; - width: 100%; - min-height: unset; - } - - .footer_block .footer_social { - gap: 14px; - } - - .footer_block .footer_bottom a:nth-child(2) { - display: none; - } - - .footer_form .footer_form-inp { - flex-direction: column; - } - - .footer .footer_box{ - display: grid; - grid-template-columns: repeat(2, 1fr); - grid-template-rows: repeat(2, 1fr); - row-gap: 14px; - column-gap: 0; - } - .footer .footer_box .footer_line-mob - { - grid-area: 1 / 2 / 3 / 3; - height: 100%; - padding-top: 4px; - } - .footer .footer_box .footer_line-mob1{ - margin-left: -30%; - } - .footer .footer_box .footer_box-title{ - grid-area: 1 / 1 / 1 / 1; - } - .footer .footer_box .footer_box-link{ - grid-area: 2 / 1 / 2 / 1; - } - .footer_box .footer_line-mob{ - display: block; - } - .footer_block .footer_bottom a{ - font-size: 12px; - line-height: 18px; - } - /* end: Футер */ -} - -@media only screen and (max-width: 350px) { - .reviews_block .reviews_items { - margin-left: -20px; - } -} - -.btn--black-hover:hover { - background: #121212 !important; - color: #F4F1F0 !important; - transition: .3s -} - -.btn--black-hover { - transition: .3s -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/forms/module.template.twig b/wp-content/themes/cosmopet/modules/forms/module.template.twig deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-mobile.css deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-tablet.css deleted file mode 100644 index 0a868f5..0000000 --- a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-tablet.css +++ /dev/null @@ -1,32 +0,0 @@ -/* Стили для планшетов */ -@media only screen and (max-width: 992px) { - .header-navs { - display: none; - } - - .header-container { - height: 56px; - padding: 0; - } - - .header-bars { - display: flex; - align-items: center; - justify-content: center; - } - - .header-logo { - font-size: 16px; - line-height: 20px; - gap: 8px; - } - - .header-logo img { - width: 31px; - flex-shrink: 0; - } - - .header-lang { - display: none; - } -} diff --git a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-ultra.css b/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-ultra.css deleted file mode 100644 index c149baa..0000000 --- a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-ultra.css +++ /dev/null @@ -1,4 +0,0 @@ -/* Стили для ультрашироких экранов */ -@media only screen and (min-width: 1400px) { - -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-xl.css b/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-xl.css deleted file mode 100644 index 478ccf2..0000000 --- a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-xl.css +++ /dev/null @@ -1,11 +0,0 @@ -@media (max-width: 1200px) { - .header-navs { - gap: 12px; - } - .header-navs__link { - font-size: 14px; - } - .header-right { - gap: 4px; - } -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/header/assets/css/header.css.bak similarity index 94% rename from wp-content/themes/cosmopet/modules/header/assets/css/gp-style-desktop.css rename to wp-content/themes/cosmopet/modules/header/assets/css/header.css.bak index 02fc76c..df980fc 100644 --- a/wp-content/themes/cosmopet/modules/header/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/header/assets/css/header.css.bak @@ -763,4 +763,48 @@ width: 0px; #telegram-widget-container { text-align: center; -} \ No newline at end of file +} + +@media (max-width: 1200px) { + .header-navs { + gap: 12px; + } + .header-navs__link { + font-size: 14px; + } + .header-right { + gap: 4px; + } +} + +@media only screen and (max-width: 992px) { + .header-navs { + display: none; + } + + .header-container { + height: 56px; + padding: 0; + } + + .header-bars { + display: flex; + align-items: center; + justify-content: center; + } + + .header-logo { + font-size: 16px; + line-height: 20px; + gap: 8px; + } + + .header-logo img { + width: 31px; + flex-shrink: 0; + } + + .header-lang { + display: none; + } +} diff --git a/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-core.css b/wp-content/themes/cosmopet/modules/layout/assets/css/gp-layout-core.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-core.css rename to wp-content/themes/cosmopet/modules/layout/assets/css/gp-layout-core.css.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-full.css b/wp-content/themes/cosmopet/modules/layout/assets/css/gp-layout-full.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-full.css rename to wp-content/themes/cosmopet/modules/layout/assets/css/gp-layout-full.css.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-normalize.css b/wp-content/themes/cosmopet/modules/layout/assets/css/gp-normalize.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-normalize.css rename to wp-content/themes/cosmopet/modules/layout/assets/css/gp-normalize.css.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/css/swiper-bundle.css b/wp-content/themes/cosmopet/modules/layout/assets/css/swiper-bundle.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/css/swiper-bundle.css rename to wp-content/themes/cosmopet/modules/layout/assets/css/swiper-bundle.css.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/js/core.js b/wp-content/themes/cosmopet/modules/layout/assets/js/core.js deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/layout/assets/js/layout-core.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-mobile.css rename to wp-content/themes/cosmopet/modules/layout/assets/js/layout-core.js.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/js/gp-form.js b/wp-content/themes/cosmopet/modules/layout/assets/js/layout-form.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/js/gp-form.js rename to wp-content/themes/cosmopet/modules/layout/assets/js/layout-form.js.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/js/gp-main.js b/wp-content/themes/cosmopet/modules/layout/assets/js/layout-main.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/js/gp-main.js rename to wp-content/themes/cosmopet/modules/layout/assets/js/layout-main.js.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/js/gp-product.js b/wp-content/themes/cosmopet/modules/layout/assets/js/layout-product.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/js/gp-product.js rename to wp-content/themes/cosmopet/modules/layout/assets/js/layout-product.js.bak diff --git a/wp-content/themes/cosmopet/modules/layout/assets/js/swiper-bundle.min.js b/wp-content/themes/cosmopet/modules/layout/assets/js/swiper-bundle.min.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/layout/assets/js/swiper-bundle.min.js rename to wp-content/themes/cosmopet/modules/layout/assets/js/swiper-bundle.min.js.bak diff --git a/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-desktop.css deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-mobile.css deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-tablet.css deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/popup/assets/js/modal.js b/wp-content/themes/cosmopet/modules/popup/assets/js/modal.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/popup/assets/js/modal.js rename to wp-content/themes/cosmopet/modules/popup/assets/js/modal.js.bak diff --git a/wp-content/themes/cosmopet/modules/profile/assets/css/profile.css b/wp-content/themes/cosmopet/modules/profile/assets/css/profile.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/profile/assets/css/profile.css rename to wp-content/themes/cosmopet/modules/profile/assets/css/profile.css.bak diff --git a/wp-content/themes/cosmopet/modules/profile/assets/js/profile.js b/wp-content/themes/cosmopet/modules/profile/assets/js/profile.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/profile/assets/js/profile.js rename to wp-content/themes/cosmopet/modules/profile/assets/js/profile.js.bak diff --git a/wp-content/themes/cosmopet/modules/profile/components/profile/component-controller.php b/wp-content/themes/cosmopet/modules/profile/components/profile/component-controller.php index 5a40939..f656cdc 100644 --- a/wp-content/themes/cosmopet/modules/profile/components/profile/component-controller.php +++ b/wp-content/themes/cosmopet/modules/profile/components/profile/component-controller.php @@ -184,10 +184,10 @@ $context['months'] = [ if ($orders_pg){ -Timber::render('profile/profile-orders.twig', $context); +Timber::render('profile/profile-orders-page.twig', $context); } else{ -Timber::render('profile/profile.twig', $context); +Timber::render('profile/profile-information-page.twig', $context); } ?> diff --git a/wp-content/themes/cosmopet/modules/profile/components/subscription_single/component-controller.php b/wp-content/themes/cosmopet/modules/profile/components/subscription_single/component-controller.php index ed0fc4f..d337d7e 100644 --- a/wp-content/themes/cosmopet/modules/profile/components/subscription_single/component-controller.php +++ b/wp-content/themes/cosmopet/modules/profile/components/subscription_single/component-controller.php @@ -139,5 +139,5 @@ $context['subscription'] = $subscription_data; error_log('Subscription Data: ' . print_r($subscription_data, true)); // Render the Twig template -Timber::render('profile/profile-subs-single.twig', $context); +Timber::render('profile/profile-subs-single-page.twig', $context); ?> diff --git a/wp-content/themes/cosmopet/modules/profile/components/subscriptions/component-controller.php b/wp-content/themes/cosmopet/modules/profile/components/subscriptions/component-controller.php index b31fc70..089c22a 100644 --- a/wp-content/themes/cosmopet/modules/profile/components/subscriptions/component-controller.php +++ b/wp-content/themes/cosmopet/modules/profile/components/subscriptions/component-controller.php @@ -103,5 +103,5 @@ $context['months'] = [ __('december', 'woodmart'), ]; -Timber::render('profile/profile-subs.twig', $context); +Timber::render('profile/profile-subs-page.twig', $context); ?> diff --git a/wp-content/themes/cosmopet/modules/shop/components/cart/assets/js/cart.js b/wp-content/themes/cosmopet/modules/shop/components/cart/assets/js/cart.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/cart/assets/js/cart.js rename to wp-content/themes/cosmopet/modules/shop/components/cart/assets/js/cart.js.bak diff --git a/wp-content/themes/cosmopet/modules/shop/components/catalog/component-controller.php b/wp-content/themes/cosmopet/modules/shop/components/catalog/component-controller.php index 41ce8bf..1f37cca 100644 --- a/wp-content/themes/cosmopet/modules/shop/components/catalog/component-controller.php +++ b/wp-content/themes/cosmopet/modules/shop/components/catalog/component-controller.php @@ -117,6 +117,6 @@ $context['count'] = count(Timber::get_posts($count_args)); $context['sidebar_filters'] = Timber::get_widgets('sidebar_filters'); - Timber::render('_pages/shop/archive-product.twig', $context); + Timber::render('shop/archive-product-page.twig', $context); ?> \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/shop/components/checkout/assets/css/checkout.css b/wp-content/themes/cosmopet/modules/shop/components/checkout/assets/css/checkout.css.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/checkout/assets/css/checkout.css rename to wp-content/themes/cosmopet/modules/shop/components/checkout/assets/css/checkout.css.bak diff --git a/wp-content/themes/cosmopet/modules/shop/components/checkout/assets/js/script.js b/wp-content/themes/cosmopet/modules/shop/components/checkout/assets/js/checkout.js.bak similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/checkout/assets/js/script.js rename to wp-content/themes/cosmopet/modules/shop/components/checkout/assets/js/checkout.js.bak diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-core.css b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-core.css deleted file mode 100644 index c3fd1d3..0000000 --- a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-core.css +++ /dev/null @@ -1,1568 +0,0 @@ - -/* общие */ -button{ - cursor: pointer; -} - -.wrapper{ - margin: 0 auto; - - max-width: 1600px; -} - -/* компоненты */ - -/* lang*/ -.lang{ - position: relative; -} -.lang__open{ - padding: 12px 15px; - - width: 74px; - - background: none; - border: none; - - display: flex; - align-items: center; - - transition: opacity .2s ease-out; -} -.lang__open:hover{ - opacity: .8; -} -.lang-open p{ - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - - text-align: start; - - color: var(--text-black); -} -.lang-open__arrow{ - margin-left: 7.25px; - - display: flex; - justify-content: center; - align-items: center; -} -.lang-open__black{ - -} -.lang-open__white{ - display: none; -} -.lang__content{ - position: absolute; - top: 33px; - left: -13px; - - height: 0; - - border-radius: 6px; - - transition: height .2s ease-out; - box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); - overflow: hidden; - - background-color: var(--background-white); - - z-index: 100; -} -.lang__list{ - width: 104px; - - padding: 8px; - - list-style-type: none; -} -.lang__item{ - margin-top: 8px; -} -.lang__item:first-child{ - margin-top: 0; -} -.lang__link{ - display: block; - - width: 100%; - - padding: 4px; - - border-radius: 6px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-dark); - - text-decoration: none; - - position: relative; - - transition: background-color .2s ease-out; -} -.lang__link:hover, -.lang__item.active .lang__link{ - background-color: var(--background-grey); -} -.lang__item.active .lang__link::before{ - content: ''; - - position: absolute; - top: 10px; - right: 8px; - - width: 16px; - height: 12px; - - background-image: url(../img/svg/main/arrow-selected.svg); -} -/* lang */ - - -/* mini-profile */ -.mini-profile{ - display: flex; - align-items: center; -} -.mini-profile__item{ - margin-left: 8px; -} -.mini-profile__item:first-child{ - margin-left: 0; -} -.mini-profile__button{ - display: block; - - padding: 8px; - - display: flex; - justify-content: center; - align-items: center; - - background: none; - border: none; - - transition: opacity .2s ease-out; -} -.mini-profile__button:hover{ - opacity: .8; -} -.mini-profile__icon{ - width: 24px; - aspect-ratio: 1; -} -.mini-profile__icon.white{ - display: none; -} -/* mini-profile */ - - -/* main-menu */ -.main-menu{ - display: flex; - align-items: center; - - list-style-type: none; -} -.main-menu__item{ - margin-left: 24px; - - transition: opacity .2s ease-out; -} -.main-menu__item:first-child{ - margin-left: 0; -} -.main-menu__item:hover{ - opacity: .8; - - background: var(--background-grey); - border-radius: 24px; -} -.header.white .main-menu__item:hover .main-menu__link{ - color: var(--text-black); -} -.main-menu__item:active{ - opacity: 1; -} -.main-menu__link{ - display: block; - - padding: 8px 12px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); - - text-decoration: none; - - transition: color .2s ease-out; -} -.main-menu__button{ - padding: 8px 32px 8px 12px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); - - border: none; - border-radius: 24px; - - background: var(--gradient-turquoise); - - position: relative; -} -.main-menu__button::before{ - content: ''; - - position: absolute; - top: 14px; - right: 14px; - - width: 13px; - height: 8px; - - background-image: url(../img/svg/main/arrow-black.svg); - background-repeat: no-repeat; - background-size: contain; -} -/* main-menu */ - - -/* form */ -.form{ - width: 100%; - - padding: 24px 24px 43px; - - display: flex; - flex-direction: column; - - border-radius: 24px; - background: var(--gradient-turquoise); -} -.form__item{ - margin-top: 16px; -} -.form__title{ - font-family: var(--font-family); - font-weight: 500; - font-size: 24px; - line-height: 133%; - color: var(--text-black); -} -.form__input{ - width: 100%; - - border-radius: 20px; - padding: 12px 16px; - border: 1px solid var(--text-black); - - background: var(--background-white); - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - - color: var(--text-black); -} -.form__input::placeholder{ - color: var(--text-grey); -} -.form__input--grey{ - border-color: var(--background-9); -} -.form__input--textarea{ - height: 96px; - resize: none; -} -.form__input--textarea-72{ - height: 72px; - resize: none; - - overflow: hidden; -} -.form__input--center{ - text-align: center; -} -.form__button{ - width: 100%; - - padding: 12px 24px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-white); - - border-radius: 16px; - border: none; - background: var(--background-black); - - cursor: pointer; - - transition: background-color .2s ease-out; -} -.form__button:hover{ - opacity: .8; -} - -.label{ - padding-bottom: 4px; - - display: inline-block; - - position: relative; -} -.label::after{ - content: ''; - - position: absolute; - top: 2px; - right: -20px; - - width: 16px; - height: 16px; - - background-image: url(../img/svg/main/question.svg); - - cursor: pointer; -} -.label__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-3); -} -.label__question{ - position: absolute; - - padding: 8px; - - border-radius: 6px; - transition: height .2s ease-out; - box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); - overflow: hidden; - background-color: var(--background-white); - - opacity: 0; - transition: opacity .2s ease-out; - pointer-events: none; -} -.label:hover .label__question{ - opacity: 1; - pointer-events: auto; -} - -.label-name{ - margin-bottom: 8px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); - - display: block; -} -.form-input__error{ - margin-top: 4px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - - color: #f60909; - - display: none; - - position: relative; -} -.form-input__error--absolute{ - position: absolute; - bottom: -19.95px; - left: 0; - - width: 100%; -} -.modal-form__content.check .form__input:invalid{ - border-color: #f60909; -} -.modal-form__content.check .form__input:invalid + .form-input__error{ - display: block; -} -.modal-form__content.check .form-input-phone__input:invalid + .form-input__error{ - display: block; -} -.modal-form__content.check .form-input-phone__input:invalid + .form-input__error--absolute::before{ - content: ''; - - position: absolute; - top: -53px; - left: -1px; - - width: 100%; - height: 48px; - - border-radius: 20px; - border: 1px solid #f60909; -} -.form-input__phone{ - padding: 12px 16px 12px ; - - display: flex; - align-items: center; - - border-radius: 20px; - border: 1px solid var(--text-black); - - cursor: pointer; - - position: relative; -} -.form-input__phone.focus{ - outline: 1px solid var(--text-black); -} -.form-input-phone__icon{ - flex-shrink: 0; - - height: 16px; - width: 28px; - - background-size: 16px; - background-repeat: no-repeat; - background-position: left; - - position: relative; -} -.form-input-phone__icon::after{ - content: ''; - - position: absolute; - top: 4px; - right: 0; - - width: 8px; - aspect-ratio: 1; - - background-image: url(../img/svg/main/triangle-grey.svg); -} -.form-input-phone__code{ - flex-shrink: 0; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.form-input-phone__code::before{ - content: '+'; -} -.form-input-phone__input{ - margin-left: 6px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - border: none; - outline: none; -} -.form-input-phone__list{ - position: absolute; - top: 52px; - left: 8px; - - width: 280px; - - z-index: 10; - - transition: opacity .2s ease-out; - - opacity: 0; - pointer-events: none; - - border-radius: 20px; - - overflow: hidden; -} -.form-input-phone__list.active{ - opacity: 1; - pointer-events: auto; -} -.form-input-phone-list__search{ - width: 100%; - - padding: 12px 16px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - border-left: 1px solid var(--background-black); - border-right: 1px solid var(--background-black); - border-top: 1px solid var(--background-black); - border-radius: 20px 20px 0 0; - - background: var(--background-white); -} -.form-input-phone-list__search::placeholder{ - color: var(--text-6); -} -.form-input-phone-list__content{ - width: 100%; - max-height: 224px; - - padding: 24px 16px; - - border: 1px solid var(--background-black); - border-top: none; - border-radius: 0 0 20px 20px; - - background: var(--background-white); - - overflow-y: auto; -} -.form-input-phone-list__item{ - margin-top: 14px; - - display: flex; - align-items: center; - - background: none; - border: none; - - cursor: pointer; -} -.form-input-phone-list__item:first-child{ - margin-top: 0; -} -.form-input-phone-list-item__icon{ - width: 16px; - aspect-ratio: 1; -} -.form-input-phone-list-item__name{ - margin-left: 8px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.form-input-phone-list-item__code{ - margin-left: 8px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.form-input-phone-list-item__code::before{ - content: '+'; -} -.form-input__tabs{ - padding: 2px; - - display: flex; - - border-radius: 20px; - background: var(--gradient-turquoise); - - position: relative; -} -.form-input__tabs--white{ - padding: 3px; - border: 1px solid var(--text-3); - background: var(--white); -} -.form-input__tabs--white .form-input-tabs__button.active{ - background: var(--gradient-turquoise); -} -.form-input-tabs__button{ - width: 100%; - - padding: 10px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - text-align: center; - - border-radius: 18px; - - z-index: 2; - - transition: background-color .2s ease-out; -} -.form-input-tabs__button.active{ - background-color: var(--background-white); -} -.form-input-tabs__input{ - display: none; -} -.form-input__radio{ - padding: 16px; - - display: flex; - flex-direction: column; -} -.form-input-radio__item{ - margin-top: 14px; - - display: flex; - align-items: center; -} -.form-input-radio__item:first-child{ - margin-top: 0; -} -.form-input-radio__circle{ - padding: 2px; - - width: 20px; - aspect-ratio: 1; - - border-radius: 50%; - - background: var(--gradient-blue); - - position: relative; -} -.form-input-radio__item.active .form-input-radio__circle::before{ - content: ''; - - position: absolute; - top: 4px; - left: 4px; - - width: 12px; - aspect-ratio: 1; - - border-radius: 50%; - - background: var(--gradient-blue); -} -.form-input-radio-circle__content{ - width: 16px; - aspect-ratio: 1; - - border-radius: 50%; - - background: var(--background-white); -} -.form-input-radio__title{ - margin-left: 8px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-dark); -} -.form-input-radio__title.form-input-radio__title--no-span span{ - color: var(--text-dark); -} -.form-input-radio__price{ - margin-left: auto; - - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.form-input-radio__price::after{ - content: ' ₽'; -} -.form-input-radio__input{ - display: none; -} -.form-input__list{ - position: relative; -} -.form-input__list::before{ - content: ''; - position: absolute; - top: 21.5px; - right: 19.5px; - width: 13px; - height: 8px; - background-image: url(../img/svg/main/arrow-black.svg); - background-repeat: no-repeat; - background-size: contain; - pointer-events: none; -} -.form-input-list__input{ - width: 100%; - - border-radius: 20px; - padding: 12px 16px; - padding-right: 40px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - border: 1px solid var(--text-black); -} - -.form-input-list__input::placeholder{ - color: var(--text-grey); -} -.form-input-list__block-content{ - position: absolute; - top: 50px; - left: 0; - - width: 100%; - max-height: 192px; - height: 0; - - border-radius: 20px; - background-color: var(--background-white); - - overflow: hidden; - - transition: height .2s ease-out; - - z-index: 10; -} -.form-input-list__block-content.active{ - border: 1px solid var(--background-black); -} -.form-input-list__content{ - margin: 8px 16px; - - max-height: 176px; - - padding-right: 16px; - - overflow-y: auto; -} -.form-input-list__content::-webkit-scrollbar{ - border-radius: 8px; - width: 4px; - background: rgba(204, 204, 204, 0.2); -} -.form-input-list__content::-webkit-scrollbar-thumb{ - border-radius: 8px; - background: var(--background-9); -} -.form-input-list__content -.form-input-list__item{ - margin-top: 16px; - - width: 100%; - - display: flex; - justify-content: space-between; - align-items: center; - - border-radius: 8px; - padding: 4px; - - background: none; - border: none; -} -.form-input-list__item:first-child{ - margin-top: 0; -} -.form-input-list__item.active{ - background: rgba(204, 204, 204, 0.2); -} -.form-input-list-item__text{ - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.form-input-list-item__box{ - width: 20px; - aspect-ratio: 1; - - padding: 2px; - - border-radius: 4px; - - background: var(--gradient-blue); -} -.form-input-list-item-box__content{ - width: 16px; - aspect-ratio: 1; - - border-radius: 2px; - - background: var(--background-white); -} -.form-input-list__item.active .form-input-list-item-box__content{ - background: var(--gradient-blue); -} -.remote-control__item{ - display: none; -} -.remote-control__item.active{ - display: block; -} -/* .form-input-radio__ */ - -.form-agreement{ - display: flex; -} -.form-agreement__check{ - display: flex; - align-items: center; -} -.form-agreement__square{ - width: 18px; - aspect-ratio: 1; - - border-radius: 4px; - - border: 2px solid var(--background-black); -} -.form-agreement__label{ - margin-left: 8px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.form-agreement__input{ - display: none; -} -.form-agreement__input:checked + .form-agreement__square{ - border: none; - background: var(--gradient-blue); - - position: relative; -} -.form-agreement__input:checked + .form-agreement__square::after{ - content: ''; - - position: absolute; - top: 1px; - left: 1px; - - width: 16px; - aspect-ratio: 1; - - background-image: url(../img/svg/main/arrow-selected-white.svg); - background-repeat: no-repeat; - background-position: center; -} -/* form */ - - -/* social media */ -.social-media{ - display: flex; - align-items: center; -} -.social-media__item{ - margin-left: 32px; - - transition: opacity .2s ease-out; -} -.social-media__item:hover{ - opacity: .8; -} -.social-media__item:first-child{ - margin-left: 0px; -} -.social-media__icon{ - width: 32px; - aspect-ratio: 1; -} -/* social media */ - - -/* breadcrumbs */ -.breadcrumbs{ - margin: 24px; - - display: flex; - align-items: center; -} -.breadcrumbs__item{ - display: block; - - padding: 0px 16px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-6); - - text-decoration: none; - - position: relative; -} -.breadcrumbs__item:first-child{ - padding-left: 0; -} -.breadcrumbs__item:nth-child(n+2)::before{ - content: ''; - - position: absolute; - top: -2px; - left: -12px; - - width: 24px; - aspect-ratio: 1; - - background-image: url(../img/svg/main/arrow-breadcrumbs.svg); - background-repeat: no-repeat; - background-size: contain; -} -/* breadcrumbs */ - -/* compound */ -.compound{ - margin: -5px; - - min-height: 33.95px; - - display: flex; - align-items: start; -} -.compound__item{ - margin: 5px; - - padding: 4px 8px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 12px; - line-height: 133%; - color: var(--text-black); - - border-radius: 16px; - background-color: var(--background-white); - - display: block; - text-decoration: none; -} -.compound__item:first-child{ - margin-left: 0; -} -.product__footer{ - margin: 48px 24px 24px; - - display: flex; - justify-content: center; -} -.product__footer--error{ - margin: 45px 0; -} -/* compound */ - -/* button */ -.button{ - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - border-radius: 20px; - - cursor: pointer; -} -.button--100-perc{ - width: 100%; -} -.button--white{ - padding: 11px 24px; - - text-align: center; - - background-color: var(--background-white); - border: 1px solid var(--background-black); - - transition: opacity .2s ease-out; -} -.button--white:hover{ - opacity: .8; -} -.button--white.active{ - background: var(--background-black); - color: var(--background-white); -} -.button--gradient{ - background: var(--gradient-turquoise); - border: none; - - transition: opacity .2s ease-out; -} -.button--gradient:hover{ - opacity: .8; -} -.button--base{ - padding: 12px 24px; -} -.button--high{ - height: 56px; - - padding: 16px 24px 24px 24px; - - font-weight: 700; - text-align: center; - - position: relative; -} -.button--high-46{ - padding: 12px 24px; - - font-size: 20px; - font-weight: 700; - line-height: 24px; -} -.button--icon{ - padding-right: 56px; - - text-align: start; -} -.button--filter::after{ - content: ''; - - position: absolute; - top: 16px; - right: 24px; - - width: 24px; - aspect-ratio: 1; - - background-image: url(../img/svg/main/filter.svg); - background-repeat: no-repeat; - background-size: contain; -} -.button--black{ - padding: 7px 15px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 24px; - line-height: 133%; - color: var(--text-white); - - background: var(--background-black); - border: 1px solid var(--text-white); -} -.button--link{ - text-decoration: none; -} -.button--red-48-px{ - border-radius: 48px; -} -.to-know{ - /* width: 100%; */ - - padding: 12px 24px 7px 24px; - - display: flex; - justify-content: center; - - border: none; - - transition: opacity .2s ease-out; - text-decoration: none; -} - -.to-know--start{ - justify-content: start; - padding-left: 0; -} - -.to-know:hover{ - opacity: .8; -} -.to-know p{ - padding-bottom: 4px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - border-bottom: 1px var(--text-black) solid; - - cursor: pointer; -} -.to-know--background-none{ - background: none; -} -.back{ - margin-top: 16px; - margin-left: 16px; - - padding: 8px; - padding-left: 32px; - - background: none; - border: none; - - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - text-decoration: none; - - position: relative; -} -.back::before{ - content: ''; - - position: absolute; - top: 8px; - left: 0; - - margin-right: 8px; - - width: 24px; - height: 24px; - - background-image: url(../img/svg/main/arrow-back.svg); -} - -.back::after{ - content: ''; - - position: absolute; - bottom: 6px; - left: 0; - - width: calc(100% - 8px); - height: 1px; - - background: var(--text-black); -} -/* button */ - -/* select */ -.select{ - max-width: 144px; - - position: relative; -} -.select__state{ - width: 100%; - - padding: 11px 47px 11px 13px; - - /* pointer-events:none; */ - - border: 1px solid var(--background-black); - border-radius: 20px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - cursor: pointer; - - position: relative; - - transition: opacity .2s ease-out; -} -.select:hover .select__state{ - opacity: .8; -} -.select::after{ - content: ''; - - position: absolute; - top: 20.5px; - right: 21.5px; - - width: 17px; - height: 10px; - - background-image: url(../img/svg/main/arrow-black.svg); - background-repeat: no-repeat; - background-size: contain; - - pointer-events: none; -} -.state__block{ - position: absolute; - top: 48px; - left: 0; - - width: 100%; - - height: 0; - overflow: hidden; - - transition: height .2s ease-out; -} -.state__content{ - padding: 8px; - - border-radius: 6px; - box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); - background-color: var(--background-white); - - list-style-type: none; -} -.state__content li{ - margin-top: 8px; -} -.state__content li:first-child{ - margin-top: 0; -} -.state__button{ - width: 100%; - - padding: 4px 32px 4px 4px; - - background: none; - border: none; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-dark); - text-align: start; - - border-radius: 6px; - - transition: background-color .2s ease-out; - - position: relative; -} -.state__button:hover, -.state__button.active{ - background-color: var(--background-grey); -} - -.state__button.active::before{ - content: ''; - position: absolute; - top: 10px; - right: 8px; - width: 16px; - height: 12px; - background-image: url(../img/svg/main/arrow-selected.svg); -} - -/* select */ - -/* counter */ -.counter{ - display: flex; - align-items: center; -} -.counter__input{ - width: 48px; - - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - text-align: center; - color: var(--text-black); - - pointer-events: none; - - background: none; - border: none; -} -.counter__button{ - width: 48px; - height: 48px; - - display: flex; - justify-content: center; - align-items: center; - - border: 1px solid var(--text-3); - border-radius: 24px; - - background: var(--background-white); - - transition: opacity .2s ease-out; -} -.counter__button:hover{ - opacity: .8; -} -.counter--small{ - -} -.counter--small .counter__button{ - width: 32px; - height: 32px; -} -.counter--small{ - -} -/* counter */ - - -.subscription{ - -} -.subscription__item{ - display: flex; - - color: var(--text-black); - font-family: var(--font-family); - font-weight: 500; - line-height: 120%; -} -.subscription__item:nth-last-child(n + 2){ - border-bottom: 1px solid var(--background-9); -} -.subscription__item span{ - font-weight: 700; -} -.subscription__item span small{ - font-size: 16px; -} -.subscription__status{ - color: var(--text-black); -} -.subscription__status--close{ - color: var(--text-red); -} -.subscription__status--end{ - color: var(--text-green); -} -.subscription__add{ - width: 100%; -} -.subscription__add-header{ -} -.subscription__add-product{ - align-items: start; -} -.subscription__add-product > *:not(:first-child){ - padding-top: 14px; -} -.subscription__add-title{ - font-family: var(--font-family); - font-weight: 600; - line-height: 133%; -} -.subscription__add-content{ - -} - -.tabs__buttons{ - margin: -12px; - - display: flex; - flex-wrap: wrap; -} -.tabs__content-wrap{ - margin-top: 24px; -} -.tabs__content{ - display: none; -} -.tabs__content.active{ - display: block; -} - -.cabinet__control--column{ - flex-direction: column; -} - -.cabinet__control--column > *:not(:first-child){ - margin-top: 16px -} - -.cabinet-card-order__payment{ - -} -.cabinet-card-order__sub-title{ - font-family: var(--font-family); - font-weight: 600; - line-height: 143%; - color: var(--text-3); -} -.cabinet-card-order__date{ - font-family: var(--font-family); - font-weight: 700; - line-height: 125%; - color: var(--text-3); -} - -.cabinet-card-order-payment__price span{ - font-size: 12px; -} - - - -.wcsatt-add-to-subscription-wrapper, - form.cart .quantity, - .detail__content .in-stock, - .wcsatt-options-prompt-label-subscription, - .wcsatt-options-product-dropdown { - display: none; - } - .wcsatt-options-product-wrapper { - display: block!important; - } - form.cart .single_add_to_cart_button { - margin: 8px; - min-width: 345.89px; - height: 56px; - padding: 16px 24px 16px 24px; - font-weight: 700; - text-align: center; - position: relative; - background: var(--gradient-turquoise); - border: none; - transition: opacity .2s ease-out; - font-family: var(--font-family); - font-size: 20px; - line-height: 120%; - color: var(--text-black); - border-radius: 20px; - text-transform: none; - cursor: pointer; - } - form.cart .single_add_to_cart_button:hover { - opacity: 0.8; - } - .subscription-option-details span { - color: #000; - cursor: pointer; - } - ul.wcsatt-options-product, .wcsatt-options-product-dropdown { - margin: 0; - } - .wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input { - width: 18px; - aspect-ratio: 1; - accent-color: var(--background-black); - cursor: pointer; - } - .subscription-option label { - display: flex; - align-items: center; - gap: 5px; - } - - form.cart { - margin: 25px 0 -48px; - } - ul.wcsatt-options-product--hidden, .wcsatt-options-product-dropdown--hidden { - display: block!important; - } - .detail-block__form{ - margin-top: 48px; - - display: flex; - flex-direction: column; - } - - - .wcsatt-options-prompt-text{ - font-family: 'Craftwork Grotesk'; - font-style: normal; - font-weight: 700; - font-size: 20px; - line-height: 24px; - text-transform: uppercase; - color: #000000; -} - -.subscription-option-details, .wcsatt-options-prompt-action, .subs-text-title{ - font-size: 20px; - line-height: 24px; - display:flex; - gap: 12px; - align-items: center; -} -.subs-text{ - -max-width: 322px; -font-family: 'Craftwork Grotesk'; -font-style: normal; -font-weight: 500; -font-size: 16px; -line-height: 20px; -margin-bottom: 20px; -} -input:checked + .subscription-option-details::before, input:checked + .wcsatt-options-prompt-action::before{ - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='url(%23paint0_radial_11890_46040)' stroke-width='2'/%3E%3Ccircle cx='10' cy='10' r='6' fill='url(%23paint1_radial_11890_46040)'/%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(19 1) rotate(135) scale(25.4558 34.7538)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3CradialGradient id='paint1_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(16 4) rotate(135) scale(16.9706 23.1692)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E"); -} -.subscription-option-details::before, .wcsatt-options-prompt-action::before{ - content: ''; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='%23121212' stroke-width='2'/%3E%3C/svg%3E"); - height: 20px; width: 20px; - -} - -.wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input { - aspect-ratio: 1; - accent-color: var(--background-black); - cursor: pointer; - height: 0; - width: 0; - position: absolute; - opacity: 0; -} - -.subscription-option .amount { - color: #1A1A1A; - font-weight: 600; -} - -.subscription-option del .amount { - color: #bbb; - font-weight: 400; - font-size: .8em; - -} - -.subscription-option del .woocommerce-Price-amount.amount, .subscription-option del .woocommerce-Price-currencySymbol{ - text-decoration: line-through !important; -} - -.woocommerce-Price-amount.amount{ - font-size: 1.15em; -} - -.detail #wc-stripe-express-checkout-element{ - display: none !important; -} - -.detail-block-form__item--radio{ - display: flex; - gap: 10px; -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-desktop.css deleted file mode 100644 index 8900568..0000000 --- a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-desktop.css +++ /dev/null @@ -1,2031 +0,0 @@ -/* Основные стили для компьютера */ - -/* header start */ - -.header{ - position: relative; - - background-color: var(--background-white); - - position: fixed; - left: 0; - top: 0; - right: 0; - - z-index: 200; -} - -.detail .product__main{ - width: 100%; -} - -.header__content::after{ - content: ''; - - position: absolute; - left: auto; - right: auto; - bottom: 0; - - width: calc(100% - 48px); - max-width: 1552px; - height: 1px; - - background: var(--text-3); -} - -.detail-block-form__items{ - margin: 25px 0 0; -} - -.header__content{ - height: 72px; - - padding: 14px 24px; - - display: flex; - justify-content: space-between; - align-items: center; -} - -.header__open-menu{ - display: none; - - width: 24px; - aspect-ratio: 1; - - position: relative; - - border: none; - background: none; -} -.header__open-menu::before{ - content: ''; - - position: absolute; - top: 8px; - left: 4px; - - width: 16px; - height: 2px; - - background: var(--background-black); - border-radius: 1px; - -} -.header__open-menu::after{ - content: ''; - - position: absolute; - left: 4px; - bottom: 8px; - - width: 16px; - height: 2px; - - background: var(--background-black); - border-radius: 1px; -} - -.header__logo{ - width: 182px; - height: 40px; -} -.header__logo-black, -.header__logo-white{ - width: 100%; - height: 100%; -} -.header__logo-white{ - display: none; -} - -.header__menu-block{ - position: absolute; - top: 72px; - left: 0; - - width: 100%; - height: 0; - - overflow: hidden; - transition: height .2s ease-out; - - background-color: var(--background-white); - - z-index: 100; -} - -.header__pc-menu{ - padding: 40px 46px; - - display: flex; - justify-content: center; - - position: relative; -} -.header__pc-menu::before{ - content: ''; - - position: absolute; - top: 0; - left: 46px; - - width: 330px; - height: 248px; - - background-image: url(../img/pet/cat.png); - background-repeat: no-repeat; -} -.header__pc-menu::after{ - content: ''; - - position: absolute; - top: 0; - right: 46px; - - width: 330px; - height: 248px; - - background-image: url(../img/pet/dog.png); - background-repeat: no-repeat; -} -.header-pc-menu__content{ - width: 600px; - - display: flex; - justify-content: space-between; -} -.header-pc-menu__item{ - -} -.header-pc-menu__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 26px; - line-height: 123%; - text-transform: uppercase; - color: var(--text-black); - - text-decoration: none; -} -.header-pc-menu__list{ - margin-top: 16px; - - list-style-type: none; -} -.header-pc-menu__list-li{ - margin-top: 25px; -} -.header-pc-menu__list-li:first-child{ - margin-top: 0; -} -.header-pc-menu__list-li a{ - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - color: var(--text-0); - - text-decoration: none; -} -.header__phone-menu{ - display: none; - - padding: 24px 16px; - - height: calc(100vh - 56px); - - overflow-x: auto; -} -.header-phone-menu__item{ - padding: 16px 0; - - border-top: 1px solid #f4f1f0; - border-bottom: 1px solid #f4f1f0; - - display: flex; - flex-direction: column; -} -.header-phone-menu__item:first-child{ - border-top: 0; -} -.header-phone-menu__item:last-child{ - border-bottom: 0; -} -.header-phone-menu__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - text-decoration: none; -} -.header-phone-menu__title--gradient{ - background: var(--gradient-blue); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} -.header-phone-menu__category{ - margin-top: 16px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 18px; - line-height: 133%; - color: var(--text-black); - - text-decoration: none; -} -.header-phone-menu__list{ - margin-top: 24px; - - padding-left: 32px; - - list-style-type: none; -} -.header-phone-menu__list-item{ - margin-top: 16px; -} -.header-phone-menu__list-item:first-child{ - margin-top: 0; -} -.header-phone-menu__list-item a{ - font-family: var(--font-family); - font-weight: 500; - font-size: 16px; - line-height: 125%; - color: var(--text-black); - - text-decoration: none; -} -.header.white{ - background: none; -} -.header.white .header__logo-black{ - display: none; -} -.header.white .header__logo-white{ - display: block; -} -.header.white .main-menu__link{ - color: var(--text-white); -} -.header.white .main-menu__button{ - background: var(--background-white); -} -.header.white .lang__open{ - color: var(--text-white); -} -.header.white .header__content::after{ - background: var(--background-white); -} -.header.white .lang-open__black{ - display: none; -} -.header.white .lang-open__white{ - display: block; -} -.header.white .mini-profile__icon.white{ - display: block; -} -.header.white .mini-profile__icon.black{ - display: none; -} -.header.white .header__open-menu::before, -.header.white .header__open-menu::after{ - background: var(--background-white); -} -.header__phone-menu::-webkit-scrollbar { - width: 0px; -} - -main{ - padding-top: 72px; -} -/* header end */ - -/* product */ -.product{ - padding: 24px; - } - .product__header{ - display: flex; - justify-content: space-between; - align-items: center; - } - .product__tag{ - margin: 36px -12px -12px -12px; - - display: flex; - align-items: center; - flex-wrap: wrap; - } - .product-tag__item{ - margin: 12px; - - padding: 1px; - - border-radius: 16px; - - background: var(--gradient-blue); - border: none; - } - .product-tag-item__content{ - padding: 3px 11px; - - background: var(--background-white); - - border-radius: 15px; - - display: flex; - align-items: center; - } - .product-tag-item__text{ - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - background: var(--gradient-blue); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - } - .product-tag-item__button{ - margin: 2px 0 2px 4px; - - width: 20px; - aspect-ratio: 1; - - background: none; - border: none; - - background-image: url(../img/svg/main/gradient-x.svg); - background-repeat: no-repeat; - background-position: center; - } - .product__error{ - margin: auto; - - padding: 0 16px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 24px; - line-height: 100%; - text-transform: uppercase; - color: var(--text-0); - text-align: center; - } - .product__error-button{ - border-radius: 20px; - padding: 4px 24px; - - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - border: 1px solid var(--text-0); - background: var(--background-white); - text-decoration: none; - } - .product__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 36px; - line-height: 111%; - text-transform: uppercase; - text-align: center; - color: var(--text-black); - } - .product__main{ - margin: 36px -12px -12px; - - /* width: 100%; */ - - display: flex; - align-items: stretch; - flex-wrap: wrap; - } - .product__item{ - margin: 12px; - - width: calc(25% - 24px); - - display: flex; - flex-direction: column; - justify-content: space-between; - - background-color: var(--background-grey); - border-radius: 24px; - - overflow: hidden; - - position: relative; - } - .product__item::before{ - content: ''; - - position: absolute; - top: 0; - left: 0; - - width: calc(100% - 2px); - height: calc(100% - 2px); - - border: 1px solid #000; - border-radius: 24px; - - pointer-events: none; - transition: opacity .2s ease-out; - - opacity: 0; - } - .product__item:hover::before{ - opacity: 1; - } - .product__item.active::before{ - opacity: 0; - } - .product-item__block-label{ - position: absolute; - top: 16px; - left: 16px; - } - .product-item__label{ - position: absolute; - top: 16px; - left: 16px; - - margin: -2px; - - display: flex; - align-items: center; - - z-index: 10; - } - .product-item-label__tag{ - margin: 2px; - - padding: 4px 8px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 12px; - line-height: 133%; - color: #f4f1f0; - - border-radius: 16px; - display: block; - - text-decoration: none; - } - .product-item-label__tag--new{ - background: var(--gradient-blue); - } - .product-item-label__tag--new-green{ - background: #d9ffcc; - color: #4e7623; - } - .product-item-label__tag--sale{ - background: var(--gradient-red); - } - .product-item-label__tag--sale-red{ - color: #fa0505; - background: #ffe5e5; - } - .product-item-label__tag--black{ - background: var(--background-black); - color: var(--text-white); - } - .product-item-label__tag--title{ - padding: 4px 2px; - - font-size: 16px; - line-height: 125%; - color: var(--text-black); - - display: flex; - align-items: center; - } - .product-item__product-card{ - height: 274px; - - display: flex; - justify-content: center; - align-items: center; - } - .product-item__images{ - height: 242px; - object-fit: contain; - } - .product-item__content-card{ - padding: 15.5px; - } - .product-item__title{ - margin-top: 8px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - text-decoration: none; - display: block; - } - .product-item__title:first-child{ - margin-top: 0; - } - .product-item__price{ - margin-top: 8px; - - display: flex; - align-items: center; - } - .product-item__price p{ - font-family: var(--font-family); - font-weight: 700; - font-size: 20px; - line-height: 200%; - text-transform: uppercase; - color: var(--text-black); - } - .product-item__price p::after{ - - padding-left: 5px; - } - .product-item__price span{ - margin-left: 9px; - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-red); - } - .product-item__price del{ - margin-left: 24px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 18px; - line-height: 133%; - text-transform: uppercase; - text-decoration: line-through; - color: var(--text-6); - } - .product-item__price del::after{ - - } - .product-item__price span::before{ - content: '-'; - } - .product-item__price span::after{ - content: '%'; - } - .product-item__bye{ - margin-top: 8px; - } - .product__item.hiding .product-item__images{ - filter: grayscale(1) - } - .product__item.hiding .product-item__price{ - color: var(--text-grey); - } - .product-item__overlay{ - position: absolute; - top: 100%; - left: 0; - - width: 100%; - height: 100%; - - padding: 24px; - - display: flex; - flex-direction: column; - justify-content: space-between; - - border-radius: 24px; - backdrop-filter: blur(25px); - background-color: rgba(242, 242, 242, 0.8); - - z-index: 10; - - transition: top .4s ease-out; - } - .product-item__overlay.active{ - top: 0; - } - .product-item-overlay__header{} - .product-item-overlay__tags{ - margin: 4px -6px -6px -6px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-3); - - display: flex; - flex-wrap: wrap; - - list-style-type: none; - } - .product-item-overlay__tags li{ - margin: 4px 6px; - - position: relative; - } - .product-item-overlay__tags li:nth-child(n+1)::after{ - content: ''; - - position: absolute; - top: 6px; - right: -8px; - - width: 4px; - aspect-ratio: 1; - - background-color: var(--text-3); - border-radius: 50%; - } - .product-item-overlay__tags li:last-child::after, - .product-item-overlay__tags li:last-child::before{ - display: none; - } - .product-item-overlay__price{ - margin-top: 32px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 24px; - line-height: 100%; - text-transform: uppercase; - text-align: right; - color: var(--text-black); - } - .product-item-overlay__price::after{ - - } - .product-item-overlay__block-button{ - margin-top: 32px; - } - .product-item-overlay__button{ - margin-top: 16px; - } - .product-item-overlay__button:first-child{ - margin-top: 0; - } - .product-item-overlay__input-block{ - - } - .product-item-overlay__field{ - margin-top: 24px; - - display: flex; - justify-content: space-between; - align-items: center; - } - .product-item-overlay__field:first-child{ - margin-top: 0; - } - .product-item-overlay-field__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-0); - } - .product-item__form{ - - } -/* product */ - -/* modal */ -/* .modal__button .to-know{ - display: none; -} */ -/* modal */ - -/* footer */ -.footer{ - margin-top: 80px; - - padding: 40px 24px; - - background: var(--background-black); -} -.footer__wrapper{ - width: 100%; - - display: flex; -} -.footer__content{ - width: calc(100% - 364px); -} -.footer__logo{ - width: 187px; - height: 43px; -} -.footer__address{ - margin-top: 24px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 24px; - line-height: 133%; - color: var(--text-white); - font-style: normal; -} -.footer__list{ - margin: 28px -12px -12px -12px; - - display: flex; - justify-content: space-between; - flex-wrap: wrap; -} -.footer-list__item{ - margin: 12px; - - width: calc(50% - 24px); - - display: flex; - flex-direction: column; -} -.footer-list__item:nth-child(even){ - width: 322px; -} -.footer-list__item .button{ - border-radius: 24px; -} -.footer-list__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-white); -} -.footer-list__link{ - margin-top: 4px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 24px; - line-height: 133%; - color: var(--text-white); - - text-decoration: none; -} -.footer__form{ - margin-left: 48px; - - width: 364px; -} -.footer__about{ - margin-top: 16px; - - padding-top: 15px; - - display: flex; - justify-content: space-between; - align-items: center; - - border-top: 1px solid var(--text-white); -} -.footer-about__text{ - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - text-align: right; - color: var(--text-white); - opacity: 0.6; - - text-decoration: none; -} -.footer__social-media{ - display: none; -} -/* footer */ - -/* detail */ -.detail{ - margin: 48px 24px 24px 24px; - - display: flex; - align-items: start; - flex-wrap: wrap; -} -.detail__images{ - margin: -12px; - - width: calc(50% - 24px); - - display: flex; - flex-wrap: wrap; -} -.detail__image{ - margin: 12px; - - border-radius: 24px; - - display: flex; - align-items: center; - justify-content: center; - - background: var(--background-grey); - cursor: pointer; -} -.detail__image--width-perc-100{ - width: calc(100% - 24px); - height: 600px; - -} -.detail__image--width-perc-50{ - width: calc(50% - 24px); - height: 288px; -} -.detail__image--width-perc-100 img{ - width: 90%; - height: 90%; - - object-fit: contain; -} -.detail__image--width-perc-50 img{ - width: 100%; - height: 100%; - - object-fit: contain; -} -.detail__content{ - margin-left: 48px; - - width: calc(50% - 24px); -} -.detail__label{ - margin: -2px; - display: flex; - align-items: center; -} -.detail__label-wrap { - display: flex; - flex-wrap: wrap; - gap: 5px; - align-items: center; -} -.detail__label .product-item-label__tag:last-child{ - margin-left: auto; -} -.detail__label .product-item-label__tag:first-child{ - margin-left: 0; -} -.detail__title{ - margin-top: 8px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 36px; - line-height: 111%; - text-transform: uppercase; - color: var(--text-black); -} -.detail__block-price{ - margin-top: 24px; - - display: flex; - align-items: center; -} -.detail-block-price__price{ - font-family: var(--font-family); - font-weight: 700; - font-size: 36px; - line-height: 111%; - text-transform: uppercase; -} -.detail-block-price__price::after{ - -} -.detail-block-price__sale{ - margin-left: 22px; - - display: flex; - align-items: center; -} -.detail-block-price-sale__text{ - font-family: var(--font-family); - font-weight: 700; - font-size: 20px; - line-height: 120%; - text-transform: uppercase; - text-decoration: line-through; - color: var(--text-6); -} -.detail-block-price-sale__text::after{ - -} -.detail-block-price-sale__perc{ - margin-left: 9px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-red); -} -.detail-block-price-sale__perc::before{ - content: '-'; -} -.detail-block-price-sale__perc::after{ - content: '%'; -} -.detail-block__form{ - margin-top: 48px; - - display: flex; - flex-direction: column; -} -.detail-block-form__item{ - margin-top: 24px; - - min-width: 345.89px; - - display: flex; - align-items: center; - flex-wrap: wrap; -} -.detail-block-form__item--radio{ - margin: 16px -8px -8px -8px; -} -.detail-block-form__item:first-child{ - margin-top: 0; -} -.detail-block-form__item button{ - margin: 8px; -} -.detail-block-form__submit{ - min-width: 345.89px; -} -.detail__warning{ - padding: 3px; - - border-radius: 24px; - - background: var(--gradient-turquoise); -} -.detail-warning__content{ - padding: 26px; - - border-radius: 22px; - - background: var(--background-white); -} -.detail-warning__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 24px; - line-height: 100%; - text-transform: uppercase; - color: var(--text-black); -} -.detail-warning__text{ - margin-top: 16px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.detail__toggle{ - margin-top: 48px; - margin-bottom: 48px; -} -.detail__wrapper-catalot{ - margin-top: 64px; - - width: calc(100% + 16px); - - overflow: hidden; - - position: relative; -} -.detail__catalot{ - -} -.detail-catalot__header{ - padding-right: 16px; - - display: flex; - justify-content: space-between; - align-items: center; -} -.detail-catalot__control{ - display: flex; - align-items: center; -} -.detail-catalot-control__button{ - margin-left: 24px; - - width: 48px; - aspect-ratio: 1; - - border-radius: 50%; - border: 1px solid var(--background-black); - background: none; - - display: flex; - justify-content: center; - align-items: center; -} -.detail-catalot__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 24px; - line-height: 100%; - text-transform: uppercase; - text-align: start; - color: var(--text-0); -} -.detail-catalot__content{ - margin: 12px -12px -12px -12px; - - width: 100%; - - display: flex; -} -.detail__catalot .product__item{ - width: calc(100% - 24px); -} -.detail__images-phone{ - display: none; -} -.back-detail{ - display: none; -} -.toggle__table{ - margin-top: 32px; - - display: flex; - flex-wrap: wrap; -} -.toggle__table:first-child{ - margin-top: 0; -} -.toggle__table--three .toggle-table__block:nth-child(1){ - width: 33%; -} -.toggle__table--three .toggle-table__block:nth-child(2){ - width: 33%; -} -.toggle__table--three .toggle-table__block:nth-child(3){ - width: 33%; -} -.toggle__table--two .toggle-table__block{ - width: calc(50% - 20px); -} -.toggle__table--two .toggle-table__block:nth-child(even){ - margin-left: 40px; -} -.toggle-table__block{ - -} -.toggle-table__item{ - margin-top: 8px; - - width: 100%; - - display: flex; - justify-content: space-between; -} -.toggle-table__item p{ - display: block; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - flex-shrink: 0; -} -.toggle-table__item .warning{ - width: 100%; -} -.toggle-table__item .warning p{ - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - text-align: center; -} -.toggle-table__title{ - margin-bottom: 16px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); -} -.toggle-table__title--center{ - text-align: center; -} -.toggle-table-item__line{ - margin: 23px 8px 0 8px; - - width: 100%; - - height: 1px; - background: linear-gradient(to right, transparent 50%, #fff 50%), linear-gradient(to right, #333, #333); - background-size: 4px 2px, 100% 2px; - - opacity: .6; -} - - -/* End | Toggle */ - - -.radio-button{ -} -.radio-button__input{ - display: none; -} - - - - -/* detail */ - -/* gallery */ -.gallery{ - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - - padding: 24px; - - display: flex; - align-items: center; - - background: var(--background-white); - - pointer-events: none; - opacity: 0; - transition: opacity .2s ease-out; - - z-index: 300; -} -.gallery.active{ - opacity: 1; - pointer-events: auto; -} -.gallery__close{ - position: absolute; - top: 24px; - right: 24px; - - z-index: 10; -} -.gallery__pagination{ - margin: -12px; -} -.gallery-pagination__item{ - margin: 12px; - - width: 134px; - height: 136px; - - display: flex; - justify-content: center; - align-items: center; - - border: none; - border-radius: 16px; - background: var(--background-grey); -} -.gallery-pagination__item img{ - width: 90%; - max-height: 90%; - - object-fit: contain; -} -.gallery__slider{ - margin-left: 48px; - - padding: 100px; -} -.gallery__slider{ - width: 100%; -} -.gallery__slider .swiper-pagination{ - display: none; -} -.gallery__slider .swiper-button-next::after, -.gallery__slider .swiper-button-prev::after{ - display: none; -} -.gallery-button{ - width: 48px; - height: 48px; - - display: flex; - justify-content: center; - align-items: center; - - border: 1px solid var(--background-black); - border-radius: 20px; - - background: none; -} -.gallery__slider .swiper-slide{ - display: flex; - justify-content: center; - align-items: center; -} -.gallery__block{ - width: 600px; - height: 774px; - - display: flex; - justify-content: center; - align-items: center; - - background: var(--background-grey); - border-radius: 24px; -} -.gallery__block img{ - width: 90%; - max-height: 90%; - - object-fit: contain; -} -.gallery__wrapper{ - margin: 0 auto; - max-width: 1600px; - - display: flex; - align-items: center; -} -/* .swiper { - width: 600px; - height: 300px; -} */ - -/* gallery */ - - -/* cabinet */ -.cabinet{ - padding: 24px; - - display: flex; - justify-content: space-between; -} -.cabinet__control{ - margin: 24px; - margin-bottom: 0; - - display: none; -} -.cabinet-control__button{ - margin-left: 8px; - - padding: 12px 16px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - background: var(--background-white); - border: 2px solid var(--text-black); - border-radius: 48px; - - transition: opacity .2s ease-out; -} -.cabinet-control__button:first-child{ - margin-left: 0; -} -.cabinet-control__button.active{ - background: var(--background-black); - color: var(--text-white); -} -.cabinet-control__button:hover{ - opacity: .8; -} -.cabinet__orders{ - width: calc(((100% - 48px) / 3) * 2); -} -.cabinet__profile{ - width: calc((100% - 48px) / 3); -} - -.cabinet-card{ - margin-top: 32px; - - padding: 1px; - - border-radius: 20px; -} -.cabinet-card:first-child{ - margin-top: 0; -} -.cabinet-card--green{ - background: var(--background-green); -} -.cabinet-card--green-white{ - background: var(--background-green-white); -} -.cabinet-card--green-white .cabinet-card__content{ - background: none; -} -.cabinet-card--red-blue{ - background: var(--gradient-red); -} -.cabinet-card--grey{ - background: var(--background-9); -} -.cabinet-card__content{ - padding: 23px; - - border-radius: 19px; - - background-color: var(--background-white); -} -.cabinet-card__element{ - margin-top: 24px; - - position: relative; -} -.cabinet-card__element--margin-top-32{ - margin-top: 32px; -} -.cabinet-card__element:first-child, -.cabinet-card__element--margin-top-32:first-child{ - margin-top: 0 -} -.cabinet-card__element-change{ - position: absolute; - top: 14px; - right: 0; - - width: 24px; - aspect-ratio: 1; - - background-image: url(../img/svg/main/change-dot.svg); - border: none; - background-color: var(--background-white); - - transition: opacity .2s ease-out; -} -.cabinet-card__element-change:hover{ - opacity: .8; -} -.cabinet-card__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 26px; - line-height: 123%; - text-transform: uppercase; - background: var(--gradient-blue); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} -.cabinet-card__text{ - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - - color: var(--text-black); -} -.cabinet-card__text--grey{ - color: var(--text-grey); -} -.cabinet-card__label{ - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - - color: var(--text-3); -} -.cabinet-card__status{ - padding-left: 20px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - - position: relative; -} -.cabinet-card__status--chek{ - color: var(--text-green); -} -.cabinet-card__status--chek::before{ - content: ''; - - position: absolute; - top: 0; - left: 0; - - width: 16px; - height: 16px; - - background-image: url(../img/svg/main/status-chek.svg); - object-fit: contain; -} -.cabinet-card__status--cancelled{ - color: var(--text-red); -} -.cabinet-card__status--cancelled::before{ - content: ''; - - position: absolute; - top: 0; - left: 0; - - width: 16px; - height: 16px; - - background-image: url(../img/svg/main/status-cancelled.svg); - object-fit: contain; -} -.cabinet-card__block-accounts{ - display: flex; -} -.cabinet-card__account{ - margin-left: 16px; - - width: 40px; - aspect-ratio: 1; - - display: flex; - justify-content: center; - align-items: center; - - background: var(--background-9); - border-radius: 50%; -} -.cabinet-card__account:first-child{ - margin-left: 0; -} -.cabinet-card__block-buttons{ - display: flex; - justify-content: space-between; - align-items: center; -} -.cabinet-card__button{ - padding: 8px 8px 6px 0; - - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - background: none; - border: none; - - position: relative; - - text-decoration: none; -} -.cabinet-card__button::before{ - content: ''; - - position: absolute; - bottom: 6px; - - width: calc(100% - 8px); - height: 1px; - - background: var(--text-black); - - transition: opacity .2s ease-out; -} -.cabinet-card__button:hover{ - opacity: .8; -} -.cabinet-card__confirm{ - margin-top: 16px; - - border-radius: 20px; - padding: 4px 24px; - - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - - - background: var(--background-black); - color: var(--text-white); - border: none; - - transition: opacity .2s ease-out; -} -.cabinet-card__confirm:hover{ - opacity: .8; -} -.cabinet-card__text, .cabinet-card__label, .cabinet-card__status, .cabinet-card__block-accounts, .cabinet-card__block-buttons{ - margin-top: 8px; -} -.cabinet-card__text:first-child, .cabinet-card__label:first-child, .cabinet-card__status:first-child, .cabinet-card__block-accounts:first-child, .cabinet-card__block-buttons:first-child{ - margin-top: 0px; -} -.cabinet-card__block-add-pets{ - width: 100%; - - display: flex; - align-items: center; - - background: none; - border: none; -} -.cabinet-card-add-pets__circle{ - width: 48px; - aspect-ratio: 1; - - display: flex; - justify-content: center; - align-items: center; - - border: 1px solid var(--text-6); - border-radius: 50%; -} -.cabinet-card-add-pets__text{ - margin-left: 16px; - - font-family: var(--font-family); - font-weight: 600; - font-size: 20px; - line-height: 120%; - - color: var(--text-6); - - position: relative; -} -.cabinet-card-add-pets__text::after{ - content: ''; - - position: absolute; - left: 0; - bottom: -4px; - - width: 100%; - height: 1px; - - background: var(--text-6); -} -.cabinet-card__discount{ - display: flex; - align-items: center; -} -.cabinet-card-discount__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); -} -.cabinet-card-discount__percent{ - margin-left: 16px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); -} -.cabinet-card-discount__percent::after{ - content: '%'; -} -.cabinet-card-discount__arrow{ - display: inline-block; - - margin-left: 6px; - - width: 20px; - aspect-ratio: 1; - - background-image: url(../img/svg/main/arrow-breadcrumbs-black.svg); - background-position: center; -} -.cabinet-card__no-orders{ - margin-top: 32px; - - padding: 48px 24px; -} -.cabinet-card-no-orders__element{ - margin-top: 26px; -} -.cabinet-card-no-orders__element:first-child{ - margin-top: 0; -} -.cabinet-card-no-orders__title{ - font-family: var(--font-family); - font-weight: 500; - font-size: 24px; - line-height: 133%; - text-align: center; - color: var(--text-black); -} -.cabinet-card__pet{ - display: flex; - align-items: center; -} -.cabinet-card-pet__icon{ - width: 48px; - aspect-ratio: 1; - - border-radius: 50%; - background: var(--gradient-blue); -} -.cabinet-card-pet-icon__content{ - margin: 1px; - - width: calc(100% - 2px); - aspect-ratio: 1; - - display: flex; - justify-content: center; - align-items: center; - - border-radius: 50%; - background: var(--background-white); -} -.cabinet-card-pet-icon__content img{ - width: 32px; - aspect-ratio: 1; - - object-fit: contain; -} -.cabinet-card-pet__name{ - margin-left: 24px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); -} -.cabinet-card__order{ - position: relative; -} -.cabinet-card-order__header{ - display: flex; - justify-content: space-between; - align-items: flex-start; -} -.cabinet-card-order__main{} -.cabinet-card-order-main__date{ - font-family: var(--font-family); - font-weight: 500; - font-size: 24px; - line-height: 133%; - color: var(--text-black); -} -.cabinet-card-order-main__number{ - margin-top: 8px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-black); -} -.cabinet-card-order-main__number::before{ - content: '№'; -} -.cabinet-card-order__payment{ - display: flex; - align-items: flex-end; - - transition: margin .2s ease-out; -} -.cabinet-card-order-payment__title{ - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-black); -} -.cabinet-card-order-payment__price{ - margin-left: 8px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 16px; - line-height: 125%; - color: var(--text-black); -} -.cabinet-card-order-payment__price::after{ - margin-left: 5px; - -} -.cabinet-card-order-payment__price--add::after{ - display: none; -} -.cabinet-card-order__content{ - margin-top: 24px; -} -.cabinet-card-order__content -.cabinet-card-order__status{ - display: flex; - align-items: center; -} -.cabinet-card-order-status__title{ - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.cabinet-card-order-status__pointer{ - margin-left: 12px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.cabinet-card-order-status__pointer--grey{ - color: var(--text-6); -} -.cabinet-card-order-status__pointer--green{ - color: var(--text-green); -} -.cabinet-card-order-status__pointer--red{ - color: var(--text-red); -} -.cabinet-card-order__block-detail{ - height: 0; - overflow: hidden; - - transition: height .2s ease-out; -} -.cabinet-card-order__detail{ - padding-top: 24px; -} -.cabinet-card-order-detail__address{} -.cabinet-card-order-detail-address__title{ - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.cabinet-card-order-detail-address__text{ - margin-top: 16px; - - font-family: var(--font-family); - font-weight: 400; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.cabinet-card-order-detail__main{ - margin-top: 24px; - - display: flex; - justify-content: space-between; -} -.cabinet-card-order-detail-main__products{} -.cabinet-card-order-detail-main__product{ - margin-top: 4px; - - display: flex; - align-items: center; -} -.cabinet-card-order-detail-main__product:first-child{ - margin-top: 0; -} -.cabinet-card-order-detail-main-product__img{ - width: 106px; - height: 96px; -} -.cabinet-card-order-detail-main-product__content{ - display: flex; -} -.cabinet-card-order-detail-main-product__description{ - width: 212px; -} -.cabinet-card-order-detail-main-product-description__what{ - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-black); -} -.cabinet-card-order-detail-main-product-description__with-what{ - margin-top: 8px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-6); -} -.cabinet-card-order-detail-main-product__count{ - margin-left: 8px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 12px; - line-height: 133%; - text-align: right; - color: var(--text-6); -} -.cabinet-card-order-detail-main-product__count::before{ - margin-right: 4px; - - content: 'x'; -} -.cabinet-card-order-detail-main-product__price{ - margin-left: 16px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 12px; - line-height: 133%; - text-align: right; - color: var(--text-black); -} -.cabinet-card-order-detail-main-product__price::after{ - content: ' Р'; -} -.cabinet-card-order-detail-main__links{ - display: flex; - flex-direction: column; -} -.cabinet-card-order-detail-main__link{ - margin-top: 16px; -} -.cabinet-card-order-detail-main__link:first-child{ - margin-top: 0; -} -.cabinet-card-order__open-detail{ - margin-top: 24px; - - padding-right: 24px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - color: var(--text-black); - - border: none; - background: none; - - position: relative; -} -.cabinet-card-order__open-detail::after{ - content: ''; - - position: absolute; - top: 6.75px; - right: 0; - - width: 12.5px; - height: 10.5px; - - background-image: url(../img/svg/main/arrow-black.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - - transition: transform .2s; - /* transform: rotate(180deg); */ -} -.cabinet-card-order__detail-short{ - position: absolute; - right: 0; - bottom: 0; - - display: flex; - align-items: center; - - transition: opacity .2s .1s ease-out; -} -.cabinet-card-order-detail-short__item{ - border-radius: 16px; - width: 106px; - height: 96px; -} -.cabinet-card__download{ - margin-top: 32px; -} -.cabinet-card__order.active .cabinet-card-order__detail-short{ - opacity: 0; -} -.cabinet-card__order.active .cabinet-card-order__open-detail::after{ - transform: rotate(180deg); -} -.cabinet-card-order__payment-add{ - display: flex; - flex-direction: column; - align-items: start; -} -.cabinet-card-order__sub-title{ - font-size: 14px; -} -.cabinet-card-order__date{ - font-size: 16px; -} -/* .cabinet-card-no-orders__ */ -.cabinet__subscription-pc{ -} -.cabinet__subscription-mobile{ - display: none; -} -/* cabinet */ - -@media only screen and (max-width: 1600px) { - -.wrapper{ - max-width: 1280px; -} - -.product__item{ - margin: 12px; - - width: calc(33.3% - 24px); -} - -.gallery__wrapper{ - max-width: 1280px; -} - -.header__content::after{ - max-width: 1232px; -} -} - -@media only screen and (max-width: 1365px) { - .gallery__wrapper{ - max-width: 100%; - } - -} - -.subscription{ - margin-top: 12px; -} -.subscription__item{ - padding: 12px 0; - justify-content: space-between; -} -.subscription__item{ - font-size: 20px; -} -.subscription__add{ - color: var(--text-black); -} -.subscription__add-header{ - -} -.subscription__add-title{ - font-size: 24px; -} -.subscription__add-content{ - padding: 24px 0 12px 0; -} -.subscription__add-product{ - align-items: start; -} -.subscription__add-product > *:nth-child(3){ - margin-left: auto; - align-items: center; -} -.subscription__add .cabinet-card-order-detail-main-product-description__what { - font-size: 16px; - line-height: 125%; -} -.subscription__add .cabinet-card-order-detail-main-product-description__with-what { - font-weight: 500; - font-size: 16px; -} -.subscription__add .cabinet-card-order-detail-main-product__count{ - font-weight: 700; - font-size: 16px; - line-height: 100%; -} -.subscription__add .cabinet-card-order-detail-main-product__price{ - font-weight: 500; - font-size: 20px; - line-height: 120%; -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-mobile.css deleted file mode 100644 index 4464cbc..0000000 --- a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-mobile.css +++ /dev/null @@ -1,336 +0,0 @@ -/* Стили для мобильных устройств */ -@media only screen and (max-width: 720px) { -/* product */ -.product__item{ - width: calc(100% - 24px); -} -/* product */ - -/* modal */ -.modal__basket{ - width: 100%; -} -.modal__filter{ - width: 100%; -} -.modal__to-know, -.modal__to-know-submit{ - width: 100%; -} -.modal__button .to-know{ - display: flex; - - background: none; -} -.modal__basket .modal__header { - height: calc(100% - 156px); - margin-bottom: -36px; -} -.modal-basket-item__block-image{ - position: absolute; - width: 80px; -} -.modal-basket-item__image{ - width: 48px; -} -.modal-basket-item__content{ - margin-left: 0; - - padding-left: 96px; -} -.modal-basket-item__control{ - margin-left: -80px; -} -.modal-basket-item__title{ - min-height: 40px; - - font-size: 16px; -} -.modal-basket__item--return{ - flex-direction: column; - align-items: start; -} -.modal-basket__item--return .modal-basket-item__title{ - margin-right: auto; -} -.notification--width-584{ - width: 100%; -} -.notification__title{ - font-size: 20px; -} -.notification__text--center-pc{ - text-align: start; -} -.notification__img{ - height: 360px; -} -.notification__title{ - padding-right: 96px; -} -.modal-form__buttons--two{ - flex-wrap: wrap; -} -.modal-form__buttons--two button, .modal-form__buttons--two input{ - margin-top: 24px; - width: 100%; -} -.modal-form__buttons--two button:first-child, .modal-form__buttons--two input:first-child{ - margin-top: 0; -} -.modal-map__control{ - flex-wrap: wrap; -} -.modal-map-control__item{ - width: calc(100% - 24px); -} -.form__full-mobile{ - width: 100%; - border-radius: 0; - border: none; -} - -.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){ - width: 69px; -} -.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){ - -} -.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){ - width: 82px; -} -.form__input{ - padding: 12px 14px; -} -.modal-form--height-100-phone{ - min-height: 100%; -} -/* modal */ - -/* footer */ -.footer__about{ - display: none; -} -.footer__wrapper{ - flex-direction: column; -} -.footer__content{ - width: 100%; -} -.footer__form{ - margin-top: 24px; - margin-left: 0; - - width: 100%; -} -.footer__social-media{ - display: block; - - margin-top: 24px; -} -.footer-about__text{ - padding-top: 35px; - display: block; - text-align: left; -} -.footer__list{ - margin-top: 20px; -} -/* footer */ - -/* detail */ -.toggle__table--two .toggle-table__block{ - width: 100%; -} -.toggle__table--two .toggle-table__block:nth-child(even){ - margin-top: 32px; - margin-left: 0; -} -.toggle__table--three .toggle-table__block:nth-child(1){ - width: 31%; -} -/* detail */ - -/* cabinet */ -.cabinet-card__title{ - font-size: 20px; -} -.cabinet-card__no-orders{ - margin-top: 16px; -} -.cabinet-card-order__header{ - flex-direction: column; -} -.cabinet-card-order__payment{ - margin-top: 16px; -} -.cabinet-card-order-detail__main{ - flex-direction: column; -} -.cabinet-card-order-detail-main__links{ - margin-top: 24px; - - align-items: start; -} -.cabinet-card-order-detail-main-product__img{ - width: 70px; - height: 70px; -} -.cabinet-card-order-detail-main__product{ - margin-top: 16px; - - align-items: start; -} -.cabinet-card-order-detail-main-product__content{ - margin-left: 16px; - - flex-wrap: wrap; - - position: relative; -} -.cabinet-card-order-detail-main-product__description{ - width: 100%; -} -.cabinet-card-order-detail-main-product__count{ - position: absolute; - left: 116px; - bottom: 0; -} -.cabinet-card-order-detail-main-product__price{ - position: absolute; - left: 153px; - bottom: 0; -} -.cabinet-card__content{ - padding-right: 19px; -} -.cabinet-card-order-main__date{ - font-size: 20px; -} -/* .cabinet-card__order.active */ -/* .cabinet-card__order.active */ -/* cabinet */ -} - -@media only screen and (max-width: 576px) { -/* header */ - -/* header */ - -/* product */ -.product__header{ - flex-direction: column; - align-items: start; -} -.product__header .button{ - margin-top: 48px; -} -/* product */ - -/* modal */ -.modal__aside{ - left: 0; -} -.form-input-radio__title span{ - display: block; - width: 100%; - - color: var(--text-grey); -} -.modal-form__title{ - font-size: 20px; -} -/* modal */ - -/* detail */ -.detail-block-form__item, -.detail-block-form__submit{ - min-width: 100%; -} -/* detail */ - -/* cabinet */ - -.cabinet-card-order-detail-main-product__img{ - width: 40px; - height: 40px; -} - -.cabinet-card-order-detail-main-product__count{ - left: auto; - right: 71px; -} -.cabinet-card-order-detail-main-product__price{ - left: auto; - right: 0; -} -.cabinet-card-order__detail-short{ - transition-delay: 0; - transition-duration: 0; -} -/* cabinet */ -} - -@media only screen and (max-width: 720px) { - .subscription__item{ - flex-direction: column; - } - - .subscription__item > p:first-child{ - font-size: 16px; - color: var(--text-6); - } - .subscription__item > p:last-child{ - margin-top: 6px; - } - - .subscription__add-title { - font-size: 20px; - } - - .subscription__add-product{ - flex-wrap: wrap; - } - - .subscription__add-product > *:not(:first-child){ - padding-top: 0; - } - .subscription__add-product .cabinet-card-order-detail-main-product__img{ - width: 73px; - height: 66px; - } - .subscription__add-product .cabinet-card-order-detail-main-product-description__what{ - font-size: 12px; - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - overflow: hidden; - } - .subscription__add-product .cabinet-card-order-detail-main-product-description__with-what{ - margin-top: 8px; - - font-size: 12px; - } - .subscription__add-product .cabinet-card-order-detail-main-product__description { - width: calc(100% - 73px); - } - .subscription__add-product .cabinet-card-order-detail-main-product__content{ - position: static; - margin-top: -10px; - margin-left: auto; - width: calc(100% - 73px); - - display: flex; - justify-content: space-between; - align-items: center; - } - .subscription__add-product .cabinet-card-order-detail-main-product__count{ - position: static; - font-size: 12px; - } - .subscription__add-product .cabinet-card-order-detail-main-product__price{ - position: static; - font-size: 16px; - } -} - diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-order.css b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-order.css deleted file mode 100644 index fcfde9e..0000000 --- a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-order.css +++ /dev/null @@ -1,241 +0,0 @@ -.order{ - display: flex; -} -.order__title{ - font-family: var(--font-family); - font-weight: 700; - font-size: 24px; - line-height: 117%; - text-transform: uppercase; - color: var(--text-black); -} -.order__contacts{ - width: calc(50% - 0.5px); - - padding: 24px; - - border-right: 1px solid #121212; -} -.order-contacts__header{ - display: flex; - justify-content: space-between; - align-items: center; -} -.order-contacts__form{ - margin-top: 24px; -} -.order-contacts__delivery{ - margin-top: 47.5px; - - padding-top: 48px; - - border-top: 1px solid var(--background-grey); -} - -.order-contacts-deliver__item{ - margin-top: 24px; -} -.order-contacts-deliver__date{ - padding: 8px; - - border-radius: 24px; - - background: var(--background-grey); -} -.order-contacts-deliver__date .form-input-radio__item{ - margin-top: 24px; -} -.order-contacts-deliver__date .form-input-radio__item:first-child{ - margin-top: 0; -} -.order__your{ - width: calc(50% - 0.5px); - - padding: 24px 24px 24px 48px; - - background: var(--background-grey); -} -.order-your__products{ - margin-top: 48px; -} -.order-your-products__item{ - margin-top: 16px; - - display: flex; - justify-content: space-between; -} -.order-your-products__left{ - display: flex; -} -.order-your-products__img{ - width: 40px; - aspect-ratio: 1; - - border-radius: 16px; -} -.order-your-products__content{ - margin-left: 16px; -} -.order-your-products__name{ - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-black); - - text-decoration: none; -} -.order-your-products__description{ - margin-top: 8px; - - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - color: var(--text-6); -} -.order-your-products__description span{ - font-weight: 700; -} -.order-your-products__description span::before{ - margin-left: 3px; - - content: 'x '; -} -.order-your-products__right{ - display: flex; -} -.order-your-products__count{ - font-family: var(--font-family); - font-weight: 700; - font-size: 12px; - line-height: 133%; - text-align: right; - color: var(--text-6); -} -.order-your-products__count::before{ - content: 'x'; -} -.order-your-products__price{ - margin-left: 16px; - - font-family: var(--font-family); - font-weight: 700; - font-size: 12px; - line-height: 133%; - text-align: right; - color: var(--text-black); -} -.order-your-products__price::after{ - content: 'Р'; -} -.order-your__calculation{ - margin-top: 48px; -} -.order-your__promo{ - display: flex; -} -.order-your-promo__button{ - margin-left: 8px; -} -.order-your-calculation__item{ - margin-top: 24px; - - display: flex; - justify-content: space-between; - align-items: center; -} -.order-your-calculation__title{ - font-family: var(--font-family); - font-weight: 500; - font-size: 20px; - line-height: 120%; - color: var(--text-black); -} -.order-your-calculation__value{ - font-family: var(--font-family); - font-weight: 700; - font-size: 20px; - line-height: 200%; - text-transform: uppercase; - text-align: right; - color: var(--text-black); -} -.order-your-calculation__value--price::after{ - content: ' ₽'; -} -.order-your-calculation__value--discount{ - background: var(--gradient-red); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} -.order-your-calculation__value--discount::before{ - content: '- '; -} -.order-your-calculation__description{ - font-family: var(--font-family); - font-weight: 500; - font-size: 12px; - line-height: 133%; - text-align: right; - color: var(--text-9); -} -.order-your-calculation__line{ - margin-top: 23px; - border: 1px solid var(--background-9); -} -.order-your-calculation__result{ - font-family: var(--font-family); - font-weight: 700; - font-size: 24px; - line-height: 117%; - text-transform: uppercase; - color: var(--text-black); -} -.order-your-calculation__submit{ - margin-top: 48px; -} - -@media only screen and (max-width: 1200px) { -.order{ - display: block; -} -.order__contacts, .order__your{ - border: none; - width: 100%; -} -} - -@media only screen and (max-width: 720px) { -.order__title{ - max-width: 181px; - - font-size: 20px; - line-height: 120%; -} -.order__your{ - margin-top: 16px; -} -.order__contacts{ - padding: 24px 16px; -} -.order__your{ - padding: 40px 16px 9px 16px; -} -.order-your__promo{ - display: block; -} -.order-your-promo__button{ - margin-left: 0; - margin-top: 24px; - - width: 100%; -} -.order-your-products__content{ - max-width: 164px; -} -.order-your-products__count, .order-your-products__price{ - flex-shrink: 0; -} -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-tablet.css deleted file mode 100644 index e59949c..0000000 --- a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-tablet.css +++ /dev/null @@ -1,348 +0,0 @@ -/* Стили для планшетов */ -@media only screen and (max-width: 1200px) { -/* header */ -main{ - padding-top: 64px; -} -.main-menu{ - display: none; -} -.header__open-menu{ - display: block; -} -.lang{ - display: none; -} -.header__logo{ - width: 136px; - height: 29px; -} -.header__content{ - height: auto; - - padding: 8px 16px; -} -.mini-profile__item:nth-child(2){ - margin-left: 0; -} -.header::after{ - left: 0; - - width: 100%; -} -.header__pc-menu{ - display: none; -} -.header__phone-menu{ - display: block; -} -.header__menu-block{ - top: 56px; -} -.header__content::after{ - left: 0; - right: 0; - width: 100%; -} -/* header */ - -/* footer */ -.footer{ - margin-top: 0; - - padding: 24px 16px; -} -/* footer */ - -/* breadcrumbs */ -.breadcrumbs{ - display: none; -} -/* breadcrumbs */ - -/* product */ -.product{ - padding: 12px; - padding-top: 20px; -} -.product__title{ - font-weight: 700; - font-size: 26px; - line-height: 123%; - text-transform: uppercase; -} -.to-know p { - font-size: 18px; -} -.toggle-table__title{ - font-weight: 700; - font-size: 12px; - line-height: 133%; -} -.toggle-table__item p{ - font-weight: 500; - font-size: 12px; - line-height: 133%; -} -.toggle-table-item__line{ - margin-top: 12px; -} -.detail{ - margin: 24px 16px; -} -.back-detail{ - display: inline; -} -.detail-catalot__title{ - font-size: 22px; -} -.product__footer--error{ - margin: 48px 0px 24px; -} -/* product */ - -/* modal */ -.modal{ - padding: 0; -} -.modal__text{ - padding-right: 0; -} -.form__button-pc{ - display: none; -} -.form__button-mobile{ - display: block; -} -.modal-form{ - /* min-height: 100%; - width: 100%; - - border-radius: 0; - border: none; */ -} -.modal__notification{ - margin: 24px; -} -.form-input-phone__list{ - left: 0; -} - -.modal-form-content__line--two{ - flex-wrap: wrap; -} -.modal-form-content__line--two .modal-form-content-line__element{ - margin-top: 24px; - - width: 100%; -} -.modal-form-content__line--two .modal-form-content-line__element:first-child{ - margin-top: 0; -} -.modal-map{ - width: 100%; - - flex-direction: column; - - border-radius: 0; -} -.modal-map__left, .modal-map__right{ - width: 100%; -} -.modal-map__map iframe { - width: 100%; - height: 528px; -} -.modal-map-form__button{ - display: none; -} -.modal-map-form__sub-button{ - margin-top: 64px; - - padding: 0 24px; - - display: flex; - } -/* modal */ - -/* cabinet */ -.cabinet{ - flex-direction: column; - - position: relative; -} -.cabinet__control{ - display: flex; - - position: relative; -} -.cabinet__orders, .cabinet__profile{ - width: calc(100% - 48px); -} -.cabinet__orders, .cabinet__profile{ - position: absolute; - opacity: 0; - - transition: opacity .2s ease-out; -} -.cabinet-content{ - pointer-events:none; -} -.cabinet__orders.active, .cabinet__profile.active{ - opacity: 1; -} -.cabinet__orders.hide, .cabinet__profile.hide{ - position: static; - display: block; - pointer-events:auto; - - width: 100%; -} -.cabinet__subscription-pc{ - display: none; -} -.cabinet__subscription-mobile{ - display: block; - - margin: 24px 24px 0 24px; -} -.cabinet__orders .cabinet-card:nth-child(2){ - margin-top: 0; - } - .cabinet__orders--no-cab .cabinet-card:nth-child(2){ - margin-top: 32px; - } -/* cabinet */ -} - -@media only screen and (max-width: 980px) { -/* product */ -.product__item{ - width: calc(50% - 24px); -} -/* product */ - - -/* detail */ -.detail{ - flex-direction: column; -} -.detail__images{ - display: none; -} -.detail__content{ - width: 100%; -} -.detail__content{ - margin-left: 0; -} - -.detail__images-phone{ - display: block; - - margin-top: 48px; - margin-bottom: 48px; - - position: relative; - - overflow: hidden; -} -.detail__images-phone .swiper-slide{ - display: flex; - justify-content: center; -} -.detail-images-phone__image-block{ - width: 100%; - aspect-ratio: 1; - max-width: 500px; - - display: flex; - justify-content: center; - align-items: center; - - background: var(--background-grey); - border-radius: 16px; -} - -.detail__images-phone .swiper-pagination-bullet{ - width: 8px; - height: 8px; - - border-radius: 50%; - - border: 1px solid #666; - background-color: #666; - - opacity: 1; -} -.detail__images-phone .swiper-pagination-bullet.swiper-pagination-bullet-active{ - background-color: var(--background-white); -} - -.detail__images-phone .swiper-pagination{ - margin-bottom: 19px; -} -.detail__title{ - font-size: 26px; - line-height: 123%; -} -.gallery__slider .swiper-pagination { - display: block; -} -.gallery__pagination{ - display: none; -} - -.gallery__slider .swiper-pagination-bullet{ - width: 8px; - height: 8px; - border-radius: 50%; - border: 1px solid #666; - background-color: #666; - opacity: 1; -} -.gallery__wrapper .gallery-button{ - display: none; -} - -.gallery__slider .swiper-pagination-bullet.swiper-pagination-bullet-active{ - background-color: var(--background-white); -} - -.gallery__slider{ - margin-left:0; - padding: 0px 0px 50px 0px; - /* padding: 40px; */ -} -.gallery__block { - width: 100%; - aspect-ratio: 1; - height: auto; -} -/* detail */ -} - -@media only screen and (max-width: 750px) { -/* cabinet */ -.cabinet-card-order__open-detail{ - margin-top: 144px; -} -.cabinet-card-order__detail-short{ - right: auto; - left: 0; - bottom: 48px; -} -.cabinet-card-order-detail-short__item{ - margin-left: -27px; -} -.cabinet-card-order-detail-short__item:first-child{ - margin-left: 0; -} -.cabinet-card__order.active .cabinet-card-order__open-detail{ - margin-top: 24px; -} -.cabinet-card-order__link{ - margin-top: 144px; -} -/* cabinet */ -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-ultra.css b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-ultra.css deleted file mode 100644 index c149baa..0000000 --- a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-ultra.css +++ /dev/null @@ -1,4 +0,0 @@ -/* Стили для ультрашироких экранов */ -@media only screen and (min-width: 1400px) { - -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/single-product.css.bak b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/single-product.css.bak new file mode 100644 index 0000000..c8cc517 --- /dev/null +++ b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/single-product.css.bak @@ -0,0 +1,4531 @@ + +/* общие */ +button{ + cursor: pointer; +} + +.wrapper{ + margin: 0 auto; + + max-width: 1600px; +} + +/* компоненты */ + +/* lang*/ +.lang{ + position: relative; +} +.lang__open{ + padding: 12px 15px; + + width: 74px; + + background: none; + border: none; + + display: flex; + align-items: center; + + transition: opacity .2s ease-out; +} +.lang__open:hover{ + opacity: .8; +} +.lang-open p{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + + text-align: start; + + color: var(--text-black); +} +.lang-open__arrow{ + margin-left: 7.25px; + + display: flex; + justify-content: center; + align-items: center; +} +.lang-open__black{ + +} +.lang-open__white{ + display: none; +} +.lang__content{ + position: absolute; + top: 33px; + left: -13px; + + height: 0; + + border-radius: 6px; + + transition: height .2s ease-out; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + overflow: hidden; + + background-color: var(--background-white); + + z-index: 100; +} +.lang__list{ + width: 104px; + + padding: 8px; + + list-style-type: none; +} +.lang__item{ + margin-top: 8px; +} +.lang__item:first-child{ + margin-top: 0; +} +.lang__link{ + display: block; + + width: 100%; + + padding: 4px; + + border-radius: 6px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + text-decoration: none; + + position: relative; + + transition: background-color .2s ease-out; +} +.lang__link:hover, +.lang__item.active .lang__link{ + background-color: var(--background-grey); +} +.lang__item.active .lang__link::before{ + content: ''; + + position: absolute; + top: 10px; + right: 8px; + + width: 16px; + height: 12px; + + background-image: url(../img/svg/main/arrow-selected.svg); +} +/* lang */ + + +/* mini-profile */ +.mini-profile{ + display: flex; + align-items: center; +} +.mini-profile__item{ + margin-left: 8px; +} +.mini-profile__item:first-child{ + margin-left: 0; +} +.mini-profile__button{ + display: block; + + padding: 8px; + + display: flex; + justify-content: center; + align-items: center; + + background: none; + border: none; + + transition: opacity .2s ease-out; +} +.mini-profile__button:hover{ + opacity: .8; +} +.mini-profile__icon{ + width: 24px; + aspect-ratio: 1; +} +.mini-profile__icon.white{ + display: none; +} +/* mini-profile */ + + +/* main-menu */ +.main-menu{ + display: flex; + align-items: center; + + list-style-type: none; +} +.main-menu__item{ + margin-left: 24px; + + transition: opacity .2s ease-out; +} +.main-menu__item:first-child{ + margin-left: 0; +} +.main-menu__item:hover{ + opacity: .8; + + background: var(--background-grey); + border-radius: 24px; +} +.header.white .main-menu__item:hover .main-menu__link{ + color: var(--text-black); +} +.main-menu__item:active{ + opacity: 1; +} +.main-menu__link{ + display: block; + + padding: 8px 12px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + text-decoration: none; + + transition: color .2s ease-out; +} +.main-menu__button{ + padding: 8px 32px 8px 12px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + border: none; + border-radius: 24px; + + background: var(--gradient-turquoise); + + position: relative; +} +.main-menu__button::before{ + content: ''; + + position: absolute; + top: 14px; + right: 14px; + + width: 13px; + height: 8px; + + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; +} +/* main-menu */ + + +/* form */ +.form{ + width: 100%; + + padding: 24px 24px 43px; + + display: flex; + flex-direction: column; + + border-radius: 24px; + background: var(--gradient-turquoise); +} +.form__item{ + margin-top: 16px; +} +.form__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-black); +} +.form__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + border: 1px solid var(--text-black); + + background: var(--background-white); + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + + color: var(--text-black); +} +.form__input::placeholder{ + color: var(--text-grey); +} +.form__input--grey{ + border-color: var(--background-9); +} +.form__input--textarea{ + height: 96px; + resize: none; +} +.form__input--textarea-72{ + height: 72px; + resize: none; + + overflow: hidden; +} +.form__input--center{ + text-align: center; +} +.form__button{ + width: 100%; + + padding: 12px 24px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + border-radius: 16px; + border: none; + background: var(--background-black); + + cursor: pointer; + + transition: background-color .2s ease-out; +} +.form__button:hover{ + opacity: .8; +} + +.label{ + padding-bottom: 4px; + + display: inline-block; + + position: relative; +} +.label::after{ + content: ''; + + position: absolute; + top: 2px; + right: -20px; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/question.svg); + + cursor: pointer; +} +.label__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-3); +} +.label__question{ + position: absolute; + + padding: 8px; + + border-radius: 6px; + transition: height .2s ease-out; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + overflow: hidden; + background-color: var(--background-white); + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; +} +.label:hover .label__question{ + opacity: 1; + pointer-events: auto; +} + +.label-name{ + margin-bottom: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + display: block; +} +.form-input__error{ + margin-top: 4px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + + color: #f60909; + + display: none; + + position: relative; +} +.form-input__error--absolute{ + position: absolute; + bottom: -19.95px; + left: 0; + + width: 100%; +} +.modal-form__content.check .form__input:invalid{ + border-color: #f60909; +} +.modal-form__content.check .form__input:invalid + .form-input__error{ + display: block; +} +.modal-form__content.check .form-input-phone__input:invalid + .form-input__error{ + display: block; +} +.modal-form__content.check .form-input-phone__input:invalid + .form-input__error--absolute::before{ + content: ''; + + position: absolute; + top: -53px; + left: -1px; + + width: 100%; + height: 48px; + + border-radius: 20px; + border: 1px solid #f60909; +} +.form-input__phone{ + padding: 12px 16px 12px ; + + display: flex; + align-items: center; + + border-radius: 20px; + border: 1px solid var(--text-black); + + cursor: pointer; + + position: relative; +} +.form-input__phone.focus{ + outline: 1px solid var(--text-black); +} +.form-input-phone__icon{ + flex-shrink: 0; + + height: 16px; + width: 28px; + + background-size: 16px; + background-repeat: no-repeat; + background-position: left; + + position: relative; +} +.form-input-phone__icon::after{ + content: ''; + + position: absolute; + top: 4px; + right: 0; + + width: 8px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/triangle-grey.svg); +} +.form-input-phone__code{ + flex-shrink: 0; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone__code::before{ + content: '+'; +} +.form-input-phone__input{ + margin-left: 6px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: none; + outline: none; +} +.form-input-phone__list{ + position: absolute; + top: 52px; + left: 8px; + + width: 280px; + + z-index: 10; + + transition: opacity .2s ease-out; + + opacity: 0; + pointer-events: none; + + border-radius: 20px; + + overflow: hidden; +} +.form-input-phone__list.active{ + opacity: 1; + pointer-events: auto; +} +.form-input-phone-list__search{ + width: 100%; + + padding: 12px 16px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-left: 1px solid var(--background-black); + border-right: 1px solid var(--background-black); + border-top: 1px solid var(--background-black); + border-radius: 20px 20px 0 0; + + background: var(--background-white); +} +.form-input-phone-list__search::placeholder{ + color: var(--text-6); +} +.form-input-phone-list__content{ + width: 100%; + max-height: 224px; + + padding: 24px 16px; + + border: 1px solid var(--background-black); + border-top: none; + border-radius: 0 0 20px 20px; + + background: var(--background-white); + + overflow-y: auto; +} +.form-input-phone-list__item{ + margin-top: 14px; + + display: flex; + align-items: center; + + background: none; + border: none; + + cursor: pointer; +} +.form-input-phone-list__item:first-child{ + margin-top: 0; +} +.form-input-phone-list-item__icon{ + width: 16px; + aspect-ratio: 1; +} +.form-input-phone-list-item__name{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone-list-item__code{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone-list-item__code::before{ + content: '+'; +} +.form-input__tabs{ + padding: 2px; + + display: flex; + + border-radius: 20px; + background: var(--gradient-turquoise); + + position: relative; +} +.form-input__tabs--white{ + padding: 3px; + border: 1px solid var(--text-3); + background: var(--white); +} +.form-input__tabs--white .form-input-tabs__button.active{ + background: var(--gradient-turquoise); +} +.form-input-tabs__button{ + width: 100%; + + padding: 10px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + text-align: center; + + border-radius: 18px; + + z-index: 2; + + transition: background-color .2s ease-out; +} +.form-input-tabs__button.active{ + background-color: var(--background-white); +} +.form-input-tabs__input{ + display: none; +} +.form-input__radio{ + padding: 16px; + + display: flex; + flex-direction: column; +} +.form-input-radio__item{ + margin-top: 14px; + + display: flex; + align-items: center; +} +.form-input-radio__item:first-child{ + margin-top: 0; +} +.form-input-radio__circle{ + padding: 2px; + + width: 20px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--gradient-blue); + + position: relative; +} +.form-input-radio__item.active .form-input-radio__circle::before{ + content: ''; + + position: absolute; + top: 4px; + left: 4px; + + width: 12px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--gradient-blue); +} +.form-input-radio-circle__content{ + width: 16px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--background-white); +} +.form-input-radio__title{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); +} +.form-input-radio__title.form-input-radio__title--no-span span{ + color: var(--text-dark); +} +.form-input-radio__price{ + margin-left: auto; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-radio__price::after{ + content: ' ₽'; +} +.form-input-radio__input{ + display: none; +} +.form-input__list{ + position: relative; +} +.form-input__list::before{ + content: ''; + position: absolute; + top: 21.5px; + right: 19.5px; + width: 13px; + height: 8px; + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; + pointer-events: none; +} +.form-input-list__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + padding-right: 40px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: 1px solid var(--text-black); +} + +.form-input-list__input::placeholder{ + color: var(--text-grey); +} +.form-input-list__block-content{ + position: absolute; + top: 50px; + left: 0; + + width: 100%; + max-height: 192px; + height: 0; + + border-radius: 20px; + background-color: var(--background-white); + + overflow: hidden; + + transition: height .2s ease-out; + + z-index: 10; +} +.form-input-list__block-content.active{ + border: 1px solid var(--background-black); +} +.form-input-list__content{ + margin: 8px 16px; + + max-height: 176px; + + padding-right: 16px; + + overflow-y: auto; +} +.form-input-list__content::-webkit-scrollbar{ + border-radius: 8px; + width: 4px; + background: rgba(204, 204, 204, 0.2); +} +.form-input-list__content::-webkit-scrollbar-thumb{ + border-radius: 8px; + background: var(--background-9); +} +.form-input-list__content +.form-input-list__item{ + margin-top: 16px; + + width: 100%; + + display: flex; + justify-content: space-between; + align-items: center; + + border-radius: 8px; + padding: 4px; + + background: none; + border: none; +} +.form-input-list__item:first-child{ + margin-top: 0; +} +.form-input-list__item.active{ + background: rgba(204, 204, 204, 0.2); +} +.form-input-list-item__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-list-item__box{ + width: 20px; + aspect-ratio: 1; + + padding: 2px; + + border-radius: 4px; + + background: var(--gradient-blue); +} +.form-input-list-item-box__content{ + width: 16px; + aspect-ratio: 1; + + border-radius: 2px; + + background: var(--background-white); +} +.form-input-list__item.active .form-input-list-item-box__content{ + background: var(--gradient-blue); +} +.remote-control__item{ + display: none; +} +.remote-control__item.active{ + display: block; +} +/* .form-input-radio__ */ + +.form-agreement{ + display: flex; +} +.form-agreement__check{ + display: flex; + align-items: center; +} +.form-agreement__square{ + width: 18px; + aspect-ratio: 1; + + border-radius: 4px; + + border: 2px solid var(--background-black); +} +.form-agreement__label{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-agreement__input{ + display: none; +} +.form-agreement__input:checked + .form-agreement__square{ + border: none; + background: var(--gradient-blue); + + position: relative; +} +.form-agreement__input:checked + .form-agreement__square::after{ + content: ''; + + position: absolute; + top: 1px; + left: 1px; + + width: 16px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-selected-white.svg); + background-repeat: no-repeat; + background-position: center; +} +/* form */ + + +/* social media */ +.social-media{ + display: flex; + align-items: center; +} +.social-media__item{ + margin-left: 32px; + + transition: opacity .2s ease-out; +} +.social-media__item:hover{ + opacity: .8; +} +.social-media__item:first-child{ + margin-left: 0px; +} +.social-media__icon{ + width: 32px; + aspect-ratio: 1; +} +/* social media */ + + +/* breadcrumbs */ +.breadcrumbs{ + margin: 24px; + + display: flex; + align-items: center; +} +.breadcrumbs__item{ + display: block; + + padding: 0px 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-6); + + text-decoration: none; + + position: relative; +} +.breadcrumbs__item:first-child{ + padding-left: 0; +} +.breadcrumbs__item:nth-child(n+2)::before{ + content: ''; + + position: absolute; + top: -2px; + left: -12px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-breadcrumbs.svg); + background-repeat: no-repeat; + background-size: contain; +} +/* breadcrumbs */ + +/* compound */ +.compound{ + margin: -5px; + + min-height: 33.95px; + + display: flex; + align-items: start; +} +.compound__item{ + margin: 5px; + + padding: 4px 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-black); + + border-radius: 16px; + background-color: var(--background-white); + + display: block; + text-decoration: none; +} +.compound__item:first-child{ + margin-left: 0; +} +.product__footer{ + margin: 48px 24px 24px; + + display: flex; + justify-content: center; +} +.product__footer--error{ + margin: 45px 0; +} +/* compound */ + +/* button */ +.button{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-radius: 20px; + + cursor: pointer; +} +.button--100-perc{ + width: 100%; +} +.button--white{ + padding: 11px 24px; + + text-align: center; + + background-color: var(--background-white); + border: 1px solid var(--background-black); + + transition: opacity .2s ease-out; +} +.button--white:hover{ + opacity: .8; +} +.button--white.active{ + background: var(--background-black); + color: var(--background-white); +} +.button--gradient{ + background: var(--gradient-turquoise); + border: none; + + transition: opacity .2s ease-out; +} +.button--gradient:hover{ + opacity: .8; +} +.button--base{ + padding: 12px 24px; +} +.button--high{ + height: 56px; + + padding: 16px 24px 24px 24px; + + font-weight: 700; + text-align: center; + + position: relative; +} +.button--high-46{ + padding: 12px 24px; + + font-size: 20px; + font-weight: 700; + line-height: 24px; +} +.button--icon{ + padding-right: 56px; + + text-align: start; +} +.button--filter::after{ + content: ''; + + position: absolute; + top: 16px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/filter.svg); + background-repeat: no-repeat; + background-size: contain; +} +.button--black{ + padding: 7px 15px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + + background: var(--background-black); + border: 1px solid var(--text-white); +} +.button--link{ + text-decoration: none; +} +.button--red-48-px{ + border-radius: 48px; +} +.to-know{ + /* width: 100%; */ + + padding: 12px 24px 7px 24px; + + display: flex; + justify-content: center; + + border: none; + + transition: opacity .2s ease-out; + text-decoration: none; +} + +.to-know--start{ + justify-content: start; + padding-left: 0; +} + +.to-know:hover{ + opacity: .8; +} +.to-know p{ + padding-bottom: 4px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-bottom: 1px var(--text-black) solid; + + cursor: pointer; +} +.to-know--background-none{ + background: none; +} +.back{ + margin-top: 16px; + margin-left: 16px; + + padding: 8px; + padding-left: 32px; + + background: none; + border: none; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; + + position: relative; +} +.back::before{ + content: ''; + + position: absolute; + top: 8px; + left: 0; + + margin-right: 8px; + + width: 24px; + height: 24px; + + background-image: url(../img/svg/main/arrow-back.svg); +} + +.back::after{ + content: ''; + + position: absolute; + bottom: 6px; + left: 0; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); +} +/* button */ + +/* select */ +.select{ + max-width: 144px; + + position: relative; +} +.select__state{ + width: 100%; + + padding: 11px 47px 11px 13px; + + /* pointer-events:none; */ + + border: 1px solid var(--background-black); + border-radius: 20px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + cursor: pointer; + + position: relative; + + transition: opacity .2s ease-out; +} +.select:hover .select__state{ + opacity: .8; +} +.select::after{ + content: ''; + + position: absolute; + top: 20.5px; + right: 21.5px; + + width: 17px; + height: 10px; + + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; + + pointer-events: none; +} +.state__block{ + position: absolute; + top: 48px; + left: 0; + + width: 100%; + + height: 0; + overflow: hidden; + + transition: height .2s ease-out; +} +.state__content{ + padding: 8px; + + border-radius: 6px; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + background-color: var(--background-white); + + list-style-type: none; +} +.state__content li{ + margin-top: 8px; +} +.state__content li:first-child{ + margin-top: 0; +} +.state__button{ + width: 100%; + + padding: 4px 32px 4px 4px; + + background: none; + border: none; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + text-align: start; + + border-radius: 6px; + + transition: background-color .2s ease-out; + + position: relative; +} +.state__button:hover, +.state__button.active{ + background-color: var(--background-grey); +} + +.state__button.active::before{ + content: ''; + position: absolute; + top: 10px; + right: 8px; + width: 16px; + height: 12px; + background-image: url(../img/svg/main/arrow-selected.svg); +} + +/* select */ + +/* counter */ +.counter{ + display: flex; + align-items: center; +} +.counter__input{ + width: 48px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: center; + color: var(--text-black); + + pointer-events: none; + + background: none; + border: none; +} +.counter__button{ + width: 48px; + height: 48px; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--text-3); + border-radius: 24px; + + background: var(--background-white); + + transition: opacity .2s ease-out; +} +.counter__button:hover{ + opacity: .8; +} +.counter--small{ + +} +.counter--small .counter__button{ + width: 32px; + height: 32px; +} +.counter--small{ + +} +/* counter */ + + +.subscription{ + +} +.subscription__item{ + display: flex; + + color: var(--text-black); + font-family: var(--font-family); + font-weight: 500; + line-height: 120%; +} +.subscription__item:nth-last-child(n + 2){ + border-bottom: 1px solid var(--background-9); +} +.subscription__item span{ + font-weight: 700; +} +.subscription__item span small{ + font-size: 16px; +} +.subscription__status{ + color: var(--text-black); +} +.subscription__status--close{ + color: var(--text-red); +} +.subscription__status--end{ + color: var(--text-green); +} +.subscription__add{ + width: 100%; +} +.subscription__add-header{ +} +.subscription__add-product{ + align-items: start; +} +.subscription__add-product > *:not(:first-child){ + padding-top: 14px; +} +.subscription__add-title{ + font-family: var(--font-family); + font-weight: 600; + line-height: 133%; +} +.subscription__add-content{ + +} + +.tabs__buttons{ + margin: -12px; + + display: flex; + flex-wrap: wrap; +} +.tabs__content-wrap{ + margin-top: 24px; +} +.tabs__content{ + display: none; +} +.tabs__content.active{ + display: block; +} + +.cabinet__control--column{ + flex-direction: column; +} + +.cabinet__control--column > *:not(:first-child){ + margin-top: 16px +} + +.cabinet-card-order__payment{ + +} +.cabinet-card-order__sub-title{ + font-family: var(--font-family); + font-weight: 600; + line-height: 143%; + color: var(--text-3); +} +.cabinet-card-order__date{ + font-family: var(--font-family); + font-weight: 700; + line-height: 125%; + color: var(--text-3); +} + +.cabinet-card-order-payment__price span{ + font-size: 12px; +} + + + +.wcsatt-add-to-subscription-wrapper, + form.cart .quantity, + .detail__content .in-stock, + .wcsatt-options-prompt-label-subscription, + .wcsatt-options-product-dropdown { + display: none; + } + .wcsatt-options-product-wrapper { + display: block!important; + } + form.cart .single_add_to_cart_button { + margin: 8px; + min-width: 345.89px; + height: 56px; + padding: 16px 24px 16px 24px; + font-weight: 700; + text-align: center; + position: relative; + background: var(--gradient-turquoise); + border: none; + transition: opacity .2s ease-out; + font-family: var(--font-family); + font-size: 20px; + line-height: 120%; + color: var(--text-black); + border-radius: 20px; + text-transform: none; + cursor: pointer; + } + form.cart .single_add_to_cart_button:hover { + opacity: 0.8; + } + .subscription-option-details span { + color: #000; + cursor: pointer; + } + ul.wcsatt-options-product, .wcsatt-options-product-dropdown { + margin: 0; + } + .wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input { + width: 18px; + aspect-ratio: 1; + accent-color: var(--background-black); + cursor: pointer; + } + .subscription-option label { + display: flex; + align-items: center; + gap: 5px; + } + + form.cart { + margin: 25px 0 -48px; + } + ul.wcsatt-options-product--hidden, .wcsatt-options-product-dropdown--hidden { + display: block!important; + } + .detail-block__form{ + margin-top: 48px; + + display: flex; + flex-direction: column; + } + + + .wcsatt-options-prompt-text{ + font-family: 'Craftwork Grotesk'; + font-style: normal; + font-weight: 700; + font-size: 20px; + line-height: 24px; + text-transform: uppercase; + color: #000000; +} + +.subscription-option-details, .wcsatt-options-prompt-action, .subs-text-title{ + font-size: 20px; + line-height: 24px; + display:flex; + gap: 12px; + align-items: center; +} +.subs-text{ + +max-width: 322px; +font-family: 'Craftwork Grotesk'; +font-style: normal; +font-weight: 500; +font-size: 16px; +line-height: 20px; +margin-bottom: 20px; +} +input:checked + .subscription-option-details::before, input:checked + .wcsatt-options-prompt-action::before{ + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='url(%23paint0_radial_11890_46040)' stroke-width='2'/%3E%3Ccircle cx='10' cy='10' r='6' fill='url(%23paint1_radial_11890_46040)'/%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(19 1) rotate(135) scale(25.4558 34.7538)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3CradialGradient id='paint1_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(16 4) rotate(135) scale(16.9706 23.1692)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E"); +} +.subscription-option-details::before, .wcsatt-options-prompt-action::before{ + content: ''; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='%23121212' stroke-width='2'/%3E%3C/svg%3E"); + height: 20px; width: 20px; + +} + +.wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input { + aspect-ratio: 1; + accent-color: var(--background-black); + cursor: pointer; + height: 0; + width: 0; + position: absolute; + opacity: 0; +} + +.subscription-option .amount { + color: #1A1A1A; + font-weight: 600; +} + +.subscription-option del .amount { + color: #bbb; + font-weight: 400; + font-size: .8em; + +} + +.subscription-option del .woocommerce-Price-amount.amount, .subscription-option del .woocommerce-Price-currencySymbol{ + text-decoration: line-through !important; +} + +.woocommerce-Price-amount.amount{ + font-size: 1.15em; +} + +.detail #wc-stripe-express-checkout-element{ + display: none !important; +} + +.detail-block-form__item--radio{ + display: flex; + gap: 10px; +} + + +/* Основные стили для компьютера */ + +/* header start */ + +.header{ + position: relative; + + background-color: var(--background-white); + + position: fixed; + left: 0; + top: 0; + right: 0; + + z-index: 200; +} + +.detail .product__main{ + width: 100%; +} + +.header__content::after{ + content: ''; + + position: absolute; + left: auto; + right: auto; + bottom: 0; + + width: calc(100% - 48px); + max-width: 1552px; + height: 1px; + + background: var(--text-3); +} + +.detail-block-form__items{ + margin: 25px 0 0; +} + +.header__content{ + height: 72px; + + padding: 14px 24px; + + display: flex; + justify-content: space-between; + align-items: center; +} + +.header__open-menu{ + display: none; + + width: 24px; + aspect-ratio: 1; + + position: relative; + + border: none; + background: none; +} +.header__open-menu::before{ + content: ''; + + position: absolute; + top: 8px; + left: 4px; + + width: 16px; + height: 2px; + + background: var(--background-black); + border-radius: 1px; + +} +.header__open-menu::after{ + content: ''; + + position: absolute; + left: 4px; + bottom: 8px; + + width: 16px; + height: 2px; + + background: var(--background-black); + border-radius: 1px; +} + +.header__logo{ + width: 182px; + height: 40px; +} +.header__logo-black, +.header__logo-white{ + width: 100%; + height: 100%; +} +.header__logo-white{ + display: none; +} + +.header__menu-block{ + position: absolute; + top: 72px; + left: 0; + + width: 100%; + height: 0; + + overflow: hidden; + transition: height .2s ease-out; + + background-color: var(--background-white); + + z-index: 100; +} + +.header__pc-menu{ + padding: 40px 46px; + + display: flex; + justify-content: center; + + position: relative; +} +.header__pc-menu::before{ + content: ''; + + position: absolute; + top: 0; + left: 46px; + + width: 330px; + height: 248px; + + background-image: url(../img/pet/cat.png); + background-repeat: no-repeat; +} +.header__pc-menu::after{ + content: ''; + + position: absolute; + top: 0; + right: 46px; + + width: 330px; + height: 248px; + + background-image: url(../img/pet/dog.png); + background-repeat: no-repeat; +} +.header-pc-menu__content{ + width: 600px; + + display: flex; + justify-content: space-between; +} +.header-pc-menu__item{ + +} +.header-pc-menu__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + color: var(--text-black); + + text-decoration: none; +} +.header-pc-menu__list{ + margin-top: 16px; + + list-style-type: none; +} +.header-pc-menu__list-li{ + margin-top: 25px; +} +.header-pc-menu__list-li:first-child{ + margin-top: 0; +} +.header-pc-menu__list-li a{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-0); + + text-decoration: none; +} +.header__phone-menu{ + display: none; + + padding: 24px 16px; + + height: calc(100vh - 56px); + + overflow-x: auto; +} +.header-phone-menu__item{ + padding: 16px 0; + + border-top: 1px solid #f4f1f0; + border-bottom: 1px solid #f4f1f0; + + display: flex; + flex-direction: column; +} +.header-phone-menu__item:first-child{ + border-top: 0; +} +.header-phone-menu__item:last-child{ + border-bottom: 0; +} +.header-phone-menu__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; +} +.header-phone-menu__title--gradient{ + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.header-phone-menu__category{ + margin-top: 16px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 18px; + line-height: 133%; + color: var(--text-black); + + text-decoration: none; +} +.header-phone-menu__list{ + margin-top: 24px; + + padding-left: 32px; + + list-style-type: none; +} +.header-phone-menu__list-item{ + margin-top: 16px; +} +.header-phone-menu__list-item:first-child{ + margin-top: 0; +} +.header-phone-menu__list-item a{ + font-family: var(--font-family); + font-weight: 500; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + text-decoration: none; +} +.header.white{ + background: none; +} +.header.white .header__logo-black{ + display: none; +} +.header.white .header__logo-white{ + display: block; +} +.header.white .main-menu__link{ + color: var(--text-white); +} +.header.white .main-menu__button{ + background: var(--background-white); +} +.header.white .lang__open{ + color: var(--text-white); +} +.header.white .header__content::after{ + background: var(--background-white); +} +.header.white .lang-open__black{ + display: none; +} +.header.white .lang-open__white{ + display: block; +} +.header.white .mini-profile__icon.white{ + display: block; +} +.header.white .mini-profile__icon.black{ + display: none; +} +.header.white .header__open-menu::before, +.header.white .header__open-menu::after{ + background: var(--background-white); +} +.header__phone-menu::-webkit-scrollbar { + width: 0px; +} + +main{ + padding-top: 72px; +} +/* header end */ + +/* product */ +.product{ + padding: 24px; + } + .product__header{ + display: flex; + justify-content: space-between; + align-items: center; + } + .product__tag{ + margin: 36px -12px -12px -12px; + + display: flex; + align-items: center; + flex-wrap: wrap; + } + .product-tag__item{ + margin: 12px; + + padding: 1px; + + border-radius: 16px; + + background: var(--gradient-blue); + border: none; + } + .product-tag-item__content{ + padding: 3px 11px; + + background: var(--background-white); + + border-radius: 15px; + + display: flex; + align-items: center; + } + .product-tag-item__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + } + .product-tag-item__button{ + margin: 2px 0 2px 4px; + + width: 20px; + aspect-ratio: 1; + + background: none; + border: none; + + background-image: url(../img/svg/main/gradient-x.svg); + background-repeat: no-repeat; + background-position: center; + } + .product__error{ + margin: auto; + + padding: 0 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + color: var(--text-0); + text-align: center; + } + .product__error-button{ + border-radius: 20px; + padding: 4px 24px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: 1px solid var(--text-0); + background: var(--background-white); + text-decoration: none; + } + .product__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; + text-align: center; + color: var(--text-black); + } + .product__main{ + margin: 36px -12px -12px; + + /* width: 100%; */ + + display: flex; + align-items: stretch; + flex-wrap: wrap; + } + .product__item{ + margin: 12px; + + width: calc(25% - 24px); + + display: flex; + flex-direction: column; + justify-content: space-between; + + background-color: var(--background-grey); + border-radius: 24px; + + overflow: hidden; + + position: relative; + } + .product__item::before{ + content: ''; + + position: absolute; + top: 0; + left: 0; + + width: calc(100% - 2px); + height: calc(100% - 2px); + + border: 1px solid #000; + border-radius: 24px; + + pointer-events: none; + transition: opacity .2s ease-out; + + opacity: 0; + } + .product__item:hover::before{ + opacity: 1; + } + .product__item.active::before{ + opacity: 0; + } + .product-item__block-label{ + position: absolute; + top: 16px; + left: 16px; + } + .product-item__label{ + position: absolute; + top: 16px; + left: 16px; + + margin: -2px; + + display: flex; + align-items: center; + + z-index: 10; + } + .product-item-label__tag{ + margin: 2px; + + padding: 4px 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: #f4f1f0; + + border-radius: 16px; + display: block; + + text-decoration: none; + } + .product-item-label__tag--new{ + background: var(--gradient-blue); + } + .product-item-label__tag--new-green{ + background: #d9ffcc; + color: #4e7623; + } + .product-item-label__tag--sale{ + background: var(--gradient-red); + } + .product-item-label__tag--sale-red{ + color: #fa0505; + background: #ffe5e5; + } + .product-item-label__tag--black{ + background: var(--background-black); + color: var(--text-white); + } + .product-item-label__tag--title{ + padding: 4px 2px; + + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + display: flex; + align-items: center; + } + .product-item__product-card{ + height: 274px; + + display: flex; + justify-content: center; + align-items: center; + } + .product-item__images{ + height: 242px; + object-fit: contain; + } + .product-item__content-card{ + padding: 15.5px; + } + .product-item__title{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; + display: block; + } + .product-item__title:first-child{ + margin-top: 0; + } + .product-item__price{ + margin-top: 8px; + + display: flex; + align-items: center; + } + .product-item__price p{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 200%; + text-transform: uppercase; + color: var(--text-black); + } + .product-item__price p::after{ + + padding-left: 5px; + } + .product-item__price span{ + margin-left: 9px; + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-red); + } + .product-item__price del{ + margin-left: 24px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 18px; + line-height: 133%; + text-transform: uppercase; + text-decoration: line-through; + color: var(--text-6); + } + .product-item__price del::after{ + + } + .product-item__price span::before{ + content: '-'; + } + .product-item__price span::after{ + content: '%'; + } + .product-item__bye{ + margin-top: 8px; + } + .product__item.hiding .product-item__images{ + filter: grayscale(1) + } + .product__item.hiding .product-item__price{ + color: var(--text-grey); + } + .product-item__overlay{ + position: absolute; + top: 100%; + left: 0; + + width: 100%; + height: 100%; + + padding: 24px; + + display: flex; + flex-direction: column; + justify-content: space-between; + + border-radius: 24px; + backdrop-filter: blur(25px); + background-color: rgba(242, 242, 242, 0.8); + + z-index: 10; + + transition: top .4s ease-out; + } + .product-item__overlay.active{ + top: 0; + } + .product-item-overlay__header{} + .product-item-overlay__tags{ + margin: 4px -6px -6px -6px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-3); + + display: flex; + flex-wrap: wrap; + + list-style-type: none; + } + .product-item-overlay__tags li{ + margin: 4px 6px; + + position: relative; + } + .product-item-overlay__tags li:nth-child(n+1)::after{ + content: ''; + + position: absolute; + top: 6px; + right: -8px; + + width: 4px; + aspect-ratio: 1; + + background-color: var(--text-3); + border-radius: 50%; + } + .product-item-overlay__tags li:last-child::after, + .product-item-overlay__tags li:last-child::before{ + display: none; + } + .product-item-overlay__price{ + margin-top: 32px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); + } + .product-item-overlay__price::after{ + + } + .product-item-overlay__block-button{ + margin-top: 32px; + } + .product-item-overlay__button{ + margin-top: 16px; + } + .product-item-overlay__button:first-child{ + margin-top: 0; + } + .product-item-overlay__input-block{ + + } + .product-item-overlay__field{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; + } + .product-item-overlay__field:first-child{ + margin-top: 0; + } + .product-item-overlay-field__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-0); + } + .product-item__form{ + + } +/* product */ + +/* modal */ +/* .modal__button .to-know{ + display: none; +} */ +/* modal */ + +/* footer */ +.footer{ + margin-top: 80px; + + padding: 40px 24px; + + background: var(--background-black); +} +.footer__wrapper{ + width: 100%; + + display: flex; +} +.footer__content{ + width: calc(100% - 364px); +} +.footer__logo{ + width: 187px; + height: 43px; +} +.footer__address{ + margin-top: 24px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + font-style: normal; +} +.footer__list{ + margin: 28px -12px -12px -12px; + + display: flex; + justify-content: space-between; + flex-wrap: wrap; +} +.footer-list__item{ + margin: 12px; + + width: calc(50% - 24px); + + display: flex; + flex-direction: column; +} +.footer-list__item:nth-child(even){ + width: 322px; +} +.footer-list__item .button{ + border-radius: 24px; +} +.footer-list__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-white); +} +.footer-list__link{ + margin-top: 4px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + + text-decoration: none; +} +.footer__form{ + margin-left: 48px; + + width: 364px; +} +.footer__about{ + margin-top: 16px; + + padding-top: 15px; + + display: flex; + justify-content: space-between; + align-items: center; + + border-top: 1px solid var(--text-white); +} +.footer-about__text{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + text-align: right; + color: var(--text-white); + opacity: 0.6; + + text-decoration: none; +} +.footer__social-media{ + display: none; +} +/* footer */ + +/* detail */ +.detail{ + margin: 48px 24px 24px 24px; + + display: flex; + align-items: start; + flex-wrap: wrap; +} +.detail__images{ + margin: -12px; + + width: calc(50% - 24px); + + display: flex; + flex-wrap: wrap; +} +.detail__image{ + margin: 12px; + + border-radius: 24px; + + display: flex; + align-items: center; + justify-content: center; + + background: var(--background-grey); + cursor: pointer; +} +.detail__image--width-perc-100{ + width: calc(100% - 24px); + height: 600px; + +} +.detail__image--width-perc-50{ + width: calc(50% - 24px); + height: 288px; +} +.detail__image--width-perc-100 img{ + width: 90%; + height: 90%; + + object-fit: contain; +} +.detail__image--width-perc-50 img{ + width: 100%; + height: 100%; + + object-fit: contain; +} +.detail__content{ + margin-left: 48px; + + width: calc(50% - 24px); +} +.detail__label{ + margin: -2px; + display: flex; + align-items: center; +} +.detail__label-wrap { + display: flex; + flex-wrap: wrap; + gap: 5px; + align-items: center; +} +.detail__label .product-item-label__tag:last-child{ + margin-left: auto; +} +.detail__label .product-item-label__tag:first-child{ + margin-left: 0; +} +.detail__title{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; + color: var(--text-black); +} +.detail__block-price{ + margin-top: 24px; + + display: flex; + align-items: center; +} +.detail-block-price__price{ + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; +} +.detail-block-price__price::after{ + +} +.detail-block-price__sale{ + margin-left: 22px; + + display: flex; + align-items: center; +} +.detail-block-price-sale__text{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + text-transform: uppercase; + text-decoration: line-through; + color: var(--text-6); +} +.detail-block-price-sale__text::after{ + +} +.detail-block-price-sale__perc{ + margin-left: 9px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-red); +} +.detail-block-price-sale__perc::before{ + content: '-'; +} +.detail-block-price-sale__perc::after{ + content: '%'; +} +.detail-block__form{ + margin-top: 48px; + + display: flex; + flex-direction: column; +} +.detail-block-form__item{ + margin-top: 24px; + + min-width: 345.89px; + + display: flex; + align-items: center; + flex-wrap: wrap; +} +.detail-block-form__item--radio{ + margin: 16px -8px -8px -8px; +} +.detail-block-form__item:first-child{ + margin-top: 0; +} +.detail-block-form__item button{ + margin: 8px; +} +.detail-block-form__submit{ + min-width: 345.89px; +} +.detail__warning{ + padding: 3px; + + border-radius: 24px; + + background: var(--gradient-turquoise); +} +.detail-warning__content{ + padding: 26px; + + border-radius: 22px; + + background: var(--background-white); +} +.detail-warning__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + color: var(--text-black); +} +.detail-warning__text{ + margin-top: 16px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.detail__toggle{ + margin-top: 48px; + margin-bottom: 48px; +} +.detail__wrapper-catalot{ + margin-top: 64px; + + width: calc(100% + 16px); + + overflow: hidden; + + position: relative; +} +.detail__catalot{ + +} +.detail-catalot__header{ + padding-right: 16px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.detail-catalot__control{ + display: flex; + align-items: center; +} +.detail-catalot-control__button{ + margin-left: 24px; + + width: 48px; + aspect-ratio: 1; + + border-radius: 50%; + border: 1px solid var(--background-black); + background: none; + + display: flex; + justify-content: center; + align-items: center; +} +.detail-catalot__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + text-align: start; + color: var(--text-0); +} +.detail-catalot__content{ + margin: 12px -12px -12px -12px; + + width: 100%; + + display: flex; +} +.detail__catalot .product__item{ + width: calc(100% - 24px); +} +.detail__images-phone{ + display: none; +} +.back-detail{ + display: none; +} +.toggle__table{ + margin-top: 32px; + + display: flex; + flex-wrap: wrap; +} +.toggle__table:first-child{ + margin-top: 0; +} +.toggle__table--three .toggle-table__block:nth-child(1){ + width: 33%; +} +.toggle__table--three .toggle-table__block:nth-child(2){ + width: 33%; +} +.toggle__table--three .toggle-table__block:nth-child(3){ + width: 33%; +} +.toggle__table--two .toggle-table__block{ + width: calc(50% - 20px); +} +.toggle__table--two .toggle-table__block:nth-child(even){ + margin-left: 40px; +} +.toggle-table__block{ + +} +.toggle-table__item{ + margin-top: 8px; + + width: 100%; + + display: flex; + justify-content: space-between; +} +.toggle-table__item p{ + display: block; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + flex-shrink: 0; +} +.toggle-table__item .warning{ + width: 100%; +} +.toggle-table__item .warning p{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: center; +} +.toggle-table__title{ + margin-bottom: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.toggle-table__title--center{ + text-align: center; +} +.toggle-table-item__line{ + margin: 23px 8px 0 8px; + + width: 100%; + + height: 1px; + background: linear-gradient(to right, transparent 50%, #fff 50%), linear-gradient(to right, #333, #333); + background-size: 4px 2px, 100% 2px; + + opacity: .6; +} + + +/* End | Toggle */ + + +.radio-button{ +} +.radio-button__input{ + display: none; +} + + + + +/* detail */ + +/* gallery */ +.gallery{ + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + + padding: 24px; + + display: flex; + align-items: center; + + background: var(--background-white); + + pointer-events: none; + opacity: 0; + transition: opacity .2s ease-out; + + z-index: 300; +} +.gallery.active{ + opacity: 1; + pointer-events: auto; +} +.gallery__close{ + position: absolute; + top: 24px; + right: 24px; + + z-index: 10; +} +.gallery__pagination{ + margin: -12px; +} +.gallery-pagination__item{ + margin: 12px; + + width: 134px; + height: 136px; + + display: flex; + justify-content: center; + align-items: center; + + border: none; + border-radius: 16px; + background: var(--background-grey); +} +.gallery-pagination__item img{ + width: 90%; + max-height: 90%; + + object-fit: contain; +} +.gallery__slider{ + margin-left: 48px; + + padding: 100px; +} +.gallery__slider{ + width: 100%; +} +.gallery__slider .swiper-pagination{ + display: none; +} +.gallery__slider .swiper-button-next::after, +.gallery__slider .swiper-button-prev::after{ + display: none; +} +.gallery-button{ + width: 48px; + height: 48px; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--background-black); + border-radius: 20px; + + background: none; +} +.gallery__slider .swiper-slide{ + display: flex; + justify-content: center; + align-items: center; +} +.gallery__block{ + width: 600px; + height: 774px; + + display: flex; + justify-content: center; + align-items: center; + + background: var(--background-grey); + border-radius: 24px; +} +.gallery__block img{ + width: 90%; + max-height: 90%; + + object-fit: contain; +} +.gallery__wrapper{ + margin: 0 auto; + max-width: 1600px; + + display: flex; + align-items: center; +} +/* .swiper { + width: 600px; + height: 300px; +} */ + +/* gallery */ + + +/* cabinet */ +.cabinet{ + padding: 24px; + + display: flex; + justify-content: space-between; +} +.cabinet__control{ + margin: 24px; + margin-bottom: 0; + + display: none; +} +.cabinet-control__button{ + margin-left: 8px; + + padding: 12px 16px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + background: var(--background-white); + border: 2px solid var(--text-black); + border-radius: 48px; + + transition: opacity .2s ease-out; +} +.cabinet-control__button:first-child{ + margin-left: 0; +} +.cabinet-control__button.active{ + background: var(--background-black); + color: var(--text-white); +} +.cabinet-control__button:hover{ + opacity: .8; +} +.cabinet__orders{ + width: calc(((100% - 48px) / 3) * 2); +} +.cabinet__profile{ + width: calc((100% - 48px) / 3); +} + +.cabinet-card{ + margin-top: 32px; + + padding: 1px; + + border-radius: 20px; +} +.cabinet-card:first-child{ + margin-top: 0; +} +.cabinet-card--green{ + background: var(--background-green); +} +.cabinet-card--green-white{ + background: var(--background-green-white); +} +.cabinet-card--green-white .cabinet-card__content{ + background: none; +} +.cabinet-card--red-blue{ + background: var(--gradient-red); +} +.cabinet-card--grey{ + background: var(--background-9); +} +.cabinet-card__content{ + padding: 23px; + + border-radius: 19px; + + background-color: var(--background-white); +} +.cabinet-card__element{ + margin-top: 24px; + + position: relative; +} +.cabinet-card__element--margin-top-32{ + margin-top: 32px; +} +.cabinet-card__element:first-child, +.cabinet-card__element--margin-top-32:first-child{ + margin-top: 0 +} +.cabinet-card__element-change{ + position: absolute; + top: 14px; + right: 0; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/change-dot.svg); + border: none; + background-color: var(--background-white); + + transition: opacity .2s ease-out; +} +.cabinet-card__element-change:hover{ + opacity: .8; +} +.cabinet-card__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.cabinet-card__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + + color: var(--text-black); +} +.cabinet-card__text--grey{ + color: var(--text-grey); +} +.cabinet-card__label{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + + color: var(--text-3); +} +.cabinet-card__status{ + padding-left: 20px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + + position: relative; +} +.cabinet-card__status--chek{ + color: var(--text-green); +} +.cabinet-card__status--chek::before{ + content: ''; + + position: absolute; + top: 0; + left: 0; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/status-chek.svg); + object-fit: contain; +} +.cabinet-card__status--cancelled{ + color: var(--text-red); +} +.cabinet-card__status--cancelled::before{ + content: ''; + + position: absolute; + top: 0; + left: 0; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/status-cancelled.svg); + object-fit: contain; +} +.cabinet-card__block-accounts{ + display: flex; +} +.cabinet-card__account{ + margin-left: 16px; + + width: 40px; + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; + + background: var(--background-9); + border-radius: 50%; +} +.cabinet-card__account:first-child{ + margin-left: 0; +} +.cabinet-card__block-buttons{ + display: flex; + justify-content: space-between; + align-items: center; +} +.cabinet-card__button{ + padding: 8px 8px 6px 0; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + background: none; + border: none; + + position: relative; + + text-decoration: none; +} +.cabinet-card__button::before{ + content: ''; + + position: absolute; + bottom: 6px; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); + + transition: opacity .2s ease-out; +} +.cabinet-card__button:hover{ + opacity: .8; +} +.cabinet-card__confirm{ + margin-top: 16px; + + border-radius: 20px; + padding: 4px 24px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + + + background: var(--background-black); + color: var(--text-white); + border: none; + + transition: opacity .2s ease-out; +} +.cabinet-card__confirm:hover{ + opacity: .8; +} +.cabinet-card__text, .cabinet-card__label, .cabinet-card__status, .cabinet-card__block-accounts, .cabinet-card__block-buttons{ + margin-top: 8px; +} +.cabinet-card__text:first-child, .cabinet-card__label:first-child, .cabinet-card__status:first-child, .cabinet-card__block-accounts:first-child, .cabinet-card__block-buttons:first-child{ + margin-top: 0px; +} +.cabinet-card__block-add-pets{ + width: 100%; + + display: flex; + align-items: center; + + background: none; + border: none; +} +.cabinet-card-add-pets__circle{ + width: 48px; + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--text-6); + border-radius: 50%; +} +.cabinet-card-add-pets__text{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + + color: var(--text-6); + + position: relative; +} +.cabinet-card-add-pets__text::after{ + content: ''; + + position: absolute; + left: 0; + bottom: -4px; + + width: 100%; + height: 1px; + + background: var(--text-6); +} +.cabinet-card__discount{ + display: flex; + align-items: center; +} +.cabinet-card-discount__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card-discount__percent{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card-discount__percent::after{ + content: '%'; +} +.cabinet-card-discount__arrow{ + display: inline-block; + + margin-left: 6px; + + width: 20px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-breadcrumbs-black.svg); + background-position: center; +} +.cabinet-card__no-orders{ + margin-top: 32px; + + padding: 48px 24px; +} +.cabinet-card-no-orders__element{ + margin-top: 26px; +} +.cabinet-card-no-orders__element:first-child{ + margin-top: 0; +} +.cabinet-card-no-orders__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + text-align: center; + color: var(--text-black); +} +.cabinet-card__pet{ + display: flex; + align-items: center; +} +.cabinet-card-pet__icon{ + width: 48px; + aspect-ratio: 1; + + border-radius: 50%; + background: var(--gradient-blue); +} +.cabinet-card-pet-icon__content{ + margin: 1px; + + width: calc(100% - 2px); + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; + + border-radius: 50%; + background: var(--background-white); +} +.cabinet-card-pet-icon__content img{ + width: 32px; + aspect-ratio: 1; + + object-fit: contain; +} +.cabinet-card-pet__name{ + margin-left: 24px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card__order{ + position: relative; +} +.cabinet-card-order__header{ + display: flex; + justify-content: space-between; + align-items: flex-start; +} +.cabinet-card-order__main{} +.cabinet-card-order-main__date{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-main__number{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-main__number::before{ + content: '№'; +} +.cabinet-card-order__payment{ + display: flex; + align-items: flex-end; + + transition: margin .2s ease-out; +} +.cabinet-card-order-payment__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-payment__price{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card-order-payment__price::after{ + margin-left: 5px; + +} +.cabinet-card-order-payment__price--add::after{ + display: none; +} +.cabinet-card-order__content{ + margin-top: 24px; +} +.cabinet-card-order__content +.cabinet-card-order__status{ + display: flex; + align-items: center; +} +.cabinet-card-order-status__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-status__pointer{ + margin-left: 12px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-status__pointer--grey{ + color: var(--text-6); +} +.cabinet-card-order-status__pointer--green{ + color: var(--text-green); +} +.cabinet-card-order-status__pointer--red{ + color: var(--text-red); +} +.cabinet-card-order__block-detail{ + height: 0; + overflow: hidden; + + transition: height .2s ease-out; +} +.cabinet-card-order__detail{ + padding-top: 24px; +} +.cabinet-card-order-detail__address{} +.cabinet-card-order-detail-address__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-detail-address__text{ + margin-top: 16px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-detail__main{ + margin-top: 24px; + + display: flex; + justify-content: space-between; +} +.cabinet-card-order-detail-main__products{} +.cabinet-card-order-detail-main__product{ + margin-top: 4px; + + display: flex; + align-items: center; +} +.cabinet-card-order-detail-main__product:first-child{ + margin-top: 0; +} +.cabinet-card-order-detail-main-product__img{ + width: 106px; + height: 96px; +} +.cabinet-card-order-detail-main-product__content{ + display: flex; +} +.cabinet-card-order-detail-main-product__description{ + width: 212px; +} +.cabinet-card-order-detail-main-product-description__what{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-detail-main-product-description__with-what{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-6); +} +.cabinet-card-order-detail-main-product__count{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-6); +} +.cabinet-card-order-detail-main-product__count::before{ + margin-right: 4px; + + content: 'x'; +} +.cabinet-card-order-detail-main-product__price{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-black); +} +.cabinet-card-order-detail-main-product__price::after{ + content: ' Р'; +} +.cabinet-card-order-detail-main__links{ + display: flex; + flex-direction: column; +} +.cabinet-card-order-detail-main__link{ + margin-top: 16px; +} +.cabinet-card-order-detail-main__link:first-child{ + margin-top: 0; +} +.cabinet-card-order__open-detail{ + margin-top: 24px; + + padding-right: 24px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: none; + background: none; + + position: relative; +} +.cabinet-card-order__open-detail::after{ + content: ''; + + position: absolute; + top: 6.75px; + right: 0; + + width: 12.5px; + height: 10.5px; + + background-image: url(../img/svg/main/arrow-black.svg); + background-size: contain; + background-position: center; + background-repeat: no-repeat; + + transition: transform .2s; + /* transform: rotate(180deg); */ +} +.cabinet-card-order__detail-short{ + position: absolute; + right: 0; + bottom: 0; + + display: flex; + align-items: center; + + transition: opacity .2s .1s ease-out; +} +.cabinet-card-order-detail-short__item{ + border-radius: 16px; + width: 106px; + height: 96px; +} +.cabinet-card__download{ + margin-top: 32px; +} +.cabinet-card__order.active .cabinet-card-order__detail-short{ + opacity: 0; +} +.cabinet-card__order.active .cabinet-card-order__open-detail::after{ + transform: rotate(180deg); +} +.cabinet-card-order__payment-add{ + display: flex; + flex-direction: column; + align-items: start; +} +.cabinet-card-order__sub-title{ + font-size: 14px; +} +.cabinet-card-order__date{ + font-size: 16px; +} +/* .cabinet-card-no-orders__ */ +.cabinet__subscription-pc{ +} +.cabinet__subscription-mobile{ + display: none; +} +/* cabinet */ + +@media only screen and (max-width: 1600px) { + +.wrapper{ + max-width: 1280px; +} + +.product__item{ + margin: 12px; + + width: calc(33.3% - 24px); +} + +.gallery__wrapper{ + max-width: 1280px; +} + +.header__content::after{ + max-width: 1232px; +} +} + +@media only screen and (max-width: 1365px) { + .gallery__wrapper{ + max-width: 100%; + } + +} + +.subscription{ + margin-top: 12px; +} +.subscription__item{ + padding: 12px 0; + justify-content: space-between; +} +.subscription__item{ + font-size: 20px; +} +.subscription__add{ + color: var(--text-black); +} +.subscription__add-header{ + +} +.subscription__add-title{ + font-size: 24px; +} +.subscription__add-content{ + padding: 24px 0 12px 0; +} +.subscription__add-product{ + align-items: start; +} +.subscription__add-product > *:nth-child(3){ + margin-left: auto; + align-items: center; +} +.subscription__add .cabinet-card-order-detail-main-product-description__what { + font-size: 16px; + line-height: 125%; +} +.subscription__add .cabinet-card-order-detail-main-product-description__with-what { + font-weight: 500; + font-size: 16px; +} +.subscription__add .cabinet-card-order-detail-main-product__count{ + font-weight: 700; + font-size: 16px; + line-height: 100%; +} +.subscription__add .cabinet-card-order-detail-main-product__price{ + font-weight: 500; + font-size: 20px; + line-height: 120%; +} + +/* Стили для планшетов */ +@media only screen and (max-width: 1200px) { +/* header */ +main{ + padding-top: 64px; +} +.main-menu{ + display: none; +} +.header__open-menu{ + display: block; +} +.lang{ + display: none; +} +.header__logo{ + width: 136px; + height: 29px; +} +.header__content{ + height: auto; + + padding: 8px 16px; +} +.mini-profile__item:nth-child(2){ + margin-left: 0; +} +.header::after{ + left: 0; + + width: 100%; +} +.header__pc-menu{ + display: none; +} +.header__phone-menu{ + display: block; +} +.header__menu-block{ + top: 56px; +} +.header__content::after{ + left: 0; + right: 0; + width: 100%; +} +/* header */ + +/* footer */ +.footer{ + margin-top: 0; + + padding: 24px 16px; +} +/* footer */ + +/* breadcrumbs */ +.breadcrumbs{ + display: none; +} +/* breadcrumbs */ + +/* product */ +.product{ + padding: 12px; + padding-top: 20px; +} +.product__title{ + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; +} +.to-know p { + font-size: 18px; +} +.toggle-table__title{ + font-weight: 700; + font-size: 12px; + line-height: 133%; +} +.toggle-table__item p{ + font-weight: 500; + font-size: 12px; + line-height: 133%; +} +.toggle-table-item__line{ + margin-top: 12px; +} +.detail{ + margin: 24px 16px; +} +.back-detail{ + display: inline; +} +.detail-catalot__title{ + font-size: 22px; +} +.product__footer--error{ + margin: 48px 0px 24px; +} +/* product */ + +/* modal */ +.modal{ + padding: 0; +} +.modal__text{ + padding-right: 0; +} +.form__button-pc{ + display: none; +} +.form__button-mobile{ + display: block; +} +.modal-form{ + /* min-height: 100%; + width: 100%; + + border-radius: 0; + border: none; */ +} +.modal__notification{ + margin: 24px; +} +.form-input-phone__list{ + left: 0; +} + +.modal-form-content__line--two{ + flex-wrap: wrap; +} +.modal-form-content__line--two .modal-form-content-line__element{ + margin-top: 24px; + + width: 100%; +} +.modal-form-content__line--two .modal-form-content-line__element:first-child{ + margin-top: 0; +} +.modal-map{ + width: 100%; + + flex-direction: column; + + border-radius: 0; +} +.modal-map__left, .modal-map__right{ + width: 100%; +} +.modal-map__map iframe { + width: 100%; + height: 528px; +} +.modal-map-form__button{ + display: none; +} +.modal-map-form__sub-button{ + margin-top: 64px; + + padding: 0 24px; + + display: flex; + } +/* modal */ + +/* cabinet */ +.cabinet{ + flex-direction: column; + + position: relative; +} +.cabinet__control{ + display: flex; + + position: relative; +} +.cabinet__orders, .cabinet__profile{ + width: calc(100% - 48px); +} +.cabinet__orders, .cabinet__profile{ + position: absolute; + opacity: 0; + + transition: opacity .2s ease-out; +} +.cabinet-content{ + pointer-events:none; +} +.cabinet__orders.active, .cabinet__profile.active{ + opacity: 1; +} +.cabinet__orders.hide, .cabinet__profile.hide{ + position: static; + display: block; + pointer-events:auto; + + width: 100%; +} +.cabinet__subscription-pc{ + display: none; +} +.cabinet__subscription-mobile{ + display: block; + + margin: 24px 24px 0 24px; +} +.cabinet__orders .cabinet-card:nth-child(2){ + margin-top: 0; + } + .cabinet__orders--no-cab .cabinet-card:nth-child(2){ + margin-top: 32px; + } +/* cabinet */ +} + +@media only screen and (max-width: 980px) { +/* product */ +.product__item{ + width: calc(50% - 24px); +} +/* product */ + + +/* detail */ +.detail{ + flex-direction: column; +} +.detail__images{ + display: none; +} +.detail__content{ + width: 100%; +} +.detail__content{ + margin-left: 0; +} + +.detail__images-phone{ + display: block; + + margin-top: 48px; + margin-bottom: 48px; + + position: relative; + + overflow: hidden; +} +.detail__images-phone .swiper-slide{ + display: flex; + justify-content: center; +} +.detail-images-phone__image-block{ + width: 100%; + aspect-ratio: 1; + max-width: 500px; + + display: flex; + justify-content: center; + align-items: center; + + background: var(--background-grey); + border-radius: 16px; +} + +.detail__images-phone .swiper-pagination-bullet{ + width: 8px; + height: 8px; + + border-radius: 50%; + + border: 1px solid #666; + background-color: #666; + + opacity: 1; +} +.detail__images-phone .swiper-pagination-bullet.swiper-pagination-bullet-active{ + background-color: var(--background-white); +} + +.detail__images-phone .swiper-pagination{ + margin-bottom: 19px; +} +.detail__title{ + font-size: 26px; + line-height: 123%; +} +.gallery__slider .swiper-pagination { + display: block; +} +.gallery__pagination{ + display: none; +} + +.gallery__slider .swiper-pagination-bullet{ + width: 8px; + height: 8px; + border-radius: 50%; + border: 1px solid #666; + background-color: #666; + opacity: 1; +} +.gallery__wrapper .gallery-button{ + display: none; +} + +.gallery__slider .swiper-pagination-bullet.swiper-pagination-bullet-active{ + background-color: var(--background-white); +} + +.gallery__slider{ + margin-left:0; + padding: 0px 0px 50px 0px; + /* padding: 40px; */ +} +.gallery__block { + width: 100%; + aspect-ratio: 1; + height: auto; +} +/* detail */ +} + +@media only screen and (max-width: 750px) { +/* cabinet */ +.cabinet-card-order__open-detail{ + margin-top: 144px; +} +.cabinet-card-order__detail-short{ + right: auto; + left: 0; + bottom: 48px; +} +.cabinet-card-order-detail-short__item{ + margin-left: -27px; +} +.cabinet-card-order-detail-short__item:first-child{ + margin-left: 0; +} +.cabinet-card__order.active .cabinet-card-order__open-detail{ + margin-top: 24px; +} +.cabinet-card-order__link{ + margin-top: 144px; +} +/* cabinet */ +} + + +/* Стили для мобильных устройств */ +@media only screen and (max-width: 720px) { +/* product */ +.product__item{ + width: calc(100% - 24px); +} +/* product */ + +/* modal */ +.modal__basket{ + width: 100%; +} +.modal__filter{ + width: 100%; +} +.modal__to-know, +.modal__to-know-submit{ + width: 100%; +} +.modal__button .to-know{ + display: flex; + + background: none; +} +.modal__basket .modal__header { + height: calc(100% - 156px); + margin-bottom: -36px; +} +.modal-basket-item__block-image{ + position: absolute; + width: 80px; +} +.modal-basket-item__image{ + width: 48px; +} +.modal-basket-item__content{ + margin-left: 0; + + padding-left: 96px; +} +.modal-basket-item__control{ + margin-left: -80px; +} +.modal-basket-item__title{ + min-height: 40px; + + font-size: 16px; +} +.modal-basket__item--return{ + flex-direction: column; + align-items: start; +} +.modal-basket__item--return .modal-basket-item__title{ + margin-right: auto; +} +.notification--width-584{ + width: 100%; +} +.notification__title{ + font-size: 20px; +} +.notification__text--center-pc{ + text-align: start; +} +.notification__img{ + height: 360px; +} +.notification__title{ + padding-right: 96px; +} +.modal-form__buttons--two{ + flex-wrap: wrap; +} +.modal-form__buttons--two button, .modal-form__buttons--two input{ + margin-top: 24px; + width: 100%; +} +.modal-form__buttons--two button:first-child, .modal-form__buttons--two input:first-child{ + margin-top: 0; +} +.modal-map__control{ + flex-wrap: wrap; +} +.modal-map-control__item{ + width: calc(100% - 24px); +} +.form__full-mobile{ + width: 100%; + border-radius: 0; + border: none; +} + +.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){ + width: 69px; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){ + +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){ + width: 82px; +} +.form__input{ + padding: 12px 14px; +} +.modal-form--height-100-phone{ + min-height: 100%; +} +/* modal */ + +/* footer */ +.footer__about{ + display: none; +} +.footer__wrapper{ + flex-direction: column; +} +.footer__content{ + width: 100%; +} +.footer__form{ + margin-top: 24px; + margin-left: 0; + + width: 100%; +} +.footer__social-media{ + display: block; + + margin-top: 24px; +} +.footer-about__text{ + padding-top: 35px; + display: block; + text-align: left; +} +.footer__list{ + margin-top: 20px; +} +/* footer */ + +/* detail */ +.toggle__table--two .toggle-table__block{ + width: 100%; +} +.toggle__table--two .toggle-table__block:nth-child(even){ + margin-top: 32px; + margin-left: 0; +} +.toggle__table--three .toggle-table__block:nth-child(1){ + width: 31%; +} +/* detail */ + +/* cabinet */ +.cabinet-card__title{ + font-size: 20px; +} +.cabinet-card__no-orders{ + margin-top: 16px; +} +.cabinet-card-order__header{ + flex-direction: column; +} +.cabinet-card-order__payment{ + margin-top: 16px; +} +.cabinet-card-order-detail__main{ + flex-direction: column; +} +.cabinet-card-order-detail-main__links{ + margin-top: 24px; + + align-items: start; +} +.cabinet-card-order-detail-main-product__img{ + width: 70px; + height: 70px; +} +.cabinet-card-order-detail-main__product{ + margin-top: 16px; + + align-items: start; +} +.cabinet-card-order-detail-main-product__content{ + margin-left: 16px; + + flex-wrap: wrap; + + position: relative; +} +.cabinet-card-order-detail-main-product__description{ + width: 100%; +} +.cabinet-card-order-detail-main-product__count{ + position: absolute; + left: 116px; + bottom: 0; +} +.cabinet-card-order-detail-main-product__price{ + position: absolute; + left: 153px; + bottom: 0; +} +.cabinet-card__content{ + padding-right: 19px; +} +.cabinet-card-order-main__date{ + font-size: 20px; +} +/* .cabinet-card__order.active */ +/* .cabinet-card__order.active */ +/* cabinet */ +} + +@media only screen and (max-width: 576px) { +/* header */ + +/* header */ + +/* product */ +.product__header{ + flex-direction: column; + align-items: start; +} +.product__header .button{ + margin-top: 48px; +} +/* product */ + +/* modal */ +.modal__aside{ + left: 0; +} +.form-input-radio__title span{ + display: block; + width: 100%; + + color: var(--text-grey); +} +.modal-form__title{ + font-size: 20px; +} +/* modal */ + +/* detail */ +.detail-block-form__item, +.detail-block-form__submit{ + min-width: 100%; +} +/* detail */ + +/* cabinet */ + +.cabinet-card-order-detail-main-product__img{ + width: 40px; + height: 40px; +} + +.cabinet-card-order-detail-main-product__count{ + left: auto; + right: 71px; +} +.cabinet-card-order-detail-main-product__price{ + left: auto; + right: 0; +} +.cabinet-card-order__detail-short{ + transition-delay: 0; + transition-duration: 0; +} +/* cabinet */ +} + +@media only screen and (max-width: 720px) { + .subscription__item{ + flex-direction: column; + } + + .subscription__item > p:first-child{ + font-size: 16px; + color: var(--text-6); + } + .subscription__item > p:last-child{ + margin-top: 6px; + } + + .subscription__add-title { + font-size: 20px; + } + + .subscription__add-product{ + flex-wrap: wrap; + } + + .subscription__add-product > *:not(:first-child){ + padding-top: 0; + } + .subscription__add-product .cabinet-card-order-detail-main-product__img{ + width: 73px; + height: 66px; + } + .subscription__add-product .cabinet-card-order-detail-main-product-description__what{ + font-size: 12px; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + } + .subscription__add-product .cabinet-card-order-detail-main-product-description__with-what{ + margin-top: 8px; + + font-size: 12px; + } + .subscription__add-product .cabinet-card-order-detail-main-product__description { + width: calc(100% - 73px); + } + .subscription__add-product .cabinet-card-order-detail-main-product__content{ + position: static; + margin-top: -10px; + margin-left: auto; + width: calc(100% - 73px); + + display: flex; + justify-content: space-between; + align-items: center; + } + .subscription__add-product .cabinet-card-order-detail-main-product__count{ + position: static; + font-size: 12px; + } + .subscription__add-product .cabinet-card-order-detail-main-product__price{ + position: static; + font-size: 16px; + } +} + + + +.order{ + display: flex; +} +.order__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 117%; + text-transform: uppercase; + color: var(--text-black); +} +.order__contacts{ + width: calc(50% - 0.5px); + + padding: 24px; + + border-right: 1px solid #121212; +} +.order-contacts__header{ + display: flex; + justify-content: space-between; + align-items: center; +} +.order-contacts__form{ + margin-top: 24px; +} +.order-contacts__delivery{ + margin-top: 47.5px; + + padding-top: 48px; + + border-top: 1px solid var(--background-grey); +} + +.order-contacts-deliver__item{ + margin-top: 24px; +} +.order-contacts-deliver__date{ + padding: 8px; + + border-radius: 24px; + + background: var(--background-grey); +} +.order-contacts-deliver__date .form-input-radio__item{ + margin-top: 24px; +} +.order-contacts-deliver__date .form-input-radio__item:first-child{ + margin-top: 0; +} +.order__your{ + width: calc(50% - 0.5px); + + padding: 24px 24px 24px 48px; + + background: var(--background-grey); +} +.order-your__products{ + margin-top: 48px; +} +.order-your-products__item{ + margin-top: 16px; + + display: flex; + justify-content: space-between; +} +.order-your-products__left{ + display: flex; +} +.order-your-products__img{ + width: 40px; + aspect-ratio: 1; + + border-radius: 16px; +} +.order-your-products__content{ + margin-left: 16px; +} +.order-your-products__name{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); + + text-decoration: none; +} +.order-your-products__description{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-6); +} +.order-your-products__description span{ + font-weight: 700; +} +.order-your-products__description span::before{ + margin-left: 3px; + + content: 'x '; +} +.order-your-products__right{ + display: flex; +} +.order-your-products__count{ + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-6); +} +.order-your-products__count::before{ + content: 'x'; +} +.order-your-products__price{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-black); +} +.order-your-products__price::after{ + content: 'Р'; +} +.order-your__calculation{ + margin-top: 48px; +} +.order-your__promo{ + display: flex; +} +.order-your-promo__button{ + margin-left: 8px; +} +.order-your-calculation__item{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.order-your-calculation__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.order-your-calculation__value{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 200%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); +} +.order-your-calculation__value--price::after{ + content: ' ₽'; +} +.order-your-calculation__value--discount{ + background: var(--gradient-red); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.order-your-calculation__value--discount::before{ + content: '- '; +} +.order-your-calculation__description{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-9); +} +.order-your-calculation__line{ + margin-top: 23px; + border: 1px solid var(--background-9); +} +.order-your-calculation__result{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 117%; + text-transform: uppercase; + color: var(--text-black); +} +.order-your-calculation__submit{ + margin-top: 48px; +} + +@media only screen and (max-width: 1200px) { +.order{ + display: block; +} +.order__contacts, .order__your{ + border: none; + width: 100%; +} +} + +@media only screen and (max-width: 720px) { +.order__title{ + max-width: 181px; + + font-size: 20px; + line-height: 120%; +} +.order__your{ + margin-top: 16px; +} +.order__contacts{ + padding: 24px 16px; +} +.order__your{ + padding: 40px 16px 9px 16px; +} +.order-your__promo{ + display: block; +} +.order-your-promo__button{ + margin-left: 0; + margin-top: 24px; + + width: 100%; +} +.order-your-products__content{ + max-width: 164px; +} +.order-your-products__count, .order-your-products__price{ + flex-shrink: 0; +} +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-form.js b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/gp-form.js similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-form.js rename to wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/gp-form.js diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-main.js b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/gp-main.js similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-main.js rename to wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/gp-main.js diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-product.js b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/gp-product.js similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-product.js rename to wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/gp-product.js diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/tabs.js b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/tabs.js similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/tabs.js rename to wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/tabs.js diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/toggle.js b/wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/toggle.js similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/toggle.js rename to wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js-single-product/toggle.js diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/component-controller.php b/wp-content/themes/cosmopet/modules/shop/components/single-product/component-controller.php index e635834..c6a7b93 100644 --- a/wp-content/themes/cosmopet/modules/shop/components/single-product/component-controller.php +++ b/wp-content/themes/cosmopet/modules/shop/components/single-product/component-controller.php @@ -103,3 +103,5 @@ add_filter('timber/context', function ($context) use ($context_for_twig) { return array_merge($context, $context_for_twig); }); + + diff --git a/wp-content/themes/cosmopet/modules/shop/module-ajax-controller.php b/wp-content/themes/cosmopet/modules/shop/module-ajax-controller.php index 90a2087..25cddfe 100644 --- a/wp-content/themes/cosmopet/modules/shop/module-ajax-controller.php +++ b/wp-content/themes/cosmopet/modules/shop/module-ajax-controller.php @@ -97,10 +97,10 @@ add_action('wp_ajax_nopriv_get_cart_fragment', 'get_cart_fragment_handler'); function get_cart_fragment_handler() { ob_start(); - Timber::render('shop/cart-contents.twig', Timber::context()); + Timber::render('shop/cart-contents-block.twig', Timber::context()); $contents = ob_get_clean(); ob_start(); - Timber::render('shop/cart-bottom.twig', Timber::context()); + Timber::render('shop/cart-bottom-block.twig', Timber::context()); $cartBottom= ob_get_clean(); $response = array( 'contents' => $contents, diff --git a/wp-content/themes/cosmopet/modules/static-pages/about/template-about.php b/wp-content/themes/cosmopet/modules/static-pages/about/template-about.php index bd80af2..efd4ead 100644 --- a/wp-content/themes/cosmopet/modules/static-pages/about/template-about.php +++ b/wp-content/themes/cosmopet/modules/static-pages/about/template-about.php @@ -8,11 +8,11 @@ diff --git a/wp-content/themes/cosmopet/modules/static-pages/front-page/template-front-page.php b/wp-content/themes/cosmopet/modules/static-pages/front-page/template-front-page.php index a766d58..fff5220 100644 --- a/wp-content/themes/cosmopet/modules/static-pages/front-page/template-front-page.php +++ b/wp-content/themes/cosmopet/modules/static-pages/front-page/template-front-page.php @@ -7,14 +7,14 @@ diff --git a/wp-content/themes/cosmopet/modules/static-pages/production/template-prod-page.php b/wp-content/themes/cosmopet/modules/static-pages/production/template-prod-page.php index 8e6d34a..3621043 100644 --- a/wp-content/themes/cosmopet/modules/static-pages/production/template-prod-page.php +++ b/wp-content/themes/cosmopet/modules/static-pages/production/template-prod-page.php @@ -8,11 +8,11 @@ diff --git a/wp-content/themes/cosmopet/modules/static-pages/where_to_buy/template_wtb.php b/wp-content/themes/cosmopet/modules/static-pages/where_to_buy/template_wtb.php index 567e4e1..7b87875 100644 --- a/wp-content/themes/cosmopet/modules/static-pages/where_to_buy/template_wtb.php +++ b/wp-content/themes/cosmopet/modules/static-pages/where_to_buy/template_wtb.php @@ -4,11 +4,11 @@ Template Name: Where to Buy Template Post Type: page */ -add_action('wp_enqueue_scripts', function() { -wp_enqueue_style('gp-front-page-style', get_template_directory_uri() . '/static/css/front-page.css'); -wp_enqueue_style('gp-wtb-page-style', get_template_directory_uri() . '/static/css/wtb-page.css'); -wp_enqueue_script( 'gp-wtb-page-main', get_template_directory_uri() . '/static/js/wtb-page.js', array(), null, true ); -}); +// add_action('wp_enqueue_scripts', function() { +// wp_enqueue_style('gp-front-page-style', get_template_directory_uri() . '/static/css/front-page.css'); +// wp_enqueue_style('gp-wtb-page-style', get_template_directory_uri() . '/static/css/wtb-page.css'); +// wp_enqueue_script( 'gp-wtb-page-main', get_template_directory_uri() . '/static/js/wtb-page.js', array(), null, true ); +// }); // Инициализация Timber $context = Timber::context(); @@ -133,5 +133,5 @@ $context['partners_logos'] = $partners_logos_formatted; add_filter('wpcf7_autop_or_not', '__return_false'); // Рендеринг шаблона -Timber::render('_pages/wtb.twig', $context); +Timber::render('_pages/where-to-buy-page.twig', $context); ?> \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/static/css/author-style.css similarity index 79% rename from wp-content/themes/cosmopet/modules/author/assets/css/gp-style-desktop.css rename to wp-content/themes/cosmopet/static/css/author-style.css index a89bf48..0d1abc1 100644 --- a/wp-content/themes/cosmopet/modules/author/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/static/css/author-style.css @@ -554,6 +554,165 @@ /* Anons end */ +/* Стили для планшетов */ +@media only screen and (max-width: 992px) { + + .authors h2 { + font-size: 48px; + margin-bottom: 24px; + } + + .authors li { + border-radius: 32px; + width: calc(50% - 12px); + } + + .authors .main-img { + margin-bottom: 24px; + } + + .author { + padding-bottom: 24px; + } + + .author h2 { + font-size: 48px; + } + + .author-head-content { + flex-direction: column; + align-items: flex-start; + } +} + + + +/* Стили для планшетов */ +@media only screen and (max-width: 992px) { + + .author { + padding: 188px 0 36px; + } +} + + + +@media only screen and (max-width: 576px) { + .anons-best__title { + font-size: 26px; + line-height: 32px; + margin-bottom: 12px; + } + + .anons-best__card { + padding-top: 205px; + } + + .anons-best__card .main-img { + height: 300px; + } + + .anons-best__card-body { + padding: 20px 17px; + } + + .anons-best__card-body__title { + font-size: 20px; + line-height: 24px; + margin-bottom: 16px; + } + + .anons-best__card.light .main-img { + height: 197px; + } + + .anons-best__card.light .anons-best__card-body__title { + font-size: 20px; + line-height: 24px; + } + + + + .authors { + padding-bottom: 138px; + } + + .authors h2 { + font-size: 32px; + line-height: 38px; + margin-bottom: 15px; + } + + .authors li { + border-radius: 24px; + width: 100%; + } + + .authors a { + padding: 32px 17px 52px; + } + + .authors .main-img { + width: 180px; + height: 180px; + margin-bottom: 20px; + } + + .authors-name { + font-size: 20px; + line-height: 24px; + } + + .authors-type { + font-size: 18px; + line-height: 24px; + margin-bottom: 20px; + } + + .authors p { + font-size: 16px; + line-height: 20px; + } + + .author-head { + padding-bottom: 15px; + } + + .author-head-content { + margin-bottom: 23px; + } + + .author-head .main-img { + width: 100%; + } + + .author-head h2 { + font-size: 32px; + line-height: 38px; + } + + .author-name { + font-size: 20px; + line-height: 24px; + } + + .author-type { + font-size: 18px; + line-height: 24px; + } + + .author-description { + font-size: 18px; + line-height: 24px; + margin-bottom: 24px; + } + + .author-head p { + font-size: 16px; + line-height: 20px; + } +} + diff --git a/wp-content/themes/cosmopet/static/css/blog-style.css b/wp-content/themes/cosmopet/static/css/blog-style.css new file mode 100644 index 0000000..a67ab3c --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/blog-style.css @@ -0,0 +1,1309 @@ +main{ + padding-top: 72px; +} + +.block-lists_text p { + font-size: 18px!important; +} + +.user a{ + display: flex; + align-items: center; + gap: 5px; +} + +.user a{ + display:flex; + gap:5px; +} + +.user img{ + width:30px; + border-radius:100px; +} + +.anons-best__card-body__datas .logo a{ + display: flex; + align-items: center; + gap:5px; + margin-top: 10px; +} + +.comment-submit-btn{ + border: 1px solid #000000; + border-radius: 28px; + background: var(--main_white); + + padding: 8.5px 16px 8.5px; + font-size: 20px; + font-weight: 500; + line-height: 24px; + margin-top: 15px; + transition: all .5s; +} + +.comment-reply-title , .logged-in-as{ + margin: 10px 0; +} + +.comment-block.answer-block.active{ + margin-top: 15px; +} + +.comment-form-comment textarea{ + padding: 28px 48px; + border-radius: 24px; + background: #f5f5f5 !important; +} + +.comment-respond{ + margin-top: 30px; +} + + +.reply-form-container textarea{ + background-color: #fff !important; + margin-top: 2rem; + width: 100%; +} + + +.anons-article__more-link { + display: flex; + align-items: center; + justify-content: center; +} + +.anons-article__more-link{ + background: var(--accent-3); + color: var(--main_white); + border-radius: 20px; + border: 1px solid var(--main_white); + padding: 16px 24px; + font-size: 20px; + font-weight: 600; + line-height: 24px; + text-transform: uppercase; + margin-right: auto; + margin-left: auto; + width: max-content; +} + +@media (max-width: 1200px) { + .header-navs { + gap: 12px; + } + .header-navs__link { + font-size: 14px; + } + .header-right { + gap: 4px; + } +} + +@media(max-width:600px) { + .article-content h2 { + max-width: 661px; + font-size: 24px!important; + line-height: 40px; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); + } +} + + +/* Author */ +.author { + padding: 111px 0 105px; + overflow: hidden; +} + +.author-content { + max-width: 1022px; + margin: 0 auto; + background: #CAFF81; + border-radius: 60px; + display: flex; + align-items: center; + justify-content: space-between; + padding: 35px 42px 35px 209px; + position: relative; + box-shadow: 6px 9px 20px rgba(0, 0, 0, 15%); +} + +.author-content__star-1 { + position: absolute; + width: 74px; + top: 18px; + left: -15px; + transform: translateX(-100%); +} + +.author-content__star-2 { + position: absolute; + top: 28px; + right: -24px; + transform: translateX(100%); + width: 37px; +} + +.author-content__img { + position: absolute; + left: 9px; + top: -43px; + width: 167px; +} + +.author-content__img.mb { + display: none; +} + +.author-content__title { + color: var(--main_black); + font-size: 36px; + font-weight: bold; + line-height: 40px; +} + +.author-content__link { + border-radius: 20px; + background: var(--main_black); + border: 1px solid var(--main_white); + padding: 15px 24px; + font-size: 20px; + font-weight: 600; + line-height: 24px; + color: var(--main_white); + flex-shrink: 0; +} + +@media only screen and (max-width: 992px) { + + .author { + padding: 188px 0 36px; + } + + .author-content { + padding: 109px 42px 35px; + flex-direction: column; + align-items: flex-start; + } + + .author-content__start-1, + .author-content__start-2 { + display: none; + } + + .author-content__img { + display: none; + left: 50%; + transform: translateX(-50%); + top: -180px; + width: 235px; + } + + .author-content__img.mb { + display: block; + } + + .author-content__title { + width: 100%; + font-size: 26px; + line-height: 32px; + margin-bottom: 16px; + } + + .author-content__title br { + display: none; + } + + .author-content__link { + width: 100%; + text-align: center; + padding: 11px; + } +} + +/* Editorial */ +.editorial { + padding-bottom: 68px; +} + +.editorial-head { + position: relative; + z-index: 1; + max-width: 841px; + margin-bottom: 37px; +} + +.editorial-head__title { + font-size: 82px; + line-height: 96px; + font-weight: bold; + color: var(--main_white); + text-transform: uppercase; +} + +.editorial-head__img { + position: absolute; + z-index: -1; + top: -14px; + right: -20px; + width: 221px; +} + +.editorial-head__star { + position: absolute; + top: 8.26px; + right: -13.5px; + transform: translateX(100%); + width: 87.5px; +} + +.editorial-card__wrap { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 31px 25px; + position: relative; + z-index: 1; +} + +.editorial-card { + border: 2px solid var(--creme-white); + border-radius: 30px; + display: flex; + align-items: stretch; + overflow: hidden; + background: var(--linear); + backdrop-filter: blur(28px); +} + +.editorial-card .main-img { + min-height: 282px; + width: 207px; + border-radius: 29px; + overflow: hidden; + flex-shrink: 0; +} + +.editorial-card:hover .main-img img{ + width: 120%; + height: 120%; +} + +.editorial-card .main-img img { + width: 100%; + height: 100%; + object-fit: cover; + transition: all .5s; +} + +.editorial-card__content { + padding: 42px 19px 19px 35px; +} + +.editorial-card__content-alerts { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 7px; + margin-bottom: 17px; +} + +.editorial-card__content-alerts a { + background: var(--main_black); + border-radius: 16px; + padding: 6px 8px; + font-size: 16px; + font-weight: 500; + line-height: 20px; + color: var(--background); +} + +.editorial-card__content-title { + font-size: 28px; + font-weight: bold; + line-height: 32px; + color: var(--grey-black); + text-transform: uppercase; + margin-bottom: 17px; +} + +.editorial-card__content-data { + display: flex; + flex-wrap: wrap; + gap: 5px 16px; + color: var(--interface_hover); + font-size: 16px; + font-weight: 500; + line-height: 20px; +} + +.editorial-card__content-data ul { + display: flex; + align-items: center; + gap: 16px; +} + +.editorial-card__content-data li { + display: flex; + align-items: center; + gap: 5px; +} + +.editorial-card__content-data .logo img { + width: 24px; + height: 24px; + border-radius: 50%; + object-fit: cover; +} +/* Editorial end */ + +@media (max-width: 1200px) { + .editorial-card__wrap { + grid-template-columns: repeat(1, minmax(0, 1fr)); + } +} + +@media (max-width: 992px) { + .editorial { + padding-bottom: 36px; + } + + .editorial-head { + margin-bottom: 36px; + max-width: 313px; + } + + .editorial-head__title { + font-size: 32px; + line-height: 38px; + } + + .editorial-head__img { + width: 100px; + top: -14px; + right: -22.5px; + } + + .editorial-head__star { + display: none; + } +} + +@media (max-width: 576px) { + .editorial-card { + flex-direction: column; + border-radius: 30px; + position: relative; + } + + .editorial-card .main-img { + width: 100%; + height: 203px; + } + + .editorial-card__content { + padding: 17px 13px 24px; + } + + .editorial-card__content-alerts { + position: absolute; + top: 13px; + left: 8px; + width: calc(100% - 16px); + } + + .editorial-card__content-title { + font-size: 20px; + line-height: 24px; + margin-bottom: 17px; + } + + .editorial-card__content-data { + gap: 5px 16px; + } +} + +.home-swp { + position: relative; +} + +.home-swp__btn { + position: absolute; + bottom: 22px; + left: 50%; + transform: translateX(-50%); + z-index: 2; + display: flex; + align-items: center; + gap: 24px; +} + +.home-swp__btn button { + border: 1px solid var(--main_black); + background: var(--main_white); + width: 56px; + height: 56px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 20px; +} + +.home-swp .swiper-slide:not(.swiper-slide-active) { + height: 0; + overflow: hidden; +} + +.home-card { + border-radius: 60px; + overflow: hidden; + display: flex; + align-items: flex-start; + gap: 24px; + position: relative; +} + +.home-card.bg-yellow { + background: var(--orange_80); +} + +.home-card.bg-green { + background: var(--green_90); +} + +.home-card.bg-violet { + background: var(--violet_90); +} + +.home-card__img { + width: 395px; + border-radius: 60px; + overflow: hidden; + height: 393px; + flex-shrink: 0; +} +.home-card__img:hover img{ + width: 120%; + height: 120%; +} +.home-card__img img { + width: 100%; + height: 100%; + transition: all .5s; + object-fit: cover; +} + +.home-card__content { + padding: 32px 79px 0 0; +} + +.home-card__content-title { + font-size: 36px; + font-weight: bold; + line-height: 40px; + text-transform: uppercase; + max-width: 660px; + margin-bottom: 10px; + color: var(--interface_title); +} + +.home-card__content-description { + color: var(--interface_title); + margin-bottom: 10px; + font-size: 20px; + font-weight: 500; + line-height: 24px; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; +} + +.home-card__content-body { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 12px; +} + +.home-card__content-body__alerts { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 12px; +} + +.home-card__content-body__alerts li { + background: var(--interface_hover); + color: var(--background); + border-radius: 16px; + padding: 6px 8px; + font-size: 16px; + font-weight: 500; + line-height: 20px; +} + +.home-card__content-body__day { + color: var(--interface_hover); + font-size: 14px; + font-weight: 500; + line-height: 16px; +} + +.home-card__content-body__time { + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.home-card__content-body__data { + display: flex; + align-items: center; + gap: 12px; +} + +.home-card__content-body__data>div { + display: flex; + align-items: center; + gap: 4px; + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.home-card__content-body__data>div .main-img { + width: 32px; + height: 32px; + border-radius: 50%; + object-fit: cover; +} + +.home-card__content-body__link { + border: 1px solid #000000; + border-radius: 28px; + background: var(--main_white); + position: absolute; + right: 37px; + bottom: 26px; + padding: 8.5px 16px 8.5px; + font-size: 20px; + font-weight: 500; + line-height: 24px; + transition: all .5s; +} + +.home-card__content-body__link:hover{ + background-color: #000; + color: #fff; +} + +.blog-home{ + padding-bottom: 4rem; +} + +@media only screen and (max-width: 992px) { + .home-swp__btn { + bottom: auto; + top: 93px; + left: -10px; + width: calc(100% + 20px); + justify-content: space-between; + transform: translateX(0); + } + + .home-swp__btn button { + width: 48px; + height: 48px; + border-radius: 20px; + } + + .home-card { + flex-direction: column; + border-radius: 24px; + gap: 17px; + } + + .home-card__img { + height: 234px; + width: 100%; + border-radius: 24px; + } + + .home-card__content { + padding: 0 16px 89px; + } + + .home-card__content-title { + font-size: 20px; + line-height: 24px; + margin-bottom: 15px; + } + + .home-card__content-description { + font-size: 16px; + line-height: 20px; + margin-bottom: 15px; + display: -webkit-box; + -webkit-line-clamp: 5; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; + } + + .home-card__content-body { + gap: 7px; + } + + .home-card__content-body__alerts { + gap: 7px; + } + + .home-card__content-body__alerts li { + font-size: 14px; + line-height: 16px; + padding: 8px; + } + + .home-card__content-body__day { + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__time { + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__data { + gap: 7px; + } + + .home-card__content-body__data>div { + gap: 4px; + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__data .main-img { + width: 32px; + height: 32px; + } + + .home-card__content-body__link { + right: 50%; + bottom: 27px; + transform: translateX(50%); + width: max-content; + } +} + + +.article-content p { + color: var(--grey-black); + font-size: 24px; + line-height: 32px; + font-weight: 500; +} + +.article-content h2 { + max-width: 661px; + font-size: 36px; + line-height: 40px; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); +} +.article-content h3{ + font-size: 28px; + line-height: 120%; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); +} +.article-content h4, .article-content h5, .article-content h6{ + font-size: 22px; + line-height: 120%; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); +} +.indent { + background: #E2F3FF; + border-radius: 32px; + padding: 36px 49px; + display: flex; + flex-direction: column; + gap: 32px; + margin-bottom: 48px; +} + + +/* Discount */ +.discount { + background: radial-gradient(122% 156.56% at 100% 0%, #7E90FF 0%, #8187FF 45%, #F8A6FF 100%) /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */; + border-radius: 32px; + padding: 32px; + position: relative; + z-index: 1; + margin-bottom: 48px; +} + +.discount-title { + font-size: 36px; + font-weight: bold; + line-height: 40px; + text-transform: uppercase; + max-width: 517px; + color: var(--main_black); + margin-bottom: 15px; +} + +.discount-bg { + position: absolute; + top: 4px; + right: 8px; + width: 369px; + z-index: -1; +} + +.discount-bg.mb { + display: none; +} + +.discount-title span { + color: var(--main_white); +} + +.discount-form { + display: flex; + align-items: center; + gap: 8px; + margin-bottom: 15px; +} + +.discount-form input { + width: 280px; + height: 50px; + border: 2px solid var(--main_black); + border-radius: 48px; + background: #F5F5F5; + padding: 0 18px; + font-size: 24px; + font-weight: 500; + color: var(--main_black); +} + +.discount-form button { + border: 2px solid var(--main_black); + background: transparent; + height: 50px; + padding: 0 30px; + font-size: 24px; + font-weight: 500; + color: var(--main_black); + border-radius: 50px; +} + +.discount-form button:hover { + background: var(--interface_title); + color: var(--main_white); +} + +p.discount-description__1 { + font-size: 14px; + font-weight: 500; + color: var(--main_black); + max-width: 621px; + margin-bottom: 15px; +} + +p.discount-description__2 { + font-size: 20px; + font-weight: 500; + color: var(--main_black); +} +/* Discount end */ + + +/* Article home */ +.article-home { + padding-bottom: 36px; +} + +.article-home h1 { + font-size: 64px; + font-weight: bold; + line-height: 120%; + color: var(--main_white); + margin-bottom: 17px; + text-transform: uppercase; +} + +.article-home__data { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 8px 24px; + margin-bottom: 17px; +} + +.article-home__data-alerts { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 8px; +} + +.article-home__data-alerts a { + font-size: 16px; + line-height: 20px; + font-weight: 500; + color: var(--background); + padding: 6px 8px; + border-radius: 20px; + background: var(--main_black); +} + +.article-home__data p { + font-size: 14px; + line-height: 16px; + font-weight: 500; + color: var(--main_white); + display: flex; + align-items: center; + gap: 4px; +} + +.article-home__data .user { + display: flex; + align-items: center; + gap: 7px; + font-size: 14px; + line-height: 16px; + font-weight: 500; + color: var(--main_white); +} + +.article-home__data .user img { + width: 32px; + height: 32px; + border-radius: 50px; + object-fit: cover; +} + +.article-home__card { + width: 100%; + aspect-ratio: 1223/500; +} + +.article-home__card img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 64px; +} + + +@media (min-width: 992px) { + .article-home.position-1 .container { + position: relative; + z-index: 1; + } + + .article-home.position-1 .article-home__card { + width: calc(50% - 12px); + position: absolute; + top: 0; + right: 0; + height: 100%; + z-index: -1; + } + + .article-home.position-1 h1 { + width: calc(50% - 12px); + } + + .article-home.position-1 .article-home__data { + max-width: 406px; + } + + .article-home.position-2 .container { + position: relative; + z-index: 1; + height: 695px; + padding: 45px 42px; + } + + .article-home.position-2 .article-home__card { + position: absolute; + top: 0; + left: 0; + z-index: -1; + width: 100%; + height: 100%; + overflow: hidden; + } + + .article-home.position-2 .article-home__card::before { + content: ""; + width: 100%; + height: 100%; + background: linear-gradient(282.92deg, rgba(255, 255, 255, 0) 50.1%, #FFFFFF 77.26%); + position: absolute; + top: 0; + left: 0; + border-radius: 50px; + } + + .article-home.position-2 h1 { + color: var(--main_black); + max-width: 838px; + } + + .article-home.position-2 .article-home__data { + width: 304px; + } + + .article-home.position-2 .article-home__data p { + color: var(--main_black); + } + + .article-home.position-2 .article-home__data p img { + filter: brightness(0) invert(0) + } + + .article-home.position-2 .article-home__data .user { + color: var(--main_black); + } +} + +.article-content { + background: var(--main_white); + border-radius: 64px; + max-width: 1232px; + margin: 0 auto; + padding: 64px 0 116px; +} + +.article-container { + max-width: 1022px; + margin: 0 auto; + + @media (max-width: 1054px) { + max-width: calc(100% - 32px); + } +} +/* Article home end */ + + + +/* comment */ +.comment { + border-top: 1px solid var(--placeholder); + padding-top: 48px; + margin-top: 100px; +} + +.comment .comment-btn { + display: flex; + align-items: center; + justify-content: center; + gap: 12px; +} + +.comment .comment-btn button { + padding: 12px 24px; + border-radius: 20px; + display: flex; + align-items: center; + gap: 8px; + background: var(--btn-bg); + font-size: 20px; + font-weight: 600; + line-height: 24px; + font-family: var(--font-craftwork); +} + +.comment .comment-btn span { + font-family: var(--font-craftwork); + font-size: 20px; + font-weight: 500; + line-height: 24px; +} + +.comment .comment-title { + font-family: var(--font-craftwork); + font-size: 24px; + font-weight: 700; + line-height: 28px; + color: var(--grey-black); + margin: 48px 0 0 0; +} + +.comment .comment-in { + max-width: 816px; + margin: 0 auto; +} + +.comment .comment-block { + margin-top: 40px; + padding: 28px 48px; + border-radius: 24px; + background: var(--grey-f5); +} + +.comment .comment-block p { + font-size: 20px; + font-weight: 500; + line-height: 24px; + color: var(--grey-black); +} + +.comment .comment-block p a { + color: var(--green-dark); + text-decoration: underline; +} + +.comment .comment-user { + display: flex; + align-items: center; + gap: 12px; +} + +.comment .comment-user img { + width: 48px; + height: 48px; + border-radius: 50%; + flex-shrink: 0; +} + +.comment .comment-user h6 { + font-size: 20px; + font-weight: 700; + line-height: 24px; + color: var(---main_black); + margin-bottom: 5px; +} + +.comment .comment-user span { + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.comment .comment-block p { + margin: 15px 0; + font-size: 20px; + font-weight: 500; + line-height: 24px; + color: var(---main_black); +} + +.comment .comment-btns { + display: flex; + align-items: center; + gap: 33px; +} + +.comment .comment-btns button { + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); + display: flex; + align-items: center; + gap: 5px; +} + +.comment .answer-btn { + margin-bottom: 10px; + font-family: var(--font-craftwork); + font-size: 16px; + font-weight: 700; + line-height: 20px; + color: var(--green-dark); + display: flex; + align-items: center; + gap: 8px; + padding: 6px 24px; + text-transform: lowercase; +} + +.comment .answer-btn svg { + transition: .2s ease; +} + +.comment .answer-btn svg.active { + transform: rotate(180deg); +} + +.comment .answer-block { + display: none; + margin: 0 0 0 54px; +} + +.comment .answer-block.active { + display: block; +} + +.comment .comment-block_text { + margin: 0 !important; +} + +.other-home { + padding-top: 36px !important; +} +/* comment */ + +@media (max-width: 992px) { + .discount { + padding: 32px 24px; + border-radius: 32px; + margin-bottom: 48px; + } + + .discount-title { + font-size: 26px; + line-height: 32px; + margin-bottom: 21px; + } + + .discount-bg { + display: none; + } + + .discount-bg.mb { + display: inline-block; + position: static; + margin-bottom: 21px; + } + + .discount-form { + flex-direction: column; + gap: 21px; + margin-bottom: 21px; + } + + .discount-form img { + display: none; + } + + .discount-form input { + width: 100%; + text-align: center; + } + + .discount-form button { + width: 100%; + text-align: center; + } + + .discount-descriptions { + display: flex; + flex-direction: column-reverse; + } + + p.discount-description__2 { + font-size: 18px; + line-height: 24px; + font-weight: 500; + grid-area: 21px; + margin-bottom: 21px; + } + + p.discount-description__1 { + margin-bottom: 0; + font-size: 12px; + line-height: 120%; + } + + .article-home { + padding-bottom: 36px; + } + + .article-home .container { + display: flex; + flex-direction: column; + } + + .article-home h1 { + order: 1; + font-size: 32px; + line-height: 38px; + margin-bottom: 15px; + } + + .article-home__card { + order: 2; + + } + + .article-home__card img { + border-radius: 32px; + } + + .article-home__data { + gap: 8px 16px; + order: 3; + margin: 15px 0 0; + } + + .article-home__data-alerts { + gap: 16px; + } + + .article-home__data-alerts a { + padding: 6px 8px; + } + + .article-content { + padding: 48px 0; + border-radius: 64px; + } + + .comment .comment-block { + padding: 20px 24px; + margin-top: 28px; + } + + .comment .comment-title { + padding-bottom: 20px; + } + + .comment .answer-block { + margin: 10px 0 0 42px; + } + + .comment .comment-user h6 { + font-size: 16px; + line-height: 24px; + } + + .comment .comment-block p { + font-size: 16px; + line-height: 24px; + } + + .comment .comment-btns { + gap: 14px; + } + + .comment .comment-btns button { + font-size: 12px; + line-height: 16px; + } + + .comment .comment-user span { + font-size: 12px; + line-height: 16px; + } + + +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/css/checkout.css b/wp-content/themes/cosmopet/static/css/checkout.css new file mode 100644 index 0000000..808f7fe --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/checkout.css @@ -0,0 +1,1343 @@ +.order{ + display: flex; +} +.order__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 117%; + text-transform: uppercase; + color: var(--text-black); +} +.order__contacts{ + width: calc(50% - 0.5px); + + padding: 24px; + + border-right: 1px solid #121212; +} +.order-contacts__header{ + display: flex; + justify-content: space-between; + align-items: center; +} +.order-contacts__form{ + margin-top: 24px; +} +.order-contacts__delivery{ + margin-top: 47.5px; + + padding-top: 48px; + + border-top: 1px solid var(--background-grey); +} + +.order-contacts-deliver__item{ + margin-top: 24px; +} +.order-contacts-deliver__date{ + padding: 8px; + + border-radius: 24px; + + background: var(--background-grey); +} +.order-contacts-deliver__date .form-input-radio__item{ + margin-top: 24px; +} +.order-contacts-deliver__date .form-input-radio__item:first-child{ + margin-top: 0; +} +.order__your{ + width: calc(50% - 0.5px); + + padding: 24px 24px 24px 48px; + + background: var(--background-grey); +} +.order-your__products{ + margin-top: 48px; +} +.order-your-products__item{ + margin-top: 16px; + + display: flex; + justify-content: space-between; +} +.order-your-products__left{ + display: flex; + align-items: center; +} +.order-your-products__img{ + width: 40px; + aspect-ratio: 1; + + border-radius: 16px; +} +.order-your-products__content{ + margin-left: 16px; +} +.order-your-products__name{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); + + text-decoration: none; +} +.order-your-products__description{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-6); +} +.order-your-products__description span{ + font-weight: 700; +} +.order-your-products__description span::before{ + margin-left: 3px; + + content: 'x '; +} +.order-your-products__right{ + display: flex; +} +.order-your-products__count{ + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-6); +} +.order-your-products__count::before{ + content: 'x'; +} +.order-your-products__price{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-black); +} + +.order-your__calculation{ + margin-top: 48px; +} +.order-your__promo{ + display: flex; +} +.order-your-promo__button{ + margin-left: 8px; +} +.order-your-calculation__item{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.order-your-calculation__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.order-your-calculation__value{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 200%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); +} + +.order-your-calculation__value--discount{ + background: var(--gradient-red); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +.order-your-calculation__description{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-9); +} +.order-your-calculation__line{ + margin-top: 23px; + border: 1px solid var(--background-9); +} +.order-your-calculation__result{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 117%; + text-transform: uppercase; + color: var(--text-black); +} +.order-your-calculation__submit{ + margin-top: 48px; +} + +@media only screen and (max-width: 1200px) { +.order{ + display: block; +} +.order__contacts, .order__your{ + border: none; + width: 100%; +} +} + +@media only screen and (max-width: 720px) { +.order__title{ + max-width: 181px; + + font-size: 20px; + line-height: 120%; +} +.order__your{ + margin-top: 16px; +} +.order__contacts{ + padding: 24px 16px; +} +.order__your{ + padding: 40px 16px 9px 16px; +} +.order-your__promo{ + display: block; +} +.order-your-promo__button{ + margin-left: 0; + margin-top: 24px; + + width: 100%; +} +.order-your-products__content{ + max-width: 164px; +} +.order-your-products__count, .order-your-products__price{ + flex-shrink: 0; +} +} + + +/* modal */ +.modal{ + position: fixed; + top: 0; + left: 0; + + padding: 20px; + + width: 100%; + height: 100%; + + background: rgba(0, 0, 0, 0.25); + + z-index: 200; + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; + + display: flex; + justify-content: center; + align-items: center; + + overflow-y: auto; + } + .modal.active{ + opacity: 1; + pointer-events: auto; + } + .modal__notification{} + .form__button-mobile{ + display: none; + } + .modal__aside{ + position: fixed; + top: 0; + right: 0; + + width: 0; + height: 100%; + + overflow: hidden; + transition: width .4s ease-out; + } + .modal__item{ + height: 100%; + + padding: 24px; + + background: var(--background-white); + + position: relative; + + display: none; + + filter: blur(10px); + transition: filter .2s ease-out; + } + .modal__item--no-title{ + padding-top: 72px; + } + .modal__item.active{ + display: flex; + flex-direction: column; + justify-content: space-between; + } + .modal__close{ + position: absolute; + top: 32px; + right: 24px; + + width: 24px; + height: 24px; + + border: none; + background: none; + } + .modal__header{} + .modal__title{ + padding-right: 48px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; + color: var(--text-black); + } + .modal__small-title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + color: var(--text-black); + } + .modal__text{ + margin-top: 16px; + + padding-right: 10px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-0); + } + .modal__form-sub{ + margin-top: 48px; + } + .modal-form-sub__submit{ + margin-top: 64px; + } + .modal__block-button{ + margin-top: 24px; + } + .modal__button{ + margin-top: 16px; + } + .modal__button:first-child{ + margin-top: 0; + } + .modal__content{ + margin-top: 24px; + } + .modal__filter{ + width: 400px; + } + .modal__footer{ + border-top: 1px solid var(--text-6); + padding-top: 23px; + } + .modal__block-price{ + display: flex; + justify-content: space-between; + align-items: center; + } + .modal-block-price__title{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + } + .modal-block-price__price{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); + } + .modal-block-price__price::after{ + + } + .modal__basket{ + width: 600px; + } + .modal__to-know, + .modal__to-know-submit{ + width: 412px; + } + + .modal-basket__item{ + padding-top: 23px; + padding-right: 15px; + padding-bottom: 24px; + + display: flex; + + border-top: 1px solid var(--background-grey); + + position: relative; + } + .modal-basket__item::before{ + content: ''; + + position: absolute; + top: 24px; + right: 6px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/basket.svg); + background-repeat: no-repeat; + background-position: center; + + cursor: pointer; + + transition: opacity .2s ease-out; + } + .modal-basket__item:hover .modal-basket__item::before{ + opacity: .8; + } + .modal-basket__item--return{ + padding-right: 5px; + + display: flex; + justify-content: space-between; + align-items: center; + } + .modal-basket__item--return .modal-basket-item__title{ + padding-right: 10px; + } + .modal-basket__item--return::before{ + display: none; + } + .modal-basket-item__return{ + border-radius: 20px; + padding: 4px 24px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + background: var(--background-black); + + border: none; + } + .modal-basket-item__block-image{ + width: 128px; + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; + } + .modal-basket-item__image{ + width: 96px; + aspect-ratio: 1; + + object-fit: contain; + } + .modal-basket-item__content{ + margin-left: 16px; + } + .modal-basket-item__title{ + padding-right: 40px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + } + .modal-basket-item__sub-title{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-black); + } + .modal-basket-item__control{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; + } + .modal-basket-item__price{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: right; + color: var(--text-black); + } + .modal-basket-item__price::after{ + + padding-left: 4px; + } + .modal__basket .modal__header{ + height: calc(100% - 92px); + margin-bottom: -36px; + } + .modal__basket .modal__content{ + height: calc(100% - 100px); + overflow-x: hidden; + + } + .modal__basket .modal__content::-webkit-scrollbar { + width: 7px; + background-color: #f9f9fd; + } + .modal__basket .modal__content::-webkit-scrollbar-thumb { + background-color: var(--background-black); + border-radius: 2px; + } + + .modal-form{ + margin: auto; + + width: 600px; + + padding: 24px; + + border-radius: 20px; + + position: relative; + + display: none; + } + .modal-form.active{ + display: block; + } + .modal-form--white{ + border: 1px solid var(--background-black); + background: var(--background-white); + } + .modal-form--green-gradient{ + background: var(--gradient-blue); + } + .modal-form--width-584{ + width: 584px; + } + .modal-form--cdek{ + width: 836px; + } + .modal-form__close{ + position: absolute; + top: 24px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + border: none; + background: none; + background-image: url(../img/svg/main/black-x.svg); + background-repeat: no-repeat; + background-size: 24px; + background-position: center; + + transition: opacity .2s ease-out; + + z-index: 10; + } + .modal-form__close--white{ + background-image: url(../img/svg/main/white-x.svg); + } + .modal-form__close:hover{ + opacity: .8; + } + .modal-form__button-close{} + .modal-form__title{ + padding-right: 50px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + color: var(--text-dark); + } + .modal-form__text--center{ + text-align: center; + } + .modal-form__text--center-pc{ + text-align: center; + } + .modal-form__title--green-gradient{ + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + } + .modal-form__title--white{ + color: var(--text-white); + } + .modal-form__element{ + margin-top: 24px; + } + .modal-form__element--center{ + display: flex; + justify-content: center; + } + .modal-form__element--top-40{ + margin-top: 40px; + } + .modal-form__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + } + .modal-form__text--weight-500{ + font-weight: 500; + } + .modal-form__text--white{ + color: var(--text-white); + } + .modal-form__img{ + width: 100%; + height: 360px; + + object-fit: contain; + } + .modal-form__content{ + margin-top: 40px; + } + .form-row{ + margin-top: 24px; + } + .form-row:first-child{ + margin-top: 0; + } + .modal-form-content__line--two{ + display: flex; + justify-content: space-between; + } + .modal-form-content__line--two-mobile{ + display: flex; + justify-content: space-between; + } + .modal-form-content__line--two-mobile .modal-form-content-line__element{ + width: calc(50% - 12px); + } + .modal-form-content-line__element{ + position: relative; + } + .modal-form-content-line__element--arrow::after{ + content: ''; + + position: absolute; + right: 16px; + bottom: 16px; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/arrow-right-input.svg); + + pointer-events: none; + } + .modal-form-content__line--two .modal-form-content-line__element{ + width: calc(50% - 12px); + } + .modal-form-content__line--three{ + display: flex; + } + .modal-form-content__line--three .modal-form-content-line__element:nth-child(1){ + width: 85px; + + flex-shrink: 0; + } + .modal-form-content__line--three .modal-form-content-line__element:nth-child(2){ + margin-left: 8px; + + width: 100%; + } + .modal-form-content__line--three .modal-form-content-line__element:nth-child(3){ + margin-left: 8px; + + width: 85px; + + flex-shrink: 0; + } + .modal-form-content__line--margin-top-16{ + margin-top: 16px; + } + .modal-form__buttons{ + margin-top: 32px; + } + .modal-form__buttons--two{ + display: flex; + justify-content: space-between; + align-items: center; + } + + .modal-form__buttons--two button, + .modal-form__buttons--two input{ + width: calc(50% - 20px); + } + .modal-map{ + margin: auto; + + width: 1105px; + + display: none; + + border-radius: 24px; + border: none; + } + .modal-map.active{ + display: flex; + } + .modal-map__left{ + width: 600px; + + padding: 24px; + + position: relative; + } + .modal-map__control{ + margin: 38px -12px -12px -12px; + + display: flex; + } + .modal-map__control--delivery{ + margin-top: 12px; + } + .modal-map-control__item{ + margin: 12px; + + padding: 2px; + + width: calc(50% - 24px); + + background: var(--background-9); + border-radius: 20px; + border: none; + } + .modal-map-control__item.active{ + background: var(--gradient-blue); + } + .modal-map-control__item.active .form-input-radio__circle::before{ + content: ''; + position: absolute; + top: 4px; + left: 4px; + width: 12px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--gradient-blue); + } + .modal-map-control-item__content{ + padding: 14px; + + border-radius: 18px; + + background: var(--background-white); + } + .modal-map-control-item__header{ + display: flex; + align-items: center; + } + .modal-map-control-item__circle{ + padding: 2px; + width: 20px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--background-9); + position: relative; + } + .modal-map-control-item__input{ + display: none; + } + .modal-map-control-item-circle__content{ + width: 16px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--background-white); + } + .modal-map-control__item.active .modal-map-control-item__circle{ + background: var(--gradient-blue); + } + .modal-map-control__item.active .modal-map-control-item__circle::before{ + content: ''; + position: absolute; + top: 4px; + left: 4px; + width: 12px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--gradient-blue); + } + .modal-map-control-item__title{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + } + .modal-map-control-item__description{ + margin-top: 16px; + } + .modal-map-control-item__time{ + font-family: var(--font-family); + font-weight: 500; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + text-align: start; + } + .modal-map-control-item__price{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-6); + + text-align: start; + } + .modal-map__form{ + margin-top: 24px; + } + .modal-map-form__hidden{ + + } + .modal-map-form__button{ + margin-top: 83px; + } + .modal-map-form__sub-button{ + display: none; + } + .modal-map__right{ + padding: 16px 0px 16px 16px; + } + .modal-map__map{ + border: 2px solid var(--background-9); + border-radius: 16px; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + .modal-map__map iframe{ + height: 650px; + } + .modal__age{ + + } + .modal__age > div{ + display: none; + } + .modal__age > div.active{ + display: flex; + } + /* modal */ + + /* toggle */ + .toggle{ + padding-top: 26px; + padding-bottom: 25px; + + border-bottom: 1px solid var(--text-3); + + position: relative; + } + .toggle::after{ + content: ''; + + position: absolute; + top: 24px; + right: 0; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/black-x.svg); + transform: rotate(45deg); + transition: transform .2s; + pointer-events: none; + } + .toggle.active::after{ + transform: rotate(0deg); + } + .toggle__title{ + padding-right: 30px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + cursor: pointer; + } + .toggle__block-content{ + height: 0; + overflow: hidden; + + transition: height .2s ease-out; + } + .toggle__content{ + padding-top: 24px; + } + .toggle-content__item{ + margin: 12px -12px -12px -12px; + + display: flex; + align-items: center; + flex-wrap: wrap; + } + .toggle-content__item:first-child{ + margin-top: 0; + } + .toggle-content__element{ + margin: 12px; + } + .toggle-content__element--width-perc-100{ + width: 100%; + } + .toggle-content__element--width-perc-50{ + width: calc(50% - 24px); + } + .toggle__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + } + /* toggle */ + + /* checkbox */ + .checkbox{ + display: flex; + align-items: center; + + cursor: pointer; + } + .checkbox__state{ + border-radius: 4px; + + width: 18px; + height: 18px; + + border: 2px solid var(--background-black); + background: var(--background-white); + + flex-shrink: 0; + } + .checkbox.active .checkbox__state{ + background-color: var(--background-black); + + background-image: url(../img/svg/main/arrow-selected-white.svg); + background-repeat: no-repeat; + background-position: center; + } + .checkbox__input{ + display: none; + } + .checkbox__label{ + padding-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + cursor: pointer; + } + .checkbox__label a{ + color: #76ce75; + + text-decoration: none; + } + .checkbox--small{ + margin-top: 24px; + } + .checkbox--small .checkbox__label{ + padding-left: 24px; + + font-weight: 500; + font-size: 12px; + line-height: 133%; + } + /* checkbox */ + + + @media (max-width: 720px) { + .modal-map__control{ + flex-wrap: wrap; + } + .modal-map-control__item{ + width: calc(100% - 24px); + } + .form__full-mobile{ + width: 100%; + border-radius: 0; + border: none; + } + } + + .container{ + max-width: 100% !important; + padding: 0; + } + + .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-20_0, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-20_0, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-20_0, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto{ + padding: 0; + } + + .page-title{ + display: none; + } + + + .modal-map-control-item__input{ + display: none; + } + + .page .main-page-wrapper{ + background: #fff !important; + } + + .modal-map-control-item__content{ + width: 100%; + } + + + .woocommerce-shipping-methods{ + display: flex; + } + .visually-hidden { + position: absolute !important; + clip: rect(1px 1px 1px 1px); + clip: rect(1px, 1px, 1px, 1px); + padding: 0 !important; + border: 0 !important; + height: 1px !important; + width: 1px !important; + overflow: hidden; +} +.modal-map-control__item{ + display: flex; + flex-direction: column; +} +.modal-map-control__item > label { + flex-grow: 1; + display: flex; + flex-direction: column; + position: relative; +} +.modal-map-control__item > label > *{ + flex-grow: 1; +} +.modal-map-control__item:nth-child(n){ + margin: 12px; + margin-bottom: 12px; +} +.modal-map-control-item__title{ + text-align: left; +} +.modal-map-control__item > label{ + margin-bottom: 0; +} +.open-pvz-btn{ + position: absolute !important; + clip: rect(1px 1px 1px 1px); + clip: rect(1px, 1px, 1px, 1px); + padding: 0 !important; + border: 0 !important; + height: 1px !important; + width: 1px !important; + overflow: hidden; +} + + +.order-contacts__delivery.loading{ + position: relative; + min-height: 110px; +} +.order-contacts__delivery.loading::before{ + content: ''; + z-index: 150; + height: 100%; + width: 100%; + position: absolute; + top: 0; + left: 0; + background-color: rgba(255,255,255, .6); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' width='200' height='200' style='shape-rendering: auto; display: block; background: transparent;'%3E%3Cg%3E%3Ccircle stroke-dasharray='164.93361431346415 56.97787143782138' r='35' stroke-width='10' stroke='%23000000' fill='none' cy='50' cx='50'%3E%3CanimateTransform keyTimes='0;1' values='0 50 50;360 50 50' dur='1s' repeatCount='indefinite' type='rotate' attributeName='transform'/%3E%3C/circle%3E%3Cg/%3E%3C/g%3E%3C!-- %5Bldio%5D generated by https://loading.io --%3E%3C/svg%3E"); + background-size: 48px; + background-position: center; + background-repeat: no-repeat; + } + + + .shop_table .woocommerce-shipping-totals{ + display:none; + } + + .amount{ + color: inherit; + } + + .order-your-products__item{ + align-items: center; + } + + +.wc_payment_methods.payment_methods.methods{ + display: none; +} + + +.woocommerce-terms-and-conditions-wrapper{ + +} + +.woocommerce-privacy-policy-text p{ + color: #121212 !important; + font-size: 14px; +} + +.woocommerce-privacy-policy-text a{ + color: #121212 !important; + font-size: 14px; + text-decoration: underline; +} + +.woocommerce-terms-and-conditions-checkbox-text a{ + color: #121212 !important; + font-size: 14px; + text-decoration: underline; +} + + + +.woocommerce-checkout.processing { + position: relative; + opacity: 0.5; + pointer-events: none; +} + +.woocommerce-checkout .blockUI.blockOverlay { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(242, 242, 242, 0.7) !important; + z-index: 9999; +} + +.woocommerce-checkout .blockUI-message { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + z-index: 10000; + font-size: 16px; + color: #333; +} + +.cabinet-card__button{ + padding: 8px 8px 6px 0; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + background: none; + border: none; + + position: relative; + + text-decoration: none; +} +.cabinet-card__button::before{ + content: ''; + + position: absolute; + bottom: 6px; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); + + transition: opacity .2s ease-out; +} +.cabinet-card__button:hover{ + opacity: .8; +} + +.form-agreement{ + display: flex; +} +.form-agreement__check{ + display: flex; + align-items: center; +} +.form-agreement__square{ + width: 18px; + aspect-ratio: 1; + + border-radius: 4px; + + border: 2px solid var(--background-black); +} +.form-agreement__label{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-agreement__input{ + display: none; +} +.form-agreement__input:checked + .form-agreement__square{ + border: none; + background: var(--gradient-blue); + + position: relative; +} +.form-agreement__input:checked + .form-agreement__square::after{ + content: ''; + + position: absolute; + top: 1px; + left: 1px; + + width: 16px; + aspect-ratio: 1; + + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.50681 0.784901C9.86151 1.14024 9.86101 1.71584 9.50567 2.07055L4.35112 7.216C3.99601 7.57049 3.42085 7.57024 3.06604 7.21544L0.493317 4.64271C0.138295 4.28769 0.138295 3.71208 0.493317 3.35706C0.848339 3.00204 1.42394 3.00204 1.77897 3.35706L3.70944 5.28753L8.22116 0.783766C8.57649 0.429057 9.1521 0.429565 9.50681 0.784901Z' fill='white'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: center; +} + +.modal-map__control--delivery > p{ + color: #121212; + padding-left: 1rem; +} + +.form-agreement__label a{ + color: #121212; + text-decoration: underline; +} + +.form-input__error.active{ + display: block; +} + +.order-your__promo{ + position: relative; +} + +.woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout{ + display: none; +} + +.woocommerce-terms-and-conditions-wrapper, .woocommerce-message{ + display: none; +} + + +.woocommerce-checkout-review-order-table tr{ + border: none !important; +} + + +.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-20_0, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-20_0, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-20_0, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { + padding-right: 0 !important; + padding-left: 0 !important; +} + +.cdek-office-info{ + display: none; +} + +.quantity-control { + display: flex; + align-items: center; + gap: 10px; + margin-bottom: 10px; +} +.quantity-decrease, .quantity-increase { + background: #f0f0f0; + border: none; + padding: 5px 10px; + cursor: pointer; + font-size: 16px; + border-radius: 4px; +} +.quantity-decrease:hover, .quantity-increase:hover { + background: #e0e0e0; +} +.quantity-input { + width: 50px; + text-align: center; + border: 1px solid #ccc; + border-radius: 4px; + padding: 5px; +} +.remove-item { + background: #ff4d4d; + color: white; + border: none; + padding: 5px 10px; + cursor: pointer; + border-radius: 4px; +} +.remove-item:hover { + background: #e63939; +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/css/footer.css b/wp-content/themes/cosmopet/static/css/footer.css new file mode 100644 index 0000000..80f73f6 --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/footer.css @@ -0,0 +1,276 @@ +/* Footer */ +.footer { + background: var(--main_black); + padding: 40px 0 38px; + color: var(--main_white); +} + +.footer-top { + display: flex; + align-items: stretch; + justify-content: space-between; + gap: 48px; +} + +.footer-top .logo { + display: flex; + align-items: center; + gap: 10px; + font-size: 20px; + font-weight: 500; + text-transform: uppercase; + background: var(--accent-1); + color: transparent; + -webkit-background-clip: text; + background-clip: text; + margin-bottom: 24px; +} + +.footer-content__address { + font-size: 24px; + font-weight: 500; + line-height: 32px; + margin-bottom: 32px; +} + +.footer-content { + width: 100%; +} + +.footer-content ul { + display: flex; + flex-direction: column; + gap: 24px; +} + +.footer-content ul li { + display: flex; + flex-direction: column; + gap: 4px; +} + +.footer-content ul p { + font-size: 16px; + font-weight: bold; + line-height: 20px; +} + +.footer-content ul a { + font-size: 24px; + font-weight: 500; + line-height: 32px; +} + +.footer-content__wrap { + display: flex; + align-items: flex-end; + justify-content: space-between; + width: 100%; +} + +.footer-top__link { + display: flex; + flex-direction: column; + gap: 24px; +} + +.footer-top__link .link-black { + padding: 7px 15px; + color: var(--main_white); + font-size: 24px; + line-height: 32px; + font-weight: 500; + white-space: nowrap; + border: 1px solid var(--main_white); + border-radius: 24px; +} + +.footer-top__link .link-white { + width: 100%; + text-align: center; + background: var(--main_white); + color: var(--main_black); + font-size: 20px; + font-weight: 600; + line-height: 24px; + padding: 12px; + border-radius: 20px; +} + +.footer-contact { + width: 364px; + flex-shrink: 0; + background: var(--accent-1); + border-radius: 24px; + padding: 24px; + display: flex; + flex-direction: column; + gap: 16px; +} + +.footer-contact__title { + color: var(--main_black); + font-size: 24px; + font-weight: 500; + line-height: 32px; +} + +.footer-contact__submit { + width: 100%; + text-align: center; + height: 48px; + border-radius: 16px; + background: var(--main_black); + font-size: 20px; + font-weight: 600; + line-height: 24px; + color: var(--main_white); +} + +.footer-bottom { + display: flex; + align-items: center; + justify-content: space-between; + padding-top: 17px; + margin-top: 19px; + border-top: 1px solid var(--main_white); +} + +.footer-network { + display: flex; + align-items: center; + gap: 32px; +} + +.footer-bottom a { + font-size: 16px; + line-height: 20px; + font-weight: 500; + color: var(--main_white); + opacity: 0.6; + text-decoration: underline; +} +/* Footer end */ +.modal__aside { + position: fixed; + top: 0; + right: 0; + width: 0; + height: 100%; + overflow: hidden; + transition: width .4s ease-out; +} + +.modal__item { + height: 100%; + padding: 24px; + background: var(--background-white); + position: relative; + display: none; + filter: blur(10px); + transition: filter .2s ease-out; +} + +.modal__login { + max-width: 100vw; + width: 400px; +} + +.modal__item.active { + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.modal__close { + position: absolute; + top: 32px; + right: 24px; + width: 24px; + height: 24px; + border: none; + background: none; +} + +.login_wrap { + height: 100%; +} + + +.social-media__icon { + width: 32px; + aspect-ratio: 1; +} + +.login_btn { + margin-bottom: 24px; +} + + +@media only screen and (max-width: 576px) { + .footer { + padding: 24px 0 58px; + } + + .footer-top { + align-items: flex-start; + text-align: left; + gap: 24px; + } + + .footer-content__wrap { + align-items: flex-start; + gap: 24px; + } + + .footer-content { + align-items: flex-start; + } + + .footer-content .logo { + font-size: 20px; + margin-bottom: 24px; + } + + .footer-content__address { + font-size: 18px; + line-height: 24px; + margin-bottom: 32px; + } + + .footer-content ul { + gap: 24px; + } + + .footer-content ul p { + font-size: 16px; + line-height: 20px; + } + + .footer-content ul a { + font-size: 24px; + line-height: 32px; + } + + .footer-top__link .link-white { + display: none; + } + + .footer-contact { + width: 100%; + padding: 16px; + border-radius: 24px; + } + + .footer-contact__title { + color: var(--main_white); + } + + .footer-bottom { + margin-top: 0; + padding-top: 24px; + border: 0; + align-items: flex-start; + gap: 17px; + } +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/css/gp-layout-core.css b/wp-content/themes/cosmopet/static/css/gp-layout-core.css new file mode 100644 index 0000000..7549415 --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/gp-layout-core.css @@ -0,0 +1,2219 @@ +@font-face { + font-family: "Craftwork Grotesk"; + src: local("Craftwork Grotesk Bold"), + url("../fonts/craftwork/CraftworkGrotesk-SemiBold.woff2") format("woff2"), + url("../fonts/craftwork/CraftworkGrotesk-Bold.woff") format("woff"), + url("../fonts/craftwork/craftwork-grotesk-bold.ttf") format("ttf"); + font-weight: 700; +} +@font-face { + font-family: "Craftwork Grotesk"; + src: local("Craftwork Grotesk SemiBold"), + url("../fonts/craftwork/CraftworkGrotesk-SemiBold.woff2") format("woff2"), + url("../fonts/craftwork/CraftworkGrotesk-SemiBold.woff") format("woff"), + url("../fonts/craftwork/craftwork-grotesk-semi-bold.ttf") format("ttf"); + font-weight: 600; +} +@font-face { + font-family: "Craftwork Grotesk"; + src: local("Craftwork Grotesk Medium"), + url("../fonts/craftwork/CraftworkGrotesk-Medium.woff2") format("woff2"), + url("../fonts/craftwork/CraftworkGrotesk-Medium.woff") format("woff"), + url("../fonts/craftwork/craftwork-grotesk-medium.ttf") format("ttf"); + font-weight: 500; +} +@font-face { + font-family: "Craftwork Grotesk"; + src: local("Craftwork Grotesk Regular"), + url("../fonts/craftwork/CraftworkGrotesk-Regular.woff2") format("woff2"), + url("../fonts/craftwork/CraftworkGrotesk-Regular.woff") format("woff"), + url("../fonts/craftwork/craftwork-grotesk-regular.ttf") format("ttf"); + font-weight: 400; +} + +@font-face { + font-family: "Abel"; + src: url('../fonts/Abel/Abel-Regular.ttf'); + font-weight: 400; +} + + +/* din 2014 */ +@font-face { + font-family: "DIN 2014 Rounded"; + src: local("DIN 2014 Rounded Demi"), + url("../fonts/din-2014/din-2014-rounded-demi.woff2") format("woff2"), + url("../fonts/din-2014/din-2014-rounded-demi.woff") format("woff"), + url("../fonts/din-2014/din-2014-rounded-demi.ttf") format("ttf"); + font-weight: 600; +} +@font-face { + font-family: "DIN 2014 Rounded"; + src: local("DIN 2014 Rounded Regular"), + url("../fonts/din-2014/din-2014-rounded-regular.woff2") format("woff2"), + url("../fonts/din-2014/din-2014-rounded-regular.woff") format("woff"), + url("../fonts/din-2014/din-2014-rounded-regular.ttf") format("ttf"); + font-weight: 400; +} +/* din 2014 */ + +/* roboto */ +@font-face { + font-family: "Roboto"; + src: local("Roboto Medium"), + url("../fonts/roboto/Roboto-Medium.woff2") format("woff2"), + url("../fonts/roboto/Roboto-Medium.woff") format("woff"), + url("../fonts/roboto/roboto-medium.ttf") format("ttf"); + font-weight: 500; +} +@font-face { + font-family: "Roboto"; + src: local("Roboto Regular"), + url("../fonts/roboto/Roboto-Regular.woff2") format("woff2"), + url("../fonts/roboto/Roboto-Regular.woff") format("woff"), + url("../fonts/roboto/roboto-medium.ttf") format("ttf"); + font-weight: 400; +} +/* roboto */ + +:root { + /* Colors */ + --radial: radial-gradient(261.43% 263.03% at 124% -28.000000000000004%,rgb(15, 88, 129),rgb(30, 164, 156) 36.979%,rgb(118, 206, 117) 66.667%,rgb(236, 243, 159) 91.146%); + --accent-1: radial-gradient(142.43% 141.42% at 100% 0%, #188892 0%, #1EA49C 45%, #76CE75 90%, #BBE38D 100%); + --accent-2: radial-gradient(2700.48% 141.42% at 100% 0%,rgb(122, 217, 231),rgb(126, 231, 225) 25%,rgb(181, 228, 180) 80%,rgb(215, 238, 170) 100%); + --accent-3: linear-gradient(6deg, rgb(244, 66, 66) 7.584%,rgb(86, 158, 240) 72.371%); + --linear: linear-gradient(-7.39deg, rgb(244, 241, 240) 23.643%,rgba(244, 241, 240, 0.3) 59.827%); + --btn-bg: radial-gradient(100% 174.56% at 100% 0%, #7AD9E7 0%, #7EE7E1 25%, #B5E4B4 80%, #D7EEAA 100%); + --font-family: "Craftwork Grotesk", sans-serif; + --second-family: "DIN 2014 Rounded", sans-serif; + --third-family: "Roboto", sans-serif; + + --main_white: #FFFFFF; + --creme-white: #F4F1F0; + --grey-f5: #F5F5F5; + --main_black: #121212; + --grey-black: #121212; + --bg-light-grey: #F5F5F5; + --interface_title: #333333; + --interface_hover: #666666; + --orange_80: #FFDF99; + --green_90: #D9FFCC; + --green-dark: #76CE75; + --violet_90: #E7CAFF; + --blue_90: #CCE2FF; + --background: #F4F1F0; + --placeholder: #999999; + /* Fonts */ + --font-abel: 'Abel', serif; + --text-dark: #2b2b3b; + --text-red: #fa0505; + --text-green: #2ED15D; + --text-0: #000; + --background-white: #fff; + --background-black: #121212; + --background-grey: #f2f2f2; + --background-green: #2ED15D; + --background-green-white: #f4fff0; + --background-9: #999; + --gradient-blue: radial-gradient(346.57% 244.17% at 149.73% -58.39%, rgb(15, 88, 129) 0%, rgb(30, 164, 156) 51.21689438819885%, rgb(118, 206, 117) 80.70731163024902%, rgb(236, 243, 159) 91.14583134651184%); + --gradient-turquoise: radial-gradient(346.57% 244.17% at 149.73% -58.39%, rgb(117, 196, 240) 0%, rgb(126, 231, 225) 51.21689438819885%, rgb(181, 228, 180) 80.70731163024902%, rgb(237, 244, 164) 91.14583134651184%); + --gradient-red: linear-gradient(22deg, #f44242 0%, #569ef0 100%); + --text-white: #fff; + --text-black: #121212; + --text-grey: #999; + --text-3: #333; + --text-6: #666; + --text-9: #999; + + + + +} + + + + + +body { + background: var(--radial); + font-family: var( --font-family); + font-weight: 500; +} + +.container { + max-width: 1232px; + margin: 0 auto; + + @media (max-width: 1264px) { + max-width: calc(100% - 32px); + } +} + +.form-inp { + height: 48px; + width: 100%; + border: 1px solid var(--placeholder); + border-radius: 20px; + background: var(--main_white); + padding: 0 16px; + color: var(--main_black); + font-size: 20px; + font-weight: 400; + line-height: 24px; +} + +.form-inp::placeholder { + color: var(--placeholder); +} + +.form-inp:hover, +.form-inp:focus { + border-color: var(--main_black); +} + +.form-textarea { + height: 96px; + width: 100%; + resize: none; + background: var(--main_white) !important; + border: 1px solid var(--placeholder) !important;; + padding: 12px 16px; + border-radius: 20px; + color: var(--main_black) !important; + font-size: 20px; + font-weight: 400; + line-height: 24px; +} + +.form-textarea::placeholder { + color: var(--placeholder); +} + +.form-textarea:hover, +.form-textarea:focus { + border-color: var(--main_black); +} + +.article-container{ + gap: 40px; + display: flex; + flex-direction: column; +} + +.article-container a { + text-decoration: underline; +} + + +.indent h2 { + max-width: 661px; + font-size: 36px; + line-height: 40px; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); +} + +textarea{ + font-family: inherit; +} + +@media (max-width: 992px) { + .indent { + padding: 36px 24px; + gap: 24px; + } + + .indent-title { + font-size: 26px; + line-height: 32px; + } + + .indent p { + font-size: 18px; + line-height: 24px; + } +} + +.main_link { + font-size: 24px; + font-weight: 500; + line-height: 28.8px; + color: var(--creme-white, #F4F1F0); + width: 221px; + height: 50px; + padding: 10px; + white-space: nowrap; + display: flex; + align-items: center; + justify-content: center; + border-radius: 48px; + border: 2px solid var(--creme-white, #F4F1F0); + transition: .3s ease all; +} +.main_link:hover { + background-color: #F4F1F0; + color: #121212; +} + + +.discount__sale .discount_form .discount_form-btn:hover { + color: #FFF; +} + +@media only screen and (max-width: 576px) { + .main_link { + font-size: 12px; + line-height: 14.4px; + width: 129px; + height: 29px; + padding: 7px; + } +} + + +.mform { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); + display: flex; + justify-content: center; + align-items: center; + z-index: 1000; + } + + + .mform-content { + + position: relative; + width: 100%; + max-width: 600px; + padding: 40px; + border-radius: 20px; + text-align: center; + box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); + } + + .mform-success .mform-content { + background-color: #fff; + background: url(/wp-content/themes/cosmopet/static/img/form-img.png) center center / contain no-repeat; + background-color: #fff; + background-position: bottom; + height: 500px; + display: flex; + flex-direction: column; + justify-content: center; + gap: 20px; + } + + .mform-success .mform-button-container { + margin-top: 200px; + } + + .mform-message { + font-size: 20px; + } + + .mform-success .mform-image { + position: absolute; + bottom: 0; + left: 50%; + transform: translateX(-50%); + } + + .close-button { + position: absolute; + top: 20px; + right: 20px; + font-size: 28px; + font-weight: bold; + cursor: pointer; + color: #000; + } + + + .mform-title { + + font-size: 32px; + font-weight: bold; + margin-bottom: 10px; + text-transform: uppercase; + } + + /* Стили для второго модального окна - Предложить статью */ + .mform-offer .mform-content { + + background-color: #d6ff9f; + padding-bottom: 30px; + } + + + .mform-subtitle { + font-size: 18px; + margin-bottom: 20px; + } + + .modal-form { + width: 100%; + } + + .form-group { + margin-bottom: 15px; + } + + .form-row { + display: flex; + gap: 2px; + flex-direction: column; + } + + .full-width { + width: 100%; + } + + .half-width { + width: 100%; + max-width: 380px; + } + + .modal-offer input, textarea { + width: 100%!important; + padding: 12px 15px!important; + border: none!important; + border-radius: 20px!important; + font-size: 16px!important; + background-color: white!important; + } + + /* Контейнер для текстового поля и изображения автора */ + .message-container { + position: relative; + display: flex; + } + + textarea { + height: 100px; + resize: none; + padding-right: 130px; /* Оставляем место для изображения */ + } + + /* Стили для изображения автора */ + .author-image { + position: absolute; + right: 15px; + bottom: 0; + width: 130px; + height: 191px; + display: flex; + justify-content: flex-end; + align-items: flex-end; + } + + .author-image img { + max-width: 100%; + max-height: 100%; + } + + .submit-button { + width: 100%; + padding: 15px; + border: none; + border-radius: 25px; + background-color: #111; + color: white; + font-size: 18px; + font-weight: bold; + cursor: pointer; + transition: background-color 0.3s; + } + + .submit-button:hover { + background-color: #333; + } + + /* Адаптивность */ + @media (max-width: 768px) { + + .mform-content { + + width: 90%; + padding: 30px 20px; + } + + .mform-title { + font-size: 18px; + margin-bottom: 5px; + } + + .form-row { + flex-direction: column; + } + + .half-width { + width: 100%; + } + + .author-image { + width: 80px; + height: 80px; + right: 50%; + transform: translateX(50%); + bottom: 0; + top: -10%; + + } + + textarea { + padding-right: 90px; + } + } + +.wrapper { + margin: 0 auto; + max-width: 1600px; +} + + +.modal { + display: none; +} +.modal.active { + display: flex!important; +} +.modal__login.active { + filter: blur(0px); +} + + /* button */ +.button{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-radius: 20px; + text-transform: none; + cursor: pointer; + } + .button--100-perc{ + width: 100%; + } + .button--white{ + padding: 11px 24px; + + text-align: center; + + background-color: var(--background-white); + border: 1px solid var(--background-black); + + transition: opacity .2s ease-out; + } + .button--white:hover{ + opacity: .8; + } + .button--white.active{ + background: var(--background-black); + color: var(--background-white); + } + .button--gradient{ + background: var(--gradient-turquoise); + border: none; + + transition: opacity .2s ease-out; + } + .button--gradient:hover{ + opacity: .8; + } + .button--base{ + padding: 12px 24px; + } + .button--high{ + height: 56px; + + padding: 16px 24px 16px 24px; + + font-weight: 700; + text-align: center; + + position: relative; + } + .button--icon{ + padding-right: 56px; + + text-align: start; + } + .button--filter::after{ + content: ''; + + position: absolute; + top: 16px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/filter.svg); + background-repeat: no-repeat; + background-size: contain; + } + .button--black{ + padding: 7px 15px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + + background: var(--background-black); + border: 1px solid var(--text-white); + } + .button--link{ + text-decoration: none; + } + .button--red-48-px{ + border-radius: 48px; + } + .to-know{ + width: 100%; + + padding: 12px; + + display: flex; + justify-content: center; + + border: none; + + transition: opacity .2s ease-out; + } + .to-know:hover{ + opacity: .8; + } + .to-know p{ + padding-bottom: 4px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-bottom: 1px var(--text-black) solid; + + cursor: pointer; + } + .to-know--background-none{ + background: none; + } + .back{ + margin-top: 16px; + margin-left: 16px; + + padding: 8px; + padding-left: 32px; + + background: none; + border: none; + + } + + + +/* modal */ +.modal{ + position: fixed; + top: 0; + left: 0; + + padding: 20px; + + width: 100%; + height: 100%; + + background: rgba(0, 0, 0, 0.25); + opacity: 0; + z-index: 200; + transition: opacity .2s ease-out; + pointer-events: none; + + display: flex; + justify-content: center; + align-items: center; + + overflow-y: auto; +} +.modal.active{ + opacity: 1; + pointer-events: auto; +} +.modal__notification{} +.form__button-mobile{ + display: none; +} +.modal__aside{ + position: fixed; + top: 0; + right: 0; + + width: 0; + height: 100%; + + overflow: hidden; + transition: width .4s ease-out; +} +.modal__item{ + height: 100%; + overflow: auto; + padding: 24px; + + background: var(--background-white); + + position: relative; + + display: none; + + filter: blur(10px); + transition: filter .2s ease-out; +} +.modal__item--no-title{ + padding-top: 72px; +} +.modal__item.active{ + display: flex; + flex-direction: column; + justify-content: space-between; +} +.modal__close{ + position: absolute; + top: 32px; + right: 24px; + + width: 24px; + height: 24px; + + border: none; + background: none; +} +.modal__header{} +.modal__title{ + padding-right: 48px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; + color: var(--text-black); +} +.modal__small-title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + color: var(--text-black); +} +.modal__text{ + margin-top: 16px; + + padding-right: 10px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-0); +} +.modal__form-sub{ + margin-top: 48px; +} +.modal-form-sub__submit{ + margin-top: 64px; +} +.modal__block-button{ + margin-top: 24px; +} +.modal__button{ + margin-top: 16px; +} +.modal__button:first-child{ + margin-top: 0; +} +.modal__content{ + margin-top: 24px; +} +.modal__filter{ + width: 400px; +} +.modal__footer{ + border-top: 1px solid var(--text-6); + padding-top: 23px; +} +.modal__block-price{ + display: flex; + justify-content: space-between; + align-items: center; +} +.modal-block-price__title{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.modal-block-price__price{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); +} +.modal__basket{ + width: 600px; +} +.modal__to-know, +.modal__to-know-submit, .modal__login{ + width: 412px; +} + +.modal-basket__item{ + padding-top: 23px; + padding-right: 15px; + padding-bottom: 24px; + + display: flex; + + border-top: 1px solid var(--background-grey); + + position: relative; +} +.modal-basket__item::before{ + content: ''; + + position: absolute; + top: 24px; + right: 6px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/basket.svg); + background-repeat: no-repeat; + background-position: center; + + cursor: pointer; + + transition: opacity .2s ease-out; +} +.modal-basket__item:hover .modal-basket__item::before{ + opacity: .8; +} +.modal-basket__item--return{ + padding-right: 5px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.modal-basket__item--return .modal-basket-item__title{ + padding-right: 10px; +} +.modal-basket__item--return::before{ + display: none; +} +.modal-basket-item__return{ + border-radius: 20px; + padding: 4px 24px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + background: var(--background-black); + + border: none; +} +.modal-basket-item__block-image{ + width: 128px; + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; +} +.modal-basket-item__image{ + width: 96px; + aspect-ratio: 1; + + object-fit: contain; +} + +.modal-basket-item__block-image img{ + height: auto; +} +.modal-basket-item__content{ + margin-left: 16px; + width: 100%; +} +.modal-basket-item__title{ + padding-right: 40px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.modal-basket-item__sub-title{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.modal-basket-item__control{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.modal-basket-item__price{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: right; + color: var(--text-black); +} +.modal__basket .modal__header{ + height: calc(100% - 92px); + margin-bottom: -36px; +} +.modal__basket .modal__content{ + height: calc(100% - 100px); + overflow-x: hidden; + +} +.modal__basket .modal__content::-webkit-scrollbar { + width: 7px; + background-color: #f9f9fd; +} +.modal__basket .modal__content::-webkit-scrollbar-thumb { + background-color: var(--background-black); + border-radius: 2px; +} + +.modal-form{ + margin: auto; + + width: 600px; + + padding: 24px; + + border-radius: 20px; + + position: relative; + + display: none; +} +.modal-form.active{ + display: block; +} +.modal-form--white{ + border: 1px solid var(--background-black); + background: var(--background-white); +} +.modal-form--green-gradient{ + background: var(--gradient-blue); +} +.modal-form--width-584{ + width: 584px; +} +.modal-form--cdek{ + width: 836px; +} +.modal-form__close{ + position: absolute; + top: 24px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + border: none; + background: none; + background-image: url(../img/svg/main/black-x.svg); + background-repeat: no-repeat; + background-size: 24px; + background-position: center; + + transition: opacity .2s ease-out; + + z-index: 10; +} +.modal-form__close--white{ + background-image: url(../img/svg/main/white-x.svg); +} +.modal-form__close:hover{ + opacity: .8; +} +.modal-form__button-close{} +.modal-form__title{ + padding-right: 50px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + color: var(--text-dark); +} +.modal-form__text--center{ + text-align: center; +} +.modal-form__text--center-pc{ + text-align: center; +} +.modal-form__title--green-gradient{ + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.modal-form__title--white{ + color: var(--text-white); +} +.modal-form__element{ + margin-top: 24px; +} +.modal-form__element--center{ + display: flex; + justify-content: center; +} +.modal-form__element--top-40{ + margin-top: 40px; +} +.modal-form__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.modal-form__text--weight-500{ + font-weight: 500; +} +.modal-form__text--white{ + color: var(--text-white); +} +.modal-form__img{ + width: 100%; + height: 360px; + + object-fit: contain; +} +.modal-form__content{ + margin-top: 40px; +} +.modal-form-content__line{ + margin-top: 24px; +} +.modal-form-content__line:first-child{ + margin-top: 0; +} +.modal-form-content__line--two{ + display: flex; + justify-content: space-between; +} +.modal-form-content__line--two-mobile{ + display: flex; + justify-content: space-between; +} +.modal-form-content__line--two-mobile .modal-form-content-line__element{ + width: calc(50% - 12px); +} +.modal-form-content-line__element{ + position: relative; +} +.modal-form-content-line__element--arrow::after{ + content: ''; + + position: absolute; + right: 16px; + bottom: 16px; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/arrow-right-input.svg); + + pointer-events: none; +} +.modal-form-content__line--two .modal-form-content-line__element{ + width: calc(50% - 12px); +} +.modal-form-content__line--three{ + display: flex; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){ + width: 85px; + + flex-shrink: 0; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){ + margin-left: 8px; + + width: 100%; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){ + margin-left: 8px; + + width: 85px; + + flex-shrink: 0; +} +.modal-form-content__line--margin-top-16{ + margin-top: 16px; +} +.modal-form__buttons{ + margin-top: 32px; +} +.modal-form__buttons--two{ + display: flex; + justify-content: space-between; + align-items: center; +} + +.modal-form__buttons--two button, +.modal-form__buttons--two input{ + width: calc(50% - 20px); +} +.modal-map{ + margin: auto; + + width: 1105px; + + display: none; + + border-radius: 24px; + border: none; +} +.modal-map.active{ + display: flex; +} +.modal-map__left{ + width: 600px; + + padding: 24px; + + position: relative; +} +.modal-map__control{ + margin: 38px -12px -12px -12px; + + display: flex; +} +.modal-map__control--delivery{ + margin-top: 12px; +} +.modal-map-control__item{ + margin: 12px; + + padding: 2px; + + width: calc(50% - 24px); + + background: var(--background-9); + border-radius: 20px; + border: none; +} +.modal-map-control__item.active{ + background: var(--gradient-blue); +} +.modal-map-control__item.active .form-input-radio__circle::before{ + content: ''; + position: absolute; + top: 4px; + left: 4px; + width: 12px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--gradient-blue); +} +.modal-map-control-item__content{ + padding: 14px; + + border-radius: 18px; + + background: var(--background-white); +} +.modal-map-control-item__header{ + display: flex; + align-items: center; +} +.modal-map-control-item__circle{ + padding: 2px; + width: 20px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--background-9); + position: relative; +} +.modal-map-control-item__input{ + display: none; +} +.modal-map-control-item-circle__content{ + width: 16px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--background-white); +} +.modal-map-control__item.active .modal-map-control-item__circle{ + background: var(--gradient-blue); +} +.modal-map-control__item.active .modal-map-control-item__circle::before{ + content: ''; + position: absolute; + top: 4px; + left: 4px; + width: 12px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--gradient-blue); +} +.modal-map-control-item__title{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); +} +.modal-map-control-item__description{ + margin-top: 16px; +} +.modal-map-control-item__time{ + font-family: var(--font-family); + font-weight: 500; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + text-align: start; +} +.modal-map-control-item__price{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-6); + + text-align: start; +} +.modal-map__form{ + margin-top: 24px; +} +.modal-map-form__hidden{ + +} +.modal-map-form__button{ + margin-top: 83px; +} +.modal-map-form__sub-button{ + display: none; +} +.modal-map__right{ + padding: 16px 0px 16px 16px; +} +.modal-map__map{ + border: 2px solid var(--background-9); + border-radius: 16px; + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.modal-map__map iframe{ + height: 650px; +} +.modal__age{ + +} +.modal__age > div{ + display: none; +} +.modal__age > div.active{ + display: flex; +} +/* modal */ + +/* toggle */ +.toggle{ + padding-top: 26px; + padding-bottom: 25px; + + border-bottom: 1px solid var(--text-3); + + position: relative; +} +.toggle::after{ + content: ''; + position: absolute; + top: 24px; + right: 0; + width: 24px; + aspect-ratio: 1; + background-image: url(../img/svg/main/black-x.svg); + transform: rotate(45deg); + transition: transform .2s; + pointer-events: none; +} +.toggle.active::after{ + transform: rotate(0deg); +} +.toggle__title{ + padding-right: 30px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + cursor: pointer; +} +.toggle__block-content{ + height: 0; + overflow: hidden; + + transition: height .2s ease-out; +} +.toggle__content{ + padding-top: 24px; +} +.toggle-content__item{ + margin: 12px -12px -12px -12px; + + display: flex; + align-items: center; + flex-wrap: wrap; +} +.toggle-content__item:first-child{ + margin-top: 0; +} +.toggle-content__element{ + margin: 12px; +} +.toggle-content__element--width-perc-100{ + width: 100%; +} +.toggle-content__element--width-perc-50{ + width: calc(50% - 24px); +} +.toggle__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +/* toggle */ + +/* checkbox */ +.checkbox{ + display: flex; + align-items: center; + + cursor: pointer; +} +.checkbox__state{ + border-radius: 4px; + + width: 18px; + height: 18px; + + border: 2px solid var(--background-black); + background: var(--background-white); + + flex-shrink: 0; +} +.checkbox.active .checkbox__state{ + background-color: var(--background-black); + + background-image: url(../img/svg/main/arrow-selected-white.svg); + background-repeat: no-repeat; + background-position: center; +} +.checkbox__input{ + display: none; +} +.checkbox__label{ + padding-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + cursor: pointer; +} +.checkbox__label a{ + color: #76ce75; + + text-decoration: none; +} +.checkbox--small{ + margin-top: 24px; +} +.checkbox--small .checkbox__label{ + padding-left: 24px; + + font-weight: 500; + font-size: 12px; + line-height: 133%; +} +/* checkbox */ + +/* radio */ +.radio{ + display: flex; + align-items: center; +} +.radio__input{ + width: 18px; + aspect-ratio: 1; + + accent-color: var(--background-black); + + cursor: pointer; +} +.radio__label{ + padding-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + cursor: pointer; +} +/* radio */ + +.added_to_cart { + display: none!important; +} + +@keyframes slidein { + from { + opacity: 0; + } + + to { + opacity: 1; + } +} + +.remove-item{ + position: absolute; + top: 0; + right: 0; +} + +.modal-basket-item__content{ + position: relative; +} + + +/* Индикатор загрузки для корзины */ +.modal-basket__loading { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(255, 255, 255, 0.8); + display: none; + justify-content: center; + align-items: center; + z-index: 10; + border-radius: 20px; +} + +.modal__item.loading .modal-basket__loading { + display: flex; +} + +.modal-basket__loader { + width: 48px; + height: 48px; + border: 5px solid var(--background-grey); + border-top: 5px solid var(--background-black); + border-radius: 50%; + animation: spin 1s linear infinite; +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + +/* Блок кнопок корзины (адаптированный под ваши стили) */ +.modal-basket__actions { + display: flex; + justify-content: space-between; + gap: 16px; + margin-top: 24px; +} + +.modal-basket__button { + flex: 1; + padding: 16px 24px; + border-radius: 20px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; + + position: relative; + } + .back::before{ + content: ''; + + position: absolute; + top: 8px; + left: 0; + + margin-right: 8px; + + width: 24px; + height: 24px; + + background-image: url(../img/svg/main/arrow-back.svg); + } + + .back::after{ + content: ''; + + position: absolute; + bottom: 6px; + left: 0; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); + } + + .button--high-46{ + padding: 12px 24px; + + font-size: 20px; + font-weight: 700; + line-height: 24px; +} + + +.modal-basket__button--continue { + background: var(--background-white); + border: 1px solid var(--background-black); + color: var(--text-black); +} + +.modal-basket__button--checkout { + background: var(--background-black); + border: 1px solid var(--background-black); + color: var(--text-white); +} + +.modal-basket__button:hover { + opacity: 0.9; + transform: translateY(-2px); +} + + +/* counter */ +.counter{ + display: flex; + align-items: center; +} +.counter__input{ + width: 48px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: center; + color: var(--text-black); + + pointer-events: none; + + background: none; + border: none; +} +.counter__button{ + width: 48px; + height: 48px; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--text-3); + border-radius: 24px; + + background: var(--background-white); + + transition: opacity .2s ease-out; +} +.counter__button:hover{ + opacity: .8; +} +.counter--small{ + +} +.counter--small .counter__button{ + width: 32px; + height: 32px; +} +.counter--small{ + +} +/* counter */ + + +/* button */ +.button{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-radius: 20px; + + cursor: pointer; +} +.button--100-perc{ + width: 100%; + text-align: center; +} +.button--white{ + padding: 11px 24px; + + text-align: center; + + background-color: var(--background-white); + border: 1px solid var(--background-black); + + transition: opacity .2s ease-out; +} +.button--white:hover{ + opacity: .8; +} +.button--white.active{ + background: var(--background-black); + color: var(--background-white); +} +.button--gradient{ + background: var(--gradient-turquoise); + border: none; + + transition: opacity .2s ease-out; +} +.button--gradient:hover{ + opacity: .8; +} +.button--base{ + padding: 12px 24px; +} +.button--high{ + height: 56px; + + padding: 16px 24px 24px 24px; + + font-weight: 700; + text-align: center; + + position: relative; +} +.button--high-46{ + padding: 12px 24px; + + font-size: 20px; + font-weight: 700; + line-height: 24px; +} +.button--icon{ + padding-right: 56px; + + text-align: start; +} +.button--filter::after{ + content: ''; + + position: absolute; + top: 16px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/filter.svg); + background-repeat: no-repeat; + background-size: contain; +} +.button--black{ + padding: 7px 15px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + + background: var(--background-black); + border: 1px solid var(--text-white); +} +.button--link{ + text-decoration: none; +} +.button--red-48-px{ + border-radius: 48px; +} +.to-know{ + /* width: 100%; */ + + padding: 12px 24px 7px 24px; + + display: flex; + justify-content: center; + + border: none; + + transition: opacity .2s ease-out; + text-decoration: none; +} +.to-know:hover{ + opacity: .8; +} +.to-know p{ + padding-bottom: 4px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-bottom: 1px var(--text-black) solid; + + cursor: pointer; +} +.to-know--background-none{ + background: none; +} +.back{ + margin-top: 16px; + margin-left: 16px; + + padding: 8px; + padding-left: 32px; + + background: none; + border: none; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; + + position: relative; +} +.back::before{ + content: ''; + + position: absolute; + top: 8px; + left: 0; + + margin-right: 8px; + + width: 24px; + height: 24px; + + background-image: url(../img/svg/main/arrow-back.svg); +} + +.back::after{ + content: ''; + + position: absolute; + bottom: 6px; + left: 0; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); +} + +.wc-forward { + width: 100%; + padding: 0.5rem 0; + text-align: center; +} +/* button */ + + + .woocommerce form .form-row .input-text { + display: flex; + flex-direction: row; + align-items: center; + padding: 12px 16px; + gap: 8px; + width: 100%; + height: 48px; + background: #FFFFFF; + border: 1px solid #999999; + border-radius: 20px; + margin-top: 6px; + color: #000 + } + + .woocommerce form .form-row textarea.input-text{ + height: 150px; + } + + .woocommerce-button{ + padding: 20px; + margin-top: 20px; + } + + .label__title, .form-row label { + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-3); +} + +.shop_table{ + width: 100%; +} + + +.form-input__error{ + margin-top: 4px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + + color: #f60909; + + display: none; + + position: relative; +} +.form-input__error--absolute{ + position: absolute; + bottom: -19.95px; + left: 0; + + width: 100%; +} +.form__input.error, .form-input__phone.error{ + border-color: #f60909; +} +.form__input.error + .form-input__error{ + display: block; +} +.form-input__phone.error .form-input__error{ + display: block; +} +.form-input-phone__input.error + .form-input__error--absolute::before{ + content: ''; + + position: absolute; + top: -53px; + left: -1px; + + width: 100%; + height: 48px; + + border-radius: 20px; + border: 1px solid #f60909; +} + + + +.form__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + border: 1px solid var(--text-black) !important; + + background: var(--background-white) !important; + + font-family: var(--font-family) !important; + font-weight: 400; + font-size: 20px; + line-height: 120%; + + color: var(--text-black) !important; +} +.form__input::placeholder{ + color: var(--text-grey); +} +.form__input--textarea{ + height: 96px; + resize: none; +} +.form__input--center{ + text-align: center; +} +.form__button{ + width: 100%; + + padding: 12px 24px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + border-radius: 16px; + border: none; + background: var(--background-black); + + cursor: pointer; + + transition: background-color .2s ease-out; +} +.form__button:hover{ + opacity: .8; +} + + +.modalProfile{ + position: fixed; + top: 0; + left: 0; + + padding: 20px; + + width: 100vw; + height: 100vh; + + background: rgba(0, 0, 0, 0.25); + + z-index: 200; + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; + + display: flex; + justify-content: center; + align-items: center; + + overflow-y: auto; + padding-top: 30px; + padding-bottom: 30px; +} +.modalProfile.active{ + opacity: 1; + pointer-events: auto; +} + +.popup-wrap{ + width: 100%; + height: 100%; + display: flex; +} + +.modal-form{ + margin: auto; +} + + +.label-name{ + display: block; + margin-bottom: 6px; +} + +.woocommerce-billing-fields__field-wrapper{ + margin-top: 2rem; +} + +.form__input--textarea{ + height: 96px; + resize: none; +} + +.remote-control__item { + display: none; +} + +.remote-control__item.active { + display: block; +} + +.order-contacts__delivery{ + padding-bottom: 3rem; +} + + +/* breadcrumbs */ +.breadcrumbs{ + margin: 24px; + padding-top: 30px; + display: flex; + align-items: center; +} +.breadcrumbs__item{ + display: block; + + padding: 0px 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-6); + + text-decoration: none; + + position: relative; +} +.breadcrumbs__item:first-child{ + padding-left: 0; +} +.breadcrumbs__item:nth-child(n+2)::before{ + content: ''; + + position: absolute; + top: -2px; + left: -12px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-breadcrumbs.svg); + background-repeat: no-repeat; + background-size: contain; +} +/* breadcrumbs */ + +.home { + padding: 60px 0 68px; +} + +.wc-block-components-checkout-place-order-button{ + background: var(--gradient-turquoise); + border: none; + transition: opacity .2s ease-out; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + border-radius: 20px; +} + +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=email], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=number], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=password], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=tel], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=text], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=url], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=email], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=number], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=password], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=tel], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=text], +.wc-block-checkout__form.wc-block-components-form .wc-block-components-text-input input[type=url], +.wc-block-checkout__form.wc-block-components-form .wc-blocks-components-select .wc-blocks-components-select__select{ + border-radius: 10px; +} + +.mt-m-3{ + margin-top: -3rem; +} + +@media (max-width: 768px) { + .mt-m-3{ + margin-top: 1rem; +} +} + +.container, .container-fluid { + width: 100%; + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; +} + +.about_slider .prev, .about_slider .next { + position: absolute; + top: 50%; + transform: translateY(-50%); + cursor: pointer; + z-index: 99; + background-color: unset; +} + +.about_slider .next { + right: 29vw; +} + +.about_slider .prev { + left: 29vw; +} + +.about_slider .carousel-item { + height: 546px; + padding: 35px 50px 25px 50px; + padding: 50px 53px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + /* background: var(--creme-white, #F4F1F0); */ + background: #ffffff30; + backdrop-filter: blur(6px); + z-index: 1; + box-shadow: -2px 5px 22.9px 0px rgba(0, 0, 0, 0.25); +} + +.about_slider .swiper-slide-active { + backdrop-filter: blur(6px); + width: 429px!important; + z-index: 3; +} + +.about_slider .carousel-item img { + width: auto; +} + +.about_slider .slide_info { + display: flex; + flex-direction: column; + gap: 15px; +} + +.about_slider .carousel-item::after { + content: ''; + background-image: url(/wp-content/themes/cosmopet/static/front-page/img/border.png); + background-size: cover; + /* background: linear-gradient(21.69deg, #F44242 23.69%, #569EF0 66.57%); */ + display: block; + position: absolute; + width: calc(100% + 4px); + height: calc(100% + 4px); + border-radius: 60px; + top: -2px; + left: -2px; + z-index: -2; + transform: translateZ(-1px); +} + +.about_slider .slide_title { + text-transform: uppercase; + font-size: 24px; + font-weight: 700; + line-height: 28.8px; + color: #121212; +} + +.about_slider .slide_text { + font-size: 20px; + font-weight: 500; + line-height: 24px; + color:#121212; +} + +.discount_block .discount_cosmodog { + margin-top: 60px; +} + +.about_slider .carousel .carousel-item { + border-radius: 60px!important; +} + +.about_slider { + padding-top: 0px!important; + position: relative; +} + +.modal__button--center{ + margin-right: auto; + margin-left: auto; + display: block; + width: max-content; +} + +.marketplace { + overflow: hidden!important; +} + +.marketplace__swiper { + overflow: visible!important; +} + +.about_us-title { + font-weight: 700; +} + +.modal__aside { + width: 20vw; + right: -20vw; + transition: right 0.3s ease; +} + +.modal__aside.active { + right: 0; +} + +.button.loading::before { + content: ''; + height: 36px; + width: 36px; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' width='200' height='200' style='shape-rendering: auto; display: block; background: transparent;'%3E%3Cg%3E%3Ccircle stroke-dasharray='164.93361431346415 56.97787143782138' r='35' stroke-width='10' stroke='%23000000' fill='none' cy='50' cx='50'%3E%3CanimateTransform keyTimes='0;1' values='0 50 50;360 50 50' dur='1s' repeatCount='indefinite' type='rotate' attributeName='transform'/%3E%3C/circle%3E%3Cg/%3E%3C/g%3E%3C!-- %5Bldio%5D generated by https://loading.io --%3E%3C/svg%3E"); + background-size: contain; + background-repeat: no-repeat; +} + +.button.loading { + font-size: 0; + color: transparent !important; + position: relative; +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/css/gp-layout-full.css b/wp-content/themes/cosmopet/static/css/gp-layout-full.css new file mode 100644 index 0000000..d95c63b --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/gp-layout-full.css @@ -0,0 +1,170 @@ + +* { + padding: 0; + margin: 0; + box-sizing: border-box; + -webkit-tap-highlight-color: transparent !important; +} + +a { + text-decoration: none; + color: inherit; + display: inline-block; + cursor: pointer; +} + +img { + max-width: 100%; +} + +span, +label { + display: inline-block; +} + +html { + scroll-behavior: smooth; +} + +input, +textarea { + outline: none; + border: 0; + background: transparent; +} + +button, +select { + border: none; + cursor: pointer; + background: transparent; + outline: 0; +} + +address { + font-style: normal; +} + + +ul, +ol, +dl { + list-style: none; + padding: 0; + margin: 0; +} + +p, +h1, +h2, +h3, +h4, +h5, +h6 { + padding: 0; + margin: 0; + font-weight: 500; +} + +input[type=number]::-webkit-inner-spin-button, +input[type=number]::-webkit-outer-spin-button { + -webkit-appearance: none; + -moz-appearance: none; + margin: 0; +} + + +:root { + /* Colors */ + --radial: radial-gradient(261.43% 263.03% at 124% -28.000000000000004%,rgb(15, 88, 129),rgb(30, 164, 156) 36.979%,rgb(118, 206, 117) 66.667%,rgb(236, 243, 159) 91.146%); + --accent-1: radial-gradient(142.43% 141.42% at 100% 0%, #188892 0%, #1EA49C 45%, #76CE75 90%, #BBE38D 100%); + --accent-2: radial-gradient(2700.48% 141.42% at 100% 0%,rgb(122, 217, 231),rgb(126, 231, 225) 25%,rgb(181, 228, 180) 80%,rgb(215, 238, 170) 100%); + --accent-3: linear-gradient(6deg, rgb(244, 66, 66) 7.584%,rgb(86, 158, 240) 72.371%); + --linear: linear-gradient(-7.39deg, rgb(244, 241, 240) 23.643%,rgba(244, 241, 240, 0.3) 59.827%); + --btn-bg: radial-gradient(100% 174.56% at 100% 0%, #7AD9E7 0%, #7EE7E1 25%, #B5E4B4 80%, #D7EEAA 100%); + + + --main_white: #FFFFFF; + --creme-white: #F4F1F0; + --grey-f5: #F5F5F5; + --main_black: #121212; + --grey-black: #121212; + --bg-light-grey: #F5F5F5; + --interface_title: #333333; + --interface_hover: #666666; + --orange_80: #FFDF99; + --green_90: #D9FFCC; + --green-dark: #76CE75; + --violet_90: #E7CAFF; + --blue_90: #CCE2FF; + --background: #F4F1F0; + --placeholder: #999999; + /* Fonts */ + --font-abel: 'Abel', serif; +} + + +body.bg-white { + background: var(--main_white); +} + +.container { + max-width: 1232px; + margin: 0 auto; + + @media (max-width: 1264px) { + max-width: calc(100% - 32px); + } +} + +body.bg-white { + background: var(--main_white); +} + +.form-inp { + height: 48px; + width: 100%; + border: 1px solid var(--placeholder); + border-radius: 20px; + background: var(--main_white); + padding: 0 16px; + color: var(--main_black); + font-size: 20px; + font-weight: 400; + line-height: 24px; +} + +.form-inp::placeholder { + color: var(--placeholder); +} + +.form-inp:hover, +.form-inp:focus { + border-color: var(--main_black); +} + +.form-textarea { + height: 96px; + width: 100%; + resize: none; + background: var(--main_white); + border: 1px solid var(--placeholder); + padding: 12px 16px; + border-radius: 20px; + color: var(--main_black); + font-size: 20px; + font-weight: 400; + line-height: 24px; +} + +.form-textarea::placeholder { + color: var(--placeholder); +} + +.form-textarea:hover, +.form-textarea:focus { + border-color: var(--main_black); +} + +/* Основные стили для компьютера */ + diff --git a/wp-content/themes/cosmopet/static/css/gp-normalize.css b/wp-content/themes/cosmopet/static/css/gp-normalize.css new file mode 100644 index 0000000..ccd51b7 --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/gp-normalize.css @@ -0,0 +1,76 @@ +* { + padding: 0; + margin: 0; + box-sizing: border-box; + -webkit-tap-highlight-color: transparent !important; +} + +a { + text-decoration: none; + color: inherit; + display: inline-block; + cursor: pointer; +} + +img { + max-width: 100%; +} + + +html { + scroll-behavior: smooth; +} + +input, +textarea { + outline: none; + border: 0; + background: transparent; +} + +button, +select { + border: none; + cursor: pointer; + background: transparent; + outline: 0; +} + +address { + font-style: normal; +} + +ul, +ol, +dl { + list-style: none; + padding: 0; + margin: 0; +} + +p, +h1, +h2, +h3, +h4, +h5, +h6 { + padding: 0; + margin: 0; + font-weight: 500; +} + +input[type=number]::-webkit-inner-spin-button, +input[type=number]::-webkit-outer-spin-button { + -webkit-appearance: none; + -moz-appearance: none; + margin: 0; +} + +main.wrapper{ + padding-top: 40px; +} + +.checkout-inline-error-message{ + display: none; +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/css/header.css b/wp-content/themes/cosmopet/static/css/header.css new file mode 100644 index 0000000..df980fc --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/header.css @@ -0,0 +1,810 @@ +.main-menu{ + display: flex; + align-items: center; + + list-style-type: none; + margin-bottom: 0; + } + .main-menu li{ + margin-bottom: 0; + } + .lang p{ + margin-bottom: 0; + } + .main-menu__item{ + margin-left: 24px; + + transition: opacity .2s ease-out; + } + .main-menu__item:first-child{ + margin-left: 0; + } + .main-menu__item:hover{ + opacity: .8; + + background: #f2f2f2; + border-radius: 24px; + } + .header.white .main-menu__item:hover .main-menu__link{ + color: #000 + } + .main-menu__item:active{ + opacity: 1; + } + .main-menu__link{ + display: block; + + padding: 8px 12px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: #000 + + text-decoration: none; + + transition: color .2s ease-out; + } + .main-menu__button{ + padding: 8px 32px 8px 12px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: #000 + + border: none; + border-radius: 24px; + + background: var(--gradient-turquoise); + + position: relative; + } + .main-menu__button::before{ + content: ''; + + position: absolute; + top: 14px; + right: 14px; + + width: 13px; + height: 8px; + + background-image: url(../img/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; + } + + /* lang*/ +.lang{ + position: relative; + } + .lang__open{ + padding: 12px 15px; + + width: 74px; + + background: none; + border: none; + + display: flex; + align-items: center; + + transition: opacity .2s ease-out; + } + .lang__open:hover{ + opacity: .8; + } + .lang-open p{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + + text-align: start; + + color: #000 + } + .lang-open__arrow{ + margin-left: 7.25px; + + display: flex; + justify-content: center; + align-items: center; + } + .lang-open__black{ + + } + .lang-open__white{ + display: none; + } + .lang__content{ + position: absolute; + top: 33px; + left: -13px; + + height: 0; + + border-radius: 6px; + + transition: height .2s ease-out; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + overflow: hidden; + + background-color: #fff; + + z-index: 100; + } + .lang__list{ + width: 104px; + + padding: 8px; + + list-style-type: none; + } + .lang-item{ + margin-top: 8px; + } + .lang-item:first-child{ + margin-top: 0; + } + .lang-item a{ + display: block; + + width: 100%; + text-transform: uppercase; + padding: 4px; + + border-radius: 6px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + text-decoration: none; + + position: relative; + + transition: background-color .2s ease-out; + } + .lang-item a:hover, + .lang-item.current-lang a{ + background-color: var(--background-grey); + } + .lang-item.current-lang a::before{ + content: ''; + + position: absolute; + top: 10px; + right: 8px; + + width: 16px; + height: 12px; + + background-image: url(../img/arrow-selected.svg); + } + /* lang */ + /* mini-profile */ + .mini-profile{ + display: flex; + align-items: center; + } + .mini-profile__item{ + margin-left: 8px; + } + .mini-profile__item:first-child{ + margin-left: 0; + } + .mini-profile__button{ + display: block; + + padding: 8px; + + display: flex; + justify-content: center; + align-items: center; + + background: none; + border: none; + + transition: opacity .2s ease-out; + } + .mini-profile__button:hover{ + opacity: .8; + } + .mini-profile__icon{ + width: 24px; + aspect-ratio: 1; + } + .mini-profile__icon.white{ + display: none; + } + /* mini-profile */ + + + /* header start */ + +.header{ + position: relative; + + background-color: #fff; + + position: fixed; + left: 0; + top: 0; + right: 0; + + z-index: 200; +} +.header::after{ + content: ''; + + position: absolute; + left: auto; + right: auto; + bottom: 0; + + width: 100%; + height: 1px; + + background: var(--text-3); + +} + +.header__content{ + height: 72px; + + padding: 14px 24px; + + display: flex; + justify-content: space-between; + align-items: center; + position: relative; + z-index: 101; +} + +.header__open-menu{ + display: none; + + width: 24px; + aspect-ratio: 1; + + position: relative; + + border: none; + background: none; +} +.header__open-menu::before{ + content: ''; + + position: absolute; + top: 8px; + left: 4px; + + width: 16px; + height: 2px; + + background: #000; + border-radius: 1px; + +} +.header__open-menu::after{ + content: ''; + + position: absolute; + left: 4px; + bottom: 8px; + + width: 16px; + height: 2px; + + background: #000; + border-radius: 1px; +} + +.header__logo{ + width: 182px; + height: 40px; +} +.header__logo-black, +.header__logo-white{ + width: 100%; + height: 100%; +} +.header__logo-white{ +display: none; +} + +.header__menu-block{ + position: absolute; + top: 56px; + left: 0; + + width: 100%; + height: 0; + + overflow: hidden; + transition: height .2s ease-out; + + background-color: #fff; + + z-index: 100; +} + +.header__pc-menu{ + padding: 40px 46px; + + display: flex; + justify-content: center; + + position: relative; + +} +.header__pc-menu::before{ + content: ''; + + position: absolute; + bottom: 0; + left: 46px; + + width: 330px; + height: 248px; + + background-image: url(../img/cat.png); + background-repeat: no-repeat; +} +.header__pc-menu::after{ + content: ''; + + position: absolute; + bottom: 0; + right: 46px; + + width: 330px; + height: 248px; + + background-image: url(../img/dog.png); + background-repeat: no-repeat; +} +.header-pc-menu__content{ + width: 600px; + + display: flex; + justify-content: space-between; +} +.header-pc-menu__item{ + +} +.header-pc-menu__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + color: #000 + + text-decoration: none; +} +.header-pc-menu__list{ + margin-top: 16px; + + list-style-type: none; + padding-left: 0; +} +.header-pc-menu__list-li{ + margin-top: 25px; + margin-bottom: 0; +} +.header-pc-menu__list-li:first-child{ + margin-top: 0; +} +.header-pc-menu__list-li a{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-0); + + text-decoration: none; +} +.header__phone-menu{ + display: none; + + padding: 24px 16px; + + height: calc(100vh - 56px); + + overflow-x: auto; +} +.header-phone-menu__item{ + padding: 16px 0; + + border-top: 1px solid #f4f1f0; + border-bottom: 1px solid #f4f1f0; + + display: flex; + flex-direction: column; +} +.header-phone-menu__item:first-child{ + border-top: 0; +} +.header-phone-menu__item:last-child{ + border-bottom: 0; +} +.header-phone-menu__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: #000 + + text-decoration: none; +} +.header-phone-menu__title--gradient{ + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.header-phone-menu__category{ + margin-top: 16px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 18px; + line-height: 133%; + color: #000 + + text-decoration: none; +} +.header-phone-menu__list{ + margin-top: 24px; + + padding-left: 32px; + + list-style-type: none; +} +.header-phone-menu__list-item{ + margin-top: 16px; +} +.header-phone-menu__list-item:first-child{ + margin-top: 0; +} +.header-phone-menu__list-item a{ + font-family: var(--font-family); + font-weight: 500; + font-size: 16px; + line-height: 125%; + color: #121212; + color: #000 + + text-decoration: none; +} +.header.white{ +background: none; +} +.header.white .header__logo-black{ +display: none; +} +.header.white .header__logo-white{ +display: block; +} +.header.white .main-menu__link{ +color: #fff; +} +.header.white .main-menu__button{ +background: #fff; +} +.header.white .lang__open{ +color: #fff; +} +.header.white::after{ +background: #fff; +} +.header.white .lang-open__black{ +display: none; +} +.header.white .lang-open__white{ +display: block; +} +.header.white .mini-profile__icon.white{ +display: block; +} +.header.white .mini-profile__icon.black{ +display: none; +} +.header.white .header__open-menu::before, +.header.white .header__open-menu::after{ +background: #fff; +} +.header__phone-menu::-webkit-scrollbar { +width: 0px; +} + +.modal__login { + width: 412px; +} +.login_back { + position: absolute; + top: 24px; + left: 24px; + cursor: pointer; +} +.login_wrap { + height: 100%; +} +.login_wrap.hide { + display: none; +} +.login_inner { + display: none; + margin-top: 128px; +} +.login_inner.active { + display: block; +} +.login_title { + color: #121212; + font-size: 24px; + line-height: 28px; + text-transform: uppercase; +} +.login_subtitle { + color: #575775; + font-size: 20px; + line-height: 24px; + margin-top: 16px; +} +.login_subtitle span { + display: block; + margin-top: 8px; +} +.login_input { + margin-top: 40px; +} +.login_input.error input { + border-color: #FA0505; +} +.login_error { + font-size: 12px; + line-height: 16px; + color: #FA0505; + display: none; +} +.login_input.error .login_error { + display: block; +} +.login_input input { + border: 1px solid #999999; + color: #999999; + border-radius: 20px; + padding: 12px 16px; + width: 100%; + font-size: 20px; + line-height: 24px; +} +.login_btn { + padding: 12px 24px; + border-radius: 20px; + display: block; + width: 100%; + height: 54px; + text-transform: none; + font-size: 20px; + line-height: 24px; + text-align: center; +} +.login_btn.btn_gradient { + margin-top: 24px; + background: radial-gradient(100% 174.56% at 100% 0%, #7AD9E7 0%, #7EE7E1 25%, #B5E4B4 80%, #D7EEAA 100%); +} +.login_btn.account_link { + background: #121212; + color: #fff; +} +.login_privacy { + font-size: 12px; + line-height: 16px; + color: #333333; + position: absolute; + bottom: 24px; + left: 24px; + right: 24px; +} +.login_privacy a { + color: #333333; + text-decoration: underline; +} +.login_inner.step_2 .login_subtitle, +.login_success .login_subtitle, +.login_auth .login_subtitle { + color: #121212; +} +.login_timer { + font-size: 20px; + line-height: 24px; + margin-top: 24px; + color: #121212; +} +.js-repeat-code { + display: none; +} +.login_success img { + margin: 40px 0; +} +/* +.wptelegram-login-output-wrap.container { + position: relative; +} +.wptelegram-login-output-wrap.container:after { + content: 'Войти через Telegram'; + position: absolute; + left: 0; + background: radial-gradient(100% 174.56% at 100% 0%, #7AD9E7 0%, #7EE7E1 25%, #B5E4B4 80%, #D7EEAA 100%); + display: flex; + justify-content: center; + align-items: center; + width: 100%; + height: 54px; + top: 0; + border-radius: 20px; + font-weight: var(--btn-font-weight); + font-family: var(--btn-font-family); + font-style: var(--btn-font-style); + font-size: 20px; + line-height: 24px; + cursor: pointer; +} +*/ +.wptelegram-login-output-wrap { + display: flex; + margin-top: 15px; + justify-content: center; +} +@media(max-width: 480px) { + .modal__login { + width: 100%; + } + .login_title { + font-size: 19px; + line-height: 24px; + } +} +/* header end */ + + +/* Стили для планшетов */ +@media only screen and (max-width: 1200px) { + /* header */ + .main-menu{ + display: none; + } + .header__open-menu{ + display: block; + } + .lang{ + display: none; + } + .header__logo{ + width: 136px; + height: 29px; + } + .header__content{ + height: auto; + + padding: 8px 16px; + } + .mini-profile__item:nth-child(2){ + margin-left: 0; + } + .header::after{ + left: 0; + + width: 100%; + } + .header__pc-menu{ + display: none; + } + .header__phone-menu{ + display: block; + } + .header__menu-block{ + top: 36px; + } + .header__content::after{ + left: 0; + right: 0; + width: 100%; + } + /* header */ + + } + + + @media only screen and (max-width: 720px) { + +} + + + +.mini-profile__button--counter { + display: flex +; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 2px; + position: absolute; + background: var(--gradient-turquoise); + border-radius: 10px; + width: 16px; + height: 16px; + border-radius: 50%; + right: 3px; + bottom: 2px; + font-style: normal; + font-weight: 700; + font-size: 9px; + line-height: 16px; + color: #121212; +} + +.mini-profile__button--counter.disabled{ + display: none; +} + +.mini-profile__button{ + position: relative; +} + +#telegram-widget-container { + text-align: center; +} + +@media (max-width: 1200px) { + .header-navs { + gap: 12px; + } + .header-navs__link { + font-size: 14px; + } + .header-right { + gap: 4px; + } +} + +@media only screen and (max-width: 992px) { + .header-navs { + display: none; + } + + .header-container { + height: 56px; + padding: 0; + } + + .header-bars { + display: flex; + align-items: center; + justify-content: center; + } + + .header-logo { + font-size: 16px; + line-height: 20px; + gap: 8px; + } + + .header-logo img { + width: 31px; + flex-shrink: 0; + } + + .header-lang { + display: none; + } +} diff --git a/wp-content/themes/cosmopet/static/css/libs/swiper-bundle.css b/wp-content/themes/cosmopet/static/css/libs/swiper-bundle.css new file mode 100644 index 0000000..cd5a440 --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/libs/swiper-bundle.css @@ -0,0 +1,735 @@ +/** + * Swiper 11.0.5 + * Most modern mobile touch slider and framework with hardware accelerated transitions + * https://swiperjs.com + * + * Copyright 2014-2023 Vladimir Kharlampidi + * + * Released under the MIT License + * + * Released on: November 22, 2023 + */ + +/* FONT_START */ +@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; +} +/* FONT_END */ +:root { + --swiper-theme-color: #007aff; + /* + --swiper-preloader-color: var(--swiper-theme-color); + --swiper-wrapper-transition-timing-function: initial; + */ +} +: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; + /* Fix of Webkit flickering */ + 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; +} +/* Auto Height */ +.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; +} +/* 3D Effects */ +.swiper-3d.swiper-css-mode .swiper-wrapper { + perspective: 1200px; +} +.swiper-3d .swiper-wrapper { + transform-style: preserve-3d; +} +.swiper-3d { + perspective: 1200px; +} +.swiper-3d .swiper-slide, +.swiper-3d .swiper-cube-shadow { + transform-style: preserve-3d; +} +/* CSS Mode */ +.swiper-css-mode > .swiper-wrapper { + overflow: auto; + scrollbar-width: none; + /* For Firefox */ + -ms-overflow-style: none; + /* For Internet Explorer and Edge */ +} +.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); +} +/* Slide styles start */ +/* 3D Shadows */ +.swiper-3d .swiper-slide-shadow, +.swiper-3d .swiper-slide-shadow-left, +.swiper-3d .swiper-slide-shadow-right, +.swiper-3d .swiper-slide-shadow-top, +.swiper-3d .swiper-slide-shadow-bottom, +.swiper-3d .swiper-slide-shadow, +.swiper-3d .swiper-slide-shadow-left, +.swiper-3d .swiper-slide-shadow-right, +.swiper-3d .swiper-slide-shadow-top, +.swiper-3d .swiper-slide-shadow-bottom { + 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, 0.15); +} +.swiper-3d .swiper-slide-shadow-left { + background-image: linear-gradient(to left, rgba(0, 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, 0.5), rgba(0, 0, 0, 0)); +} +.swiper-3d .swiper-slide-shadow-top { + background-image: linear-gradient(to top, rgba(0, 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, 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:not(.swiper-watch-progress) .swiper-lazy-preloader, +.swiper-watch-progress .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 { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} +/* Slide styles end */ +.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-navigation-top-offset: 50%; + --swiper-navigation-sides-offset: 10px; + --swiper-navigation-color: var(--swiper-theme-color); + */ +} +.swiper-button-prev, +.swiper-button-next { + 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-prev.swiper-button-disabled, +.swiper-button-next.swiper-button-disabled { + opacity: 0.35; + cursor: auto; + pointer-events: none; +} +.swiper-button-prev.swiper-button-hidden, +.swiper-button-next.swiper-button-hidden { + opacity: 0; + cursor: auto; + pointer-events: none; +} +.swiper-navigation-disabled .swiper-button-prev, +.swiper-navigation-disabled .swiper-button-next { + display: none !important; +} +.swiper-button-prev svg, +.swiper-button-next svg { + width: 100%; + height: 100%; + object-fit: contain; + transform-origin: center; +} +.swiper-rtl .swiper-button-prev svg, +.swiper-rtl .swiper-button-next 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; +} +/* Navigation font start */ +.swiper-button-prev:after, +.swiper-button-next: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'; +} +/* Navigation font end */ +:root { + /* + --swiper-pagination-color: var(--swiper-theme-color); + --swiper-pagination-left: auto; + --swiper-pagination-right: 8px; + --swiper-pagination-bottom: 8px; + --swiper-pagination-top: auto; + --swiper-pagination-fraction-color: inherit; + --swiper-pagination-progressbar-bg-color: rgba(0,0,0,0.25); + --swiper-pagination-progressbar-size: 4px; + --swiper-pagination-bullet-size: 8px; + --swiper-pagination-bullet-width: 8px; + --swiper-pagination-bullet-height: 8px; + --swiper-pagination-bullet-border-radius: 50%; + --swiper-pagination-bullet-inactive-color: #000; + --swiper-pagination-bullet-inactive-opacity: 0.2; + --swiper-pagination-bullet-opacity: 1; + --swiper-pagination-bullet-horizontal-gap: 4px; + --swiper-pagination-bullet-vertical-gap: 6px; + */ +} +.swiper-pagination { + position: absolute; + text-align: center; + transition: 300ms 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; +} +/* Common Styles */ +.swiper-pagination-fraction, +.swiper-pagination-custom, +.swiper-horizontal > .swiper-pagination-bullets, +.swiper-pagination-bullets.swiper-pagination-horizontal { + bottom: var(--swiper-pagination-bottom, 8px); + top: var(--swiper-pagination-top, auto); + left: 0; + width: 100%; +} +/* Bullets */ +.swiper-pagination-bullets-dynamic { + overflow: hidden; + font-size: 0; +} +.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { + transform: scale(0.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(0.66); +} +.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { + transform: scale(0.33); +} +.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { + transform: scale(0.66); +} +.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { + transform: scale(0.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, 0.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-vertical > .swiper-pagination-bullets, +.swiper-pagination-vertical.swiper-pagination-bullets { + right: var(--swiper-pagination-right, 8px); + left: var(--swiper-pagination-left, auto); + top: 50%; + transform: translate3d(0px, -50%, 0); +} +.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet, +.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet { + margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0; + display: block; +} +.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, +.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { + top: 50%; + transform: translateY(-50%); + width: 8px; +} +.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, +.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { + display: inline-block; + transition: 200ms transform, + 200ms 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: 200ms transform, + 200ms left; +} +.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { + transition: 200ms transform, + 200ms right; +} +/* Fraction */ +.swiper-pagination-fraction { + color: var(--swiper-pagination-fraction-color, inherit); +} +/* Progress */ +.swiper-pagination-progressbar { + background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 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-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, +.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite { + width: 100%; + height: var(--swiper-pagination-progressbar-size, 4px); + left: 0; + top: 0; +} +.swiper-vertical > .swiper-pagination-progressbar, +.swiper-pagination-progressbar.swiper-pagination-vertical, +.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, +.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite { + width: var(--swiper-pagination-progressbar-size, 4px); + height: 100%; + left: 0; + top: 0; +} +.swiper-pagination-lock { + display: none; +} +:root { + /* + --swiper-scrollbar-border-radius: 10px; + --swiper-scrollbar-top: auto; + --swiper-scrollbar-bottom: 4px; + --swiper-scrollbar-left: auto; + --swiper-scrollbar-right: 4px; + --swiper-scrollbar-sides-offset: 1%; + --swiper-scrollbar-bg-color: rgba(0, 0, 0, 0.1); + --swiper-scrollbar-drag-bg-color: rgba(0, 0, 0, 0.5); + --swiper-scrollbar-size: 4px; + */ +} +.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, 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-vertical > .swiper-scrollbar, +.swiper-scrollbar.swiper-scrollbar-vertical { + 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, 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; +} +/* Zoom container styles start */ +.swiper-zoom-container { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + text-align: center; +} +.swiper-zoom-container > img, +.swiper-zoom-container > svg, +.swiper-zoom-container > canvas { + max-width: 100%; + max-height: 100%; + object-fit: contain; +} +/* Zoom container styles end */ +.swiper-slide-zoomed { + cursor: move; + touch-action: none; +} +/* a11y */ +.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-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: 0.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; +} +/* Cube slide shadows start */ +.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top, +.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 { + z-index: 0; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; +} +/* Cube slide shadows end */ +.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; +} +/* Flip slide shadows start */ +.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top, +.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 { + z-index: 0; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; +} +/* Flip slide shadows end */ +.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; +} diff --git a/wp-content/themes/cosmopet/static/css/profile.css b/wp-content/themes/cosmopet/static/css/profile.css new file mode 100644 index 0000000..227b7b1 --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/profile.css @@ -0,0 +1,3240 @@ +/* cabinet */ +.cabinet{ +padding: 24px; + +display: flex; +justify-content: space-between; +} +.cabinet__control{ +margin: 24px; +margin-bottom: 0; +display: none; +} +.cabinet-control__button{ +margin-left: 8px; + +padding: 12px 16px; + +font-family: var(--font-family); +font-weight: 500; +font-size: 20px; +line-height: 120%; +color: var(--text-black); + +background: var(--background-white); +border: 2px solid var(--text-black); +border-radius: 48px; + +transition: opacity .2s ease-out; +} +.cabinet-control__button:first-child{ +margin-left: 0; +} +.cabinet-control__button.active{ +background: var(--background-black); +color: #fff; +} +.cabinet-control__button:hover{ +opacity: .8; +} +.cabinet__orders{ +width: calc(((100% - 48px) / 3) * 2); +} +.cabinet__profile{ +width: calc((100% - 48px) / 3); +} + +.cabinet-card{ +margin-top: 32px; + +padding: 1px; + +border-radius: 20px; +} +.cabinet-card:first-child{ +margin-top: 0; +} +.cabinet-card--green{ +background: var(--background-green); +} +.cabinet-card--green-white{ +background: var(--background-green-white); +} +.cabinet-card--green-white .cabinet-card__content{ +background: none; +} +.cabinet-card--red-blue{ +background: var(--gradient-red); +} +.cabinet-card--grey{ +background: var(--background-9); +} +.cabinet-card__content{ +padding: 23px; + +border-radius: 19px; + +background-color: var(--background-white); +} +.cabinet-card__element{ +margin-top: 24px; + +position: relative; +} +.cabinet-card__element--margin-top-32{ +margin-top: 32px; +} +.cabinet-card__element:first-child, +.cabinet-card__element--margin-top-32:first-child{ +margin-top: 0 +} +.cabinet-card__element-change{ +position: absolute; +top: 14px; +right: 0; + +width: 24px; +aspect-ratio: 1; + +background-image: url(../img/svg/main/change-dot.svg); +border: none; +background-color: var(--background-white); + +transition: opacity .2s ease-out; +} +.cabinet-card__element-change:hover{ +opacity: .8; +} +.cabinet-card__title{ +font-family: var(--font-family); +font-weight: 700; +font-size: 26px; +line-height: 123%; +text-transform: uppercase; +background: var(--gradient-blue); +background-clip: text; +-webkit-background-clip: text; +-webkit-text-fill-color: transparent; +} +.cabinet-card__text{ +font-family: var(--font-family); +font-weight: 400; +font-size: 20px; +line-height: 120%; + +color: var(--text-black); +} +.cabinet-card__text--grey{ +color: var(--text-grey); +} +.cabinet-card__label{ +font-family: var(--font-family); +font-weight: 700; +font-size: 16px; +line-height: 125%; + +color: var(--text-3); +} +.cabinet-card__status{ +padding-left: 20px; + +font-family: var(--font-family); +font-weight: 500; +font-size: 12px; +line-height: 133%; + +position: relative; +color: #121212; +} +.cabinet-card__status--chek{ +color: var(--text-green); +} +.cabinet-card__status--chek::before{ +content: ''; + +position: absolute; +top: 0; +left: 0; + +width: 16px; +height: 16px; + +background-image: url(../img/svg/main/status-chek.svg); +object-fit: contain; +} +.cabinet-card__status--cancelled{ +color: var(--text-red); +} +.cabinet-card__status--cancelled::before{ +content: ''; + +position: absolute; +top: 0; +left: 0; + +width: 16px; +height: 16px; + +background-image: url(../img/svg/main/status-cancelled.svg); +object-fit: contain; +} +.cabinet-card__block-accounts{ +display: flex; +} +.cabinet-card__account{ +margin-left: 16px; + +width: 40px; +aspect-ratio: 1; + +display: flex; +justify-content: center; +align-items: center; + +background: var(--background-9); +border-radius: 50%; +} +.cabinet-card__account:first-child{ +margin-left: 0; +} +.cabinet-card__block-buttons{ +display: flex; +justify-content: space-between; +align-items: center; +} +.cabinet-card__button{ +padding: 8px 8px 6px 0; + +font-family: var(--font-family); +font-weight: 600; +font-size: 20px; +line-height: 120%; +color: var(--text-black); + +background: none; +border: none; + +position: relative; + +text-decoration: none; +} +.cabinet-card__button::before{ +content: ''; + +position: absolute; +bottom: 6px; + +width: calc(100% - 8px); +height: 1px; + +background: var(--text-black); + +transition: opacity .2s ease-out; +} +.cabinet-card__button:hover{ +opacity: .8; +} +.cabinet-card__confirm{ +margin-top: 16px; + +border-radius: 20px; +padding: 4px 24px; + +font-family: var(--font-family); +font-weight: 600; +font-size: 20px; +line-height: 120%; + + +background: var(--background-black); +color: #fff; +border: none; + +transition: opacity .2s ease-out; +} +.cabinet-card__confirm:hover{ +opacity: .8; +} +.cabinet-card__text, .cabinet-card__label, .cabinet-card__status, .cabinet-card__block-accounts, .cabinet-card__block-buttons{ +margin-top: 8px; +} +.cabinet-card__text:first-child, .cabinet-card__label:first-child, .cabinet-card__status:first-child, .cabinet-card__block-accounts:first-child, .cabinet-card__block-buttons:first-child{ +margin-top: 0px; +} +.cabinet-card__block-add-pets{ +width: 100%; + +display: flex; +align-items: center; + +background: none; +border: none; +} +.cabinet-card-add-pets__circle{ +width: 48px; +aspect-ratio: 1; + +display: flex; +justify-content: center; +align-items: center; + +border: 1px solid var(--text-6); +border-radius: 50%; +} +.cabinet-card-add-pets__text{ +margin-left: 16px; + +font-family: var(--font-family); +font-weight: 600; +font-size: 20px; +line-height: 120%; + +color: var(--text-6); + +position: relative; +} +.cabinet-card-add-pets__text::after{ +content: ''; + +position: absolute; +left: 0; +bottom: -4px; + +width: 100%; +height: 1px; + +background: var(--text-6); +} +.cabinet-card__discount{ +display: flex; +align-items: center; +} +.cabinet-card-discount__title{ +font-family: var(--font-family); +font-weight: 700; +font-size: 16px; +line-height: 125%; +color: var(--text-black); +} +.cabinet-card-discount__percent{ +margin-left: 16px; + +font-family: var(--font-family); +font-weight: 700; +font-size: 16px; +line-height: 125%; +color: var(--text-black); +} +.cabinet-card-discount__percent::after{ +content: '%'; +} +.cabinet-card-discount__arrow{ +display: inline-block; + +margin-left: 6px; + +width: 20px; +aspect-ratio: 1; + +background-image: url(../img/svg/main/arrow-breadcrumbs-black.svg); +background-position: center; +} +.cabinet-card__no-orders{ +margin-top: 32px; + +padding: 48px 24px; +} +.cabinet-card-no-orders__element{ +margin-top: 26px; +} +.cabinet-card-no-orders__element:first-child{ +margin-top: 0; +} +.cabinet-card-no-orders__title{ +font-family: var(--font-family); +font-weight: 500; +font-size: 24px; +line-height: 133%; +text-align: center; +color: var(--text-black); +} +.cabinet-card__pet{ +display: flex; +align-items: center; +} +.cabinet-card-pet__icon{ +width: 48px; +aspect-ratio: 1; + +border-radius: 50%; +background: var(--gradient-blue); +} +.cabinet-card-pet-icon__content{ +margin: 1px; + +width: calc(100% - 2px); +aspect-ratio: 1; + +display: flex; +justify-content: center; +align-items: center; + +border-radius: 50%; +background: var(--background-white); +} +.cabinet-card-pet-icon__content img{ +width: 32px; +aspect-ratio: 1; + +object-fit: contain; +} +.cabinet-card-pet__name{ +margin-left: 24px; + +font-family: var(--font-family); +font-weight: 700; +font-size: 16px; +line-height: 125%; +color: var(--text-black); +} +.cabinet-card__order{ +position: relative; +} +.cabinet-card-order__header{ +display: flex; +justify-content: space-between; +align-items: flex-start; +} +.cabinet-card-order__main{} +.cabinet-card-order-main__date{ +font-family: var(--font-family); +font-weight: 500; +font-size: 24px; +line-height: 133%; +color: var(--text-black); +} +.cabinet-card-order-main__number{ +margin-top: 8px; + +font-family: var(--font-family); +font-weight: 500; +font-size: 12px; +line-height: 133%; +color: var(--text-black); +} +.cabinet-card-order-main__number::before{ +content: '№'; +} +.cabinet-card-order__payment{ +display: flex; +align-items: flex-end; + +transition: margin .2s ease-out; +} +.cabinet-card-order-payment__title{ +font-family: var(--font-family); +font-weight: 500; +font-size: 12px; +line-height: 133%; +color: var(--text-black); +} +.cabinet-card-order-payment__price{ +margin-left: 8px; + +font-family: var(--font-family); +font-weight: 700; +font-size: 16px; +line-height: 125%; +color: var(--text-black); +} +.cabinet-card-order__content{ +margin-top: 24px; +} +.cabinet-card-order__content +.cabinet-card-order__status{ +display: flex; +align-items: center; +} +.cabinet-card-order-status__title{ +font-family: var(--font-family); +font-weight: 500; +font-size: 20px; +line-height: 120%; +color: var(--text-black); +} +.cabinet-card-order-status__pointer{ +margin-left: 12px; + +font-family: var(--font-family); +font-weight: 500; +font-size: 20px; +line-height: 120%; +color: var(--text-black); +} +.cabinet-card-order-status__pointer--grey{ +color: var(--text-6); +} +.cabinet-card-order-status__pointer--green{ +color: var(--text-green); +} +.cabinet-card-order-status__pointer--red{ +color: var(--text-red); +} +.cabinet-card-order__block-detail{ +height: 0; +overflow: hidden; + +transition: height .2s ease-out; +} +.cabinet-card-order__detail{ +padding-top: 24px; +} +.cabinet-card-order-detail__address{} +.cabinet-card-order-detail-address__title{ +font-family: var(--font-family); +font-weight: 500; +font-size: 20px; +line-height: 120%; +color: var(--text-black); +} +.cabinet-card-order-detail-address__text{ +margin-top: 16px; + +font-family: var(--font-family); +font-weight: 400; +font-size: 20px; +line-height: 120%; +color: var(--text-black); +} +.cabinet-card-order-detail__main{ +margin-top: 24px; + +display: flex; +justify-content: space-between; +} +.cabinet-card-order-detail-main__products{} +.cabinet-card-order-detail-main__product{ +margin-top: 4px; + +display: flex; +align-items: center; +} +.cabinet-card-order-detail-main__product:first-child{ +margin-top: 0; +} +.cabinet-card-order-detail-main-product__img{ +width: 106px; +height: 96px; +} +.cabinet-card-order-detail-main-product__content{ +display: flex; +} +.cabinet-card-order-detail-main-product__description{ +width: 212px; +} +.cabinet-card-order-detail-main-product-description__what{ +font-family: var(--font-family); +font-weight: 500; +font-size: 12px; +line-height: 133%; +color: var(--text-black); +} +.cabinet-card-order-detail-main-product-description__with-what{ +margin-top: 8px; + +font-family: var(--font-family); +font-weight: 500; +font-size: 12px; +line-height: 133%; +color: var(--text-6); +} +.cabinet-card-order-detail-main-product__count{ +margin-left: 8px; + +font-family: var(--font-family); +font-weight: 700; +font-size: 12px; +line-height: 133%; +text-align: right; +color: var(--text-6); +} +.cabinet-card-order-detail-main-product__count::before{ +margin-right: 4px; + +content: 'x'; +} +.cabinet-card-order-detail-main-product__price{ +margin-left: 16px; + +font-family: var(--font-family); +font-weight: 700; +font-size: 12px; +line-height: 133%; +text-align: right; +color: var(--text-black); +} + +.cabinet-card-order-detail-main__links{ +display: flex; +flex-direction: column; +} +.cabinet-card-order-detail-main__link{ +margin-top: 16px; +} +.cabinet-card-order-detail-main__link:first-child{ +margin-top: 0; +} +.cabinet-card-order__open-detail{ +margin-top: 24px; + +padding-right: 24px; + +font-family: var(--font-family); +font-weight: 500; +font-size: 20px; +line-height: 120%; +color: var(--text-black); + +border: none; +background: none; + +position: relative; +} +.cabinet-card-order__open-detail::after{ +content: ''; + +position: absolute; +top: 6.75px; +right: 0; + +width: 12.5px; +height: 10.5px; + +background-image: url(../../core/img/svg/main/arrow-black.svg); +background-size: contain; +background-position: center; +background-repeat: no-repeat; + +transition: transform .2s; +/* transform: rotate(180deg); */ +} +.cabinet-card-order-detail-short__item{ +object-fit: contain; +} +.cabinet-card-order__detail-short{ +display: flex; +align-items: center; +justify-content: flex-end; +max-width: calc(100% - 250px); +margin-left: auto; +overflow: auto; +/* flex-wrap: wrap; */ +transition: all .2s .1s ease-out; +} +.cabinet-card-order__bottom{ +display: flex; +align-items: flex-end; +} +@media (max-width: 768px) { +.cabinet-card-order__bottom{ + display: flex; + align-items: flex-start; + flex-direction: column-reverse; + margin-top: 16px; +} +.cabinet-card-order__detail-short{ + max-width: calc(100%); + flex-wrap: wrap; + justify-content: flex-start; + margin-left: 0; +} +} +.cabinet-card-order-detail-short__item{ +border-radius: 16px; +width: 106px; +height: 96px; +} +.cabinet-card__download{ +margin-top: 32px; +} +.cabinet-card__order.active .cabinet-card-order__detail-short{ +opacity: 0; +height: 0; +} +.cabinet-card__order.active .cabinet-card-order__open-detail::after{ +transform: rotate(180deg); +} +/* .cabinet-card-no-orders__ */ +.cabinet__subscription-pc{ +} +.cabinet__subscription-mobile{ +display: none; +} +/* cabinet */ + +.main-page-wrapper{ +margin-top: 20px !important; +} + + +.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-20_0, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-20_0, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-20_0, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { +padding-right: 0 !important; +padding-left: 0 !important; +} + +@media only screen and (max-width: 1200px) { +/* cabinet */ +.cabinet{ + flex-direction: column; + + position: relative; +} +.cabinet__control{ + display: flex; + + position: relative; +} +.cabinet__orders, .cabinet__profile{ + width: calc(100% - 48px); +} +.cabinet__orders, .cabinet__profile{ + position: absolute; + opacity: 0; + + transition: opacity .2s ease-out; +} +.cabinet-content{ + pointer-events:none; +} +.cabinet__orders.active, .cabinet__profile.active{ + opacity: 1; +} +.cabinet__orders.hide, .cabinet__profile.hide{ + position: static; + display: block; + pointer-events:auto; + + width: 100%; +} +.cabinet__subscription-pc{ + display: none; +} +.cabinet__subscription-mobile{ + display: block; + + margin: 24px 24px 0 24px; +} +.cabinet__orders .cabinet-card:nth-child(2){ + margin-top: 0; + } +/* cabinet */ +} +@media only screen and (max-width: 750px) { + /* cabinet */ + .cabinet-card-order__open-detail{ + margin-top: 0px; + } + .cabinet-card-order__detail-short{ + right: auto; + left: 0; + bottom: 48px; + } + .cabinet-card-order-detail-short__item{ + margin-left: 10px; + } + .cabinet-card-order-detail-short__item:first-child{ + margin-left: 0; + } + .cabinet-card__order.active .cabinet-card-order__open-detail{ + margin-top: 24px; + } + .cabinet-card-order__detail-short{ + max-width: 100%; + } + .cabinet-card-order__content, .cabinet-card-order__bottom{ + margin-top: 0; + } + /* cabinet */ + } +@media only screen and (max-width: 720px) { + /* cabinet */ +.cabinet-card__title{ + font-size: 20px; +} +.cabinet-card__no-orders{ + margin-top: 16px; +} +.cabinet-card-order__header{ + flex-direction: column; +} +.cabinet-card-order__payment{ + margin-top: 16px; +} +.cabinet-card-order-detail__main{ + flex-direction: column; +} +.cabinet-card-order-detail-main__links{ + margin-top: 24px; + + align-items: start; +} +.cabinet-card-order-detail-main-product__img{ + width: 70px; + height: 70px; +} +.cabinet-card-order-detail-main__product{ + margin-top: 16px; + + align-items: start; +} +.cabinet-card-order-detail-main__products{ + position: relative; +} +.cabinet-card-order-detail-main-product__content{ + margin-left: 16px; + + flex-wrap: wrap; + + +} +.cabinet-card-order-detail-main-product__description{ + width: 100%; +} +.cabinet-card-order-detail-main-product__count{ +margin-left: 0; +margin-top: 7px; +} +.cabinet-card-order-detail-main-product__price{ + margin-top: 7px; +} +.cabinet-card__content{ + padding-right: 19px; +} +/* .cabinet-card__order.active */ +/* .cabinet-card__order.active */ +/* cabinet */ +} + +@media only screen and (max-width: 576px) { + /* cabinet */ + +.cabinet-card-order-detail-main-product__img{ + width: 40px; + height: 40px; +} + +.cabinet-card-order-detail-main-product__count{ + left: auto; + right: 71px; +} +.cabinet-card-order-detail-main-product__price{ + left: auto; + right: 0; +} +.cabinet-card-order__detail-short{ + transition-delay: 0; + transition-duration: 0; +} +.cabinet-card-order-detail-short__item { + border-radius: 16px; + width: 80px; + height: 80px; +} + +/* cabinet */ +} + + + + + + + + + + + + + + + + + + + + + + +button{ + cursor: pointer; + } + + .wrapper{ + margin: 0 auto; + + max-width: 1600px; + } + + .main_link{ + font-size: 24px; + font-weight: 500; + line-height: 28.8px; + color: var(--creme-white, #F4F1F0); + width: 221px; + height: 50px; + padding: 10px; + white-space: nowrap; + display: flex; + align-items: center; + justify-content: center; + border-radius: 48px; + border: 2px solid var(--creme-white, #F4F1F0); + transition: .3s ease all; +} +.main_link:hover{ + background-color: #F4F1F0; + color: #121212; +} + +.btn--black-hover:hover{ + background: #121212 !important; + color: #F4F1F0 !important; +} + body{ + font-family: var(--font-family); + } + + :root { + --font-family: "Craftwork Grotesk", sans-serif; + --second-family: "DIN 2014 Rounded", sans-serif; + --third-family: "Roboto", sans-serif; + --text-white: #fff; + --text-black: #121212; + --text-dark: #2b2b3b; + --text-grey: #999; + --text-red: #fa0505; + --text-green: #2ED15D; + --text-0: #000; + --text-3: #333; + --text-6: #666; + --text-9: #999; + --background-white: #fff; + --background-black: #121212; + --background-grey: #f2f2f2; + --background-green: #2ED15D; + --background-green-white: #f4fff0; + --background-9: #999; + --gradient-blue: radial-gradient(346.57% 244.17% at 149.73% -58.39%, rgb(15, 88, 129) 0%, rgb(30, 164, 156) 51.21689438819885%, rgb(118, 206, 117) 80.70731163024902%, rgb(236, 243, 159) 91.14583134651184%); + --gradient-turquoise: radial-gradient(346.57% 244.17% at 149.73% -58.39%, rgb(117, 196, 240) 0%, rgb(126, 231, 225) 51.21689438819885%, rgb(181, 228, 180) 80.70731163024902%, rgb(237, 244, 164) 91.14583134651184%); + --gradient-red: linear-gradient(22deg, #f44242 0%, #569ef0 100%); +} + + +.form{ + width: 100%; + + padding: 24px 24px 43px; + + display: flex; + flex-direction: column; + + position: relative; + overflow: hidden; + border-radius: 24px; + background: var(--gradient-turquoise); + } + .form.submited .footer-thx{ + display: flex; + } + .footer-thx{ + height: 100%; + width: 100%; + top: 0; + left: 0; + text-align: center; + position: absolute; + display: none; + font-size: 32px; + align-items: center; + justify-content: center; + padding: 24px; + background: var(--gradient-turquoise); + flex-direction: column; + } + .footer-thx-sub{ + font-size: 15px; + margin-top: 8px; + } + .form__item{ + margin-top: 16px; + } + .form__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-black); + } + .form__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + border: 1px solid var(--text-black); + + background: var(--background-white); + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + + color: var(--text-black); + } + .form__input::placeholder{ + color: var(--text-grey); + } + .form__input--textarea{ + height: 96px; + resize: none; + } + .form__button{ + width: 100%; + + padding: 12px 24px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + border-radius: 16px; + border: none; + background: var(--background-black); + + cursor: pointer; + + transition: background-color .2s ease-out; + } + .form__button:hover{ + opacity: .8; + } + + .label{ + padding-bottom: 4px; + + display: inline-block; + + position: relative; + } + .label::after{ + content: ''; + + position: absolute; + top: 2px; + right: -20px; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/question.svg); + + cursor: pointer; + } + .label__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-3); + } + .label__question{ + position: absolute; + + padding: 8px; + width: max-content; + max-width: 200px; + border-radius: 6px; + transition: height .2s ease-out; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + overflow: hidden; + background-color: var(--background-white); + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; + } + .label:hover .label__question{ + opacity: 1; + pointer-events: auto; + } + + + .social-media{ + display: flex; + align-items: center; + } + .social-media__item{ + margin-left: 32px; + + transition: opacity .2s ease-out; + } + .social-media__item:hover{ + opacity: .8; + } + .social-media__item:first-child{ + margin-left: 0px; + } + .social-media__icon{ + width: 32px; + aspect-ratio: 1; + } + + .breadcrumbs{ + margin: 24px; + + display: flex; + align-items: center; + } + .breadcrumbs__item{ + display: block; + + padding: 0px 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-6); + + text-decoration: none; + + position: relative; + } + .breadcrumbs__item:first-child{ + padding-left: 0; + } + .breadcrumbs__item:nth-child(n+2)::before{ + content: ''; + + position: absolute; + top: -2px; + left: -12px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-breadcrumbs.svg); + background-repeat: no-repeat; + background-size: contain; + } + + /* button */ +.button{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-radius: 20px; + text-transform: none; + cursor: pointer; + } + .button--100-perc{ + width: 100%; + } + .button--white{ + padding: 11px 24px; + + text-align: center; + + background-color: var(--background-white); + border: 1px solid var(--background-black); + + transition: opacity .2s ease-out; + } + .button--white:hover{ + opacity: .8; + } + .button--white.active{ + background: var(--background-black); + color: var(--background-white); + } + .button--gradient{ + background: var(--gradient-turquoise); + border: none; + + transition: opacity .2s ease-out; + } + .button--gradient:hover{ + opacity: .8; + } + .button--base{ + padding: 12px 24px; + } + .button--high{ + height: 56px; + + padding: 16px 24px 16px 24px; + + font-weight: 700; + text-align: center; + + position: relative; + } + .button--icon{ + padding-right: 56px; + + text-align: start; + } + .button--filter::after{ + content: ''; + + position: absolute; + top: 16px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/filter.svg); + background-repeat: no-repeat; + background-size: contain; + } + .button--black{ + padding: 7px 15px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + + background: var(--background-black); + border: 1px solid var(--text-white); + } + .button--link{ + text-decoration: none; + } + .button--red-48-px{ + border-radius: 48px; + } + .to-know{ + width: 100%; + + padding: 12px; + + display: flex; + justify-content: center; + + border: none; + + transition: opacity .2s ease-out; + } + .to-know:hover{ + opacity: .8; + } + .to-know p{ + padding-bottom: 4px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-bottom: 1px var(--text-black) solid; + + cursor: pointer; + } + .to-know--background-none{ + background: none; + } + .back{ + margin-top: 16px; + margin-left: 16px; + + padding: 8px; + padding-left: 32px; + + background: none; + border: none; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; + + position: relative; + } + .back::before{ + content: ''; + + position: absolute; + top: 8px; + left: 0; + + margin-right: 8px; + + width: 24px; + height: 24px; + + background-image: url(../img/svg/main/arrow-back.svg); + } + + .back::after{ + content: ''; + + position: absolute; + bottom: 6px; + left: 0; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); + } + /* button */ + + + /* select */ +.select{ + max-width: 144px; + + position: relative; + } + .select__state{ + width: 100%; + + padding: 11px 47px 11px 13px; + + /* pointer-events:none; */ + + border: 1px solid var(--background-black); + border-radius: 20px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + cursor: pointer; + + position: relative; + + transition: opacity .2s ease-out; + } + .select:hover .select__state{ + opacity: .8; + } + .select::after{ + content: ''; + + position: absolute; + top: 20.5px; + right: 21.5px; + + width: 17px; + height: 10px; + + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; + + pointer-events: none; + } + .state__block{ + position: absolute; + top: 48px; + left: 0; + + width: 100%; + + height: 0; + overflow: hidden; + + transition: height .2s ease-out; + } + .state__content{ + padding: 8px; + + border-radius: 6px; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + background-color: var(--background-white); + + list-style-type: none; + } + .state__content li{ + margin-top: 8px; + } + .state__content li:first-child{ + margin-top: 0; + } + .state__button{ + width: 100%; + + padding: 4px 32px 4px 4px; + + background: none; + border: none; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + text-align: start; + + border-radius: 6px; + + transition: background-color .2s ease-out; + + position: relative; + } + .state__button:hover, + .state__button.active{ + background-color: var(--background-grey); + } + + .state__button.active::before{ + content: ''; + position: absolute; + top: 10px; + right: 8px; + width: 16px; + height: 12px; + background-image: url(../img/svg/main/arrow-selected.svg); + } + + /* select */ + + /* counter */ + .counter{ + display: flex; + align-items: center; + } + .counter__input{ + width: 48px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: center; + color: var(--text-black); + + pointer-events: none; + + background: none; + border: none; + } + .counter__button{ + width: 48px; + height: 48px; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--text-3); + border-radius: 24px; + + background: var(--background-white); + + transition: opacity .2s ease-out; + } + .counter__button:hover{ + opacity: .8; + } + .counter--small{ + + } + .counter--small .counter__button{ + width: 32px; + height: 32px; + } + .counter--small{ + + } + /* counter */ + + /* modal */ +/* modal */ +.modal{ + position: fixed; + top: 0; + left: 0; + + padding: 20px; + + width: 100%; + height: 100%; + + background: rgba(0, 0, 0, 0.25); + + z-index: 200; + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; + + display: flex; + justify-content: center; + align-items: center; + + overflow-y: auto; +} +.modal.active{ + opacity: 1; + pointer-events: auto; +} +.modal__notification{} +.form__button-mobile{ + display: none; +} +.modal__aside{ + position: fixed; + top: 0; + right: 0; + + width: 0; + height: 100%; + + overflow: hidden; + transition: width .4s ease-out; +} +.modal__item{ + height: 100%; + + padding: 24px; + + background: var(--background-white); + + position: relative; + + display: none; + + filter: blur(10px); + transition: filter .2s ease-out; +} +.modal__item--no-title{ + padding-top: 72px; +} +.modal__item.active{ + display: flex; + flex-direction: column; + justify-content: space-between; +} +.modal__close{ + position: absolute; + top: 32px; + right: 24px; + + width: 24px; + height: 24px; + + border: none; + background: none; +} +.modal__header{} +.modal__title{ + padding-right: 48px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; + color: var(--text-black); +} +.modal__small-title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + color: var(--text-black); +} +.modal__text{ + margin-top: 16px; + + padding-right: 10px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-0); +} +.modal__form-sub{ + margin-top: 48px; +} +.modal-form-sub__submit{ + margin-top: 64px; +} +.modal__block-button{ + margin-top: 24px; +} +.modal__button{ + margin-top: 16px; +} +.modal__button:first-child{ + margin-top: 0; +} +.modal__content{ + margin-top: 24px; +} +.modal__filter{ + width: 400px; + overflow-y: auto; +} +.modal__footer{ + border-top: 1px solid var(--text-6); + padding-top: 23px; +} +.modal__block-price{ + display: flex; + justify-content: space-between; + align-items: center; +} +.modal-block-price__title{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.modal-block-price__price{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); +} +.modal-block-price__price::after{ + content: 'Р'; +} +.modal__basket{ + width: 600px; +} +.modal__to-know, +.modal__to-know-submit{ + width: 412px; +} + +.modal-basket__item{ + padding-top: 23px; + padding-right: 15px; + padding-bottom: 24px; + + display: flex; + + border-top: 1px solid #f2f2f2; + + position: relative; +} +.modal-basket__item-before{ + content: ''; + + position: absolute; + top: 24px; + right: 6px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/basket.svg); + background-repeat: no-repeat; + background-position: center; + + cursor: pointer; + + transition: opacity .2s ease-out; +} +.modal-basket__item:hover .modal-basket__item::before{ + opacity: .8; +} +.modal-basket__item--return{ + padding-right: 5px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.modal-basket__item--return .modal-basket-item__title{ + padding-right: 10px; +} +.modal-basket__item--return::before{ + display: none; +} +.modal-basket-item__return{ + border-radius: 20px; + padding: 4px 24px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + background: var(--background-black); + + border: none; +} +.modal-basket-item__block-image{ + width: 128px; + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; +} +.modal-basket-item__image{ + width: 96px; + aspect-ratio: 1; + + object-fit: contain; +} +.modal-basket-item__content{ + margin-left: 16px; +} +.modal-basket-item__title{ + padding-right: 40px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.modal-basket-item__sub-title{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.modal-basket-item__control{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.modal-basket-item__price{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: right; + color: var(--text-black); +} +.modal-basket-item__price::after{ + content: 'Р'; + + padding-left: 4px; +} +.modal__basket .modal__header{ + height: calc(100% - 92px); + margin-bottom: -36px; +} +.modal__basket .modal__content{ + height: calc(100% - 100px); + overflow-x: hidden; + +} +.modal__basket .modal__content::-webkit-scrollbar { + width: 7px; + background-color: #f9f9fd; +} +.modal__basket .modal__content::-webkit-scrollbar-thumb { + background-color: var(--background-black); + border-radius: 2px; +} + +.modal-form{ + margin: auto; + + width: 600px; + + padding: 24px; + + border-radius: 20px; + + position: relative; + + display: none; +} +.modal-form.active{ + display: block; +} +.modal-form--white{ + border: 1px solid var(--background-black); + background: var(--background-white); +} +.modal-form--green-gradient{ + background: var(--gradient-blue); +} +.modal-form--width-584{ + width: 584px; +} +.modal-form__close{ + position: absolute; + top: 24px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + border: none; + background: none; + background-image: url(../img/svg/main/black-x.svg); + background-repeat: no-repeat; + background-size: 24px; + background-position: center; + + transition: opacity .2s ease-out; +} +.modal-form__close--white{ + background-image: url(../img/svg/main/white-x.svg); +} +.modal-form__close:hover{ + opacity: .8; +} +.modal-form__button-close{} +.modal-form__title{ + padding-right: 50px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + color: var(--text-dark); +} +.modal-form__text--center{ + text-align: center; +} +.modal-form__text--center-pc{ + text-align: center; +} +.modal-form__title--green-gradient{ + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.modal-form__title--white{ + color: var(--text-white); +} +.modal-form__element{ + margin-top: 24px; +} +.modal-form__element--center{ + display: flex; + justify-content: center; +} +.modal-form__element--top-40{ + margin-top: 40px; +} +.modal-form__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.modal-form__text--weight-500{ + font-weight: 500; +} +.modal-form__text--white{ + color: var(--text-white); +} +.modal-form__img{ + width: 100%; + height: 360px; + + object-fit: contain; +} +.modal-form__content{ + margin-top: 40px; +} +.modal-form-content__line{ + margin-top: 24px; +} +.modal-form-content__line:first-child{ + margin-top: 0; +} +.modal-form-content__line--two{ + display: flex; + justify-content: space-between; +} +.modal-form-content-line__element{ + position: relative; +} +.modal-form-content__line--two .modal-form-content-line__element{ + width: calc(50% - 12px); +} +.modal-form-content__line--three{ + display: flex; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){ + width: 85px; + + flex-shrink: 0; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){ + margin-left: 8px; + + width: 100%; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){ + margin-left: 8px; + + width: 85px; + + flex-shrink: 0; +} +.modal-form-content__line--margin-top-16{ + margin-top: 16px; +} +.modal-form__buttons{ + margin-top: 32px; +} +.modal-form__buttons--two{ + display: flex; + justify-content: space-between; + align-items: center; +} + +.modal-form__buttons--two button, +.modal-form__buttons--two input{ + width: calc(50% - 20px); +} +.modal-map{ + margin: auto; + + width: 1105px; + + display: none; + + border-radius: 24px; + border: none; +} +.modal-map.active{ + display: flex; +} +.modal-map__left{ + width: 600px; + + padding: 24px; + + position: relative; +} +.modal-map__control{ + margin: 38px -12px -12px -12px; + + display: flex; +} +.modal-map-control__item{ + margin: 12px; + + padding: 2px; + + width: calc(50% - 24px); + + background: var(--background-9); + border-radius: 20px; + border: none; +} +.modal-map-control__item.active{ + background: var(--gradient-blue); +} +.modal-map-control__item.active .form-input-radio__circle::before{ + content: ''; + position: absolute; + top: 4px; + left: 4px; + width: 12px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--gradient-blue); +} +.modal-map-control-item__content{ + padding: 14px; + + border-radius: 18px; + + background: var(--background-white); +} +.modal-map-control-item__header{ + display: flex; + align-items: center; +} +.modal-map-control-item__circle{ + padding: 2px; + width: 20px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--background-9); + position: relative; +} +.modal-map-control-item-circle__content{ + width: 16px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--background-white); +} +.modal-map-control__item.active .modal-map-control-item__circle{ + background: var(--gradient-blue); +} +.modal-map-control__item.active .modal-map-control-item__circle::before{ + content: ''; + position: absolute; + top: 4px; + left: 4px; + width: 12px; + aspect-ratio: 1; + border-radius: 50%; + background: var(--gradient-blue); +} +.modal-map-control-item__title{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); +} +.modal-map-control-item__description{ + margin-top: 16px; +} +.modal-map-control-item__time{ + font-family: var(--font-family); + font-weight: 500; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + text-align: start; +} +.modal-map-control-item__price{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-6); + + text-align: start; +} +.modal-map__form{ + margin-top: 24px; +} +.modal-map-form__hidden{ + +} +.modal-map-form__button{ + margin-top: 83px; +} +.modal-map-form__sub-button{ + display: none; +} +.modal-map__right{ + padding: 16px 0px 16px 16px; +} +.modal-map__map{ + border: 2px solid var(--background-9); + border-radius: 16px; + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.modal-map__map iframe{ + height: 650px; +} +.modal__age{ + +} +.modal__age > div{ + display: none; +} +.modal__age > div.active{ + display: flex; +} +/* modal */ + /* modal */ + + /* toggle */ + .toggle{ + padding-top: 26px; + padding-bottom: 25px; + + border-bottom: 1px solid var(--text-3); + + position: relative; + } + .toggle::after{ + content: ''; + + position: absolute; + top: 24px; + right: 0; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/black-x.svg); + transform: rotate(45deg); + transition: transform .2s; + pointer-events: none; + } + .toggle.active::after{ + transform: rotate(0deg); + } + .toggle__title{ + padding-right: 30px; + text-transform: uppercase; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + margin-bottom: 0; + cursor: pointer; + } + .toggle__block-content{ + height: 0; + overflow: hidden; + + transition: height .2s ease-out; + } + .toggle__content{ + padding-top: 24px; + } + .toggle-content__item{ + margin: 12px -12px -12px -12px; + + display: flex; + align-items: center; + flex-wrap: wrap; + } + .toggle-content__item:first-child{ + margin-top: 0; + } + .toggle-content__element{ + margin: 12px; + } + .toggle-content__element--width-perc-100{ + width: 100%; + } + .toggle-content__element--width-perc-50{ + width: calc(50% - 24px); + } + .toggle__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + } + /* toggle */ + + /* checkbox */ + .checkbox{ + display: flex; + align-items: center; + + cursor: pointer; + } + .checkbox__state{ + border-radius: 4px; + + width: 18px; + height: 18px; + + border: 2px solid var(--background-black); + background: var(--background-white); + + flex-shrink: 0; + } + .checkbox.active .checkbox__state{ + background-color: var(--background-black); + + background-image: url(../img/svg/main/arrow-selected-white.svg); + background-repeat: no-repeat; + background-position: center; + } + .checkbox__input{ + display: none; + } + .checkbox__label{ + padding-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + cursor: pointer; + } + .checkbox__label a{ + color: #76ce75; + + text-decoration: none; + } + .checkbox--small{ + margin-top: 24px; + } + .checkbox--small .checkbox__label{ + padding-left: 24px; + + font-weight: 500; + font-size: 12px; + line-height: 133%; + } + /* checkbox */ + + /* radio */ + .radio{ + display: flex; + align-items: center; + } + .radio__input{ + width: 18px; + aspect-ratio: 1; + + accent-color: var(--background-black); + + cursor: pointer; + } + .radio__label{ + padding-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + cursor: pointer; + } + /* radio */ + + + @keyframes slidein { + from { + opacity: 0; + } + + to { + opacity: 1; + } + } + + .slider-arrow{ + background-color: transparent; + } + + .product__footer{ + width: 100%; + } + + .button.loading{ + font-size: 0; + color: transparent !important; + position: relative; + } + .button.loading::before{ + content: ''; + height: 36px; + width: 36px; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' width='200' height='200' style='shape-rendering: auto; display: block; background: transparent;'%3E%3Cg%3E%3Ccircle stroke-dasharray='164.93361431346415 56.97787143782138' r='35' stroke-width='10' stroke='%23000000' fill='none' cy='50' cx='50'%3E%3CanimateTransform keyTimes='0;1' values='0 50 50;360 50 50' dur='1s' repeatCount='indefinite' type='rotate' attributeName='transform'/%3E%3C/circle%3E%3Cg/%3E%3C/g%3E%3C!-- %5Bldio%5D generated by https://loading.io --%3E%3C/svg%3E"); + background-size: contain; + background-repeat: no-repeat; + } + + + .products.loading{ + position: relative; + } + .products.loading::before{ + content: ''; + z-index: 150; + height: 100%; + width: 100%; + position: absolute; + top: 0; + left: 0; + background-color: rgba(255,255,255, .6); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' width='200' height='200' style='shape-rendering: auto; display: block; background: transparent;'%3E%3Cg%3E%3Ccircle stroke-dasharray='164.93361431346415 56.97787143782138' r='35' stroke-width='10' stroke='%23000000' fill='none' cy='50' cx='50'%3E%3CanimateTransform keyTimes='0;1' values='0 50 50;360 50 50' dur='1s' repeatCount='indefinite' type='rotate' attributeName='transform'/%3E%3C/circle%3E%3Cg/%3E%3C/g%3E%3C!-- %5Bldio%5D generated by https://loading.io --%3E%3C/svg%3E"); + background-size: 48px; + background-position: top 200px center; + background-repeat: no-repeat; + } + + html{ + background: #fff !important; + } + + .detail__label-wrap{ + display: flex; + flex-wrap: wrap; + gap: 5px; + } + + .product-item-label__tag--sale{ + flex-shrink: 0; + margin-left: auto; + } + + .detail__label-wrap .detail__label .product-item-label__tag:last-child{ + margin-left: 0; + } + + .detail__label-wrap{ + align-items: center; + } + + .open-to-know{ + background-color: transparent; + } + + .detail-block-form__item .open-to-know{ + width: auto; + padding-left: 0; + padding-right: 0; + margin-right: 0; + margin-left: 0; + } + + .input-text { + display: flex; + flex-direction: row; + align-items: center; + padding: 12px 16px; + gap: 8px; + width: 100%; + height: 48px; + background: #FFFFFF; + border: 1px solid #999999; + border-radius: 20px; + margin-top: 6px; + color: #000 + } + + textarea.input-text{ + height: 150px; + } + + .woocommerce-button{ + padding: 20px; + margin-top: 20px; + } + + fieldset{ + padding: 0; + } + + +.radio-button{ + display: flex; + gap: 10px; +} + + +/* By Max fix add to cart button */ +.store-add-to-cart{ + min-height: 48px; +} +.mini-profile__button{ + position: relative; +} +.mini-profile__button--counter{ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 2px; + position: absolute; + background: var(--gradient-turquoise); + border-radius: 10px; + width: 16px; + height: 16px; + + border-radius: 50%; + top: 6px; + right: 6px; + font-style: normal; + font-weight: 700; + font-size: 9px; + line-height: 16px; + color: #121212; +} + +.mini-profile__button--counter.disabled{ + display: none; +} + +.--text-center{ + text-align: center; +} + +.post{ + padding-bottom: 1.5rem; +} + +.login_wrap{ + min-height: 100%; +} + +.button--high-46{ + padding: 12px 24px; + + font-size: 20px; + font-weight: 700; + line-height: 24px; +} + +/* form */ +.form{ + width: 100%; + + padding: 24px 24px 43px; + + display: flex; + flex-direction: column; + + border-radius: 24px; + background: var(--gradient-turquoise); +} +.form__item{ + margin-top: 16px; +} +.form__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-black); +} +.form__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + border: 1px solid var(--text-black); + + background: var(--background-white); + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + + color: var(--text-black); +} +.form__input::placeholder{ + color: var(--text-grey); +} +.form__input--textarea{ + height: 96px; + resize: none; +} +.form__input--center{ + text-align: center; +} +.form__button{ + width: 100%; + + padding: 12px 24px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + border-radius: 16px; + border: none; + background: var(--background-black); + + cursor: pointer; + + transition: background-color .2s ease-out; +} +.form__button:hover{ + opacity: .8; +} + +.label{ + padding-bottom: 4px; + + display: inline-block; + + position: relative; +} +.label::after{ + content: ''; + + position: absolute; + top: 2px; + right: -20px; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/question.svg); + + cursor: pointer; +} +.label__title, .form-row label{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-3); +} +.label__question{ + position: absolute; + + padding: 8px; + + border-radius: 6px; + transition: height .2s ease-out; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + overflow: hidden; + background-color: var(--background-white); + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; +} +.label:hover .label__question{ + opacity: 1; + pointer-events: auto; +} + +.label-name{ + margin-bottom: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + display: block; +} +.form-input__error{ + margin-top: 4px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + + color: #f60909; + + display: none; + + position: relative; +} +.form-input__error--absolute{ + position: absolute; + bottom: -19.95px; + left: 0; + + width: 100%; +} +.form__input.error, .form-input__phone.error{ + border-color: #f60909; +} +.form__input.error + .form-input__error{ + display: block; +} +.form-input__phone.error .form-input__error{ + display: block; +} +.form-input-phone__input.error + .form-input__error--absolute::before{ + content: ''; + + position: absolute; + top: -53px; + left: -1px; + + width: 100%; + height: 48px; + + border-radius: 20px; + border: 1px solid #f60909; +} +.form-input__phone{ + padding: 12px 16px 12px ; + + display: flex; + align-items: center; + + border-radius: 20px; + border: 1px solid var(--text-black); + + cursor: pointer; + + position: relative; +} +.form-input__phone.focus{ + outline: 1px solid var(--text-black); +} +.form-input-phone__icon{ + flex-shrink: 0; + + height: 16px; + width: 28px; + + background-size: 16px; + background-repeat: no-repeat; + background-position: left; + + position: relative; +} +.form-input-phone__icon::after{ + content: ''; + + position: absolute; + top: 4px; + right: 0; + + width: 8px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/triangle-grey.svg); +} +.form-input-phone__code{ + flex-shrink: 0; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone__code::before{ + content: '+'; +} +.form-input-phone__input{ + margin-left: 6px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: none; + outline: none; +} +.form-input-phone__list{ + position: absolute; + top: 52px; + left: 8px; + + width: 280px; + + z-index: 10; + + transition: opacity .2s ease-out; + + opacity: 0; + pointer-events: none; + + border-radius: 20px; + + overflow: hidden; +} +.form-input-phone__list.active{ + opacity: 1; + pointer-events: auto; +} +.form-input-phone-list__search{ + width: 100%; + + padding: 12px 16px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-left: 1px solid var(--background-black); + border-right: 1px solid var(--background-black); + border-top: 1px solid var(--background-black); + border-radius: 20px 20px 0 0; + + background: var(--background-white); +} +.form-input-phone-list__search::placeholder{ + color: var(--text-6); +} +.form-input-phone-list__content{ + width: 100%; + max-height: 224px; + + padding: 24px 16px; + + border: 1px solid var(--background-black); + border-top: none; + border-radius: 0 0 20px 20px; + + background: var(--background-white); + + overflow-y: auto; +} +.form-input-phone-list__item{ + margin-top: 14px; + + display: flex; + align-items: center; + + background: none; + border: none; + + cursor: pointer; +} +.form-input-phone-list__item:first-child{ + margin-top: 0; +} +.form-input-phone-list-item__icon{ + width: 16px; + aspect-ratio: 1; +} +.form-input-phone-list-item__name{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone-list-item__code{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone-list-item__code::before{ + content: '+'; +} +.form-input__tabs{ + padding: 2px; + + display: flex; + + border-radius: 20px; + background: var(--gradient-turquoise); + + position: relative; +} +.form-input-tabs__button{ + width: 100%; + margin-bottom: 0; + padding: 10px; + cursor: pointer; + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + text-align: center; + + border-radius: 18px; + + z-index: 2; + + transition: background-color .2s ease-out; +} +.form-input-tabs__button.active{ + background-color: var(--background-white); +} +.form-input-tabs__input{ + display: none; +} +.form-input__radio{ + padding: 16px; + + display: flex; + flex-direction: column; +} +.form-input-radio__item{ + margin-top: 14px; + + display: flex; + align-items: center; +} +.form-input-radio__item:first-child{ + margin-top: 0; +} +.form-input-radio__circle{ + padding: 2px; + + width: 20px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--gradient-blue); + + position: relative; +} +.form-input-radio__item.active .form-input-radio__circle::before{ + content: ''; + + position: absolute; + top: 4px; + left: 4px; + + width: 12px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--gradient-blue); +} +.form-input-radio-circle__content{ + width: 16px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--background-white); +} +.form-input-radio__title{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); +} +.form-input-radio__input{ + display: none; +} +.form-input__list{ + position: relative; +} +.form-input__list::before{ + content: ''; + position: absolute; + top: 21.5px; + right: 19.5px; + width: 13px; + height: 8px; + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; + pointer-events: none; +} +.form-input-list__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + padding-right: 40px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: 1px solid var(--text-black); +} + +.form-input-list__input::placeholder{ + color: var(--text-grey); +} +.form-input-list__block-content{ + position: absolute; + top: 50px; + left: 0; + + width: 100%; + max-height: 192px; + height: 0; + + border-radius: 20px; + background-color: var(--background-white); + + overflow: hidden; + + transition: height .2s ease-out; + + z-index: 10; +} +.form-input-list__block-content.active{ + border: 1px solid var(--background-black); +} +.form-input-list__content{ + margin: 8px 16px; + + max-height: 176px; + + padding-right: 16px; + + overflow-y: auto; +} +.form-input-list__content::-webkit-scrollbar{ + border-radius: 8px; + width: 4px; + background: rgba(204, 204, 204, 0.2); +} +.form-input-list__content::-webkit-scrollbar-thumb{ + border-radius: 8px; + background: var(--background-9); +} +.form-input-list__content +.form-input-list__item{ + margin-top: 16px; + + width: 100%; + + display: flex; + justify-content: space-between; + align-items: center; + + border-radius: 8px; + padding: 4px; + + background: none; + border: none; +} +.form-input-list__item:first-child{ + margin-top: 0; +} +.form-input-list__item.active{ + background: rgba(204, 204, 204, 0.2); +} +.form-input-list-item__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-list-item__box{ + width: 20px; + aspect-ratio: 1; + + padding: 2px; + + border-radius: 4px; + + background: var(--gradient-blue); +} +.form-input-list-item-box__content{ + width: 16px; + aspect-ratio: 1; + + border-radius: 2px; + + background: var(--background-white); +} +.form-input-list__item.active .form-input-list-item-box__content{ + background: var(--gradient-blue); +} +.remote-control__item{ + display: none; +} +.remote-control__item.active{ + display: block; +} +/* .form-input-radio__ */ +/* form */ + + +.v-hidden{ + position: absolute !important; + clip: rect(1px 1px 1px 1px); + clip: rect(1px, 1px, 1px, 1px); + padding: 0 !important; + border: 0 !important; + height: 1px !important; + width: 1px !important; + overflow: hidden; +} + +.form-input-list-item-box__content{ + display: inline-flex; + align-items: center; + justify-content: center; +} + +.modalProfile{ + position: fixed; + top: 0; + left: 0; + + padding: 20px; + + width: 100vw; + height: 100vh; + + background: rgba(0, 0, 0, 0.25); + + z-index: 200; + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; + + display: flex; + justify-content: center; + align-items: center; + + overflow-y: auto; + padding-top: 30px; + padding-bottom: 30px; +} +.modalProfile.active{ + opacity: 1; + pointer-events: auto; +} + +.popup-wrap{ + width: 100%; + height: 100%; + display: flex; +} + +.modal-form{ + margin: auto; +} + +.iti__country-name{ + color: #000; +} + +.rm{ + margin-top: 24px; +} + +body { + background-color: rgb(255, 255, 255) !important; + background-image: none; +} + +.login_inner img{ + display: block; + margin: 40px auto; +} + + +.product-item__price p::after, +.modal-basket-item__price::after, +.modal-block-price__price::after, +.product-item-overlay__price::after, +.detail-block-price__price::after { +content: '₽'; +padding-left: 5px; +} + +.checkout { + margin-top: 2rem; +} + +.modal-basket-item__block-image{ + flex-shrink: 0; +} + +.modal-basket-item__content{ + flex-grow: 1; +} + +.modal__close{ + padding: 0; +} + +.woocommerce-order * { + color: #000; +} + +.woocommerce-notices-wrapper{ + position: relative; + top: 112px; + z-index: 100; +} + +.cabinet__control--column { + flex-direction: column; +} + +.form-input__tabs--white{ + padding: 3px; + border: 1px solid var(--text-3); + background: var(--white); + width: 100%; +} +.form-input__tabs--white .form-input-tabs__button.active{ + background: var(--gradient-turquoise); +} + +.form-input-tabs__button { + width: 100%; + padding: 10px; + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + text-align: center; + border-radius: 18px; + z-index: 2; + transition: background-color .2s ease-out; +} +@media (max-width: 1200px) { + .cabinet__profile .form-input__tabs{ + display: none; +} + +} + + + +.subscription{ + margin-top: 12px; + +} +.subscription__item{ + padding: 12px 0; + display: flex; + justify-content: space-between; + border-bottom: 1px solid #999; +} +.subscription__item{ + font-size: 20px; +} +.subscription__add{ + color: var(--text-black); +} +.subscription__add-header{ + +} +.subscription__add-title{ + font-size: 24px; +} +.subscription__add-content{ + padding: 24px 0 12px 0; +} +.subscription__add-product{ + align-items: start; +} +.subscription__add-product > *:nth-child(3){ + margin-left: auto; + align-items: center; +} +.subscription__add .cabinet-card-order-detail-main-product-description__what { + font-size: 16px; + line-height: 125%; +} +.subscription__add .cabinet-card-order-detail-main-product-description__with-what { + font-weight: 500; + font-size: 16px; +} +.subscription__add .cabinet-card-order-detail-main-product__count{ + font-weight: 700; + font-size: 16px; + line-height: 100%; +} +.subscription__add .cabinet-card-order-detail-main-product__price{ + font-weight: 500; + font-size: 20px; + line-height: 120%; +} +.subscription__add{ + width: 100%; +} + +@media only screen and (max-width: 720px) { + .subscription__item{ + flex-direction: column; + } + + .subscription__item > p:first-child{ + font-size: 16px; + color: var(--text-6); + } + .subscription__item > p:last-child{ + margin-top: 6px; + } + + .subscription__add-title { + font-size: 20px; + } + + .subscription__add-product{ + flex-wrap: wrap; + } + + .subscription__add-product > *:not(:first-child){ + padding-top: 0; + } + .subscription__add-product .cabinet-card-order-detail-main-product__img{ + width: 73px; + height: 66px; + } + .subscription__add-product .cabinet-card-order-detail-main-product-description__what{ + font-size: 12px; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + } + .subscription__add-product .cabinet-card-order-detail-main-product-description__with-what{ + margin-top: 8px; + + font-size: 12px; + } + .subscription__add-product .cabinet-card-order-detail-main-product__description { + width: calc(100% - 73px); + } + .subscription__add-product .cabinet-card-order-detail-main-product__content{ + position: static; + margin-top: -10px; + margin-left: auto; + width: calc(100% - 73px); + + display: flex; + justify-content: space-between; + align-items: center; + } + .subscription__add-product .cabinet-card-order-detail-main-product__count{ + position: static; + font-size: 12px; + } + .subscription__add-product .cabinet-card-order-detail-main-product__price{ + position: static; + font-size: 16px; + } +} diff --git a/wp-content/themes/cosmopet/static/css/single-product.css b/wp-content/themes/cosmopet/static/css/single-product.css new file mode 100644 index 0000000..c8cc517 --- /dev/null +++ b/wp-content/themes/cosmopet/static/css/single-product.css @@ -0,0 +1,4531 @@ + +/* общие */ +button{ + cursor: pointer; +} + +.wrapper{ + margin: 0 auto; + + max-width: 1600px; +} + +/* компоненты */ + +/* lang*/ +.lang{ + position: relative; +} +.lang__open{ + padding: 12px 15px; + + width: 74px; + + background: none; + border: none; + + display: flex; + align-items: center; + + transition: opacity .2s ease-out; +} +.lang__open:hover{ + opacity: .8; +} +.lang-open p{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + + text-align: start; + + color: var(--text-black); +} +.lang-open__arrow{ + margin-left: 7.25px; + + display: flex; + justify-content: center; + align-items: center; +} +.lang-open__black{ + +} +.lang-open__white{ + display: none; +} +.lang__content{ + position: absolute; + top: 33px; + left: -13px; + + height: 0; + + border-radius: 6px; + + transition: height .2s ease-out; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + overflow: hidden; + + background-color: var(--background-white); + + z-index: 100; +} +.lang__list{ + width: 104px; + + padding: 8px; + + list-style-type: none; +} +.lang__item{ + margin-top: 8px; +} +.lang__item:first-child{ + margin-top: 0; +} +.lang__link{ + display: block; + + width: 100%; + + padding: 4px; + + border-radius: 6px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + + text-decoration: none; + + position: relative; + + transition: background-color .2s ease-out; +} +.lang__link:hover, +.lang__item.active .lang__link{ + background-color: var(--background-grey); +} +.lang__item.active .lang__link::before{ + content: ''; + + position: absolute; + top: 10px; + right: 8px; + + width: 16px; + height: 12px; + + background-image: url(../img/svg/main/arrow-selected.svg); +} +/* lang */ + + +/* mini-profile */ +.mini-profile{ + display: flex; + align-items: center; +} +.mini-profile__item{ + margin-left: 8px; +} +.mini-profile__item:first-child{ + margin-left: 0; +} +.mini-profile__button{ + display: block; + + padding: 8px; + + display: flex; + justify-content: center; + align-items: center; + + background: none; + border: none; + + transition: opacity .2s ease-out; +} +.mini-profile__button:hover{ + opacity: .8; +} +.mini-profile__icon{ + width: 24px; + aspect-ratio: 1; +} +.mini-profile__icon.white{ + display: none; +} +/* mini-profile */ + + +/* main-menu */ +.main-menu{ + display: flex; + align-items: center; + + list-style-type: none; +} +.main-menu__item{ + margin-left: 24px; + + transition: opacity .2s ease-out; +} +.main-menu__item:first-child{ + margin-left: 0; +} +.main-menu__item:hover{ + opacity: .8; + + background: var(--background-grey); + border-radius: 24px; +} +.header.white .main-menu__item:hover .main-menu__link{ + color: var(--text-black); +} +.main-menu__item:active{ + opacity: 1; +} +.main-menu__link{ + display: block; + + padding: 8px 12px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + text-decoration: none; + + transition: color .2s ease-out; +} +.main-menu__button{ + padding: 8px 32px 8px 12px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + border: none; + border-radius: 24px; + + background: var(--gradient-turquoise); + + position: relative; +} +.main-menu__button::before{ + content: ''; + + position: absolute; + top: 14px; + right: 14px; + + width: 13px; + height: 8px; + + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; +} +/* main-menu */ + + +/* form */ +.form{ + width: 100%; + + padding: 24px 24px 43px; + + display: flex; + flex-direction: column; + + border-radius: 24px; + background: var(--gradient-turquoise); +} +.form__item{ + margin-top: 16px; +} +.form__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-black); +} +.form__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + border: 1px solid var(--text-black); + + background: var(--background-white); + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + + color: var(--text-black); +} +.form__input::placeholder{ + color: var(--text-grey); +} +.form__input--grey{ + border-color: var(--background-9); +} +.form__input--textarea{ + height: 96px; + resize: none; +} +.form__input--textarea-72{ + height: 72px; + resize: none; + + overflow: hidden; +} +.form__input--center{ + text-align: center; +} +.form__button{ + width: 100%; + + padding: 12px 24px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-white); + + border-radius: 16px; + border: none; + background: var(--background-black); + + cursor: pointer; + + transition: background-color .2s ease-out; +} +.form__button:hover{ + opacity: .8; +} + +.label{ + padding-bottom: 4px; + + display: inline-block; + + position: relative; +} +.label::after{ + content: ''; + + position: absolute; + top: 2px; + right: -20px; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/question.svg); + + cursor: pointer; +} +.label__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-3); +} +.label__question{ + position: absolute; + + padding: 8px; + + border-radius: 6px; + transition: height .2s ease-out; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + overflow: hidden; + background-color: var(--background-white); + + opacity: 0; + transition: opacity .2s ease-out; + pointer-events: none; +} +.label:hover .label__question{ + opacity: 1; + pointer-events: auto; +} + +.label-name{ + margin-bottom: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + display: block; +} +.form-input__error{ + margin-top: 4px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + + color: #f60909; + + display: none; + + position: relative; +} +.form-input__error--absolute{ + position: absolute; + bottom: -19.95px; + left: 0; + + width: 100%; +} +.modal-form__content.check .form__input:invalid{ + border-color: #f60909; +} +.modal-form__content.check .form__input:invalid + .form-input__error{ + display: block; +} +.modal-form__content.check .form-input-phone__input:invalid + .form-input__error{ + display: block; +} +.modal-form__content.check .form-input-phone__input:invalid + .form-input__error--absolute::before{ + content: ''; + + position: absolute; + top: -53px; + left: -1px; + + width: 100%; + height: 48px; + + border-radius: 20px; + border: 1px solid #f60909; +} +.form-input__phone{ + padding: 12px 16px 12px ; + + display: flex; + align-items: center; + + border-radius: 20px; + border: 1px solid var(--text-black); + + cursor: pointer; + + position: relative; +} +.form-input__phone.focus{ + outline: 1px solid var(--text-black); +} +.form-input-phone__icon{ + flex-shrink: 0; + + height: 16px; + width: 28px; + + background-size: 16px; + background-repeat: no-repeat; + background-position: left; + + position: relative; +} +.form-input-phone__icon::after{ + content: ''; + + position: absolute; + top: 4px; + right: 0; + + width: 8px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/triangle-grey.svg); +} +.form-input-phone__code{ + flex-shrink: 0; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone__code::before{ + content: '+'; +} +.form-input-phone__input{ + margin-left: 6px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: none; + outline: none; +} +.form-input-phone__list{ + position: absolute; + top: 52px; + left: 8px; + + width: 280px; + + z-index: 10; + + transition: opacity .2s ease-out; + + opacity: 0; + pointer-events: none; + + border-radius: 20px; + + overflow: hidden; +} +.form-input-phone__list.active{ + opacity: 1; + pointer-events: auto; +} +.form-input-phone-list__search{ + width: 100%; + + padding: 12px 16px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-left: 1px solid var(--background-black); + border-right: 1px solid var(--background-black); + border-top: 1px solid var(--background-black); + border-radius: 20px 20px 0 0; + + background: var(--background-white); +} +.form-input-phone-list__search::placeholder{ + color: var(--text-6); +} +.form-input-phone-list__content{ + width: 100%; + max-height: 224px; + + padding: 24px 16px; + + border: 1px solid var(--background-black); + border-top: none; + border-radius: 0 0 20px 20px; + + background: var(--background-white); + + overflow-y: auto; +} +.form-input-phone-list__item{ + margin-top: 14px; + + display: flex; + align-items: center; + + background: none; + border: none; + + cursor: pointer; +} +.form-input-phone-list__item:first-child{ + margin-top: 0; +} +.form-input-phone-list-item__icon{ + width: 16px; + aspect-ratio: 1; +} +.form-input-phone-list-item__name{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone-list-item__code{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-phone-list-item__code::before{ + content: '+'; +} +.form-input__tabs{ + padding: 2px; + + display: flex; + + border-radius: 20px; + background: var(--gradient-turquoise); + + position: relative; +} +.form-input__tabs--white{ + padding: 3px; + border: 1px solid var(--text-3); + background: var(--white); +} +.form-input__tabs--white .form-input-tabs__button.active{ + background: var(--gradient-turquoise); +} +.form-input-tabs__button{ + width: 100%; + + padding: 10px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + text-align: center; + + border-radius: 18px; + + z-index: 2; + + transition: background-color .2s ease-out; +} +.form-input-tabs__button.active{ + background-color: var(--background-white); +} +.form-input-tabs__input{ + display: none; +} +.form-input__radio{ + padding: 16px; + + display: flex; + flex-direction: column; +} +.form-input-radio__item{ + margin-top: 14px; + + display: flex; + align-items: center; +} +.form-input-radio__item:first-child{ + margin-top: 0; +} +.form-input-radio__circle{ + padding: 2px; + + width: 20px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--gradient-blue); + + position: relative; +} +.form-input-radio__item.active .form-input-radio__circle::before{ + content: ''; + + position: absolute; + top: 4px; + left: 4px; + + width: 12px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--gradient-blue); +} +.form-input-radio-circle__content{ + width: 16px; + aspect-ratio: 1; + + border-radius: 50%; + + background: var(--background-white); +} +.form-input-radio__title{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); +} +.form-input-radio__title.form-input-radio__title--no-span span{ + color: var(--text-dark); +} +.form-input-radio__price{ + margin-left: auto; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-radio__price::after{ + content: ' ₽'; +} +.form-input-radio__input{ + display: none; +} +.form-input__list{ + position: relative; +} +.form-input__list::before{ + content: ''; + position: absolute; + top: 21.5px; + right: 19.5px; + width: 13px; + height: 8px; + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; + pointer-events: none; +} +.form-input-list__input{ + width: 100%; + + border-radius: 20px; + padding: 12px 16px; + padding-right: 40px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: 1px solid var(--text-black); +} + +.form-input-list__input::placeholder{ + color: var(--text-grey); +} +.form-input-list__block-content{ + position: absolute; + top: 50px; + left: 0; + + width: 100%; + max-height: 192px; + height: 0; + + border-radius: 20px; + background-color: var(--background-white); + + overflow: hidden; + + transition: height .2s ease-out; + + z-index: 10; +} +.form-input-list__block-content.active{ + border: 1px solid var(--background-black); +} +.form-input-list__content{ + margin: 8px 16px; + + max-height: 176px; + + padding-right: 16px; + + overflow-y: auto; +} +.form-input-list__content::-webkit-scrollbar{ + border-radius: 8px; + width: 4px; + background: rgba(204, 204, 204, 0.2); +} +.form-input-list__content::-webkit-scrollbar-thumb{ + border-radius: 8px; + background: var(--background-9); +} +.form-input-list__content +.form-input-list__item{ + margin-top: 16px; + + width: 100%; + + display: flex; + justify-content: space-between; + align-items: center; + + border-radius: 8px; + padding: 4px; + + background: none; + border: none; +} +.form-input-list__item:first-child{ + margin-top: 0; +} +.form-input-list__item.active{ + background: rgba(204, 204, 204, 0.2); +} +.form-input-list-item__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-input-list-item__box{ + width: 20px; + aspect-ratio: 1; + + padding: 2px; + + border-radius: 4px; + + background: var(--gradient-blue); +} +.form-input-list-item-box__content{ + width: 16px; + aspect-ratio: 1; + + border-radius: 2px; + + background: var(--background-white); +} +.form-input-list__item.active .form-input-list-item-box__content{ + background: var(--gradient-blue); +} +.remote-control__item{ + display: none; +} +.remote-control__item.active{ + display: block; +} +/* .form-input-radio__ */ + +.form-agreement{ + display: flex; +} +.form-agreement__check{ + display: flex; + align-items: center; +} +.form-agreement__square{ + width: 18px; + aspect-ratio: 1; + + border-radius: 4px; + + border: 2px solid var(--background-black); +} +.form-agreement__label{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.form-agreement__input{ + display: none; +} +.form-agreement__input:checked + .form-agreement__square{ + border: none; + background: var(--gradient-blue); + + position: relative; +} +.form-agreement__input:checked + .form-agreement__square::after{ + content: ''; + + position: absolute; + top: 1px; + left: 1px; + + width: 16px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-selected-white.svg); + background-repeat: no-repeat; + background-position: center; +} +/* form */ + + +/* social media */ +.social-media{ + display: flex; + align-items: center; +} +.social-media__item{ + margin-left: 32px; + + transition: opacity .2s ease-out; +} +.social-media__item:hover{ + opacity: .8; +} +.social-media__item:first-child{ + margin-left: 0px; +} +.social-media__icon{ + width: 32px; + aspect-ratio: 1; +} +/* social media */ + + +/* breadcrumbs */ +.breadcrumbs{ + margin: 24px; + + display: flex; + align-items: center; +} +.breadcrumbs__item{ + display: block; + + padding: 0px 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-6); + + text-decoration: none; + + position: relative; +} +.breadcrumbs__item:first-child{ + padding-left: 0; +} +.breadcrumbs__item:nth-child(n+2)::before{ + content: ''; + + position: absolute; + top: -2px; + left: -12px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-breadcrumbs.svg); + background-repeat: no-repeat; + background-size: contain; +} +/* breadcrumbs */ + +/* compound */ +.compound{ + margin: -5px; + + min-height: 33.95px; + + display: flex; + align-items: start; +} +.compound__item{ + margin: 5px; + + padding: 4px 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: var(--text-black); + + border-radius: 16px; + background-color: var(--background-white); + + display: block; + text-decoration: none; +} +.compound__item:first-child{ + margin-left: 0; +} +.product__footer{ + margin: 48px 24px 24px; + + display: flex; + justify-content: center; +} +.product__footer--error{ + margin: 45px 0; +} +/* compound */ + +/* button */ +.button{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-radius: 20px; + + cursor: pointer; +} +.button--100-perc{ + width: 100%; +} +.button--white{ + padding: 11px 24px; + + text-align: center; + + background-color: var(--background-white); + border: 1px solid var(--background-black); + + transition: opacity .2s ease-out; +} +.button--white:hover{ + opacity: .8; +} +.button--white.active{ + background: var(--background-black); + color: var(--background-white); +} +.button--gradient{ + background: var(--gradient-turquoise); + border: none; + + transition: opacity .2s ease-out; +} +.button--gradient:hover{ + opacity: .8; +} +.button--base{ + padding: 12px 24px; +} +.button--high{ + height: 56px; + + padding: 16px 24px 24px 24px; + + font-weight: 700; + text-align: center; + + position: relative; +} +.button--high-46{ + padding: 12px 24px; + + font-size: 20px; + font-weight: 700; + line-height: 24px; +} +.button--icon{ + padding-right: 56px; + + text-align: start; +} +.button--filter::after{ + content: ''; + + position: absolute; + top: 16px; + right: 24px; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/filter.svg); + background-repeat: no-repeat; + background-size: contain; +} +.button--black{ + padding: 7px 15px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + + background: var(--background-black); + border: 1px solid var(--text-white); +} +.button--link{ + text-decoration: none; +} +.button--red-48-px{ + border-radius: 48px; +} +.to-know{ + /* width: 100%; */ + + padding: 12px 24px 7px 24px; + + display: flex; + justify-content: center; + + border: none; + + transition: opacity .2s ease-out; + text-decoration: none; +} + +.to-know--start{ + justify-content: start; + padding-left: 0; +} + +.to-know:hover{ + opacity: .8; +} +.to-know p{ + padding-bottom: 4px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border-bottom: 1px var(--text-black) solid; + + cursor: pointer; +} +.to-know--background-none{ + background: none; +} +.back{ + margin-top: 16px; + margin-left: 16px; + + padding: 8px; + padding-left: 32px; + + background: none; + border: none; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; + + position: relative; +} +.back::before{ + content: ''; + + position: absolute; + top: 8px; + left: 0; + + margin-right: 8px; + + width: 24px; + height: 24px; + + background-image: url(../img/svg/main/arrow-back.svg); +} + +.back::after{ + content: ''; + + position: absolute; + bottom: 6px; + left: 0; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); +} +/* button */ + +/* select */ +.select{ + max-width: 144px; + + position: relative; +} +.select__state{ + width: 100%; + + padding: 11px 47px 11px 13px; + + /* pointer-events:none; */ + + border: 1px solid var(--background-black); + border-radius: 20px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + cursor: pointer; + + position: relative; + + transition: opacity .2s ease-out; +} +.select:hover .select__state{ + opacity: .8; +} +.select::after{ + content: ''; + + position: absolute; + top: 20.5px; + right: 21.5px; + + width: 17px; + height: 10px; + + background-image: url(../img/svg/main/arrow-black.svg); + background-repeat: no-repeat; + background-size: contain; + + pointer-events: none; +} +.state__block{ + position: absolute; + top: 48px; + left: 0; + + width: 100%; + + height: 0; + overflow: hidden; + + transition: height .2s ease-out; +} +.state__content{ + padding: 8px; + + border-radius: 6px; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2); + background-color: var(--background-white); + + list-style-type: none; +} +.state__content li{ + margin-top: 8px; +} +.state__content li:first-child{ + margin-top: 0; +} +.state__button{ + width: 100%; + + padding: 4px 32px 4px 4px; + + background: none; + border: none; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-dark); + text-align: start; + + border-radius: 6px; + + transition: background-color .2s ease-out; + + position: relative; +} +.state__button:hover, +.state__button.active{ + background-color: var(--background-grey); +} + +.state__button.active::before{ + content: ''; + position: absolute; + top: 10px; + right: 8px; + width: 16px; + height: 12px; + background-image: url(../img/svg/main/arrow-selected.svg); +} + +/* select */ + +/* counter */ +.counter{ + display: flex; + align-items: center; +} +.counter__input{ + width: 48px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: center; + color: var(--text-black); + + pointer-events: none; + + background: none; + border: none; +} +.counter__button{ + width: 48px; + height: 48px; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--text-3); + border-radius: 24px; + + background: var(--background-white); + + transition: opacity .2s ease-out; +} +.counter__button:hover{ + opacity: .8; +} +.counter--small{ + +} +.counter--small .counter__button{ + width: 32px; + height: 32px; +} +.counter--small{ + +} +/* counter */ + + +.subscription{ + +} +.subscription__item{ + display: flex; + + color: var(--text-black); + font-family: var(--font-family); + font-weight: 500; + line-height: 120%; +} +.subscription__item:nth-last-child(n + 2){ + border-bottom: 1px solid var(--background-9); +} +.subscription__item span{ + font-weight: 700; +} +.subscription__item span small{ + font-size: 16px; +} +.subscription__status{ + color: var(--text-black); +} +.subscription__status--close{ + color: var(--text-red); +} +.subscription__status--end{ + color: var(--text-green); +} +.subscription__add{ + width: 100%; +} +.subscription__add-header{ +} +.subscription__add-product{ + align-items: start; +} +.subscription__add-product > *:not(:first-child){ + padding-top: 14px; +} +.subscription__add-title{ + font-family: var(--font-family); + font-weight: 600; + line-height: 133%; +} +.subscription__add-content{ + +} + +.tabs__buttons{ + margin: -12px; + + display: flex; + flex-wrap: wrap; +} +.tabs__content-wrap{ + margin-top: 24px; +} +.tabs__content{ + display: none; +} +.tabs__content.active{ + display: block; +} + +.cabinet__control--column{ + flex-direction: column; +} + +.cabinet__control--column > *:not(:first-child){ + margin-top: 16px +} + +.cabinet-card-order__payment{ + +} +.cabinet-card-order__sub-title{ + font-family: var(--font-family); + font-weight: 600; + line-height: 143%; + color: var(--text-3); +} +.cabinet-card-order__date{ + font-family: var(--font-family); + font-weight: 700; + line-height: 125%; + color: var(--text-3); +} + +.cabinet-card-order-payment__price span{ + font-size: 12px; +} + + + +.wcsatt-add-to-subscription-wrapper, + form.cart .quantity, + .detail__content .in-stock, + .wcsatt-options-prompt-label-subscription, + .wcsatt-options-product-dropdown { + display: none; + } + .wcsatt-options-product-wrapper { + display: block!important; + } + form.cart .single_add_to_cart_button { + margin: 8px; + min-width: 345.89px; + height: 56px; + padding: 16px 24px 16px 24px; + font-weight: 700; + text-align: center; + position: relative; + background: var(--gradient-turquoise); + border: none; + transition: opacity .2s ease-out; + font-family: var(--font-family); + font-size: 20px; + line-height: 120%; + color: var(--text-black); + border-radius: 20px; + text-transform: none; + cursor: pointer; + } + form.cart .single_add_to_cart_button:hover { + opacity: 0.8; + } + .subscription-option-details span { + color: #000; + cursor: pointer; + } + ul.wcsatt-options-product, .wcsatt-options-product-dropdown { + margin: 0; + } + .wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input { + width: 18px; + aspect-ratio: 1; + accent-color: var(--background-black); + cursor: pointer; + } + .subscription-option label { + display: flex; + align-items: center; + gap: 5px; + } + + form.cart { + margin: 25px 0 -48px; + } + ul.wcsatt-options-product--hidden, .wcsatt-options-product-dropdown--hidden { + display: block!important; + } + .detail-block__form{ + margin-top: 48px; + + display: flex; + flex-direction: column; + } + + + .wcsatt-options-prompt-text{ + font-family: 'Craftwork Grotesk'; + font-style: normal; + font-weight: 700; + font-size: 20px; + line-height: 24px; + text-transform: uppercase; + color: #000000; +} + +.subscription-option-details, .wcsatt-options-prompt-action, .subs-text-title{ + font-size: 20px; + line-height: 24px; + display:flex; + gap: 12px; + align-items: center; +} +.subs-text{ + +max-width: 322px; +font-family: 'Craftwork Grotesk'; +font-style: normal; +font-weight: 500; +font-size: 16px; +line-height: 20px; +margin-bottom: 20px; +} +input:checked + .subscription-option-details::before, input:checked + .wcsatt-options-prompt-action::before{ + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='url(%23paint0_radial_11890_46040)' stroke-width='2'/%3E%3Ccircle cx='10' cy='10' r='6' fill='url(%23paint1_radial_11890_46040)'/%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(19 1) rotate(135) scale(25.4558 34.7538)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3CradialGradient id='paint1_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(16 4) rotate(135) scale(16.9706 23.1692)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E"); +} +.subscription-option-details::before, .wcsatt-options-prompt-action::before{ + content: ''; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='%23121212' stroke-width='2'/%3E%3C/svg%3E"); + height: 20px; width: 20px; + +} + +.wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input { + aspect-ratio: 1; + accent-color: var(--background-black); + cursor: pointer; + height: 0; + width: 0; + position: absolute; + opacity: 0; +} + +.subscription-option .amount { + color: #1A1A1A; + font-weight: 600; +} + +.subscription-option del .amount { + color: #bbb; + font-weight: 400; + font-size: .8em; + +} + +.subscription-option del .woocommerce-Price-amount.amount, .subscription-option del .woocommerce-Price-currencySymbol{ + text-decoration: line-through !important; +} + +.woocommerce-Price-amount.amount{ + font-size: 1.15em; +} + +.detail #wc-stripe-express-checkout-element{ + display: none !important; +} + +.detail-block-form__item--radio{ + display: flex; + gap: 10px; +} + + +/* Основные стили для компьютера */ + +/* header start */ + +.header{ + position: relative; + + background-color: var(--background-white); + + position: fixed; + left: 0; + top: 0; + right: 0; + + z-index: 200; +} + +.detail .product__main{ + width: 100%; +} + +.header__content::after{ + content: ''; + + position: absolute; + left: auto; + right: auto; + bottom: 0; + + width: calc(100% - 48px); + max-width: 1552px; + height: 1px; + + background: var(--text-3); +} + +.detail-block-form__items{ + margin: 25px 0 0; +} + +.header__content{ + height: 72px; + + padding: 14px 24px; + + display: flex; + justify-content: space-between; + align-items: center; +} + +.header__open-menu{ + display: none; + + width: 24px; + aspect-ratio: 1; + + position: relative; + + border: none; + background: none; +} +.header__open-menu::before{ + content: ''; + + position: absolute; + top: 8px; + left: 4px; + + width: 16px; + height: 2px; + + background: var(--background-black); + border-radius: 1px; + +} +.header__open-menu::after{ + content: ''; + + position: absolute; + left: 4px; + bottom: 8px; + + width: 16px; + height: 2px; + + background: var(--background-black); + border-radius: 1px; +} + +.header__logo{ + width: 182px; + height: 40px; +} +.header__logo-black, +.header__logo-white{ + width: 100%; + height: 100%; +} +.header__logo-white{ + display: none; +} + +.header__menu-block{ + position: absolute; + top: 72px; + left: 0; + + width: 100%; + height: 0; + + overflow: hidden; + transition: height .2s ease-out; + + background-color: var(--background-white); + + z-index: 100; +} + +.header__pc-menu{ + padding: 40px 46px; + + display: flex; + justify-content: center; + + position: relative; +} +.header__pc-menu::before{ + content: ''; + + position: absolute; + top: 0; + left: 46px; + + width: 330px; + height: 248px; + + background-image: url(../img/pet/cat.png); + background-repeat: no-repeat; +} +.header__pc-menu::after{ + content: ''; + + position: absolute; + top: 0; + right: 46px; + + width: 330px; + height: 248px; + + background-image: url(../img/pet/dog.png); + background-repeat: no-repeat; +} +.header-pc-menu__content{ + width: 600px; + + display: flex; + justify-content: space-between; +} +.header-pc-menu__item{ + +} +.header-pc-menu__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + color: var(--text-black); + + text-decoration: none; +} +.header-pc-menu__list{ + margin-top: 16px; + + list-style-type: none; +} +.header-pc-menu__list-li{ + margin-top: 25px; +} +.header-pc-menu__list-li:first-child{ + margin-top: 0; +} +.header-pc-menu__list-li a{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-0); + + text-decoration: none; +} +.header__phone-menu{ + display: none; + + padding: 24px 16px; + + height: calc(100vh - 56px); + + overflow-x: auto; +} +.header-phone-menu__item{ + padding: 16px 0; + + border-top: 1px solid #f4f1f0; + border-bottom: 1px solid #f4f1f0; + + display: flex; + flex-direction: column; +} +.header-phone-menu__item:first-child{ + border-top: 0; +} +.header-phone-menu__item:last-child{ + border-bottom: 0; +} +.header-phone-menu__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; +} +.header-phone-menu__title--gradient{ + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.header-phone-menu__category{ + margin-top: 16px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 18px; + line-height: 133%; + color: var(--text-black); + + text-decoration: none; +} +.header-phone-menu__list{ + margin-top: 24px; + + padding-left: 32px; + + list-style-type: none; +} +.header-phone-menu__list-item{ + margin-top: 16px; +} +.header-phone-menu__list-item:first-child{ + margin-top: 0; +} +.header-phone-menu__list-item a{ + font-family: var(--font-family); + font-weight: 500; + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + text-decoration: none; +} +.header.white{ + background: none; +} +.header.white .header__logo-black{ + display: none; +} +.header.white .header__logo-white{ + display: block; +} +.header.white .main-menu__link{ + color: var(--text-white); +} +.header.white .main-menu__button{ + background: var(--background-white); +} +.header.white .lang__open{ + color: var(--text-white); +} +.header.white .header__content::after{ + background: var(--background-white); +} +.header.white .lang-open__black{ + display: none; +} +.header.white .lang-open__white{ + display: block; +} +.header.white .mini-profile__icon.white{ + display: block; +} +.header.white .mini-profile__icon.black{ + display: none; +} +.header.white .header__open-menu::before, +.header.white .header__open-menu::after{ + background: var(--background-white); +} +.header__phone-menu::-webkit-scrollbar { + width: 0px; +} + +main{ + padding-top: 72px; +} +/* header end */ + +/* product */ +.product{ + padding: 24px; + } + .product__header{ + display: flex; + justify-content: space-between; + align-items: center; + } + .product__tag{ + margin: 36px -12px -12px -12px; + + display: flex; + align-items: center; + flex-wrap: wrap; + } + .product-tag__item{ + margin: 12px; + + padding: 1px; + + border-radius: 16px; + + background: var(--gradient-blue); + border: none; + } + .product-tag-item__content{ + padding: 3px 11px; + + background: var(--background-white); + + border-radius: 15px; + + display: flex; + align-items: center; + } + .product-tag-item__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + } + .product-tag-item__button{ + margin: 2px 0 2px 4px; + + width: 20px; + aspect-ratio: 1; + + background: none; + border: none; + + background-image: url(../img/svg/main/gradient-x.svg); + background-repeat: no-repeat; + background-position: center; + } + .product__error{ + margin: auto; + + padding: 0 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + color: var(--text-0); + text-align: center; + } + .product__error-button{ + border-radius: 20px; + padding: 4px 24px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: 1px solid var(--text-0); + background: var(--background-white); + text-decoration: none; + } + .product__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; + text-align: center; + color: var(--text-black); + } + .product__main{ + margin: 36px -12px -12px; + + /* width: 100%; */ + + display: flex; + align-items: stretch; + flex-wrap: wrap; + } + .product__item{ + margin: 12px; + + width: calc(25% - 24px); + + display: flex; + flex-direction: column; + justify-content: space-between; + + background-color: var(--background-grey); + border-radius: 24px; + + overflow: hidden; + + position: relative; + } + .product__item::before{ + content: ''; + + position: absolute; + top: 0; + left: 0; + + width: calc(100% - 2px); + height: calc(100% - 2px); + + border: 1px solid #000; + border-radius: 24px; + + pointer-events: none; + transition: opacity .2s ease-out; + + opacity: 0; + } + .product__item:hover::before{ + opacity: 1; + } + .product__item.active::before{ + opacity: 0; + } + .product-item__block-label{ + position: absolute; + top: 16px; + left: 16px; + } + .product-item__label{ + position: absolute; + top: 16px; + left: 16px; + + margin: -2px; + + display: flex; + align-items: center; + + z-index: 10; + } + .product-item-label__tag{ + margin: 2px; + + padding: 4px 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + color: #f4f1f0; + + border-radius: 16px; + display: block; + + text-decoration: none; + } + .product-item-label__tag--new{ + background: var(--gradient-blue); + } + .product-item-label__tag--new-green{ + background: #d9ffcc; + color: #4e7623; + } + .product-item-label__tag--sale{ + background: var(--gradient-red); + } + .product-item-label__tag--sale-red{ + color: #fa0505; + background: #ffe5e5; + } + .product-item-label__tag--black{ + background: var(--background-black); + color: var(--text-white); + } + .product-item-label__tag--title{ + padding: 4px 2px; + + font-size: 16px; + line-height: 125%; + color: var(--text-black); + + display: flex; + align-items: center; + } + .product-item__product-card{ + height: 274px; + + display: flex; + justify-content: center; + align-items: center; + } + .product-item__images{ + height: 242px; + object-fit: contain; + } + .product-item__content-card{ + padding: 15.5px; + } + .product-item__title{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + text-decoration: none; + display: block; + } + .product-item__title:first-child{ + margin-top: 0; + } + .product-item__price{ + margin-top: 8px; + + display: flex; + align-items: center; + } + .product-item__price p{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 200%; + text-transform: uppercase; + color: var(--text-black); + } + .product-item__price p::after{ + + padding-left: 5px; + } + .product-item__price span{ + margin-left: 9px; + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-red); + } + .product-item__price del{ + margin-left: 24px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 18px; + line-height: 133%; + text-transform: uppercase; + text-decoration: line-through; + color: var(--text-6); + } + .product-item__price del::after{ + + } + .product-item__price span::before{ + content: '-'; + } + .product-item__price span::after{ + content: '%'; + } + .product-item__bye{ + margin-top: 8px; + } + .product__item.hiding .product-item__images{ + filter: grayscale(1) + } + .product__item.hiding .product-item__price{ + color: var(--text-grey); + } + .product-item__overlay{ + position: absolute; + top: 100%; + left: 0; + + width: 100%; + height: 100%; + + padding: 24px; + + display: flex; + flex-direction: column; + justify-content: space-between; + + border-radius: 24px; + backdrop-filter: blur(25px); + background-color: rgba(242, 242, 242, 0.8); + + z-index: 10; + + transition: top .4s ease-out; + } + .product-item__overlay.active{ + top: 0; + } + .product-item-overlay__header{} + .product-item-overlay__tags{ + margin: 4px -6px -6px -6px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-3); + + display: flex; + flex-wrap: wrap; + + list-style-type: none; + } + .product-item-overlay__tags li{ + margin: 4px 6px; + + position: relative; + } + .product-item-overlay__tags li:nth-child(n+1)::after{ + content: ''; + + position: absolute; + top: 6px; + right: -8px; + + width: 4px; + aspect-ratio: 1; + + background-color: var(--text-3); + border-radius: 50%; + } + .product-item-overlay__tags li:last-child::after, + .product-item-overlay__tags li:last-child::before{ + display: none; + } + .product-item-overlay__price{ + margin-top: 32px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); + } + .product-item-overlay__price::after{ + + } + .product-item-overlay__block-button{ + margin-top: 32px; + } + .product-item-overlay__button{ + margin-top: 16px; + } + .product-item-overlay__button:first-child{ + margin-top: 0; + } + .product-item-overlay__input-block{ + + } + .product-item-overlay__field{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; + } + .product-item-overlay__field:first-child{ + margin-top: 0; + } + .product-item-overlay-field__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-0); + } + .product-item__form{ + + } +/* product */ + +/* modal */ +/* .modal__button .to-know{ + display: none; +} */ +/* modal */ + +/* footer */ +.footer{ + margin-top: 80px; + + padding: 40px 24px; + + background: var(--background-black); +} +.footer__wrapper{ + width: 100%; + + display: flex; +} +.footer__content{ + width: calc(100% - 364px); +} +.footer__logo{ + width: 187px; + height: 43px; +} +.footer__address{ + margin-top: 24px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + font-style: normal; +} +.footer__list{ + margin: 28px -12px -12px -12px; + + display: flex; + justify-content: space-between; + flex-wrap: wrap; +} +.footer-list__item{ + margin: 12px; + + width: calc(50% - 24px); + + display: flex; + flex-direction: column; +} +.footer-list__item:nth-child(even){ + width: 322px; +} +.footer-list__item .button{ + border-radius: 24px; +} +.footer-list__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-white); +} +.footer-list__link{ + margin-top: 4px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-white); + + text-decoration: none; +} +.footer__form{ + margin-left: 48px; + + width: 364px; +} +.footer__about{ + margin-top: 16px; + + padding-top: 15px; + + display: flex; + justify-content: space-between; + align-items: center; + + border-top: 1px solid var(--text-white); +} +.footer-about__text{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + text-align: right; + color: var(--text-white); + opacity: 0.6; + + text-decoration: none; +} +.footer__social-media{ + display: none; +} +/* footer */ + +/* detail */ +.detail{ + margin: 48px 24px 24px 24px; + + display: flex; + align-items: start; + flex-wrap: wrap; +} +.detail__images{ + margin: -12px; + + width: calc(50% - 24px); + + display: flex; + flex-wrap: wrap; +} +.detail__image{ + margin: 12px; + + border-radius: 24px; + + display: flex; + align-items: center; + justify-content: center; + + background: var(--background-grey); + cursor: pointer; +} +.detail__image--width-perc-100{ + width: calc(100% - 24px); + height: 600px; + +} +.detail__image--width-perc-50{ + width: calc(50% - 24px); + height: 288px; +} +.detail__image--width-perc-100 img{ + width: 90%; + height: 90%; + + object-fit: contain; +} +.detail__image--width-perc-50 img{ + width: 100%; + height: 100%; + + object-fit: contain; +} +.detail__content{ + margin-left: 48px; + + width: calc(50% - 24px); +} +.detail__label{ + margin: -2px; + display: flex; + align-items: center; +} +.detail__label-wrap { + display: flex; + flex-wrap: wrap; + gap: 5px; + align-items: center; +} +.detail__label .product-item-label__tag:last-child{ + margin-left: auto; +} +.detail__label .product-item-label__tag:first-child{ + margin-left: 0; +} +.detail__title{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; + color: var(--text-black); +} +.detail__block-price{ + margin-top: 24px; + + display: flex; + align-items: center; +} +.detail-block-price__price{ + font-family: var(--font-family); + font-weight: 700; + font-size: 36px; + line-height: 111%; + text-transform: uppercase; +} +.detail-block-price__price::after{ + +} +.detail-block-price__sale{ + margin-left: 22px; + + display: flex; + align-items: center; +} +.detail-block-price-sale__text{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 120%; + text-transform: uppercase; + text-decoration: line-through; + color: var(--text-6); +} +.detail-block-price-sale__text::after{ + +} +.detail-block-price-sale__perc{ + margin-left: 9px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-red); +} +.detail-block-price-sale__perc::before{ + content: '-'; +} +.detail-block-price-sale__perc::after{ + content: '%'; +} +.detail-block__form{ + margin-top: 48px; + + display: flex; + flex-direction: column; +} +.detail-block-form__item{ + margin-top: 24px; + + min-width: 345.89px; + + display: flex; + align-items: center; + flex-wrap: wrap; +} +.detail-block-form__item--radio{ + margin: 16px -8px -8px -8px; +} +.detail-block-form__item:first-child{ + margin-top: 0; +} +.detail-block-form__item button{ + margin: 8px; +} +.detail-block-form__submit{ + min-width: 345.89px; +} +.detail__warning{ + padding: 3px; + + border-radius: 24px; + + background: var(--gradient-turquoise); +} +.detail-warning__content{ + padding: 26px; + + border-radius: 22px; + + background: var(--background-white); +} +.detail-warning__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + color: var(--text-black); +} +.detail-warning__text{ + margin-top: 16px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.detail__toggle{ + margin-top: 48px; + margin-bottom: 48px; +} +.detail__wrapper-catalot{ + margin-top: 64px; + + width: calc(100% + 16px); + + overflow: hidden; + + position: relative; +} +.detail__catalot{ + +} +.detail-catalot__header{ + padding-right: 16px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.detail-catalot__control{ + display: flex; + align-items: center; +} +.detail-catalot-control__button{ + margin-left: 24px; + + width: 48px; + aspect-ratio: 1; + + border-radius: 50%; + border: 1px solid var(--background-black); + background: none; + + display: flex; + justify-content: center; + align-items: center; +} +.detail-catalot__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 100%; + text-transform: uppercase; + text-align: start; + color: var(--text-0); +} +.detail-catalot__content{ + margin: 12px -12px -12px -12px; + + width: 100%; + + display: flex; +} +.detail__catalot .product__item{ + width: calc(100% - 24px); +} +.detail__images-phone{ + display: none; +} +.back-detail{ + display: none; +} +.toggle__table{ + margin-top: 32px; + + display: flex; + flex-wrap: wrap; +} +.toggle__table:first-child{ + margin-top: 0; +} +.toggle__table--three .toggle-table__block:nth-child(1){ + width: 33%; +} +.toggle__table--three .toggle-table__block:nth-child(2){ + width: 33%; +} +.toggle__table--three .toggle-table__block:nth-child(3){ + width: 33%; +} +.toggle__table--two .toggle-table__block{ + width: calc(50% - 20px); +} +.toggle__table--two .toggle-table__block:nth-child(even){ + margin-left: 40px; +} +.toggle-table__block{ + +} +.toggle-table__item{ + margin-top: 8px; + + width: 100%; + + display: flex; + justify-content: space-between; +} +.toggle-table__item p{ + display: block; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + flex-shrink: 0; +} +.toggle-table__item .warning{ + width: 100%; +} +.toggle-table__item .warning p{ + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + text-align: center; +} +.toggle-table__title{ + margin-bottom: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.toggle-table__title--center{ + text-align: center; +} +.toggle-table-item__line{ + margin: 23px 8px 0 8px; + + width: 100%; + + height: 1px; + background: linear-gradient(to right, transparent 50%, #fff 50%), linear-gradient(to right, #333, #333); + background-size: 4px 2px, 100% 2px; + + opacity: .6; +} + + +/* End | Toggle */ + + +.radio-button{ +} +.radio-button__input{ + display: none; +} + + + + +/* detail */ + +/* gallery */ +.gallery{ + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + + padding: 24px; + + display: flex; + align-items: center; + + background: var(--background-white); + + pointer-events: none; + opacity: 0; + transition: opacity .2s ease-out; + + z-index: 300; +} +.gallery.active{ + opacity: 1; + pointer-events: auto; +} +.gallery__close{ + position: absolute; + top: 24px; + right: 24px; + + z-index: 10; +} +.gallery__pagination{ + margin: -12px; +} +.gallery-pagination__item{ + margin: 12px; + + width: 134px; + height: 136px; + + display: flex; + justify-content: center; + align-items: center; + + border: none; + border-radius: 16px; + background: var(--background-grey); +} +.gallery-pagination__item img{ + width: 90%; + max-height: 90%; + + object-fit: contain; +} +.gallery__slider{ + margin-left: 48px; + + padding: 100px; +} +.gallery__slider{ + width: 100%; +} +.gallery__slider .swiper-pagination{ + display: none; +} +.gallery__slider .swiper-button-next::after, +.gallery__slider .swiper-button-prev::after{ + display: none; +} +.gallery-button{ + width: 48px; + height: 48px; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--background-black); + border-radius: 20px; + + background: none; +} +.gallery__slider .swiper-slide{ + display: flex; + justify-content: center; + align-items: center; +} +.gallery__block{ + width: 600px; + height: 774px; + + display: flex; + justify-content: center; + align-items: center; + + background: var(--background-grey); + border-radius: 24px; +} +.gallery__block img{ + width: 90%; + max-height: 90%; + + object-fit: contain; +} +.gallery__wrapper{ + margin: 0 auto; + max-width: 1600px; + + display: flex; + align-items: center; +} +/* .swiper { + width: 600px; + height: 300px; +} */ + +/* gallery */ + + +/* cabinet */ +.cabinet{ + padding: 24px; + + display: flex; + justify-content: space-between; +} +.cabinet__control{ + margin: 24px; + margin-bottom: 0; + + display: none; +} +.cabinet-control__button{ + margin-left: 8px; + + padding: 12px 16px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + background: var(--background-white); + border: 2px solid var(--text-black); + border-radius: 48px; + + transition: opacity .2s ease-out; +} +.cabinet-control__button:first-child{ + margin-left: 0; +} +.cabinet-control__button.active{ + background: var(--background-black); + color: var(--text-white); +} +.cabinet-control__button:hover{ + opacity: .8; +} +.cabinet__orders{ + width: calc(((100% - 48px) / 3) * 2); +} +.cabinet__profile{ + width: calc((100% - 48px) / 3); +} + +.cabinet-card{ + margin-top: 32px; + + padding: 1px; + + border-radius: 20px; +} +.cabinet-card:first-child{ + margin-top: 0; +} +.cabinet-card--green{ + background: var(--background-green); +} +.cabinet-card--green-white{ + background: var(--background-green-white); +} +.cabinet-card--green-white .cabinet-card__content{ + background: none; +} +.cabinet-card--red-blue{ + background: var(--gradient-red); +} +.cabinet-card--grey{ + background: var(--background-9); +} +.cabinet-card__content{ + padding: 23px; + + border-radius: 19px; + + background-color: var(--background-white); +} +.cabinet-card__element{ + margin-top: 24px; + + position: relative; +} +.cabinet-card__element--margin-top-32{ + margin-top: 32px; +} +.cabinet-card__element:first-child, +.cabinet-card__element--margin-top-32:first-child{ + margin-top: 0 +} +.cabinet-card__element-change{ + position: absolute; + top: 14px; + right: 0; + + width: 24px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/change-dot.svg); + border: none; + background-color: var(--background-white); + + transition: opacity .2s ease-out; +} +.cabinet-card__element-change:hover{ + opacity: .8; +} +.cabinet-card__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; + background: var(--gradient-blue); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.cabinet-card__text{ + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + + color: var(--text-black); +} +.cabinet-card__text--grey{ + color: var(--text-grey); +} +.cabinet-card__label{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + + color: var(--text-3); +} +.cabinet-card__status{ + padding-left: 20px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + + position: relative; +} +.cabinet-card__status--chek{ + color: var(--text-green); +} +.cabinet-card__status--chek::before{ + content: ''; + + position: absolute; + top: 0; + left: 0; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/status-chek.svg); + object-fit: contain; +} +.cabinet-card__status--cancelled{ + color: var(--text-red); +} +.cabinet-card__status--cancelled::before{ + content: ''; + + position: absolute; + top: 0; + left: 0; + + width: 16px; + height: 16px; + + background-image: url(../img/svg/main/status-cancelled.svg); + object-fit: contain; +} +.cabinet-card__block-accounts{ + display: flex; +} +.cabinet-card__account{ + margin-left: 16px; + + width: 40px; + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; + + background: var(--background-9); + border-radius: 50%; +} +.cabinet-card__account:first-child{ + margin-left: 0; +} +.cabinet-card__block-buttons{ + display: flex; + justify-content: space-between; + align-items: center; +} +.cabinet-card__button{ + padding: 8px 8px 6px 0; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + background: none; + border: none; + + position: relative; + + text-decoration: none; +} +.cabinet-card__button::before{ + content: ''; + + position: absolute; + bottom: 6px; + + width: calc(100% - 8px); + height: 1px; + + background: var(--text-black); + + transition: opacity .2s ease-out; +} +.cabinet-card__button:hover{ + opacity: .8; +} +.cabinet-card__confirm{ + margin-top: 16px; + + border-radius: 20px; + padding: 4px 24px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + + + background: var(--background-black); + color: var(--text-white); + border: none; + + transition: opacity .2s ease-out; +} +.cabinet-card__confirm:hover{ + opacity: .8; +} +.cabinet-card__text, .cabinet-card__label, .cabinet-card__status, .cabinet-card__block-accounts, .cabinet-card__block-buttons{ + margin-top: 8px; +} +.cabinet-card__text:first-child, .cabinet-card__label:first-child, .cabinet-card__status:first-child, .cabinet-card__block-accounts:first-child, .cabinet-card__block-buttons:first-child{ + margin-top: 0px; +} +.cabinet-card__block-add-pets{ + width: 100%; + + display: flex; + align-items: center; + + background: none; + border: none; +} +.cabinet-card-add-pets__circle{ + width: 48px; + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; + + border: 1px solid var(--text-6); + border-radius: 50%; +} +.cabinet-card-add-pets__text{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 600; + font-size: 20px; + line-height: 120%; + + color: var(--text-6); + + position: relative; +} +.cabinet-card-add-pets__text::after{ + content: ''; + + position: absolute; + left: 0; + bottom: -4px; + + width: 100%; + height: 1px; + + background: var(--text-6); +} +.cabinet-card__discount{ + display: flex; + align-items: center; +} +.cabinet-card-discount__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card-discount__percent{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card-discount__percent::after{ + content: '%'; +} +.cabinet-card-discount__arrow{ + display: inline-block; + + margin-left: 6px; + + width: 20px; + aspect-ratio: 1; + + background-image: url(../img/svg/main/arrow-breadcrumbs-black.svg); + background-position: center; +} +.cabinet-card__no-orders{ + margin-top: 32px; + + padding: 48px 24px; +} +.cabinet-card-no-orders__element{ + margin-top: 26px; +} +.cabinet-card-no-orders__element:first-child{ + margin-top: 0; +} +.cabinet-card-no-orders__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + text-align: center; + color: var(--text-black); +} +.cabinet-card__pet{ + display: flex; + align-items: center; +} +.cabinet-card-pet__icon{ + width: 48px; + aspect-ratio: 1; + + border-radius: 50%; + background: var(--gradient-blue); +} +.cabinet-card-pet-icon__content{ + margin: 1px; + + width: calc(100% - 2px); + aspect-ratio: 1; + + display: flex; + justify-content: center; + align-items: center; + + border-radius: 50%; + background: var(--background-white); +} +.cabinet-card-pet-icon__content img{ + width: 32px; + aspect-ratio: 1; + + object-fit: contain; +} +.cabinet-card-pet__name{ + margin-left: 24px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card__order{ + position: relative; +} +.cabinet-card-order__header{ + display: flex; + justify-content: space-between; + align-items: flex-start; +} +.cabinet-card-order__main{} +.cabinet-card-order-main__date{ + font-family: var(--font-family); + font-weight: 500; + font-size: 24px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-main__number{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-main__number::before{ + content: '№'; +} +.cabinet-card-order__payment{ + display: flex; + align-items: flex-end; + + transition: margin .2s ease-out; +} +.cabinet-card-order-payment__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-payment__price{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 16px; + line-height: 125%; + color: var(--text-black); +} +.cabinet-card-order-payment__price::after{ + margin-left: 5px; + +} +.cabinet-card-order-payment__price--add::after{ + display: none; +} +.cabinet-card-order__content{ + margin-top: 24px; +} +.cabinet-card-order__content +.cabinet-card-order__status{ + display: flex; + align-items: center; +} +.cabinet-card-order-status__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-status__pointer{ + margin-left: 12px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-status__pointer--grey{ + color: var(--text-6); +} +.cabinet-card-order-status__pointer--green{ + color: var(--text-green); +} +.cabinet-card-order-status__pointer--red{ + color: var(--text-red); +} +.cabinet-card-order__block-detail{ + height: 0; + overflow: hidden; + + transition: height .2s ease-out; +} +.cabinet-card-order__detail{ + padding-top: 24px; +} +.cabinet-card-order-detail__address{} +.cabinet-card-order-detail-address__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-detail-address__text{ + margin-top: 16px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.cabinet-card-order-detail__main{ + margin-top: 24px; + + display: flex; + justify-content: space-between; +} +.cabinet-card-order-detail-main__products{} +.cabinet-card-order-detail-main__product{ + margin-top: 4px; + + display: flex; + align-items: center; +} +.cabinet-card-order-detail-main__product:first-child{ + margin-top: 0; +} +.cabinet-card-order-detail-main-product__img{ + width: 106px; + height: 96px; +} +.cabinet-card-order-detail-main-product__content{ + display: flex; +} +.cabinet-card-order-detail-main-product__description{ + width: 212px; +} +.cabinet-card-order-detail-main-product-description__what{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.cabinet-card-order-detail-main-product-description__with-what{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-6); +} +.cabinet-card-order-detail-main-product__count{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-6); +} +.cabinet-card-order-detail-main-product__count::before{ + margin-right: 4px; + + content: 'x'; +} +.cabinet-card-order-detail-main-product__price{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-black); +} +.cabinet-card-order-detail-main-product__price::after{ + content: ' Р'; +} +.cabinet-card-order-detail-main__links{ + display: flex; + flex-direction: column; +} +.cabinet-card-order-detail-main__link{ + margin-top: 16px; +} +.cabinet-card-order-detail-main__link:first-child{ + margin-top: 0; +} +.cabinet-card-order__open-detail{ + margin-top: 24px; + + padding-right: 24px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); + + border: none; + background: none; + + position: relative; +} +.cabinet-card-order__open-detail::after{ + content: ''; + + position: absolute; + top: 6.75px; + right: 0; + + width: 12.5px; + height: 10.5px; + + background-image: url(../img/svg/main/arrow-black.svg); + background-size: contain; + background-position: center; + background-repeat: no-repeat; + + transition: transform .2s; + /* transform: rotate(180deg); */ +} +.cabinet-card-order__detail-short{ + position: absolute; + right: 0; + bottom: 0; + + display: flex; + align-items: center; + + transition: opacity .2s .1s ease-out; +} +.cabinet-card-order-detail-short__item{ + border-radius: 16px; + width: 106px; + height: 96px; +} +.cabinet-card__download{ + margin-top: 32px; +} +.cabinet-card__order.active .cabinet-card-order__detail-short{ + opacity: 0; +} +.cabinet-card__order.active .cabinet-card-order__open-detail::after{ + transform: rotate(180deg); +} +.cabinet-card-order__payment-add{ + display: flex; + flex-direction: column; + align-items: start; +} +.cabinet-card-order__sub-title{ + font-size: 14px; +} +.cabinet-card-order__date{ + font-size: 16px; +} +/* .cabinet-card-no-orders__ */ +.cabinet__subscription-pc{ +} +.cabinet__subscription-mobile{ + display: none; +} +/* cabinet */ + +@media only screen and (max-width: 1600px) { + +.wrapper{ + max-width: 1280px; +} + +.product__item{ + margin: 12px; + + width: calc(33.3% - 24px); +} + +.gallery__wrapper{ + max-width: 1280px; +} + +.header__content::after{ + max-width: 1232px; +} +} + +@media only screen and (max-width: 1365px) { + .gallery__wrapper{ + max-width: 100%; + } + +} + +.subscription{ + margin-top: 12px; +} +.subscription__item{ + padding: 12px 0; + justify-content: space-between; +} +.subscription__item{ + font-size: 20px; +} +.subscription__add{ + color: var(--text-black); +} +.subscription__add-header{ + +} +.subscription__add-title{ + font-size: 24px; +} +.subscription__add-content{ + padding: 24px 0 12px 0; +} +.subscription__add-product{ + align-items: start; +} +.subscription__add-product > *:nth-child(3){ + margin-left: auto; + align-items: center; +} +.subscription__add .cabinet-card-order-detail-main-product-description__what { + font-size: 16px; + line-height: 125%; +} +.subscription__add .cabinet-card-order-detail-main-product-description__with-what { + font-weight: 500; + font-size: 16px; +} +.subscription__add .cabinet-card-order-detail-main-product__count{ + font-weight: 700; + font-size: 16px; + line-height: 100%; +} +.subscription__add .cabinet-card-order-detail-main-product__price{ + font-weight: 500; + font-size: 20px; + line-height: 120%; +} + +/* Стили для планшетов */ +@media only screen and (max-width: 1200px) { +/* header */ +main{ + padding-top: 64px; +} +.main-menu{ + display: none; +} +.header__open-menu{ + display: block; +} +.lang{ + display: none; +} +.header__logo{ + width: 136px; + height: 29px; +} +.header__content{ + height: auto; + + padding: 8px 16px; +} +.mini-profile__item:nth-child(2){ + margin-left: 0; +} +.header::after{ + left: 0; + + width: 100%; +} +.header__pc-menu{ + display: none; +} +.header__phone-menu{ + display: block; +} +.header__menu-block{ + top: 56px; +} +.header__content::after{ + left: 0; + right: 0; + width: 100%; +} +/* header */ + +/* footer */ +.footer{ + margin-top: 0; + + padding: 24px 16px; +} +/* footer */ + +/* breadcrumbs */ +.breadcrumbs{ + display: none; +} +/* breadcrumbs */ + +/* product */ +.product{ + padding: 12px; + padding-top: 20px; +} +.product__title{ + font-weight: 700; + font-size: 26px; + line-height: 123%; + text-transform: uppercase; +} +.to-know p { + font-size: 18px; +} +.toggle-table__title{ + font-weight: 700; + font-size: 12px; + line-height: 133%; +} +.toggle-table__item p{ + font-weight: 500; + font-size: 12px; + line-height: 133%; +} +.toggle-table-item__line{ + margin-top: 12px; +} +.detail{ + margin: 24px 16px; +} +.back-detail{ + display: inline; +} +.detail-catalot__title{ + font-size: 22px; +} +.product__footer--error{ + margin: 48px 0px 24px; +} +/* product */ + +/* modal */ +.modal{ + padding: 0; +} +.modal__text{ + padding-right: 0; +} +.form__button-pc{ + display: none; +} +.form__button-mobile{ + display: block; +} +.modal-form{ + /* min-height: 100%; + width: 100%; + + border-radius: 0; + border: none; */ +} +.modal__notification{ + margin: 24px; +} +.form-input-phone__list{ + left: 0; +} + +.modal-form-content__line--two{ + flex-wrap: wrap; +} +.modal-form-content__line--two .modal-form-content-line__element{ + margin-top: 24px; + + width: 100%; +} +.modal-form-content__line--two .modal-form-content-line__element:first-child{ + margin-top: 0; +} +.modal-map{ + width: 100%; + + flex-direction: column; + + border-radius: 0; +} +.modal-map__left, .modal-map__right{ + width: 100%; +} +.modal-map__map iframe { + width: 100%; + height: 528px; +} +.modal-map-form__button{ + display: none; +} +.modal-map-form__sub-button{ + margin-top: 64px; + + padding: 0 24px; + + display: flex; + } +/* modal */ + +/* cabinet */ +.cabinet{ + flex-direction: column; + + position: relative; +} +.cabinet__control{ + display: flex; + + position: relative; +} +.cabinet__orders, .cabinet__profile{ + width: calc(100% - 48px); +} +.cabinet__orders, .cabinet__profile{ + position: absolute; + opacity: 0; + + transition: opacity .2s ease-out; +} +.cabinet-content{ + pointer-events:none; +} +.cabinet__orders.active, .cabinet__profile.active{ + opacity: 1; +} +.cabinet__orders.hide, .cabinet__profile.hide{ + position: static; + display: block; + pointer-events:auto; + + width: 100%; +} +.cabinet__subscription-pc{ + display: none; +} +.cabinet__subscription-mobile{ + display: block; + + margin: 24px 24px 0 24px; +} +.cabinet__orders .cabinet-card:nth-child(2){ + margin-top: 0; + } + .cabinet__orders--no-cab .cabinet-card:nth-child(2){ + margin-top: 32px; + } +/* cabinet */ +} + +@media only screen and (max-width: 980px) { +/* product */ +.product__item{ + width: calc(50% - 24px); +} +/* product */ + + +/* detail */ +.detail{ + flex-direction: column; +} +.detail__images{ + display: none; +} +.detail__content{ + width: 100%; +} +.detail__content{ + margin-left: 0; +} + +.detail__images-phone{ + display: block; + + margin-top: 48px; + margin-bottom: 48px; + + position: relative; + + overflow: hidden; +} +.detail__images-phone .swiper-slide{ + display: flex; + justify-content: center; +} +.detail-images-phone__image-block{ + width: 100%; + aspect-ratio: 1; + max-width: 500px; + + display: flex; + justify-content: center; + align-items: center; + + background: var(--background-grey); + border-radius: 16px; +} + +.detail__images-phone .swiper-pagination-bullet{ + width: 8px; + height: 8px; + + border-radius: 50%; + + border: 1px solid #666; + background-color: #666; + + opacity: 1; +} +.detail__images-phone .swiper-pagination-bullet.swiper-pagination-bullet-active{ + background-color: var(--background-white); +} + +.detail__images-phone .swiper-pagination{ + margin-bottom: 19px; +} +.detail__title{ + font-size: 26px; + line-height: 123%; +} +.gallery__slider .swiper-pagination { + display: block; +} +.gallery__pagination{ + display: none; +} + +.gallery__slider .swiper-pagination-bullet{ + width: 8px; + height: 8px; + border-radius: 50%; + border: 1px solid #666; + background-color: #666; + opacity: 1; +} +.gallery__wrapper .gallery-button{ + display: none; +} + +.gallery__slider .swiper-pagination-bullet.swiper-pagination-bullet-active{ + background-color: var(--background-white); +} + +.gallery__slider{ + margin-left:0; + padding: 0px 0px 50px 0px; + /* padding: 40px; */ +} +.gallery__block { + width: 100%; + aspect-ratio: 1; + height: auto; +} +/* detail */ +} + +@media only screen and (max-width: 750px) { +/* cabinet */ +.cabinet-card-order__open-detail{ + margin-top: 144px; +} +.cabinet-card-order__detail-short{ + right: auto; + left: 0; + bottom: 48px; +} +.cabinet-card-order-detail-short__item{ + margin-left: -27px; +} +.cabinet-card-order-detail-short__item:first-child{ + margin-left: 0; +} +.cabinet-card__order.active .cabinet-card-order__open-detail{ + margin-top: 24px; +} +.cabinet-card-order__link{ + margin-top: 144px; +} +/* cabinet */ +} + + +/* Стили для мобильных устройств */ +@media only screen and (max-width: 720px) { +/* product */ +.product__item{ + width: calc(100% - 24px); +} +/* product */ + +/* modal */ +.modal__basket{ + width: 100%; +} +.modal__filter{ + width: 100%; +} +.modal__to-know, +.modal__to-know-submit{ + width: 100%; +} +.modal__button .to-know{ + display: flex; + + background: none; +} +.modal__basket .modal__header { + height: calc(100% - 156px); + margin-bottom: -36px; +} +.modal-basket-item__block-image{ + position: absolute; + width: 80px; +} +.modal-basket-item__image{ + width: 48px; +} +.modal-basket-item__content{ + margin-left: 0; + + padding-left: 96px; +} +.modal-basket-item__control{ + margin-left: -80px; +} +.modal-basket-item__title{ + min-height: 40px; + + font-size: 16px; +} +.modal-basket__item--return{ + flex-direction: column; + align-items: start; +} +.modal-basket__item--return .modal-basket-item__title{ + margin-right: auto; +} +.notification--width-584{ + width: 100%; +} +.notification__title{ + font-size: 20px; +} +.notification__text--center-pc{ + text-align: start; +} +.notification__img{ + height: 360px; +} +.notification__title{ + padding-right: 96px; +} +.modal-form__buttons--two{ + flex-wrap: wrap; +} +.modal-form__buttons--two button, .modal-form__buttons--two input{ + margin-top: 24px; + width: 100%; +} +.modal-form__buttons--two button:first-child, .modal-form__buttons--two input:first-child{ + margin-top: 0; +} +.modal-map__control{ + flex-wrap: wrap; +} +.modal-map-control__item{ + width: calc(100% - 24px); +} +.form__full-mobile{ + width: 100%; + border-radius: 0; + border: none; +} + +.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){ + width: 69px; +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){ + +} +.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){ + width: 82px; +} +.form__input{ + padding: 12px 14px; +} +.modal-form--height-100-phone{ + min-height: 100%; +} +/* modal */ + +/* footer */ +.footer__about{ + display: none; +} +.footer__wrapper{ + flex-direction: column; +} +.footer__content{ + width: 100%; +} +.footer__form{ + margin-top: 24px; + margin-left: 0; + + width: 100%; +} +.footer__social-media{ + display: block; + + margin-top: 24px; +} +.footer-about__text{ + padding-top: 35px; + display: block; + text-align: left; +} +.footer__list{ + margin-top: 20px; +} +/* footer */ + +/* detail */ +.toggle__table--two .toggle-table__block{ + width: 100%; +} +.toggle__table--two .toggle-table__block:nth-child(even){ + margin-top: 32px; + margin-left: 0; +} +.toggle__table--three .toggle-table__block:nth-child(1){ + width: 31%; +} +/* detail */ + +/* cabinet */ +.cabinet-card__title{ + font-size: 20px; +} +.cabinet-card__no-orders{ + margin-top: 16px; +} +.cabinet-card-order__header{ + flex-direction: column; +} +.cabinet-card-order__payment{ + margin-top: 16px; +} +.cabinet-card-order-detail__main{ + flex-direction: column; +} +.cabinet-card-order-detail-main__links{ + margin-top: 24px; + + align-items: start; +} +.cabinet-card-order-detail-main-product__img{ + width: 70px; + height: 70px; +} +.cabinet-card-order-detail-main__product{ + margin-top: 16px; + + align-items: start; +} +.cabinet-card-order-detail-main-product__content{ + margin-left: 16px; + + flex-wrap: wrap; + + position: relative; +} +.cabinet-card-order-detail-main-product__description{ + width: 100%; +} +.cabinet-card-order-detail-main-product__count{ + position: absolute; + left: 116px; + bottom: 0; +} +.cabinet-card-order-detail-main-product__price{ + position: absolute; + left: 153px; + bottom: 0; +} +.cabinet-card__content{ + padding-right: 19px; +} +.cabinet-card-order-main__date{ + font-size: 20px; +} +/* .cabinet-card__order.active */ +/* .cabinet-card__order.active */ +/* cabinet */ +} + +@media only screen and (max-width: 576px) { +/* header */ + +/* header */ + +/* product */ +.product__header{ + flex-direction: column; + align-items: start; +} +.product__header .button{ + margin-top: 48px; +} +/* product */ + +/* modal */ +.modal__aside{ + left: 0; +} +.form-input-radio__title span{ + display: block; + width: 100%; + + color: var(--text-grey); +} +.modal-form__title{ + font-size: 20px; +} +/* modal */ + +/* detail */ +.detail-block-form__item, +.detail-block-form__submit{ + min-width: 100%; +} +/* detail */ + +/* cabinet */ + +.cabinet-card-order-detail-main-product__img{ + width: 40px; + height: 40px; +} + +.cabinet-card-order-detail-main-product__count{ + left: auto; + right: 71px; +} +.cabinet-card-order-detail-main-product__price{ + left: auto; + right: 0; +} +.cabinet-card-order__detail-short{ + transition-delay: 0; + transition-duration: 0; +} +/* cabinet */ +} + +@media only screen and (max-width: 720px) { + .subscription__item{ + flex-direction: column; + } + + .subscription__item > p:first-child{ + font-size: 16px; + color: var(--text-6); + } + .subscription__item > p:last-child{ + margin-top: 6px; + } + + .subscription__add-title { + font-size: 20px; + } + + .subscription__add-product{ + flex-wrap: wrap; + } + + .subscription__add-product > *:not(:first-child){ + padding-top: 0; + } + .subscription__add-product .cabinet-card-order-detail-main-product__img{ + width: 73px; + height: 66px; + } + .subscription__add-product .cabinet-card-order-detail-main-product-description__what{ + font-size: 12px; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + } + .subscription__add-product .cabinet-card-order-detail-main-product-description__with-what{ + margin-top: 8px; + + font-size: 12px; + } + .subscription__add-product .cabinet-card-order-detail-main-product__description { + width: calc(100% - 73px); + } + .subscription__add-product .cabinet-card-order-detail-main-product__content{ + position: static; + margin-top: -10px; + margin-left: auto; + width: calc(100% - 73px); + + display: flex; + justify-content: space-between; + align-items: center; + } + .subscription__add-product .cabinet-card-order-detail-main-product__count{ + position: static; + font-size: 12px; + } + .subscription__add-product .cabinet-card-order-detail-main-product__price{ + position: static; + font-size: 16px; + } +} + + + +.order{ + display: flex; +} +.order__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 117%; + text-transform: uppercase; + color: var(--text-black); +} +.order__contacts{ + width: calc(50% - 0.5px); + + padding: 24px; + + border-right: 1px solid #121212; +} +.order-contacts__header{ + display: flex; + justify-content: space-between; + align-items: center; +} +.order-contacts__form{ + margin-top: 24px; +} +.order-contacts__delivery{ + margin-top: 47.5px; + + padding-top: 48px; + + border-top: 1px solid var(--background-grey); +} + +.order-contacts-deliver__item{ + margin-top: 24px; +} +.order-contacts-deliver__date{ + padding: 8px; + + border-radius: 24px; + + background: var(--background-grey); +} +.order-contacts-deliver__date .form-input-radio__item{ + margin-top: 24px; +} +.order-contacts-deliver__date .form-input-radio__item:first-child{ + margin-top: 0; +} +.order__your{ + width: calc(50% - 0.5px); + + padding: 24px 24px 24px 48px; + + background: var(--background-grey); +} +.order-your__products{ + margin-top: 48px; +} +.order-your-products__item{ + margin-top: 16px; + + display: flex; + justify-content: space-between; +} +.order-your-products__left{ + display: flex; +} +.order-your-products__img{ + width: 40px; + aspect-ratio: 1; + + border-radius: 16px; +} +.order-your-products__content{ + margin-left: 16px; +} +.order-your-products__name{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); + + text-decoration: none; +} +.order-your-products__description{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-6); +} +.order-your-products__description span{ + font-weight: 700; +} +.order-your-products__description span::before{ + margin-left: 3px; + + content: 'x '; +} +.order-your-products__right{ + display: flex; +} +.order-your-products__count{ + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-6); +} +.order-your-products__count::before{ + content: 'x'; +} +.order-your-products__price{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-black); +} +.order-your-products__price::after{ + content: 'Р'; +} +.order-your__calculation{ + margin-top: 48px; +} +.order-your__promo{ + display: flex; +} +.order-your-promo__button{ + margin-left: 8px; +} +.order-your-calculation__item{ + margin-top: 24px; + + display: flex; + justify-content: space-between; + align-items: center; +} +.order-your-calculation__title{ + font-family: var(--font-family); + font-weight: 500; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} +.order-your-calculation__value{ + font-family: var(--font-family); + font-weight: 700; + font-size: 20px; + line-height: 200%; + text-transform: uppercase; + text-align: right; + color: var(--text-black); +} +.order-your-calculation__value--price::after{ + content: ' ₽'; +} +.order-your-calculation__value--discount{ + background: var(--gradient-red); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +.order-your-calculation__value--discount::before{ + content: '- '; +} +.order-your-calculation__description{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-9); +} +.order-your-calculation__line{ + margin-top: 23px; + border: 1px solid var(--background-9); +} +.order-your-calculation__result{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 117%; + text-transform: uppercase; + color: var(--text-black); +} +.order-your-calculation__submit{ + margin-top: 48px; +} + +@media only screen and (max-width: 1200px) { +.order{ + display: block; +} +.order__contacts, .order__your{ + border: none; + width: 100%; +} +} + +@media only screen and (max-width: 720px) { +.order__title{ + max-width: 181px; + + font-size: 20px; + line-height: 120%; +} +.order__your{ + margin-top: 16px; +} +.order__contacts{ + padding: 24px 16px; +} +.order__your{ + padding: 40px 16px 9px 16px; +} +.order-your__promo{ + display: block; +} +.order-your-promo__button{ + margin-left: 0; + margin-top: 24px; + + width: 100%; +} +.order-your-products__content{ + max-width: 164px; +} +.order-your-products__count, .order-your-products__price{ + flex-shrink: 0; +} +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/fonts/Abel/Abel-Regular.ttf b/wp-content/themes/cosmopet/static/fonts/Abel/Abel-Regular.ttf new file mode 100644 index 0000000..5245501 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/Abel/Abel-Regular.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Bold.ttf b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Bold.ttf new file mode 100644 index 0000000..9c62ebc Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Bold.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Medium.ttf b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Medium.ttf new file mode 100644 index 0000000..b8629fc Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Medium.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Regular.ttf b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Regular.ttf new file mode 100644 index 0000000..7298891 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Regular.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-SemiBold.ttf b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-SemiBold.ttf new file mode 100644 index 0000000..926c24f Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-SemiBold.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Bold.woff b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Bold.woff new file mode 100644 index 0000000..e06b43d Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Bold.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Bold.woff2 b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Bold.woff2 new file mode 100644 index 0000000..a1a3337 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Bold.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Medium.woff b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Medium.woff new file mode 100644 index 0000000..d922e47 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Medium.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Medium.woff2 b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Medium.woff2 new file mode 100644 index 0000000..0e03542 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Medium.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Regular.woff b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Regular.woff new file mode 100644 index 0000000..cae3279 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Regular.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Regular.woff2 b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Regular.woff2 new file mode 100644 index 0000000..5bcac6c Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-Regular.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-SemiBold.woff b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-SemiBold.woff new file mode 100644 index 0000000..a3b3cb0 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-SemiBold.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-SemiBold.woff2 b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-SemiBold.woff2 new file mode 100644 index 0000000..a28684e Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/CraftworkGrotesk-SemiBold.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-bold.ttf b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-bold.ttf new file mode 100644 index 0000000..2068cf4 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-bold.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-medium.ttf b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-medium.ttf new file mode 100644 index 0000000..5006ac0 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-medium.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-regular.ttf b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-regular.ttf new file mode 100644 index 0000000..ef2dbf4 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-regular.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-semi-bold.ttf b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-semi-bold.ttf new file mode 100644 index 0000000..e866547 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/craftwork/craftwork-grotesk-semi-bold.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.ttf b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.ttf new file mode 100644 index 0000000..02f3aa3 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.woff b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.woff new file mode 100644 index 0000000..7e32bd6 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.woff2 b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.woff2 new file mode 100644 index 0000000..2659c5e Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-demi.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.ttf b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.ttf new file mode 100644 index 0000000..ef964ec Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.woff b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.woff new file mode 100644 index 0000000..ed3b1ac Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.woff2 b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.woff2 new file mode 100644 index 0000000..cb6110c Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/din-2014/din-2014-rounded-regular.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Medium.woff b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Medium.woff new file mode 100644 index 0000000..561ec78 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Medium.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Medium.woff2 b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Medium.woff2 new file mode 100644 index 0000000..3e9c1c7 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Medium.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Regular.woff b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Regular.woff new file mode 100644 index 0000000..bf7bb7c Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Regular.woff differ diff --git a/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Regular.woff2 b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Regular.woff2 new file mode 100644 index 0000000..3374d82 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/roboto/Roboto-Regular.woff2 differ diff --git a/wp-content/themes/cosmopet/static/fonts/roboto/roboto-medium.ttf b/wp-content/themes/cosmopet/static/fonts/roboto/roboto-medium.ttf new file mode 100644 index 0000000..8798341 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/roboto/roboto-medium.ttf differ diff --git a/wp-content/themes/cosmopet/static/fonts/roboto/roboto-regular.ttf b/wp-content/themes/cosmopet/static/fonts/roboto/roboto-regular.ttf new file mode 100644 index 0000000..7d9a6c4 Binary files /dev/null and b/wp-content/themes/cosmopet/static/fonts/roboto/roboto-regular.ttf differ diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/arrow-down.svg b/wp-content/themes/cosmopet/static/img/arrow-down.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/arrow-down.svg rename to wp-content/themes/cosmopet/static/img/arrow-down.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/author-1.png b/wp-content/themes/cosmopet/static/img/author-1.png similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/author-1.png rename to wp-content/themes/cosmopet/static/img/author-1.png diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/author-2.png b/wp-content/themes/cosmopet/static/img/author-2.png similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/author-2.png rename to wp-content/themes/cosmopet/static/img/author-2.png diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/author-3.png b/wp-content/themes/cosmopet/static/img/author-3.png similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/author-3.png rename to wp-content/themes/cosmopet/static/img/author-3.png diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/author-4.png b/wp-content/themes/cosmopet/static/img/author-4.png similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/author-4.png rename to wp-content/themes/cosmopet/static/img/author-4.png diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/author-5.png b/wp-content/themes/cosmopet/static/img/author-5.png similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/author-5.png rename to wp-content/themes/cosmopet/static/img/author-5.png diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/author-main-card.png b/wp-content/themes/cosmopet/static/img/author-main-card.png similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/author-main-card.png rename to wp-content/themes/cosmopet/static/img/author-main-card.png diff --git a/wp-content/themes/cosmopet/static/img/bars.svg b/wp-content/themes/cosmopet/static/img/bars.svg index c5f23ad..0ff9b2e 100644 --- a/wp-content/themes/cosmopet/static/img/bars.svg +++ b/wp-content/themes/cosmopet/static/img/bars.svg @@ -1,3 +1,11 @@ - - + + + + + + + + + + diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/basket-icon.svg b/wp-content/themes/cosmopet/static/img/basket-icon.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/basket-icon.svg rename to wp-content/themes/cosmopet/static/img/basket-icon.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/favicon.ico b/wp-content/themes/cosmopet/static/img/favicon.ico similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/favicon.ico rename to wp-content/themes/cosmopet/static/img/favicon.ico diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/footer-network-1.svg b/wp-content/themes/cosmopet/static/img/footer-network-1.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/footer-network-1.svg rename to wp-content/themes/cosmopet/static/img/footer-network-1.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/footer-network-2.svg b/wp-content/themes/cosmopet/static/img/footer-network-2.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/footer-network-2.svg rename to wp-content/themes/cosmopet/static/img/footer-network-2.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/footer-network-3.svg b/wp-content/themes/cosmopet/static/img/footer-network-3.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/footer-network-3.svg rename to wp-content/themes/cosmopet/static/img/footer-network-3.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/header-red.svg b/wp-content/themes/cosmopet/static/img/header-red.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/header-red.svg rename to wp-content/themes/cosmopet/static/img/header-red.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/heart-grey.svg b/wp-content/themes/cosmopet/static/img/heart-grey.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/heart-grey.svg rename to wp-content/themes/cosmopet/static/img/heart-grey.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/heart-white.svg b/wp-content/themes/cosmopet/static/img/heart-white.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/heart-white.svg rename to wp-content/themes/cosmopet/static/img/heart-white.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/heart.svg b/wp-content/themes/cosmopet/static/img/heart.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/heart.svg rename to wp-content/themes/cosmopet/static/img/heart.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/indent-icon-1.svg b/wp-content/themes/cosmopet/static/img/indent-icon-1.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/indent-icon-1.svg rename to wp-content/themes/cosmopet/static/img/indent-icon-1.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/logo-green.svg b/wp-content/themes/cosmopet/static/img/logo-green.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/logo-green.svg rename to wp-content/themes/cosmopet/static/img/logo-green.svg diff --git a/wp-content/themes/cosmopet/static/img/logo.svg b/wp-content/themes/cosmopet/static/img/logo.svg index 319f8a0..d3929b8 100644 --- a/wp-content/themes/cosmopet/static/img/logo.svg +++ b/wp-content/themes/cosmopet/static/img/logo.svg @@ -1,4 +1,3 @@ - - - + + diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/long-arrow.svg b/wp-content/themes/cosmopet/static/img/long-arrow.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/long-arrow.svg rename to wp-content/themes/cosmopet/static/img/long-arrow.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/minus-icon.svg b/wp-content/themes/cosmopet/static/img/minus-icon.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/minus-icon.svg rename to wp-content/themes/cosmopet/static/img/minus-icon.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/msg-green.svg b/wp-content/themes/cosmopet/static/img/msg-green.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/msg-green.svg rename to wp-content/themes/cosmopet/static/img/msg-green.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/msg-grey.svg b/wp-content/themes/cosmopet/static/img/msg-grey.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/msg-grey.svg rename to wp-content/themes/cosmopet/static/img/msg-grey.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/msg-white.svg b/wp-content/themes/cosmopet/static/img/msg-white.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/msg-white.svg rename to wp-content/themes/cosmopet/static/img/msg-white.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/msg.svg b/wp-content/themes/cosmopet/static/img/msg.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/msg.svg rename to wp-content/themes/cosmopet/static/img/msg.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/plus-icon.svg b/wp-content/themes/cosmopet/static/img/plus-icon.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/plus-icon.svg rename to wp-content/themes/cosmopet/static/img/plus-icon.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/swp-next.svg b/wp-content/themes/cosmopet/static/img/swp-next.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/swp-next.svg rename to wp-content/themes/cosmopet/static/img/swp-next.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/swp-prev.svg b/wp-content/themes/cosmopet/static/img/swp-prev.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/swp-prev.svg rename to wp-content/themes/cosmopet/static/img/swp-prev.svg diff --git a/wp-content/themes/cosmopet/modules/author/assets/img/user-icon.svg b/wp-content/themes/cosmopet/static/img/user-icon.svg similarity index 100% rename from wp-content/themes/cosmopet/modules/author/assets/img/user-icon.svg rename to wp-content/themes/cosmopet/static/img/user-icon.svg diff --git a/wp-content/themes/cosmopet/static/js/author-posts-ajax.js b/wp-content/themes/cosmopet/static/js/author-posts-ajax.js new file mode 100644 index 0000000..8fdcaff --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/author-posts-ajax.js @@ -0,0 +1,46 @@ +jQuery(document).ready(function ($) { + $('#ajax-load-author').on('submit', function (e) { + e.preventDefault(); + var form = $(this); + var currentPage = parseInt($('#page_num').val()); + var totalPosts = parseInt(form.data('total')); + var postsPerPage = 9; + + console.log('Current page before load:', currentPage); + console.log('Total posts:', totalPosts); + console.log('Posts loaded before request:', postsPerPage); + + var data = { + action: 'get_author_posts', + page_num: currentPage, + author_id: form.data('author') + }; + + console.log('Sending AJAX request with data:', data); + + $.ajax({ + url: '/wp-admin/admin-ajax.php', + type: 'POST', + data: data, + success: function (response) { + console.log('AJAX response received'); + $(".anons-article__card-wrap").append(response); + + $('#page_num').val(currentPage + 1); + console.log('New page number:', currentPage + 1); + + // Считаем общее количество загруженных постов + var currentlyDisplayed = $('.anons-article__card-wrap .anons-best__card').length; + console.log('Actually displayed posts:', currentlyDisplayed); + + if (currentlyDisplayed >= totalPosts) { + console.log('Hiding load more button - all posts loaded'); + form.hide(); + } + }, + error: function (error) { + console.error('AJAX error:', error); + } + }); + }); +}); \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/js/blog.js b/wp-content/themes/cosmopet/static/js/blog.js new file mode 100644 index 0000000..01e6ab9 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/blog.js @@ -0,0 +1,185 @@ + + const homeSwp = new Swiper('.home-swp .swiper', { + slidesPerView: 1, + spaceBetween: 0, + effect: 'fade', + fadeEffect: { + crossFade: true, // Включаем перекрестное затухание + }, + allowTouchMove: false, + speed: 750, + loop: true, + navigation: { + nextEl: '.home-swp__btn-next', + prevEl: '.home-swp__btn-prev', + } + }) +jQuery(document).ready(function ($) { + $('#ajax-load-blog').on('submit', function (e) { + e.preventDefault() + var data = $(this).serialize() + $.ajax({ + url: '/wp-admin/admin-ajax.php', // Use the AJAX URL from wp_localize_script + type: 'POST', + data: data, + success: function (response) { + $(".anons-article__card-wrap").append(response) + $('#page_num').val(Number($('#page_num').val()) + 1) + if (Number($('#page_num').val()) >= Number($('#ajax-load-blog').data('total'))){ + $('#ajax-load-blog').hide() + } + }, + error: function (error) { + + } + }); + }); +}); + +jQuery(document).ready(function ($) { + $(".comment-btn button").on("click", function () { + var postId = $(this).data("post-id"); + var $button = $(this); + + $.ajax({ + url: "/wp-admin/admin-ajax.php", + type: "POST", + data: { + action: "add_post_like", + post_id: postId, + }, + success: function (response) { + if (response.error) { + alert(response.error); + window.location.href = "/wp-login.php"; + return; + } + + $(".comment-btn span").text(response.count); + + if (response.is_liked) { + $button.addClass("active"); + + $button.find("svg path").attr({ + fill: "rgba(255, 0, 0, 0.7)", + stroke: "#ff0000", + }); + } else { + $button.removeClass("active"); + + $button.find("svg path").attr({ + fill: "rgb(18, 18, 18)", + stroke: "#666666", + }); + } + }, + error: function (error) { + if (error.responseJSON && error.responseJSON.data) { + alert(error.responseJSON.data); + window.location.href = "/wp-login.php"; + } + }, + }); + }); + + $(document).on("click", ".comment-like-btn", function () { + var commentId = $(this).data("comment-id"); + var $button = $(this); + + $.ajax({ + url: "/wp-admin/admin-ajax.php", + type: "POST", + data: { + action: "add_comment_like", + comment_id: commentId, + }, + success: function (response) { + if (response.error) { + alert(response.error); + window.location.href = "/wp-login.php"; + return; + } + + if (response.is_liked) { + $button + .empty() + .append( + $( + '' + ) + ) + .append(response.count); + $button.addClass("active"); + } else { + $button + .empty() + .append( + $( + '' + ) + ) + .append(response.count); + $button.removeClass("active"); + } + }, + error: function (error) { + if (error.responseJSON && error.responseJSON.data) { + alert(error.responseJSON.data); + window.location.href = "/wp-login.php"; + } + }, + }); + }); + + function checkLikedPosts() { + if (!document.body.classList.contains("logged-in")) { + return; + } + + $.ajax({ + url: "/wp-admin/admin-ajax.php", + type: "POST", + data: { + action: "check_user_likes", + }, + success: function (response) { + if (response.error) { + return; + } + + try { + var data = JSON.parse(response); + + if (data.posts && data.posts.length > 0) { + for (var i = 0; i < data.posts.length; i++) { + var $button = $('.comment-btn button[data-post-id="' + data.posts[i] + '"]'); + $button.addClass("active"); + $button.find("svg path").attr({ + fill: "rgba(255, 0, 0, 0.7)", + stroke: "#ff0000", + }); + } + } + + if (data.comments && data.comments.length > 0) { + for (var j = 0; j < data.comments.length; j++) { + var $commentButton = $('.comment-like-btn[data-comment-id="' + data.comments[j] + '"]'); + $commentButton.addClass("active"); + + $commentButton.find("svg path").attr({ + fill: "rgba(255, 0, 0, 0.7)", + stroke: "#ff0000", + }); + } + } + } catch (e) {} + }, + error: function (error) {}, + }); + } + + if (document.body.classList.contains("logged-in")) { + checkLikedPosts(); + } + }); + \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/js/cart.js b/wp-content/themes/cosmopet/static/js/cart.js new file mode 100644 index 0000000..fa75b93 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/cart.js @@ -0,0 +1,424 @@ +jQuery(document).ready(function($) { + // Открытие/закрытие модалки + // $(document).on('click', '.cart-contents, .continue-shopping, .modal__close', function(e) { + // e.preventDefault(); + // $('#modal-basket').toggleClass('active'); + // }); + + // Обновление количества через input + $(document).on('change', '.counter__input', function () { + const $input = $(this); + const key = $input.data('key'); + const quantity = parseInt($input.val(), 10); + + if (quantity > 0) { + updateCart(key, quantity, false); + + const $item = $input.closest('.modal-basket-item__control'); + const $priceElement = $item.find('.woocommerce-Price-amount'); + const currentPriceText = $priceElement.text().replace(/[^\d,]/g, '').replace(',', '.'); + const currentTotal = parseFloat(currentPriceText); + + // Защита от деления на 0 + if (!isNaN(currentTotal) && currentTotal > 0) { + const oldQuantity = parseInt($input.prop('defaultValue'), 10); + const unitPrice = currentTotal / oldQuantity; + const newTotal = unitPrice * quantity; + + // Получаем текущий символ валюты из разметки + const currencySymbol = $priceElement.find('.woocommerce-Price-currencySymbol').text().trim(); + + // Формируем новую цену с тем же символом + $priceElement.find('bdi').html( + newTotal.toLocaleString('ru-RU', { minimumFractionDigits: 0 }) + + ' ' + currencySymbol + '' + ); + + // Обновить значение по умолчанию (чтобы расчёт unitPrice был корректен в следующий раз) + $input.prop('defaultValue', quantity); + } + } else { + removeItem(key); + } + }); + + + $(document).on('click', '.modal__basket .counter__button.plus', function(e) { + e.preventDefault(); + const key = $(this).data('key'); + const input = $(this).siblings('.counter__input'); + const quantity = parseInt(input.val()) + 1; + input.val(quantity).trigger('change'); + }); + + // // Уменьшение количества + $(document).on('click', '.modal__basket .counter__button.minus', function(e) { + e.preventDefault(); + const key = $(this).data('key'); + const input = $(this).siblings('.counter__input'); + let quantity = parseInt(input.val()) - 1; + + if (quantity <= 0) { + removeItem(key); // Вызываем удаление, если количество становится 0 + } else { + input.val(quantity).trigger('change'); // Обновляем количество, если больше 0 + } + }); + + $(document).on('click', '.remove-item', function() { + const key = $(this).data('key'); + removeItem(key); + }); + + // Удаление товара + function formatMoney(amount) { + if (typeof woocommerce_params !== 'undefined' && woocommerce_params.currency_format) { + const format = woocommerce_params.currency_format; + return format + .replace('%1$s', woocommerce_params.currency_symbol) + .replace('%2$s', parseFloat(amount).toFixed(2)); + } + return woocommerce_params.currency_symbol + parseFloat(amount).toFixed(2); + } + + // Хранилище временно удалённых товаров + const removedItemsStorageKey = 'woocommerce_removed_items'; + + function restoreRemovedItems() { + const removedItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || []; + + if (removedItems.length === 0) return; + + $('#modal-basket').addClass('loading'); + + // Создаем копию массива для работы + let itemsToRemove = [...removedItems]; + + function processNextItem() { + if (itemsToRemove.length === 0) { + // Все элементы обработаны + localStorage.removeItem(removedItemsStorageKey); + updateCartFragment(); + $('#modal-basket').removeClass('loading'); + return; + } + + const element = itemsToRemove.shift(); // Берем первый элемент + + $.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: { + action: 'remove_cart_item', + cart_item_key: element.key + }, + success: function(response) { + if (response.success) { + // Обновляем localStorage, удаляя только что обработанный элемент + const currentItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || []; + const updatedItems = currentItems.filter(item => item.key !== element.key); + localStorage.setItem(removedItemsStorageKey, JSON.stringify(updatedItems)); + } + // Обрабатываем следующий элемент + processNextItem(); + }, + error: function() { + // Продолжаем даже при ошибке + processNextItem(); + } + }); + } + + // Начинаем обработку + processNextItem(); + } + + // Инициализация при загрузке + restoreRemovedItems(); + + // Функция удаления товара с возможностью восстановления + function removeItem(key) { + const $item = $(`[data-key="${key}"]`); + const productId = $item.data('product_id'); + const variationId = $item.data('variation_id') || 0; + const quantity = parseInt($item.find('.counter__input').val()); + + + $('#modal-basket').addClass('loading'); + + $.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: { + action: 'remove_cart_item', + cart_item_key: key + }, + complete: function() { + $('#modal-basket').removeClass('loading'); + }, + success: function(response) { + if (response.success) { + // Удаляем из временного хранилища + const removedItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || []; + const updatedItems = removedItems.filter(item => + !(item.product_id === productId && item.variation_id === variationId) + ); + localStorage.setItem(removedItemsStorageKey, JSON.stringify(updatedItems)); + + updateCartFragment(); + // $('[data-key="' + key + '"]').remove() + } + } + }); + + } + + + // Восстановление товара + function restoreItem(key, productId, variationId, quantity) { + $('#modal-basket').addClass('loading'); + + $.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: { + action: 'restore_cart_item', + product_id: productId, + variation_id: variationId, + quantity: quantity + }, + complete: function() { + $('#modal-basket').removeClass('loading'); + }, + success: function(response) { + if (response.success) { + // Удаляем из временного хранилища + const removedItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || []; + const updatedItems = removedItems.filter(item => + !(item.product_id === productId && item.variation_id === variationId) + ); + localStorage.setItem(removedItemsStorageKey, JSON.stringify(updatedItems)); + + // Показываем кнопку Proceed to checkout + $('.proceed-to-checkout').css('display', ''); + + updateCartFragment(); + } + } + }); + } + + // --- Работа с cookie --- + function setCookie(name, value, days) { + let expires = ''; + if (days) { + const date = new Date(); + date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); + expires = '; expires=' + date.toUTCString(); + } + document.cookie = name + '=' + (value || '') + expires + '; path=/'; + } + function getCookie(name) { + const nameEQ = name + '='; + const ca = document.cookie.split(';'); + for(let i=0;i < ca.length;i++) { + let c = ca[i]; + while (c.charAt(0)==' ') c = c.substring(1,c.length); + if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); + } + return null; + } + // --- Конец работы с cookie --- + + // Открытие корзины при первом добавлении товара + function openBasketOnFirstAdd() { + if (!getCookie('basket_popup_shown')) { + console.log('[openBasketOnFirstAdd] Срабатывает открытие корзины'); + // Выбираем только модалку, в которой находится корзина + var $basket = $('#modal-basket'); + var $modal = $basket.closest('.modal'); + var $aside = $modal.find('.modal__aside'); + var device = window.screen.width; + + // Сброс только внутри этой модалки + var $items = $modal.find('.modal__item'); + console.log('[openBasketOnFirstAdd] modal:', $modal.get(), 'modal__item:', $items.get()); + $items.removeClass('active').attr('style', ''); + $modal.addClass('active').show(); + $basket.addClass('active').css({opacity: 1, filter: 'blur(0px)'}); + console.log('[openBasketOnFirstAdd] basket:', $basket.get()); + var width = $basket[0] ? $basket[0].clientWidth : 600; + setTimeout(function() { + if (device <= 720) { + $aside.css('width', device + 'px'); + console.log('[openBasketOnFirstAdd] aside width:', device + 'px'); + } else { + $aside.css('width', width + 'px'); + console.log('[openBasketOnFirstAdd] aside width:', width + 'px'); + } + }, 10); + setCookie('basket_popup_shown', '1', 30); + } else { + console.log('[openBasketOnFirstAdd] Куки уже установлены, попап не открывается'); + } + } + + // Обновление корзины при добавлении товара + $(document.body).on('added_to_cart', function() { + updateCartFragment(); + openBasketOnFirstAdd(); + }); + + // Функция обновления количества + function updateCart(key, quantity, update_full = true) { + $.ajax({ + type: 'POST', + url: '/wp-admin/admin-ajax.php', // Используем стандартный параметр WooCommerce + data: { + action: 'update_cart_quantity', + cart_item_key: key, + quantity: quantity + }, + beforeSend: function() { + $('#modal-basket').addClass('loading'); + }, + complete: function() { + $('#modal-basket').removeClass('loading'); + }, + success: function(response) { + if (response.success) { + updateCartFragment(update_full); + } else { + console.error('Ошибка при обновлении корзины'); + } + }, + error: function(xhr, status, error) { + console.error('AJAX ошибка:', error); + } + }); + } + + // Обновление фрагментов корзины + function updateCartFragment(update_full=true) { + $.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: { + action: 'get_cart_fragment' + }, + beforeSend: function() { + $('#modal-basket').addClass('loading'); + }, + complete: function(response) { + $('#modal-basket').removeClass('loading'); + console.log(response) + }, + success: function(response) { + console.log(response); + if (response.success) { + if (update_full){ + $('#modal-basket-content').html(response.data.contents); + } + $('.modal-block-price__price').html(response.data.total); + $('#modal-basket-footer').html(response.data.cart_bottom) + $('.mini-profile__button--counter').text(response.data.count); + if (response.data.count > 0) { + $('.mini-profile__button--counter').removeClass('disabled'); + } else { + $('.mini-profile__button--counter').addClass('disabled'); + } + } + }, + error: function(xhr, status, error) { + console.error('AJAX error:', error); + } + }); + } + + // Добавляем спиннер на кнопку 'Добавить в корзину' в корзине + $('body').on('click', '.add_to_cart_button', function() { + var btn = $(this); + if (!btn.hasClass('loading')) { + btn.addClass('loading'); + btn.data('original-text', btn.html()); + btn.css('position', 'relative'); + btn.html(''); + } + }); + + // Убираем спиннер после завершения ajax WooCommerce + $(document.body).on('added_to_cart', function(e, fragments, cart_hash, $button) { + if ($button && $button.length) { + $button.removeClass('loading'); + if ($button.data('original-text')) { + $button.html($button.data('original-text')); + $button.removeData('original-text'); + } + } + }); + + $('.detail form.cart').on('submit', function(e) { + e.preventDefault(); + + var $form = $(this); + product_id = $form.find('button[name=add-to-cart]').val(), + quantity = $form.find('input.qty').val() || 1; + console.log(product_id); + $.ajax({ + url: wc_add_to_cart_params.ajax_url, + type: 'POST', + data: { + action: 'woocommerce_ajax_add_to_cart', + product_id: product_id, + quantity: quantity, + }, + success: function(response) { + if (response.error && response.product_url) { + window.location = response.product_url; + return; + } + + updateCartFragment(); + openBasketOnFirstAdd(); + }, + error: function(xhr) { + console.log('AJAX Error:', xhr.responseText); + alert('Ошибка добавления товара.'); + } + }); + }); +}); + + +jQuery(function($){ + $('form.cart').on('submit', function(e){ + e.preventDefault(); + + var $form = $(this); + var $button = $form.find('button[type="submit"]'); + + var product_id = $button.val(); + var quantity = $form.find('input.qty').val() || 1; + $.ajax({ + type: 'POST', + url: wc_add_to_cart_params.ajax_url, + data: { + action: 'woocommerce_ajax_add_to_cart', + product_id: product_id, + quantity: quantity, + }, + beforeSend: function() { + $button.addClass('loading'); + }, + success: function(response) { + if (response.error && response.product_url) { + window.location = response.product_url; + return; + } + + $(document.body).trigger('added_to_cart', [response.fragments, response.cart_hash, $button]); + $button.removeClass('loading'); + } + }); + }); +}); diff --git a/wp-content/themes/cosmopet/static/js/checkout.js b/wp-content/themes/cosmopet/static/js/checkout.js new file mode 100644 index 0000000..e5e05eb --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/checkout.js @@ -0,0 +1,164 @@ +jQuery(document).ready(function($) { + jQuery(document.body).on('updated_checkout', function() { + // Найти новые методы доставки внутри shop_table + var shippingMethodsHtml = jQuery('.woocommerce-checkout-review-order-table .woocommerce-shipping-methods').html(); + // Обновить кастомный блок + if(!shippingMethodsHtml){ + shippingMethodsHtml ='

Не удалось получить доступные методы доставки!
Укажите свой город для получения доступных методов.

' + } + jQuery('#custom-shipping-methods').html(shippingMethodsHtml); + jQuery('.order-contacts__delivery').removeClass('loading'); + + jQuery('.modal-map-control__item.active').click() + }); + + + $(document.body).on('update_checkout', function() { + jQuery('.order-contacts__delivery').addClass('loading'); + }); + + $('body').on('click', '.modal-map-control__item', function(){ + if (!$(this).hasClass('active')){ + $('#addr_inp').val('') + $('#pvz_inp').val('') + $('#billing_address_1').val('') + $('#billing_address_2').val('') + } + $('.shipping-add-info').removeClass('active') + var remote = $(this).data('remote') + $('.shipping-add-info[data-remote="' + remote + '"]').addClass('active') + }) + + jQuery('#addr_inp').on('click', function(){ + jQuery('#address_input').addClass('active') + }) + +}); + + + +jQuery(document).ready(function($) { + // Перехват отправки формы купона + $(document).on('click', 'button[name="apply_coupon"]', function(e) { + e.preventDefault(); // Останавливаем отправку основной формы + + // Отправка данных купона через AJAX + var couponCode = $('#coupon_code').val(); + + if (!couponCode) { + alert('Пожалуйста, введите код купона.'); + return; + } + + $.ajax({ + url: wc_checkout_params.ajax_url, // URL для AJAX-запроса WooCommerce + type: 'POST', + data: { + action: 'apply_coupon', + coupon_code: couponCode + }, + success: function(response) { + if (response.success) { + $(document.body).trigger('update_checkout'); + $('#promo_form').hide() + $('#promo_delete').show() + $('#promo_err').hide() + $('#coupon_code_app').val('Применен промокод: ' + couponCode) + $('#delete_coupon').data('coupon', couponCode) + } else { + $('#promo_err').show() + } + }, + error: function() { + alert('Произошла ошибка. Попробуйте ещё раз.'); + } + }); + }); + + jQuery('#pvz_inp').on('click', function(){ + jQuery('.open-pvz-btn').click() + }) + + $('#address_input input').on('change, input, keyup', function(){ + var address = $('#f_address').val() + var apart = $('#f_apartment').val() + var floor = $('#f_floor').val() + var entrance = $('#f_entrance').val() + var number_phone = $('#f_number-phone').val() + + var address_2 = '' + + if (apart){ + address_2 += ' кв ' + apart + } + if (floor){ + address_2 += ' этаж ' + floor + } + if (entrance){ + address_2 += ' подъезд ' + entrance + } + if (number_phone){ + address_2 += ' домофон ' + number_phone + } + $('#addr_inp').val(address + address_2) + $('#billing_address_1').val(address) + $('#billing_address_2').val(address_2) + }) +}); + + +jQuery(document).ready(function ($) { + $(document.body).on('checkout_error', function () { + // $('.woocommerce-error').remove(); + $('.form-input__error').removeClass('active'); + + // // Добавляем ошибки рядом с полями + $('.woocommerce-error li').each(function () { + var errorMessage = $(this).text().trim(); + var fieldKey = $(this).data('id'); // Предполагается, что ошибка содержит data-id + console.log(errorMessage) + console.log(fieldKey) + if (fieldKey) { + var errorContainer = $('#' + fieldKey + '-error'); + if (errorContainer.length) { + errorContainer.html('' + errorMessage + ''); + $('#' + fieldKey + '-error').addClass('active'); + } + } + if (errorMessage == 'phone_err' || errorMessage == 'The string supplied did not seem to be a phone number.' || errorMessage.includes('Некорректный номер телефона')){ + $('#billing_phone-error').html('Неправильно введен номер') + $('#billing_phone-error').addClass('active'); + } + if (errorMessage == 'Order pickup point not selected.' || errorMessage == 'Не выбран ПВЗ для доставки заказа.'){ + $('#pvz-error').html('Не выбран ПВЗ для доставки заказа.') + $('#pvz-error').addClass('active'); + } + if (errorMessage == 'adress_error'){ + $('#adr-error').html('Не указан адрес доставки') + $('#adr-error').addClass('active'); + } + if (errorMessage == 'Неверный адрес эл. почты для выставления счета'){ + $('#billing_email-error').html(errorMessage).addClass('active'); + } + if(errorMessage == 'Не выбран метод доставки. Пожалуйста перепроверьте ваш адрес или обратитесь за помощью к администрации сайта.'){ + $('#billing_city-error').html(errorMessage).addClass('active'); + } + if(errorMessage == 'Этот email уже зарегистрирован.'){ + $('#acc-error').html('Этот email уже зарегистрирован. Войдите в свой аккаунт или укажите другой E-mail.').addClass('active'); + } + }); + }); + + $('#delete_coupon').on('click', function(){ + $('.woocommerce-remove-coupon[data-coupon=' + $(this).data('coupon') + ']').click() + $('#promo_form').show() + $('#promo_delete').hide() + }) + $('.woocommerce-remove-coupon').on('click', function(){ + $('#promo_form').show() + $('#promo_delete').hide() + }) +}); + + + diff --git a/wp-content/themes/cosmopet/static/js/comments.js b/wp-content/themes/cosmopet/static/js/comments.js new file mode 100644 index 0000000..baa8004 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/comments.js @@ -0,0 +1,198 @@ +// comment +let answerbtns = document.querySelectorAll('.answer-btn'); +let answerbtnicons = document.querySelectorAll('.answer-btn svg'); + +// При загрузке страницы проверяем активные кнопки +document.addEventListener('DOMContentLoaded', function() { + // Для каждой кнопки ответов + answerbtns.forEach((answerbtn) => { + // Находим родительский контейнер, чтобы искать ответы только для этого комментария + const buttonParent = answerbtn.parentElement; + + // Находим все блоки ответов для этого комментария (после текущей кнопки) + const answerBlocks = getRelatedAnswerBlocks(answerbtn); + if (answerBlocks.length === 0) return; + + // Проверяем, должны ли быть ответы развернуты (если у кнопки или любого ответа есть класс active) + const shouldBeActive = answerbtn.querySelector('svg').classList.contains('active') || + Array.from(answerBlocks).some(block => block.classList.contains('active')); + + if (shouldBeActive) { + // Активируем все ответы только для этого комментария + answerBlocks.forEach(block => { + block.classList.add('active'); + }); + + // Обновляем состояние кнопки + answerbtn.querySelector('svg').classList.add('active'); + + // Обновляем текст кнопки + let buttonText = answerbtn.querySelector('span'); + if (buttonText) { + buttonText.textContent = 'Свернуть'; + } + } else { + // Скрываем все ответы + answerBlocks.forEach(block => { + block.classList.remove('active'); + }); + + // Обновляем состояние кнопки + answerbtn.querySelector('svg').classList.remove('active'); + + // Обновляем текст кнопки в зависимости от количества ответов + let buttonText = answerbtn.querySelector('span'); + if (buttonText) { + const count = answerBlocks.length; + buttonText.textContent = count === 1 ? 'ответ' : 'ответа'; + } + } + }); +}); + +// Функция для получения блоков ответов, связанных с данной кнопкой +function getRelatedAnswerBlocks(answerBtn) { + // Получаем следующий блок комментариев (если он есть) + let currentElement = answerBtn; + let answerBlocks = []; + + // Собираем все блоки ответов до следующего основного комментария или кнопки ответов + while ((currentElement = currentElement.nextElementSibling) !== null) { + if (currentElement.classList.contains('comment-block') && !currentElement.classList.contains('answer-block')) { + // Достигли следующего основного комментария, прерываем сбор + break; + } else if (currentElement.classList.contains('answer-btn')) { + // Достигли следующей кнопки ответов, прерываем сбор + break; + } else if (currentElement.classList.contains('answer-block')) { + // Это блок ответа, добавляем в коллекцию + answerBlocks.push(currentElement); + } + } + + return answerBlocks; +} + +// Обработчики нажатия на кнопки ответов +answerbtns.forEach((answerbtn) => { + answerbtn.addEventListener('click', () => { + // Получаем все блоки ответов для этого комментария + const answerBlocks = getRelatedAnswerBlocks(answerbtn); + if (answerBlocks.length === 0) return; + + // Определяем, развернуты ли ответы сейчас + const isCurrentlyActive = answerbtn.querySelector('svg').classList.contains('active'); + + // Переключаем состояние + if (isCurrentlyActive) { + // Скрываем все ответы + answerBlocks.forEach(block => { + block.classList.remove('active'); + }); + + // Обновляем состояние кнопки + answerbtn.querySelector('svg').classList.remove('active'); + + // Обновляем текст кнопки + let buttonText = answerbtn.querySelector('span'); + if (buttonText) { + const count = answerBlocks.length; + buttonText.textContent = count === 1 ? 'ответ' : 'ответа'; + } + } else { + // Показываем все ответы + answerBlocks.forEach(block => { + block.classList.add('active'); + }); + + // Обновляем состояние кнопки + answerbtn.querySelector('svg').classList.add('active'); + + // Обновляем текст кнопки + let buttonText = answerbtn.querySelector('span'); + if (buttonText) { + buttonText.textContent = 'Свернуть'; + } + } + }); +}); + +// Обработка нажатия на кнопку "Ответить" на комментарий +document.addEventListener('DOMContentLoaded', function() { + // Получаем все кнопки "Ответить" на странице + const replyButtons = document.querySelectorAll('.reply-to-comment'); + + // Добавляем обработчик на каждую кнопку + replyButtons.forEach(button => { + button.addEventListener('click', function() { + // Получаем ID комментария, на который отвечаем + const commentId = this.getAttribute('data-comment-id'); + const postId = this.getAttribute('data-post-id'); + const replyToName = this.getAttribute('data-reply-to'); + + // Получаем контейнер для формы ответа + const replyFormContainer = document.getElementById('reply-form-' + commentId); + + // Если форма уже открыта, скрываем её + if (replyFormContainer.style.display !== 'none') { + replyFormContainer.style.display = 'none'; + return; + } + + // Скрываем все открытые формы ответов + document.querySelectorAll('.reply-form-container').forEach(container => { + container.style.display = 'none'; + }); + + // Клонируем основную форму комментариев + const originalForm = document.getElementById('commentform'); + if (originalForm) { + const clonedForm = originalForm.cloneNode(true); + + // Изменяем атрибуты формы для ответа + clonedForm.id = 'commentform-reply-' + commentId; + + // Добавляем скрытое поле с ID родительского комментария + const hiddenInput = document.createElement('input'); + hiddenInput.type = 'hidden'; + hiddenInput.name = 'comment_parent'; + hiddenInput.value = commentId; + clonedForm.appendChild(hiddenInput); + + // Изменяем заголовок формы + const formTitle = clonedForm.querySelector('.comment-reply-title'); + if (formTitle) { + formTitle.textContent = 'Ответить ' + replyToName; + } + + // Добавляем кнопку отмены + const cancelButton = document.createElement('button'); + cancelButton.type = 'button'; + cancelButton.className = 'cancel-reply-btn'; + cancelButton.textContent = 'Отменить'; + cancelButton.addEventListener('click', function() { + replyFormContainer.style.display = 'none'; + }); + + // Добавляем кнопку отмены в форму + const submitContainer = clonedForm.querySelector('.form-submit'); + if (submitContainer) { + submitContainer.appendChild(cancelButton); + } + + // Очищаем контейнер и добавляем клонированную форму + replyFormContainer.innerHTML = ''; + replyFormContainer.appendChild(clonedForm); + + // Показываем форму + replyFormContainer.style.display = 'block'; + + // Фокусируемся на текстовой области + const textarea = clonedForm.querySelector('textarea'); + if (textarea) { + textarea.focus(); + } + } + }); + }); +}); diff --git a/wp-content/themes/cosmopet/static/js/footer.js b/wp-content/themes/cosmopet/static/js/footer.js new file mode 100644 index 0000000..eeedb76 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/footer.js @@ -0,0 +1,314 @@ +'use strict'; + +(function ($) { + const metaLocale = document.querySelector('meta[property="og:locale"]'); + const localeValue = metaLocale.getAttribute('content'); + + // Login + + $('.login_popup').on('click', function(e){ + e.preventDefault(); + $('.login_modal').addClass('active'); + }); + $('.login_close').on('click', function(){ + $('.login_modal').removeClass('active'); + }); + $('.login_back').on('click', function(){ + if($(this).is('.disabled')) { + return false; + } + $('.login_wrap .step').toggleClass('active'); + }); + $('.login_input input').on('input keyup', function(){ + $('.login_input').removeClass('error'); + }); + $('.js-get-code').on('click', function(){ + $('.login_input').removeClass('error'); + + var email = $('.js-input-email input').val(); + $('.sended_email').text(email); + + if(email === '') { + $('.js-input-email').addClass('error'); + $('.js-input-email .login_error').text(localeValue == 'en_US' ? 'Enter your email' : 'Укажите Email'); + return false; + } else { + // Проверка Email + $.ajax({ + type: 'POST', + url: '/wp-admin/admin-ajax.php', + data: {action: 'email_validate', email:email}, + success: function(data){ + if(data['status'] === 'error') { + $('.js-input-email').addClass('error'); + $('.js-input-email .login_error').text(data['text']); + return false; + } else { + $('.login_wrap .step').toggleClass('active'); + send_code(); + } + } + }); + + } + + }); + $('.js-repeat-code').on('click', function(){ + $('.login_input').removeClass('error'); + send_code(); + }); + + function send_code(){ + $('.login_timer').show(); + $('.js-repeat-code').hide(); + $('.login_back').addClass('disabled'); + // Timer + var seconds = 15; + var interval = setInterval(function() { + if (seconds > 0) { + seconds--; + $('.seconds').text(seconds); + } else { + clearInterval(interval); + $('.login_timer').hide(); + $('.js-repeat-code').show(); + $('.login_back').removeClass('disabled'); + $('.seconds').text(15); + } + }, 1000); + //Ajax отправка кода + $.ajax({ + type: 'POST', + url: '/wp-admin/admin-ajax.php', + data: {action: 'send_code', email: $('.js-input-email input').val()} + }); + } + // Проверка кода и регистрация/авторизация + $('.js-input-code input').on('input keydown keyup propertychange paste cut copy change', function(){ + var val = $(this).val(); + var email = $('.js-input-email input').val(); + if(val.length === 4) { + $.ajax({ + type: 'POST', + url: '/wp-admin/admin-ajax.php', + data: {action: 'check_code', code: val, email: email}, + success: function(data){ + console.log(data); + if(data['status'] == 'success_reg') { + $('.login_forms').addClass('hide'); + $('.login_success').removeClass('hide'); + if (typeof wc_checkout_params !== 'undefined') { + location.reload() + } + } + if(data['status'] == 'success_auth') { + $('.login_forms').addClass('hide'); + $('.login_auth').removeClass('hide'); + if (typeof wc_checkout_params !== 'undefined') { + location.reload() + } + } + if(data['status'] == 'error') { + $('.js-input-code').addClass('error'); + $('.js-input-code .login_error').text(data['text']); + } + } + }); + } + }); + + $('.email_link_form').on('submit', function(e){ + e.preventDefault(); + $('.cabinet-card_linked-email .error').remove(); + var data = $(this).serializeArray(); + $.ajax({ + type: 'POST', + url: '/wp-admin/admin-ajax.php', + data: data, + success: function(data){ + if(data['error']) { + $('.cabinet-card_linked-email').append('
'+data['error']+'
'); + } else { + location.reload(); + } + + } + }); + }); + + +})(jQuery); + +function checkImage(imageSrc, good) { + var img = new Image(); + img.onload = good; + img.src = imageSrc; +} +// header +toggleOpenX('.lang', '.lang__open', '.lang__list', '.lang__content', false); +toggleHeader('#pc-menu','.header__menu-block','.header__pc-menu', '.white', 'white'); +toggleHeader('#phone-menu','.header__menu-block','.header__phone-menu', '.white', 'white'); +// header + + + + + +function initOverlay(){ + + // overlay +let products = document.querySelectorAll('.product__item'); + +products.forEach(productItem => { + let button = productItem.querySelector('.open-overlay'), + overlay = productItem.querySelector('.product-item__overlay'); + + + if (button) { + button.onclick = function (e) { + document.querySelectorAll('.product__item').forEach(e => { + if (e.classList.contains('active')) { + e.classList.remove('active'); + } + }); + document.querySelectorAll('.product-item__overlay').forEach(e => { + if (e.classList.contains('active')) { + e.classList.remove('active'); + } + }); + + productItem.classList.toggle('active'); + overlay.classList.toggle('active'); + } + } + +}) +// overlay +} + +initOverlay() + + +function initSelect(){ + + +// select +toggleOpenX('.select', '.select__state' , '.state__content', '.state__block', true); + +let selects = document.querySelectorAll('.select'); + +selects.forEach(select => { + let state = select.querySelector('.select__state'), + content = select.querySelector('.state__block'), + buttons = select.querySelectorAll('.state__button'); + + buttons.forEach(e => { + let button = e; + + e.onclick = function (event) { + event.preventDefault(); + + buttons.forEach(element => { + if (element.classList.contains('active')) { + element.classList.remove('active'); + } + }) + + let text = e.textContent.trim(); + state.value = text; + + button.classList.add('active'); + content.style.height = 0; + select.classList.remove('active'); + } + }) +}) + +// select +} +initSelect() + +function toggleOpenX(mainElement, buttonElement ,heightElement, contentElement, close) { + let elements = document.querySelectorAll(mainElement); + + elements.forEach(e => { + let thisMainElement = e, + thisButtonElement = e.querySelector(buttonElement), + thisHeightElement = e.querySelector(heightElement), + thisContentElement = e.querySelector(contentElement); + + thisButtonElement.onclick = function (e) { + let height = thisHeightElement.clientHeight; + + if (close == true && !thisMainElement.classList.contains('active')) { + elements.forEach(e => { + if (e.classList.contains('active')) { + e.classList.remove('active'); + e.querySelector(contentElement).style.height = null + } + }) + } + + if (!thisMainElement.classList.contains('active')) { + thisContentElement.style.height = `${height}px`; + thisMainElement.classList.add('active'); + }else{ + thisContentElement.style.height = null; + thisMainElement.classList.remove('active'); + } + } + + }); +} +var menu_opened = false; +function toggleHeader(button, content, blockheight, removeBlock, removeClass) { + let thisButton = document.querySelector(button), + thisContent = document.querySelector(content), + thisRemoveBlock = document.querySelector(removeBlock) || '', + thisBlockheight = document.querySelector(blockheight); + + thisButton.onclick = function () { + let height = thisBlockheight.clientHeight; + + if (!thisContent.classList.contains('open')) { + thisContent.style.height = `${height}px`; + thisContent.classList .add('open'); + + if (removeBlock) { + thisRemoveBlock.classList.remove(removeClass); + } + }else{ + thisContent.style.height = null; + thisContent.classList.remove('open'); + + if (removeBlock) { + if (window.Y <= 25) { + thisRemoveBlock.classList.add(removeClass); + } + } + } + menu_opened = !menu_opened; + } +} + +if (document.querySelector('.header').classList.contains('white')) { + window.addEventListener("scroll", function (e) { + let header = document.querySelector('.header'); + let scroll = window.scrollY; + if(!menu_opened){ + if (scroll >= 25) { + header.classList.remove('white') + }else{ + + header.classList.add('white') + + } + } + + }); +} +// scroll + + + + diff --git a/wp-content/themes/cosmopet/static/js/forms.js b/wp-content/themes/cosmopet/static/js/forms.js new file mode 100644 index 0000000..7797b47 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/forms.js @@ -0,0 +1,145 @@ +/* Start | Module Forms */ +// Функция для показа модальных окон +function showModal(modalClass) { + + + const modal = document.querySelector('.' + modalClass); + if (modal) { + modal.style.display = 'flex'; + + } +} + + // Функция для закрытия модальных окон + function closeModals() { + const modals = document.querySelectorAll('.mform'); + modals.forEach(modal => { + modal.style.display = 'none'; + }); + } + + // Инициализация после загрузки DOM + document.addEventListener('DOMContentLoaded', function() { + // Обработчики для кнопок закрытия + const closeButtons = document.querySelectorAll('.close-button'); + closeButtons.forEach(button => { + button.addEventListener('click', function() { + closeModals(); + }); + }); + + // Закрытие при клике вне контента + window.addEventListener('click', function(event) { + + const modals = document.querySelectorAll('.mform'); + modals.forEach(modal => { + if (event.target === modal) { + modal.style.display = 'none'; + } + }); + }); + }); + + // Закрытие при клике вне контента + window.addEventListener('click', function(event) { + const modals = document.querySelectorAll('.modal-success, .modal-offer'); + modals.forEach(modal => { + if (event.target === modal) { + modal.style.display = 'none'; + } + }); +}); + + + +jQuery(document).ready(function($) { + $('.form-process').submit(function(event) { + event.preventDefault(); + let validate = validateForm(this); + if (validate){ + action = $(this).attr('action') + let formData = $(this).serialize(); + $.ajax({ + type: 'POST', + url: '/wp-admin/admin-ajax.php', + data: { + action: action, + formData: formData + }, + success: function(response) { + closeModals() + showModal('mform-success') + + } + }); + } + }); +}); + +const metaLocale = document.querySelector('meta[property="og:locale"]'); +const localeValue = metaLocale.getAttribute('content'); + + + // Функция валидации формы + function validateForm(form) { + // Очищаем предыдущие сообщения об ошибках внутри этой формы + clearErrorMessages(form); + let validated = true + // Валидация поля имени + const nameInput = form.querySelector('input[name="name"]'); + + if (nameInput && !nameInput.value.trim()) { + if(localeValue == 'en_US'){ + showError(nameInput, 'The name is requeried field'); + } + if(localeValue == 'ru_RU'){ + showError(nameInput, 'Поле имени обязательно для заполнения.'); + } + validated = false + } + + // Валидация поля email + const emailInput = form.querySelector('input[name="email"]'); + const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + if (emailInput && !emailPattern.test(emailInput.value.trim())) { + + if(localeValue == 'en_US'){ + showError(emailInput, 'Email is incorrect.'); + } + if(localeValue == 'ru_RU'){ + showError(emailInput, 'Введите корректный email.'); + } + validated = false + } + + // Валидация поля телефона + const phoneInput = form.querySelector('input[name="phone"]'); + const phonePattern = /^\+?\d{10,15}$/; + if (phoneInput && !phonePattern.test(phoneInput.value.trim())) { + if(localeValue == 'en_US'){ + showError(phoneInput, 'The phone is incorrect.'); + } + if(localeValue == 'ru_RU'){ + showError(phoneInput, 'Введите корректный номер телефона.'); + } + validated = false + } + return validated + } + + // Функция для отображения сообщения об ошибке + function showError(input, message) { + const errorMessage = document.createElement('div'); + errorMessage.className = 'error-message'; + errorMessage.textContent = message; + input.insertAdjacentElement('afterend', errorMessage); + } + + // Функция для очистки сообщений об ошибках внутри конкретной формы + function clearErrorMessages(form) { + const errorMessages = form.querySelectorAll('.error-message'); + errorMessages.forEach(errorMessage => { + errorMessage.remove(); + }); + } +/* End | Module Forms */ \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/js/js-single-product/gp-form.js b/wp-content/themes/cosmopet/static/js/js-single-product/gp-form.js new file mode 100644 index 0000000..a014802 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/js-single-product/gp-form.js @@ -0,0 +1,286 @@ +'use strict'; + + +inputPhone('.form-input__phone', '.form-input-phone__icon', '.form-input-phone__code', '.form-input-phone__input', '.form-input-phone__list', 'form-input-phone-list__item', '.form-input-phone-list-item__icon', '.form-input-phone-list-item__code', 'form-input-phone-list__search'); + +function inputPhone(main, mainFlag, mainCode, input, list, selects, selectIcon, selectCode, searchInput) { + let inputs = document.querySelectorAll(main); + + inputs.forEach(e => { + let thisMainFlag = e.querySelector(mainFlag), + thisMainCode = e.querySelector(mainCode), + thisInput = e.querySelector(input), + thisList = e.querySelector(list), + thisSelects = e.querySelectorAll(`.${selects}`), + thisSearchInput = e.querySelector(`.${searchInput}`); + + thisInput.onblur = function (input) { + if (!(input.relatedTarget != null && (input.relatedTarget.classList.contains(searchInput) || input.relatedTarget.classList.contains(selects)))) { + thisList.classList.remove('active'); + } + } + + e.onclick = function (event) { + if (!event.target.classList.contains(searchInput)) { + if (thisList.classList.contains('active')) { + thisList.classList.remove('active'); + } + + thisInput.focus(); + thisList.classList.add('active'); + } + } + + thisSelects.forEach(e => { + let newIcon = e.querySelector(selectIcon), + newCode = e.querySelector(selectCode); + + e.onclick = function (event) { + event.preventDefault(); + thisMainFlag.style.cssText = `background-image:url("${newIcon.src}");`; + thisMainCode.textContent = newCode.textContent; + + + setTimeout(() => { + thisList.classList.remove('active'); + }, 0); + } + + }) + }) +} + +if (document.querySelector('.form-input-phone__input')) { + checkPhone('.form-input-phone__input'); +} + +function checkPhone(input) { + document.querySelector(input).addEventListener('input', function(event) { + let text = event.target.value; + let length = text.length; + let newSymbol = event.data; + + if (!(/^\d+$/.test(text.replaceAll(' ', '')))) { + event.target.value = text.slice(0, -1); + return; + } + + if (length == 4 || length == 8) { + if (newSymbol != null) { + event.target.value = text.slice(0, -1) + ' ' + newSymbol; + } + } + }) +} + +inputTabs('.form-input__tabs', '.form-input-tabs__button'); +inputTabs('.modal-map__control', '.modal-map-control__item'); + +function inputTabs(main, button) { + let mains = document.querySelectorAll(main); + + mains.forEach(main => { + let buttons = main.querySelectorAll(button); + + buttons.forEach(button => { + button.onclick = function () { + if (button.classList.contains('active')) { + return ; + } + + main.querySelector('.active').classList.remove('active'); + + button.classList.add('active'); + + if (button.querySelector('input')){ + button.querySelector('input').click(); + } + } + }) + + }) +} + + +inputRadio('.form-input__radio', '.form-input-radio__item', '.form-input-radio__title', '.form-input-radio__input') + +function inputRadio(main ,item, textClass, input) { + let inputRadios = document.querySelectorAll(main); + + inputRadios.forEach(inputRadio => { + let items = inputRadio.querySelectorAll(item), + thisInput = inputRadio.querySelector(input); + + items.forEach(radio => { + let thisText = radio.querySelector(textClass).textContent; + + radio.onclick = function (event) { + event.preventDefault(); + + if (inputRadio.querySelector(`${item}.active`)) { + inputRadio.querySelector(`${item}.active`).classList.remove('active'); + } + thisInput.value = thisText; + radio.classList.add('active'); + } + }) + }) +} + +listInputRadio('.form-input__list' ,'.form-input-list__item', '.form-input-list-item__text', '.form-input-list__input', '.form-input-list__content', '.form-input-list__block-content'); + +function listInputRadio(main ,item, textClass, input, content, block) { + let listInputRadios = document.querySelectorAll(main); + + listInputRadios.forEach(listInputRadio => { + let thisInput = listInputRadio.querySelector(input), + items = listInputRadio.querySelectorAll(item), + thisContent = listInputRadio.querySelector(content), + thisBlock = listInputRadio.querySelector(block); + + thisInput.onclick = function () { + thisBlock.classList.add('active'); + thisBlock.style.height = '192px'; + } + + + thisInput.onblur = function(){ + thisBlock.classList.remove('active'); + thisBlock.style.height = '0px'; + }; + + items.forEach(item => { + item.onclick = function (event) { + event.preventDefault(); + let newText = item.querySelector(textClass).textContent; + + thisInput.value = newText; + + if (thisContent.querySelector('.active')) { + thisContent.querySelector('.active').classList.remove('active'); + } + + item.classList.add('active'); + } + }) + }) +} + +remoteControl('.form-input__remote-control', '.form-input-tabs__button'); +remoteControl('.modal-map__control', '.modal-map-control__item'); + +function remoteControl(main, button) { + let mains = document.querySelectorAll(main); + + mains.forEach(main => { + let subjectClass = main.dataset.content, + subject = document.querySelector(`.${subjectClass}`), + buttons = Array.from(main.querySelectorAll(button)); + + main.addEventListener('click', function (eventMain) { + setTimeout(() => { + let indexActive = buttons.findIndex((button, index) => { + if (button.classList.contains('active')) { + return true; + } + }); + if(subject.children[indexActive].classList.contains('active')){ + return ; + } + + subject.querySelector('.remote-control__item.active').classList.remove('active'); + subject.children[indexActive].classList.add('active'); + + let mandatorys = subject.querySelectorAll('.mandatory'); + + mandatorys.forEach(mandatory => { + if (mandatory.required) { + mandatory.required = false; + }else{ + mandatory.required = true; + } + }) + }, 0); + }) + }) +} + +formCheck('.modal-form__content', 'input[type=submit]'); +formCheck('.modal-map__form', 'input[type=submit]'); + +function formCheck(form, submit) { + let forms = document.querySelectorAll(form); + + forms.forEach(form => { + let thisSubmit = form.querySelector(submit); + + thisSubmit.onclick = function () { + form.classList.add('check') + } + + }) +} + +inputPhoneNoFlag('.no-flag'); + +function inputPhoneNoFlag(input){ + let inputs = document.querySelectorAll(input); + + inputs.forEach(input => { + let code = '+' + input.dataset.code; + + input.onfocus = function () { + if (input.value == '') { + input.value = code; + } + } + + input.addEventListener('input', function(event) { + let text = event.target.value; + let length = text.length; + let newSymbol = event.data; + + if (isNaN(event.data) || event.data == ' ') { + event.target.value = text.slice(0, -1); + return; + } + + if (length == 3 || length == 7 || length == 11) { + if (newSymbol != null) { + event.target.value = text.slice(0, -1) + ' ' + newSymbol; + } + } + + }) + }) +} + + +inputCheck('.form-agreement__check'); + +function inputCheck(className) { + let checks = document.querySelectorAll(className); + + checks.forEach(check => { + let square = check.querySelector('.form-agreement__square'), + input = check.querySelector('input'); + + square.onclick = function () { + input.click(); + } + }) +} + + +inputRead('.input-read'); +function inputRead(className) { + let inputs = document.querySelectorAll(className); + + inputs.forEach(input => { + input.addEventListener("input", function (event) { + let text = event.target.value; + + event.target.value = text.slice(0, -1); + }) + }) +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/js/js-single-product/gp-main.js b/wp-content/themes/cosmopet/static/js/js-single-product/gp-main.js new file mode 100644 index 0000000..0605ce4 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/js-single-product/gp-main.js @@ -0,0 +1,103 @@ +'use strict'; + +// header +toggleOpenX('.lang', '.lang__open', '.lang__list', '.lang__content', false); +toggleHeader('#pc-menu','.header__menu-block','.header__pc-menu', '.white', 'white'); +toggleHeader('#phone-menu','.header__menu-block','.header__phone-menu', '.white', 'white'); +// header + + +// select +toggleOpenX('.select', '.select__state' , '.state__content', '.state__block', true); + +let selects = document.querySelectorAll('.select'); + +selects.forEach(select => { + let state = select.querySelector('.select__state'), + content = select.querySelector('.state__block'), + buttons = select.querySelectorAll('.state__button'); + + buttons.forEach(e => { + let button = e; + + e.onclick = function (event) { + event.preventDefault(); + buttons.forEach(element => { + if (element.classList.contains('active')) { + element.classList.remove('active'); + } + }) + + let text = e.textContent.trim(); + state.value = text; + + button.classList.add('active'); + content.style.height = 0; + select.classList.remove('active'); + } + }) +}) +// select + +// // counter +// let counters = document.querySelectorAll('.counter'); + +// counters.forEach(e => { +// let minus = e.querySelector('.minus'), +// plus = e.querySelector('.plus'), +// input = e.querySelector('.counter__input'); + +// minus.onclick = function (e) { +// e.preventDefault(); +// let number = input.value; +// if (number >= 2){ +// input.value = Number(number) - 1; +// } +// } + +// plus.onclick = function (e) { +// e.preventDefault(); +// let number = input.value; +// if (number <= 99) { +// input.value = Number(number) + 1; +// } +// } +// }) +// // counter + +// // checkbox +// let checkbox = document.querySelectorAll('.checkbox'); + +// checkbox.forEach(e => { +// e.onclick = function (event) { +// let input = e.querySelector('.checkbox__input'); +// if (!e.classList.contains('active')) { +// input.checked = 1; +// }else{ +// input.checked = 0; +// } +// e.classList.toggle('active'); +// } +// }) +// // checkbox + + + + + + + +if (document.querySelector('.header').classList.contains('white')) { + window.addEventListener("scroll", function (e) { + let header = document.querySelector('.header'); + let scroll = window.scrollY; + if (scroll >= 25) { + header.classList.remove('white') + }else{ + header.classList.add('white') + } + + }); +} +// scroll + diff --git a/wp-content/themes/cosmopet/static/js/js-single-product/gp-product.js b/wp-content/themes/cosmopet/static/js/js-single-product/gp-product.js new file mode 100644 index 0000000..32043ad --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/js-single-product/gp-product.js @@ -0,0 +1,152 @@ +'use strict'; + +// slider gallery modal +const gallery = new Swiper('.gallery__slider', { + spaceBetween: 100, + + pagination: { + el: '.swiper-pagination', + }, + + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + }, + + scrollbar: { + el: '.swiper-scrollbar', + }, +}); + +let paginationButtons = document.querySelectorAll('.gallery-pagination__item'); + +paginationButtons.forEach(button => { + let index = button.dataset.countImg; + + button.onclick = function () { + gallery.slideTo(index); + } +}) + +// open gallery +let detailImage= document.querySelectorAll('.detail__image'); +detailImage.forEach(button => { + let index = button.dataset.countImg; + + button.onclick = function () { + gallery.slideTo(index); + + document.querySelector('.gallery').classList.add('active'); + } +}) + +// close gallery + +document.querySelector('.gallery__close').onclick = function () { + document.querySelector('.gallery').classList.remove('active'); +} +// slider gallery modal + +// slider gallery main phone + +// createGalleryPhone('.detail__images', '.detail-images__wrapper', '.detail__image', 980); + +const detailPhone = new Swiper('.detail__images-phone', { + spaceBetween: 100, + + pagination: { + el: '.swiper-pagination', + }, + + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + }, + + scrollbar: { + el: '.swiper-scrollbar', + }, +}); + +let detailImagesPhones = document.querySelectorAll('.detail-images-phone__image-block'); + +detailImagesPhones.forEach(button => { + button.onclick = function (e) { + let index = button.dataset.countImg; + + gallery.slideTo(index); + + document.querySelector('.gallery').classList.add('active'); + } +}) + +// slider gallery main phone + +// detail catalog +const detailCatalot = new Swiper('.detail__catalot', { + // Navigation arrows + navigation: { + nextEl: '.detail-catalot-control__button.next', + prevEl: '.detail-catalot-control__button.prev', + }, + breakpoints: { + 1600: { + slidesPerView: 4, + }, + 1200: { + slidesPerView: 3, + }, + 780: { + slidesPerView: 2, + }, + 100: { + slidesPerView: 1.1, + spaceBetween: 20 + }, + } + + +}); +// detail catalog +// +// +// +jQuery(document).ready(function($) { + // Основные радио-кнопки выбора типа покупки + const $oneTimeRadio = $('input[value="no"][name="subscribe-to-action-input"]'); + const $subscribeRadio = $('input[value="yes"][name="subscribe-to-action-input"]'); + + // Все чекбоксы вариантов подписки + const $subscriptionOptions = $('.wcsatt-options-product input[type="radio"]'); + + // Обработчик для One-time + $oneTimeRadio.on('change', function() { + if ($(this).is(':checked')) { + // Снимаем выделение со всех вариантов подписки + $subscriptionOptions.prop('checked', false); + } + }); + + // Обработчик для Subscribe + $subscribeRadio.on('change', function() { + if ($(this).is(':checked')) { + // Снимаем выделение с One-time + $oneTimeRadio.prop('checked', false); + + // Если ни один вариант подписки не выбран, выбираем первый + if ($subscriptionOptions.filter(':checked').length === 0) { + $subscriptionOptions.first().prop('checked', true); + } + } + }); + + // Обработчик для вариантов подписки + $subscriptionOptions.on('change', function() { + if ($(this).is(':checked')) { + // Снимаем выделение с One-time + $oneTimeRadio.prop('checked', false); + // Активируем Subscribe + $subscribeRadio.prop('checked', true); + } + }); +}); \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/js/js-single-product/tabs.js b/wp-content/themes/cosmopet/static/js/js-single-product/tabs.js new file mode 100644 index 0000000..431b952 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/js-single-product/tabs.js @@ -0,0 +1,66 @@ +const rootSelectorTabs = '[data-js-tabs]'; + +class Tabs{ + // элементы для поиска + selectors = { + root: rootSelectorTabs, + button: '[data-js-tabs-button]', + content: '[data-js-tabs-content]', + } + // класс отображения состояния + stateClasses = { + isActive: 'active', + } + + constructor(rootElement){ + this.rootElement = rootElement; + this.buttonElements = this.rootElement.querySelectorAll(this.selectors.button); + this.contentElements = this.rootElement.querySelectorAll(this.selectors.content); + this.state = { + activeMenuIndex: [...this.buttonElements] + .findIndex((buttonElement) => buttonElement.classList.contains(this.stateClasses.isActive)), + }; + this.limitTabsIndex = this.buttonElements.length - 1; + this.bindEvents(); + } + + updateUI(){ + const { activeMenuIndex } = this.state; + + this.buttonElements.forEach((buttonElement, index) => { + const isActive = index === activeMenuIndex; + + buttonElement.classList.toggle(this.stateClasses.isActive, isActive); + }) + + this.contentElements.forEach((contentElement, index) => { + const isActive = index === activeMenuIndex; + + contentElement.classList.toggle(this.stateClasses.isActive, isActive); + }) + } + + onButtonClick(buttonIndex){ + this.state.activeMenuIndex = buttonIndex; + this.updateUI(); + } + + bindEvents(){ + this.buttonElements.forEach((buttonElement, index) => { + buttonElement.addEventListener('click', () => this.onButtonClick(index)) + }) + } +} + +class TabsCollection { + constructor(){ + this.init(); + } + + init(){ + document.querySelectorAll(rootSelectorTabs).forEach((element) => { + new Tabs(element); + }); + } +} + diff --git a/wp-content/themes/cosmopet/static/js/js-single-product/toggle.js b/wp-content/themes/cosmopet/static/js/js-single-product/toggle.js new file mode 100644 index 0000000..d1a76ad --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/js-single-product/toggle.js @@ -0,0 +1,88 @@ +const rootSelectorToggles = '[data-js-toggle]'; + +class Toggle{ + // элементы для поиска + selectors = { + root: rootSelectorToggles, + button: '[data-js-toggle-button]', + wrapper: '[data-js-toggle-wrapper]', + content: '[data-js-toggle-content]', + } + // класс отображения состояния + stateClasses = { + isActive: 'active', + } + + constructor(rootElement){ + this.rootElement = rootElement; + this.buttonElements = this.rootElement.querySelectorAll(this.selectors.button); + this.wrapperElements = this.rootElement.querySelectorAll(this.selectors.wrapper); + this.contentElements = this.rootElement.querySelectorAll(this.selectors.content); + this.state = { + activeToggleIndex: [...this.buttonElements] + .findIndex((buttonElement) => buttonElement.classList.contains(this.stateClasses.isActive)), + }; + this.bindEvents(); + } + + updateUI(newHeight){ + const { activeToggleIndex } = this.state; + + this.buttonElements.forEach((buttonElement, index) => { + const isActive = index === activeToggleIndex; + + buttonElement.classList.toggle(this.stateClasses.isActive, isActive); + }) + + this.wrapperElements.forEach((wrapperElement, index) => { + const isActive = index === activeToggleIndex, + newHeight = this.contentElements[index].offsetHeight; + + wrapperElement.classList.toggle(this.stateClasses.isActive, isActive); + + if (isActive) { + wrapperElement.style.height = `${newHeight}px`; + + setTimeout(() => { + if (wrapperElement.classList.contains('active')) { + wrapperElement.style.height = `auto`; + } + }, 300); + }else{ + wrapperElement.style.height = `${newHeight}px`; + + setTimeout(() => { + if (!wrapperElement.classList.contains('active')) { + wrapperElement.style.height = `${0}px`; + } + }, 10); + } + }) + + } + + onButtonClick(buttonIndex){ + this.state.activeToggleIndex = (buttonIndex === this.state.activeToggleIndex) ? -1 : buttonIndex; + + this.updateUI(); + } + + bindEvents(){ + this.buttonElements.forEach((buttonElement, index) => { + buttonElement.addEventListener('click', () => this.onButtonClick(index)) + }) + } +} + +class TogglesCollection{ + constructor(){ + this.init(); + } + + init(){ + document.querySelectorAll(rootSelectorToggles).forEach((element) => { + new Toggle(element); + }); + } +} + diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/static/js/layout-core.js similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-mobile.css rename to wp-content/themes/cosmopet/static/js/layout-core.js diff --git a/wp-content/themes/cosmopet/static/js/layout-form.js b/wp-content/themes/cosmopet/static/js/layout-form.js new file mode 100644 index 0000000..4b3ca82 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/layout-form.js @@ -0,0 +1,376 @@ +'use strict'; + + +// inputPhone('.form-input__phone', '.form-input-phone__icon', '.form-input-phone__code', '.form-input-phone__input', '.form-input-phone__list', 'form-input-phone-list__item', '.form-input-phone-list-item__icon', '.form-input-phone-list-item__code', 'form-input-phone-list__search'); + +// function inputPhone(main, mainFlag, mainCode, input, list, selects, selectIcon, selectCode, searchInput) { +// let inputs = document.querySelectorAll(main); + +// inputs.forEach(e => { +// let thisMainFlag = e.querySelector(mainFlag), +// thisMainCode = e.querySelector(mainCode), +// thisInput = e.querySelector(input), +// thisList = e.querySelector(list), +// thisSelects = e.querySelectorAll(`.${selects}`), +// thisSearchInput = e.querySelector(`.${searchInput}`); + +// thisInput.onblur = function (input) { +// if (!(input.relatedTarget != null && (input.relatedTarget.classList.contains(searchInput) || input.relatedTarget.classList.contains(selects)))) { +// thisList.classList.remove('active'); +// } +// } + +// e.onclick = function (event) { +// if (!event.target.classList.contains(searchInput)) { +// if (thisList.classList.contains('active')) { +// thisList.classList.remove('active'); +// } + +// thisInput.focus(); +// thisList.classList.add('active'); +// } +// } + +// thisSelects.forEach(e => { +// let newIcon = e.querySelector(selectIcon), +// newCode = e.querySelector(selectCode); + +// e.onclick = function (event) { +// event.preventDefault(); +// thisMainFlag.style.cssText = `background-image:url("${newIcon.src}");`; +// thisMainCode.textContent = newCode.textContent; + + +// setTimeout(() => { +// thisList.classList.remove('active'); +// }, 0); +// } + +// }) +// }) +// } + +if (document.querySelector('.form-input-phone__input')) { + checkPhone('.form-input-phone__input'); +} + +function checkPhone(input) { + document.querySelector(input).addEventListener('input', function(event) { + let text = event.target.value; + let length = text.length; + let newSymbol = event.data; + + if (!(/^\d+$/.test(text.replaceAll(' ', '')))) { + event.target.value = text.slice(0, -1); + return; + } + + if (length == 4 || length == 8) { + if (newSymbol != null) { + event.target.value = text.slice(0, -1) + ' ' + newSymbol; + } + } + }) +} + +inputTabs('.form-input__tabs', '.form-input-tabs__button'); +inputTabs('.modal-map__control', '.modal-map-control__item'); + +function inputTabs(main, button) { + let mains = document.querySelectorAll(main); + + mains.forEach(main => { + let buttons = main.querySelectorAll(button); + + buttons.forEach(button => { + button.onclick = function () { + main.querySelector('.active').classList.remove('active'); + + button.classList.add('active'); + } + }) + + }) +} + + +// inputRadio('.form-input__radio', '.form-input-radio__item', '.form-input-radio__title', '.form-input-radio__input') + +// function inputRadio(main ,item, textClass, input) { +// let inputRadios = document.querySelectorAll(main); + +// inputRadios.forEach(inputRadio => { +// let items = inputRadio.querySelectorAll(item), +// thisInput = inputRadio.querySelector(input); + +// items.forEach(radio => { +// let thisText = radio.querySelector(textClass).textContent; + +// radio.onclick = function (event) { +// event.preventDefault(); + +// if (inputRadio.querySelector(`${item}.active`)) { +// inputRadio.querySelector(`${item}.active`).classList.remove('active'); +// } +// thisInput.value = thisText; +// radio.classList.add('active'); +// } +// }) +// }) +// } + +// listInputRadio('.form-input__list' ,'.form-input-list__item', '.form-input-list-item__text', '.form-input-list__content', '.form-input-list__block-content'); + +// function listInputRadio(main ,item, textClass, input, content, block) { +// let listInputRadios = document.querySelectorAll(main); + +// listInputRadios.forEach(listInputRadio => { +// let thisInput = listInputRadio.querySelector(input), +// items = listInputRadio.querySelectorAll(item), +// thisContent = listInputRadio.querySelector(content), +// thisBlock = listInputRadio.querySelector(block); + +// // thisInput.onclick = function () { +// // thisBlock.classList.add('active'); +// // thisBlock.style.height = '192px'; +// // } + + +// // thisInput.onblur = function(){ +// // thisBlock.classList.remove('active'); +// // thisBlock.style.height = '0px'; +// // }; + +// items.forEach(item => { +// item.onclick = function (event) { +// event.preventDefault(); +// let newText = item.querySelector(textClass).textContent; + +// thisInput.value = newText; + +// if (thisContent.querySelector('.active')) { +// thisContent.querySelector('.active').classList.remove('active'); +// } + +// item.classList.add('active'); +// } +// }) +// }) +// } + + +// remoteControl('.form-input__remote-control', '.form-input-tabs__button'); +// remoteControl('.modal-map__control', '.modal-map-control__item'); + +// function remoteControl(main, button) { +// let mains = document.querySelectorAll(main); + +// console.log(mains); + + +// mains.forEach(main => { +// let subjectClass = main.dataset.content, +// subject = document.querySelector(`.${subjectClass}`), +// buttons = Array.from(main.querySelectorAll(button)); + + + +// main.addEventListener('mousedown', function (eventMain) { +// setTimeout(() => { +// let indexActive = buttons.findIndex((button, index) => { +// if (button.classList.contains('active')) { +// return true; +// } +// }); + +// subject.querySelector('.remote-control__item.active').classList.remove('active'); +// subject.children[indexActive].classList.add('active'); +// }, 0); +// }) +// }) +// } + +// formCheck('.modal-form__content', 'input[type=submit]'); +// formCheck('.modal-map__form', 'input[type=submit]'); + +// function formCheck(form, submit) { +// let forms = document.querySelectorAll(form); + +// forms.forEach(form => { +// let thisSubmit = form.querySelector(submit); + +// thisSubmit.onclick = function () { +// form.classList.add('check') +// } + +// }) +// } + + +jQuery('.form-input-list__item').on('click', function(){ + var value = jQuery(this).find('p').html() + var content = jQuery(this).closest('.form-input-list__block-content') + jQuery(content).prev().html(value) + jQuery(content).removeClass('active').css('height', '0px') +}) + +jQuery('.form-input-list__input').on('click', function(){ + // jQuery(this).next().toggleClass('active') + if(!jQuery(this).next().hasClass('active')){ + jQuery('.form-input-list__block-content').removeClass('active').css('height', '0px') + jQuery(this).next().css('height', '192px').addClass('active') + } + else{ + jQuery(this).next().css('height', '0px').removeClass('active') + } + +}) + +jQuery(document).mouseup(function(e){ + var container = jQuery(".modal-form-content-line__element"); + if(!container.is(e.target) && container.has(e.target).length === 0){ + jQuery('.form-input-list__block-content').removeClass('active').css('height', '0px') + } + }); + + + + + jQuery('#add-pet-form').on('submit', function(e) { + e.preventDefault(); // предотвращаем стандартное поведение формы + var data = jQuery(this).serialize() + jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true) + jQuery.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: data, // отправляем данные формы + complete: function(response) { + location.reload(true) + } + }); + }); + + jQuery('.edit-pet-form').on('submit', function(e) { + e.preventDefault(); // предотвращаем стандартное поведение формы + var data = jQuery(this).serialize() + jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true) + jQuery.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: data, // отправляем данные формы + complete: function(response) { + location.reload(true) + } + }); + }); + jQuery('.form-input-list__item').on('click', function(){ + jQuery(this).closest('.form-input-list__content').find('.form-input-list__item').removeClass('active') + jQuery(this).addClass('active') + }) + jQuery('.form-input-radio__item').on('click', function(){ + jQuery(this).closest('.form-input__radio').find('.form-input-radio__item').removeClass('active') + jQuery(this).addClass('active') + }) + + + jQuery('.cabinet-card__block-add-pets').on('click', function(){ + + jQuery('#pet_add_form').addClass('active') + }) +// jQuery('#pet-form-submit').on('click', function(e) { +// jQuery(this).closest('form').submit() +// }); + + +jQuery('.popup-wrap, .modal-form__close, .modal-form__button-close').on('click', function(e){ + if (e.target == this){ + jQuery(this).closest('.modalProfile').removeClass('active') + } + }) + jQuery('.close-btn').on('click', function(e){ + jQuery(this).closest('.modalProfile').removeClass('active') + }) + + jQuery('input[name="pet"]').on('change', function( + + ){ + var block = jQuery(this).closest('form').find('.sterilized') + if (jQuery(this).val() == 'cat'){ + jQuery(block).show() + jQuery(this).closest('form').find('input[name="sterilized"]').attr('required', true) + } + else{ + jQuery(block).hide() + jQuery(this).closest('form').find('input[name="sterilized"]').attr('required', false) + } + }) + + + jQuery('[data-edit]').on('click', function(){ + jQuery('#pet_edit_'+jQuery(this).data('edit')).addClass('active') + }) + + + +// const reset = () => { +// input.classList.remove("error"); +// errorMsg.innerHTML = ""; +// errorMsg.classList.add("hide"); +// validMsg.classList.add("hide"); +// }; + +// const showError = (msg) => { +// input.classList.add("error"); +// errorMsg.innerHTML = msg; +// errorMsg.classList.remove("hide"); +// }; + + +jQuery('.user-edit-form').on('submit', function(e) { + e.preventDefault(); // предотвращаем стандартное поведение формы + jQuery('.form-input__phone').removeClass('error') + + + var data = jQuery(this).serialize() + jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true) + jQuery.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: data, // отправляем данные формы + complete: function(response) { + location.reload(true) + } + }); + + +}); + +jQuery('.email_approve_form, .foodSub').on('submit', function(e) { + e.preventDefault(); // предотвращаем стандартное поведение формы + var data = jQuery(this).serialize() + jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true) + jQuery.ajax({ + type: 'POST', + url: woocommerce_params.ajax_url, + data: data, // отправляем данные формы + complete: function(response) { + location.reload(true) + } + }); +}); + +jQuery('.user-edit-open').on('click', function(){ + jQuery('#user_edit').addClass('active') +}) + +jQuery('[data-rm]').on('click', function(){ + var rm = jQuery(this).closest('.rm') + jQuery(rm).find('[data-rmcont]').removeClass('active').find('input').attr('required', false) + jQuery(rm).find('[data-rmcont="' + jQuery(this).data('rm') + '"]').addClass('active').find('input').attr('required', true) +}) + + +jQuery('.form-sub__btn').on('click', function(){ + jQuery('#subForm').addClass('active') +}) + diff --git a/wp-content/themes/cosmopet/static/js/layout-main.js b/wp-content/themes/cosmopet/static/js/layout-main.js new file mode 100644 index 0000000..b1b4c4a --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/layout-main.js @@ -0,0 +1,353 @@ +'use strict'; + +jQuery(document).ready(function ($) { + // OVERLAY + // $('.product__main').on('click', '.open-overlay', function () { + // let product = $(this).closest('.product__item'), + // overlay = product.find('.product-item__overlay'); + + // $('.product__item').find('.product-item__overlay').css('top', '100%'); + // overlay.css('top', 0); + // }) + // END OVERLAY + + // $('.product__main').on('click', '.state__button', function(evt) { + // evt.preventDefault(); + // let product = $(this).closest('.product__item'); + // let price = $(this).data('product_price'); + // let id = $(this).data('product_id'); + // let qty = product.find('.counter__input').val(); + // product.find('.product-item-overlay__price').html(price * qty + ' '); + // product.find('.select__state').data('product_price', price).data('product_id', id).val($(this).text().trim()); + // product.find('.state__block').removeClass('expanded').css('height', '0'); + + // product.find('.add_to_cart_button').detach(); + // product.find('.product-item-overlay__button').prepend('Добавить в корзину'); + // }) + + // $('.product__main').on('click', '.counter__button', function(evt) { + // evt.preventDefault(); + // let product = $(this).closest('.product__item'); + // let price = parseFloat(product.find('.select__state').data('product_price')); + + // if (!price){ + // price = parseFloat(product.find('.product-item__price p').html()); + // } + // let qty = product.find('.counter__input'); + + // if ($(this).hasClass('minus') && parseInt(qty.val()) >= 2) { + // qty.val(parseInt(qty.val()) - 1); + // } else { + // if ($(this).hasClass('plus')) { + // qty.val(parseInt(qty.val()) + 1); + // } + // } + // product.find('.product-item-overlay__button a').attr('data-quantity', qty.val()) + // product.find('.product-item-overlay__price').html(price * qty.val() + ' '); + // }) + + // $('.product__main').on('click', '.select__state', function(evt) { + // evt.preventDefault(); + // let product = $(this).closest('.product__item'), + // listing = product.find('.state__block'); + + // if (listing.hasClass('expanded')) { + // listing.removeClass('expanded').css('height', '0'); + // } else { + // listing.addClass('expanded').css('height', 'auto'); + // } + + // product.find('.state__block').find('.state__button').removeClass('active'); + // product.find('.state__button').each(function () { + // if (product.find('.select__state').data('product_id') === $(this).data('product_id')) { + // $(this).addClass('active'); + // } + // }) + // }) + + + // let page = 1; + + // jQuery('body').on('click', '#load-more-products', function(e) { + // e.preventDefault(); + // page++; + + // let category = $(this).data('category_id'); + // let category_type = $(this).data('category_type'); + + // $.ajax({ + // type: 'POST', + // url: '/wp-admin/admin-ajax.php', + // dataType: 'html', + // data: { + // 'action' : 'get_products', + // 'get_page' : page, + // 'get_category' : category, + // 'get_category_type' : category_type, + // }, + // success: function(data) { + // // if($('
').html(data).find('.archive__item.ended').size() > 0) $('#load-more-products').parents('.cta').remove(); + // // else $('#load-more-products').parents('.cta').show(); + + // $('#load-more-products').detach(); + // $('.product__main').append(data); + // $('#load-more-products').prependTo('.product__footer'); + // }, + // error: function(data) { + // console.log(data); + // } + // }); + // }); + + // $('.wpfMainWrapper').prepend('
'); + // $('.wpfMainWrapper').find('.wpfFilterWrapper').appendTo($('.wpfFilters')); + + // $('.wpfFilterWrapper').each(function () { + // if ($(this).data('filter-type') === 'wpfPrice') { + // $(this).find('.wpfFilterContent').append('
'); + // $(this).find('.wpfPriceFilterRange').appendTo('.wpfExpandablePart'); + // $(this).find('.wpfPriceInputs').appendTo('.wpfExpandablePart'); + + // $(this).find('.wpfCurrencySymbol').detach(); + // $(this).find('.wpfFilterDelimeter').detach(); + // } + // }); + + // $('.wfpDescription').on('click', function () { + // $(this).closest('.wpfFilterWrapper').toggleClass('expanded').find('.wpfCheckboxHier').slideToggle(); + // $(this).parent().find('.wpfExpandablePart').slideToggle(); + // }) + + +}) + + + + + + + + +// header +toggleOpenX('.lang', '.lang__open', '.lang__list', '.lang__content', false); +toggleHeader('#pc-menu','.header__menu-block','.header__pc-menu', '.white', 'white'); +toggleHeader('#phone-menu','.header__menu-block','.header__phone-menu', '.white', 'white'); +// header + +// modal + +// toggle +toggleOpenX('.toggle', '.toggle__title', '.toggle__content', '.toggle__block-content', true); +// toggle + + +// overlay +let products = document.querySelectorAll('.product__item'); + +products.forEach(productItem => { + let button = productItem.querySelector('.open-overlay'), + overlay = productItem.querySelector('.product-item__overlay'); + + + if (button) { + button.onclick = function (e) { + console.log('Открытие overlay для товара', productItem); + document.querySelectorAll('.product__item').forEach(e => { + if (e.classList.contains('active')) { + e.classList.remove('active'); + } + }); + document.querySelectorAll('.product-item__overlay').forEach(e => { + if (e.classList.contains('active')) { + e.classList.remove('active'); + } + }); + + productItem.classList.toggle('active'); + overlay.classList.toggle('active'); + console.log('overlay toggled', overlay.classList.contains('active')); + } + } + +}) +// overlay + + +// checkbox +let checkbox = document.querySelectorAll('.checkbox'); + +checkbox.forEach(e => { + e.onclick = function (event) { + let input = e.querySelector('.checkbox__input'); + + if (!e.classList.contains('active')) { + input.checked = 1; + }else{ + input.checked = 0; + } + e.classList.toggle('active'); + } +}) +// checkbox + + +// function + +function toggleOpenX(mainElement, buttonElement ,heightElement, contentElement, close) { + let elements = document.querySelectorAll(mainElement); + + elements.forEach(e => { + let thisMainElement = e, + thisButtonElement = e.querySelector(buttonElement), + thisHeightElement = e.querySelector(heightElement), + thisContentElement = e.querySelector(contentElement); + + thisButtonElement.onclick = function (e) { + let height = thisHeightElement.clientHeight; + + if (close == true && !thisMainElement.classList.contains('active')) { + elements.forEach(e => { + if (e.classList.contains('active')) { + e.classList.remove('active'); + e.querySelector(contentElement).style.height = null + } + }) + } + + if (!thisMainElement.classList.contains('active')) { + thisContentElement.style.height = `${height}px`; + thisMainElement.classList.add('active'); + }else{ + thisContentElement.style.height = null; + thisMainElement.classList.remove('active'); + } + } + + }); +} + +function toggleHeader(button, content, blockheight, removeBlock, removeClass) { + let thisButton = document.querySelector(button), + thisContent = document.querySelector(content), + thisRemoveBlock = document.querySelector(removeBlock) || '', + thisBlockheight = document.querySelector(blockheight); + + thisButton.onclick = function () { + let height = thisBlockheight.clientHeight; + + if (!thisContent.classList .contains('open')) { + thisContent.style.height = `${height}px`; + thisContent.classList .add('open'); + + if (removeBlock) { + thisRemoveBlock.classList.remove(removeClass); + } + }else{ + thisContent.style.height = null; + thisContent.classList .remove('open'); + + if (removeBlock) { + if (window.scrollY <= 25) { + thisRemoveBlock.classList.add(removeClass); + } + } + } + } +} +// function + + +// scroll + + +if (document.querySelector('.header').classList.contains('white')) { + window.addEventListener("scroll", function (e) { + let header = document.querySelector('.header'); + let scroll = window.scrollY; + + if (scroll >= 25) { + header.classList.remove('white') + }else{ + header.classList.add('white') + } + + }); +} +// scroll + +document.addEventListener('DOMContentLoaded', function () { + const petsSlider = new Swiper(".discount_cosmodog__slider", { + slidesPerView: 1, + spaceBetween: 0, + effect: "fade", + fadeEffect: { + crossFade: true, + }, + loop: true, + autoplay: { + delay: 5000, + disableOnInteraction: false, + }, + }); +}); + + +jQuery(document).ready(function($) { + jQuery('.popup-wrap').on('click', function(e) { + if (e.target === this) { + $(this).closest('.modalProfile').removeClass('active'); + } + }); + $('.close-btn').on('click', function(e) { + $('.modalProfile').removeClass('active'); + }); + +}); + +// // Находим все элементы с классом login-open +// document.addEventListener('DOMContentLoaded', function() { +// const loginButtons = document.querySelectorAll('.login-open'); + +// loginButtons.forEach(button => { +// button.addEventListener('click', function(event) { +// event.preventDefault(); + +// const modal = document.querySelector('.modal'); +// const modalAside = document.querySelector('.modal__aside'); +// const modalLogin = document.querySelector('.modal__login'); + +// modal.classList.add('active'); +// modalLogin.classList.add('active'); + +// // Set width and slide in from right +// modalAside.style.width = '20vw'; +// modalAside.style.right = '0'; +// }); +// }); + +// const closeButtons = document.querySelectorAll('.modal-close'); +// const modal = document.querySelector('.modal'); + +// closeButtons.forEach(button => { +// button.addEventListener('click', closeModal); +// }); + +// modal.addEventListener('click', function(event) { +// if (event.target === modal) { +// closeModal(); +// } +// }); + +// function closeModal() { +// const modal = document.querySelector('.modal'); +// const modalAside = document.querySelector('.modal__aside'); +// const modalLogin = document.querySelector('.modal__login'); + +// modal.classList.remove('active'); +// modalLogin.classList.remove('active'); + +// // Reset styles +// modalAside.style.width = ''; +// modalAside.style.right = '-30vw'; +// } +// }); diff --git a/wp-content/themes/cosmopet/static/js/layout-product.js b/wp-content/themes/cosmopet/static/js/layout-product.js new file mode 100644 index 0000000..7b90d3c --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/layout-product.js @@ -0,0 +1,110 @@ +// 'use strict'; + +// // slider gallery modal +// const gallery = new Swiper('.gallery__slider', { +// spaceBetween: 100, + +// pagination: { +// el: '.swiper-pagination', +// }, + +// navigation: { +// nextEl: '.swiper-button-next', +// prevEl: '.swiper-button-prev', +// }, + +// scrollbar: { +// el: '.swiper-scrollbar', +// }, +// }); + +// let paginationButtons = document.querySelectorAll('.gallery-pagination__item'); + +// paginationButtons.forEach(button => { +// let index = button.dataset.countImg; + +// button.onclick = function () { +// gallery.slideTo(index); +// } +// }) + +// // open gallery +// let detailImage= document.querySelectorAll('.detail__image'); +// detailImage.forEach(button => { +// let index = button.dataset.countImg; + +// button.onclick = function () { +// gallery.slideTo(index); + +// document.querySelector('.gallery').classList.add('active'); +// } +// }) + +// // close gallery + +// document.querySelector('.gallery__close').onclick = function () { +// document.querySelector('.gallery').classList.remove('active'); +// } +// // slider gallery modal + +// // slider gallery main phone + +// // createGalleryPhone('.detail__images', '.detail-images__wrapper', '.detail__image', 980); + +// const detailPhone = new Swiper('.detail__images-phone', { +// spaceBetween: 100, + +// pagination: { +// el: '.swiper-pagination', +// }, + +// navigation: { +// nextEl: '.swiper-button-next', +// prevEl: '.swiper-button-prev', +// }, + +// scrollbar: { +// el: '.swiper-scrollbar', +// }, +// }); + +// let detailImagesPhones = document.querySelectorAll('.detail-images-phone__image-block'); + +// detailImagesPhones.forEach(button => { +// button.onclick = function (e) { +// let index = button.dataset.countImg; + +// gallery.slideTo(index); + +// document.querySelector('.gallery').classList.add('active'); +// } +// }) + +// // slider gallery main phone + +// // detail catalog +// const detailCatalot = new Swiper('.detail__catalot', { +// // Navigation arrows +// navigation: { +// nextEl: '.detail-catalot-control__button.next', +// prevEl: '.detail-catalot-control__button.prev', +// }, +// breakpoints: { +// 1600: { +// slidesPerView: 4, +// }, +// 1200: { +// slidesPerView: 3, +// }, +// 780: { +// slidesPerView: 2, +// }, +// 100: { +// slidesPerView: 1.1, +// spaceBetween: 20 +// }, +// } + + +// }); +// // detail catalog \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/js/libs/swiper-bundle.min.js b/wp-content/themes/cosmopet/static/js/libs/swiper-bundle.min.js new file mode 100644 index 0000000..436b921 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/libs/swiper-bundle.min.js @@ -0,0 +1,14 @@ +/** + * Swiper 11.0.5 + * Most modern mobile touch slider and framework with hardware accelerated transitions + * https://swiperjs.com + * + * Copyright 2014-2023 Vladimir Kharlampidi + * + * Released under the MIT License + * + * Released on: November 22, 2023 + */ + +var Swiper=function(){"use strict";function e(e){return null!==e&&"object"==typeof e&&"constructor"in e&&e.constructor===Object}function t(s,a){void 0===s&&(s={}),void 0===a&&(a={}),Object.keys(a).forEach((i=>{void 0===s[i]?s[i]=a[i]:e(a[i])&&e(s[i])&&Object.keys(a[i]).length>0&&t(s[i],a[i])}))}const s={body:{},addEventListener(){},removeEventListener(){},activeElement:{blur(){},nodeName:""},querySelector:()=>null,querySelectorAll:()=>[],getElementById:()=>null,createEvent:()=>({initEvent(){}}),createElement:()=>({children:[],childNodes:[],style:{},setAttribute(){},getElementsByTagName:()=>[]}),createElementNS:()=>({}),importNode:()=>null,location:{hash:"",host:"",hostname:"",href:"",origin:"",pathname:"",protocol:"",search:""}};function a(){const e="undefined"!=typeof document?document:{};return t(e,s),e}const i={document:s,navigator:{userAgent:""},location:{hash:"",host:"",hostname:"",href:"",origin:"",pathname:"",protocol:"",search:""},history:{replaceState(){},pushState(){},go(){},back(){}},CustomEvent:function(){return this},addEventListener(){},removeEventListener(){},getComputedStyle:()=>({getPropertyValue:()=>""}),Image(){},Date(){},screen:{},setTimeout(){},clearTimeout(){},matchMedia:()=>({}),requestAnimationFrame:e=>"undefined"==typeof setTimeout?(e(),null):setTimeout(e,0),cancelAnimationFrame(e){"undefined"!=typeof setTimeout&&clearTimeout(e)}};function r(){const e="undefined"!=typeof window?window:{};return t(e,i),e}function n(e){return void 0===e&&(e=""),e.trim().split(" ").filter((e=>!!e.trim()))}function l(e,t){return void 0===t&&(t=0),setTimeout(e,t)}function o(){return Date.now()}function d(e,t){void 0===t&&(t="x");const s=r();let a,i,n;const l=function(e){const t=r();let s;return t.getComputedStyle&&(s=t.getComputedStyle(e,null)),!s&&e.currentStyle&&(s=e.currentStyle),s||(s=e.style),s}(e);return s.WebKitCSSMatrix?(i=l.transform||l.webkitTransform,i.split(",").length>6&&(i=i.split(", ").map((e=>e.replace(",","."))).join(", ")),n=new s.WebKitCSSMatrix("none"===i?"":i)):(n=l.MozTransform||l.OTransform||l.MsTransform||l.msTransform||l.transform||l.getPropertyValue("transform").replace("translate(","matrix(1, 0, 0, 1,"),a=n.toString().split(",")),"x"===t&&(i=s.WebKitCSSMatrix?n.m41:16===a.length?parseFloat(a[12]):parseFloat(a[4])),"y"===t&&(i=s.WebKitCSSMatrix?n.m42:16===a.length?parseFloat(a[13]):parseFloat(a[5])),i||0}function c(e){return"object"==typeof e&&null!==e&&e.constructor&&"Object"===Object.prototype.toString.call(e).slice(8,-1)}function p(){const e=Object(arguments.length<=0?void 0:arguments[0]),t=["__proto__","constructor","prototype"];for(let a=1;at.indexOf(e)<0));for(let t=0,a=s.length;tn?"next":"prev",p=(e,t)=>"next"===c&&e>=t||"prev"===c&&e<=t,u=()=>{l=(new Date).getTime(),null===o&&(o=l);const e=Math.max(Math.min((l-o)/d,1),0),r=.5-Math.cos(e*Math.PI)/2;let c=n+r*(s-n);if(p(c,s)&&(c=s),t.wrapperEl.scrollTo({[a]:c}),p(c,s))return t.wrapperEl.style.overflow="hidden",t.wrapperEl.style.scrollSnapType="",setTimeout((()=>{t.wrapperEl.style.overflow="",t.wrapperEl.scrollTo({[a]:c})})),void i.cancelAnimationFrame(t.cssModeFrameID);t.cssModeFrameID=i.requestAnimationFrame(u)};u()}function h(e){return e.querySelector(".swiper-slide-transform")||e.shadowRoot&&e.shadowRoot.querySelector(".swiper-slide-transform")||e}function f(e,t){return void 0===t&&(t=""),[...e.children].filter((e=>e.matches(t)))}function g(e){try{return void console.warn(e)}catch(e){}}function v(e,t){void 0===t&&(t=[]);const s=document.createElement(e);return s.classList.add(...Array.isArray(t)?t:n(t)),s}function w(e){const t=r(),s=a(),i=e.getBoundingClientRect(),n=s.body,l=e.clientTop||n.clientTop||0,o=e.clientLeft||n.clientLeft||0,d=e===t?t.scrollY:e.scrollTop,c=e===t?t.scrollX:e.scrollLeft;return{top:i.top+d-l,left:i.left+c-o}}function b(e,t){return r().getComputedStyle(e,null).getPropertyValue(t)}function y(e){let t,s=e;if(s){for(t=0;null!==(s=s.previousSibling);)1===s.nodeType&&(t+=1);return t}}function E(e,t){const s=[];let a=e.parentElement;for(;a;)t?a.matches(t)&&s.push(a):s.push(a),a=a.parentElement;return s}function x(e,t){t&&e.addEventListener("transitionend",(function s(a){a.target===e&&(t.call(e,a),e.removeEventListener("transitionend",s))}))}function S(e,t,s){const a=r();return s?e["width"===t?"offsetWidth":"offsetHeight"]+parseFloat(a.getComputedStyle(e,null).getPropertyValue("width"===t?"margin-right":"margin-top"))+parseFloat(a.getComputedStyle(e,null).getPropertyValue("width"===t?"margin-left":"margin-bottom")):e.offsetWidth}let T,M,C;function P(){return T||(T=function(){const e=r(),t=a();return{smoothScroll:t.documentElement&&t.documentElement.style&&"scrollBehavior"in t.documentElement.style,touch:!!("ontouchstart"in e||e.DocumentTouch&&t instanceof e.DocumentTouch)}}()),T}function L(e){return void 0===e&&(e={}),M||(M=function(e){let{userAgent:t}=void 0===e?{}:e;const s=P(),a=r(),i=a.navigator.platform,n=t||a.navigator.userAgent,l={ios:!1,android:!1},o=a.screen.width,d=a.screen.height,c=n.match(/(Android);?[\s\/]+([\d.]+)?/);let p=n.match(/(iPad).*OS\s([\d_]+)/);const u=n.match(/(iPod)(.*OS\s([\d_]+))?/),m=!p&&n.match(/(iPhone\sOS|iOS)\s([\d_]+)/),h="Win32"===i;let f="MacIntel"===i;return!p&&f&&s.touch&&["1024x1366","1366x1024","834x1194","1194x834","834x1112","1112x834","768x1024","1024x768","820x1180","1180x820","810x1080","1080x810"].indexOf(`${o}x${d}`)>=0&&(p=n.match(/(Version)\/([\d.]+)/),p||(p=[0,1,"13_0_0"]),f=!1),c&&!h&&(l.os="android",l.android=!0),(p||m||u)&&(l.os="ios",l.ios=!0),l}(e)),M}function A(){return C||(C=function(){const e=r();let t=!1;function s(){const t=e.navigator.userAgent.toLowerCase();return t.indexOf("safari")>=0&&t.indexOf("chrome")<0&&t.indexOf("android")<0}if(s()){const s=String(e.navigator.userAgent);if(s.includes("Version/")){const[e,a]=s.split("Version/")[1].split(" ")[0].split(".").map((e=>Number(e)));t=e<16||16===e&&a<2}}return{isSafari:t||s(),needPerspectiveFix:t,isWebView:/(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(e.navigator.userAgent)}}()),C}var I={on(e,t,s){const a=this;if(!a.eventsListeners||a.destroyed)return a;if("function"!=typeof t)return a;const i=s?"unshift":"push";return e.split(" ").forEach((e=>{a.eventsListeners[e]||(a.eventsListeners[e]=[]),a.eventsListeners[e][i](t)})),a},once(e,t,s){const a=this;if(!a.eventsListeners||a.destroyed)return a;if("function"!=typeof t)return a;function i(){a.off(e,i),i.__emitterProxy&&delete i.__emitterProxy;for(var s=arguments.length,r=new Array(s),n=0;n=0&&t.eventsAnyListeners.splice(s,1),t},off(e,t){const s=this;return!s.eventsListeners||s.destroyed?s:s.eventsListeners?(e.split(" ").forEach((e=>{void 0===t?s.eventsListeners[e]=[]:s.eventsListeners[e]&&s.eventsListeners[e].forEach(((a,i)=>{(a===t||a.__emitterProxy&&a.__emitterProxy===t)&&s.eventsListeners[e].splice(i,1)}))})),s):s},emit(){const e=this;if(!e.eventsListeners||e.destroyed)return e;if(!e.eventsListeners)return e;let t,s,a;for(var i=arguments.length,r=new Array(i),n=0;n{e.eventsAnyListeners&&e.eventsAnyListeners.length&&e.eventsAnyListeners.forEach((e=>{e.apply(a,[t,...s])})),e.eventsListeners&&e.eventsListeners[t]&&e.eventsListeners[t].forEach((e=>{e.apply(a,s)}))})),e}};const z=(e,t)=>{if(!e||e.destroyed||!e.params)return;const s=t.closest(e.isElement?"swiper-slide":`.${e.params.slideClass}`);if(s){let t=s.querySelector(`.${e.params.lazyPreloaderClass}`);!t&&e.isElement&&(s.shadowRoot?t=s.shadowRoot.querySelector(`.${e.params.lazyPreloaderClass}`):requestAnimationFrame((()=>{s.shadowRoot&&(t=s.shadowRoot.querySelector(`.${e.params.lazyPreloaderClass}`),t&&t.remove())}))),t&&t.remove()}},$=(e,t)=>{if(!e.slides[t])return;const s=e.slides[t].querySelector('[loading="lazy"]');s&&s.removeAttribute("loading")},k=e=>{if(!e||e.destroyed||!e.params)return;let t=e.params.lazyPreloadPrevNext;const s=e.slides.length;if(!s||!t||t<0)return;t=Math.min(t,s);const a="auto"===e.params.slidesPerView?e.slidesPerViewDynamic():Math.ceil(e.params.slidesPerView),i=e.activeIndex;if(e.params.grid&&e.params.grid.rows>1){const s=i,r=[s-t];return r.push(...Array.from({length:t}).map(((e,t)=>s+a+t))),void e.slides.forEach(((t,s)=>{r.includes(t.column)&&$(e,s)}))}const r=i+a-1;if(e.params.rewind||e.params.loop)for(let a=i-t;a<=r+t;a+=1){const t=(a%s+s)%s;(tr)&&$(e,t)}else for(let a=Math.max(i-t,0);a<=Math.min(r+t,s-1);a+=1)a!==i&&(a>r||a=0?x=parseFloat(x.replace("%",""))/100*r:"string"==typeof x&&(x=parseFloat(x)),e.virtualSize=-x,c.forEach((e=>{n?e.style.marginLeft="":e.style.marginRight="",e.style.marginBottom="",e.style.marginTop=""})),s.centeredSlides&&s.cssMode&&(u(a,"--swiper-centered-offset-before",""),u(a,"--swiper-centered-offset-after",""));const P=s.grid&&s.grid.rows>1&&e.grid;let L;P?e.grid.initSlides(c):e.grid&&e.grid.unsetSlides();const A="auto"===s.slidesPerView&&s.breakpoints&&Object.keys(s.breakpoints).filter((e=>void 0!==s.breakpoints[e].slidesPerView)).length>0;for(let a=0;a1&&m.push(e.virtualSize-r)}if(o&&s.loop){const t=g[0]+x;if(s.slidesPerGroup>1){const a=Math.ceil((e.virtual.slidesBefore+e.virtual.slidesAfter)/s.slidesPerGroup),i=t*s.slidesPerGroup;for(let e=0;e!(s.cssMode&&!s.loop)||t!==c.length-1)).forEach((e=>{e.style[t]=`${x}px`}))}if(s.centeredSlides&&s.centeredSlidesBounds){let e=0;g.forEach((t=>{e+=t+(x||0)})),e-=x;const t=e-r;m=m.map((e=>e<=0?-v:e>t?t+w:e))}if(s.centerInsufficientSlides){let e=0;if(g.forEach((t=>{e+=t+(x||0)})),e-=x,e{m[s]=e-t})),h.forEach(((e,s)=>{h[s]=e+t}))}}if(Object.assign(e,{slides:c,snapGrid:m,slidesGrid:h,slidesSizesGrid:g}),s.centeredSlides&&s.cssMode&&!s.centeredSlidesBounds){u(a,"--swiper-centered-offset-before",-m[0]+"px"),u(a,"--swiper-centered-offset-after",e.size/2-g[g.length-1]/2+"px");const t=-e.snapGrid[0],s=-e.slidesGrid[0];e.snapGrid=e.snapGrid.map((e=>e+t)),e.slidesGrid=e.slidesGrid.map((e=>e+s))}if(p!==d&&e.emit("slidesLengthChange"),m.length!==y&&(e.params.watchOverflow&&e.checkOverflow(),e.emit("snapGridLengthChange")),h.length!==E&&e.emit("slidesGridLengthChange"),s.watchSlidesProgress&&e.updateSlidesOffset(),e.emit("slidesUpdated"),!(o||s.cssMode||"slide"!==s.effect&&"fade"!==s.effect)){const t=`${s.containerModifierClass}backface-hidden`,a=e.el.classList.contains(t);p<=s.maxBackfaceHiddenSlides?a||e.el.classList.add(t):a&&e.el.classList.remove(t)}},updateAutoHeight:function(e){const t=this,s=[],a=t.virtual&&t.params.virtual.enabled;let i,r=0;"number"==typeof e?t.setTransition(e):!0===e&&t.setTransition(t.params.speed);const n=e=>a?t.slides[t.getSlideIndexByData(e)]:t.slides[e];if("auto"!==t.params.slidesPerView&&t.params.slidesPerView>1)if(t.params.centeredSlides)(t.visibleSlides||[]).forEach((e=>{s.push(e)}));else for(i=0;it.slides.length&&!a)break;s.push(n(e))}else s.push(n(t.activeIndex));for(i=0;ir?e:r}(r||0===r)&&(t.wrapperEl.style.height=`${r}px`)},updateSlidesOffset:function(){const e=this,t=e.slides,s=e.isElement?e.isHorizontal()?e.wrapperEl.offsetLeft:e.wrapperEl.offsetTop:0;for(let a=0;a{e.classList.remove(s.slideVisibleClass,s.slideFullyVisibleClass)})),t.visibleSlidesIndexes=[],t.visibleSlides=[];let l=s.spaceBetween;"string"==typeof l&&l.indexOf("%")>=0?l=parseFloat(l.replace("%",""))/100*t.size:"string"==typeof l&&(l=parseFloat(l));for(let e=0;e=0&&u<=t.size-t.slidesSizesGrid[e];(u>=0&&u1&&m<=t.size||u<=0&&m>=t.size)&&(t.visibleSlides.push(o),t.visibleSlidesIndexes.push(e),a[e].classList.add(s.slideVisibleClass)),h&&a[e].classList.add(s.slideFullyVisibleClass),o.progress=i?-c:c,o.originalProgress=i?-p:p}},updateProgress:function(e){const t=this;if(void 0===e){const s=t.rtlTranslate?-1:1;e=t&&t.translate&&t.translate*s||0}const s=t.params,a=t.maxTranslate()-t.minTranslate();let{progress:i,isBeginning:r,isEnd:n,progressLoop:l}=t;const o=r,d=n;if(0===a)i=0,r=!0,n=!0;else{i=(e-t.minTranslate())/a;const s=Math.abs(e-t.minTranslate())<1,l=Math.abs(e-t.maxTranslate())<1;r=s||i<=0,n=l||i>=1,s&&(i=0),l&&(i=1)}if(s.loop){const s=t.getSlideIndexByData(0),a=t.getSlideIndexByData(t.slides.length-1),i=t.slidesGrid[s],r=t.slidesGrid[a],n=t.slidesGrid[t.slidesGrid.length-1],o=Math.abs(e);l=o>=i?(o-i)/n:(o+n-r)/n,l>1&&(l-=1)}Object.assign(t,{progress:i,progressLoop:l,isBeginning:r,isEnd:n}),(s.watchSlidesProgress||s.centeredSlides&&s.autoHeight)&&t.updateSlidesProgress(e),r&&!o&&t.emit("reachBeginning toEdge"),n&&!d&&t.emit("reachEnd toEdge"),(o&&!r||d&&!n)&&t.emit("fromEdge"),t.emit("progress",i)},updateSlidesClasses:function(){const e=this,{slides:t,params:s,slidesEl:a,activeIndex:i}=e,r=e.virtual&&s.virtual.enabled,n=e.grid&&s.grid&&s.grid.rows>1,l=e=>f(a,`.${s.slideClass}${e}, swiper-slide${e}`)[0];let o,d,c;if(t.forEach((e=>{e.classList.remove(s.slideActiveClass,s.slideNextClass,s.slidePrevClass)})),r)if(s.loop){let t=i-e.virtual.slidesBefore;t<0&&(t=e.virtual.slides.length+t),t>=e.virtual.slides.length&&(t-=e.virtual.slides.length),o=l(`[data-swiper-slide-index="${t}"]`)}else o=l(`[data-swiper-slide-index="${i}"]`);else n?(o=t.filter((e=>e.column===i))[0],c=t.filter((e=>e.column===i+1))[0],d=t.filter((e=>e.column===i-1))[0]):o=t[i];o&&(o.classList.add(s.slideActiveClass),n?(c&&c.classList.add(s.slideNextClass),d&&d.classList.add(s.slidePrevClass)):(c=function(e,t){const s=[];for(;e.nextElementSibling;){const a=e.nextElementSibling;t?a.matches(t)&&s.push(a):s.push(a),e=a}return s}(o,`.${s.slideClass}, swiper-slide`)[0],s.loop&&!c&&(c=t[0]),c&&c.classList.add(s.slideNextClass),d=function(e,t){const s=[];for(;e.previousElementSibling;){const a=e.previousElementSibling;t?a.matches(t)&&s.push(a):s.push(a),e=a}return s}(o,`.${s.slideClass}, swiper-slide`)[0],s.loop&&0===!d&&(d=t[t.length-1]),d&&d.classList.add(s.slidePrevClass))),e.emitSlidesClasses()},updateActiveIndex:function(e){const t=this,s=t.rtlTranslate?t.translate:-t.translate,{snapGrid:a,params:i,activeIndex:r,realIndex:n,snapIndex:l}=t;let o,d=e;const c=e=>{let s=e-t.virtual.slidesBefore;return s<0&&(s=t.virtual.slides.length+s),s>=t.virtual.slides.length&&(s-=t.virtual.slides.length),s};if(void 0===d&&(d=function(e){const{slidesGrid:t,params:s}=e,a=e.rtlTranslate?e.translate:-e.translate;let i;for(let e=0;e=t[e]&&a=t[e]&&a=t[e]&&(i=e);return s.normalizeSlideIndex&&(i<0||void 0===i)&&(i=0),i}(t)),a.indexOf(s)>=0)o=a.indexOf(s);else{const e=Math.min(i.slidesPerGroupSkip,d);o=e+Math.floor((d-e)/i.slidesPerGroup)}if(o>=a.length&&(o=a.length-1),d===r&&!t.params.loop)return void(o!==l&&(t.snapIndex=o,t.emit("snapIndexChange")));if(d===r&&t.params.loop&&t.virtual&&t.params.virtual.enabled)return void(t.realIndex=c(d));const p=t.grid&&i.grid&&i.grid.rows>1;let u;if(t.virtual&&i.virtual.enabled&&i.loop)u=c(d);else if(p){const e=t.slides.filter((e=>e.column===d))[0];let s=parseInt(e.getAttribute("data-swiper-slide-index"),10);Number.isNaN(s)&&(s=Math.max(t.slides.indexOf(e),0)),u=Math.floor(s/i.grid.rows)}else if(t.slides[d]){const e=t.slides[d].getAttribute("data-swiper-slide-index");u=e?parseInt(e,10):d}else u=d;Object.assign(t,{previousSnapIndex:l,snapIndex:o,previousRealIndex:n,realIndex:u,previousIndex:r,activeIndex:d}),t.initialized&&k(t),t.emit("activeIndexChange"),t.emit("snapIndexChange"),(t.initialized||t.params.runCallbacksOnInit)&&(n!==u&&t.emit("realIndexChange"),t.emit("slideChange"))},updateClickedSlide:function(e,t){const s=this,a=s.params;let i=e.closest(`.${a.slideClass}, swiper-slide`);!i&&s.isElement&&t&&t.length>1&&t.includes(e)&&[...t.slice(t.indexOf(e)+1,t.length)].forEach((e=>{!i&&e.matches&&e.matches(`.${a.slideClass}, swiper-slide`)&&(i=e)}));let r,n=!1;if(i)for(let e=0;eo?o:a&&en?"next":r=o.length&&(v=o.length-1);const w=-o[v];if(l.normalizeSlideIndex)for(let e=0;e=s&&t=s&&t=s&&(n=e)}if(r.initialized&&n!==p){if(!r.allowSlideNext&&(u?w>r.translate&&w>r.minTranslate():wr.translate&&w>r.maxTranslate()&&(p||0)!==n)return!1}let b;if(n!==(c||0)&&s&&r.emit("beforeSlideChangeStart"),r.updateProgress(w),b=n>p?"next":n0?(r._cssModeVirtualInitialSet=!0,requestAnimationFrame((()=>{h[e?"scrollLeft":"scrollTop"]=s}))):h[e?"scrollLeft":"scrollTop"]=s,t&&requestAnimationFrame((()=>{r.wrapperEl.style.scrollSnapType="",r._immediateVirtual=!1}))}else{if(!r.support.smoothScroll)return m({swiper:r,targetPosition:s,side:e?"left":"top"}),!0;h.scrollTo({[e?"left":"top"]:s,behavior:"smooth"})}return!0}return r.setTransition(t),r.setTranslate(w),r.updateActiveIndex(n),r.updateSlidesClasses(),r.emit("beforeTransitionStart",t,a),r.transitionStart(s,b),0===t?r.transitionEnd(s,b):r.animating||(r.animating=!0,r.onSlideToWrapperTransitionEnd||(r.onSlideToWrapperTransitionEnd=function(e){r&&!r.destroyed&&e.target===this&&(r.wrapperEl.removeEventListener("transitionend",r.onSlideToWrapperTransitionEnd),r.onSlideToWrapperTransitionEnd=null,delete r.onSlideToWrapperTransitionEnd,r.transitionEnd(s,b))}),r.wrapperEl.addEventListener("transitionend",r.onSlideToWrapperTransitionEnd)),!0},slideToLoop:function(e,t,s,a){if(void 0===e&&(e=0),void 0===t&&(t=this.params.speed),void 0===s&&(s=!0),"string"==typeof e){e=parseInt(e,10)}const i=this,r=i.grid&&i.params.grid&&i.params.grid.rows>1;let n=e;if(i.params.loop)if(i.virtual&&i.params.virtual.enabled)n+=i.virtual.slidesBefore;else{let e;if(r){const t=n*i.params.grid.rows;e=i.slides.filter((e=>1*e.getAttribute("data-swiper-slide-index")===t))[0].column}else e=i.getSlideIndexByData(n);const t=r?Math.ceil(i.slides.length/i.params.grid.rows):i.slides.length,{centeredSlides:s}=i.params;let a=i.params.slidesPerView;"auto"===a?a=i.slidesPerViewDynamic():(a=Math.ceil(parseFloat(i.params.slidesPerView,10)),s&&a%2==0&&(a+=1));let l=t-e1*t.getAttribute("data-swiper-slide-index")===e))[0].column}else n=i.getSlideIndexByData(n)}return requestAnimationFrame((()=>{i.slideTo(n,t,s,a)})),i},slideNext:function(e,t,s){void 0===e&&(e=this.params.speed),void 0===t&&(t=!0);const a=this,{enabled:i,params:r,animating:n}=a;if(!i)return a;let l=r.slidesPerGroup;"auto"===r.slidesPerView&&1===r.slidesPerGroup&&r.slidesPerGroupAuto&&(l=Math.max(a.slidesPerViewDynamic("current",!0),1));const o=a.activeIndex{a.slideTo(a.activeIndex+o,e,t,s)})),!0}return r.rewind&&a.isEnd?a.slideTo(0,e,t,s):a.slideTo(a.activeIndex+o,e,t,s)},slidePrev:function(e,t,s){void 0===e&&(e=this.params.speed),void 0===t&&(t=!0);const a=this,{params:i,snapGrid:r,slidesGrid:n,rtlTranslate:l,enabled:o,animating:d}=a;if(!o)return a;const c=a.virtual&&i.virtual.enabled;if(i.loop){if(d&&!c&&i.loopPreventsSliding)return!1;a.loopFix({direction:"prev"}),a._clientLeft=a.wrapperEl.clientLeft}function p(e){return e<0?-Math.floor(Math.abs(e)):Math.floor(e)}const u=p(l?a.translate:-a.translate),m=r.map((e=>p(e)));let h=r[m.indexOf(u)-1];if(void 0===h&&i.cssMode){let e;r.forEach(((t,s)=>{u>=t&&(e=s)})),void 0!==e&&(h=r[e>0?e-1:e])}let f=0;if(void 0!==h&&(f=n.indexOf(h),f<0&&(f=a.activeIndex-1),"auto"===i.slidesPerView&&1===i.slidesPerGroup&&i.slidesPerGroupAuto&&(f=f-a.slidesPerViewDynamic("previous",!0)+1,f=Math.max(f,0))),i.rewind&&a.isBeginning){const i=a.params.virtual&&a.params.virtual.enabled&&a.virtual?a.virtual.slides.length-1:a.slides.length-1;return a.slideTo(i,e,t,s)}return i.loop&&0===a.activeIndex&&i.cssMode?(requestAnimationFrame((()=>{a.slideTo(f,e,t,s)})),!0):a.slideTo(f,e,t,s)},slideReset:function(e,t,s){return void 0===e&&(e=this.params.speed),void 0===t&&(t=!0),this.slideTo(this.activeIndex,e,t,s)},slideToClosest:function(e,t,s,a){void 0===e&&(e=this.params.speed),void 0===t&&(t=!0),void 0===a&&(a=.5);const i=this;let r=i.activeIndex;const n=Math.min(i.params.slidesPerGroupSkip,r),l=n+Math.floor((r-n)/i.params.slidesPerGroup),o=i.rtlTranslate?i.translate:-i.translate;if(o>=i.snapGrid[l]){const e=i.snapGrid[l];o-e>(i.snapGrid[l+1]-e)*a&&(r+=i.params.slidesPerGroup)}else{const e=i.snapGrid[l-1];o-e<=(i.snapGrid[l]-e)*a&&(r-=i.params.slidesPerGroup)}return r=Math.max(r,0),r=Math.min(r,i.slidesGrid.length-1),i.slideTo(r,e,t,s)},slideToClickedSlide:function(){const e=this,{params:t,slidesEl:s}=e,a="auto"===t.slidesPerView?e.slidesPerViewDynamic():t.slidesPerView;let i,r=e.clickedIndex;const n=e.isElement?"swiper-slide":`.${t.slideClass}`;if(t.loop){if(e.animating)return;i=parseInt(e.clickedSlide.getAttribute("data-swiper-slide-index"),10),t.centeredSlides?re.slides.length-e.loopedSlides+a/2?(e.loopFix(),r=e.getSlideIndex(f(s,`${n}[data-swiper-slide-index="${i}"]`)[0]),l((()=>{e.slideTo(r)}))):e.slideTo(r):r>e.slides.length-a?(e.loopFix(),r=e.getSlideIndex(f(s,`${n}[data-swiper-slide-index="${i}"]`)[0]),l((()=>{e.slideTo(r)}))):e.slideTo(r)}else e.slideTo(r)}};var H={loopCreate:function(e){const t=this,{params:s,slidesEl:a}=t;if(!s.loop||t.virtual&&t.params.virtual.enabled)return;const i=()=>{f(a,`.${s.slideClass}, swiper-slide`).forEach(((e,t)=>{e.setAttribute("data-swiper-slide-index",t)}))},r=t.grid&&s.grid&&s.grid.rows>1,n=s.slidesPerGroup*(r?s.grid.rows:1),l=t.slides.length%n!=0,o=r&&t.slides.length%s.grid.rows!=0,d=e=>{for(let a=0;a1;d.lengthe.classList.contains(m.slideActiveClass)))[0]):x=r;const S="next"===a||!a,T="prev"===a||!a;let M=0,C=0;const P=b?Math.ceil(d.length/m.grid.rows):d.length,L=(b?d[r].column:r)+(h&&void 0===i?-f/2+.5:0);if(L=0;t-=1)d[t].column===e&&y.push(t)}else y.push(P-t-1)}}else if(L+f>P-w){C=Math.max(L-(P-2*w),v);for(let e=0;e{e.column===t&&E.push(s)})):E.push(t)}}if(o.__preventObserver__=!0,requestAnimationFrame((()=>{o.__preventObserver__=!1})),T&&y.forEach((e=>{d[e].swiperLoopMoveDOM=!0,u.prepend(d[e]),d[e].swiperLoopMoveDOM=!1})),S&&E.forEach((e=>{d[e].swiperLoopMoveDOM=!0,u.append(d[e]),d[e].swiperLoopMoveDOM=!1})),o.recalcSlides(),"auto"===m.slidesPerView?o.updateSlides():b&&(y.length>0&&T||E.length>0&&S)&&o.slides.forEach(((e,t)=>{o.grid.updateSlide(t,e,o.slides)})),m.watchSlidesProgress&&o.updateSlidesOffset(),s)if(y.length>0&&T){if(void 0===t){const e=o.slidesGrid[x],t=o.slidesGrid[x+M]-e;l?o.setTranslate(o.translate-t):(o.slideTo(x+M,0,!1,!0),i&&(o.touchEventsData.startTranslate=o.touchEventsData.startTranslate-t,o.touchEventsData.currentTranslate=o.touchEventsData.currentTranslate-t))}else if(i){const e=b?y.length/m.grid.rows:y.length;o.slideTo(o.activeIndex+e,0,!1,!0),o.touchEventsData.currentTranslate=o.translate}}else if(E.length>0&&S)if(void 0===t){const e=o.slidesGrid[x],t=o.slidesGrid[x-C]-e;l?o.setTranslate(o.translate-t):(o.slideTo(x-C,0,!1,!0),i&&(o.touchEventsData.startTranslate=o.touchEventsData.startTranslate-t,o.touchEventsData.currentTranslate=o.touchEventsData.currentTranslate-t))}else{const e=b?E.length/m.grid.rows:E.length;o.slideTo(o.activeIndex-e,0,!1,!0)}if(o.allowSlidePrev=c,o.allowSlideNext=p,o.controller&&o.controller.control&&!n){const e={slideRealIndex:t,direction:a,setTranslate:i,activeSlideIndex:r,byController:!0};Array.isArray(o.controller.control)?o.controller.control.forEach((t=>{!t.destroyed&&t.params.loop&&t.loopFix({...e,slideTo:t.params.slidesPerView===m.slidesPerView&&s})})):o.controller.control instanceof o.constructor&&o.controller.control.params.loop&&o.controller.control.loopFix({...e,slideTo:o.controller.control.params.slidesPerView===m.slidesPerView&&s})}o.emit("loopFix")},loopDestroy:function(){const e=this,{params:t,slidesEl:s}=e;if(!t.loop||e.virtual&&e.params.virtual.enabled)return;e.recalcSlides();const a=[];e.slides.forEach((e=>{const t=void 0===e.swiperSlideIndex?1*e.getAttribute("data-swiper-slide-index"):e.swiperSlideIndex;a[t]=e})),e.slides.forEach((e=>{e.removeAttribute("data-swiper-slide-index")})),a.forEach((e=>{s.append(e)})),e.recalcSlides(),e.slideTo(e.realIndex,0)}};function N(e,t,s){const a=r(),{params:i}=e,n=i.edgeSwipeDetection,l=i.edgeSwipeThreshold;return!n||!(s<=l||s>=a.innerWidth-l)||"prevent"===n&&(t.preventDefault(),!0)}function Y(e){const t=this,s=a();let i=e;i.originalEvent&&(i=i.originalEvent);const n=t.touchEventsData;if("pointerdown"===i.type){if(null!==n.pointerId&&n.pointerId!==i.pointerId)return;n.pointerId=i.pointerId}else"touchstart"===i.type&&1===i.targetTouches.length&&(n.touchId=i.targetTouches[0].identifier);if("touchstart"===i.type)return void N(t,i,i.targetTouches[0].pageX);const{params:l,touches:d,enabled:c}=t;if(!c)return;if(!l.simulateTouch&&"mouse"===i.pointerType)return;if(t.animating&&l.preventInteractionOnTransition)return;!t.animating&&l.cssMode&&l.loop&&t.loopFix();let p=i.target;if("wrapper"===l.touchEventsTarget&&!t.wrapperEl.contains(p))return;if("which"in i&&3===i.which)return;if("button"in i&&i.button>0)return;if(n.isTouched&&n.isMoved)return;const u=!!l.noSwipingClass&&""!==l.noSwipingClass,m=i.composedPath?i.composedPath():i.path;u&&i.target&&i.target.shadowRoot&&m&&(p=m[0]);const h=l.noSwipingSelector?l.noSwipingSelector:`.${l.noSwipingClass}`,f=!(!i.target||!i.target.shadowRoot);if(l.noSwiping&&(f?function(e,t){return void 0===t&&(t=this),function t(s){if(!s||s===a()||s===r())return null;s.assignedSlot&&(s=s.assignedSlot);const i=s.closest(e);return i||s.getRootNode?i||t(s.getRootNode().host):null}(t)}(h,p):p.closest(h)))return void(t.allowClick=!0);if(l.swipeHandler&&!p.closest(l.swipeHandler))return;d.currentX=i.pageX,d.currentY=i.pageY;const g=d.currentX,v=d.currentY;if(!N(t,i,g))return;Object.assign(n,{isTouched:!0,isMoved:!1,allowTouchCallbacks:!0,isScrolling:void 0,startMoving:void 0}),d.startX=g,d.startY=v,n.touchStartTime=o(),t.allowClick=!0,t.updateSize(),t.swipeDirection=void 0,l.threshold>0&&(n.allowThresholdMove=!1);let w=!0;p.matches(n.focusableElements)&&(w=!1,"SELECT"===p.nodeName&&(n.isTouched=!1)),s.activeElement&&s.activeElement.matches(n.focusableElements)&&s.activeElement!==p&&s.activeElement.blur();const b=w&&t.allowTouchMove&&l.touchStartPreventDefault;!l.touchStartForcePreventDefault&&!b||p.isContentEditable||i.preventDefault(),l.freeMode&&l.freeMode.enabled&&t.freeMode&&t.animating&&!l.cssMode&&t.freeMode.onTouchStart(),t.emit("touchStart",i)}function B(e){const t=a(),s=this,i=s.touchEventsData,{params:r,touches:n,rtlTranslate:l,enabled:d}=s;if(!d)return;if(!r.simulateTouch&&"mouse"===e.pointerType)return;let c,p=e;if(p.originalEvent&&(p=p.originalEvent),"pointermove"===p.type){if(null!==i.touchId)return;if(p.pointerId!==i.pointerId)return}if("touchmove"===p.type){if(c=[...p.changedTouches].filter((e=>e.identifier===i.touchId))[0],!c||c.identifier!==i.touchId)return}else c=p;if(!i.isTouched)return void(i.startMoving&&i.isScrolling&&s.emit("touchMoveOpposite",p));const u=c.pageX,m=c.pageY;if(p.preventedByNestedSwiper)return n.startX=u,void(n.startY=m);if(!s.allowTouchMove)return p.target.matches(i.focusableElements)||(s.allowClick=!1),void(i.isTouched&&(Object.assign(n,{startX:u,startY:m,currentX:u,currentY:m}),i.touchStartTime=o()));if(r.touchReleaseOnEdges&&!r.loop)if(s.isVertical()){if(mn.startY&&s.translate>=s.minTranslate())return i.isTouched=!1,void(i.isMoved=!1)}else if(un.startX&&s.translate>=s.minTranslate())return;if(t.activeElement&&p.target===t.activeElement&&p.target.matches(i.focusableElements))return i.isMoved=!0,void(s.allowClick=!1);i.allowTouchCallbacks&&s.emit("touchMove",p),n.previousX=n.currentX,n.previousY=n.currentY,n.currentX=u,n.currentY=m;const h=n.currentX-n.startX,f=n.currentY-n.startY;if(s.params.threshold&&Math.sqrt(h**2+f**2)=25&&(e=180*Math.atan2(Math.abs(f),Math.abs(h))/Math.PI,i.isScrolling=s.isHorizontal()?e>r.touchAngle:90-e>r.touchAngle)}if(i.isScrolling&&s.emit("touchMoveOpposite",p),void 0===i.startMoving&&(n.currentX===n.startX&&n.currentY===n.startY||(i.startMoving=!0)),i.isScrolling)return void(i.isTouched=!1);if(!i.startMoving)return;s.allowClick=!1,!r.cssMode&&p.cancelable&&p.preventDefault(),r.touchMoveStopPropagation&&!r.nested&&p.stopPropagation();let g=s.isHorizontal()?h:f,v=s.isHorizontal()?n.currentX-n.previousX:n.currentY-n.previousY;r.oneWayMovement&&(g=Math.abs(g)*(l?1:-1),v=Math.abs(v)*(l?1:-1)),n.diff=g,g*=r.touchRatio,l&&(g=-g,v=-v);const w=s.touchesDirection;s.swipeDirection=g>0?"prev":"next",s.touchesDirection=v>0?"prev":"next";const b=s.params.loop&&!r.cssMode,y="next"===s.touchesDirection&&s.allowSlideNext||"prev"===s.touchesDirection&&s.allowSlidePrev;if(!i.isMoved){if(b&&y&&s.loopFix({direction:s.swipeDirection}),i.startTranslate=s.getTranslate(),s.setTransition(0),s.animating){const e=new window.CustomEvent("transitionend",{bubbles:!0,cancelable:!0});s.wrapperEl.dispatchEvent(e)}i.allowMomentumBounce=!1,!r.grabCursor||!0!==s.allowSlideNext&&!0!==s.allowSlidePrev||s.setGrabCursor(!0),s.emit("sliderFirstMove",p)}if((new Date).getTime(),i.isMoved&&i.allowThresholdMove&&w!==s.touchesDirection&&b&&y&&Math.abs(g)>=1)return Object.assign(n,{startX:u,startY:m,currentX:u,currentY:m,startTranslate:i.currentTranslate}),i.loopSwapReset=!0,void(i.startTranslate=i.currentTranslate);s.emit("sliderMove",p),i.isMoved=!0,i.currentTranslate=g+i.startTranslate;let E=!0,x=r.resistanceRatio;if(r.touchReleaseOnEdges&&(x=0),g>0?(b&&y&&i.allowThresholdMove&&i.currentTranslate>(r.centeredSlides?s.minTranslate()-s.slidesSizesGrid[s.activeIndex+1]:s.minTranslate())&&s.loopFix({direction:"prev",setTranslate:!0,activeSlideIndex:0}),i.currentTranslate>s.minTranslate()&&(E=!1,r.resistance&&(i.currentTranslate=s.minTranslate()-1+(-s.minTranslate()+i.startTranslate+g)**x))):g<0&&(b&&y&&i.allowThresholdMove&&i.currentTranslate<(r.centeredSlides?s.maxTranslate()+s.slidesSizesGrid[s.slidesSizesGrid.length-1]:s.maxTranslate())&&s.loopFix({direction:"next",setTranslate:!0,activeSlideIndex:s.slides.length-("auto"===r.slidesPerView?s.slidesPerViewDynamic():Math.ceil(parseFloat(r.slidesPerView,10)))}),i.currentTranslatei.startTranslate&&(i.currentTranslate=i.startTranslate),s.allowSlidePrev||s.allowSlideNext||(i.currentTranslate=i.startTranslate),r.threshold>0){if(!(Math.abs(g)>r.threshold||i.allowThresholdMove))return void(i.currentTranslate=i.startTranslate);if(!i.allowThresholdMove)return i.allowThresholdMove=!0,n.startX=n.currentX,n.startY=n.currentY,i.currentTranslate=i.startTranslate,void(n.diff=s.isHorizontal()?n.currentX-n.startX:n.currentY-n.startY)}r.followFinger&&!r.cssMode&&((r.freeMode&&r.freeMode.enabled&&s.freeMode||r.watchSlidesProgress)&&(s.updateActiveIndex(),s.updateSlidesClasses()),r.freeMode&&r.freeMode.enabled&&s.freeMode&&s.freeMode.onTouchMove(),s.updateProgress(i.currentTranslate),s.setTranslate(i.currentTranslate))}function R(e){const t=this,s=t.touchEventsData;let a,i=e;i.originalEvent&&(i=i.originalEvent);if("touchend"===i.type||"touchcancel"===i.type){if(a=[...i.changedTouches].filter((e=>e.identifier===s.touchId))[0],!a||a.identifier!==s.touchId)return}else{if(null!==s.touchId)return;if(i.pointerId!==s.pointerId)return;a=i}if(["pointercancel","pointerout","pointerleave","contextmenu"].includes(i.type)){if(!(["pointercancel","contextmenu"].includes(i.type)&&(t.browser.isSafari||t.browser.isWebView)))return}s.pointerId=null,s.touchId=null;const{params:r,touches:n,rtlTranslate:d,slidesGrid:c,enabled:p}=t;if(!p)return;if(!r.simulateTouch&&"mouse"===i.pointerType)return;if(s.allowTouchCallbacks&&t.emit("touchEnd",i),s.allowTouchCallbacks=!1,!s.isTouched)return s.isMoved&&r.grabCursor&&t.setGrabCursor(!1),s.isMoved=!1,void(s.startMoving=!1);r.grabCursor&&s.isMoved&&s.isTouched&&(!0===t.allowSlideNext||!0===t.allowSlidePrev)&&t.setGrabCursor(!1);const u=o(),m=u-s.touchStartTime;if(t.allowClick){const e=i.path||i.composedPath&&i.composedPath();t.updateClickedSlide(e&&e[0]||i.target,e),t.emit("tap click",i),m<300&&u-s.lastClickTime<300&&t.emit("doubleTap doubleClick",i)}if(s.lastClickTime=o(),l((()=>{t.destroyed||(t.allowClick=!0)})),!s.isTouched||!s.isMoved||!t.swipeDirection||0===n.diff&&!s.loopSwapReset||s.currentTranslate===s.startTranslate&&!s.loopSwapReset)return s.isTouched=!1,s.isMoved=!1,void(s.startMoving=!1);let h;if(s.isTouched=!1,s.isMoved=!1,s.startMoving=!1,h=r.followFinger?d?t.translate:-t.translate:-s.currentTranslate,r.cssMode)return;if(r.freeMode&&r.freeMode.enabled)return void t.freeMode.onTouchEnd({currentPos:h});const f=h>=-t.maxTranslate()&&!t.params.loop;let g=0,v=t.slidesSizesGrid[0];for(let e=0;e=c[e]&&h=c[e])&&(g=e,v=c[c.length-1]-c[c.length-2])}let w=null,b=null;r.rewind&&(t.isBeginning?b=r.virtual&&r.virtual.enabled&&t.virtual?t.virtual.slides.length-1:t.slides.length-1:t.isEnd&&(w=0));const y=(h-c[g])/v,E=gr.longSwipesMs){if(!r.longSwipes)return void t.slideTo(t.activeIndex);"next"===t.swipeDirection&&(y>=r.longSwipesRatio?t.slideTo(r.rewind&&t.isEnd?w:g+E):t.slideTo(g)),"prev"===t.swipeDirection&&(y>1-r.longSwipesRatio?t.slideTo(g+E):null!==b&&y<0&&Math.abs(y)>r.longSwipesRatio?t.slideTo(b):t.slideTo(g))}else{if(!r.shortSwipes)return void t.slideTo(t.activeIndex);t.navigation&&(i.target===t.navigation.nextEl||i.target===t.navigation.prevEl)?i.target===t.navigation.nextEl?t.slideTo(g+E):t.slideTo(g):("next"===t.swipeDirection&&t.slideTo(null!==w?w:g+E),"prev"===t.swipeDirection&&t.slideTo(null!==b?b:g))}}function q(){const e=this,{params:t,el:s}=e;if(s&&0===s.offsetWidth)return;t.breakpoints&&e.setBreakpoint();const{allowSlideNext:a,allowSlidePrev:i,snapGrid:r}=e,n=e.virtual&&e.params.virtual.enabled;e.allowSlideNext=!0,e.allowSlidePrev=!0,e.updateSize(),e.updateSlides(),e.updateSlidesClasses();const l=n&&t.loop;!("auto"===t.slidesPerView||t.slidesPerView>1)||!e.isEnd||e.isBeginning||e.params.centeredSlides||l?e.params.loop&&!n?e.slideToLoop(e.realIndex,0,!1,!0):e.slideTo(e.activeIndex,0,!1,!0):e.slideTo(e.slides.length-1,0,!1,!0),e.autoplay&&e.autoplay.running&&e.autoplay.paused&&(clearTimeout(e.autoplay.resizeTimeout),e.autoplay.resizeTimeout=setTimeout((()=>{e.autoplay&&e.autoplay.running&&e.autoplay.paused&&e.autoplay.resume()}),500)),e.allowSlidePrev=i,e.allowSlideNext=a,e.params.watchOverflow&&r!==e.snapGrid&&e.checkOverflow()}function V(e){const t=this;t.enabled&&(t.allowClick||(t.params.preventClicks&&e.preventDefault(),t.params.preventClicksPropagation&&t.animating&&(e.stopPropagation(),e.stopImmediatePropagation())))}function _(){const e=this,{wrapperEl:t,rtlTranslate:s,enabled:a}=e;if(!a)return;let i;e.previousTranslate=e.translate,e.isHorizontal()?e.translate=-t.scrollLeft:e.translate=-t.scrollTop,0===e.translate&&(e.translate=0),e.updateActiveIndex(),e.updateSlidesClasses();const r=e.maxTranslate()-e.minTranslate();i=0===r?0:(e.translate-e.minTranslate())/r,i!==e.progress&&e.updateProgress(s?-e.translate:e.translate),e.emit("setTranslate",e.translate,!1)}function F(e){const t=this;z(t,e.target),t.params.cssMode||"auto"!==t.params.slidesPerView&&!t.params.autoHeight||t.update()}function j(){const e=this;e.documentTouchHandlerProceeded||(e.documentTouchHandlerProceeded=!0,e.params.touchReleaseOnEdges&&(e.el.style.touchAction="auto"))}const W=(e,t)=>{const s=a(),{params:i,el:r,wrapperEl:n,device:l}=e,o=!!i.nested,d="on"===t?"addEventListener":"removeEventListener",c=t;s[d]("touchstart",e.onDocumentTouchStart,{passive:!1,capture:o}),r[d]("touchstart",e.onTouchStart,{passive:!1}),r[d]("pointerdown",e.onTouchStart,{passive:!1}),s[d]("touchmove",e.onTouchMove,{passive:!1,capture:o}),s[d]("pointermove",e.onTouchMove,{passive:!1,capture:o}),s[d]("touchend",e.onTouchEnd,{passive:!0}),s[d]("pointerup",e.onTouchEnd,{passive:!0}),s[d]("pointercancel",e.onTouchEnd,{passive:!0}),s[d]("touchcancel",e.onTouchEnd,{passive:!0}),s[d]("pointerout",e.onTouchEnd,{passive:!0}),s[d]("pointerleave",e.onTouchEnd,{passive:!0}),s[d]("contextmenu",e.onTouchEnd,{passive:!0}),(i.preventClicks||i.preventClicksPropagation)&&r[d]("click",e.onClick,!0),i.cssMode&&n[d]("scroll",e.onScroll),i.updateOnWindowResize?e[c](l.ios||l.android?"resize orientationchange observerUpdate":"resize observerUpdate",q,!0):e[c]("observerUpdate",q,!0),r[d]("load",e.onLoad,{capture:!0})};const U=(e,t)=>e.grid&&t.grid&&t.grid.rows>1;var K={init:!0,direction:"horizontal",oneWayMovement:!1,touchEventsTarget:"wrapper",initialSlide:0,speed:300,cssMode:!1,updateOnWindowResize:!0,resizeObserver:!0,nested:!1,createElements:!1,eventsPrefix:"swiper",enabled:!0,focusableElements:"input, select, option, textarea, button, video, label",width:null,height:null,preventInteractionOnTransition:!1,userAgent:null,url:null,edgeSwipeDetection:!1,edgeSwipeThreshold:20,autoHeight:!1,setWrapperSize:!1,virtualTranslate:!1,effect:"slide",breakpoints:void 0,breakpointsBase:"window",spaceBetween:0,slidesPerView:1,slidesPerGroup:1,slidesPerGroupSkip:0,slidesPerGroupAuto:!1,centeredSlides:!1,centeredSlidesBounds:!1,slidesOffsetBefore:0,slidesOffsetAfter:0,normalizeSlideIndex:!0,centerInsufficientSlides:!1,watchOverflow:!0,roundLengths:!1,touchRatio:1,touchAngle:45,simulateTouch:!0,shortSwipes:!0,longSwipes:!0,longSwipesRatio:.5,longSwipesMs:300,followFinger:!0,allowTouchMove:!0,threshold:5,touchMoveStopPropagation:!1,touchStartPreventDefault:!0,touchStartForcePreventDefault:!1,touchReleaseOnEdges:!1,uniqueNavElements:!0,resistance:!0,resistanceRatio:.85,watchSlidesProgress:!1,grabCursor:!1,preventClicks:!0,preventClicksPropagation:!0,slideToClickedSlide:!1,loop:!1,loopAddBlankSlides:!0,loopAdditionalSlides:0,loopPreventsSliding:!0,rewind:!1,allowSlidePrev:!0,allowSlideNext:!0,swipeHandler:null,noSwiping:!0,noSwipingClass:"swiper-no-swiping",noSwipingSelector:null,passiveListeners:!0,maxBackfaceHiddenSlides:10,containerModifierClass:"swiper-",slideClass:"swiper-slide",slideBlankClass:"swiper-slide-blank",slideActiveClass:"swiper-slide-active",slideVisibleClass:"swiper-slide-visible",slideFullyVisibleClass:"swiper-slide-fully-visible",slideNextClass:"swiper-slide-next",slidePrevClass:"swiper-slide-prev",wrapperClass:"swiper-wrapper",lazyPreloaderClass:"swiper-lazy-preloader",lazyPreloadPrevNext:0,runCallbacksOnInit:!0,_emitClasses:!1};function Z(e,t){return function(s){void 0===s&&(s={});const a=Object.keys(s)[0],i=s[a];"object"==typeof i&&null!==i?(!0===e[a]&&(e[a]={enabled:!0}),"navigation"===a&&e[a]&&e[a].enabled&&!e[a].prevEl&&!e[a].nextEl&&(e[a].auto=!0),["pagination","scrollbar"].indexOf(a)>=0&&e[a]&&e[a].enabled&&!e[a].el&&(e[a].auto=!0),a in e&&"enabled"in i?("object"!=typeof e[a]||"enabled"in e[a]||(e[a].enabled=!0),e[a]||(e[a]={enabled:!1}),p(t,s)):p(t,s)):p(t,s)}}const Q={eventsEmitter:I,update:O,translate:D,transition:{setTransition:function(e,t){const s=this;s.params.cssMode||(s.wrapperEl.style.transitionDuration=`${e}ms`,s.wrapperEl.style.transitionDelay=0===e?"0ms":""),s.emit("setTransition",e,t)},transitionStart:function(e,t){void 0===e&&(e=!0);const s=this,{params:a}=s;a.cssMode||(a.autoHeight&&s.updateAutoHeight(),G({swiper:s,runCallbacks:e,direction:t,step:"Start"}))},transitionEnd:function(e,t){void 0===e&&(e=!0);const s=this,{params:a}=s;s.animating=!1,a.cssMode||(s.setTransition(0),G({swiper:s,runCallbacks:e,direction:t,step:"End"}))}},slide:X,loop:H,grabCursor:{setGrabCursor:function(e){const t=this;if(!t.params.simulateTouch||t.params.watchOverflow&&t.isLocked||t.params.cssMode)return;const s="container"===t.params.touchEventsTarget?t.el:t.wrapperEl;t.isElement&&(t.__preventObserver__=!0),s.style.cursor="move",s.style.cursor=e?"grabbing":"grab",t.isElement&&requestAnimationFrame((()=>{t.__preventObserver__=!1}))},unsetGrabCursor:function(){const e=this;e.params.watchOverflow&&e.isLocked||e.params.cssMode||(e.isElement&&(e.__preventObserver__=!0),e["container"===e.params.touchEventsTarget?"el":"wrapperEl"].style.cursor="",e.isElement&&requestAnimationFrame((()=>{e.__preventObserver__=!1})))}},events:{attachEvents:function(){const e=this,{params:t}=e;e.onTouchStart=Y.bind(e),e.onTouchMove=B.bind(e),e.onTouchEnd=R.bind(e),e.onDocumentTouchStart=j.bind(e),t.cssMode&&(e.onScroll=_.bind(e)),e.onClick=V.bind(e),e.onLoad=F.bind(e),W(e,"on")},detachEvents:function(){W(this,"off")}},breakpoints:{setBreakpoint:function(){const e=this,{realIndex:t,initialized:s,params:a,el:i}=e,r=a.breakpoints;if(!r||r&&0===Object.keys(r).length)return;const n=e.getBreakpoint(r,e.params.breakpointsBase,e.el);if(!n||e.currentBreakpoint===n)return;const l=(n in r?r[n]:void 0)||e.originalParams,o=U(e,a),d=U(e,l),c=a.enabled;o&&!d?(i.classList.remove(`${a.containerModifierClass}grid`,`${a.containerModifierClass}grid-column`),e.emitContainerClasses()):!o&&d&&(i.classList.add(`${a.containerModifierClass}grid`),(l.grid.fill&&"column"===l.grid.fill||!l.grid.fill&&"column"===a.grid.fill)&&i.classList.add(`${a.containerModifierClass}grid-column`),e.emitContainerClasses()),["navigation","pagination","scrollbar"].forEach((t=>{if(void 0===l[t])return;const s=a[t]&&a[t].enabled,i=l[t]&&l[t].enabled;s&&!i&&e[t].disable(),!s&&i&&e[t].enable()}));const u=l.direction&&l.direction!==a.direction,m=a.loop&&(l.slidesPerView!==a.slidesPerView||u),h=a.loop;u&&s&&e.changeDirection(),p(e.params,l);const f=e.params.enabled,g=e.params.loop;Object.assign(e,{allowTouchMove:e.params.allowTouchMove,allowSlideNext:e.params.allowSlideNext,allowSlidePrev:e.params.allowSlidePrev}),c&&!f?e.disable():!c&&f&&e.enable(),e.currentBreakpoint=n,e.emit("_beforeBreakpoint",l),s&&(m?(e.loopDestroy(),e.loopCreate(t),e.updateSlides()):!h&&g?(e.loopCreate(t),e.updateSlides()):h&&!g&&e.loopDestroy()),e.emit("breakpoint",l)},getBreakpoint:function(e,t,s){if(void 0===t&&(t="window"),!e||"container"===t&&!s)return;let a=!1;const i=r(),n="window"===t?i.innerHeight:s.clientHeight,l=Object.keys(e).map((e=>{if("string"==typeof e&&0===e.indexOf("@")){const t=parseFloat(e.substr(1));return{value:n*t,point:e}}return{value:e,point:e}}));l.sort(((e,t)=>parseInt(e.value,10)-parseInt(t.value,10)));for(let e=0;es}else e.isLocked=1===e.snapGrid.length;!0===s.allowSlideNext&&(e.allowSlideNext=!e.isLocked),!0===s.allowSlidePrev&&(e.allowSlidePrev=!e.isLocked),t&&t!==e.isLocked&&(e.isEnd=!1),t!==e.isLocked&&e.emit(e.isLocked?"lock":"unlock")}},classes:{addClasses:function(){const e=this,{classNames:t,params:s,rtl:a,el:i,device:r}=e,n=function(e,t){const s=[];return e.forEach((e=>{"object"==typeof e?Object.keys(e).forEach((a=>{e[a]&&s.push(t+a)})):"string"==typeof e&&s.push(t+e)})),s}(["initialized",s.direction,{"free-mode":e.params.freeMode&&s.freeMode.enabled},{autoheight:s.autoHeight},{rtl:a},{grid:s.grid&&s.grid.rows>1},{"grid-column":s.grid&&s.grid.rows>1&&"column"===s.grid.fill},{android:r.android},{ios:r.ios},{"css-mode":s.cssMode},{centered:s.cssMode&&s.centeredSlides},{"watch-progress":s.watchSlidesProgress}],s.containerModifierClass);t.push(...n),i.classList.add(...t),e.emitContainerClasses()},removeClasses:function(){const{el:e,classNames:t}=this;e.classList.remove(...t),this.emitContainerClasses()}}},J={};class ee{constructor(){let e,t;for(var s=arguments.length,i=new Array(s),r=0;r1){const e=[];return n.querySelectorAll(t.el).forEach((s=>{const a=p({},t,{el:s});e.push(new ee(a))})),e}const l=this;l.__swiper__=!0,l.support=P(),l.device=L({userAgent:t.userAgent}),l.browser=A(),l.eventsListeners={},l.eventsAnyListeners=[],l.modules=[...l.__modules__],t.modules&&Array.isArray(t.modules)&&l.modules.push(...t.modules);const o={};l.modules.forEach((e=>{e({params:t,swiper:l,extendParams:Z(t,o),on:l.on.bind(l),once:l.once.bind(l),off:l.off.bind(l),emit:l.emit.bind(l)})}));const d=p({},K,o);return l.params=p({},d,J,t),l.originalParams=p({},l.params),l.passedParams=p({},t),l.params&&l.params.on&&Object.keys(l.params.on).forEach((e=>{l.on(e,l.params.on[e])})),l.params&&l.params.onAny&&l.onAny(l.params.onAny),Object.assign(l,{enabled:l.params.enabled,el:e,classNames:[],slides:[],slidesGrid:[],snapGrid:[],slidesSizesGrid:[],isHorizontal:()=>"horizontal"===l.params.direction,isVertical:()=>"vertical"===l.params.direction,activeIndex:0,realIndex:0,isBeginning:!0,isEnd:!1,translate:0,previousTranslate:0,progress:0,velocity:0,animating:!1,cssOverflowAdjustment(){return Math.trunc(this.translate/2**23)*2**23},allowSlideNext:l.params.allowSlideNext,allowSlidePrev:l.params.allowSlidePrev,touchEventsData:{isTouched:void 0,isMoved:void 0,allowTouchCallbacks:void 0,touchStartTime:void 0,isScrolling:void 0,currentTranslate:void 0,startTranslate:void 0,allowThresholdMove:void 0,focusableElements:l.params.focusableElements,lastClickTime:0,clickTimeout:void 0,velocities:[],allowMomentumBounce:void 0,startMoving:void 0,pointerId:null,touchId:null},allowClick:!0,allowTouchMove:l.params.allowTouchMove,touches:{startX:0,startY:0,currentX:0,currentY:0,diff:0},imagesToLoad:[],imagesLoaded:0}),l.emit("_swiper"),l.params.init&&l.init(),l}getDirectionLabel(e){return this.isHorizontal()?e:{width:"height","margin-top":"margin-left","margin-bottom ":"margin-right","margin-left":"margin-top","margin-right":"margin-bottom","padding-left":"padding-top","padding-right":"padding-bottom",marginRight:"marginBottom"}[e]}getSlideIndex(e){const{slidesEl:t,params:s}=this,a=y(f(t,`.${s.slideClass}, swiper-slide`)[0]);return y(e)-a}getSlideIndexByData(e){return this.getSlideIndex(this.slides.filter((t=>1*t.getAttribute("data-swiper-slide-index")===e))[0])}recalcSlides(){const{slidesEl:e,params:t}=this;this.slides=f(e,`.${t.slideClass}, swiper-slide`)}enable(){const e=this;e.enabled||(e.enabled=!0,e.params.grabCursor&&e.setGrabCursor(),e.emit("enable"))}disable(){const e=this;e.enabled&&(e.enabled=!1,e.params.grabCursor&&e.unsetGrabCursor(),e.emit("disable"))}setProgress(e,t){const s=this;e=Math.min(Math.max(e,0),1);const a=s.minTranslate(),i=(s.maxTranslate()-a)*e+a;s.translateTo(i,void 0===t?0:t),s.updateActiveIndex(),s.updateSlidesClasses()}emitContainerClasses(){const e=this;if(!e.params._emitClasses||!e.el)return;const t=e.el.className.split(" ").filter((t=>0===t.indexOf("swiper")||0===t.indexOf(e.params.containerModifierClass)));e.emit("_containerClasses",t.join(" "))}getSlideClasses(e){const t=this;return t.destroyed?"":e.className.split(" ").filter((e=>0===e.indexOf("swiper-slide")||0===e.indexOf(t.params.slideClass))).join(" ")}emitSlidesClasses(){const e=this;if(!e.params._emitClasses||!e.el)return;const t=[];e.slides.forEach((s=>{const a=e.getSlideClasses(s);t.push({slideEl:s,classNames:a}),e.emit("_slideClass",s,a)})),e.emit("_slideClasses",t)}slidesPerViewDynamic(e,t){void 0===e&&(e="current"),void 0===t&&(t=!1);const{params:s,slides:a,slidesGrid:i,slidesSizesGrid:r,size:n,activeIndex:l}=this;let o=1;if("number"==typeof s.slidesPerView)return s.slidesPerView;if(s.centeredSlides){let e,t=a[l]?a[l].swiperSlideSize:0;for(let s=l+1;sn&&(e=!0));for(let s=l-1;s>=0;s-=1)a[s]&&!e&&(t+=a[s].swiperSlideSize,o+=1,t>n&&(e=!0))}else if("current"===e)for(let e=l+1;e=0;e-=1){i[l]-i[e]{t.complete&&z(e,t)})),e.updateSize(),e.updateSlides(),e.updateProgress(),e.updateSlidesClasses(),s.freeMode&&s.freeMode.enabled&&!s.cssMode)a(),s.autoHeight&&e.updateAutoHeight();else{if(("auto"===s.slidesPerView||s.slidesPerView>1)&&e.isEnd&&!s.centeredSlides){const t=e.virtual&&s.virtual.enabled?e.virtual.slides:e.slides;i=e.slideTo(t.length-1,0,!1,!0)}else i=e.slideTo(e.activeIndex,0,!1,!0);i||a()}s.watchOverflow&&t!==e.snapGrid&&e.checkOverflow(),e.emit("update")}changeDirection(e,t){void 0===t&&(t=!0);const s=this,a=s.params.direction;return e||(e="horizontal"===a?"vertical":"horizontal"),e===a||"horizontal"!==e&&"vertical"!==e||(s.el.classList.remove(`${s.params.containerModifierClass}${a}`),s.el.classList.add(`${s.params.containerModifierClass}${e}`),s.emitContainerClasses(),s.params.direction=e,s.slides.forEach((t=>{"vertical"===e?t.style.width="":t.style.height=""})),s.emit("changeDirection"),t&&s.update()),s}changeLanguageDirection(e){const t=this;t.rtl&&"rtl"===e||!t.rtl&&"ltr"===e||(t.rtl="rtl"===e,t.rtlTranslate="horizontal"===t.params.direction&&t.rtl,t.rtl?(t.el.classList.add(`${t.params.containerModifierClass}rtl`),t.el.dir="rtl"):(t.el.classList.remove(`${t.params.containerModifierClass}rtl`),t.el.dir="ltr"),t.update())}mount(e){const t=this;if(t.mounted)return!0;let s=e||t.params.el;if("string"==typeof s&&(s=document.querySelector(s)),!s)return!1;s.swiper=t,s.parentNode&&s.parentNode.host&&"SWIPER-CONTAINER"===s.parentNode.host.nodeName&&(t.isElement=!0);const a=()=>`.${(t.params.wrapperClass||"").trim().split(" ").join(".")}`;let i=(()=>{if(s&&s.shadowRoot&&s.shadowRoot.querySelector){return s.shadowRoot.querySelector(a())}return f(s,a())[0]})();return!i&&t.params.createElements&&(i=v("div",t.params.wrapperClass),s.append(i),f(s,`.${t.params.slideClass}`).forEach((e=>{i.append(e)}))),Object.assign(t,{el:s,wrapperEl:i,slidesEl:t.isElement&&!s.parentNode.host.slideSlots?s.parentNode.host:i,hostEl:t.isElement?s.parentNode.host:s,mounted:!0,rtl:"rtl"===s.dir.toLowerCase()||"rtl"===b(s,"direction"),rtlTranslate:"horizontal"===t.params.direction&&("rtl"===s.dir.toLowerCase()||"rtl"===b(s,"direction")),wrongRTL:"-webkit-box"===b(i,"display")}),!0}init(e){const t=this;if(t.initialized)return t;if(!1===t.mount(e))return t;t.emit("beforeInit"),t.params.breakpoints&&t.setBreakpoint(),t.addClasses(),t.updateSize(),t.updateSlides(),t.params.watchOverflow&&t.checkOverflow(),t.params.grabCursor&&t.enabled&&t.setGrabCursor(),t.params.loop&&t.virtual&&t.params.virtual.enabled?t.slideTo(t.params.initialSlide+t.virtual.slidesBefore,0,t.params.runCallbacksOnInit,!1,!0):t.slideTo(t.params.initialSlide,0,t.params.runCallbacksOnInit,!1,!0),t.params.loop&&t.loopCreate(),t.attachEvents();const s=[...t.el.querySelectorAll('[loading="lazy"]')];return t.isElement&&s.push(...t.hostEl.querySelectorAll('[loading="lazy"]')),s.forEach((e=>{e.complete?z(t,e):e.addEventListener("load",(e=>{z(t,e.target)}))})),k(t),t.initialized=!0,k(t),t.emit("init"),t.emit("afterInit"),t}destroy(e,t){void 0===e&&(e=!0),void 0===t&&(t=!0);const s=this,{params:a,el:i,wrapperEl:r,slides:n}=s;return void 0===s.params||s.destroyed||(s.emit("beforeDestroy"),s.initialized=!1,s.detachEvents(),a.loop&&s.loopDestroy(),t&&(s.removeClasses(),i.removeAttribute("style"),r.removeAttribute("style"),n&&n.length&&n.forEach((e=>{e.classList.remove(a.slideVisibleClass,a.slideFullyVisibleClass,a.slideActiveClass,a.slideNextClass,a.slidePrevClass),e.removeAttribute("style"),e.removeAttribute("data-swiper-slide-index")}))),s.emit("destroy"),Object.keys(s.eventsListeners).forEach((e=>{s.off(e)})),!1!==e&&(s.el.swiper=null,function(e){const t=e;Object.keys(t).forEach((e=>{try{t[e]=null}catch(e){}try{delete t[e]}catch(e){}}))}(s)),s.destroyed=!0),null}static extendDefaults(e){p(J,e)}static get extendedDefaults(){return J}static get defaults(){return K}static installModule(e){ee.prototype.__modules__||(ee.prototype.__modules__=[]);const t=ee.prototype.__modules__;"function"==typeof e&&t.indexOf(e)<0&&t.push(e)}static use(e){return Array.isArray(e)?(e.forEach((e=>ee.installModule(e))),ee):(ee.installModule(e),ee)}}function te(e,t,s,a){return e.params.createElements&&Object.keys(a).forEach((i=>{if(!s[i]&&!0===s.auto){let r=f(e.el,`.${a[i]}`)[0];r||(r=v("div",a[i]),r.className=a[i],e.el.append(r)),s[i]=r,t[i]=r}})),s}function se(e){return void 0===e&&(e=""),`.${e.trim().replace(/([\.:!+\/])/g,"\\$1").replace(/ /g,".")}`}function ae(e){const t=this,{params:s,slidesEl:a}=t;s.loop&&t.loopDestroy();const i=e=>{if("string"==typeof e){const t=document.createElement("div");t.innerHTML=e,a.append(t.children[0]),t.innerHTML=""}else a.append(e)};if("object"==typeof e&&"length"in e)for(let t=0;t{if("string"==typeof e){const t=document.createElement("div");t.innerHTML=e,i.prepend(t.children[0]),t.innerHTML=""}else i.prepend(e)};if("object"==typeof e&&"length"in e){for(let t=0;t=l)return void s.appendSlide(t);let o=n>e?n+1:n;const d=[];for(let t=l-1;t>=e;t-=1){const e=s.slides[t];e.remove(),d.unshift(e)}if("object"==typeof t&&"length"in t){for(let e=0;ee?n+t.length:n}else r.append(t);for(let e=0;e{if(s.params.effect!==t)return;s.classNames.push(`${s.params.containerModifierClass}${t}`),l&&l()&&s.classNames.push(`${s.params.containerModifierClass}3d`);const e=n?n():{};Object.assign(s.params,e),Object.assign(s.originalParams,e)})),a("setTranslate",(()=>{s.params.effect===t&&i()})),a("setTransition",((e,a)=>{s.params.effect===t&&r(a)})),a("transitionEnd",(()=>{if(s.params.effect===t&&o){if(!d||!d().slideShadows)return;s.slides.forEach((e=>{e.querySelectorAll(".swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left").forEach((e=>e.remove()))})),o()}})),a("virtualUpdate",(()=>{s.params.effect===t&&(s.slides.length||(c=!0),requestAnimationFrame((()=>{c&&s.slides&&s.slides.length&&(i(),c=!1)})))}))}function de(e,t){const s=h(t);return s!==t&&(s.style.backfaceVisibility="hidden",s.style["-webkit-backface-visibility"]="hidden"),s}function ce(e){let{swiper:t,duration:s,transformElements:a,allSlides:i}=e;const{activeIndex:r}=t;if(t.params.virtualTranslate&&0!==s){let e,s=!1;e=i?a:a.filter((e=>{const s=e.classList.contains("swiper-slide-transform")?(e=>{if(!e.parentElement)return t.slides.filter((t=>t.shadowRoot&&t.shadowRoot===e.parentNode))[0];return e.parentElement})(e):e;return t.getSlideIndex(s)===r})),e.forEach((e=>{x(e,(()=>{if(s)return;if(!t||t.destroyed)return;s=!0,t.animating=!1;const e=new window.CustomEvent("transitionend",{bubbles:!0,cancelable:!0});t.wrapperEl.dispatchEvent(e)}))}))}}function pe(e,t,s){const a=`swiper-slide-shadow${s?`-${s}`:""}${e?` swiper-slide-shadow-${e}`:""}`,i=h(t);let r=i.querySelector(`.${a.split(" ").join(".")}`);return r||(r=v("div",a.split(" ")),i.append(r)),r}Object.keys(Q).forEach((e=>{Object.keys(Q[e]).forEach((t=>{ee.prototype[t]=Q[e][t]}))})),ee.use([function(e){let{swiper:t,on:s,emit:a}=e;const i=r();let n=null,l=null;const o=()=>{t&&!t.destroyed&&t.initialized&&(a("beforeResize"),a("resize"))},d=()=>{t&&!t.destroyed&&t.initialized&&a("orientationchange")};s("init",(()=>{t.params.resizeObserver&&void 0!==i.ResizeObserver?t&&!t.destroyed&&t.initialized&&(n=new ResizeObserver((e=>{l=i.requestAnimationFrame((()=>{const{width:s,height:a}=t;let i=s,r=a;e.forEach((e=>{let{contentBoxSize:s,contentRect:a,target:n}=e;n&&n!==t.el||(i=a?a.width:(s[0]||s).inlineSize,r=a?a.height:(s[0]||s).blockSize)})),i===s&&r===a||o()}))})),n.observe(t.el)):(i.addEventListener("resize",o),i.addEventListener("orientationchange",d))})),s("destroy",(()=>{l&&i.cancelAnimationFrame(l),n&&n.unobserve&&t.el&&(n.unobserve(t.el),n=null),i.removeEventListener("resize",o),i.removeEventListener("orientationchange",d)}))},function(e){let{swiper:t,extendParams:s,on:a,emit:i}=e;const n=[],l=r(),o=function(e,s){void 0===s&&(s={});const a=new(l.MutationObserver||l.WebkitMutationObserver)((e=>{if(t.__preventObserver__)return;if(1===e.length)return void i("observerUpdate",e[0]);const s=function(){i("observerUpdate",e[0])};l.requestAnimationFrame?l.requestAnimationFrame(s):l.setTimeout(s,0)}));a.observe(e,{attributes:void 0===s.attributes||s.attributes,childList:void 0===s.childList||s.childList,characterData:void 0===s.characterData||s.characterData}),n.push(a)};s({observer:!1,observeParents:!1,observeSlideChildren:!1}),a("init",(()=>{if(t.params.observer){if(t.params.observeParents){const e=E(t.hostEl);for(let t=0;t{n.forEach((e=>{e.disconnect()})),n.splice(0,n.length)}))}]);const ue=[function(e){let t,{swiper:s,extendParams:i,on:r,emit:n}=e;i({virtual:{enabled:!1,slides:[],cache:!0,renderSlide:null,renderExternal:null,renderExternalUpdate:!0,addSlidesBefore:0,addSlidesAfter:0}});const l=a();s.virtual={cache:{},from:void 0,to:void 0,slides:[],offset:0,slidesGrid:[]};const o=l.createElement("div");function d(e,t){const a=s.params.virtual;if(a.cache&&s.virtual.cache[t])return s.virtual.cache[t];let i;return a.renderSlide?(i=a.renderSlide.call(s,e,t),"string"==typeof i&&(o.innerHTML=i,i=o.children[0])):i=s.isElement?v("swiper-slide"):v("div",s.params.slideClass),i.setAttribute("data-swiper-slide-index",t),a.renderSlide||(i.innerHTML=e),a.cache&&(s.virtual.cache[t]=i),i}function c(e){const{slidesPerView:t,slidesPerGroup:a,centeredSlides:i,loop:r}=s.params,{addSlidesBefore:l,addSlidesAfter:o}=s.params.virtual,{from:c,to:p,slides:u,slidesGrid:m,offset:h}=s.virtual;s.params.cssMode||s.updateActiveIndex();const g=s.activeIndex||0;let v,w,b;v=s.rtlTranslate?"right":s.isHorizontal()?"left":"top",i?(w=Math.floor(t/2)+a+o,b=Math.floor(t/2)+a+l):(w=t+(a-1)+o,b=(r?t:a)+l);let y=g-b,E=g+w;r||(y=Math.max(y,0),E=Math.min(E,u.length-1));let x=(s.slidesGrid[y]||0)-(s.slidesGrid[0]||0);function S(){s.updateSlides(),s.updateProgress(),s.updateSlidesClasses(),n("virtualUpdate")}if(r&&g>=b?(y-=b,i||(x+=s.slidesGrid[0])):r&&g{e.style[v]=x-Math.abs(s.cssOverflowAdjustment())+"px"})),s.updateProgress(),void n("virtualUpdate");if(s.params.virtual.renderExternal)return s.params.virtual.renderExternal.call(s,{offset:x,from:y,to:E,slides:function(){const e=[];for(let t=y;t<=E;t+=1)e.push(u[t]);return e}()}),void(s.params.virtual.renderExternalUpdate?S():n("virtualUpdate"));const T=[],M=[],C=e=>{let t=e;return e<0?t=u.length+e:t>=u.length&&(t-=u.length),t};if(e)s.slides.filter((e=>e.matches(`.${s.params.slideClass}, swiper-slide`))).forEach((e=>{e.remove()}));else for(let e=c;e<=p;e+=1)if(eE){const t=C(e);s.slides.filter((e=>e.matches(`.${s.params.slideClass}[data-swiper-slide-index="${t}"], swiper-slide[data-swiper-slide-index="${t}"]`))).forEach((e=>{e.remove()}))}const P=r?-u.length:0,L=r?2*u.length:u.length;for(let t=P;t=y&&t<=E){const s=C(t);void 0===p||e?M.push(s):(t>p&&M.push(s),t{s.slidesEl.append(d(u[e],e))})),r)for(let e=T.length-1;e>=0;e-=1){const t=T[e];s.slidesEl.prepend(d(u[t],t))}else T.sort(((e,t)=>t-e)),T.forEach((e=>{s.slidesEl.prepend(d(u[e],e))}));f(s.slidesEl,".swiper-slide, swiper-slide").forEach((e=>{e.style[v]=x-Math.abs(s.cssOverflowAdjustment())+"px"})),S()}r("beforeInit",(()=>{if(!s.params.virtual.enabled)return;let e;if(void 0===s.passedParams.virtual.slides){const t=[...s.slidesEl.children].filter((e=>e.matches(`.${s.params.slideClass}, swiper-slide`)));t&&t.length&&(s.virtual.slides=[...t],e=!0,t.forEach(((e,t)=>{e.setAttribute("data-swiper-slide-index",t),s.virtual.cache[t]=e,e.remove()})))}e||(s.virtual.slides=s.params.virtual.slides),s.classNames.push(`${s.params.containerModifierClass}virtual`),s.params.watchSlidesProgress=!0,s.originalParams.watchSlidesProgress=!0,c()})),r("setTranslate",(()=>{s.params.virtual.enabled&&(s.params.cssMode&&!s._immediateVirtual?(clearTimeout(t),t=setTimeout((()=>{c()}),100)):c())})),r("init update resize",(()=>{s.params.virtual.enabled&&s.params.cssMode&&u(s.wrapperEl,"--swiper-virtual-size",`${s.virtualSize}px`)})),Object.assign(s.virtual,{appendSlide:function(e){if("object"==typeof e&&"length"in e)for(let t=0;t{const a=e[s],r=a.getAttribute("data-swiper-slide-index");r&&a.setAttribute("data-swiper-slide-index",parseInt(r,10)+i),t[parseInt(s,10)+i]=a})),s.virtual.cache=t}c(!0),s.slideTo(a,0)},removeSlide:function(e){if(null==e)return;let t=s.activeIndex;if(Array.isArray(e))for(let a=e.length-1;a>=0;a-=1)s.params.virtual.cache&&(delete s.virtual.cache[e[a]],Object.keys(s.virtual.cache).forEach((t=>{t>e&&(s.virtual.cache[t-1]=s.virtual.cache[t],s.virtual.cache[t-1].setAttribute("data-swiper-slide-index",t-1),delete s.virtual.cache[t])}))),s.virtual.slides.splice(e[a],1),e[a]{t>e&&(s.virtual.cache[t-1]=s.virtual.cache[t],s.virtual.cache[t-1].setAttribute("data-swiper-slide-index",t-1),delete s.virtual.cache[t])}))),s.virtual.slides.splice(e,1),e0&&0===E(t.el,`.${t.params.slideActiveClass}`).length)return;const a=t.el,i=a.clientWidth,r=a.clientHeight,n=o.innerWidth,l=o.innerHeight,d=w(a);s&&(d.left-=a.scrollLeft);const c=[[d.left,d.top],[d.left+i,d.top],[d.left,d.top+r],[d.left+i,d.top+r]];for(let t=0;t=0&&s[0]<=n&&s[1]>=0&&s[1]<=l){if(0===s[0]&&0===s[1])continue;e=!0}}if(!e)return}t.isHorizontal()?((d||c||p||u)&&(a.preventDefault?a.preventDefault():a.returnValue=!1),((c||u)&&!s||(d||p)&&s)&&t.slideNext(),((d||p)&&!s||(c||u)&&s)&&t.slidePrev()):((d||c||m||h)&&(a.preventDefault?a.preventDefault():a.returnValue=!1),(c||h)&&t.slideNext(),(d||m)&&t.slidePrev()),n("keyPress",i)}}function c(){t.keyboard.enabled||(l.addEventListener("keydown",d),t.keyboard.enabled=!0)}function p(){t.keyboard.enabled&&(l.removeEventListener("keydown",d),t.keyboard.enabled=!1)}t.keyboard={enabled:!1},s({keyboard:{enabled:!1,onlyInViewport:!0,pageUpDown:!0}}),i("init",(()=>{t.params.keyboard.enabled&&c()})),i("destroy",(()=>{t.keyboard.enabled&&p()})),Object.assign(t.keyboard,{enable:c,disable:p})},function(e){let{swiper:t,extendParams:s,on:a,emit:i}=e;const n=r();let d;s({mousewheel:{enabled:!1,releaseOnEdges:!1,invert:!1,forceToAxis:!1,sensitivity:1,eventsTarget:"container",thresholdDelta:null,thresholdTime:null,noMousewheelClass:"swiper-no-mousewheel"}}),t.mousewheel={enabled:!1};let c,p=o();const u=[];function m(){t.enabled&&(t.mouseEntered=!0)}function h(){t.enabled&&(t.mouseEntered=!1)}function f(e){return!(t.params.mousewheel.thresholdDelta&&e.delta=6&&o()-p<60||(e.direction<0?t.isEnd&&!t.params.loop||t.animating||(t.slideNext(),i("scroll",e.raw)):t.isBeginning&&!t.params.loop||t.animating||(t.slidePrev(),i("scroll",e.raw)),p=(new n.Date).getTime(),!1)))}function g(e){let s=e,a=!0;if(!t.enabled)return;if(e.target.closest(`.${t.params.mousewheel.noMousewheelClass}`))return;const r=t.params.mousewheel;t.params.cssMode&&s.preventDefault();let n=t.el;"container"!==t.params.mousewheel.eventsTarget&&(n=document.querySelector(t.params.mousewheel.eventsTarget));const p=n&&n.contains(s.target);if(!t.mouseEntered&&!p&&!r.releaseOnEdges)return!0;s.originalEvent&&(s=s.originalEvent);let m=0;const h=t.rtlTranslate?-1:1,g=function(e){let t=0,s=0,a=0,i=0;return"detail"in e&&(s=e.detail),"wheelDelta"in e&&(s=-e.wheelDelta/120),"wheelDeltaY"in e&&(s=-e.wheelDeltaY/120),"wheelDeltaX"in e&&(t=-e.wheelDeltaX/120),"axis"in e&&e.axis===e.HORIZONTAL_AXIS&&(t=s,s=0),a=10*t,i=10*s,"deltaY"in e&&(i=e.deltaY),"deltaX"in e&&(a=e.deltaX),e.shiftKey&&!a&&(a=i,i=0),(a||i)&&e.deltaMode&&(1===e.deltaMode?(a*=40,i*=40):(a*=800,i*=800)),a&&!t&&(t=a<1?-1:1),i&&!s&&(s=i<1?-1:1),{spinX:t,spinY:s,pixelX:a,pixelY:i}}(s);if(r.forceToAxis)if(t.isHorizontal()){if(!(Math.abs(g.pixelX)>Math.abs(g.pixelY)))return!0;m=-g.pixelX*h}else{if(!(Math.abs(g.pixelY)>Math.abs(g.pixelX)))return!0;m=-g.pixelY}else m=Math.abs(g.pixelX)>Math.abs(g.pixelY)?-g.pixelX*h:-g.pixelY;if(0===m)return!0;r.invert&&(m=-m);let v=t.getTranslate()+m*r.sensitivity;if(v>=t.minTranslate()&&(v=t.minTranslate()),v<=t.maxTranslate()&&(v=t.maxTranslate()),a=!!t.params.loop||!(v===t.minTranslate()||v===t.maxTranslate()),a&&t.params.nested&&s.stopPropagation(),t.params.freeMode&&t.params.freeMode.enabled){const e={time:o(),delta:Math.abs(m),direction:Math.sign(m)},a=c&&e.time=t.minTranslate()&&(n=t.minTranslate()),n<=t.maxTranslate()&&(n=t.maxTranslate()),t.setTransition(0),t.setTranslate(n),t.updateProgress(),t.updateActiveIndex(),t.updateSlidesClasses(),(!o&&t.isBeginning||!p&&t.isEnd)&&t.updateSlidesClasses(),t.params.loop&&t.loopFix({direction:e.direction<0?"next":"prev",byMousewheel:!0}),t.params.freeMode.sticky){clearTimeout(d),d=void 0,u.length>=15&&u.shift();const s=u.length?u[u.length-1]:void 0,a=u[0];if(u.push(e),s&&(e.delta>s.delta||e.direction!==s.direction))u.splice(0);else if(u.length>=15&&e.time-a.time<500&&a.delta-e.delta>=1&&e.delta<=6){const s=m>0?.8:.2;c=e,u.splice(0),d=l((()=>{t.slideToClosest(t.params.speed,!0,void 0,s)}),0)}d||(d=l((()=>{c=e,u.splice(0),t.slideToClosest(t.params.speed,!0,void 0,.5)}),500))}if(a||i("scroll",s),t.params.autoplay&&t.params.autoplayDisableOnInteraction&&t.autoplay.stop(),r.releaseOnEdges&&(n===t.minTranslate()||n===t.maxTranslate()))return!0}}else{const s={time:o(),delta:Math.abs(m),direction:Math.sign(m),raw:e};u.length>=2&&u.shift();const a=u.length?u[u.length-1]:void 0;if(u.push(s),a?(s.direction!==a.direction||s.delta>a.delta||s.time>a.time+150)&&f(s):f(s),function(e){const s=t.params.mousewheel;if(e.direction<0){if(t.isEnd&&!t.params.loop&&s.releaseOnEdges)return!0}else if(t.isBeginning&&!t.params.loop&&s.releaseOnEdges)return!0;return!1}(s))return!0}return s.preventDefault?s.preventDefault():s.returnValue=!1,!1}function v(e){let s=t.el;"container"!==t.params.mousewheel.eventsTarget&&(s=document.querySelector(t.params.mousewheel.eventsTarget)),s[e]("mouseenter",m),s[e]("mouseleave",h),s[e]("wheel",g)}function w(){return t.params.cssMode?(t.wrapperEl.removeEventListener("wheel",g),!0):!t.mousewheel.enabled&&(v("addEventListener"),t.mousewheel.enabled=!0,!0)}function b(){return t.params.cssMode?(t.wrapperEl.addEventListener(event,g),!0):!!t.mousewheel.enabled&&(v("removeEventListener"),t.mousewheel.enabled=!1,!0)}a("init",(()=>{!t.params.mousewheel.enabled&&t.params.cssMode&&b(),t.params.mousewheel.enabled&&w()})),a("destroy",(()=>{t.params.cssMode&&w(),t.mousewheel.enabled&&b()})),Object.assign(t.mousewheel,{enable:w,disable:b})},function(e){let{swiper:t,extendParams:s,on:a,emit:i}=e;s({navigation:{nextEl:null,prevEl:null,hideOnClick:!1,disabledClass:"swiper-button-disabled",hiddenClass:"swiper-button-hidden",lockClass:"swiper-button-lock",navigationDisabledClass:"swiper-navigation-disabled"}}),t.navigation={nextEl:null,prevEl:null};const r=e=>(Array.isArray(e)?e:[e]).filter((e=>!!e));function n(e){let s;return e&&"string"==typeof e&&t.isElement&&(s=t.el.querySelector(e),s)?s:(e&&("string"==typeof e&&(s=[...document.querySelectorAll(e)]),t.params.uniqueNavElements&&"string"==typeof e&&s.length>1&&1===t.el.querySelectorAll(e).length&&(s=t.el.querySelector(e))),e&&!s?e:s)}function l(e,s){const a=t.params.navigation;(e=r(e)).forEach((e=>{e&&(e.classList[s?"add":"remove"](...a.disabledClass.split(" ")),"BUTTON"===e.tagName&&(e.disabled=s),t.params.watchOverflow&&t.enabled&&e.classList[t.isLocked?"add":"remove"](a.lockClass))}))}function o(){const{nextEl:e,prevEl:s}=t.navigation;if(t.params.loop)return l(s,!1),void l(e,!1);l(s,t.isBeginning&&!t.params.rewind),l(e,t.isEnd&&!t.params.rewind)}function d(e){e.preventDefault(),(!t.isBeginning||t.params.loop||t.params.rewind)&&(t.slidePrev(),i("navigationPrev"))}function c(e){e.preventDefault(),(!t.isEnd||t.params.loop||t.params.rewind)&&(t.slideNext(),i("navigationNext"))}function p(){const e=t.params.navigation;if(t.params.navigation=te(t,t.originalParams.navigation,t.params.navigation,{nextEl:"swiper-button-next",prevEl:"swiper-button-prev"}),!e.nextEl&&!e.prevEl)return;let s=n(e.nextEl),a=n(e.prevEl);Object.assign(t.navigation,{nextEl:s,prevEl:a}),s=r(s),a=r(a);const i=(s,a)=>{s&&s.addEventListener("click","next"===a?c:d),!t.enabled&&s&&s.classList.add(...e.lockClass.split(" "))};s.forEach((e=>i(e,"next"))),a.forEach((e=>i(e,"prev")))}function u(){let{nextEl:e,prevEl:s}=t.navigation;e=r(e),s=r(s);const a=(e,s)=>{e.removeEventListener("click","next"===s?c:d),e.classList.remove(...t.params.navigation.disabledClass.split(" "))};e.forEach((e=>a(e,"next"))),s.forEach((e=>a(e,"prev")))}a("init",(()=>{!1===t.params.navigation.enabled?m():(p(),o())})),a("toEdge fromEdge lock unlock",(()=>{o()})),a("destroy",(()=>{u()})),a("enable disable",(()=>{let{nextEl:e,prevEl:s}=t.navigation;e=r(e),s=r(s),t.enabled?o():[...e,...s].filter((e=>!!e)).forEach((e=>e.classList.add(t.params.navigation.lockClass)))})),a("click",((e,s)=>{let{nextEl:a,prevEl:n}=t.navigation;a=r(a),n=r(n);const l=s.target;if(t.params.navigation.hideOnClick&&!n.includes(l)&&!a.includes(l)){if(t.pagination&&t.params.pagination&&t.params.pagination.clickable&&(t.pagination.el===l||t.pagination.el.contains(l)))return;let e;a.length?e=a[0].classList.contains(t.params.navigation.hiddenClass):n.length&&(e=n[0].classList.contains(t.params.navigation.hiddenClass)),i(!0===e?"navigationShow":"navigationHide"),[...a,...n].filter((e=>!!e)).forEach((e=>e.classList.toggle(t.params.navigation.hiddenClass)))}}));const m=()=>{t.el.classList.add(...t.params.navigation.navigationDisabledClass.split(" ")),u()};Object.assign(t.navigation,{enable:()=>{t.el.classList.remove(...t.params.navigation.navigationDisabledClass.split(" ")),p(),o()},disable:m,update:o,init:p,destroy:u})},function(e){let{swiper:t,extendParams:s,on:a,emit:i}=e;const r="swiper-pagination";let n;s({pagination:{el:null,bulletElement:"span",clickable:!1,hideOnClick:!1,renderBullet:null,renderProgressbar:null,renderFraction:null,renderCustom:null,progressbarOpposite:!1,type:"bullets",dynamicBullets:!1,dynamicMainBullets:1,formatFractionCurrent:e=>e,formatFractionTotal:e=>e,bulletClass:`${r}-bullet`,bulletActiveClass:`${r}-bullet-active`,modifierClass:`${r}-`,currentClass:`${r}-current`,totalClass:`${r}-total`,hiddenClass:`${r}-hidden`,progressbarFillClass:`${r}-progressbar-fill`,progressbarOppositeClass:`${r}-progressbar-opposite`,clickableClass:`${r}-clickable`,lockClass:`${r}-lock`,horizontalClass:`${r}-horizontal`,verticalClass:`${r}-vertical`,paginationDisabledClass:`${r}-disabled`}}),t.pagination={el:null,bullets:[]};let l=0;const o=e=>(Array.isArray(e)?e:[e]).filter((e=>!!e));function d(){return!t.params.pagination.el||!t.pagination.el||Array.isArray(t.pagination.el)&&0===t.pagination.el.length}function c(e,s){const{bulletActiveClass:a}=t.params.pagination;e&&(e=e[("prev"===s?"previous":"next")+"ElementSibling"])&&(e.classList.add(`${a}-${s}`),(e=e[("prev"===s?"previous":"next")+"ElementSibling"])&&e.classList.add(`${a}-${s}-${s}`))}function p(e){const s=e.target.closest(se(t.params.pagination.bulletClass));if(!s)return;e.preventDefault();const a=y(s)*t.params.slidesPerGroup;if(t.params.loop){if(t.realIndex===a)return;t.slideToLoop(a)}else t.slideTo(a)}function u(){const e=t.rtl,s=t.params.pagination;if(d())return;let a,r,p=t.pagination.el;p=o(p);const u=t.virtual&&t.params.virtual.enabled?t.virtual.slides.length:t.slides.length,m=t.params.loop?Math.ceil(u/t.params.slidesPerGroup):t.snapGrid.length;if(t.params.loop?(r=t.previousRealIndex||0,a=t.params.slidesPerGroup>1?Math.floor(t.realIndex/t.params.slidesPerGroup):t.realIndex):void 0!==t.snapIndex?(a=t.snapIndex,r=t.previousSnapIndex):(r=t.previousIndex||0,a=t.activeIndex||0),"bullets"===s.type&&t.pagination.bullets&&t.pagination.bullets.length>0){const i=t.pagination.bullets;let o,d,u;if(s.dynamicBullets&&(n=S(i[0],t.isHorizontal()?"width":"height",!0),p.forEach((e=>{e.style[t.isHorizontal()?"width":"height"]=n*(s.dynamicMainBullets+4)+"px"})),s.dynamicMainBullets>1&&void 0!==r&&(l+=a-(r||0),l>s.dynamicMainBullets-1?l=s.dynamicMainBullets-1:l<0&&(l=0)),o=Math.max(a-l,0),d=o+(Math.min(i.length,s.dynamicMainBullets)-1),u=(d+o)/2),i.forEach((e=>{const t=[...["","-next","-next-next","-prev","-prev-prev","-main"].map((e=>`${s.bulletActiveClass}${e}`))].map((e=>"string"==typeof e&&e.includes(" ")?e.split(" "):e)).flat();e.classList.remove(...t)})),p.length>1)i.forEach((e=>{const i=y(e);i===a?e.classList.add(...s.bulletActiveClass.split(" ")):t.isElement&&e.setAttribute("part","bullet"),s.dynamicBullets&&(i>=o&&i<=d&&e.classList.add(...`${s.bulletActiveClass}-main`.split(" ")),i===o&&c(e,"prev"),i===d&&c(e,"next"))}));else{const e=i[a];if(e&&e.classList.add(...s.bulletActiveClass.split(" ")),t.isElement&&i.forEach(((e,t)=>{e.setAttribute("part",t===a?"bullet-active":"bullet")})),s.dynamicBullets){const e=i[o],t=i[d];for(let e=o;e<=d;e+=1)i[e]&&i[e].classList.add(...`${s.bulletActiveClass}-main`.split(" "));c(e,"prev"),c(t,"next")}}if(s.dynamicBullets){const a=Math.min(i.length,s.dynamicMainBullets+4),r=(n*a-n)/2-u*n,l=e?"right":"left";i.forEach((e=>{e.style[t.isHorizontal()?l:"top"]=`${r}px`}))}}p.forEach(((e,r)=>{if("fraction"===s.type&&(e.querySelectorAll(se(s.currentClass)).forEach((e=>{e.textContent=s.formatFractionCurrent(a+1)})),e.querySelectorAll(se(s.totalClass)).forEach((e=>{e.textContent=s.formatFractionTotal(m)}))),"progressbar"===s.type){let i;i=s.progressbarOpposite?t.isHorizontal()?"vertical":"horizontal":t.isHorizontal()?"horizontal":"vertical";const r=(a+1)/m;let n=1,l=1;"horizontal"===i?n=r:l=r,e.querySelectorAll(se(s.progressbarFillClass)).forEach((e=>{e.style.transform=`translate3d(0,0,0) scaleX(${n}) scaleY(${l})`,e.style.transitionDuration=`${t.params.speed}ms`}))}"custom"===s.type&&s.renderCustom?(e.innerHTML=s.renderCustom(t,a+1,m),0===r&&i("paginationRender",e)):(0===r&&i("paginationRender",e),i("paginationUpdate",e)),t.params.watchOverflow&&t.enabled&&e.classList[t.isLocked?"add":"remove"](s.lockClass)}))}function m(){const e=t.params.pagination;if(d())return;const s=t.virtual&&t.params.virtual.enabled?t.virtual.slides.length:t.grid&&t.params.grid.rows>1?t.slides.length/Math.ceil(t.params.grid.rows):t.slides.length;let a=t.pagination.el;a=o(a);let r="";if("bullets"===e.type){let a=t.params.loop?Math.ceil(s/t.params.slidesPerGroup):t.snapGrid.length;t.params.freeMode&&t.params.freeMode.enabled&&a>s&&(a=s);for(let s=0;s`}"fraction"===e.type&&(r=e.renderFraction?e.renderFraction.call(t,e.currentClass,e.totalClass):` / `),"progressbar"===e.type&&(r=e.renderProgressbar?e.renderProgressbar.call(t,e.progressbarFillClass):``),t.pagination.bullets=[],a.forEach((s=>{"custom"!==e.type&&(s.innerHTML=r||""),"bullets"===e.type&&t.pagination.bullets.push(...s.querySelectorAll(se(e.bulletClass)))})),"custom"!==e.type&&i("paginationRender",a[0])}function h(){t.params.pagination=te(t,t.originalParams.pagination,t.params.pagination,{el:"swiper-pagination"});const e=t.params.pagination;if(!e.el)return;let s;"string"==typeof e.el&&t.isElement&&(s=t.el.querySelector(e.el)),s||"string"!=typeof e.el||(s=[...document.querySelectorAll(e.el)]),s||(s=e.el),s&&0!==s.length&&(t.params.uniqueNavElements&&"string"==typeof e.el&&Array.isArray(s)&&s.length>1&&(s=[...t.el.querySelectorAll(e.el)],s.length>1&&(s=s.filter((e=>E(e,".swiper")[0]===t.el))[0])),Array.isArray(s)&&1===s.length&&(s=s[0]),Object.assign(t.pagination,{el:s}),s=o(s),s.forEach((s=>{"bullets"===e.type&&e.clickable&&s.classList.add(...(e.clickableClass||"").split(" ")),s.classList.add(e.modifierClass+e.type),s.classList.add(t.isHorizontal()?e.horizontalClass:e.verticalClass),"bullets"===e.type&&e.dynamicBullets&&(s.classList.add(`${e.modifierClass}${e.type}-dynamic`),l=0,e.dynamicMainBullets<1&&(e.dynamicMainBullets=1)),"progressbar"===e.type&&e.progressbarOpposite&&s.classList.add(e.progressbarOppositeClass),e.clickable&&s.addEventListener("click",p),t.enabled||s.classList.add(e.lockClass)})))}function f(){const e=t.params.pagination;if(d())return;let s=t.pagination.el;s&&(s=o(s),s.forEach((s=>{s.classList.remove(e.hiddenClass),s.classList.remove(e.modifierClass+e.type),s.classList.remove(t.isHorizontal()?e.horizontalClass:e.verticalClass),e.clickable&&(s.classList.remove(...(e.clickableClass||"").split(" ")),s.removeEventListener("click",p))}))),t.pagination.bullets&&t.pagination.bullets.forEach((t=>t.classList.remove(...e.bulletActiveClass.split(" "))))}a("changeDirection",(()=>{if(!t.pagination||!t.pagination.el)return;const e=t.params.pagination;let{el:s}=t.pagination;s=o(s),s.forEach((s=>{s.classList.remove(e.horizontalClass,e.verticalClass),s.classList.add(t.isHorizontal()?e.horizontalClass:e.verticalClass)}))})),a("init",(()=>{!1===t.params.pagination.enabled?g():(h(),m(),u())})),a("activeIndexChange",(()=>{void 0===t.snapIndex&&u()})),a("snapIndexChange",(()=>{u()})),a("snapGridLengthChange",(()=>{m(),u()})),a("destroy",(()=>{f()})),a("enable disable",(()=>{let{el:e}=t.pagination;e&&(e=o(e),e.forEach((e=>e.classList[t.enabled?"remove":"add"](t.params.pagination.lockClass))))})),a("lock unlock",(()=>{u()})),a("click",((e,s)=>{const a=s.target,r=o(t.pagination.el);if(t.params.pagination.el&&t.params.pagination.hideOnClick&&r&&r.length>0&&!a.classList.contains(t.params.pagination.bulletClass)){if(t.navigation&&(t.navigation.nextEl&&a===t.navigation.nextEl||t.navigation.prevEl&&a===t.navigation.prevEl))return;const e=r[0].classList.contains(t.params.pagination.hiddenClass);i(!0===e?"paginationShow":"paginationHide"),r.forEach((e=>e.classList.toggle(t.params.pagination.hiddenClass)))}}));const g=()=>{t.el.classList.add(t.params.pagination.paginationDisabledClass);let{el:e}=t.pagination;e&&(e=o(e),e.forEach((e=>e.classList.add(t.params.pagination.paginationDisabledClass)))),f()};Object.assign(t.pagination,{enable:()=>{t.el.classList.remove(t.params.pagination.paginationDisabledClass);let{el:e}=t.pagination;e&&(e=o(e),e.forEach((e=>e.classList.remove(t.params.pagination.paginationDisabledClass)))),h(),m(),u()},disable:g,render:m,update:u,init:h,destroy:f})},function(e){let{swiper:t,extendParams:s,on:i,emit:r}=e;const o=a();let d,c,p,u,m=!1,h=null,f=null;function g(){if(!t.params.scrollbar.el||!t.scrollbar.el)return;const{scrollbar:e,rtlTranslate:s}=t,{dragEl:a,el:i}=e,r=t.params.scrollbar,n=t.params.loop?t.progressLoop:t.progress;let l=c,o=(p-c)*n;s?(o=-o,o>0?(l=c-o,o=0):-o+c>p&&(l=p+o)):o<0?(l=c+o,o=0):o+c>p&&(l=p-o),t.isHorizontal()?(a.style.transform=`translate3d(${o}px, 0, 0)`,a.style.width=`${l}px`):(a.style.transform=`translate3d(0px, ${o}px, 0)`,a.style.height=`${l}px`),r.hide&&(clearTimeout(h),i.style.opacity=1,h=setTimeout((()=>{i.style.opacity=0,i.style.transitionDuration="400ms"}),1e3))}function b(){if(!t.params.scrollbar.el||!t.scrollbar.el)return;const{scrollbar:e}=t,{dragEl:s,el:a}=e;s.style.width="",s.style.height="",p=t.isHorizontal()?a.offsetWidth:a.offsetHeight,u=t.size/(t.virtualSize+t.params.slidesOffsetBefore-(t.params.centeredSlides?t.snapGrid[0]:0)),c="auto"===t.params.scrollbar.dragSize?p*u:parseInt(t.params.scrollbar.dragSize,10),t.isHorizontal()?s.style.width=`${c}px`:s.style.height=`${c}px`,a.style.display=u>=1?"none":"",t.params.scrollbar.hide&&(a.style.opacity=0),t.params.watchOverflow&&t.enabled&&e.el.classList[t.isLocked?"add":"remove"](t.params.scrollbar.lockClass)}function y(e){return t.isHorizontal()?e.clientX:e.clientY}function E(e){const{scrollbar:s,rtlTranslate:a}=t,{el:i}=s;let r;r=(y(e)-w(i)[t.isHorizontal()?"left":"top"]-(null!==d?d:c/2))/(p-c),r=Math.max(Math.min(r,1),0),a&&(r=1-r);const n=t.minTranslate()+(t.maxTranslate()-t.minTranslate())*r;t.updateProgress(n),t.setTranslate(n),t.updateActiveIndex(),t.updateSlidesClasses()}function x(e){const s=t.params.scrollbar,{scrollbar:a,wrapperEl:i}=t,{el:n,dragEl:l}=a;m=!0,d=e.target===l?y(e)-e.target.getBoundingClientRect()[t.isHorizontal()?"left":"top"]:null,e.preventDefault(),e.stopPropagation(),i.style.transitionDuration="100ms",l.style.transitionDuration="100ms",E(e),clearTimeout(f),n.style.transitionDuration="0ms",s.hide&&(n.style.opacity=1),t.params.cssMode&&(t.wrapperEl.style["scroll-snap-type"]="none"),r("scrollbarDragStart",e)}function S(e){const{scrollbar:s,wrapperEl:a}=t,{el:i,dragEl:n}=s;m&&(e.preventDefault?e.preventDefault():e.returnValue=!1,E(e),a.style.transitionDuration="0ms",i.style.transitionDuration="0ms",n.style.transitionDuration="0ms",r("scrollbarDragMove",e))}function T(e){const s=t.params.scrollbar,{scrollbar:a,wrapperEl:i}=t,{el:n}=a;m&&(m=!1,t.params.cssMode&&(t.wrapperEl.style["scroll-snap-type"]="",i.style.transitionDuration=""),s.hide&&(clearTimeout(f),f=l((()=>{n.style.opacity=0,n.style.transitionDuration="400ms"}),1e3)),r("scrollbarDragEnd",e),s.snapOnRelease&&t.slideToClosest())}function M(e){const{scrollbar:s,params:a}=t,i=s.el;if(!i)return;const r=i,n=!!a.passiveListeners&&{passive:!1,capture:!1},l=!!a.passiveListeners&&{passive:!0,capture:!1};if(!r)return;const d="on"===e?"addEventListener":"removeEventListener";r[d]("pointerdown",x,n),o[d]("pointermove",S,n),o[d]("pointerup",T,l)}function C(){const{scrollbar:e,el:s}=t;t.params.scrollbar=te(t,t.originalParams.scrollbar,t.params.scrollbar,{el:"swiper-scrollbar"});const a=t.params.scrollbar;if(!a.el)return;let i,r;if("string"==typeof a.el&&t.isElement&&(i=t.el.querySelector(a.el)),i||"string"!=typeof a.el)i||(i=a.el);else if(i=o.querySelectorAll(a.el),!i.length)return;t.params.uniqueNavElements&&"string"==typeof a.el&&i.length>1&&1===s.querySelectorAll(a.el).length&&(i=s.querySelector(a.el)),i.length>0&&(i=i[0]),i.classList.add(t.isHorizontal()?a.horizontalClass:a.verticalClass),i&&(r=i.querySelector(se(t.params.scrollbar.dragClass)),r||(r=v("div",t.params.scrollbar.dragClass),i.append(r))),Object.assign(e,{el:i,dragEl:r}),a.draggable&&t.params.scrollbar.el&&t.scrollbar.el&&M("on"),i&&i.classList[t.enabled?"remove":"add"](...n(t.params.scrollbar.lockClass))}function P(){const e=t.params.scrollbar,s=t.scrollbar.el;s&&s.classList.remove(...n(t.isHorizontal()?e.horizontalClass:e.verticalClass)),t.params.scrollbar.el&&t.scrollbar.el&&M("off")}s({scrollbar:{el:null,dragSize:"auto",hide:!1,draggable:!1,snapOnRelease:!0,lockClass:"swiper-scrollbar-lock",dragClass:"swiper-scrollbar-drag",scrollbarDisabledClass:"swiper-scrollbar-disabled",horizontalClass:"swiper-scrollbar-horizontal",verticalClass:"swiper-scrollbar-vertical"}}),t.scrollbar={el:null,dragEl:null},i("init",(()=>{!1===t.params.scrollbar.enabled?L():(C(),b(),g())})),i("update resize observerUpdate lock unlock",(()=>{b()})),i("setTranslate",(()=>{g()})),i("setTransition",((e,s)=>{!function(e){t.params.scrollbar.el&&t.scrollbar.el&&(t.scrollbar.dragEl.style.transitionDuration=`${e}ms`)}(s)})),i("enable disable",(()=>{const{el:e}=t.scrollbar;e&&e.classList[t.enabled?"remove":"add"](...n(t.params.scrollbar.lockClass))})),i("destroy",(()=>{P()}));const L=()=>{t.el.classList.add(...n(t.params.scrollbar.scrollbarDisabledClass)),t.scrollbar.el&&t.scrollbar.el.classList.add(...n(t.params.scrollbar.scrollbarDisabledClass)),P()};Object.assign(t.scrollbar,{enable:()=>{t.el.classList.remove(...n(t.params.scrollbar.scrollbarDisabledClass)),t.scrollbar.el&&t.scrollbar.el.classList.remove(...n(t.params.scrollbar.scrollbarDisabledClass)),C(),b(),g()},disable:L,updateSize:b,setTranslate:g,init:C,destroy:P})},function(e){let{swiper:t,extendParams:s,on:a}=e;s({parallax:{enabled:!1}});const i="[data-swiper-parallax], [data-swiper-parallax-x], [data-swiper-parallax-y], [data-swiper-parallax-opacity], [data-swiper-parallax-scale]",r=(e,s)=>{const{rtl:a}=t,i=a?-1:1,r=e.getAttribute("data-swiper-parallax")||"0";let n=e.getAttribute("data-swiper-parallax-x"),l=e.getAttribute("data-swiper-parallax-y");const o=e.getAttribute("data-swiper-parallax-scale"),d=e.getAttribute("data-swiper-parallax-opacity"),c=e.getAttribute("data-swiper-parallax-rotate");if(n||l?(n=n||"0",l=l||"0"):t.isHorizontal()?(n=r,l="0"):(l=r,n="0"),n=n.indexOf("%")>=0?parseInt(n,10)*s*i+"%":n*s*i+"px",l=l.indexOf("%")>=0?parseInt(l,10)*s+"%":l*s+"px",null!=d){const t=d-(d-1)*(1-Math.abs(s));e.style.opacity=t}let p=`translate3d(${n}, ${l}, 0px)`;if(null!=o){p+=` scale(${o-(o-1)*(1-Math.abs(s))})`}if(c&&null!=c){p+=` rotate(${c*s*-1}deg)`}e.style.transform=p},n=()=>{const{el:e,slides:s,progress:a,snapGrid:n,isElement:l}=t,o=f(e,i);t.isElement&&o.push(...f(t.hostEl,i)),o.forEach((e=>{r(e,a)})),s.forEach(((e,s)=>{let l=e.progress;t.params.slidesPerGroup>1&&"auto"!==t.params.slidesPerView&&(l+=Math.ceil(s/2)-a*(n.length-1)),l=Math.min(Math.max(l,-1),1),e.querySelectorAll(`${i}, [data-swiper-parallax-rotate]`).forEach((e=>{r(e,l)}))}))};a("beforeInit",(()=>{t.params.parallax.enabled&&(t.params.watchSlidesProgress=!0,t.originalParams.watchSlidesProgress=!0)})),a("init",(()=>{t.params.parallax.enabled&&n()})),a("setTranslate",(()=>{t.params.parallax.enabled&&n()})),a("setTransition",((e,s)=>{t.params.parallax.enabled&&function(e){void 0===e&&(e=t.params.speed);const{el:s,hostEl:a}=t,r=[...s.querySelectorAll(i)];t.isElement&&r.push(...a.querySelectorAll(i)),r.forEach((t=>{let s=parseInt(t.getAttribute("data-swiper-parallax-duration"),10)||e;0===e&&(s=0),t.style.transitionDuration=`${s}ms`}))}(s)}))},function(e){let{swiper:t,extendParams:s,on:a,emit:i}=e;const n=r();s({zoom:{enabled:!1,maxRatio:3,minRatio:1,toggle:!0,containerClass:"swiper-zoom-container",zoomedSlideClass:"swiper-slide-zoomed"}}),t.zoom={enabled:!1};let l,o,c=1,p=!1;const u=[],m={originX:0,originY:0,slideEl:void 0,slideWidth:void 0,slideHeight:void 0,imageEl:void 0,imageWrapEl:void 0,maxRatio:3},h={isTouched:void 0,isMoved:void 0,currentX:void 0,currentY:void 0,minX:void 0,minY:void 0,maxX:void 0,maxY:void 0,width:void 0,height:void 0,startX:void 0,startY:void 0,touchesStart:{},touchesCurrent:{}},g={x:void 0,y:void 0,prevPositionX:void 0,prevPositionY:void 0,prevTime:void 0};let v=1;function b(){if(u.length<2)return 1;const e=u[0].pageX,t=u[0].pageY,s=u[1].pageX,a=u[1].pageY;return Math.sqrt((s-e)**2+(a-t)**2)}function y(e){const s=t.isElement?"swiper-slide":`.${t.params.slideClass}`;return!!e.target.matches(s)||t.slides.filter((t=>t.contains(e.target))).length>0}function x(e){if("mouse"===e.pointerType&&u.splice(0,u.length),!y(e))return;const s=t.params.zoom;if(l=!1,o=!1,u.push(e),!(u.length<2)){if(l=!0,m.scaleStart=b(),!m.slideEl){m.slideEl=e.target.closest(`.${t.params.slideClass}, swiper-slide`),m.slideEl||(m.slideEl=t.slides[t.activeIndex]);let a=m.slideEl.querySelector(`.${s.containerClass}`);if(a&&(a=a.querySelectorAll("picture, img, svg, canvas, .swiper-zoom-target")[0]),m.imageEl=a,m.imageWrapEl=a?E(m.imageEl,`.${s.containerClass}`)[0]:void 0,!m.imageWrapEl)return void(m.imageEl=void 0);m.maxRatio=m.imageWrapEl.getAttribute("data-swiper-zoom")||s.maxRatio}if(m.imageEl){const[e,t]=function(){if(u.length<2)return{x:null,y:null};const e=m.imageEl.getBoundingClientRect();return[(u[0].pageX+(u[1].pageX-u[0].pageX)/2-e.x-n.scrollX)/c,(u[0].pageY+(u[1].pageY-u[0].pageY)/2-e.y-n.scrollY)/c]}();m.originX=e,m.originY=t,m.imageEl.style.transitionDuration="0ms"}p=!0}}function S(e){if(!y(e))return;const s=t.params.zoom,a=t.zoom,i=u.findIndex((t=>t.pointerId===e.pointerId));i>=0&&(u[i]=e),u.length<2||(o=!0,m.scaleMove=b(),m.imageEl&&(a.scale=m.scaleMove/m.scaleStart*c,a.scale>m.maxRatio&&(a.scale=m.maxRatio-1+(a.scale-m.maxRatio+1)**.5),a.scalet.pointerId===e.pointerId));i>=0&&u.splice(i,1),l&&o&&(l=!1,o=!1,m.imageEl&&(a.scale=Math.max(Math.min(a.scale,m.maxRatio),s.minRatio),m.imageEl.style.transitionDuration=`${t.params.speed}ms`,m.imageEl.style.transform=`translate3d(0,0,0) scale(${a.scale})`,c=a.scale,p=!1,a.scale>1&&m.slideEl?m.slideEl.classList.add(`${s.zoomedSlideClass}`):a.scale<=1&&m.slideEl&&m.slideEl.classList.remove(`${s.zoomedSlideClass}`),1===a.scale&&(m.originX=0,m.originY=0,m.slideEl=void 0)))}function M(e){if(!y(e)||!function(e){const s=`.${t.params.zoom.containerClass}`;return!!e.target.matches(s)||[...t.hostEl.querySelectorAll(s)].filter((t=>t.contains(e.target))).length>0}(e))return;const s=t.zoom;if(!m.imageEl)return;if(!h.isTouched||!m.slideEl)return;h.isMoved||(h.width=m.imageEl.offsetWidth,h.height=m.imageEl.offsetHeight,h.startX=d(m.imageWrapEl,"x")||0,h.startY=d(m.imageWrapEl,"y")||0,m.slideWidth=m.slideEl.offsetWidth,m.slideHeight=m.slideEl.offsetHeight,m.imageWrapEl.style.transitionDuration="0ms");const a=h.width*s.scale,i=h.height*s.scale;if(a0?u[0].pageX:e.pageX,h.touchesCurrent.y=u.length>0?u[0].pageY:e.pageY;if(Math.max(Math.abs(h.touchesCurrent.x-h.touchesStart.x),Math.abs(h.touchesCurrent.y-h.touchesStart.y))>5&&(t.allowClick=!1),!h.isMoved&&!p){if(t.isHorizontal()&&(Math.floor(h.minX)===Math.floor(h.startX)&&h.touchesCurrent.xh.touchesStart.x))return void(h.isTouched=!1);if(!t.isHorizontal()&&(Math.floor(h.minY)===Math.floor(h.startY)&&h.touchesCurrent.yh.touchesStart.y))return void(h.isTouched=!1)}e.cancelable&&e.preventDefault(),e.stopPropagation(),h.isMoved=!0;const r=(s.scale-c)/(m.maxRatio-t.params.zoom.minRatio),{originX:n,originY:l}=m;h.currentX=h.touchesCurrent.x-h.touchesStart.x+h.startX+r*(h.width-2*n),h.currentY=h.touchesCurrent.y-h.touchesStart.y+h.startY+r*(h.height-2*l),h.currentXh.maxX&&(h.currentX=h.maxX-1+(h.currentX-h.maxX+1)**.8),h.currentYh.maxY&&(h.currentY=h.maxY-1+(h.currentY-h.maxY+1)**.8),g.prevPositionX||(g.prevPositionX=h.touchesCurrent.x),g.prevPositionY||(g.prevPositionY=h.touchesCurrent.y),g.prevTime||(g.prevTime=Date.now()),g.x=(h.touchesCurrent.x-g.prevPositionX)/(Date.now()-g.prevTime)/2,g.y=(h.touchesCurrent.y-g.prevPositionY)/(Date.now()-g.prevTime)/2,Math.abs(h.touchesCurrent.x-g.prevPositionX)<2&&(g.x=0),Math.abs(h.touchesCurrent.y-g.prevPositionY)<2&&(g.y=0),g.prevPositionX=h.touchesCurrent.x,g.prevPositionY=h.touchesCurrent.y,g.prevTime=Date.now(),m.imageWrapEl.style.transform=`translate3d(${h.currentX}px, ${h.currentY}px,0)`}function C(){const e=t.zoom;m.slideEl&&t.activeIndex!==t.slides.indexOf(m.slideEl)&&(m.imageEl&&(m.imageEl.style.transform="translate3d(0,0,0) scale(1)"),m.imageWrapEl&&(m.imageWrapEl.style.transform="translate3d(0,0,0)"),m.slideEl.classList.remove(`${t.params.zoom.zoomedSlideClass}`),e.scale=1,c=1,m.slideEl=void 0,m.imageEl=void 0,m.imageWrapEl=void 0,m.originX=0,m.originY=0)}function P(e){const s=t.zoom,a=t.params.zoom;if(!m.slideEl){e&&e.target&&(m.slideEl=e.target.closest(`.${t.params.slideClass}, swiper-slide`)),m.slideEl||(t.params.virtual&&t.params.virtual.enabled&&t.virtual?m.slideEl=f(t.slidesEl,`.${t.params.slideActiveClass}`)[0]:m.slideEl=t.slides[t.activeIndex]);let s=m.slideEl.querySelector(`.${a.containerClass}`);s&&(s=s.querySelectorAll("picture, img, svg, canvas, .swiper-zoom-target")[0]),m.imageEl=s,m.imageWrapEl=s?E(m.imageEl,`.${a.containerClass}`)[0]:void 0}if(!m.imageEl||!m.imageWrapEl)return;let i,r,l,o,d,p,u,g,v,b,y,x,S,T,M,C,P,L;t.params.cssMode&&(t.wrapperEl.style.overflow="hidden",t.wrapperEl.style.touchAction="none"),m.slideEl.classList.add(`${a.zoomedSlideClass}`),void 0===h.touchesStart.x&&e?(i=e.pageX,r=e.pageY):(i=h.touchesStart.x,r=h.touchesStart.y);const A="number"==typeof e?e:null;1===c&&A&&(i=void 0,r=void 0),s.scale=A||m.imageWrapEl.getAttribute("data-swiper-zoom")||a.maxRatio,c=A||m.imageWrapEl.getAttribute("data-swiper-zoom")||a.maxRatio,!e||1===c&&A?(u=0,g=0):(P=m.slideEl.offsetWidth,L=m.slideEl.offsetHeight,l=w(m.slideEl).left+n.scrollX,o=w(m.slideEl).top+n.scrollY,d=l+P/2-i,p=o+L/2-r,v=m.imageEl.offsetWidth,b=m.imageEl.offsetHeight,y=v*s.scale,x=b*s.scale,S=Math.min(P/2-y/2,0),T=Math.min(L/2-x/2,0),M=-S,C=-T,u=d*s.scale,g=p*s.scale,uM&&(u=M),gC&&(g=C)),A&&1===s.scale&&(m.originX=0,m.originY=0),m.imageWrapEl.style.transitionDuration="300ms",m.imageWrapEl.style.transform=`translate3d(${u}px, ${g}px,0)`,m.imageEl.style.transitionDuration="300ms",m.imageEl.style.transform=`translate3d(0,0,0) scale(${s.scale})`}function L(){const e=t.zoom,s=t.params.zoom;if(!m.slideEl){t.params.virtual&&t.params.virtual.enabled&&t.virtual?m.slideEl=f(t.slidesEl,`.${t.params.slideActiveClass}`)[0]:m.slideEl=t.slides[t.activeIndex];let e=m.slideEl.querySelector(`.${s.containerClass}`);e&&(e=e.querySelectorAll("picture, img, svg, canvas, .swiper-zoom-target")[0]),m.imageEl=e,m.imageWrapEl=e?E(m.imageEl,`.${s.containerClass}`)[0]:void 0}m.imageEl&&m.imageWrapEl&&(t.params.cssMode&&(t.wrapperEl.style.overflow="",t.wrapperEl.style.touchAction=""),e.scale=1,c=1,m.imageWrapEl.style.transitionDuration="300ms",m.imageWrapEl.style.transform="translate3d(0,0,0)",m.imageEl.style.transitionDuration="300ms",m.imageEl.style.transform="translate3d(0,0,0) scale(1)",m.slideEl.classList.remove(`${s.zoomedSlideClass}`),m.slideEl=void 0,m.originX=0,m.originY=0)}function A(e){const s=t.zoom;s.scale&&1!==s.scale?L():P(e)}function I(){return{passiveListener:!!t.params.passiveListeners&&{passive:!0,capture:!1},activeListenerWithCapture:!t.params.passiveListeners||{passive:!1,capture:!0}}}function z(){const e=t.zoom;if(e.enabled)return;e.enabled=!0;const{passiveListener:s,activeListenerWithCapture:a}=I();t.wrapperEl.addEventListener("pointerdown",x,s),t.wrapperEl.addEventListener("pointermove",S,a),["pointerup","pointercancel","pointerout"].forEach((e=>{t.wrapperEl.addEventListener(e,T,s)})),t.wrapperEl.addEventListener("pointermove",M,a)}function $(){const e=t.zoom;if(!e.enabled)return;e.enabled=!1;const{passiveListener:s,activeListenerWithCapture:a}=I();t.wrapperEl.removeEventListener("pointerdown",x,s),t.wrapperEl.removeEventListener("pointermove",S,a),["pointerup","pointercancel","pointerout"].forEach((e=>{t.wrapperEl.removeEventListener(e,T,s)})),t.wrapperEl.removeEventListener("pointermove",M,a)}Object.defineProperty(t.zoom,"scale",{get:()=>v,set(e){if(v!==e){const t=m.imageEl,s=m.slideEl;i("zoomChange",e,t,s)}v=e}}),a("init",(()=>{t.params.zoom.enabled&&z()})),a("destroy",(()=>{$()})),a("touchStart",((e,s)=>{t.zoom.enabled&&function(e){const s=t.device;if(!m.imageEl)return;if(h.isTouched)return;s.android&&e.cancelable&&e.preventDefault(),h.isTouched=!0;const a=u.length>0?u[0]:e;h.touchesStart.x=a.pageX,h.touchesStart.y=a.pageY}(s)})),a("touchEnd",((e,s)=>{t.zoom.enabled&&function(){const e=t.zoom;if(!m.imageEl)return;if(!h.isTouched||!h.isMoved)return h.isTouched=!1,void(h.isMoved=!1);h.isTouched=!1,h.isMoved=!1;let s=300,a=300;const i=g.x*s,r=h.currentX+i,n=g.y*a,l=h.currentY+n;0!==g.x&&(s=Math.abs((r-h.currentX)/g.x)),0!==g.y&&(a=Math.abs((l-h.currentY)/g.y));const o=Math.max(s,a);h.currentX=r,h.currentY=l;const d=h.width*e.scale,c=h.height*e.scale;h.minX=Math.min(m.slideWidth/2-d/2,0),h.maxX=-h.minX,h.minY=Math.min(m.slideHeight/2-c/2,0),h.maxY=-h.minY,h.currentX=Math.max(Math.min(h.currentX,h.maxX),h.minX),h.currentY=Math.max(Math.min(h.currentY,h.maxY),h.minY),m.imageWrapEl.style.transitionDuration=`${o}ms`,m.imageWrapEl.style.transform=`translate3d(${h.currentX}px, ${h.currentY}px,0)`}()})),a("doubleTap",((e,s)=>{!t.animating&&t.params.zoom.enabled&&t.zoom.enabled&&t.params.zoom.toggle&&A(s)})),a("transitionEnd",(()=>{t.zoom.enabled&&t.params.zoom.enabled&&C()})),a("slideChange",(()=>{t.zoom.enabled&&t.params.zoom.enabled&&t.params.cssMode&&C()})),Object.assign(t.zoom,{enable:z,disable:$,in:P,out:L,toggle:A})},function(e){let{swiper:t,extendParams:s,on:a}=e;function i(e,t){const s=function(){let e,t,s;return(a,i)=>{for(t=-1,e=a.length;e-t>1;)s=e+t>>1,a[s]<=i?t=s:e=s;return e}}();let a,i;return this.x=e,this.y=t,this.lastIndex=e.length-1,this.interpolate=function(e){return e?(i=s(this.x,e),a=i-1,(e-this.x[a])*(this.y[i]-this.y[a])/(this.x[i]-this.x[a])+this.y[a]):0},this}function r(){t.controller.control&&t.controller.spline&&(t.controller.spline=void 0,delete t.controller.spline)}s({controller:{control:void 0,inverse:!1,by:"slide"}}),t.controller={control:void 0},a("beforeInit",(()=>{if("undefined"!=typeof window&&("string"==typeof t.params.controller.control||t.params.controller.control instanceof HTMLElement)){const e=document.querySelector(t.params.controller.control);if(e&&e.swiper)t.controller.control=e.swiper;else if(e){const s=a=>{t.controller.control=a.detail[0],t.update(),e.removeEventListener("init",s)};e.addEventListener("init",s)}}else t.controller.control=t.params.controller.control})),a("update",(()=>{r()})),a("resize",(()=>{r()})),a("observerUpdate",(()=>{r()})),a("setTranslate",((e,s,a)=>{t.controller.control&&!t.controller.control.destroyed&&t.controller.setTranslate(s,a)})),a("setTransition",((e,s,a)=>{t.controller.control&&!t.controller.control.destroyed&&t.controller.setTransition(s,a)})),Object.assign(t.controller,{setTranslate:function(e,s){const a=t.controller.control;let r,n;const l=t.constructor;function o(e){if(e.destroyed)return;const s=t.rtlTranslate?-t.translate:t.translate;"slide"===t.params.controller.by&&(!function(e){t.controller.spline=t.params.loop?new i(t.slidesGrid,e.slidesGrid):new i(t.snapGrid,e.snapGrid)}(e),n=-t.controller.spline.interpolate(-s)),n&&"container"!==t.params.controller.by||(r=(e.maxTranslate()-e.minTranslate())/(t.maxTranslate()-t.minTranslate()),!Number.isNaN(r)&&Number.isFinite(r)||(r=1),n=(s-t.minTranslate())*r+e.minTranslate()),t.params.controller.inverse&&(n=e.maxTranslate()-n),e.updateProgress(n),e.setTranslate(n,t),e.updateActiveIndex(),e.updateSlidesClasses()}if(Array.isArray(a))for(let e=0;e{s.updateAutoHeight()})),x(s.wrapperEl,(()=>{i&&s.transitionEnd()}))))}if(Array.isArray(i))for(r=0;r(Array.isArray(e)?e:[e]).filter((e=>!!e));function l(e){(e=n(e)).forEach((e=>{e.setAttribute("tabIndex","0")}))}function o(e){(e=n(e)).forEach((e=>{e.setAttribute("tabIndex","-1")}))}function d(e,t){(e=n(e)).forEach((e=>{e.setAttribute("role",t)}))}function c(e,t){(e=n(e)).forEach((e=>{e.setAttribute("aria-roledescription",t)}))}function p(e,t){(e=n(e)).forEach((e=>{e.setAttribute("aria-label",t)}))}function u(e){(e=n(e)).forEach((e=>{e.setAttribute("aria-disabled",!0)}))}function m(e){(e=n(e)).forEach((e=>{e.setAttribute("aria-disabled",!1)}))}function h(e){if(13!==e.keyCode&&32!==e.keyCode)return;const s=t.params.a11y,a=e.target;t.pagination&&t.pagination.el&&(a===t.pagination.el||t.pagination.el.contains(e.target))&&!e.target.matches(se(t.params.pagination.bulletClass))||(t.navigation&&t.navigation.nextEl&&a===t.navigation.nextEl&&(t.isEnd&&!t.params.loop||t.slideNext(),t.isEnd?r(s.lastSlideMessage):r(s.nextSlideMessage)),t.navigation&&t.navigation.prevEl&&a===t.navigation.prevEl&&(t.isBeginning&&!t.params.loop||t.slidePrev(),t.isBeginning?r(s.firstSlideMessage):r(s.prevSlideMessage)),t.pagination&&a.matches(se(t.params.pagination.bulletClass))&&a.click())}function f(){return t.pagination&&t.pagination.bullets&&t.pagination.bullets.length}function g(){return f()&&t.params.pagination.clickable}const w=(e,t,s)=>{l(e),"BUTTON"!==e.tagName&&(d(e,"button"),e.addEventListener("keydown",h)),p(e,s),function(e,t){(e=n(e)).forEach((e=>{e.setAttribute("aria-controls",t)}))}(e,t)},b=()=>{t.a11y.clicked=!0},E=()=>{requestAnimationFrame((()=>{requestAnimationFrame((()=>{t.destroyed||(t.a11y.clicked=!1)}))}))},x=e=>{if(t.a11y.clicked)return;const s=e.target.closest(`.${t.params.slideClass}, swiper-slide`);if(!s||!t.slides.includes(s))return;const a=t.slides.indexOf(s)===t.activeIndex,i=t.params.watchSlidesProgress&&t.visibleSlides&&t.visibleSlides.includes(s);a||i||e.sourceCapabilities&&e.sourceCapabilities.firesTouchEvents||(t.isHorizontal()?t.el.scrollLeft=0:t.el.scrollTop=0,t.slideTo(t.slides.indexOf(s),0))},S=()=>{const e=t.params.a11y;e.itemRoleDescriptionMessage&&c(t.slides,e.itemRoleDescriptionMessage),e.slideRole&&d(t.slides,e.slideRole);const s=t.slides.length;e.slideLabelMessage&&t.slides.forEach(((a,i)=>{const r=t.params.loop?parseInt(a.getAttribute("data-swiper-slide-index"),10):i;p(a,e.slideLabelMessage.replace(/\{\{index\}\}/,r+1).replace(/\{\{slidesLength\}\}/,s))}))},T=()=>{const e=t.params.a11y;t.el.append(i);const s=t.el;e.containerRoleDescriptionMessage&&c(s,e.containerRoleDescriptionMessage),e.containerMessage&&p(s,e.containerMessage);const a=t.wrapperEl,r=e.id||a.getAttribute("id")||`swiper-wrapper-${l=16,void 0===l&&(l=16),"x".repeat(l).replace(/x/g,(()=>Math.round(16*Math.random()).toString(16)))}`;var l;const o=t.params.autoplay&&t.params.autoplay.enabled?"off":"polite";var d;d=r,n(a).forEach((e=>{e.setAttribute("id",d)})),function(e,t){(e=n(e)).forEach((e=>{e.setAttribute("aria-live",t)}))}(a,o),S();let{nextEl:u,prevEl:m}=t.navigation?t.navigation:{};if(u=n(u),m=n(m),u&&u.forEach((t=>w(t,r,e.nextSlideMessage))),m&&m.forEach((t=>w(t,r,e.prevSlideMessage))),g()){n(t.pagination.el).forEach((e=>{e.addEventListener("keydown",h)}))}t.el.addEventListener("focus",x,!0),t.el.addEventListener("pointerdown",b,!0),t.el.addEventListener("pointerup",E,!0)};a("beforeInit",(()=>{i=v("span",t.params.a11y.notificationClass),i.setAttribute("aria-live","assertive"),i.setAttribute("aria-atomic","true")})),a("afterInit",(()=>{t.params.a11y.enabled&&T()})),a("slidesLengthChange snapGridLengthChange slidesGridLengthChange",(()=>{t.params.a11y.enabled&&S()})),a("fromEdge toEdge afterInit lock unlock",(()=>{t.params.a11y.enabled&&function(){if(t.params.loop||t.params.rewind||!t.navigation)return;const{nextEl:e,prevEl:s}=t.navigation;s&&(t.isBeginning?(u(s),o(s)):(m(s),l(s))),e&&(t.isEnd?(u(e),o(e)):(m(e),l(e)))}()})),a("paginationUpdate",(()=>{t.params.a11y.enabled&&function(){const e=t.params.a11y;f()&&t.pagination.bullets.forEach((s=>{t.params.pagination.clickable&&(l(s),t.params.pagination.renderBullet||(d(s,"button"),p(s,e.paginationBulletMessage.replace(/\{\{index\}\}/,y(s)+1)))),s.matches(se(t.params.pagination.bulletActiveClass))?s.setAttribute("aria-current","true"):s.removeAttribute("aria-current")}))}()})),a("destroy",(()=>{t.params.a11y.enabled&&function(){i&&i.remove();let{nextEl:e,prevEl:s}=t.navigation?t.navigation:{};e=n(e),s=n(s),e&&e.forEach((e=>e.removeEventListener("keydown",h))),s&&s.forEach((e=>e.removeEventListener("keydown",h))),g()&&n(t.pagination.el).forEach((e=>{e.removeEventListener("keydown",h)}));t.el.removeEventListener("focus",x,!0),t.el.removeEventListener("pointerdown",b,!0),t.el.removeEventListener("pointerup",E,!0)}()}))},function(e){let{swiper:t,extendParams:s,on:a}=e;s({history:{enabled:!1,root:"",replaceState:!1,key:"slides",keepQuery:!1}});let i=!1,n={};const l=e=>e.toString().replace(/\s+/g,"-").replace(/[^\w-]+/g,"").replace(/--+/g,"-").replace(/^-+/,"").replace(/-+$/,""),o=e=>{const t=r();let s;s=e?new URL(e):t.location;const a=s.pathname.slice(1).split("/").filter((e=>""!==e)),i=a.length;return{key:a[i-2],value:a[i-1]}},d=(e,s)=>{const a=r();if(!i||!t.params.history.enabled)return;let n;n=t.params.url?new URL(t.params.url):a.location;const o=t.slides[s];let d=l(o.getAttribute("data-history"));if(t.params.history.root.length>0){let s=t.params.history.root;"/"===s[s.length-1]&&(s=s.slice(0,s.length-1)),d=`${s}/${e?`${e}/`:""}${d}`}else n.pathname.includes(e)||(d=`${e?`${e}/`:""}${d}`);t.params.history.keepQuery&&(d+=n.search);const c=a.history.state;c&&c.value===d||(t.params.history.replaceState?a.history.replaceState({value:d},null,d):a.history.pushState({value:d},null,d))},c=(e,s,a)=>{if(s)for(let i=0,r=t.slides.length;i{n=o(t.params.url),c(t.params.speed,n.value,!1)};a("init",(()=>{t.params.history.enabled&&(()=>{const e=r();if(t.params.history){if(!e.history||!e.history.pushState)return t.params.history.enabled=!1,void(t.params.hashNavigation.enabled=!0);i=!0,n=o(t.params.url),n.key||n.value?(c(0,n.value,t.params.runCallbacksOnInit),t.params.history.replaceState||e.addEventListener("popstate",p)):t.params.history.replaceState||e.addEventListener("popstate",p)}})()})),a("destroy",(()=>{t.params.history.enabled&&(()=>{const e=r();t.params.history.replaceState||e.removeEventListener("popstate",p)})()})),a("transitionEnd _freeModeNoMomentumRelease",(()=>{i&&d(t.params.history.key,t.activeIndex)})),a("slideChange",(()=>{i&&t.params.cssMode&&d(t.params.history.key,t.activeIndex)}))},function(e){let{swiper:t,extendParams:s,emit:i,on:n}=e,l=!1;const o=a(),d=r();s({hashNavigation:{enabled:!1,replaceState:!1,watchState:!1,getSlideIndex(e,s){if(t.virtual&&t.params.virtual.enabled){const e=t.slides.filter((e=>e.getAttribute("data-hash")===s))[0];if(!e)return 0;return parseInt(e.getAttribute("data-swiper-slide-index"),10)}return t.getSlideIndex(f(t.slidesEl,`.${t.params.slideClass}[data-hash="${s}"], swiper-slide[data-hash="${s}"]`)[0])}}});const c=()=>{i("hashChange");const e=o.location.hash.replace("#",""),s=t.virtual&&t.params.virtual.enabled?t.slidesEl.querySelector(`[data-swiper-slide-index="${t.activeIndex}"]`):t.slides[t.activeIndex];if(e!==(s?s.getAttribute("data-hash"):"")){const s=t.params.hashNavigation.getSlideIndex(t,e);if(void 0===s||Number.isNaN(s))return;t.slideTo(s)}},p=()=>{if(!l||!t.params.hashNavigation.enabled)return;const e=t.virtual&&t.params.virtual.enabled?t.slidesEl.querySelector(`[data-swiper-slide-index="${t.activeIndex}"]`):t.slides[t.activeIndex],s=e?e.getAttribute("data-hash")||e.getAttribute("data-history"):"";t.params.hashNavigation.replaceState&&d.history&&d.history.replaceState?(d.history.replaceState(null,null,`#${s}`||""),i("hashSet")):(o.location.hash=s||"",i("hashSet"))};n("init",(()=>{t.params.hashNavigation.enabled&&(()=>{if(!t.params.hashNavigation.enabled||t.params.history&&t.params.history.enabled)return;l=!0;const e=o.location.hash.replace("#","");if(e){const s=0,a=t.params.hashNavigation.getSlideIndex(t,e);t.slideTo(a||0,s,t.params.runCallbacksOnInit,!0)}t.params.hashNavigation.watchState&&d.addEventListener("hashchange",c)})()})),n("destroy",(()=>{t.params.hashNavigation.enabled&&t.params.hashNavigation.watchState&&d.removeEventListener("hashchange",c)})),n("transitionEnd _freeModeNoMomentumRelease",(()=>{l&&p()})),n("slideChange",(()=>{l&&t.params.cssMode&&p()}))},function(e){let t,s,{swiper:i,extendParams:r,on:n,emit:l,params:o}=e;i.autoplay={running:!1,paused:!1,timeLeft:0},r({autoplay:{enabled:!1,delay:3e3,waitForTransition:!0,disableOnInteraction:!1,stopOnLastSlide:!1,reverseDirection:!1,pauseOnMouseEnter:!1}});let d,c,p,u,m,h,f,g,v=o&&o.autoplay?o.autoplay.delay:3e3,w=o&&o.autoplay?o.autoplay.delay:3e3,b=(new Date).getTime();function y(e){i&&!i.destroyed&&i.wrapperEl&&e.target===i.wrapperEl&&(i.wrapperEl.removeEventListener("transitionend",y),g||C())}const E=()=>{if(i.destroyed||!i.autoplay.running)return;i.autoplay.paused?c=!0:c&&(w=d,c=!1);const e=i.autoplay.paused?d:b+w-(new Date).getTime();i.autoplay.timeLeft=e,l("autoplayTimeLeft",e,e/v),s=requestAnimationFrame((()=>{E()}))},x=e=>{if(i.destroyed||!i.autoplay.running)return;cancelAnimationFrame(s),E();let a=void 0===e?i.params.autoplay.delay:e;v=i.params.autoplay.delay,w=i.params.autoplay.delay;const r=(()=>{let e;if(e=i.virtual&&i.params.virtual.enabled?i.slides.filter((e=>e.classList.contains("swiper-slide-active")))[0]:i.slides[i.activeIndex],!e)return;return parseInt(e.getAttribute("data-swiper-autoplay"),10)})();!Number.isNaN(r)&&r>0&&void 0===e&&(a=r,v=r,w=r),d=a;const n=i.params.speed,o=()=>{i&&!i.destroyed&&(i.params.autoplay.reverseDirection?!i.isBeginning||i.params.loop||i.params.rewind?(i.slidePrev(n,!0,!0),l("autoplay")):i.params.autoplay.stopOnLastSlide||(i.slideTo(i.slides.length-1,n,!0,!0),l("autoplay")):!i.isEnd||i.params.loop||i.params.rewind?(i.slideNext(n,!0,!0),l("autoplay")):i.params.autoplay.stopOnLastSlide||(i.slideTo(0,n,!0,!0),l("autoplay")),i.params.cssMode&&(b=(new Date).getTime(),requestAnimationFrame((()=>{x()}))))};return a>0?(clearTimeout(t),t=setTimeout((()=>{o()}),a)):requestAnimationFrame((()=>{o()})),a},S=()=>{b=(new Date).getTime(),i.autoplay.running=!0,x(),l("autoplayStart")},T=()=>{i.autoplay.running=!1,clearTimeout(t),cancelAnimationFrame(s),l("autoplayStop")},M=(e,s)=>{if(i.destroyed||!i.autoplay.running)return;clearTimeout(t),e||(f=!0);const a=()=>{l("autoplayPause"),i.params.autoplay.waitForTransition?i.wrapperEl.addEventListener("transitionend",y):C()};if(i.autoplay.paused=!0,s)return h&&(d=i.params.autoplay.delay),h=!1,void a();const r=d||i.params.autoplay.delay;d=r-((new Date).getTime()-b),i.isEnd&&d<0&&!i.params.loop||(d<0&&(d=0),a())},C=()=>{i.isEnd&&d<0&&!i.params.loop||i.destroyed||!i.autoplay.running||(b=(new Date).getTime(),f?(f=!1,x(d)):x(),i.autoplay.paused=!1,l("autoplayResume"))},P=()=>{if(i.destroyed||!i.autoplay.running)return;const e=a();"hidden"===e.visibilityState&&(f=!0,M(!0)),"visible"===e.visibilityState&&C()},L=e=>{"mouse"===e.pointerType&&(f=!0,g=!0,i.animating||i.autoplay.paused||M(!0))},A=e=>{"mouse"===e.pointerType&&(g=!1,i.autoplay.paused&&C())};n("init",(()=>{i.params.autoplay.enabled&&(i.params.autoplay.pauseOnMouseEnter&&(i.el.addEventListener("pointerenter",L),i.el.addEventListener("pointerleave",A)),a().addEventListener("visibilitychange",P),S())})),n("destroy",(()=>{i.el.removeEventListener("pointerenter",L),i.el.removeEventListener("pointerleave",A),a().removeEventListener("visibilitychange",P),i.autoplay.running&&T()})),n("_freeModeStaticRelease",(()=>{(u||f)&&C()})),n("_freeModeNoMomentumRelease",(()=>{i.params.autoplay.disableOnInteraction?T():M(!0,!0)})),n("beforeTransitionStart",((e,t,s)=>{!i.destroyed&&i.autoplay.running&&(s||!i.params.autoplay.disableOnInteraction?M(!0,!0):T())})),n("sliderFirstMove",(()=>{!i.destroyed&&i.autoplay.running&&(i.params.autoplay.disableOnInteraction?T():(p=!0,u=!1,f=!1,m=setTimeout((()=>{f=!0,u=!0,M(!0)}),200)))})),n("touchEnd",(()=>{if(!i.destroyed&&i.autoplay.running&&p){if(clearTimeout(m),clearTimeout(t),i.params.autoplay.disableOnInteraction)return u=!1,void(p=!1);u&&i.params.cssMode&&C(),u=!1,p=!1}})),n("slideChange",(()=>{!i.destroyed&&i.autoplay.running&&(h=!0)})),Object.assign(i.autoplay,{start:S,stop:T,pause:M,resume:C})},function(e){let{swiper:t,extendParams:s,on:i}=e;s({thumbs:{swiper:null,multipleActiveThumbs:!0,autoScrollOffset:0,slideThumbActiveClass:"swiper-slide-thumb-active",thumbsContainerClass:"swiper-thumbs"}});let r=!1,n=!1;function l(){const e=t.thumbs.swiper;if(!e||e.destroyed)return;const s=e.clickedIndex,a=e.clickedSlide;if(a&&a.classList.contains(t.params.thumbs.slideThumbActiveClass))return;if(null==s)return;let i;i=e.params.loop?parseInt(e.clickedSlide.getAttribute("data-swiper-slide-index"),10):s,t.params.loop?t.slideToLoop(i):t.slideTo(i)}function o(){const{thumbs:e}=t.params;if(r)return!1;r=!0;const s=t.constructor;if(e.swiper instanceof s)t.thumbs.swiper=e.swiper,Object.assign(t.thumbs.swiper.originalParams,{watchSlidesProgress:!0,slideToClickedSlide:!1}),Object.assign(t.thumbs.swiper.params,{watchSlidesProgress:!0,slideToClickedSlide:!1}),t.thumbs.swiper.update();else if(c(e.swiper)){const a=Object.assign({},e.swiper);Object.assign(a,{watchSlidesProgress:!0,slideToClickedSlide:!1}),t.thumbs.swiper=new s(a),n=!0}return t.thumbs.swiper.el.classList.add(t.params.thumbs.thumbsContainerClass),t.thumbs.swiper.on("tap",l),!0}function d(e){const s=t.thumbs.swiper;if(!s||s.destroyed)return;const a="auto"===s.params.slidesPerView?s.slidesPerViewDynamic():s.params.slidesPerView;let i=1;const r=t.params.thumbs.slideThumbActiveClass;if(t.params.slidesPerView>1&&!t.params.centeredSlides&&(i=t.params.slidesPerView),t.params.thumbs.multipleActiveThumbs||(i=1),i=Math.floor(i),s.slides.forEach((e=>e.classList.remove(r))),s.params.loop||s.params.virtual&&s.params.virtual.enabled)for(let e=0;e{e.classList.add(r)}));else for(let e=0;ee.getAttribute("data-swiper-slide-index")===`${t.realIndex}`))[0];r=s.slides.indexOf(e),o=t.activeIndex>t.previousIndex?"next":"prev"}else r=t.realIndex,o=r>t.previousIndex?"next":"prev";l&&(r+="next"===o?n:-1*n),s.visibleSlidesIndexes&&s.visibleSlidesIndexes.indexOf(r)<0&&(s.params.centeredSlides?r=r>i?r-Math.floor(a/2)+1:r+Math.floor(a/2)-1:r>i&&s.params.slidesPerGroup,s.slideTo(r,e?0:void 0))}}t.thumbs={swiper:null},i("beforeInit",(()=>{const{thumbs:e}=t.params;if(e&&e.swiper)if("string"==typeof e.swiper||e.swiper instanceof HTMLElement){const s=a(),i=()=>{const a="string"==typeof e.swiper?s.querySelector(e.swiper):e.swiper;if(a&&a.swiper)e.swiper=a.swiper,o(),d(!0);else if(a){const s=i=>{e.swiper=i.detail[0],a.removeEventListener("init",s),o(),d(!0),e.swiper.update(),t.update()};a.addEventListener("init",s)}return a},r=()=>{if(t.destroyed)return;i()||requestAnimationFrame(r)};requestAnimationFrame(r)}else o(),d(!0)})),i("slideChange update resize observerUpdate",(()=>{d()})),i("setTransition",((e,s)=>{const a=t.thumbs.swiper;a&&!a.destroyed&&a.setTransition(s)})),i("beforeDestroy",(()=>{const e=t.thumbs.swiper;e&&!e.destroyed&&n&&e.destroy()})),Object.assign(t.thumbs,{init:o,update:d})},function(e){let{swiper:t,extendParams:s,emit:a,once:i}=e;s({freeMode:{enabled:!1,momentum:!0,momentumRatio:1,momentumBounce:!0,momentumBounceRatio:1,momentumVelocityRatio:1,sticky:!1,minimumVelocity:.02}}),Object.assign(t,{freeMode:{onTouchStart:function(){if(t.params.cssMode)return;const e=t.getTranslate();t.setTranslate(e),t.setTransition(0),t.touchEventsData.velocities.length=0,t.freeMode.onTouchEnd({currentPos:t.rtl?t.translate:-t.translate})},onTouchMove:function(){if(t.params.cssMode)return;const{touchEventsData:e,touches:s}=t;0===e.velocities.length&&e.velocities.push({position:s[t.isHorizontal()?"startX":"startY"],time:e.touchStartTime}),e.velocities.push({position:s[t.isHorizontal()?"currentX":"currentY"],time:o()})},onTouchEnd:function(e){let{currentPos:s}=e;if(t.params.cssMode)return;const{params:r,wrapperEl:n,rtlTranslate:l,snapGrid:d,touchEventsData:c}=t,p=o()-c.touchStartTime;if(s<-t.minTranslate())t.slideTo(t.activeIndex);else if(s>-t.maxTranslate())t.slides.length1){const e=c.velocities.pop(),s=c.velocities.pop(),a=e.position-s.position,i=e.time-s.time;t.velocity=a/i,t.velocity/=2,Math.abs(t.velocity)150||o()-e.time>300)&&(t.velocity=0)}else t.velocity=0;t.velocity*=r.freeMode.momentumVelocityRatio,c.velocities.length=0;let e=1e3*r.freeMode.momentumRatio;const s=t.velocity*e;let p=t.translate+s;l&&(p=-p);let u,m=!1;const h=20*Math.abs(t.velocity)*r.freeMode.momentumBounceRatio;let f;if(pt.minTranslate())r.freeMode.momentumBounce?(p-t.minTranslate()>h&&(p=t.minTranslate()+h),u=t.minTranslate(),m=!0,c.allowMomentumBounce=!0):p=t.minTranslate(),r.loop&&r.centeredSlides&&(f=!0);else if(r.freeMode.sticky){let e;for(let t=0;t-p){e=t;break}p=Math.abs(d[e]-p){t.loopFix()})),0!==t.velocity){if(e=l?Math.abs((-p-t.translate)/t.velocity):Math.abs((p-t.translate)/t.velocity),r.freeMode.sticky){const s=Math.abs((l?-p:p)-t.translate),a=t.slidesSizesGrid[t.activeIndex];e=s{t&&!t.destroyed&&c.allowMomentumBounce&&(a("momentumBounce"),t.setTransition(r.speed),setTimeout((()=>{t.setTranslate(u),x(n,(()=>{t&&!t.destroyed&&t.transitionEnd()}))}),0))}))):t.velocity?(a("_freeModeNoMomentumRelease"),t.updateProgress(p),t.setTransition(e),t.setTranslate(p),t.transitionStart(!0,t.swipeDirection),t.animating||(t.animating=!0,x(n,(()=>{t&&!t.destroyed&&t.transitionEnd()})))):t.updateProgress(p),t.updateActiveIndex(),t.updateSlidesClasses()}else{if(r.freeMode.sticky)return void t.slideToClosest();r.freeMode&&a("_freeModeNoMomentumRelease")}(!r.freeMode.momentum||p>=r.longSwipesMs)&&(a("_freeModeStaticRelease"),t.updateProgress(),t.updateActiveIndex(),t.updateSlidesClasses())}}}})},function(e){let t,s,a,i,{swiper:r,extendParams:n,on:l}=e;n({grid:{rows:1,fill:"column"}});const o=()=>{let e=r.params.spaceBetween;return"string"==typeof e&&e.indexOf("%")>=0?e=parseFloat(e.replace("%",""))/100*r.size:"string"==typeof e&&(e=parseFloat(e)),e};l("init",(()=>{i=r.params.grid&&r.params.grid.rows>1})),l("update",(()=>{const{params:e,el:t}=r,s=e.grid&&e.grid.rows>1;i&&!s?(t.classList.remove(`${e.containerModifierClass}grid`,`${e.containerModifierClass}grid-column`),a=1,r.emitContainerClasses()):!i&&s&&(t.classList.add(`${e.containerModifierClass}grid`),"column"===e.grid.fill&&t.classList.add(`${e.containerModifierClass}grid-column`),r.emitContainerClasses()),i=s})),r.grid={initSlides:e=>{const{slidesPerView:i}=r.params,{rows:n,fill:l}=r.params.grid,o=r.virtual&&r.params.virtual.enabled?r.virtual.slides.length:e.length;a=Math.floor(o/n),t=Math.floor(o/n)===o/n?o:Math.ceil(o/n)*n,"auto"!==i&&"row"===l&&(t=Math.max(t,i*n)),s=t/n},unsetSlides:()=>{r.slides&&r.slides.forEach((e=>{e.swiperSlideGridSet&&(e.style.height="",e.style[r.getDirectionLabel("margin-top")]="")}))},updateSlide:(e,i,n)=>{const{slidesPerGroup:l}=r.params,d=o(),{rows:c,fill:p}=r.params.grid,u=r.virtual&&r.params.virtual.enabled?r.virtual.slides.length:n.length;let m,h,f;if("row"===p&&l>1){const s=Math.floor(e/(l*c)),a=e-c*l*s,r=0===s?l:Math.min(Math.ceil((u-s*c*l)/c),l);f=Math.floor(a/r),h=a-f*r+s*l,m=h+f*t/c,i.style.order=m}else"column"===p?(h=Math.floor(e/c),f=e-h*c,(h>a||h===a&&f===c-1)&&(f+=1,f>=c&&(f=0,h+=1))):(f=Math.floor(e/s),h=e-f*s);i.row=f,i.column=h,i.style.height=`calc((100% - ${(c-1)*d}px) / ${c})`,i.style[r.getDirectionLabel("margin-top")]=0!==f?d&&`${d}px`:"",i.swiperSlideGridSet=!0},updateWrapperSize:(e,s)=>{const{centeredSlides:a,roundLengths:i}=r.params,n=o(),{rows:l}=r.params.grid;if(r.virtualSize=(e+n)*t,r.virtualSize=Math.ceil(r.virtualSize/l)-n,r.params.cssMode||(r.wrapperEl.style[r.getDirectionLabel("width")]=`${r.virtualSize+n}px`),a){const e=[];for(let t=0;t{const{slides:e}=t;t.params.fadeEffect;for(let s=0;s{const s=t.slides.map((e=>h(e)));s.forEach((t=>{t.style.transitionDuration=`${e}ms`})),ce({swiper:t,duration:e,transformElements:s,allSlides:!0})},overwriteParams:()=>({slidesPerView:1,slidesPerGroup:1,watchSlidesProgress:!0,spaceBetween:0,virtualTranslate:!t.params.cssMode})})},function(e){let{swiper:t,extendParams:s,on:a}=e;s({cubeEffect:{slideShadows:!0,shadow:!0,shadowOffset:20,shadowScale:.94}});const i=(e,t,s)=>{let a=s?e.querySelector(".swiper-slide-shadow-left"):e.querySelector(".swiper-slide-shadow-top"),i=s?e.querySelector(".swiper-slide-shadow-right"):e.querySelector(".swiper-slide-shadow-bottom");a||(a=v("div",("swiper-slide-shadow-cube swiper-slide-shadow-"+(s?"left":"top")).split(" ")),e.append(a)),i||(i=v("div",("swiper-slide-shadow-cube swiper-slide-shadow-"+(s?"right":"bottom")).split(" ")),e.append(i)),a&&(a.style.opacity=Math.max(-t,0)),i&&(i.style.opacity=Math.max(t,0))};oe({effect:"cube",swiper:t,on:a,setTranslate:()=>{const{el:e,wrapperEl:s,slides:a,width:r,height:n,rtlTranslate:l,size:o,browser:d}=t,c=t.params.cubeEffect,p=t.isHorizontal(),u=t.virtual&&t.params.virtual.enabled;let m,h=0;c.shadow&&(p?(m=t.wrapperEl.querySelector(".swiper-cube-shadow"),m||(m=v("div","swiper-cube-shadow"),t.wrapperEl.append(m)),m.style.height=`${r}px`):(m=e.querySelector(".swiper-cube-shadow"),m||(m=v("div","swiper-cube-shadow"),e.append(m))));for(let e=0;e-1&&(h=90*r+90*m,l&&(h=90*-r-90*m),t.browser&&t.browser.isSafari&&Math.abs(h)/90%2==1&&(h+=.001)),s.style.transform=w,c.slideShadows&&i(s,m,p)}if(s.style.transformOrigin=`50% 50% -${o/2}px`,s.style["-webkit-transform-origin"]=`50% 50% -${o/2}px`,c.shadow)if(p)m.style.transform=`translate3d(0px, ${r/2+c.shadowOffset}px, ${-r/2}px) rotateX(89.99deg) rotateZ(0deg) scale(${c.shadowScale})`;else{const e=Math.abs(h)-90*Math.floor(Math.abs(h)/90),t=1.5-(Math.sin(2*e*Math.PI/360)/2+Math.cos(2*e*Math.PI/360)/2),s=c.shadowScale,a=c.shadowScale/t,i=c.shadowOffset;m.style.transform=`scale3d(${s}, 1, ${a}) translate3d(0px, ${n/2+i}px, ${-n/2/a}px) rotateX(-89.99deg)`}const f=(d.isSafari||d.isWebView)&&d.needPerspectiveFix?-o/2:0;s.style.transform=`translate3d(0px,0,${f}px) rotateX(${t.isHorizontal()?0:h}deg) rotateY(${t.isHorizontal()?-h:0}deg)`,s.style.setProperty("--swiper-cube-translate-z",`${f}px`)},setTransition:e=>{const{el:s,slides:a}=t;if(a.forEach((t=>{t.style.transitionDuration=`${e}ms`,t.querySelectorAll(".swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left").forEach((t=>{t.style.transitionDuration=`${e}ms`}))})),t.params.cubeEffect.shadow&&!t.isHorizontal()){const t=s.querySelector(".swiper-cube-shadow");t&&(t.style.transitionDuration=`${e}ms`)}},recreateShadows:()=>{const e=t.isHorizontal();t.slides.forEach((t=>{const s=Math.max(Math.min(t.progress,1),-1);i(t,s,e)}))},getEffectParams:()=>t.params.cubeEffect,perspective:()=>!0,overwriteParams:()=>({slidesPerView:1,slidesPerGroup:1,watchSlidesProgress:!0,resistanceRatio:0,spaceBetween:0,centeredSlides:!1,virtualTranslate:!0})})},function(e){let{swiper:t,extendParams:s,on:a}=e;s({flipEffect:{slideShadows:!0,limitRotation:!0}});const i=(e,s)=>{let a=t.isHorizontal()?e.querySelector(".swiper-slide-shadow-left"):e.querySelector(".swiper-slide-shadow-top"),i=t.isHorizontal()?e.querySelector(".swiper-slide-shadow-right"):e.querySelector(".swiper-slide-shadow-bottom");a||(a=pe("flip",e,t.isHorizontal()?"left":"top")),i||(i=pe("flip",e,t.isHorizontal()?"right":"bottom")),a&&(a.style.opacity=Math.max(-s,0)),i&&(i.style.opacity=Math.max(s,0))};oe({effect:"flip",swiper:t,on:a,setTranslate:()=>{const{slides:e,rtlTranslate:s}=t,a=t.params.flipEffect;for(let r=0;r{const s=t.slides.map((e=>h(e)));s.forEach((t=>{t.style.transitionDuration=`${e}ms`,t.querySelectorAll(".swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left").forEach((t=>{t.style.transitionDuration=`${e}ms`}))})),ce({swiper:t,duration:e,transformElements:s})},recreateShadows:()=>{t.params.flipEffect,t.slides.forEach((e=>{let s=e.progress;t.params.flipEffect.limitRotation&&(s=Math.max(Math.min(e.progress,1),-1)),i(e,s)}))},getEffectParams:()=>t.params.flipEffect,perspective:()=>!0,overwriteParams:()=>({slidesPerView:1,slidesPerGroup:1,watchSlidesProgress:!0,spaceBetween:0,virtualTranslate:!t.params.cssMode})})},function(e){let{swiper:t,extendParams:s,on:a}=e;s({coverflowEffect:{rotate:50,stretch:0,depth:100,scale:1,modifier:1,slideShadows:!0}}),oe({effect:"coverflow",swiper:t,on:a,setTranslate:()=>{const{width:e,height:s,slides:a,slidesSizesGrid:i}=t,r=t.params.coverflowEffect,n=t.isHorizontal(),l=t.translate,o=n?e/2-l:s/2-l,d=n?r.rotate:-r.rotate,c=r.depth;for(let e=0,s=a.length;e0?u:0),t&&(t.style.opacity=-u>0?-u:0)}}},setTransition:e=>{t.slides.map((e=>h(e))).forEach((t=>{t.style.transitionDuration=`${e}ms`,t.querySelectorAll(".swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left").forEach((t=>{t.style.transitionDuration=`${e}ms`}))}))},perspective:()=>!0,overwriteParams:()=>({watchSlidesProgress:!0})})},function(e){let{swiper:t,extendParams:s,on:a}=e;s({creativeEffect:{limitProgress:1,shadowPerProgress:!1,progressMultiplier:1,perspective:!0,prev:{translate:[0,0,0],rotate:[0,0,0],opacity:1,scale:1},next:{translate:[0,0,0],rotate:[0,0,0],opacity:1,scale:1}}});const i=e=>"string"==typeof e?e:`${e}px`;oe({effect:"creative",swiper:t,on:a,setTranslate:()=>{const{slides:e,wrapperEl:s,slidesSizesGrid:a}=t,r=t.params.creativeEffect,{progressMultiplier:n}=r,l=t.params.centeredSlides;if(l){const e=a[0]/2-t.params.slidesOffsetBefore||0;s.style.transform=`translateX(calc(50% - ${e}px))`}for(let s=0;s0&&(f=r.prev,h=!0),u.forEach(((e,t)=>{u[t]=`calc(${e}px + (${i(f.translate[t])} * ${Math.abs(d*n)}))`})),m.forEach(((e,s)=>{let a=f.rotate[s]*Math.abs(d*n);t.browser&&t.browser.isSafari&&Math.abs(a)/90%2==1&&(a+=.001),m[s]=a})),a.style.zIndex=-Math.abs(Math.round(o))+e.length;const g=u.join(", "),v=`rotateX(${m[0]}deg) rotateY(${m[1]}deg) rotateZ(${m[2]}deg)`,w=c<0?`scale(${1+(1-f.scale)*c*n})`:`scale(${1-(1-f.scale)*c*n})`,b=c<0?1+(1-f.opacity)*c*n:1-(1-f.opacity)*c*n,y=`translate3d(${g}) ${v} ${w}`;if(h&&f.shadow||!h){let e=a.querySelector(".swiper-slide-shadow");if(!e&&f.shadow&&(e=pe("creative",a)),e){const t=r.shadowPerProgress?d*(1/r.limitProgress):d;e.style.opacity=Math.min(Math.max(Math.abs(t),0),1)}}const E=de(0,a);E.style.transform=y,E.style.opacity=b,f.origin&&(E.style.transformOrigin=f.origin)}},setTransition:e=>{const s=t.slides.map((e=>h(e)));s.forEach((t=>{t.style.transitionDuration=`${e}ms`,t.querySelectorAll(".swiper-slide-shadow").forEach((t=>{t.style.transitionDuration=`${e}ms`}))})),ce({swiper:t,duration:e,transformElements:s,allSlides:!0})},perspective:()=>t.params.creativeEffect.perspective,overwriteParams:()=>({watchSlidesProgress:!0,virtualTranslate:!t.params.cssMode})})},function(e){let{swiper:t,extendParams:s,on:a}=e;s({cardsEffect:{slideShadows:!0,rotate:!0,perSlideRotate:2,perSlideOffset:8}}),oe({effect:"cards",swiper:t,on:a,setTranslate:()=>{const{slides:e,activeIndex:s,rtlTranslate:a}=t,i=t.params.cardsEffect,{startTranslate:r,isTouched:n}=t.touchEventsData,l=a?-t.translate:t.translate;for(let o=0;o0&&p<1&&(n||t.params.cssMode)&&l-1&&(n||t.params.cssMode)&&l>r;if(y||E){const e=(1-Math.abs((Math.abs(p)-.5)/.5))**.5;v+=-28*p*e,g+=-.5*e,w+=96*e,h=-25*e*Math.abs(p)+"%"}if(m=p<0?`calc(${m}px ${a?"-":"+"} (${w*Math.abs(p)}%))`:p>0?`calc(${m}px ${a?"-":"+"} (-${w*Math.abs(p)}%))`:`${m}px`,!t.isHorizontal()){const e=h;h=m,m=e}const x=p<0?""+(1+(1-g)*p):""+(1-(1-g)*p),S=`\n translate3d(${m}, ${h}, ${f}px)\n rotateZ(${i.rotate?a?-v:v:0}deg)\n scale(${x})\n `;if(i.slideShadows){let e=d.querySelector(".swiper-slide-shadow");e||(e=pe("cards",d)),e&&(e.style.opacity=Math.min(Math.max((Math.abs(p)-.5)/.5,0),1))}d.style.zIndex=-Math.abs(Math.round(c))+e.length;de(0,d).style.transform=S}},setTransition:e=>{const s=t.slides.map((e=>h(e)));s.forEach((t=>{t.style.transitionDuration=`${e}ms`,t.querySelectorAll(".swiper-slide-shadow").forEach((t=>{t.style.transitionDuration=`${e}ms`}))})),ce({swiper:t,duration:e,transformElements:s})},perspective:()=>!0,overwriteParams:()=>({watchSlidesProgress:!0,virtualTranslate:!t.params.cssMode})})}];return ee.use(ue),ee}(); +//# sourceMappingURL=swiper-bundle.min.js.map \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/js/modal.js b/wp-content/themes/cosmopet/static/js/modal.js new file mode 100644 index 0000000..4036f14 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/modal.js @@ -0,0 +1,116 @@ +// modal +modalOpen('.button--filter', '.modal__filter'); +modalOpen('.basket-open', '.modal__basket'); +modalOpen('.open-to-know', '.modal__to-know'); +modalOpen('.login-open', '.modal__login'); +modalClose('.modal__close'); + +let modal = document.querySelector('.modal'); + +modal.onclick = function (event) { + let target = event.target; + if (target.classList.contains('modal')) { + closeAllModals(); + } +} + +// function +function modalOpen(buttonElement, contentElement){ + let modal = document.querySelector('.modal'), + aside = document.querySelector('.modal__aside'), + elements = document.querySelectorAll(buttonElement), + device = window.screen.width, + body = document.querySelector('body'); + + elements.forEach(e => { + let thisContentElement = document.querySelector(contentElement); + + e.onclick = function () { + body.classList.add('overflow-hidden'); + modal.classList.add('active'); + thisContentElement.classList.add('active'); + + let width = thisContentElement.clientWidth; + if (width < 400){ + width = 400 + } + setTimeout(() => { + if (device <= 720) { + aside.style.width = `${device}px`; + thisContentElement.style.opacity = 1; + thisContentElement.style.filter = 'blur(0px)'; + }else{ + + aside.style.width = `${width}px`; + thisContentElement.style.opacity = 1; + thisContentElement.style.filter = 'blur(0px)'; + } + }, 10); + } + }) +} + +function closeAllModals() { + let modal = document.querySelector('.modal'), + aside = document.querySelector('.modal__aside'), + asideItems = document.querySelectorAll('.modal__item'), + body = document.querySelector('body'); + + aside.style.width = '0px'; + body.classList.remove('overflow-hidden'); + + asideItems.forEach(item => { + if (item.classList.contains('active')) { + item.style.opacity = 0; + item.style.filter = 'blur(10px)'; + } + }); + + setTimeout(() => { + asideItems.forEach(item => { + item.classList.remove('active'); + }); + modal.classList.remove('active'); + }, 300); +} + +function modalClose(buttonElement) { + let elements = document.querySelectorAll(buttonElement); + elements.forEach(e => { + e.onclick = closeAllModals; + }); +} + +// resize +window.addEventListener('resize', (e) => { + let width = window.screen.width; + + // media + modalOpen('.button--filter', '.modal__filter'); + modalOpen('.basket-open', '.modal__basket'); + modalOpen('.open-to-know', '.modal__to-know'); + modalOpen('.login-open', '.modal__login'); + modalClose('.modal__close'); + + let modalItem = document.querySelectorAll('.modal__item'); + + // if (width <= 720) { + modalItem.forEach(modal => { + if (modal.classList.contains('active')) { + let aside = document.querySelector('.modal__aside'); + + if (width <= 720) { + aside.style.width = `${width}px` + }else{ + let openAside = document.querySelector('.modal__item.active'), + newWidth = openAside.clientWidth; + if (newWidth < 400){ + newWidth = 400 + } + aside.style.width = `${newWidth}px` + } + } + }) + // } +}); +// resize \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/js/comments.js b/wp-content/themes/cosmopet/static/js/popups.js similarity index 100% rename from wp-content/themes/cosmopet/modules/blog/components/single/assets/js/comments.js rename to wp-content/themes/cosmopet/static/js/popups.js diff --git a/wp-content/themes/cosmopet/static/js/profile.js b/wp-content/themes/cosmopet/static/js/profile.js new file mode 100644 index 0000000..0033817 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/profile.js @@ -0,0 +1,96 @@ +'use strict'; + + +let widthPhoneCabinet = 1200; + +toggleOpenX('.cabinet-card__order', '.cabinet-card-order__open-detail', '.cabinet-card-order__detail', '.cabinet-card-order__block-detail'); + +function toggleOpenX(mainElement, buttonElement ,heightElement, contentElement, close) { + let elements = document.querySelectorAll(mainElement); + + elements.forEach(e => { + let thisMainElement = e, + thisButtonElement = e.querySelector(buttonElement), + thisHeightElement = e.querySelector(heightElement), + thisContentElement = e.querySelector(contentElement); + if (thisButtonElement){ +thisButtonElement.onclick = function (e) { + let height = thisHeightElement.clientHeight; + + if (close == true && !thisMainElement.classList.contains('active')) { + elements.forEach(e => { + if (e.classList.contains('active')) { + e.classList.remove('active'); + e.querySelector(contentElement).style.height = null + } + }) + } + + if (!thisMainElement.classList.contains('active')) { + thisContentElement.style.height = `${height}px`; + thisMainElement.classList.add('active'); + }else{ + thisContentElement.style.height = null; + thisMainElement.classList.remove('active'); + } + } + } + + + }); +} + +jQuery('.cabinet-card__button').on('click', function(){ + var id = jQuery(this).data('edit') + jQuery(`#pet_edit_` + id).addClass('active') +}) + +jQuery('.form-sub__btn').on('click', function(){ + jQuery(`#subForm`).addClass('active') +}) + +jQuery('.user-edit-open').on('click', function(){ + jQuery(`#user_edit`).addClass('active') +}) + +jQuery('.cabinet-card__block-add-pets').on('click', function(){ + jQuery(`#pet_add_form`).addClass('active') +}) + + +jQuery(document).ready(function ($) { + $('.subscription-address-form').on('submit', function (e) { + e.preventDefault(); + + var $form = $(this); + var $message = $form.find('.form-message'); + var subscriptionId = $form.data('subscription-id'); + var address = $form.find('input[name="address"]').val(); + var comment = $form.find('textarea[name="comment"]').val(); + var nonce = $form.find('input[name="address_nonce"]').val(); + + $message.hide().removeClass('success error').empty(); + + $.ajax({ + url: '/wp-admin/admin-ajax.php', // Defined in wp_localize_script + type: 'POST', + data: { + action: 'update_subscription_address', + subscription_id: subscriptionId, + address: address, + comment: comment, + address_nonce: nonce + }, + success: function (response) { + if (response.success) { + $message.addClass('success').text(response.data.message).show(); + } else { + $message.addClass('error').text(response.data.message).show(); + } + }, + error: function () { + + } + }); + }); +}); diff --git a/wp-content/themes/cosmopet/static/js/tags-in-wpf_filter.js b/wp-content/themes/cosmopet/static/js/tags-in-wpf_filter.js new file mode 100644 index 0000000..ba23fe8 --- /dev/null +++ b/wp-content/themes/cosmopet/static/js/tags-in-wpf_filter.js @@ -0,0 +1,76 @@ +document.addEventListener("DOMContentLoaded", () => { + const filterButtons = document.querySelectorAll('.product-tagitem'); + + filterButtons.forEach(button => { + button.addEventListener('click', () => { + const slug = button.dataset.slug; + const taxonomy = button.dataset.taxonomy; + + const param = 'wpf_filter_' + taxonomy; + const url = new URL(window.location.href); + const params = new URLSearchParams(url.search); + + if (params.has(param)) { + let values = params.get(param).split(','); + values = values.filter(v => v !== slug); + + if (values.length > 0) { + params.set(param, values.join(',')); + } else { + params.delete(param); + } + + url.search = params.toString(); + window.location.href = url.toString(); + } + }); + }); + + // Обработка клика на отдельные теги активных фильтров + const activeFilterTags = document.querySelectorAll('.active-filter-tag'); + activeFilterTags.forEach(tag => { + tag.addEventListener('click', () => { + const slug = tag.dataset.filterSlug; + const taxonomy = tag.dataset.filterTaxonomy; + + // Убираем префикс pa_ если есть для формирования параметра URL + const rawTaxonomy = taxonomy.replace('pa_', ''); + const param = 'wpf_filter_' + rawTaxonomy; + + const url = new URL(window.location.href); + const params = new URLSearchParams(url.search); + + if (params.has(param)) { + let values = params.get(param).split(','); + values = values.filter(v => v !== slug); + + if (values.length > 0) { + params.set(param, values.join(',')); + } else { + params.delete(param); + } + } + + url.search = params.toString(); + window.location.href = url.toString(); + }); + }); + + // Обработка кнопки "Очистить все" + const clearAllBtn = document.querySelector('.active-filters__clear'); + if (clearAllBtn) { + clearAllBtn.addEventListener('click', () => { + const url = new URL(window.location.href); + const params = new URLSearchParams(url.search); + + for (const key of Array.from(params.keys())) { + if (key.startsWith('wpf_')) { + params.delete(key); + } + } + + url.search = params.toString(); + window.location.href = url.toString(); + }); + } +}); \ No newline at end of file diff --git a/wp-content/themes/cosmopet/temp-functions/filters-logic.php b/wp-content/themes/cosmopet/temp-functions/filters-logic.php index 87c7b20..a4f27bf 100644 --- a/wp-content/themes/cosmopet/temp-functions/filters-logic.php +++ b/wp-content/themes/cosmopet/temp-functions/filters-logic.php @@ -1,5 +1,7 @@ 'Сайдбар для фильтров товаров', 'id' => 'sidebar_filters', diff --git a/wp-content/themes/cosmopet/temp-functions/woocommerce-logic.php b/wp-content/themes/cosmopet/temp-functions/woocommerce-logic.php index e2f8c0c..612151c 100644 --- a/wp-content/themes/cosmopet/temp-functions/woocommerce-logic.php +++ b/wp-content/themes/cosmopet/temp-functions/woocommerce-logic.php @@ -85,7 +85,7 @@ function get_products() { $context['ended'] = true; } - Timber::render( '_blocks/shop/archive-product-ajaxload.twig', $context ); + Timber::render( 'shop/archive-product-ajaxload-block.twig', $context ); die(); } diff --git a/wp-content/themes/cosmopet/templates/_pages/about.twig b/wp-content/themes/cosmopet/templates/about-page.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/_pages/about.twig rename to wp-content/themes/cosmopet/templates/about-page.twig diff --git a/wp-content/themes/cosmopet/templates/archive-product/archive-product-ajaxload.twig b/wp-content/themes/cosmopet/templates/archive-product/archive-product-ajaxload.twig deleted file mode 100644 index 7b476ec..0000000 --- a/wp-content/themes/cosmopet/templates/archive-product/archive-product-ajaxload.twig +++ /dev/null @@ -1,9 +0,0 @@ -{% for post in posts %} - {% include 'archive-product/archive-product-tease.twig' with {post: post} %} -{% endfor %} - -{% if not ended %} - -{% endif %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/archive-product/archive-product-tease.twig b/wp-content/themes/cosmopet/templates/archive-product/archive-product-tease.twig deleted file mode 100644 index 8bb76ab..0000000 --- a/wp-content/themes/cosmopet/templates/archive-product/archive-product-tease.twig +++ /dev/null @@ -1,121 +0,0 @@ -{% if post.id is defined and post.id %} - {% set cur_product = fn('wc_get_product', post.id) %} - {% set attrs = post.product.get_attributes() %} - {% set cur_weight = function('get_product_info', post.id, 'weight') %} - -
-
- {% if post.date('Y-m-d') >= criteria_for_new_product %} - - {{ function('pll_e', 'Новинка') }} - - {% endif %} - - {% if post._sale_price %} - - {{ function('pll_e', 'Распродажа %') }} - - {% endif %} -
- - {{ post.title }} - -
-
- {% set compound = fn('wc_get_product_terms', post.id, 'pa_compound') %} - {% for option in compound %} - - {% set term = get_term(option) %} - {{ term.name }} - {% endfor %} -
- {{ post.title }} -
-

{{ post._price() }} {{ fn('get_woocommerce_currency_symbol') }}

-
-
- -
-
-
-
- {{ post.title }} - -
    - {% set features = fn('wc_get_product_terms', post.id, 'pa_features') %} - {% for option in features %} - {% set term = get_term(option) %} -
  • {{ term.name }}
  • - {% endfor %} -
-
- -
-
- {% set collection = fn('wc_get_product_terms', post.id, 'pa_collection') %} - {% if collection %} -
-

{{ fn('pll_e', 'Объем') }}

- -
- -
-
    - - {% for option in collection %} - {% set term = get_term(option) %} - {% set siblings = function('get_collection_siblings' , term.id) %} - - {% for sibling in siblings %} - - {% set weight = function('get_product_info', sibling.ID, 'weight') %} - - {% set class = '' %} - {% if weight == cur_weight %} - {% set class = 'active' %} - {% endif %} -
  • - -
  • - {% endfor %} - {% endfor %} -
-
-
-
- {% endif %} -
-

{{ fn('pll_e', 'Количество') }}

- -
- - - -
-
-
-

- {{ post._price() }} -

-
-
- {{ function('get_add_to_cart_button', post.id) }} -
- -
-
-
-
-{% endif %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/archive-product/archive-product.twig b/wp-content/themes/cosmopet/templates/archive-product/archive-product.twig deleted file mode 100644 index fc1e64d..0000000 --- a/wp-content/themes/cosmopet/templates/archive-product/archive-product.twig +++ /dev/null @@ -1,157 +0,0 @@ -{% set bodyClass = 'bg-white' %} -{% set mainClass = 'wrapper' %} -{% extends 'layout.twig' %} - -{% block content %} - - {% if site_region == 'ru' %} - - {% endif %} - - - -
-
-

- {% if category %} - {{ category.name }} - {% else %} - {{ function('pll_e', 'Продукция') }} - {% endif %} -

- - -
- - {% if active_filters|length > 0 %} -
- {% if active_filters is not empty %} -
- {% for filter in active_filters %} - - {{ filter.name }} × - - {% endfor %} -
- {% endif %} - - -
- {% endif %} - -
- {% for post in posts %} - {% include 'archive-product/archive-product-tease.twig' with {post: post} %} - {% endfor %} -
- - -
- - - - -{% endblock %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/footer.twig b/wp-content/themes/cosmopet/templates/blocks-without-pages/footer-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/footer.twig rename to wp-content/themes/cosmopet/templates/blocks-without-pages/footer-block.twig diff --git a/wp-content/themes/cosmopet/templates/forms/discount.twig b/wp-content/themes/cosmopet/templates/blocks-without-pages/forms/discount-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/forms/discount.twig rename to wp-content/themes/cosmopet/templates/blocks-without-pages/forms/discount-block.twig diff --git a/wp-content/themes/cosmopet/templates/header.twig b/wp-content/themes/cosmopet/templates/blocks-without-pages/header-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/header.twig rename to wp-content/themes/cosmopet/templates/blocks-without-pages/header-block.twig diff --git a/wp-content/themes/cosmopet/templates/modal.twig b/wp-content/themes/cosmopet/templates/blocks-without-pages/modal-block.twig similarity index 93% rename from wp-content/themes/cosmopet/templates/modal.twig rename to wp-content/themes/cosmopet/templates/blocks-without-pages/modal-block.twig index 3b3490d..698b03d 100644 --- a/wp-content/themes/cosmopet/templates/modal.twig +++ b/wp-content/themes/cosmopet/templates/blocks-without-pages/modal-block.twig @@ -14,7 +14,7 @@ - {% include 'modal/basket.twig' %} + {% include 'blocks-without-pages/modal/basket-block.twig' %} - {% include 'modal/login.twig' %} + {% include 'blocks-without-pages/modal/login-block.twig' %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/modal/basket.twig b/wp-content/themes/cosmopet/templates/blocks-without-pages/modal/basket-block.twig similarity index 81% rename from wp-content/themes/cosmopet/templates/modal/basket.twig rename to wp-content/themes/cosmopet/templates/blocks-without-pages/modal/basket-block.twig index 886371f..cf4cf3a 100644 --- a/wp-content/themes/cosmopet/templates/modal/basket.twig +++ b/wp-content/themes/cosmopet/templates/blocks-without-pages/modal/basket-block.twig @@ -11,11 +11,11 @@ \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/modal/login.twig b/wp-content/themes/cosmopet/templates/blocks-without-pages/modal/login-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/modal/login.twig rename to wp-content/themes/cosmopet/templates/blocks-without-pages/modal/login-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog/author-banner.twig b/wp-content/themes/cosmopet/templates/blog/author-banner-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog/author-banner.twig rename to wp-content/themes/cosmopet/templates/blog/author-banner-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog/blog-archive.twig b/wp-content/themes/cosmopet/templates/blog/blog-archive-page.twig similarity index 79% rename from wp-content/themes/cosmopet/templates/blog/blog-archive.twig rename to wp-content/themes/cosmopet/templates/blog/blog-archive-page.twig index f36babb..4495c2a 100644 --- a/wp-content/themes/cosmopet/templates/blog/blog-archive.twig +++ b/wp-content/themes/cosmopet/templates/blog/blog-archive-page.twig @@ -8,7 +8,7 @@

{{blog_title}}

{{blog_desc}}

- {% include '/blog/featured-slider.twig' %} + {% include '/blog/featured-slider-block.twig' %}
@@ -16,14 +16,14 @@
- {% include '/blog/themes.twig' %} - {% include '/blog/most-read.twig' %} + {% include '/blog/themes-block.twig' %} + {% include '/blog/most-read-block.twig' %}

{{ function('pll_e', 'ВСЕ СТАТЬИ') }}

    - {% include '/blog/news-list.twig' %} + {% include '/blog/news-list-block.twig' %}
{% if total_pages > 1 %} @@ -39,11 +39,11 @@ - {% include '/blog/author-banner.twig' %} + {% include '/blog/author-banner-block.twig' %} - {% include '/blog/editorial.twig' %} + {% include '/blog/editorial-block.twig' %} {% endblock %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/blog/blog-page.twig b/wp-content/themes/cosmopet/templates/blog/blog-page.twig deleted file mode 100644 index ee4340e..0000000 --- a/wp-content/themes/cosmopet/templates/blog/blog-page.twig +++ /dev/null @@ -1,839 +0,0 @@ -{% extends 'layout.twig' %} - -{% block content %} -{% set bodyClass = 'bg-white' %} - -
-
-
-

- -

-
-

-
- -
- -
-
-
-
- - -
-
-
-
-
-
- user_firstname; - $last_name = $current_user->user_lastname;?> -

- ID, 'billing_phone', true ); - - if($first_name || $last_name): - echo $first_name . ' ' . $last_name; - else: - ?> - - - -

-
- -
-

:

-

- - - -

-
- -
-

:

- user_email): ?> -

user_email ?>

- -

- -

- - -

- - - -
- -
- -
- - ID, ' Traveling', true ); - ?> -
-

:

-

- - - - - -

-
- -
-
- - - - - -
-
-
-
- - 'pets', // Тип постов - 'meta_query' => array( - array( - 'key' => 'user', // Имя метаполя - 'value' => $current_user_id, // Значение метаполя (ID текущего пользователя) - 'compare' => '=' // Условие сравнения - ) - ) - ); - - // Создаем новый объект WP_Query - $query = new \WP_Query($args); - - if ($query->have_posts()) { - // Начинаем цикл по постам - while ($query->have_posts()) { - $query->the_post(); - get_pet_card($post); - } - // Сбрасываем данные постов - wp_reset_postdata(); - } - } - ?> - -
-
- -
-
-
-
-
-
-

- -

-
-

-
- -
- -
-
-
- - $current_user->ID, - ) ); - - if ($customer_orders): - foreach($customer_orders as $order): - $meta_data = get_post_meta($order->get_id(), 'order_data', true); - $shipping_address = $order->get_address( 'shipping' ); - ?> -
-
-
-
-
-

get_date_created()->date('Y.m.d') ?>

-

get_id() ?>

-
-
-

:

-

get_total() ?>

-
-
-
-
- -
-
-
-

-

- '; - echo json_decode($api->getOffices(['code' => $meta_data['office_code']])['body'])[0]->name; - ?> - - -

-
- -
-
- get_items() as $item_id => $item) : - $product_name = $item->get_name(); - $product_quantity = $item->get_quantity(); - $product_total = $item->get_total(); - $product = $item->get_product(); - - if ($product){ - $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $product->get_id() ), 'thumbnail' ); - } - else{ - $thumbnail = ''; - } - ?> -
- - -
-
-

- -
- -

- -

-
-
- -
- - -
-
-
- - -
- -
- get_items() as $item_id => $item) : - $product = $item->get_product(); - if ($product){ - $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $product->get_id() ), 'thumbnail' ); - } - else{ - $thumbnail = ''; - } - ?> - - - - -
-
-
-
-
- -
-
-

-
-
- -

-
-
-
- -
-
-
- - 'pets', // Тип постов - 'meta_query' => array( - array( - 'key' => 'user', // Имя метаполя - 'value' => $current_user_id, // Значение метаполя (ID текущего пользователя) - 'compare' => '=' // Условие сравнения - ) - ) -); - -// Создаем новый объект WP_Query -$query = new \WP_Query($args); - -if ($query->have_posts()) { - // Начинаем цикл по постам - while ($query->have_posts()) { - $query->the_post(); - - switch (get_field('weight')){ - case ('below_1_5'): - $w = esc_html__('from 0,5 kg to 1,5 kg', '_pll_e' ); - break; - case ('1_5-3'): - $w = esc_html__('from 1.5 to 3 kg', '_pll_e' ); - break; - case ('3-5'): - $w = esc_html__('from 3 to 5 kg', '_pll_e' ); - break; - case ('5-8'): - $w = esc_html__('from 5 to 8 kg', '_pll_e' ); - break; - case ('8-11'): - $w = esc_html__('from 8 to 11 kg', '_pll_e' ); - break; - case ('11-15'): - $w = esc_html__('from 11 to 15 kg', '_pll_e' ); - break; - case ('15-20'): - $w = esc_html__('from 15 to 20 kg', '_pll_e' ); - break; - case ('20-25'): - $w = esc_html__('from 20 to 25 kg', '_pll_e' ); - break; - case ('25-35'): - $w = esc_html__('from 25 to 35 kg', '_pll_e' ); - break; - case ('more_35'): - $w = esc_html__('More than 35 kg', '_pll_e' ); - break; - } - switch (get_field('old')){ - case ('normal'): - $old = __('Adult (from 1 year to 7 years)', '_pll_e' ); - break; - case ('old'): - $old = __('Elderly (from 7 to 12 years)', '_pll_e' ); - break; - case ('very_old'): - $old = __('Aging (12 years and older)', '_pll_e' ); - break; - case ('baby'): - $old = __('Baby (from 0 to 1 year)', '_pll_e' ); - break; - } - switch (get_field('activity')){ - case ('low'): - $act = esc_html__('Low', '_pll_e' ); - break; - case ('moderate'): - $act = esc_html__('Moderate', '_pll_e' ); - break; - case ('high'): - $act = esc_html__('High', '_pll_e' ); - break; - } - ?> - - -
-
diff --git a/wp-content/themes/cosmopet/templates/comment/comment.twig b/wp-content/themes/cosmopet/templates/blog/comment-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/comment/comment.twig rename to wp-content/themes/cosmopet/templates/blog/comment-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog/editorial.twig b/wp-content/themes/cosmopet/templates/blog/editorial-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog/editorial.twig rename to wp-content/themes/cosmopet/templates/blog/editorial-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog/featured-slider.twig b/wp-content/themes/cosmopet/templates/blog/featured-slider-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog/featured-slider.twig rename to wp-content/themes/cosmopet/templates/blog/featured-slider-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog/most-read.twig b/wp-content/themes/cosmopet/templates/blog/most-read-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog/most-read.twig rename to wp-content/themes/cosmopet/templates/blog/most-read-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog/news-list.twig b/wp-content/themes/cosmopet/templates/blog/news-list-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog/news-list.twig rename to wp-content/themes/cosmopet/templates/blog/news-list-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog/themes.twig b/wp-content/themes/cosmopet/templates/blog/themes-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog/themes.twig rename to wp-content/themes/cosmopet/templates/blog/themes-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog_author/author-archive.twig b/wp-content/themes/cosmopet/templates/blog_author/author-archive-page.twig similarity index 90% rename from wp-content/themes/cosmopet/templates/blog_author/author-archive.twig rename to wp-content/themes/cosmopet/templates/blog_author/author-archive-page.twig index 86fb50f..526f105 100644 --- a/wp-content/themes/cosmopet/templates/blog_author/author-archive.twig +++ b/wp-content/themes/cosmopet/templates/blog_author/author-archive-page.twig @@ -43,11 +43,11 @@ - {% include 'forms/discount.twig' %} + {% include 'blocks-without-pages/forms/discount-block.twig' %}
- {% include '/blog/featured-slider.twig' %} + {% include 'blog/featured-slider-block.twig' %}
diff --git a/wp-content/themes/cosmopet/templates/blog_author/author-posts-list.twig b/wp-content/themes/cosmopet/templates/blog_author/author-posts-list-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog_author/author-posts-list.twig rename to wp-content/themes/cosmopet/templates/blog_author/author-posts-list-block.twig diff --git a/wp-content/themes/cosmopet/templates/blog_author/author-single.twig b/wp-content/themes/cosmopet/templates/blog_author/author-single-page.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/blog_author/author-single.twig rename to wp-content/themes/cosmopet/templates/blog_author/author-single-page.twig diff --git a/wp-content/themes/cosmopet/templates/_pages/front-page.twig b/wp-content/themes/cosmopet/templates/front-page.twig similarity index 97% rename from wp-content/themes/cosmopet/templates/_pages/front-page.twig rename to wp-content/themes/cosmopet/templates/front-page.twig index c2cc6c9..9f6844a 100644 --- a/wp-content/themes/cosmopet/templates/_pages/front-page.twig +++ b/wp-content/themes/cosmopet/templates/front-page.twig @@ -184,7 +184,7 @@ {% endif %} - {% include 'shop/bestsellers.twig' %} + {% include 'shop/bestsellers-block.twig' %} {% if show_rev %} @@ -907,7 +907,7 @@ {% if show_promo %} {% set class = 'discount_block' %} - {% include 'forms/discount.twig' %} + {% include 'blocks-without-pages/forms/discount-block.twig' %} {% endif %} {% endblock %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/layout.twig b/wp-content/themes/cosmopet/templates/layout.twig index d7472d2..9a7762f 100644 --- a/wp-content/themes/cosmopet/templates/layout.twig +++ b/wp-content/themes/cosmopet/templates/layout.twig @@ -82,13 +82,13 @@ - {% include 'header.twig' %} + {% include 'blocks-without-pages/header-block.twig' %}
{% block content %} {% endblock %} - {% include 'modal.twig' %} + {% include 'blocks-without-pages/modal-block.twig' %}
- {% include 'footer.twig' %} + {% include 'blocks-without-pages/footer-block.twig' %} {{ function('wp_footer') }} diff --git a/wp-content/themes/cosmopet/templates/_pages/production.twig b/wp-content/themes/cosmopet/templates/production-page.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/_pages/production.twig rename to wp-content/themes/cosmopet/templates/production-page.twig diff --git a/wp-content/themes/cosmopet/templates/pet-card.twig b/wp-content/themes/cosmopet/templates/profile/pet-card-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/pet-card.twig rename to wp-content/themes/cosmopet/templates/profile/pet-card-block.twig diff --git a/wp-content/themes/cosmopet/templates/profile/profile.twig b/wp-content/themes/cosmopet/templates/profile/profile-information-page.twig similarity index 98% rename from wp-content/themes/cosmopet/templates/profile/profile.twig rename to wp-content/themes/cosmopet/templates/profile/profile-information-page.twig index 7b79b8a..2aef25e 100644 --- a/wp-content/themes/cosmopet/templates/profile/profile.twig +++ b/wp-content/themes/cosmopet/templates/profile/profile-information-page.twig @@ -1,6 +1,6 @@ {% set profile_pg = 1 %} -{% extends 'profile/profile-base.twig' %} +{% extends 'profile/profile-layout.twig' %} {% block profile_content%}
diff --git a/wp-content/themes/cosmopet/templates/profile/profile-base.twig b/wp-content/themes/cosmopet/templates/profile/profile-layout.twig similarity index 98% rename from wp-content/themes/cosmopet/templates/profile/profile-base.twig rename to wp-content/themes/cosmopet/templates/profile/profile-layout.twig index 45e31c5..ed0d4e2 100644 --- a/wp-content/themes/cosmopet/templates/profile/profile-base.twig +++ b/wp-content/themes/cosmopet/templates/profile/profile-layout.twig @@ -122,7 +122,7 @@ {% if pets %} {% for pet in pets %} - {% include 'pet-card.twig' with { 'item': pet } %} + {% include 'profile/pet-card-block.twig' with { 'item': pet } %} {% endfor %} {% endif %} diff --git a/wp-content/themes/cosmopet/templates/profile/profile-orders.twig b/wp-content/themes/cosmopet/templates/profile/profile-orders-page.twig similarity index 97% rename from wp-content/themes/cosmopet/templates/profile/profile-orders.twig rename to wp-content/themes/cosmopet/templates/profile/profile-orders-page.twig index 791538a..19d04a1 100644 --- a/wp-content/themes/cosmopet/templates/profile/profile-orders.twig +++ b/wp-content/themes/cosmopet/templates/profile/profile-orders-page.twig @@ -1,4 +1,4 @@ -{% extends 'profile/profile-base.twig' %} +{% extends 'profile/profile-layout.twig' %} {% block profile_content%}
diff --git a/wp-content/themes/cosmopet/templates/profile/profile-subs.twig b/wp-content/themes/cosmopet/templates/profile/profile-subs-page.twig similarity index 97% rename from wp-content/themes/cosmopet/templates/profile/profile-subs.twig rename to wp-content/themes/cosmopet/templates/profile/profile-subs-page.twig index 99e0427..63ee64a 100644 --- a/wp-content/themes/cosmopet/templates/profile/profile-subs.twig +++ b/wp-content/themes/cosmopet/templates/profile/profile-subs-page.twig @@ -1,4 +1,4 @@ -{% extends 'profile/profile-base.twig' %} +{% extends 'profile/profile-layout.twig' %} {% block profile_content %}
diff --git a/wp-content/themes/cosmopet/templates/profile/profile-subs-single.twig b/wp-content/themes/cosmopet/templates/profile/profile-subs-single-page.twig similarity index 97% rename from wp-content/themes/cosmopet/templates/profile/profile-subs-single.twig rename to wp-content/themes/cosmopet/templates/profile/profile-subs-single-page.twig index ff1f0ee..15c56ed 100644 --- a/wp-content/themes/cosmopet/templates/profile/profile-subs-single.twig +++ b/wp-content/themes/cosmopet/templates/profile/profile-subs-single-page.twig @@ -1,4 +1,4 @@ -{% extends 'profile/profile-base.twig' %} +{% extends 'profile/profile-layout.twig' %} {% block profile_content %} diff --git a/wp-content/themes/cosmopet/templates/profile/template-profile.php b/wp-content/themes/cosmopet/templates/profile/template-profile.php deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/templates/_blocks/shop/archive-product-ajaxload.twig b/wp-content/themes/cosmopet/templates/shop/archive-product-ajaxload-block.twig similarity index 74% rename from wp-content/themes/cosmopet/templates/_blocks/shop/archive-product-ajaxload.twig rename to wp-content/themes/cosmopet/templates/shop/archive-product-ajaxload-block.twig index 8a7ec0c..7a6d5b7 100644 --- a/wp-content/themes/cosmopet/templates/_blocks/shop/archive-product-ajaxload.twig +++ b/wp-content/themes/cosmopet/templates/shop/archive-product-ajaxload-block.twig @@ -1,5 +1,5 @@ {% for post in posts %} - {% include '_blocks/shop/archive-product-tease.twig' with {post: post} %} + {% include 'shop/archive-product-card-block.twig' with {post: post} %} {% endfor %} {% if not ended %} diff --git a/wp-content/themes/cosmopet/templates/_blocks/shop/archive-product-tease.twig b/wp-content/themes/cosmopet/templates/shop/archive-product-card-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/_blocks/shop/archive-product-tease.twig rename to wp-content/themes/cosmopet/templates/shop/archive-product-card-block.twig diff --git a/wp-content/themes/cosmopet/templates/_pages/shop/archive-product.twig b/wp-content/themes/cosmopet/templates/shop/archive-product-page.twig similarity index 95% rename from wp-content/themes/cosmopet/templates/_pages/shop/archive-product.twig rename to wp-content/themes/cosmopet/templates/shop/archive-product-page.twig index 4e8c738..7d89c3a 100644 --- a/wp-content/themes/cosmopet/templates/_pages/shop/archive-product.twig +++ b/wp-content/themes/cosmopet/templates/shop/archive-product-page.twig @@ -61,7 +61,7 @@
{% for post in posts %} - {% include '_blocks/shop/archive-product-tease.twig' with {post: post} %} + {% include 'shop/archive-product-card-block.twig' with {post: post} %} {% endfor %}
diff --git a/wp-content/themes/cosmopet/templates/shop/bestsellers.twig b/wp-content/themes/cosmopet/templates/shop/bestsellers-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/shop/bestsellers.twig rename to wp-content/themes/cosmopet/templates/shop/bestsellers-block.twig diff --git a/wp-content/themes/cosmopet/templates/shop/cart-bottom.twig b/wp-content/themes/cosmopet/templates/shop/cart-bottom-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/shop/cart-bottom.twig rename to wp-content/themes/cosmopet/templates/shop/cart-bottom-block.twig diff --git a/wp-content/themes/cosmopet/templates/shop/cart-contents.twig b/wp-content/themes/cosmopet/templates/shop/cart-contents-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/shop/cart-contents.twig rename to wp-content/themes/cosmopet/templates/shop/cart-contents-block.twig diff --git a/wp-content/themes/cosmopet/templates/shop/checkout.twig b/wp-content/themes/cosmopet/templates/shop/checkout-page.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/shop/checkout.twig rename to wp-content/themes/cosmopet/templates/shop/checkout-page.twig diff --git a/wp-content/themes/cosmopet/templates/shop/index.php b/wp-content/themes/cosmopet/templates/shop/index.php deleted file mode 100644 index d800886..0000000 --- a/wp-content/themes/cosmopet/templates/shop/index.php +++ /dev/null @@ -1 +0,0 @@ -123 \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/shop/review-order.twig b/wp-content/themes/cosmopet/templates/shop/review-order-block.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/shop/review-order.twig rename to wp-content/themes/cosmopet/templates/shop/review-order-block.twig diff --git a/wp-content/themes/cosmopet/templates/shop/shop.twig b/wp-content/themes/cosmopet/templates/shop/shop.twig deleted file mode 100644 index e69de29..0000000 diff --git a/wp-content/themes/cosmopet/modules/shop/components/single-product/component-template.twig b/wp-content/themes/cosmopet/templates/shop/single-product-page.twig similarity index 100% rename from wp-content/themes/cosmopet/modules/shop/components/single-product/component-template.twig rename to wp-content/themes/cosmopet/templates/shop/single-product-page.twig diff --git a/wp-content/themes/cosmopet/templates/shop/single-product.php b/wp-content/themes/cosmopet/templates/shop/single-product.php deleted file mode 100644 index 59884cb..0000000 --- a/wp-content/themes/cosmopet/templates/shop/single-product.php +++ /dev/null @@ -1,63 +0,0 @@ - '', - 'wrap_before' => '', - 'wrap_after' => '', - 'before' => '', - 'after' => '', - 'home' => _x('Home', 'breadcrumb', 'woocommerce'), - ); - - $breadcrumbs = new WC_Breadcrumb(); - $breadcrumbs->generate(); - - $formatted_breadcrumbs = array(); - foreach ($breadcrumbs->get_breadcrumb() as $crumb) { - $formatted_breadcrumbs[] = array( - 'text' => $crumb[0], - 'url' => $crumb[1] - ); - } - - $context['wc_breadcrumbs'] = $formatted_breadcrumbs; - } - - - $product_id = get_the_ID(); - $product = wc_get_product($product_id); - - $context['product'] = $product; - - $context['related_products'] = array(); - $related_products_ids = wc_get_related_products($product_id, 5); - - if ($related_products_ids) { - foreach ($related_products_ids as $related_id) { - $related_product = wc_get_product($related_id); - if ($related_product) { - $context['related_products'][] = $related_product; - } - } - } - - Timber::render('modules/shop/components/single-product/component-template.twig', $context); -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/_pages/wtb.twig b/wp-content/themes/cosmopet/templates/where-to-buy-page.twig similarity index 100% rename from wp-content/themes/cosmopet/templates/_pages/wtb.twig rename to wp-content/themes/cosmopet/templates/where-to-buy-page.twig diff --git a/wp-content/themes/cosmopet/woocommerce/single-product.php b/wp-content/themes/cosmopet/woocommerce/single-product.php index 16272d7..74f0460 100644 --- a/wp-content/themes/cosmopet/woocommerce/single-product.php +++ b/wp-content/themes/cosmopet/woocommerce/single-product.php @@ -4,16 +4,59 @@ if ( ! defined( 'ABSPATH' ) ) { exit; } -get_header(); +if (is_product()) { -$template_path = 'templates/shop/single-product.php'; -if (file_exists(get_template_directory() . '/' . $template_path)) { - include_once get_template_directory() . '/' . $template_path; -} else { + include_module('shop'); + include_component('shop', 'single-product'); + + $context = Timber::get_context(); + $post = Timber::get_post(); + $context['post'] = $post; + - while (have_posts()) : the_post(); - wc_get_template_part('content', 'single-product'); - endwhile; + $context['wc_breadcrumbs'] = array(); + + if (function_exists('woocommerce_breadcrumb')) { + $args = array( + 'delimiter' => '', + 'wrap_before' => '', + 'wrap_after' => '', + 'before' => '', + 'after' => '', + 'home' => _x('Home', 'breadcrumb', 'woocommerce'), + ); + + $breadcrumbs = new WC_Breadcrumb(); + $breadcrumbs->generate(); + + $formatted_breadcrumbs = array(); + foreach ($breadcrumbs->get_breadcrumb() as $crumb) { + $formatted_breadcrumbs[] = array( + 'text' => $crumb[0], + 'url' => $crumb[1] + ); + } + + $context['wc_breadcrumbs'] = $formatted_breadcrumbs; + } + + + $product_id = get_the_ID(); + $product = wc_get_product($product_id); + + $context['product'] = $product; + + $context['related_products'] = array(); + $related_products_ids = wc_get_related_products($product_id, 5); + + if ($related_products_ids) { + foreach ($related_products_ids as $related_id) { + $related_product = wc_get_product($related_id); + if ($related_product) { + $context['related_products'][] = $related_product; + } + } + } + + Timber::render('shop/single-product-page.twig', $context); } - -get_footer(); \ No newline at end of file