/*
Theme Name: Marcav
Theme URI: 
Author: 
Author URI: 
Description: 
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: marcav
Tags: 
*/
html {
    scroll-behavior: smooth;
}

.sticky {
    position: fixed;
    width: 100%;
    z-index: 2;
    inset: 0;
    bottom: initial;
}

@media (max-width: 991px) {
    .pre-header, .surgeon-name {
        display: none !important;
    }
}

nav {
    @media screen and (max-width: 600px) {
        order: 3;
    }
}

.map {
    overflow: hidden;
}

.wp-block-velcome-group-anchor > div {
    justify-content: center;
}

.w-full {
    width: 100% !important;
}

.align-center,
.align-center a {
    display: flex;
    flex-direction: row;
    align-items: center;

    figure {
        display: flex;
    }
}

.align-center a {
    gap: 5px;
}

.included-list,
.n-included-list,
.checked-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.checked-list li,
.included-list li,
.n-included-list li {
    position: relative;
    padding-left: 30px; /* space for the icon */
}

.checked-list li::before,
.included-list li::before,
.n-included-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
}

.checked-list li::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.7666 3.28394C7.08154 3.28394 3.28351 7.08196 3.28351 11.767C3.28351 16.4521 7.08154 20.2501 11.7666 20.2501C16.4517 20.2501 20.2497 16.4521 20.2497 11.767C20.2497 7.08196 16.4517 3.28394 11.7666 3.28394Z' fill='%23EE2B31'/%3E%3Cpath d='M15.6676 9.01611L9.85134 14.523L7.87134 12.543' stroke='white' stroke-width='1.155' stroke-linecap='round'/%3E%3C/svg%3E");
}

.included-list li::before {
    background-image: url("data:image/svg+xml,%3Csvg width='27' height='27' viewBox='0 0 27 27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.5 14.1875L10.0385 19.6875L22.5 7.3125' stroke='%2300A63E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.n-included-list li::before {
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75787 7.50294C5.41404 7.1591 5.41404 6.60172 5.75787 6.25788C6.1017 5.91404 6.65917 5.91404 7.003 6.25788L5.75787 7.50294ZM12.8725 12.1275C13.2164 12.4713 13.2164 13.0287 12.8725 13.3725C12.5287 13.7164 11.9713 13.7164 11.6275 13.3725L12.8725 12.1275ZM11.6275 13.3725C11.2836 13.0287 11.2836 12.4713 11.6275 12.1275C11.9713 11.7836 12.5287 11.7836 12.8725 12.1275L11.6275 13.3725ZM18.7421 17.997C19.086 18.3408 19.086 18.8983 18.7421 19.2421C18.3983 19.586 17.8409 19.586 17.4971 19.2421L18.7421 17.997ZM12.8725 13.3725C12.5287 13.7164 11.9713 13.7164 11.6275 13.3725C11.2836 13.0287 11.2836 12.4713 11.6275 12.1275L12.8725 13.3725ZM17.4971 6.25788C17.8409 5.91404 18.3983 5.91404 18.7421 6.25788C19.086 6.60172 19.086 7.1591 18.7421 7.50294L17.4971 6.25788ZM11.6275 12.1275C11.9713 11.7836 12.5287 11.7836 12.8725 12.1275C13.2164 12.4713 13.2164 13.0287 12.8725 13.3725L11.6275 12.1275ZM7.003 19.2421C6.65917 19.586 6.1017 19.586 5.75787 19.2421C5.41404 18.8983 5.41404 18.3408 5.75787 17.997L7.003 19.2421ZM7.003 6.25788L12.8725 12.1275L11.6275 13.3725L5.75787 7.50294L7.003 6.25788ZM12.8725 12.1275L18.7421 17.997L17.4971 19.2421L11.6275 13.3725L12.8725 12.1275ZM11.6275 12.1275L17.4971 6.25788L18.7421 7.50294L12.8725 13.3725L11.6275 12.1275ZM12.8725 13.3725L7.003 19.2421L5.75787 17.997L11.6275 12.1275L12.8725 13.3725Z' fill='%236D717F'/%3E%3C/svg%3E%0A");
}

.wp-block-button__link.wp-element-button {
    transition: all 0.3s ease;
}

.wp-block-button__link.wp-element-button:hover {
    background-color: white;
    border: solid 1px var(--wp--preset--color--custom-red);
    color: var(--wp--preset--color--custom-red);
    transition: all 0.3s ease;
}

.entry-content {
    margin: 0;
}

.img-overflow {
    scale: 1.05;
    transform-origin: top;
}

.shaded-card {
    transition: all 0.3s ease;

    .wp-block-cover__background {
        transition: all 0.3s ease;
    }
}

.shaded-card:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;

    .wp-block-cover__background {
        opacity: 0.6 !important;
        transition: all 0.3s ease;
    }
}

