/*
Theme Name: MACOEV V2
Author: MACOEV S.r.l.SB.
Author URI:https://macoev.com 
Tags: full-site-editing
Text Domain: macoev
Requires at least: 6.4
Requires PHP: 7.4
Tested up to: 6.4
Version: 1.0.0

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

Generated on fullsiteediting.com. No code version.
*/

/* ==========================================================================
   UTILITY CLASSES (Framework "CSS First" basato su theme.json)
   ========================================================================== */

/* --------------------------------------------------------------------------
   Flexbox Utilities
   -------------------------------------------------------------------------- */
.d-flex {display: flex !important;}
.flex-row {flex-direction: row !important;}
.flex-column {flex-direction: column !important;}
.flex-wrap {flex-wrap: wrap !important;}
.flex-nowrap {flex-wrap: nowrap !important;}
.justify-content-start {justify-content: flex-start !important;}
.justify-content-between {justify-content: space-between !important;}
.justify-content-end {justify-content: flex-end !important;}
.align-items-start {align-items: flex-start !important;}
.align-items-center {align-items: center !important;}
.align-items-end {align-items: flex-end !important;}
.align-items-stretch {align-items: stretch !important;}
.align-items-baseline {align-items: baseline !important;}
.align-self-start {align-self: flex-start !important;}
.align-self-center {align-self: center !important;}
.align-self-end {align-self: flex-end !important;}
.align-self-stretch {align-self: stretch !important;}
.align-self-baseline {align-self: baseline !important;}

/* --------------------------------------------------------------------------
   Spacing Utilities
   -------------------------------------------------------------------------- */
/* -- Gaps -- */
.gap-0 {gap: var(--wp--preset--spacing--0) !important;} /* None (0px) */
.gap-1 {gap: var(--wp--preset--spacing--1) !important;} /* Extra Small (8px) */
.gap-2 {gap: var(--wp--preset--spacing--2) !important;} /* Small (16px) */
.gap-3 {gap: var(--wp--preset--spacing--3) !important;} /* Medium (24px) */
.gap-4 {gap: var(--wp--preset--spacing--4) !important;} /* Large (40px) */
.gap-6 {gap: var(--wp--preset--spacing--6) !important;} /* Extra Large (64px) */
.gap-10 {gap: var(--wp--preset--spacing--10) !important;} /* Extra Extra Large (120px) */

/* -- Padding -- */

/* None (0px) */
.p-0{padding: var(--wp--preset--spacing--0) !important;}
.px-0{padding-left:var(--wp--preset--spacing--0) !important; padding-right: var(--wp--preset--spacing--0) !important;}
.py-0{padding-top: var(--wp--preset--spacing--0) !important; padding-bottom: var(--wp--preset--spacing--0) !important;}
.pt-0{padding-top: var(--wp--preset--spacing--0) !important;}
.pr-0{padding-right: var(--wp--preset--spacing--0) !important;}
.pb-0{padding-bottom: var(--wp--preset--spacing--0) !important;}
.pl-0{padding-left: var(--wp--preset--spacing--0) !important;}

/* Extra Small (8px) */
.p-1{padding: var(--wp--preset--spacing--1) !important;}
.px-1{padding-left: var(--wp--preset--spacing--1) !important; padding-right: var(--wp--preset--spacing--1) !important;}
.py-1{padding-top: var(--wp--preset--spacing--1) !important; padding-bottom: var(--wp--preset--spacing--1) !important;}
.pt-1{padding-top: var(--wp--preset--spacing--1) !important;}
.pr-1{padding-right: var(--wp--preset--spacing--1) !important;}
.pb-1{padding-bottom: var(--wp--preset--spacing--1) !important;}
.pl-1{padding-left: var(--wp__preset__spacing__1) !important;}

/* Small (16px) */
.p-2{padding: var(--wp--preset--spacing--2) !important;}
.px-2{padding-left: var(--wp--preset--spacing--2) !important; padding-right: var(--wp--preset--spacing--2) !important;}
.py-2{padding-top: var(--wp--preset--spacing--2) !important; padding-bottom: var(--wp--preset--spacing--2) !important;}
.pt-2{padding-top: var(--wp--preset--spacing--2) !important;}
.pr-2{padding-right: var(--wp--preset--spacing--2) !important;}
.pb-2{padding-bottom: var(--wp--preset--spacing--2) !important;}
.pl-2{padding-left: var(--wp__preset__spacing__2) !important;}

