/*
Castomizer Stylesheet
*/

/* 
   << БЛОК ПЕРЕМЕННЫХ 
*/

/* Шрифты - НАСТРАИВАЮТСЯ ОЧЕНЬ ПРОСТО ЧЕРЕЗ theme.JSON (стр.~326 объект - "typography") + Редактор для размеров заголовков и основного текста глобально.
Причем functions.php использовать не нужно */
/*

/* 1) Тени*/
body {
    --owner--box--shadow--normal: 5px 5px 20px rgba(0, 0, 0, 0.13),
        -5px -5px 20px rgba(0, 0, 0, 0.13);
}
/* >> КОНЕЦ БЛОКА ПЕРЕМЕННЫХ*/

/*
    ГЛОБАЛЬНЫЕ ЭЛЕМЕНТЫ  + модификаторы + псевдоклассы/элементы (форматы текста, заголовков, ссылки, списки, кнопки и т.д.)
    ИСПРАВЛЕНИЕ БАГОВ WP
*/

/* 1) достилизация блоков*/
/* 1.1) для некоторых блока колонок (flex) задаем доп.стили justification*/
body .is-layout-flex.owner-content-justification-center {
    justify-content: center;
}
body .is-layout-flex.owner-content-justification-space-between {
    justify-content: space-between;
}
body .is-layout-flex.owner-content-justification-space-around {
    justify-content: space-around;
}
/* 1.2) для блоков с изображениями добавляем класс прижимания img кверху*/
.wp-block-image.owner-vertical-align-top img {
    vertical-align: top;
}
/* 1.3) для некоторых внутренних блоков (например, wp-block-group) добавляем возможность растягиваться на всю ширину родительского блока*/
.owner-block-is-layout-full-size {
    width: 100%;
}

/* 2) Ссылки */
/* 2.1) Уубираем линию обводки при фокусировании на линк*/
.wp-site-blocks *:focus {
    outline: none;
}
/* 2.2) содержимое ссылок делаем - так чтобы в дальнейшем работало свойство width без переноса для гармоничной отрисовки */
a {
    display: inline-block;
}
:where(header.wp-block-template-part, footer.wp-block-template-part) a {
    width: max-content;
}
/* 2.3) убираем подчеркивание ссылки по умолчанию (т.к. тэг <p> обрамляяет тэг <a> */
p a {
    text-decoration: none;
}
/* 3) тени*/
/* 3.1) небольшая тень*/
/* 3.2) нормальная тень*/
.owner-box-shadow-normal {
    box-shadow: var(--owner--box--shadow--normal);
}
/* 3.3) большая тень*/

/* 4) вводим новый класс для изменения позиционирование некоторых wp-block-group в шаблонах Домашняя страница, Страницы и др., чтобы устранить невозможность изменить z-index для корректной отрисовки меню и сразу устанавливаем z-index */
.wp-block-group.owner-lowered-z-index {
    position: relative;
    z-index: 0;
}

/* 5) Исправление багов WP */
/* 5.1) Глюки блока поиск. 
/* 5.1.1) Устраняем рассогласование радиусов блока form и оболочки в которой input и предустановленный бордер у оболочки кнопки и всего блока.
Настройка блока Поиска делаем глобально, тогда в шаблонах не нужно настраивать.Убираем отступ margin-block-start установленный для потомков is-layout-flow по всему сайту. До этого проекта проблем не было :)) */
.owner-header-form-search .wp-block-search__inside-wrapper {
    border-radius: inherit !important;
    border: none !important;
    margin-block-start: 0;
}
/* 5.1.2) Убираем отступ margin-block-start установленный для потомков is-layout-flow по всему сайту. До этого проекта проблем не было :)) */
.owner-header-form-search .wp-block-search__label {
    display: none;
}

/* 7) Вывод постов */
ul.wp-block-post-template
    > li.wp-block-post
    > .wp-block-post-featured-image
    img.wp-post-image {
    box-shadow: var(--owner--box--shadow--normal);
}

/* 8) Скрытые элементы */
.displayed-none {
    display: none;
}

