/**
 * Témini — estilos específicos del sitio
 */

.temini-skip-link {
	position: absolute;
	left: 8px;
	top: -100px;
	z-index: 100000;
	padding: 8px 16px;
	background: #141414;
	color: #fff;
	text-decoration: none;
}

.temini-skip-link:focus {
	top: 8px;
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.cmplz-link.tcf,
.cmplz-manage-vendors.tcf,
.cmplz-cookiebanner li:has(> .cmplz-link.tcf),
.cmplz-cookiebanner li:has(> .cmplz-manage-vendors.tcf) {
	display: none !important;
}

/*********************************\
            COMPLIANZ
\*********************************/
/* Cookies button */
body #cmplz-manage-consent .cmplz-manage-consent {
    background: var(--cookie-button-background);
    right: 8px !important;
    left: auto;
    font-size: 0;
    line-height: 0;
    color: var(--cookie-button-color);
    bottom: 10px !important;
    padding: 0;
    width: var(--cookie-button-size);
    height: var(--cookie-button-size);
    border-radius: var(--cookie-button-radius);
    min-width: 0px;
    box-shadow: var(--cookie-button-shadow);

    &:before {
        content: "\e901";
        font-family: 'temini';
        font-size: calc(var(--cookie-button-size) * 0.6);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    &:hover:before { transform: translate(-50%, -50%); }

    &:focus-visible {
        outline: 2px solid #fff;
        outline-offset: 2px;
    }
}

/* Cookies banner */
#cmplz-cookiebanner-container {
    .cmplz-body { scrollbar-width: none; }

    .cmplz-cookiebanner {
        grid-row-gap: 5px;
        padding: var(--size-s);
    }

    .cmplz-header, .cmplz-divider-header { display: none; }

    .cmplz-link.tcf,
    .cmplz-manage-vendors.tcf {
        display: none !important;
    }   

    p {
        margin: 0;
        font-size: var(--p-s);
    }   
    
    .cmplz-buttons .cmplz-btn {
        letter-spacing: 0;
        font-size: var(--p-s) !important;
        line-height: 1.2 !important;
        text-transform: uppercase;
        justify-content: center;
        height: auto;
    }
    
    .cmplz-categories .cmplz-category {
        &:not(:last-child) { margin-bottom: 5px; }

        .cmplz-category-header .cmplz-category-title { 
            font-size: var(--p-s);
            line-height: 1; 
            font-weight: 500;
        }

        .cmplz-category-header .cmplz-always-active {
            font-size: calc(var(--p-s) * 0.8);
            line-height: 1;
        }
    }
}

/* Complianz documents */
#cmplz-document {
    max-width: 100%;
    padding: var(--size-xl) 0;
    text-align: justify;

    p, li, td {
        font-size: var(--p-m);
        line-height: 1.4;
        font-weight: 400;
    }

    h2, h3, h4 {
        font-weight: 600;
        border: 0;
        padding: 0;
        margin: 0 0 var(--size-m);
        line-height: 1.2;
    }

    h2 {
        font-size: var(--h2);
        margin-top: var(--size-m);
    
        &:first-child { margin-top: 0; }
    }
    
    h3 { font-size: var(--h3); }
    
    h4 {
        font-size: var(--h4);
        font-weight: 700;
    }
}


/*********************************\
             HEADER
\*********************************/
/* Menú */
.mfn-header-menu {
    gap: var(--size-m);

    & > .mfn-menu-li > .mfn-menu-link { 
        padding: 0; 
        color: var(--black);

        &:hover { color: var(--primary); }
    }
}

/* Language switcher */
.wp-child-theme-temini .wpml-ls-legacy-list-horizontal {
    padding: 0;
    border: 0;

    /* Misma tipografía que el menú, para que se lea como parte de la barra */
    font-size: var(--a-nav);
    line-height: 1.4;
    font-weight: 500;
    letter-spacing: 0.02rem;
    font-family: var(--font-decorative);
    text-transform: uppercase;

    ul {
        display: flex;
        gap: var(--size-xxs);

        li {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: var(--size-xxs);

            a {
                padding: 0;
                color: var(--black);

                &:hover { color: var(--primary); }
            }

            &.wpml-ls-current-language a { color: var(--primary); }

            &:not(:first-child):before {
                content: "|";
                color: var(--black);
                font-size: 1.2em;
            }

            /* WPML añade el nombre traducido entre paréntesis — "EN (Inglés)".
               Se oculta a la vista, pero sigue en el aria-label del enlace. */
            .wpml-ls-display { display: none; }

            /* Orden fijo ES | EN en los dos idiomas: WPML ordena el DOM según
               el idioma activo, así que se fija por la clase de idioma y no
               por la posición. */
            order: 2;

            &.wpml-ls-item-es {
                order: 1;

                &:before { content: none; }
            }

            &.wpml-ls-item-en:before {
                content: "|";
                color: var(--black);
                font-size: 1.2em;
            }
        }
    }
}