@media screen and (min-width: 768px) {
    .profile {
        position: relative;

        .profile-content {
            margin-right: 200px;
            height: 100%;
        }

        .profile-pic {
            max-width: 250px;
            width: 100%;
            right: 0;
            position: absolute;
            img {
                object-fit: none !important;
            }
        }
    }
}

footer {
    margin-top: 0 !important;
    a {
        text-decoration: none;
    }
}

form#multi-step-form {
    .progress {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 10px 0;
        padding-bottom: 10px;
        border-bottom: solid 1px #e1e1e6;

        .step {
            margin: 0 10px 0 15px;
            max-width: 150px;
            position: relative;
            display: flex;
            flex-direction: row;
            color: #7c7c8a;
            font-size: 16px;
            line-height: 16px;
            gap: 5px;
            align-items: center;
            transition: all 0.3s ease;
            font-weight: 500;

            .step-number {
                color: #6d717f;
                background-color: #e1e1e6;
                display: block;
                width: 28px;
                height: 28px;
                text-align: center;
                line-height: 29px;
                font-size: 13px;
                border-radius: 500px;
                font-weight: 500;
                aspect-ratio: 1 / 1;
                transition: all 0.3s ease;
            }
        }

        .step-number:after {
            opacity: 0;
            display: block;
            position: absolute;
            width: 28px;
            height: 100%;
            content: "";
            top: 0;
            background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='28' height='28' rx='14' fill='%231D8841'/%3E%3Cg clip-path='url(%23clip0_368_313)'%3E%3Cpath d='M8.16663 13.9999L12.3333 18.1666L20.6666 9.83325' stroke='white' stroke-width='2' stroke-linecap='square'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_368_313'%3E%3Crect width='20' height='20' fill='white' transform='translate(4 4)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
            background-repeat: no-repeat;
            background-position: center;
            transition: all 0.3s ease;
        }

        .step.active {
            color: #323238;
            transition: all 0.3s ease;

            .step-number {
                background-color: var(--wp--preset--color--custom-red);
                color: white;
                transition: all 0.3s ease;
            }
        }

        .step.pass {
            transition: all 0.3s ease;

            .step-number:after {
                transition: all 0.3s ease;

                opacity: 1;
            }
        }
    }

    .form-panel {
        display: grid;
        margin: 15px 0;
    }

    .required {
        color: var(--wp--preset--color--custom-red);
    }

    label:not(:has([type="checkbox"])),
    label:not(:has([type="radio"])),
    .label {
        margin-top: 10px;
        display: inline-block;
        color: #323238;
        font-size: 16px;
        font-weight: 500;
    }

    /* input:not([type="radio"]),
    input:not([type="checkbox"]) {
      display: block;
    } */

    .btns {
        width: 100%;
        display: flex;
        justify-content: space-between;

        .none {
            display: none;
        }

        .hide {
            visibility: hidden;
            opacity: 0;
        }
    }

    .form-arrow {
        width: 8px;
        height: 13px;
    }

    input[type="text"],
    input[type="email"],
    input[type="number"],
    input[type="date"],
    textarea,
    input[type="tel"] {
        font-family: var(--wp--preset--font-family--poppins);
        background-color: white;
        border: solid 1px #e1e1e6;
        border-radius: 2px;
        padding: 18px 15px;
        width: 100%;
        box-sizing: border-box;
    }

    input[type="checkbox"], input[type="radio"] {
        accent-color: var(--wp--preset--color--custom-red);
    }

    [data-panel="1"] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;

        [for="mailing_address"] {
            grid-column-end: 3;
            grid-column-start: 1;
        }
    }

    [data-panel="3"] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;

        div {
            display: flex;
            flex-direction: column;

            &:nth-child(3) {
                grid-column-end: 3;
                grid-column-start: 1;
            }
        }
    }
}

.wp-block-velcome-group-faq-wrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;

    .wp-block-velcome-group-faq-item {
        background-color: white;
        border-radius: 10px;
        border: 1px solid #E5E5E5 !important;

        .velcome-blocks-faq-question-button.velcome-blocks-faq-question {
            padding: 15px;
        }

        .faq-question p {
            color: var(--wp--preset--color--custom-black-petrol);
            font-weight: 700;
        }
    }
}