/**
 * Theme Name: 	Realisimmo
 * Template:   	twentytwentyfour
 * Theme URI: 	https://www.realisimmo.fr/
 * Description: Thème enfant du thème twenty twenty four, pour le site de Realisimmo
 * Author: 		Echappée Web
 * Author URI: 	https://www.echappe-web.fr
 * Version: 	1.0
**/

/* Header */
.wp-block-site-logo {
    max-width: 36%;
    z-index: 999;
    a {
        display: block;
        margin-bottom: -43% !important;
    }
}

/* adjust the mobile menu breakpoint */
@media (max-width: 1023px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}
	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}
}
@media (min-width: 1024px) {
    header .wp-block-navigation {
        width: calc(100% - 375px);
        max-width: 900px;
    }
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: none !important;
	}
	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: block !important;
		width: 100%;
		position: relative;
		z-index: auto;
		background-color: inherit;
	}
}
/* Style du menu mobile */
header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--contrast);
    & li a, & .wp-block-navigation__responsive-close {
        color: var(--wp--preset--color--base);
        & :is(:hover, :focus) {
            color: var(--wp--preset--color--accent);
        }
    }
}

/* header submenu */
/* le paramétrage ne fonctionne pas directement dans le json ou la personnalisation du thème */
header .wp-block-navigation:not(.has-text-color) li {
    a {
        color: var(--wp--preset--color--base);
    }
    & :is(:hover, :focus) {
        color: var(--wp--preset--color--accent);
    }
}
/* Style du sous-menu sur ordi */
header .wp-block-navigation:not(.has-text-color) .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container {
    left: -50%;
    align-items: center;
    background-color: var(--wp--preset--color--contrast);
    li {
        text-align: center;
    }
}
/* Style du sous-menu */
header .wp-block-navigation:not(.has-text-color) .wp-block-navigation__submenu-container {
    padding-top: var(--wp--preset--spacing--20, 1em);
    a {
        color: var(--wp--preset--color--base);
        padding: 0.3em 0.7em;
        text-transform: none;
    }
}
.wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true]~.wp-block-navigation__submenu-container, .wp-block-navigation .has-child:not(.open-on-click):hover>.wp-block-navigation__submenu-container, .wp-block-navigation .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within>.wp-block-navigation__submenu-container {
    min-width: 275px;
}

/* WPML language selector */
header .wpml-language-switcher-block ul.horizontal-list {
    gap: 0 !important;
    li:first-child {
        &:after {
            content: "/";
            margin: 0 2px;
        }
    }
    li[data-wpml='language-item']:first-of-type {
        margin-top: 0 !important;
    }
    a {
        font-weight: 400;
    }
}

/* Main blocks */
main {
    /* Avoid overflow */
    overflow-x: hidden;
    /* Banners */
    .wp-block-cover {
        height: 54dvh;
    }
    /* Titles */
    :where(h1, h2, h3, h4, h5, h6) {
        text-wrap: balance;
        &.is-style-barres {
            display: flex;
            align-items: center;
            &::after, &::before {
                content: " ";
                display: block;
                height: 1px;
                width: 45%;
                flex-shrink: 1;
                background-color: currentColor;
            }
            &::before {
                margin-inline-end: 15px;
            }
            &::after {
                margin-inline-start: 15px;
            }
        }
        &.is-style-cartouche {
            color: var(--wp--preset--color--accent-4);
            position: relative;
            border-bottom: 0;
            padding-bottom: 0;
            &::before, &::after {
                content: " ";
                display: block;
                position: absolute;
                z-index: -1;
            }
            &::before {
                height: 1px;
                width: 100%;
                left: 0px;
                top: 50%;
                background-color: var(--wp--preset--color--contrast);
            }
            &::after {
                height: 220%;
                top: -60%;
                left: 50%;
                transform: translateX(-50%);
                width: 80%;
                max-width: 1120px;
                background-color: var(--wp--preset--color--contrast);
            }
        }
    }
    /* Lists */
    ul.wp-block-list {
        list-style-type: none;
        width: fit-content;
        li {
            display: flex;
            align-items: center;
            margin-bottom: 0.5em;
            &::before {
                content: " ";
                display: inline-block;
                width: 25px;
                flex-shrink: 0;
                height: 17px;
                background: url('assets/images/fleche.png') no-repeat;
                margin-inline-end: 1.8em;
            }
        }
    }
    /* Groupes */
    /*.entry-content > .wp-block-group.has-global-padding {
        margin-block: 0;
        padding-block: var(--wp--preset--spacing--50);
    }*/
    /* Accordions */
    .kt-accodion-icon-style-basic .kt-blocks-accordion-icon-trigger:after, .kt-accodion-icon-style-basic .kt-blocks-accordion-icon-trigger:before, .kt-accodion-icon-style-basiccircle .kt-blocks-accordion-icon-trigger:after, .kt-accodion-icon-style-basiccircle .kt-blocks-accordion-icon-trigger:before {
        height: 2px;
        width: 15px;
    }
    .kt-blocks-accordion-title {
        font-weight: 700;
    }
    /* Projets */
    .wp-block-post > .wp-block-group {
        height: 100%;
        h2 {
            text-wrap: pretty;
        }
    }
    /* Liste des pages et articles */
    .wp-block-latest-posts.wp-block-latest-posts__list {
        list-style-type: disc;
        padding-inline-start: 40px;
    }
    .wp-block-page-list {
        .wp-block-pages-list__item.current-menu-item {
            display: none;
        }
    }
}