/* Header fondo oscuro — 130 (es) y su traducción, 142 (en) */
body {
    &:not(.mfn-header-scrolled) {
        #mfn-header-template[data-id="130"] .section,
        #mfn-header-template[data-id="142"] .section { backdrop-filter: blur(0); }
    }

    &.mfn-header-scrolled {
        #mfn-header-template[data-id="130"],
        #mfn-header-template[data-id="142"] { --header-background: rgba(20, 20, 20, .6); }
    }
}

/* El selector de idiomas en la cabecera oscura (130 y su traducción, 142).
   El menú se pone blanco desde el estilo local de su propio item; el switcher
   no lo lleva, así que aquí se le da el mismo color que al resto de la barra. */
#mfn-header-template[data-id="130"],
#mfn-header-template[data-id="142"] {

    .wpml-ls-legacy-list-horizontal ul li {

        a {
            color: var(--white);

            &:hover { color: var(--white); }
        }

        &.wpml-ls-current-language a { color: var(--white); }

        &.wpml-ls-item-en:before { color: var(--white); }
    }
}


/*********************************\
              FOOTER
\*********************************/
.mfn-footer { overflow-x: visible; }

.wrap.fit { 
    width: fit-content; 

    @media only screen and (max-width: 959px) {
        width: 100%;
    }
}

.wrap.dir-col > .mcb-wrap-inner { flex-direction: column; }

/* Menu footer */
.mfn-footer-menu {
    font-size: var(--p-s);
    line-height: 1.6;
    font-weight: 400;
    letter-spacing: .05rem;    
}

/* Redes */
ul.social {
    display: flex;
    flex-wrap: wrap;
    gap: var(--size-xxs);
    align-items: center;
    justify-content: center;

    li {
        font-size: var(--p-l);
        line-height: 1;
    }
}

/* Back to top */
#back_to_top.sticky {
    bottom: calc( var(--cookie-button-size) + 16px );
    right: 8px !important;
    width: var(--cookie-button-size);
    height: var(--cookie-button-size);
    font-size: calc(var(--cookie-button-size) * 0.6) !important;
    line-height: 1;
    padding: 0;
    border-radius: var(--cookie-button-radius);
    box-shadow: var(--cookie-button-shadow);
    background: var(--cookie-button-background);
    color: var(--cookie-button-color);
    border: 0;

    i { color: var(--cookie-button-color); }

    &:before { content: none; }
}

body.pojo-active #back_to_top.sticky { bottom: calc( 2 * var(--cookie-button-size) + 22px ) !important; }

/*Kit digital*/
body #mfn-footer-template .financiacion {
    display: grid;
    grid-template-columns: 1fr 1fr 5fr;
    gap: var(--size-m);
    text-align: left;
    align-items: center;

    & > div {
        line-height: 0;

        img {
            max-height: 50px;
            width: auto;
        }

        p {
            font-size: var(--p-s);
            line-height: 1.2;
            margin-bottom: 0;
        }
    }

    @media only screen and (max-width: 959px) {
        grid-template-columns: 1fr 1fr;
        text-align: center;
        gap: 5px;

        & > div:last-child {
            grid-column: 1 / span 2;
        }
    }
}

/* Accesibilidad */
body #pojo-a11y-toolbar {
    top: auto !important;
    bottom: calc( var(--cookie-button-size) + 16px ) !important;

    .pojo-a11y-toolbar-toggle a,
    .pojo-a11y-toolbar-toggle button {
        font-size: calc(var(--cookie-button-size) * 0.6);
        padding: 0;
        width: var(--cookie-button-size);
        height: var(--cookie-button-size);
        display: flex;
        align-items: center;
        justify-content: center;
        border: 0;
        appearance: none;
        border-radius: var(--cookie-button-radius);
        box-shadow: var(--cookie-button-shadow);
        background: var(--cookie-button-background);
        color: var(--cookie-button-color);

        svg {
            height: calc(var(--cookie-button-size) * 0.6);
        }
    }

    .pojo-a11y-toolbar-overlay p.pojo-a11y-toolbar-title {
        line-height: 1.2;
    }

    &.pojo-a11y-toolbar-left .pojo-a11y-toolbar-toggle {
        left: 188px;
        bottom: 0;
    }

    &.pojo-a11y-toolbar-right .pojo-a11y-toolbar-toggle {
        right: 188px;
        bottom: 0;
    }
}