/* 9) Строки с телефонами при наведении */
.owner-phones-string:hover i.fa {
    color: var(--wp--preset--color--active-link);
}

/* 10) Стили для динамического изменения элементов при фокусировке, наведении и т.д.*/
.owner-style-scale {
    transition: all .2s
}
.owner-style-scale:where(:hover, :focus) {
    transform: scale(1.05);
    transition: all .2s;
}

/* >> КОНЕЦ ГЛОБАЛЬНЫХ ЭЛЕМЕНТОВ */

/* 
    << HEADER/FOOTER 
*/
:where(.wp-site-blocks) > * {
    margin-block-start: 0;
}
/* 1) Header*/
/* 1.1) Поиск */
#idHeaderFirstLine form.wp-block-search {
    width: clamp(200px, 50vw, 800px);
    box-shadow: var(--owner--box--shadow--normal);
    border-radius: 5px;
}

/* 2) Footer */
/* 2.1) Переводим колоночную схему установленную в редакторе на отзывчивую грид-схему. Учитываем, что ширина секции 95%, т.к. гриды игнорируют этот параметр (почему - х.з.?)*/
#idOwnerMainFooterContainer .owner-footer-grid-wrapper {
    display: grid;
    /*grid-template-columns: 10% 20% 20% 25% 20%;*/
    grid-template-columns: repeat(4, 1fr);
}
/* подгоняем размер заголовков - поменьше */
@media screen and (max-width: 1485px) {
    #idOwnerMainFooterContainer .owner-footer-grid-wrapper h3.wp-block-heading {
        font-size: var(--wp--preset--font-size--normal-plus);
    }
}
/* переход на 3-х колоночную систему при начальной - 5-колоночной*
@media screen and (max-width: 1240px) {
    #idOwnerMainFooterContainer .owner-footer-grid-wrapper {
        grid-template-columns: repeat(3, 1fr);
    }
}*/
/* переход на 2-х колоночную систему*/
@media screen and (max-width: 980px) {
    #idOwnerMainFooterContainer .owner-footer-grid-wrapper {
        grid-template-columns: repeat(2, 1fr);
        width: 80%; /*для более гармоничной отрисовки*/
    }
}
/* 2.2) МЕДИА-ЗАПРОСЫ на выравнивание по центру контента в колонках футера на мобильных экранах */
@media screen and (max-width: 782px) {
    /* Для центрального контейнера*/
    #idOwnerMainFooterContainer .owner-footer-grid-wrapper {
        grid-template-columns: 1fr;
        width: auto; /*обратная подстройка под ширину секции*/
    }
    #idOwnerMainFooterContainer
        .owner-footer-grid-wrapper
        > .wp-block-column
        .wp-block-group-is-layout-flex.is-vertical {
        flex-direction: column;
        align-items: center !important;
    }
    #idOwnerMainFooterContainer
        .owner-footer-grid-wrapper
        > .wp-block-column
        .wp-block-group-is-layout-flex.is-vertical
        > * {
        text-align: center;
    }
    /*Для нижнего контейнера*/
    #idOwnerBelowFooterContainer .wp-block-group.is-layout-flex {
        flex-direction: column;
        align-items: center;
    }
    #idOwnerBelowFooterContainer
        .wp-block-group.is-layout-flex
        .wp-block-group-is-layout-flex.is-vertical {
        flex-direction: column;
        align-items: center !important;
    }
}
/* 2.x) Сепаратор в футере позиционируем слева на больших экранах*/
@media screen and (min-width: 782px) {
    footer.wp-block-template-part hr.wp-block-separator {
        margin-left: 0;
    }
}
/* НА БУДУЩЕЕ ...*/
/* 3) Стили для секции c Contact Form (контактная форма с вкладками) */
/* 3.1) Задаем класс display и первоначально скрываем все блоки с контентом */
#idSectionTabs
    .owner-container-contents-block
    > .owner-container-contents-block__item {
    display: none;
}
/* 3.2) Перестилизуем кнопки против установок темы и общих */
#idSectionTabs
    .owner-container-buttons-block
    > .owner-container-buttons-block__item
    > a.wp-block-button__link {
    color: var(--wp--preset--color--base);
    background-color: transparent;
    box-shadow: none;
}
#idSectionTabs
    .owner-container-buttons-block
    > .owner-container-buttons-block__item
    > a.wp-block-button__link:hover {
    color: var(--wp--preset--color--base);
    border: solid 1px;
}
/* 3.3) Размеры */
#idSectionTabs .owner-container-contents-block {
    width: 50%;
}
@media screen and (max-width: 900px) {
    #idSectionTabs .owner-container-contents-block {
        width: 80%;
    }
}
/* 3.4) Стилизация для кнопок внутри контента */
#idSectionTabs
    .owner-container-contents-block
    .block-buttons-into-content__button
    > a.wp-block-button__link {
    border-radius: 0;
    color: var(--wp--preset--color--base);
    background-color: transparent;
    border: solid 1px;
    padding: 10px 30px;
    box-shadow: var(--owner--box--shadow--normal);
}
#idSectionTabs
    .owner-container-contents-block
    .block-buttons-into-content__button
    > a.wp-block-button__link:hover {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
    border-color: var(--wp--preset--color--base);
}