/* Medium (24px) */
.p-3{padding: var(--wp--preset--spacing--3) !important;}
.px-3{padding-left: var(--wp--preset--spacing--3) !important; padding-right: var(--wp--preset--spacing--3) !important;}
.py-3{padding-top: var(--wp--preset--spacing--3) !important; padding-bottom: var(--wp--preset--spacing--3) !important;}
.pt-3{padding-top: var(--wp--preset--spacing--3) !important;}
.pr-3{padding-right: var(--wp--preset--spacing--3) !important;}
.pb-3{padding-bottom: var(--wp--preset--spacing--3) !important;}
.pl-3{padding-left: var(--wp--preset--spacing--3) !important;}

/* Large (32px) */
.p-4{padding: var(--wp--preset--spacing--4) !important;}
.px-4{padding-left: var(--wp--preset--spacing--4) !important; padding-right: var(--wp--preset--spacing--4) !important;}
.py-4{padding-top: var(--wp--preset--spacing--4) !important; padding-bottom: var(--wp--preset--spacing--4) !important;}
.pt-4{padding-top: var(--wp--preset--spacing--4) !important;}
.pr-4{padding-right: var(--wp--preset--spacing--4) !important;}
.pb-4{padding-bottom: var(--wp--preset--spacing--4) !important;}
.pl-4{padding-left: var(--wp--preset--spacing--4) !important;}

/* Extra Large (64px) */
.p-6{padding: var(--wp--preset--spacing--6) !important;}
.px-6{padding-left: var(--wp--preset--spacing--6) !important; padding-right: var(--wp--preset--spacing--6) !important;}
.py-6{padding-top: var(--wp--preset--spacing--6) !important; padding-bottom: var(--wp--preset--spacing--6) !important;}
.pt-6{padding-top: var(--wp--preset--spacing--6) !important;}
.pr-6{padding-right: var(--wp--preset--spacing--6) !important;}
.pb-6{padding-bottom: var(--wp--preset--spacing--6) !important;}
.pl-6{padding-left: var(--wp--preset--spacing--6) !important;}

/* Extra Extra Large (120px) */
.p-10{padding: var(--wp--preset--spacing--10) !important;}
.px-10{padding-left: var(--wp--preset--spacing--10) !important; padding-right: var(--wp--preset--spacing--10) !important;}
.py-10{padding-top: var(--wp--preset--spacing--10) !important; padding-bottom: var(--wp--preset--spacing--10) !important;}
.pt-10{padding-top: var(--wp--preset--spacing--10) !important;}
.pr-10{padding-right: var(--wp--preset--spacing--10) !important;}
.pb-10{padding-bottom: var(--wp--preset--spacing--10) !important;}
.pl-10{padding-left: var(--wp--preset--spacing--10) !important;}

/* -- Margin -- */

/* None (0px) */
.m-0{margin: var(--wp--preset--spacing--0) !important;}
.mx-0{margin-left: var(--wp--preset--spacing--0) !important; margin-right: var(--wp--preset--spacing--0) !important;}
.my-0{margin-top: var(--wp--preset--spacing--0) !important; margin-bottom: var(--wp--preset--spacing--0) !important;}
.mt-0{margin-top: var(--wp--preset--spacing--0) !important;}
.mr-0{margin-right: var(--wp--preset--spacing--0) !important;}
.mb-0{margin-bottom: var(--wp--preset--spacing--0) !important;}
.ml-0{margin-left: var(--wp--preset--spacing--0) !important;}

/* Extra Small (8px) */
.m-2{margin: var(--wp--preset--spacing--1) !important;}
.mx-2{margin-left: var(--wp--preset--spacing--1) !important; margin-right: var(--wp--preset--spacing--1) !important;}
.my-2{margin-top: var(--wp--preset--spacing--1) !important; margin-bottom: var(--wp--preset--spacing--1) !important;}
.mt-2{margin-top: var(--wp--preset--spacing--1) !important;}
.mr-2{margin-right: var(--wp--preset--spacing--1) !important;}
.mb-2{margin-bottom: var(--wp--preset--spacing--1) !important;}
.ml-2{margin-left: var(--wp--preset--spacing--1) !important;}

/* Small (16px) */
.m-3{margin: var(--wp--preset--spacing--2) !important;}
.mx-3{margin-left: var(--wp--preset--spacing--2) !important; margin-right: var(--wp--preset--spacing--2) !important;}
.my-3{margin-top: var(--wp--preset--spacing--2) !important; margin-bottom: var(--wp--preset--spacing--2) !important;}
.mt-3{margin-top: var(--wp--preset--spacing--2) !important;}
.mr-3{margin-right: var(--wp--preset--spacing--2) !important;}
.mb-3{margin-bottom: var(--wp--preset--spacing--2) !important;}
.ml-3{margin-left: var(--wp--preset--spacing--2) !important;}

