/*
Theme Name: Refuge de l'espoir
Theme URI:
Author: Paul Nobécourt
Author URI: https://paulnobecourt.fr
Description: Thème FSE personnalisé pour le refuge de l'espoir
Requires at least: 6.6
Tested up to: 6.7
Requires PHP: 8.0
Version: 0.0.1
Text Domain: refuge-de-lespoir
*/

/** Global styles **/
/* Fonts */
/* @link https://utopia.fyi/type/calculator?c=320,18,1.2,1280,20,1.25,6,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
    --step--2: clamp(0.7813rem, 0.775rem + 0.0313vw, 0.8rem);
    --step--1: clamp(0.9375rem, 0.9167rem + 0.1042vw, 1rem);
    --step-0: clamp(1.125rem, 1.0833rem + 0.2083vw, 1.25rem);
    --step-1: clamp(1.35rem, 1.2792rem + 0.3542vw, 1.5625rem);
    --step-2: clamp(1.62rem, 1.509rem + 0.5552vw, 1.9531rem);
    --step-3: clamp(1.944rem, 1.7782rem + 0.829vw, 2.4414rem);
    --step-4: clamp(2.3328rem, 2.0931rem + 1.1983vw, 3.0518rem);
    --step-5: clamp(2.7994rem, 2.4609rem + 1.6922vw, 3.8147rem);
    --step-6: clamp(3.3592rem, 2.8895rem + 2.3486vw, 4.7684rem);
}

/* @link https://utopia.fyi/type/calculator?c=320,18,1.2,1280,20,1.25,6,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
    --step--2: clamp(0.7813rem, 0.775rem + 0.0313cqi, 0.8rem);
    --step--1: clamp(0.9375rem, 0.9167rem + 0.1042cqi, 1rem);
    --step-0: clamp(1.125rem, 1.0833rem + 0.2083cqi, 1.25rem);
    --step-1: clamp(1.35rem, 1.2792rem + 0.3542cqi, 1.5625rem);
    --step-2: clamp(1.62rem, 1.509rem + 0.5552cqi, 1.9531rem);
    --step-3: clamp(1.944rem, 1.7782rem + 0.829cqi, 2.4414rem);
    --step-4: clamp(2.3328rem, 2.0931rem + 1.1983cqi, 3.0518rem);
    --step-5: clamp(2.7994rem, 2.4609rem + 1.6922cqi, 3.8147rem);
    --step-6: clamp(3.3592rem, 2.8895rem + 2.3486cqi, 4.7684rem);
}

/* Spacing */
/* @link https://utopia.fyi/space/calculator?c=320,18,1.2,1280,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
    --space-3xs: clamp(0.3125rem, 0.3125rem + 0vw, 0.3125rem);
    --space-2xs: clamp(0.5625rem, 0.5417rem + 0.1042vw, 0.625rem);
    --space-xs: clamp(0.875rem, 0.8542rem + 0.1042vw, 0.9375rem);
    --space-s: clamp(1.125rem, 1.0833rem + 0.2083vw, 1.25rem);
    --space-m: clamp(1.6875rem, 1.625rem + 0.3125vw, 1.875rem);
    --space-l: clamp(2.25rem, 2.1667rem + 0.4167vw, 2.5rem);
    --space-xl: clamp(3.375rem, 3.25rem + 0.625vw, 3.75rem);
    --space-2xl: clamp(4.5rem, 4.3333rem + 0.8333vw, 5rem);
    --space-3xl: clamp(6.75rem, 6.5rem + 1.25vw, 7.5rem);
    /* One-up pairs */
    --space-3xs-2xs: clamp(0.3125rem, 0.2083rem + 0.5208vw, 0.625rem);
    --space-2xs-xs: clamp(0.5625rem, 0.4375rem + 0.625vw, 0.9375rem);
    --space-xs-s: clamp(0.875rem, 0.75rem + 0.625vw, 1.25rem);
    --space-s-m: clamp(1.125rem, 0.875rem + 1.25vw, 1.875rem);
    --space-m-l: clamp(1.6875rem, 1.4167rem + 1.3542vw, 2.5rem);
    --space-l-xl: clamp(2.25rem, 1.75rem + 2.5vw, 3.75rem);
    --space-xl-2xl: clamp(3.375rem, 2.8333rem + 2.7083vw, 5rem);
    --space-2xl-3xl: clamp(4.5rem, 3.5rem + 5vw, 7.5rem);
    /* Custom pairs */
    --space-s-l: clamp(1.125rem, 0.6667rem + 2.2917vw, 2.5rem);
}

