/*
* FooGallery Custom CSS
* This file is created by adding custom CSS on FooGallery Settings page in wp-admin
* Created : 25 Aug 2026, 4:27 pm
*/

/* =========================================================
   FooGallery — стиль для msch59.ru
   Спокойный медицинский дизайн
========================================================= */

/* Общая галерея */
.foogallery {
    margin: 28px 0 36px !important;
}


/* Сетка — более лёгкая тень */
.foogallery .fg-item {
    border-radius: 14px !important;
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid #e1e9ed !important;

    box-shadow:
        0 2px 8px rgba(24, 68, 85, 0.06) !important;

    transition:
        box-shadow 0.25s ease !important;
}


/* Hover — плитка не поднимается, тень слегка усиливается */
.foogallery .fg-item:hover {
    transform: none !important;

    box-shadow:
        0 4px 12px rgba(24, 68, 85, 0.09) !important;
}


/* Обёртка изображения */
.foogallery .fg-image-wrap,
.foogallery .fg-thumb {
    overflow: hidden !important;
    background: #eef5f8 !important;
}


/* Изображение */
.foogallery .fg-image,
.foogallery img {
    width: 100% !important;

    object-fit: cover !important;
    object-position: center center !important;

    border: 0 !important;

    transition:
        transform 0.4s ease,
        filter 0.4s ease !important;
}


/* Лёгкое увеличение фото */
.foogallery .fg-item:hover .fg-image,
.foogallery .fg-item:hover img {
    transform: scale(1.045) !important;
}


/* =========================================================
   ПОДПИСИ
========================================================= */

.foogallery .fg-caption {
    background: #ffffff !important;

    color: #2c5363 !important;

    padding: 12px 14px 14px !important;

    text-align: left !important;

    font-size: 14px !important;
    line-height: 1.4 !important;

    border-top: 1px solid #edf1f3 !important;
}


/* Заголовок */
.foogallery .fg-caption-title {
    color: #285466 !important;

    font-size: 15px !important;
    font-weight: 600 !important;

    line-height: 1.35 !important;

    margin: 0 !important;
}


/* Описание */
.foogallery .fg-caption-desc {
    margin-top: 5px !important;

    color: #718087 !important;

    font-size: 13px !important;
    line-height: 1.4 !important;
}


/* Убираем слишком тёмные накладки */
.foogallery .fg-overlay {
    background: rgba(23, 71, 89, 0.12) !important;
}


/* При наведении слегка затемняем */
.foogallery .fg-item:hover .fg-overlay {
    background: rgba(23, 71, 89, 0.18) !important;
}


/* =========================================================
   КНОПКИ / ИКОНКИ НА ФОТО
========================================================= */

.foogallery .fg-button,
.foogallery .fg-icon {
    border-radius: 50% !important;

    background: rgba(255,255,255,0.94) !important;

    color: #1683aa !important;

    box-shadow:
        0 3px 10px rgba(0,0,0,0.14) !important;
}


/* =========================================================
   LIGHTBOX
========================================================= */

.fbx-light {
    background: rgba(17, 37, 46, 0.94) !important;
}

.fbx-light .fbx-inner {
    border-radius: 12px !important;
    overflow: hidden !important;
}

.fbx-light .fbx-caption {
    background: rgba(17, 47, 58, 0.94) !important;
    color: #ffffff !important;
}


/* =========================================================
   JUSTIFIED / MASONRY
========================================================= */

/* Расстояние между фото */
.foogallery.fg-layout-justified .fg-item,
.foogallery.fg-layout-masonry .fg-item {
    margin-bottom: 12px !important;
}


/* =========================================================
   ОДИНАКОВАЯ ВЫСОТА ПРЕВЬЮ
   Для Grid / Responsive Image Gallery
========================================================= */

.foogallery.fg-layout-grid .fg-image,
.foogallery.fg-layout-grid img,
.foogallery.fg-layout-default .fg-image,
.foogallery.fg-layout-default img {
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
}


/* =========================================================
   МОБИЛЬНАЯ ВЕРСИЯ
========================================================= */

@media (max-width: 900px) {

    .foogallery {
        margin: 22px 0 30px !important;
    }

    .foogallery .fg-caption {
        padding: 10px 12px 12px !important;
    }

    .foogallery .fg-caption-title {
        font-size: 14px !important;
    }
}


@media (max-width: 600px) {

    .foogallery .fg-item {
        border-radius: 12px !important;
    }

    .foogallery .fg-image,
    .foogallery img {
        width: 100% !important;
        height: auto !important;

        aspect-ratio: 4 / 3 !important;

        object-fit: cover !important;
    }

    .foogallery .fg-caption {
        padding: 10px 11px 12px !important;
    }

    .foogallery .fg-caption-title {
        font-size: 14px !important;
    }

    .foogallery .fg-caption-desc {
        font-size: 12px !important;
    }
}


/* =========================================================
   ДОСТУПНОСТЬ
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .foogallery .fg-item,
    .foogallery img,
    .foogallery .fg-image {
        transition: none !important;
    }

    .foogallery .fg-item:hover {
        transform: none !important;
    }

    .foogallery .fg-item:hover img,
    .foogallery .fg-item:hover .fg-image {
        transform: none !important;
    }
}