/*
Theme Name: Vitrine
Theme URI: 
Author: VirtualServices
Author URI: 
Description: thème vitrine pour Nature @ Limousin
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: vitrine
Tags: 
*/

/* Variables CSS */
:root {
    --wp--preset--color--or: #eeab00;
    --wp--preset--color--brun: #795035;
    --wp--preset--color--baseclaire: #f8f5ee;
    --wp--preset--color--basefoncee: #472e23;
    --wp--preset--color--base1: #ede6d4;
    --wp--preset--color--base2: #B3AFAC;
    --wp--preset--color--base3: #8D827A;
    --wp--preset--color--base4: #6C5549;
}

/* Appels */




/* Defaults
---------------------------------------- */

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

html {
    scroll-behavior: smooth;
}

a,
button,
input:focus,
input[type="button"],
input[type="submit"],
textarea:focus,
.wp-element-button {
    transition: all 0.2s ease-in-out;
}

a,
a:focus,
a:hover,
a:not(.wp-element-button) {
    text-decoration-thickness: 1px;
}

b,
strong,
th {
    font-weight: var(--wp--custom--font-weight--medium);
}

mark {
    background: linear-gradient(90deg, var(--wp--preset--color--primary) 0%, var(--wp--preset--color--primary) 100%);
    background-position: 0 85%;
    background-repeat: repeat-x;
    background-size: 100% 15%;
}

/* -- Forms -- */

input,
select,
textarea {
    background-color: var(--wp--preset--color--base);
    border: 1px solid var(--wp--preset--color--contrast);
    border-radius: 0;
    color: var(--wp--preset--color--contrast);
    font-family: var(--wp--preset--font-family--primary);
    font-size: var(--wp--preset--font-size--medium);
    font-weight: var(--wp--custom--font-weight--light);
    line-height: var(--wp--custom--line-height--body);
    padding: 10px 20px;
    width: 100%;
}

input:focus,
textarea:focus {
    background-color: var(--wp--preset--color--neutral);
    outline: none;
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
    width: auto;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
    -webkit-appearance: none;
}

::placeholder {
    color: var(--wp--preset--color--contrast);
    font-size: var(--wp--preset--font-size--small);
    opacity: 0.5;
}

/* Blocks
---------------------------------------- */

/* -- Code -- */

*:not(.wp-block-code)>code {
    background-color: var(--wp--preset--color--neutral);
    font-size: var(--wp--preset--font-size--small);
    padding: 5px 8px;
}



.wp-block-navigation__responsive-container.is-menu-open {
    padding: var(--wp--custom--spacing--gap);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    padding-top: var(--wp--custom--spacing--gap);
}

.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open {
    border: 1px solid currentColor;
    padding: 2px;
}

.has-background .wp-block-navigation__responsive-container-open:focus,
.has-background .wp-block-navigation__responsive-container-open:hover {
    color: var(--wp--preset--color--base);
}


/* -- Intro page accueil -- */

.nl-intro {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 100;
}

/* Utility
---------------------------------------- */

/* -- Box Shadow -- */

.is-style-shadow-light {
    box-shadow: var(--wp--preset--shadow--light);
}

.is-style-shadow-solid {
    box-shadow: var(--wp--preset--shadow--solid);
}

/* Media Queries
---------------------------------------- */

@media only screen and (max-width: 600px) {

    /* -- Utility -- */

    .is-style-hidden-mobile {
        display: none !important;
    }

}

@media only screen and (min-width: 600px) {

    /* -- cacher pour pc -- */

    .is-style-hidden-screen {
        display: none !important;
    }
}

@media only screen and (max-width: 782px) {

    /* -- Columns -- */

    .is-style-columns-reverse {
        flex-direction: column-reverse;
    }

}

td[colspan="3"] {
    font-size: 37px;
    font-weight: bold;
    text-align: center;
}

/* -- icone flèche invitant à descendre -- */
.dashicons-arrow-down-alt2 {
    position: absolute;
    bottom: 5vh;
    font-size: 30px;
    /* Modifier la taille */
    color: #eeab00;
    /* Changer la couleur */
}





/*---------- tests ------ */

.cache-block {
    display: none !important;
}

.circle {
    position: sticky;
    top: 400px;
}

.img-iconique {
    display: flex;
    justify-content: center;
    align-items: center;
}

.gp-zimage {
    position: relative;
    /* Ou fixed si vous voulez qu'il reste visible en permanence */
    overflow: hidden;
    /* Assurez-vous que l'image ne déborde pas du conteneur */
    width: 80%;
    /* Ajustez selon vos besoins */
    height: 100%;
    /* Ajustez selon vos besoins */
}



/* test page exemple */



.txt1 {
    z-index: 3;
}

.txt2 {
    z-index: 3;
}

.txt3 {
    z-index: 3;
}

.txt-zi {
    z-index: 100;
    text-shadow: 2px 2px 2px var(--wp--preset--color--baseclaire);
}

.mv-img,
.gp-img {
    z-index: 100;
}

/** Caroussel **/
.slider-container {
    margin: 0 auto;
    /*    max-width: 1200px;*/
    padding: 0 20px;
}

.slider-container .wp-block-group {
    margin: 10px;
    padding: 20px;
    background: #f5f5f5;
}

/* Style des flèches */
.slick-prev:before,
.slick-next:before {
    color: var(--wp--preset--color--brun);
}

/* Style des points */
.slick-dots li button:before {
    color: var(--wp--preset--color--or);
}

/** end /** Caroussel **/

/* Styles pour le slider */
.slider {
    margin: 0 auto;
    max-width: 1200px;
    padding: 0 20px;
}

.slider>div {
    margin: 10px;
    padding: 20px;
}

/* Style des flèches */
.slider .slick-prev:before,
.slider .slick-next:before {
    color: var(--wp--preset--color--brun);
    font-size: 30px;
    /* Ajustez la taille des flèches */
}

/* Style des points */
.slider .slick-dots li button:before {
    color: var(--wp--preset--color--or);
    font-size: 20px;
    /* Ajustez la taille des points */
}

/* Styles pour les items multiples */
.lenis-item {
    flex: 0 0 calc(33.333% - 20px);
    /* Pour 3 items par vue */
    margin: 0 10px;
    transition: all 0.3s ease;
}

/* Styles pour l'espacement des slides */
.lenis-item {
    padding: 0 20px;
    box-sizing: border-box;
}

/* Style du container pour éviter les débordements */
.lenis-container {
    margin: 0 -20px;
    overflow: hidden;
}

/* Responsive */
@media (max-width: 768px) {
    .lenis-item {
        flex: 0 0 calc(50% - 20px);
        /* Pour 2 items par vue */
        padding: 0 15px;
    }

    .lenis-container {
        margin: 0 -15px;
    }
}

@media (max-width: 480px) {
    .lenis-item {
        flex: 0 0 100%;
        /* Pour 1 item par vue */
    }
}

/* Animation des items */
.lenis-item.is-active {
    transform: scale(1);
    opacity: 1;
}

.lenis-item:not(.is-active) {
    transform: scale(0.9);
    opacity: 0.6;
}