/* >> КОНЕЦ header/footer */

/*
    << НАСТРОЙКА Woocommerce
*/
/* 1) Стилизуем заголовки */
body.woocommerce h1 {
    font-size: var(--wp--preset--font-size--huge);
}
body.woocommerce h2 {
    font-size: var(--wp--preset--font-size--large-plus);
}
body.woocommerce h3 {
    font-size: var(--wp--preset--font-size--medium);
}
/* 2) Копируем стили для кнопок как в теме*/
#idWrapperWooPageContent :where(button:not(button.mega-toggle-animated)) {
    background-color: var(--wp--preset--color--passive-button);
    border-radius: 0.33rem !important;
    border-color: var(--wp--preset--color--passive-button);
    border-width: 0;
    color: var(--wp--preset--color--base);
    font-family: inherit;
    font-size: var(--wp--preset--font-size--medium);
    font-style: normal;
    font-weight: 500;
    line-height: inherit;
    padding-top: 0.6rem;
    padding-right: 1rem;
    padding-bottom: 0.6rem;
    padding-left: 1rem;
    text-decoration: none;
    box-shadow: var(--owner--box--shadow--normal);
    cursor: pointer;
}
#idWrapperWooPageContent
    :is(button, .wc-block-product-categories__button):where(
        :hover,
        :active,
        :focus
    ) {
    background-color: var(--wp--preset--color--active-button);
    border-color: var(--wp--preset--color--active-button);
    color: var(--wp--preset--color--base);
    outline: none;
}
/* 3) Выпадающий список с категориями */
#idWrapperWooPageContent :where(label, select, option) {
    font-family: var(--wp--preset--font-family--body);
    font-size: var(--wp--preset--font-size--normal);
}
#idWrapperWooPageContent .wc-block-product-categories__button {
    margin-left: 10px;
}
/*оболочка для select*/
#idWrapperWooPageContent
    :where(
        form.form-wppp-select,
        form.woocommerce-ordering,
        div.wc-block-product-categories__dropdown
    ) {
    position: relative;
}
#idWrapperWooPageContent
    :where(
        form.form-wppp-select,
        form.woocommerce-ordering,
        div.wc-block-product-categories__dropdown
    )::after {
    content: "";
    display: block;
    border-style: solid;
    border-width: 6px 5px 0 5px;
    border-color: var(--wp--preset--color--passive-button) transparent
        transparent transparent;
    position: absolute;
    top: 50%;
    margin-top: -3px; /*1/2 от верхнего бордера*/
    right: 0.5rem;
    z-index: -1;
}
#idWrapperWooPageContent
    :where(
        form.form-wppp-select,
        form.woocommerce-ordering,
        div.wc-block-product-categories__dropdown
    ):hover::after {
    border-color: var(--wp--preset--color--active-button) transparent
        transparent transparent;
}
#idWrapperWooPageContent select {
    outline: none;
    padding: 0.6rem 1.5rem 0.5rem 0.8rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-color: transparent;
    border: 1px solid #aaa;
    box-shadow: 0 1px 0 1px rgba(0, 0, 0, 0.04);
    border-radius: 0.5em;
    cursor: pointer;
}