/* Medium (24px) */
.m-4{margin: var(--wp--preset--spacing--3) !important;}
.mx-4{margin-left: var(--wp--preset--spacing--3) !important; margin-right: var(--wp--preset--spacing--3) !important;}
.my-4{margin-top: var(--wp--preset--spacing--3) !important; margin-bottom: var(--wp--preset--spacing--3) !important;}
.mt-4{margin-top: var(--wp--preset--spacing--3) !important;}
.mr-4{margin-right: var(--wp--preset--spacing--3) !important;}
.mb-4{margin-bottom: var(--wp--preset--spacing--3) !important;}
.ml-4{margin-left: var(--wp--preset--spacing--3) !important;}

/* Large (40px) */
.m-5{margin: var(--wp--preset--spacing--4) !important;}
.mx-5{margin-left: var(--wp--preset--spacing--4) !important; margin-right: var(--wp--preset--spacing--4) !important;}
.my-5{margin-top: var(--wp--preset--spacing--4) !important; margin-bottom: var(--wp--preset--spacing--4) !important;}
.mt-5{margin-top: var(--wp--preset--spacing--4) !important;}
.mr-5{margin-right: var(--wp--preset--spacing--4) !important;}
.mb-5{margin-bottom: var(--wp--preset--spacing--4) !important;}
.ml-5{margin-left: var(--wp--preset--spacing--4) !important;}

/* Extra Large (64px) */
.m-6{margin: var(--wp--preset--spacing--6) !important;}
.mx-6{margin-left: var(--wp--preset--spacing--6) !important; margin-right: var(--wp--preset--spacing--6) !important;}
.my-6{margin-top: var(--wp--preset--spacing--6) !important; margin-bottom: var(--wp--preset--spacing--6) !important;}
.mt-6{margin-top: var(--wp--preset--spacing--6) !important;}
.mr-6{margin-right: var(--wp--preset--spacing--6) !important;}
.mb-6{margin-bottom: var(--wp--preset--spacing--6) !important;}
.ml-6{margin-left: var(--wp--preset--spacing--6) !important;}

/* Extra Extra Large (120px) */
.m-10{margin: var(--wp--preset--spacing--10) !important;}
.mx-10{margin-left: var(--wp--preset--spacing--10) !important; margin-right: var(--wp--preset--spacing--10) !important;}
.my-10{margin-top: var(--wp--preset--spacing--10) !important; margin-bottom: var(--wp--preset--spacing--10) !important;}
.mt-10{margin-top: var(--wp--preset--spacing--10) !important;}
.mr-10{margin-right: var(--wp--preset--spacing--10) !important;}
.mb-10{margin-bottom: var(--wp--preset--spacing--10) !important;}
.ml-10{margin-left: var(--wp--preset--spacing--10) !important;}

/* Auto */
.mx-auto{margin-left: auto !important; margin-right: auto !important;}
.my-auto{margin-top: auto !important; margin-bottom: auto !important;}

/* ==========================================================================
   MAPPATURA STATI E STRUTTURA PULSANTI
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Struttura base statica
   -------------------------------------------------------------------------- */

.wp-block-button .wp-block-button__link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--wp--preset--spacing--1) !important;
    border: 1px solid transparent !important; /* Mantiene stabile l'ingombro visivo */
    box-sizing: border-box !important;
    cursor: pointer;
}

/* --------------------------------------------------------------------------
   2. Regole di accessibilità da tastiera (focus)
   -------------------------------------------------------------------------- */

/* FOCUS: Cornice visibile solo quando si naviga con la tastiera */
.wp-block-button .wp-block-button__link:focus-visible {
    outline: 3px solid #ffffff !important;
    outline-offset: 3px !important;
}

/* --------------------------------------------------------------------------
   3. Allinea testo e icona in modo flessibile 
   -------------------------------------------------------------------------- */

.wp-block-button.is-style-icon-right .wp-block-button__link,
.wp-block-button.is-style-icon-left .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em; /* Spazio tra testo e freccia */
}


/* ==========================================================================
   MAPPATURA DETTAGLIATA DI TUTTI GLI STATI CROMATICI
   ========================================================================== */

/* --------------------------------------------------------------------------
   VARIANTE 1: PRIMARY
   -------------------------------------------------------------------------- */

