/**
 * Theme Name: FABwp Theme Child
 * Description: Theme enfant pour FABwp Starter Theme. Le thème parent ne doit pas être supprimé !
 * Author:     Fabien Planet
 * Template:   fabwp-starter-theme
 * Version:    1.0.0
 * License:    GNU General Public License v2 or later
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: fabwp
 */

@media screen and (max-width:991px){
    .hide-on-mobile {
        display: none !important;
    }
    .hide-on-desktop {
        display:block !important;
    }
}
@media screen and (min-width:992px){
    .hide-on-desktop {
        display: none !important;
    }
}
@media screen and (max-width:781px){
    .hide-on-mobile-wp {
        display: none !important;
    }
}
@media screen and (min-width:782px){
    .hide-on-desktop-wp {
        display: none !important;
    }
}

 details {

    @media (prefers-reduced-motion: no-preference) {
        interpolate-size: allow-keywords;
    }

    &::details-content {
        box-sizing: border-box;
        opacity: 0;
        block-size: 0;
        overflow-y: clip; 
        transition: content-visibility 500ms allow-discrete,
                    opacity 500ms,
                    block-size 500ms;
    }

    &[open]::details-content {
        opacity: 1;
        block-size: auto;
        transition: content-visibility 500ms allow-discrete,
                    opacity 500ms,
                    block-size 500ms;
    }

}

body:not(.single-post,.single-job-board,.single-testimonials,.single-events,.error404) header > #header-block.wp-block-group {
    background-color: transparent !important;
}

body:not(.single-post,.single-job-board,.single-testimonials,.single-events,.error404) header:has(>.is-sticky) + main {
    margin-top: 0 !important;
}
header,
header #header-block {
    transition: all 250ms ease-in-out;
}
@media screen and (max-width:991px){
    header {
        background-color: var(--wp--custom--theme-900);
    }
    header #header-block {
        padding-top: var(--wp--preset--spacing--xxs) !important;
        padding-bottom: var(--wp--preset--spacing--xxs) !important;
    }
}
header.reduce {
    background-color: var(--wp--custom--theme-900);
}
header.reduce #header-block {
    padding-top: var(--wp--preset--spacing--xxs) !important;
    padding-bottom: var(--wp--preset--spacing--xxs) !important;
}

footer .wp-block-navigation-item.top-space {
    margin-block-start: var(--wp--preset--spacing--xs);
}

body.freeze {
    overflow-y: hidden;
}

*[id] {
    scroll-margin-top: calc(60px + 32px);
}

/* FORM */
.wp-block-contact-form-7-contact-form-selector .form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0 var(--wp--preset--spacing--s);
}
.wp-block-contact-form-7-contact-form-selector .form-col {
    flex-basis: 100%;
    flex-grow: 1;
}
@media screen and (min-width:992px){
    .wp-block-contact-form-7-contact-form-selector .form-col {
        flex-basis: 0;
    }
}
.wp-block-contact-form-7-contact-form-selector .form-col p {
    margin-top: 0;
}
.wp-block-contact-form-7-contact-form-selector label {
    font-size: var(--wp--preset--font-size--s);
}
.wp-block-contact-form-7-contact-form-selector .form-input {
    padding-inline: var(--wp--preset--spacing--xxs);
    padding-block: var(--wp--preset--spacing--xxs);
    border-radius: var(--wp--custom--radius--m);
    border: solid 1px var(--wp--custom--theme-300);
    box-sizing: border-box;
    width: 100%;
}
.wp-block-contact-form-7-contact-form-selector .form-file {
    padding: calc(var(--wp--preset--spacing--xxs) / 2);
    border: solid 1px var(--wp--custom--theme-300);
    border-radius: var(--wp--custom--radius--m);
    box-sizing: border-box;
    width: 100%;
    background-color: #FFF;
}
.wp-block-contact-form-7-contact-form-selector .form-file::file-selector-button {
    color: var(--wp--custom--theme-50);
    background-color: var(--wp--custom--theme-500);
    border-radius: var(--wp--custom--radius--s);
    padding-block: calc(var(--wp--preset--spacing--xxs) / 1.5);
    padding-inline: var(--wp--preset--spacing--xxs);
    border: none;
    margin-right: var(--wp--preset--spacing--xxs);
}
.wp-block-contact-form-7-contact-form-selector .form-input.wpcf7-not-valid {
    border-color: var(--wp--custom--error-500);
}
.wp-block-contact-form-7-contact-form-selector .wpcf7-not-valid-tip {
    color: var(--wp--custom--error-500);
}
.wp-block-contact-form-7-contact-form-selector .form-submit {
    text-box: trim-both cap alphabetic;
    transition: all 150ms ease-out;
    background-color: var(--wp--custom--theme-900);
    border-radius: var(--wp--custom--radius--button);
    border-color: transparent;
    border-width: 0px;
    border-style: solid;
    color: var(--wp--custom--theme-50);
    font-family: var(--wp--preset--font-family--brand);
    font-size: calc( var(--wp--preset--font-size--s) * 1 );
    font-style: inherit;
    font-weight: var(--wp--custom--font-weight--medium);
    letter-spacing: inherit;
    line-height: 1;
    padding-top: var(--wp--custom--button-padding--y);
    padding-right: calc(var(--wp--custom--button-padding--x) * 1.5);
    padding-bottom: var(--wp--custom--button-padding--y);
    padding-left: calc(var(--wp--custom--button-padding--x) * 1.5);
    text-decoration: none;
    text-transform: inherit;
    margin-top: 1em;
    cursor: pointer;
}
.wp-block-contact-form-7-contact-form-selector .form-submit:hover {
    background-color: var(--wp--custom--brand-500);
    color: var(--wp--custom--theme-50);
}

/* TABS */
.bloc-tabs .tab-content {
    display: none;
    margin-block-start: 0 !important;
}
.bloc-tabs .tab-content.activ {
    display: block;
}
.bloc-tabs .tab-button.activ a {
    background-color: var(--wp--custom--theme-700);
}
.bloc-tabs .tab-nav-light .tab-button:not(.activ) a {
    background-color: transparent !important;
}
.bloc-tabs .tab-nav-light .tab-button:not(.activ) a:hover {
    background-color: var(--wp--custom--brand-500) !important;
}
.bloc-tabs .tab-nav-light .tab-button.activ a:hover {
    background-color: var(--wp--custom--theme-50) !important;
    color: var(--wp--custom--theme-900) !important;
}