/* 4) Позиционирование строчки с количеством товаров */
#idWrapperWooPageContent p.woocommerce-result-count {
    margin-top: 8px;
}

/* 5) Позиционирование окна сортировки */
#idWrapperWooPageContent .woocommerce-ordering {
    float: left;
    margin-left: 10px;
}
/* 6) Позиционирование окна WooCommerce Products Per Page*/
.form-wppp-select.products-per-page {
    float: left !important;
    margin-left: 10px !important;
    margin-bottom: 10px;
}

/* 7) Центрирование блоков под изображениями с данными товара (заголовок, цена и т.д) в цикле вывода */
.woocommerce ul.products li.product > * {
    text-align: center;
}
/* 8) Пагинация */
.woocommerce nav.woocommerce-pagination ul {
    border: none;
}
.woocommerce nav.woocommerce-pagination ul li {
    border-right: none;
    margin: 0 5px;
    border-radius: 50%;
    box-shadow: var(--owner--box--shadow--normal);
}
.woocommerce nav.woocommerce-pagination ul li a.page-numbers {
    color: var(--wp--preset--color--base);
    background-color: var(--wp--preset--color--passive-button);
}
.woocommerce nav.woocommerce-pagination ul li .page-numbers.current {
    color: var(--wp--preset--color--base);
    background-color: var(--wp--preset--color--active-button);
}
.woocommerce nav.woocommerce-pagination ul li a.page-numbers:is(:hover, :focus, :active) {
    background: var(--wp--preset--color--active-button);
}
/* 9) Регулируем ширину первого столбца таблицы с кратким описанием товара */
.woocommerce div.product div.summary div.woocommerce-product-details__short-description > table tr > td:first-child {
    width: 60% !important;
}
/* i) устранение бага: при отсутствии Табов заголовок "Похожие товары" залазит в поле справа от изображения товара. Решение: оставляем в настройках Товаров к-ниб таб (например разрешить Отзывы), но скрываем его*/
.woocommerce div.product .woocommerce-tabs {
    height: 0;
    opacity: 0;
}

/* >> КОНЕЦ НАСТРОЙКИ Woocommerce*/

/*
    << НАСТРОЙКА СТИЛЕЙ ПЛАГИНОВ
*/

/* 1) Contact Form 7*/
/* 1.1) Меняем установки браузеров*/
/* 1.1.1) Плейсхолдер для формы в футере */
footer ::-webkit-input-placeholder {
    /* WebKit browsers */
    color: var(--wp--preset--color--base);
    font-family: var(--wp--preset--font-family--body);
}
footer :-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: var(--wp--preset--color--base);
    font-family: var(--wp--preset--font-family--body);
}
footer ::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: var(--wp--preset--color--base);
    font-family: var(--wp--preset--font-family--body);
}
footer :-ms-input-placeholder {
    /* Internet Explorer 10+ */
    color: var(--wp--preset--color--base);
    font-family: var(--wp--preset--font-family--body);
}

/* 1.1.2) Плейсхолдер для форм в всплыв. окнах */
div.pum ::-webkit-input-placeholder {
    /* WebKit browsers */
    color: var(--wp--preset--color--contrast-2);
    font-family: var(--wp--preset--font-family--body);
}
div.pum :-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: var(--wp--preset--color--contrast-2);
    font-family: var(--wp--preset--font-family--body);
}
div.pum ::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: var(--wp--preset--color--contrast-2);
    font-family: var(--wp--preset--font-family--body);
}
div.pum :-ms-input-placeholder {
    /* Internet Explorer 10+ */
    color: var(--wp--preset--color--contrast-2);
    font-family: var(--wp--preset--font-family--body);
}

