/*
Theme Name: Vit Tel Ta Nature
Theme URI: https://vitteltanature.fr/
Author: Nael
Author URI: https://webro.fr/
Description: Thème WordPress développé par l'agence Webro pour Vit Tel Ta Nature.
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vit-tel-ta-nature
Tags: 
*/

:where(.wp-site-blocks *:focus-visible) {
    outline: 2px solid;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

* {
    margin: 0;
}

@media (prefers-reduced-motion: no-preference) {
    html {
        interpolate-size: allow-keywords;
    }
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img,
picture,
video,
canvas,
svg {
    display: block;
    max-width: 100%;
}

input,
button,
textarea,
select {
    font: inherit;
}

p,
h1,
h2,
h3 {
    overflow-wrap: break-word;
}

p {
    text-wrap: pretty;
    max-inline-size: 60ch;
}

h1,
h2,
h3,
h4 {
    text-wrap: balance;
}

ul,
ol {
    padding-inline-start: 0;
    list-style-position: inside;
}

.personnes::before {
    content: "·";
    margin-inline: 4px;
}

.personnes::after {
    content: "·";
    margin-inline: 4px;
}

.cabane .price .value,
.cabane .price .suffix {
    font-size: 18px;
    font-weight: 700;
}

.wp-block-outermost-copyright-date-block {
    margin-inline-end: 4px !important;
}

footer {
    .top {
        position: relative;

        &::after {
            content: url("assets/images/footer-divider.svg");
            position: absolute;
            inset: auto 0 0;
            line-height: 0;
            z-index: 1;
            width: 100%;
        }
    }

    .copyright {
        color: #9b8f8d;
    }
}

.wpcf7-form {
    padding: 2rem;
    background-color: var(--wp--preset--color--white);
    box-shadow: var(--wp--preset--shadow--card);
    border-radius: 1rem;

    @media (width > 1023px) {
        .inputs {
            display: flex;
            gap: 1rem;
        }
    }

    p {
        margin-block-end: 1rem;
    }

    label {
        font-size: .875rem;
    }

    input[type="text"],
    input[type="email"],
    input[type="tel"],
    textarea {
        margin-block-start: 8px;
        padding: .5rem;
        width: 100%;
        background: transparent;
        border: 1px solid var(--wp--preset--color--secondary);
        color: inherit;
        font-size: 1rem;
        caret-color: currentColor;
        border-radius: 4px;

        &:focus {
            outline: none;
            border: 1px solid var(--wp--preset--color--accent-2);
        }
    }

    textarea {
        height: 164px;
    }

    input[type="submit"] {
        background-color: var(--wp--preset--color--accent-2);
        border-radius: 8px;
        border-width: 0;
        color: var(--wp--preset--color--white);
        font-weight: 700;
        line-height: 1;
        padding-top: 0.75rem;
        padding-right: 1.5rem;
        padding-bottom: 0.75rem;
        padding-left: 1.5rem;
        cursor: pointer;
        transition: background-color 300ms ease-in;

        &:hover {
            background-color: #3D5E31;
        }
    }
}

.wpcf7-not-valid-tip {
    font-size: .875rem;
    margin-block-start: .5rem;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
    border-color: transparent;
}

.wpcf7 form .wpcf7-response-output {
    margin: 0;
    padding: 0;
    border: none;
}

.wpcf7 form.invalid .wpcf7-response-output {
    color: #dc3232;
}

.wpcf7 form.sent .wpcf7-response-output {
    color: #46b450;
}

#ke-booking-ibe-frame,
#ke-booking-gc-frame {
    aspect-ratio: 1;
    max-width: 80rem;

    @media (width > 1023px) {
        aspect-ratio: 16/9;
    }
}

#ke-booking-ifrm {
    border-radius: 1rem;
}

.description .value {
    display: grid;
    gap: 8px;
}

#keb-planning-frame-184 {
    place-self: center;
}

.wp-block-cb-carousel-v2[data-cb-pagination=true] .swiper-horizontal {
    margin-bottom: 0;
}

.home .wp-block-cb-carousel-v2 img {
	 filter: grayscale(1);	
}

.wp-block-cb-carousel-v2 img {
    border-radius: 8px;
}

.wp-block-cb-carousel-v2 .cb-button-prev {
    left: 0;
}

.wp-block-cb-carousel-v2 .cb-button-next {
    right: 0;
}

.wp-block-cb-carousel-v2 .cb-button-next,
.wp-block-cb-carousel-v2 .cb-button-prev {
    color: var(--wp--preset--color--white);
    background-color: var(--wp--preset--color--accent-2);
    border-radius: 100%;
    height: 2rem;
    width: 2rem;
}

.wp-block-cb-carousel-v2 .cb-button-next:after,
.wp-block-cb-carousel-v2 .cb-button-prev:after {
    font-size: 1rem;
}

.swiper {
    border-radius: 1rem;
}

.single-cabane section:nth-child(2) h2 {
    font-size: 1.25rem;
}

.rank-math-html-sitemap {
    display: grid;
    gap: var(--wp--preset--spacing--30);
	margin-block: var(--wp--preset--spacing--50) !important;
}

.mfb-carousel-preload.mfb-gallery-carousel img, .mfb-gallery-carousel .swiper-slide>img {
    aspect-ratio: 3 / 2;
}