/*********************************\
          FLUENT FORMS
\*********************************/
.fluentform {
    .ff-el-group.politicas {
        margin: 0;
    
        p { 
            font-size: var(--p-s); 
            line-height: 1.4; 
            opacity: 1;
            color: var(--white); 
        }
    }

    input {
        margin: 0;
    }
}


/*********************************\
               404
\*********************************/
#error-404 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    
    .back-404 {
        position: absolute;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: -1;
    
        .title { 
            color: var(--dark-grey);
        }
    }
}

.admin-bar #error-404 .section_wrapper > .wrap > .mcb-wrap-inner { min-height: calc( 100dvh - var(--admin-bar-height) ); }


/*********************************\
            CONTENIDOS
\*********************************/
/* Portada - Línea scroll */
.mcb-wrap-inner:has( > .scroll-wrap ) {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
}

.section:has( .scroll-wrap ) > .mcb-background-overlay,
.mcb-wrap:has( .scroll-wrap ),
.wrap.scroll-wrap {
    z-index: auto;
}

.wrap.scroll-wrap {
    flex: 1 1 auto;

    > .mcb-wrap-inner {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: center;

        &::after {
            content: "";
            flex: 1 1 auto;
            width: 1px;
            min-height: var(--size-xl);
            margin: var(--size-xs) 0;
            background-image: linear-gradient( to bottom, var(--white), var(--white) );
            background-repeat: no-repeat;
            background-size: 1px 0%;
            background-position: center top;
            mix-blend-mode: exclusion;
            animation: temini-scroll-line 5s linear infinite;
        }
    }
}

@keyframes temini-scroll-line {
    0%     { background-size: 1px 0%;   background-position: center top; }
    55%    { background-size: 1px 100%; background-position: center top; }
    55.01% { background-size: 1px 100%; background-position: center bottom; }
    80%    { background-size: 1px 100%; background-position: center bottom; animation-timing-function: ease-in; }
    92%    { background-size: 1px 0%;   background-position: center bottom; }
    100%   { background-size: 1px 0%;   background-position: center bottom; }
}

/* Quick fact */
.style-simple .quick_fact{
    .number-wrapper, .number-wrapper > .label {
        font-family: var(--font-titles);
        font-size: 3.375rem;
        line-height: 1.2;
        font-weight: 700;
        color: var(--white);
    }

    .title_tag {
        color: var(--white);
        font-size: .875rem;
        line-height: 1.4;
        letter-spacing: .02rem;
        font-family: var(--font-decorative);
        font-weight: 500;
        text-transform: uppercase;
        margin: 0;
    }
}

/* Cards servicios */
.cards-servicios {
    .column_image img {
        aspect-ratio: 17.5 / 24.25;
        object-fit: cover;
    }

    @media only screen and (max-width: 1239px) and (min-width: 768px) {
        & > .mcb-wrap-inner {
            grid-template-columns: repeat(3, 1fr) !important;

            .wrap {
                &:nth-child(5) > .mcb-wrap-inner {
                    margin-top: -10rem;
                }

                &:nth-child(6) > .mcb-wrap-inner {
                    margin-top: -2.5rem;
                }
            }
        }
    }

    @media only screen and (max-width: 767px) and (min-width: 520px) {
        & > .mcb-wrap-inner { grid-template-columns: repeat(2, 1fr) !important; }

        .wrap {
            &:nth-child(4) > .mcb-wrap-inner {
                margin-top: -7.5rem;
            }

            &:nth-child(5) > .mcb-wrap-inner {
                margin-top: 0;
            }

            &:nth-child(6) > .mcb-wrap-inner {
                margin-top: -7.5rem;
            }
        }
    }

    @media only screen and (max-width: 519px) {
        & > .mcb-wrap-inner { grid-template-columns: repeat(1, 1fr) !important; }

        .wrap  > .mcb-wrap-inner {
                margin-top: 0 !important;
        }
    }
}