/* 1.2) Общая стилизация элементов Контакт-форм в футере*/
/* 1.2.1) Общие стили для форм */
footer .wpcf7 {
    --cf7--height-unit: var(--wp--preset--font-size--normal-plus);
}
footer .wpcf7 .owner-cf7-header {
    color: var(--wp--preset--color--base);
    text-align: center;
    font-size: var(--wp--preset--font-size--large);
}
footer .wpcf7 .wpcf7-form-control:not(.wpcf7-checkbox) {
    border: none;
    color: var(--wp--preset--color--base);
    font-size: var(--cf7--height-unit);
    background-color: transparent;
    padding: 10px 5px;
    font-family: var(--wp--preset--font-family--body);
}
footer .wpcf7 .wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item-label {
    font-size: var(--cf7--height-unit);
    color: var(--wp--preset--color--base);
}
footer .wpcf7 .wpcf7-form-control:not(.wpcf7-checkbox, .wpcf7-submit) {
    border-bottom: solid 1px;
}
footer .wpcf7
    .wpcf7-form-control:not(.wpcf7-checkbox):where(
        :hover,
        :active,
        :focus,
        :focus-visible
    ) {
    outline: none;
}

/* 1.2.2) Стили для контейнера с флекс-элементами в строку */
footer .wpcf7 .owner-cf7-flex-row-wrapper > p {
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width: 480px) {
    footer .wpcf7 .owner-cf7-flex-row-wrapper > p {
        flex-wrap: wrap;
    }
}
/* 1.2.2.1) Ширина элементов в контейнере */
footer .wpcf7 .owner-cf7-flex-row-wrapper .wpcf7-form-control:not(.wpcf7-checkbox) {
    width: 90%;
}
@media screen and (max-width: 480px) {
    footer .wpcf7
        .owner-cf7-flex-row-wrapper
        .wpcf7-form-control:not(.wpcf7-checkbox) {
        width: 97%;
    }
}
/* 1.2.2.3) Прижимаем блок с телефоном к правому краю*/
footer .wpcf7 .owner-cf7-flex-row-wrapper .wpcf7-form-control.wpcf7-mask {
    display: block;
    margin-left: auto;
}
@media screen and (max-width: 480px) {
    footer .wpcf7 .owner-cf7-flex-row-wrapper .wpcf7-form-control.wpcf7-mask {
        margin-left: 0;
    }
}
/* 1.2.3) подгоняем отступы для отдельных блоков*/
footer .wpcf7 form > div {
    margin-bottom: inherit;
}
/* 1.2.4) в контактной форме убираем верхний отступ*/
footer .wp-block-contact-form-7-contact-form-selector {
    margin-top: 0 !important;
}
/* 1.2.5) textarea: фиксируем размер и родит.семейство шрифтов, задаем ширину и высоту относительно родителя*/
footer .wpcf7 .wpcf7-textarea {
    resize: none;
    font-family: inherit;
    width: 99%;
    height: calc(3 * var(--cf7--height-unit));
}
@media screen and (max-width: 1200px) {
    footer .wpcf7 .wpcf7-textarea {
        width: 98%;
    }
}
@media screen and (max-width: 630px) {
    footer .wpcf7 .wpcf7-textarea {
        width: 97.5%;
    }
}
@media screen and (max-width: 530px) {
    footer .wpcf7 .wpcf7-textarea {
        width: 97%;
    }
}
/* 1.2.6) спец.класс для сокрытия некоторых служебных полей формы*/
footer .wpcf7 .owner-cf7-field-none-displayed {
    display: none;
}
/* 1.2.7) Кнопка Отправить*/
footer .wpcf7 .wpcf7-form-control.wpcf7-submit {
    display: block;
    border: solid 1px;
    margin: 30px auto 0 auto;
    padding: 10px 30px;
    box-shadow: var(--owner--box--shadow--normal);
    cursor: pointer;
}
footer .wpcf7 .wpcf7-form-control.wpcf7-submit:hover {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
    border-color: var(--wp--preset--color--base);
}

