/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Jun 30 2025 | 14:49:47 */
/* Основные стили для всего документа */
        .re-properties-body {
            margin: 0; /* Убираем внешние отступы */
            padding: 0; /* Убираем внутренние отступы */
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Основной шрифт */
            font-weight: 400; /* Нормальная толщина шрифта */
            background-color: #0b271b; /* Темно-зеленый фон */
            color: #bba460; /* Золотистый цвет текста */
        }

        /* Стили карточки объекта недвижимости */
        .re-properties-card {
            border: 5px solid #06332e; /* Рамка толщиной 5px */
            border-radius: 10px; /* Скругление углов */
            overflow: hidden; /* Скрытие выходящего за границы контента */
            transition: all 0.3s ease; /* Плавные анимации */
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3), 
                        0 6px 6px rgba(0, 0, 0, 0.2); /* Тень */
            margin-bottom: 30px; /* Отступ снизу */
            background-color: #06332e; /* Цвет фона */
            display: flex; /* Flex-контейнер */
            flex-direction: row; /* Расположение в строку */
            height: 200px; /* Фиксированная высота */
            width: 100%; /* Ширина 100% */
        }

        /* Эффект при наведении на карточку */
        .re-properties-card:hover {
            transform: translateY(-5px); /* Сдвиг вверх */
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4), 
                        0 10px 10px rgba(0, 0, 0, 0.3); /* Усиленная тень */
        }

        /* Стили галереи изображений */
        .re-properties-gallery {
            position: relative; /* Относительное позиционирование */
            width: 300px; /* Фиксированная ширина */
            height: 200px; /* Фиксированная высота */
            overflow: hidden; /* Скрытие выходящего контента */
            flex-shrink: 0; /* Запрет уменьшения ширины */
        }

        /* Стили изображений в галерее */
        .re-properties-gallery img {
            width: 100%; /* Ширина 100% */
            height: 100%; /* Высота 100% */
            object-fit: cover; /* Заполнение с сохранением пропорций */
            object-position: center; /* Центрирование */
            transition: transform 0.3s ease; /* Плавное масштабирование */
            cursor: pointer; /* Курсор-указатель */
        }
        
        /* Стили контентной части карточки */
        .re-properties-content {
            flex-grow: 1; /* Растягивание на доступное пространство */
            padding: 15px; /* Внутренние отступы */
            display: flex; /* Flex-контейнер */
            flex-direction: column; /* Вертикальное расположение */
            height: 100%; /* Высота 100% */
            box-sizing: border-box; /* Учет padding в размерах */
        }

        /* Стили заголовка карточки */
        .re-properties-title {
            font-weight: 700; /* Жирный шрифт */
            margin-bottom: 10px; /* Отступ снизу */
            font-size: 1.2rem; /* Размер шрифта */
            color: #bba460; /* Цвет текста */
            padding-bottom: 8px; /* Отступ снизу для линии */
            border-bottom: 2px solid #bba460; /* Линия под текстом */
        }
        
        /* Стили для таблицы с площадями */
        .re-properties-area-table {
            margin-top: 10px; /* Отступ сверху */
            width: 100%; /* Ширина 100% */
        }

        .re-properties-area-table table {
            width: 100%; /* Ширина 100% */
            border-collapse: collapse; /* Схлопывание границ */
        }

        .re-properties-area-table tr:not(:last-child) {
            border-bottom: 1px solid rgba(187, 164, 96, 0.2); /* Граница между строками */
        }

        .re-properties-area-table td {
            padding: 8px 0; /* Отступы в ячейках */
            font-size: 0.9rem; /* Размер шрифта */
            color: #fff; /* Цвет текста */
            vertical-align: middle; /* Вертикальное выравнивание */
        }

        .re-properties-area-table td:first-child {
            color: #bba460; /* Цвет текста */
            font-weight: 500; /* Полужирный */
            padding-right: 10px; /* Отступ справа */
            white-space: nowrap; /* Запрет переноса */
        }

        .re-properties-area-table td:last-child {
            text-align: right; /* Выравнивание по правому краю */
            font-weight: 600; /* Жирный шрифт */
        }

        /* Стили контейнера слайдера */
        .re-properties-swiper {
            width: 100%; /* Ширина 100% */
            height: 100%; /* Высота 100% */
        }
        
        /* Стили точек пагинации слайдера */
        .swiper-pagination-bullet {
            background: #bba460 !important; /* Цвет точки */
            opacity: 0.6 !important; /* Прозрачность */
            width: 8px !important; /* Ширина */
            height: 8px !important; /* Высота */
        }
        
        /* Стили активной точки пагинации */
        .swiper-pagination-bullet-active {
            background: #06332e !important; /* Цвет активной точки */
            opacity: 1 !important; /* Полная видимость */
        }

        /* Стили попапа с изображением */
        .re-properties-img-popup {
            position: fixed; /* Фиксированное позиционирование */
            top: 0; /* Верхний край */
            left: 0; /* Левый край */
            width: 100%; /* Ширина 100% */
            height: 100%; /* Высота 100% */
            background: rgba(0,0,0,0.9); /* Полупрозрачный фон */
            display: none; /* Скрыт по умолчанию */
            justify-content: center; /* Центрирование по горизонтали */
            align-items: center; /* Центрирование по вертикали */
            z-index: 9999; /* Поверх других элементов */
        }

        /* Контейнер изображения в попапе */
        .re-properties-img-container {
            position: relative; /* Относительное позиционирование */
            max-width: 90%; /* Максимальная ширина */
            max-height: 90vh; /* Максимальная высота */
            display: flex; /* Flex-контейнер */
            align-items: center; /* Центрирование по вертикали */
            justify-content: center; /* Центрирование по горизонтали */
        }

        /* Изображение в попапе */
        .re-properties-img-container img {
            max-width: 100%; /* Максимальная ширина */
            max-height: 90vh; /* Максимальная высота */
            border: 5px solid #bba460; /* Рамка */
            border-radius: 5px; /* Скругление углов */
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); /* Тень */
        }

        /* Кнопка закрытия попапа */
        .re-properties-close-btn {
            position: absolute; /* Абсолютное позиционирование */
            top: -15px; /* Смещение вверх */
            right: -15px; /* Смещение вправо */
            background: #06332e; /* Цвет фона */
            border: 2px solid #bba460; /* Рамка */
            width: 40px; /* Ширина */
            height: 40px; /* Высота */
            border-radius: 50%; /* Круглая форма */
            display: flex; /* Flex-контейнер */
            justify-content: center; /* Центрирование по горизонтали */
            align-items: center; /* Центрирование по вертикали */
            cursor: pointer; /* Курсор-указатель */
            z-index: 10; /* Поверх изображения */
            transition: all 0.3s; /* Плавные анимации */
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); /* Тень */
        }

        /* Состояние при наведении на кнопку закрытия */
        .re-properties-close-btn:hover {
            background: #bba460; /* Изменение цвета фона */
            border-color: #06332e; /* Изменение цвета рамки */
            transform: scale(1.1); /* Увеличение */
        }

        /* SVG в кнопке закрытия */
        .re-properties-close-btn svg {
            width: 20px; /* Ширина */
            height: 20px; /* Высота */
        }

        /* Кнопки навигации в попапе */
        .re-properties-nav-btn {
            position: absolute; /* Абсолютное позиционирование */
            top: 50%; /* Позиционирование по центру */
            transform: translateY(-50%); /* Точное центрирование */
            background: rgba(6, 51, 46, 0.7); /* Полупрозрачный фон */
            border: 2px solid #bba460; /* Рамка */
            width: 50px; /* Ширина */
            height: 50px; /* Высота */
            border-radius: 50%; /* Круглая форма */
            display: flex; /* Flex-контейнер */
            justify-content: center; /* Центрирование по горизонтали */
            align-items: center; /* Центрирование по вертикали */
            cursor: pointer; /* Курсор-указатель */
            z-index: 10; /* Поверх изображения */
            transition: all 0.3s; /* Плавные анимации */
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); /* Тень */
        }

        /* Состояние при наведении на кнопки навигации */
        .re-properties-nav-btn:hover {
            background: #bba460; /* Изменение цвета фона */
            border-color: #06332e; /* Изменение цвета рамки */
        }

        /* Кнопка "назад" */
        .re-properties-prev-btn {
            left: 20px; /* Позиционирование слева */
        }

        /* Кнопка "вперед" */
        .re-properties-next-btn {
            right: 20px; /* Позиционирование справа */
        }

        /* Стили SVG в кнопках навигации */
        .re-properties-nav-btn svg {
            width: 30px; /* Ширина */
            height: 30px; /* Высота */
            fill: #bba460; /* Цвет иконки */
        }

        /* Состояние при наведении на SVG в кнопках навигации */
        .re-properties-nav-btn:hover svg {
            fill: #06332e; /* Изменение цвета иконки */
        }

        /* Стили попапа формы */
        .re-properties-form-popup {
            position: fixed; /* Фиксированное позиционирование */
            top: 0; /* Верхний край */
            left: 0; /* Левый край */
            width: 100%; /* Ширина 100% */
            height: 100%; /* Высота 100% */
            background: rgba(0,0,0,0.7); /* Полупрозрачный фон */
            display: none; /* Скрыт по умолчанию */
            justify-content: center; /* Центрирование по горизонтали */
            align-items: center; /* Центрирование по вертикали */
            z-index: 9998; /* Под попапом с изображением */
        }

        /* Контейнер формы */
        .re-properties-form-box {
            width: 90%; /* Ширина 90% */
            max-width: 700px; /* Максимальная ширина */
            max-height: 90vh; /* Максимальная высота */
            border-radius: 10px; /* Скругление углов */
            position: relative; /* Относительное позиционирование */
            overflow-y: auto; /* Вертикальный скролл */
            background-size: cover; /* Заполнение фона */
            background-position: right center; /* Позиция фона */
            background-image: url('https://leoner26.ru/wp-content/uploads/2025/05/obratnyj-zvonok3.jpg'); /* Фоновое изображение */
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4); /* Тень */
        }

        /* Затемнение фона формы */
        .re-properties-form-box::before {
            content: ''; /* Псевдоэлемент */
            position: absolute; /* Абсолютное позиционирование */
            top: 0; /* Верхний край */
            left: 0; /* Левый край */
            right: 0; /* Правый край */
            bottom: 0; /* Нижний край */
            background: rgba(31, 71, 67, 0.75); /* Полупрозрачный фон */
            z-index: 1; /* Поверх фона */
        }

        /* Контент формы */
        .re-properties-form-content {
            position: relative; /* Относительное позиционирование */
            z-index: 2; /* Поверх псевдоэлемента */
            padding: 20px; /* Внутренние отступы */
            color: #bba460; /* Цвет текста */
            width: 100%; /* Ширина 100% */
            box-sizing: border-box; /* Учет padding в размерах */
        }

        /* Заголовок формы */
        .re-properties-form-title {
            font-size: 1.5rem; /* Размер шрифта */
            font-weight: 700; /* Жирный шрифт */
            margin-bottom: 15px; /* Отступ снизу */
            line-height: 1.3; /* Межстрочный интервал */
            color: #FFFFFF; /* Белый текст */
        }

        /* Текст формы */
        .re-properties-form-text {
            font-size: 1rem; /* Размер шрифта */
            margin-bottom: 25px; /* Отступ снизу */
            line-height: 1.5; /* Межстрочный интервал */
            color: #FFFFFF; /* Белый текст */
        }

        /* Кнопка закрытия формы */
        .re-properties-form-close {
            position: absolute; /* Абсолютное позиционирование */
            top: 12px; /* Отступ сверху */
            right: 12px; /* Отступ справа */
            background: none; /* Прозрачный фон */
            border: none; /* Без рамки */
            padding: 5px; /* Внутренние отступы */
            cursor: pointer; /* Курсор-указатель */
            z-index: 10; /* Поверх контента */
            transition: all 0.3s; /* Плавные анимации */
        }

        /* Состояние при наведении на кнопку закрытия формы */
        .re-properties-form-close:hover {
            transform: scale(1.15); /* Увеличение */
            background: #06332e; /* Цвет фона */
            border-radius: 50%; /* Круглая форма */
        }

        /* SVG в кнопке закрытия формы */
        .re-properties-form-close svg {
            display: block; /* Блочный элемент */
        }

        /* Стили для фильтров */
        .re-properties-filters {
            background-color: transparent; /* Прозрачный фон */
            padding: 15px 0; /* Внутренние отступы */
            margin-bottom: 20px; /* Отступ снизу */
            display: flex; /* Flex-контейнер */
            justify-content: flex-end; /* Выравнивание по правому краю */
            gap: 10px; /* Расстояние между элементами */
        }
        
        /* Стили кнопок фильтра основной вид */
        .re-properties-filter-btn {
            background-color: transparent; /* Прозрачный фон */
            color: #06332e; /* Цвет текста */
            border: 2px solid #06332e; /* Рамка */
            padding: 6px 12px; /* Внутренние отступы */
            border-radius: 5px; /* Скругление углов */
            transition: all 0.3s; /* Плавные анимации */
            font-weight: 500; /* Полужирный шрифт */
            cursor: pointer; /* Курсор-указатель */
            font-size: 0.9rem; /* Размер шрифта */
        }
        
        /* Состояние при наведении на кнопку фильтра */
        .re-properties-filter-btn:hover, 
        .re-properties-filter-btn.active {
            background-color: #06332e; /* Цвет фона */
            color: #fff; /* Белый текст */
            border-color: #06332e; /* Цвет рамки */
        }

        /* Отступы между блоками */
        .re-properties-section {
            margin-bottom: 30px; /* Отступ снизу */
        }

        /* Адаптив для экранов до 992px */
        @media (max-width: 992px) {            
            .re-properties-card {
                flex-direction: column; /* Расположение в колонку */
                height: auto; /* Автоматическая высота */
            }
            
            .re-properties-gallery {
                width: 100%; /* Ширина 100% */
                height: 200px; /* Фиксированная высота */
            }
        }

        /* Адаптив для экранов до 768px */
        @media (max-width: 768px) {
            .re-properties-form-box {
                max-width: 90%; /* Максимальная ширина */
                background-position: center; /* Центрирование фона */
            }
            
            .re-properties-filters {
                flex-wrap: wrap; /* Перенос на новую строку */
            }
            
            .re-properties-filter-btn {
                padding: 5px 10px; /* Уменьшенные отступы */
                font-size: 0.85rem; /* Уменьшенный шрифт */
            }
        }

        /* Адаптив для экранов до 576px */
        @media (max-width: 576px) {
            .re-properties-gallery {
                height: 180px; /* Уменьшенная высота */
            }
            
            .re-properties-title {
                font-size: 1.1rem; /* Уменьшенный шрифт */
            }
            
            .re-properties-form-content {
                padding: 15px; /* Уменьшенные отступы */
            }
            
            .re-properties-area-table td {
                font-size: 0.85rem; /* Уменьшенный шрифт */
                padding: 6px 0; /* Уменьшенные отступы */
            }

            /* Уменьшение кнопок навигации на мобильных */
            .re-properties-nav-btn {
                width: 40px; /* Уменьшенная ширина */
                height: 40px; /* Уменьшенная высота */
            }

            .re-properties-nav-btn svg {
                width: 24px; /* Уменьшенная иконка */
                height: 24px; /* Уменьшенная иконка */
            }
        }