/* @link https://utopia.fyi/space/calculator?c=320,18,1.2,1280,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
    --space-3xs: clamp(0.3125rem, 0.3125rem + 0cqi, 0.3125rem);
    --space-2xs: clamp(0.5625rem, 0.5417rem + 0.1042cqi, 0.625rem);
    --space-xs: clamp(0.875rem, 0.8542rem + 0.1042cqi, 0.9375rem);
    --space-s: clamp(1.125rem, 1.0833rem + 0.2083cqi, 1.25rem);
    --space-m: clamp(1.6875rem, 1.625rem + 0.3125cqi, 1.875rem);
    --space-l: clamp(2.25rem, 2.1667rem + 0.4167cqi, 2.5rem);
    --space-xl: clamp(3.375rem, 3.25rem + 0.625cqi, 3.75rem);
    --space-2xl: clamp(4.5rem, 4.3333rem + 0.8333cqi, 5rem);
    --space-3xl: clamp(6.75rem, 6.5rem + 1.25cqi, 7.5rem);
    /* One-up pairs */
    --space-3xs-2xs: clamp(0.3125rem, 0.2083rem + 0.5208cqi, 0.625rem);
    --space-2xs-xs: clamp(0.5625rem, 0.4375rem + 0.625cqi, 0.9375rem);
    --space-xs-s: clamp(0.875rem, 0.75rem + 0.625cqi, 1.25rem);
    --space-s-m: clamp(1.125rem, 0.875rem + 1.25cqi, 1.875rem);
    --space-m-l: clamp(1.6875rem, 1.4167rem + 1.3542cqi, 2.5rem);
    --space-l-xl: clamp(2.25rem, 1.75rem + 2.5cqi, 3.75rem);
    --space-xl-2xl: clamp(3.375rem, 2.8333rem + 2.7083cqi, 5rem);
    --space-2xl-3xl: clamp(4.5rem, 3.5rem + 5cqi, 7.5rem);
    /* Custom pairs */
    --space-s-l: clamp(1.125rem, 0.6667rem + 2.2917cqi, 2.5rem);
}

/** Fix for the block editor **/
:root :where(.wp-site-blocks)>*,
:root :where(.wp-site-blocks)> :first-child,
:root :where(.wp-site-blocks)> :last-child {
    margin-block-start: 0 !important;
    margin-block-end: 0 !important;
    margin: 0 !important;
}

/** Utility classes **/
.hidden {
    display: none;
}

.is-relative {
    position: relative;
}

@media screen and (min-width:768px) {
    .is-desktop-sticky-t-50 {
        position: sticky;
        top: 50px;
    }
}

.is-sticky-t-50 {
    position: sticky;
    top: 50px;
}

/** Components **/
/* Header */
.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
    color: var(--wp--preset--color--primary);
}

.wp-block-navigation .current-menu-item .wp-block-navigation-item__content.wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:active,
.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--secondary);
}

.wp-block-navigation.has-background .has-child .wp-block-navigation__submenu-container {
    padding: 16px;
    gap: 8px;
    border-radius: 16px;
}

.post-type-archive-animal.wp-theme-refuge-de-lespoir #header-nav nav.wp-block-navigation li.wp-block-navigation-item a[href*="/animaux-a-l-adoption/"] {
    color: var(--wp--preset--color--secondary);
}

@media screen and (max-width: 767px) {
    header.wp-block-template-part div.wp-block-group#header-nav {
        flex-direction: row-reverse;
    }

    .wp-block-navigation__responsive-container-close svg,
    .wp-block-navigation__responsive-container-open svg {
        height: 48px;
        width: 48px;
    }

    header.wp-block-template-part div#header-nav nav div.wp-block-navigation__responsive-container li.wp-block-navigation-item {
        /* font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.042), 0.9rem); */
        font-size: clamp(1.62rem, 1.509rem + 0.5552vw, 1.9531rem) !important;
    }
}

/* Custom Grid */
@media screen and (max-width: 768px) {
    .rdle-grid-m-1 {
        display: grid;
        grid-template-columns: repeat(1, 1fr) !important;
    }

    .rdle-grid-m-2 {
        display: grid;
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .rdle-grid-m-3 {
        display: grid;
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .rdle-grid-m-4 {
        display: grid;
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* Lists */
ul.wp-block-list.custom-list {
    padding-left: 0px;
}

/* Buttons */
.donate-btn:hover {
    transform: rotate(1deg) scale(1.025);
    transition-duration: 250ms;
}

:root :where(.animal.type-animal:hover .wp-block-button.pet-card-btn .wp-block-button__link) {
    /* background-color: var(--wp--preset--color--secondary); */
}

/* WPGB Facets */
@media screen and (max-width: 599px) {
    #pet-filters .wp-block-group {
        gap: 8px;
    }

    #more-mobile-filters {}
}

.refuge-de-lespoir.wp-theme-refuge-de-lespoir .wpgb-facet>.wpgb-facet-title,
.refuge-de-lespoir.wp-theme-refuge-de-lespoir .wpgb-facet>fieldset {
    margin-bottom: 15px;
}

/* Cartes animaux */
.pet-card:hover {
    transform: scale(1.025);
    transition-duration: 250ms;
}

.pet-card__media {
    position: relative;
    width: 100%;
}

.pet-card .pet-card__thumbnail,
.pet-card .pet-card__thumbnail>*,
.pet-card .pet-card__thumbnail-bg,
.pet-card .pet-card__thumbnail-bg>* {
    aspect-ratio: 3/2;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
}

.pet-card .pet-card__thumbnail-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.pet-card .pet-card__thumbnail>* {
    background-color: transparent !important;
}

.with-overflow .swiper {
    /* overflow: visible; */
}