/* 1.3) Cтилизация Контакт-форм в всплыв.окнах*/
/* 1.3.1) Общие стили для форм */
@media screen and (max-width: 1200px) {
    div.pum .pum-container {
        width: 60% !important;
        }
}
@media screen and (max-width: 800px) {
    div.pum .pum-container {
        width: 95% !important;
        }
}
div.pum .wpcf7 {
    --cf7--height-unit: var(--wp--preset--font-size--medium);
}
div.pum .wpcf7 p {
    text-align: center;
}
div.pum .wpcf7 .owner-cf7-header {
    color: var(--wp--preset--color--contrast);
    font-size: var(--wp--preset--font-size--large-plus);
    font-weight: 700;
}
div.pum .wpcf7 label {
    color: var(--wp--preset--color--contrast);
    font-size: var(--wp--preset--font-size--medium);
}
div.pum .wpcf7 .wpcf7-form-control:not(.wpcf7-checkbox) {
    border: none;
    color: var(--wp--preset--color--contrast);
    font-size: var(--cf7--height-unit);
    background-color: transparent;
    padding: 10px 5px;
    font-family: var(--wp--preset--font-family--body);
}
div.pum .wpcf7 .wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item-label {
    font-size: var(--cf7--height-unit);
    color: var(--wp--preset--color--contrast);
}
div.pum .wpcf7 .wpcf7-form-control:not(.wpcf7-checkbox, .wpcf7-submit) {
    border-bottom: solid 1px;
}
div.pum .wpcf7
    .wpcf7-form-control:not(.wpcf7-checkbox):where(
        :hover,
        :active,
        :focus,
        :focus-visible
    ) {
    outline: none;
}
/* 1.3.2) Ширина элементов в контейнере */
div.pum .wpcf7 .wpcf7-form-control:not(.wpcf7-checkbox, .wpcf7-submit) {
    width: 90%;
}
@media screen and (max-width: 480px) {
    div.pum .wpcf7 .wpcf7-form-control:not(.wpcf7-checkbox, .wpcf7-submit) {
        width: 97%;
    }
}
/* 1.3.3) подгоняем отступы для отдельных блоков*/
div.pum .wpcf7 form > div {
    margin-bottom: inherit;
}
/* 1.3.4) в контактной форме убираем верхний отступ*/
div.pum .wp-block-contact-form-7-contact-form-selector {
    margin-top: 0 !important;
}
/* 1.3.5) textarea: фиксируем размер и родит.семейство шрифтов, задаем ширину и высоту относительно родителя*/
div.pum .wpcf7 .wpcf7-textarea {
    resize: none;
    font-family: inherit;
    width: 99%;
    height: calc(3 * var(--cf7--height-unit));
}
@media screen and (max-width: 1200px) {
    div.pum .wpcf7 .wpcf7-textarea {
        width: 98%;
    }
}
@media screen and (max-width: 630px) {
    div.pum .wpcf7 .wpcf7-textarea {
        width: 97.5%;
    }
}
@media screen and (max-width: 530px) {
    div.pum .wpcf7 .wpcf7-textarea {
        width: 97%;
    }
}

/* 1.3.6) Кнопка Отправить*/
div.pum .wpcf7 .wpcf7-form-control.wpcf7-submit {
    display: block;
    background-color: var(--wp--preset--color--passive-button);
    color: var(--wp--preset--color--base);
    border-radius: 5px;
    margin: 30px auto 0 auto;
    padding: 10px 30px;
    box-shadow: var(--owner--box--shadow--normal);
    cursor: pointer;
}
div.pum .wpcf7 .wpcf7-form-control.wpcf7-submit:hover {
    background-color: var(--wp--preset--color--active-button);
    color: var(--wp--preset--color--base);
    border-color: var(--wp--preset--color--active-button);
}

/* 2) Popup Maker */