/* Special blocks */
.columns--metiers {
    .wp-block-column {
        position: relative;
        &:not(:last-child) {
            &::after {
                content: " ";
                display: block;
                background-color: var(--wp--preset--color--contrast);
                position: absolute;
            }
        }
    }
    svg {
        &:hover, &:focus {
            .cls-1 {                
                fill: url(#Gradient1);
            }
        }
    }
}    
@media screen and (max-width: 781px) {
    .columns--metiers {
        .wp-block-column {
            &:not(:last-child) {
                &::after {
                    height: 1px;
                    width: 270px;
                    bottom: -1em;
                    left: calc(50% - 135px);
                }
            }
        }
    }    
}
@media screen and (min-width: 782px) {
    .columns--metiers {
        .wp-block-column {
            &:not(:last-child) {
                &::after {
                    height: 105px;
                    width: 1px;
                    top: 0;
                    right: -1em;
                }
            }
        }
    }    
}

.columns--enjeux {
    .wp-block-column {
        border-width: 9px;
        border-style: solid;
        border-image: linear-gradient(to right, #848787, #d1d3d4) 1;
        border-right: 0;
        padding-inline: 1.5em;
        padding-block-end: 1.5em;
        margin-block-start: var(--wp--preset--spacing--50, 2.75em);
        .wp-block-heading {
            position: relative;
            font-size: clamp(15px, 1.99cqi, 30px);
            background: linear-gradient(45deg, var(--wp--preset--color--accent, #cb9b50) 0%, var(--wp--preset--color--accent-2, #f4e17a) 40%, var(--wp--preset--color--accent-3, #f6f2c0) 50%, var(--wp--preset--color--accent-2, #f4e17a) 60%, var(--wp--preset--color--accent, #cb9b50) 100%);
            padding: 0.75em;
            margin-top: calc(-1em - 12px);
            &::after {
                content: " ";
                display: block;
                position: absolute;
                top: 0;
                right: -0.75em;
                clip-path: polygon(0% 0, 100% 100%, 0 100%);
                width: 0.75em;
                height: calc(1em + 3px);
                background-image: linear-gradient(45deg, var(--wp--preset--color--accent, #cb9b50) 0%, var(--wp--preset--color--accent-2, #f4e17a) 40%, var(--wp--preset--color--accent-3, #f6f2c0) 50%, var(--wp--preset--color--accent-2, #f4e17a) 60%, var(--wp--preset--color--accent, #cb9b50) 100%);
            }
        }
    }
}

/* Elements */
/* Liens */
:root a:where(:not(.wp-element-button)):hover, 
:root a:where(:not(.wp-element-button)):focus {
    text-decoration: none;
}
/* Paragraphes */
:where(p) {
    text-align: justify;
}
/* Boutons */
:where(button) {
    font-family: var(--wp--preset--font-family--lusitana);
}

/* Footer */
footer.wp-block-template-part {
    margin-block-start: 0;
}
footer p {
    text-align: left;
}
footer .wp-block-social-links .wp-social-link {
    a {
        padding: 0;
    }
    svg {
        height: 0.9em;
        width: 0.9em;
    }
}
.wp-container-core-navigation-is-layout-3 li:not(:last-child):after {
    content: "|";
    margin: 0 5px;
}