 /*
 Theme Name:   Twenty Twenty-Five Child
 Theme URI:    https://webheroe.com
 Description:  Twenty Twenty-Five child theme
 Author:       Álvaro Torres
 Author URI:   https://webheroe.com
 Template:     twentytwentyfive
 Version:      0.1
*/

:root {
    --red: #DD4147;
    --green: #1EB599;
    --dark-green: #186118;
    --soft-green: #65c65d;
    --white: #f5f5f5;
    --black: #333;
    --gray: #999999;
}

footer,
footer .wp-block-group {
    margin-block-start: 0;
}

main {
    margin-top: 0 !important;
}

.sticky-container {
    position: relative;
}

.sticky-element {
    position: sticky;
    top: 20px;
}

.ad-online {
    position: relative;
}

.ad-online::after {
    content: 'Online';
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: var(--dark-green);
    color: var(--white);
    font-size: 14px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 5px;
    box-shadow: 2px 2px 5px rgba(255, 255, 255, 0.3);
}

.width1200 > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: 1200px !important;
}

.flex300,
.flex600 {
    flex-wrap: wrap !important;
}

.flex300>div,
.flex600>div {
    max-width: 100%;
    flex-basis: unset !important;
}

.flex300>div {
    width: 300px;
}

.flex600>div {
    width: 600px;
}

#respond .wp-block-button__link {
    padding: 10px 30px;
    border-radius: 5px;
    background-color: var(--dark-green);
}

#respond textarea,
#respond input:not([type="checkbox"]):not([type="submit"]) {
    padding: 5px;
    border: 1px solid rgba(0, 0, 0, 0.2) !important;
    border-radius: 5px;
}

#respond textarea {
    height: 100px;
}

.wp-block-search__inside-wrapper input {
    padding: 8px;
}

.wp-block-search__inside-wrapper button {
    padding: 8px 20px;
}

@media (min-width: 450px) and (max-width: 781px) {
    .two-on-mobile {
        justify-content: space-around;
    }

    .wp-block-columns.two-on-mobile:not(.is-not-stacked-on-mobile)>.wp-block-column {
        flex-basis: calc(43% - var(--wp--preset--spacing--50)) !important;
        flex-grow: unset;
    }
}

@media (max-width: 599px) {
    #modal-1.is-menu-open {
        background-color: var(--red) !important;
        z-index: 10;
    }

    #modal-1.is-menu-open>div,
    #modal-1.is-menu-open>div>div  {
        height: 90% !important;
    }

    #modal-1.is-menu-open button[aria-label="Cerrar el menú"] {
        top: 20px;
        right: 20px;
    }

    #modal-1.is-menu-open button[aria-label="Cerrar el menú"] svg {
        width: 37px;
        height: 37px;
        color: var(--white);
    }

    #modal-1-content {
        height: 100%;
        padding: 0;
    }

    #modal-1-content>ul {
        height: 100%;
        width: 100%;
        justify-content: center;
        align-items: center;
        gap: 40px;
    }

    #modal-1-content a {
        color: var(--white) !important;
    }
}

/*********************** FORM conversion ****************************/
#ez-forgotten-password-form-forgotten_email,
#conversion .error-login,
#link-pwd-forgotten,
#ptprelinker-modal-cgu-short {
    display: none;
}

.comment-frm-confirm {
    visibility: hidden;
}

.comment p {
    white-space: normal;
    word-break: break-all;
}

#conversion,
#conversion-two {
	position: fixed;
	right: -5000px;
	left: 5000px;
    width: 0;
	z-index: 15;
	transition: 0.3s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color:rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px);
}

#conversion-three {
    display: flex;
    align-items: center;
    justify-content: center;
}

#conversion>div,
#conversion-two>div,
#conversion-three>div {
	width: fit-content;
	height: fit-content;
	max-width: 90%;
    max-height: 90vh;
	background-color: #fff;
	padding: 25px;
	margin-right: 0 !important;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
    border-radius: 12px;
}

/* #conversion label input:focus-visible,
#conversion label textarea:focus-visible {
	outline: 1px solid var(--dark-green);
	border: 2px solid var(--dark-green) !important;
} */

#conversion label,
#conversion-two label,
#conversion-three label {
    font-size: 16px;
    font-weight: 600;
}

#conversion label{
    display: block;
}

#conversion .ptprelinker-legend-form:not(i) {
    font-weight: 600;
}

#conversion .ptprelinker-input-group,
#conversion-two .ptprelinker-input-group,
#conversion-three .ptprelinker-input-group {
    margin-top: 10px;
}

#conversion-two .ptprelinker-input-group,
#conversion-three .ptprelinker-input-group {
    display: flex;
    justify-content: space-between;
}

#conversion-two select,
#conversion-three select {
    width: 100%;
}

#conversion i,
#conversion-two i,
#conversion-three i {
    color: var(--dark-green);
}

#conversion-two i,
#conversion-three i {
    margin-right: 5px;
}

#conversion input:not([type="submit"]),
#conversion-two input:not([type="submit"]),
#conversion-three input:not([type="submit"]){
    padding: 5px;
    border-radius: 3px;
    border: 1px solid var(--green);
}

#conversion input[type="submit"],
#conversion-two input[type="submit"],
#conversion-three input[type="submit"],
#modal-1-content li:last-child {
    border: none;
    border-radius: 6px;
    background-color: var(--dark-green) !important;
    color: var(--white);
}

#modal-1-content li:last-child {
    padding: 2px 10px 3px;
    margin-bottom: -3px;
}

#conversion input[type="submit"],
#conversion-two input[type="submit"],
#conversion-three input[type="submit"] {
    padding: 5px 15px;
    cursor: pointer;
    margin: 10px 0 0 auto;
    display: block;
    font-size: 16px;
}

@media (max-width: 781px) {
    #conversion>div,
    #conversion-two>div,
    #conversion-three>div {
        width: 500px;
        max-width: 100%;
    }

    #conversion input:not([type="submit"]),
    #conversion-two input:not([type="submit"]),
    #conversion-three input:not([type="submit"]) {
        width: 100%;
    }
}

/*********************** end FORM conversion ****************************/