/* Feuille de styles CSS de la page d'une réalisation */

/* Contenu de la réalisation */

#realisation-domaine-application, #realisation-aperçu-photos, #realisation-partager {
    display: flex;
    flex-direction: column;
    gap: 25px;
}
#realisation-domaine-application, #realisation-aperçu-photos {
    margin-bottom: 50px;
}
#realisation-domaine-application h3, #realisation-aperçu-photos h3, #realisation-partager h3 {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
#realisation-domaine-application h3::before, #realisation-aperçu-photos h3::before, #realisation-partager h3::before {
    font-family: "tabler-icons";
    font-size: 22px;
    font-weight: 400;
    line-height: 0;
}
#realisation-domaine-application h3::before {
    content: "\10096";
}
#realisation-aperçu-photos h3::before {
    content: "\eb0a";
}
#realisation-partager h3::before {
    content: "\eb21";
}
#realisation-domaine-application a {
    width: fit-content;
    color: var(--theme-palette-color-1);
}
#realisation-domaine-application a:hover {
    color: var(--theme-palette-color-2);
}
#realisation-domaine-application p.realisation-vide-message, #realisation-aperçu-photos p.realisation-vide-message, #realisation-partager p.realisation-vide-message {
    margin: 0;
}

/* Galerie de photos */

#realisation-aperçu-photos .spectra-image-gallery__control-lightbox {
    --swiper-navigation-size: 30px;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-button-prev, #realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-button-next {
    transition: color 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-button-prev::after, #realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-button-next::after {
    font-size: var(--swiper-navigation-size);
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-button-prev:not(.swiper-button-disabled):hover, #realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-button-next:not(.swiper-button-disabled):hover {
    color: var(--theme-palette-color-2);
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--thumbnails-wrapper .swiper-thumbs .swiper-wrapper .swiper-slide.swiper-slide-active {
    transform: scale(90%);
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-wrapper .swiper-slide {
    cursor: grab;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-wrapper .swiper-slide:active {
    cursor: grabbing;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-wrapper .swiper-slide img, #realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--thumbnails-wrapper .swiper-thumbs .swiper-wrapper .swiper-slide img {
    border-radius: 5px;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--main .swiper-wrapper .swiper-slide img {
    max-width: 70%;
    max-height: 75%;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--count {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox button.spectra-image-gallery__control-lightbox--close {
    transition: transform 0.15s ease-out;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox button.spectra-image-gallery__control-lightbox--close svg {
    transition: fill 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox button.spectra-image-gallery__control-lightbox--close:hover {
    transform: rotate(90deg);
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox button.spectra-image-gallery__control-lightbox--close:focus-visible {
    transform: none;
}
#realisation-aperçu-photos .spectra-image-gallery__control-lightbox button.spectra-image-gallery__control-lightbox--close:hover svg {
    fill: var(--theme-palette-color-2);
}
@media screen and (max-width: 767px) {
    #realisation-aperçu-photos .spectra-image-gallery__control-lightbox {
        --swiper-navigation-size: 23px;
    }
}
@media screen and (max-width: 689.98px) {
    #realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--thumbnails-wrapper .swiper-thumbs {
        bottom: 25px;
    }
    #realisation-aperçu-photos .spectra-image-gallery__control-lightbox .spectra-image-gallery__control-lightbox--thumbnails-wrapper .swiper-thumbs .swiper-wrapper {
        height: auto;
    }
}