.wp-block-button.btn-primary .wp-block-button__link,
/* <--- Classe Gutenberg wrapper ---> */
.wp-block-button .wp-block-button__link.has-primary-background-color.has-base-dark-color

/* <--- Palette di WordPress ---> */
    {

    /* Default state */
    background-color: var(--wp--custom--btn--primary--background) !important;
    color: var(--wp--custom--btn--primary--text) !important;
    border: var(--wp--custom--btn--primary--border) !important;

    /* Hover state */
    &:hover {
        background-color: var(--wp--custom--btn--primary--background-hover) !important;
        color: var(--wp--custom--btn--primary--text) !important;
        border: var(--wp--custom--btn--primary--border-hover) !important;
    }

    /* Active state */
    &:active {
        background-color: var(--wp--custom--btn--primary--background-active) !important;
        color: var(--wp--custom--btn--primary--text) !important;
        border: var(--wp--custom--btn--primary--border-active) !important;
    }
}

/* --------------------------------------------------------------------------
   VARIANTE 2: Outline-primary
   -------------------------------------------------------------------------- */

.wp-block-button.btn-outline-primary .wp-block-button__link,
.wp-block-button .wp-block-button__link:not(.has-background).has-base-light-color.has-stroke-border-color {

    /* Default state */
    background-color: var(--wp--custom--btn--outline-primary--background) !important;
    color: var(--wp--custom--btn--outline-primary--text) !important;
    border: var(--wp--custom--btn--outline-primary--border) !important;

    /* Hover state */
    &:hover {
        background-color: var(--wp--custom--btn--outline-primary--background-hover) !important;
        color: var(--wp--custom--btn--outline-primary--text-hover) !important;
        border: var(--wp--custom--btn--outline-primary--border-hover) !important;
    }

    /* Active state */
    &:active {
        background-color: var(--wp--custom--btn--outline-primary--background-active) !important;
        color: var(--wp--custom--btn--outline-primary--text-active) !important;
        border: var(--wp--custom--btn--outline-primary--border-active) !important;
    }
}

/* --------------------------------------------------------------------------
   VARIANTE 3: Secondary
   -------------------------------------------------------------------------- */

.wp-block-button.btn-secondary .wp-block-button__link,
.wp-block-button .wp-block-button__link.has-base-dark-background-color.has-base-light-color {

    /* Default state */
    background-color: var(--wp--custom--btn--secondary--background) !important;
    color: var(--wp--custom--btn--secondary--text) !important;
    border: var(--wp--custom--btn--secondary--border) !important;

    /* Hover state */
    &:hover {
        background-color: var(--wp--custom--btn--secondary--background-hover) !important;
        color: var(--wp--custom--btn--secondary--text-hover) !important;
        border: var(--wp--custom--btn--secondary--border-hover) !important;
    }

    /* Active state */
    &:active {
        background-color: var(--wp--custom--btn--secondary--background-active) !important;
        color: var(--wp--custom--btn--secondary--text-active) !important;
        border: var(--wp--custom--btn--secondary--border-active) !important;
    }

}

/* --------------------------------------------------------------------------
   VARIANTE 4: Outline-secondary
   -------------------------------------------------------------------------- */

.wp-block-button.btn-outline-secondary .wp-block-button__link,
.wp-block-button .wp-block-button__link:not(.has-background).has-text-title-dark-color.has-stroke-border-color  {

    /* Default state */
    background-color: var(--wp--custom--btn--outline-secondary--background) !important;
    color: var(--wp--custom--btn--outline-secondary--text) !important;
    border: var(--wp--custom--btn--outline-secondary--border) !important;

    /* Hover state */
    &:hover {
        background-color: var(--wp--custom--btn--outline-secondary--background-hover) !important;
        color: var(--wp--custom--btn--outline-secondary--text-hover) !important;
        border: var(--wp--custom--btn--outline-secondary--border-hover) !important;
    }

    /* Active state */
    &:active {
        background-color: var(--wp--custom--btn--outline-secondary--background-active) !important;
        color: var(--wp--custom--btn--outline-secondary--text-active) !important;
        border: var(--wp--custom--btn--outline-secondary--border-active) !important;
    }

}

/* --------------------------------------------------------------------------
   VARIANTE 5: Crea il riquadro per l'icona usando la mask-image
   -------------------------------------------------------------------------- */