/* 3) СЛАЙДЕРЫ */
/* 3.1) SA Sliders*/
/* 3.1.1) БАГ - пропали стрелки. Принудительно подключаем*/
#idOwnerSaSliderWrapper .disabled :where(.owl-prev, .owl-next) {
    display: block !important;
}
/* 3.1.2) убираем фон у стрелок навигации*/
#idOwnerSaSliderWrapper .owl-nav :where(.owl-prev, .owl-next) {
    background-color: transparent !important;
}
/* 3.1.3) стрелки - убираем сдвиг*/
#idOwnerSaSliderWrapper .owl-nav .owl-prev {
    left: 0;
}
#idOwnerSaSliderWrapper .owl-nav .owl-next {
    right: 0;
}
/* 3.1.4) точно позиционируем область наведения */
.sa_owl_theme .owl-item .sa_hover_container .sa_hover_fullslide {
    left: 0px;
}
/* 3.1.5) центруем изображение в слайде*/
.owl-carousel .owl-item img {
    display: block !important;
    margin: 0 auto;
    box-shadow: 5px 5px 10px;
}
/* 3.2) WP Carousel берем из аналогов Woo*/
/* 3.2.1) Стили подписей под изображениями галлереи*/
.wpcp-product-carousel .wpcp-single-item :is(.wpcp-product-title, .wpcp-product-title a, .wpcp-product-price, .wpcp-product-price span) {
    font-size: 1.2rem;
    color: var(--wp--preset--color--contrast);
    font-family: var(--wp--preset--font-family--body);
    font-weight: 400;
    line-height: 1.2;
}
.wpcp-product-carousel .wpcp-single-item .wpcp-product-title a {
    font-weight: 600;
}
.wpcp-product-carousel .wpcp-single-item .wpcp-product-title a:where(:hover, :active, :focus) {
    color: var(--wp--preset--color--active-link);
}
/* 3.2.2) Стили стрелок навигации */
.wpcp-product-carousel :is(.wpcp-prev-button i, .wpcp-next-button i):where(:hover, :active, :focus) {
    color: var(--wp--preset--color--active-link) !important;
}
/* 3.2.3) Стили пагинации */
.wpcp-carousel-section .wpcp-swiper-dots .swiper-pagination-bullet-active {
    background-color: var(--wp--preset--color--passive-button) !important;
}
/* 4) Buy One Click */
/* 4.1) Кнопки*/
#formOrderOneClick .popup :where(button, div.close_order) {
    background-color: var(--wp--preset--color--passive-button);
    border-radius: 0.33rem !important;
    border-color: var(--wp--preset--color--passive-button);
    border-width: 0;
    color: var(--wp--preset--color--base);
    font-family: inherit;
    font-size: var(--wp--preset--font-size--medium);
    font-style: normal;
    font-weight: 500;
    line-height: inherit;
    padding-top: 0.6rem;
    padding-right: 1rem;
    padding-bottom: 0.6rem;
    padding-left: 1rem;
    text-decoration: none;
    box-shadow: var(--owner--box--shadow--normal);
    cursor: pointer;
}
#formOrderOneClick
    .popup
    :is(button, div.close_order):where(:hover, :active, :focus) {
    background-color: var(--wp--preset--color--active-button);
    border-color: var(--wp--preset--color--active-button);
    color: var(--wp--preset--color--base);
    outline: none;
}
/* 4.1.1) Достилизация кнопки Закрыть модального окна*/
/*body.woocommerce button.single_add_to_cart_button {
    cursor: pointer;
}*/
#formOrderOneClick .popup div.close_order {
    top: -15px;
    right: -15px;
    border-radius: 50% !important;
    width: 2rem;
    height: 2rem;
    line-height: 1.2;
}
/* 4.2) Подгоняем размер текста во всех блоках*/
#formOrderOneClick
    #buyoneclick_form_order
    :where(.table-wrap table :where(th, td), input, p, label) {
    font-size: var(--wp--preset--font-size--normal);
}
#formOrderOneClick #buyoneclick_form_order ::-webkit-input-placeholder {
    /* WebKit browsers */
    font-family: "Jost";
    font-size: var(--wp--preset--font-size--normal);
}
#formOrderOneClick #buyoneclick_form_order :-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    font-family: "Jost";
    font-size: var(--wp--preset--font-size--normal);
}
#formOrderOneClick #buyoneclick_form_order ::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    font-family: "Jost";
    font-size: var(--wp--preset--font-size--normal);
}
#formOrderOneClick #buyoneclick_form_order :-ms-input-placeholder {
    /* Internet Explorer 10+ */
    font-family: "Jost";
    font-size: var(--wp--preset--font-size--normal);
}
/* 4.3) Граница*/
#formOrderOneClick #buyoneclick_form_order input {
    border: 1px solid #ddd;
    outline: none;
    box-sizing: border-box;
}
/* 4.4) Расположение модального окна*/
#formOrderOneClick > .popup {
    top: 50%;
}
/* 4.5) Сообщения по результатам заполнения/отсылки*/
#formOrderOneClick #buyoneclick_form_order p.form-message-result {
    color: red;
    font-weight: 700;
}
#formOrderOneClick #buyoneclick_form_order p.form-message-result.success {
    color: green;
}
/* МЕДИА-запросы*/
@media screen and (max-width: 600px) {
    #formOrderOneClick > .popup {
        min-width: 200px;
        width: 80vw;
    }
}