.wp-block-button.is-style-icon-right .wp-block-button__link::after,
.wp-block-button.is-style-icon-left .wp-block-button__link::before {
    content: "";
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    background-color: currentColor;

    /* URL assoluto con il nome cartella corretto */
    -webkit-mask-image: url('./assets/svg/mdi/arrow-outward.svg');
    mask-image: url('./assets/svg/mdi/arrow-outward.svg');

    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

/* --------------------------------------------------------------------------
   VARIANTE 6: Inverte l'ordine visivo a seconda della scelta dell'utente
   -------------------------------------------------------------------------- */

.wp-block-button.is-style-icon-right .wp-block-button__link::after {
    order: 2;
}

.wp-block-button.is-style-icon-left .wp-block-button__link::before {
    order: -1;
}

/* ==========================================================================
   Header Sticky & Transizione Trasparente -> Sfondo Scuro
   ========================================================================== */

.sticky-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background-color: transparent;
    /* Partenza Trasparente */
    transition: background-color 0.4s ease-in-out, padding 0.4s ease-in-out;
    min-height: 100px;
    height: 6.25rem;
}

.sticky-header.is-scrolled {
    background-color: var(--wp--preset--color--base-dark, #121212) !important;
}

/* ==========================================================================
   Blocco Navigazione FSE (Custom Colors & Hover)
   ========================================================================== */

/*CSS navigation*/
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .current-menu-item>.wp-block-navigation-item__content {
    color: var(--wp--preset--color--primary);
}

/* ==========================================================================
   Blocco Navigazione FSE (Custom Colors & Hover)
   ========================================================================== */
.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--base-dark, #121212) !important;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    justify-content: end;
}

/* Colora l'icona di chiusura (X) di bianco */
.wp-block-navigation__responsive-container-close {
    color: var(--wp--preset--color--base-light, #ffffff) !important;
    position: fixed;
    top: 40px;
    right: 32px;
}

/*Imposto il colore bianco alle voci di menu*/
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    color: var(--wp--preset--color--base-light, #ffffff) !important;
}

/* Centra le voci del menu verticalmente e orizzontalmente a tutto schermo */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    align-items: center !important;
    justify-content: flex-start !important;
    overflow-y: auto;
    height: calc(100dvh - 15vh) !important;
    padding-bottom: 5vh !important;
    padding-top: unset !important;
    /* overflow-y: auto; */
    /* gap: 30px !important;  */
    /*padding-bottom: 10vh;*/
    /* Compensa lo spazio visivo spostando leggermente in alto i link */
}

/*Centra le vocu di menu al centro del contenitore*/
.wp-block-navigation__responsive-container.is-menu-open .wp-block-page-list {
    align-items: center !important;
    gap: 32px !important;
    margin-left: 5vw !important;
    margin-right: 5vw !important;
}

.wp-block-page-list {
    text-align: center;
}

/* Imposto il logo del sito con z-index superiore a dialog menu mobile. */
.is-default-size.wp-block-site-logo{
    z-index: 100001;
}


/* ==========================================================================
   Footer
   ========================================================================== */
   .site-footer .footer-section-title {
        font-size: var(--wp-preset--font-size--body-2);
        font-weight: 700;
        text-transform: uppercase;
        color: var(--wp--preset--color--text-title-light);
        margin-top: 0px!important;
        margin-bottom: var(--wp--preset--spacing--xs);
        display: block!important;
   }

   .site-footer .footer-col-left, .site-footer .footer-col-right {
    width: auto;
    max-width:50%;
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--md);
   }

/* ==========================================================================
    Image
   ========================================================================== */
.certifications-logos img, .partnerships-logos img {
    height: 40px;
    width:auto;
}

/* ==========================================================================
   Blocco Testimonianze: Allinea verticalmente il testo e l'immagine
   ========================================================================== */
hr {
    height: 1px;
    border: none!important;
    width: 100%;
    background-color: black; /* 1. Regole base tutte in alto */
    &.divider-gray-light {
        background-color: var(--wp--preset--color--gray-light, #E2EBED80) !important;
    }
}

/* ==========================================================================
   Media query
   ========================================================================== */
   
/*Mobile*/
@media (max-width:768px) {
       .hide-on-mobile {
           display: none !important;
       }
       .site-footer .footer-col-left, .site-footer .footer-col-right {
           max-width:100%;
       }
}
   
/*Tablet*/
@media (max-width:1024px) {
    .hide-on-tablet {
        display: none !important;
    }
    .site-footer .footer-col-left, .site-footer .footer-col-right {
        max-width:100%;
    }
}

/*Desktop*/
@media (min-width:1025px) {
    .hide-on-desktop {
        display: none !important;
    }
}