/* >> КОНЕЦ НАСТРОЙКИ СТИЛЕЙ ПЛАГИНОВ*/

/*
    << СТРАНИЦЫ
*/

/*
    <<СТРАНИЦЫ, ОБЩИЕ НАСТРОЙКИ
*/
/* 1) Настройка галлереи для страниц Услуг и Натяжных потолков*/
#idSectionGallery .owner-gallery-image {
    max-width: 200px;
}
@media screen and (max-width: 430px) {
    #idSectionGallery .owner-gallery-image {
        max-width: 100%;
    }
}
#idSectionGallery .owner-gallery-image-is-vertical {
    max-width: 100px;
}
@media screen and (max-width: 358px) {
    #idSectionGallery .owner-gallery-image-is-vertical {
        max-width: 100%;
    }
}
/* 4) Отключение бокового сайдбара с меню на малых экранах */
@media screen and (max-width: 870px) {
    main.owner-with-sidemenu-page-wrapper .wp-block-columns > .wp-block-column:first-child {
        flex-basis: 100% !important;
    }
    main.owner-with-sidemenu-page-wrapper .wp-block-columns > .wp-block-column:last-child {
        display: none;
    }
}
/* 5) Общее для страниц записей (рубрика Отзывы, например, или результаты Поиска)*/
@media screen and (max-width: 1250px) {
    ul.wp-block-post-template-is-layout-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}
@media screen and (max-width: 850px) {
    ul.wp-block-post-template-is-layout-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }
}

/* >> КОНЕЦ СТРАНИЦЫ ОБЩИЕ НАСТРОЙКИ*/

/* << ГЛАВНАЯ */
/* 1) Секция с карточками каталог, потолки, услуги */
/* 1.1) Резиноый размер и стилизация */
.owner-types-of-service-list .owner-type-of-service-card {
    position: relative;
    width: clamp(290px, 20vw, 400px);
    cursor: pointer;
}
.owner-types-of-service-list .owner-type-of-service-card img {
    border-radius: 10px;
    box-shadow: var(--owner--box--shadow--normal);
}
/* 1.2) Позиционирование наименования карточки*/
.owner-types-of-service-list
    .owner-type-of-service-card
    > .owner-type-of-service-card__name {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    border-radius: 0 0 10px 10px;
    backdrop-filter: blur(4px); /* Размываем фон под блоком*/
}
/* 1.3) Минимальная высота карточки */
.owner-types-of-service-list .owner-type-of-service-card {
    min-height: 250px;
}

/* >> КОНЕЦ ГЛАВНАЯ*/

/* << КОНТАКТЫ*/

/* >> КОНЕЦ КОНТАКТЫ*/

/* << Новости (посты из ВК) */
.owner-wrapper-vkpost-images {
    margin: var(--wp--preset--spacing--30) 0 !important;
}
.owner-vkpost-figure-size {
    width: clamp(250px, 20vw, 450px);
}
.owner-vkpost-image {
    width: 100%;
}
/* >> Конец Посты из ВК*/

/* >> КОНЕЦ НАСТРОЙКИ СТРАНИЦ*/