body{
    background-color: var(--color-white);
    font-family: var(--ff-primary), sans-serif;
    color: var(--color-black);
}
a{
    text-decoration: none;
    color: var(--link-color-dark);
    transition: color .2s ease;
    &:hover{
        color: var(--link-color-dark-hover);
    }
}
main{
    transition: filter 1s ease-out;
}
body.nav-open{
    height: 100dvh;
    overflow: hidden;
    main, footer{
        filter: blur(2px);
        pointer-events: none;
    }
}
[v-cloak]{
    display: none;
}
.grid-overlap{
    display: grid;
    grid-template-areas: "overlap-content";
    & > *{
        grid-area: overlap-content;
    }
}
.block-flex-center{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
    > * + *{
        margin-top: var(--flow-spacing);
    }
}
.text-center{
    text-align: center;
}
.text-right{
    text-align: right;
}
.py-50{
    padding-block: 50px;
}
.bg-form-shader{
    background: transparent linear-gradient(180deg, var(--color-gray-50) 0%, #fff 100%) 0 0 no-repeat padding-box;
}
/* fix Cookiebot widget */
.CookiebotWidget-logo{
    outline: 0 !important;
}
.breadcrumbs{
    margin-block: 20px;
    ul, li{
        list-style: none;
        margin: 0;
        padding: 0;
    }
    li{
        display:inline;
        color: var(--color-gray-400);
    }
    li, a{
        font-size: 12px;
        line-height: 20px;
        transition: color .2s ease;
    }
    a{
        color: var(--color-black);
        transition: color .2s ease;
    }
    li:not(:first-child):before{
        content: ' > ';
    }
    a:hover, a.active{
        color: var(--color-gray-600);
    }
}
.swal2-confirm{
    background-color: var(--color-gray-600) !important;
}
.btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 1rem auto;
    padding: .875rem;
    min-width: 10rem;
    background-color: var(--btn-dark-background-color);
    color: var(--btn-dark-color);
    font-size: 12px;
    font-weight: var(--fw-semibold);
    line-height: 22px;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: background-color .2s ease;
    border: none;
    outline: none;
    cursor: pointer;
    opacity: 1;
    &:disabled{
        opacity: .3;
        cursor: none;
        pointer-events: none;
    }
    &.btn-dark{
        color: var(--link-color-light);
        background-color: var(--color-black);
        &:hover{
            background-color: var(--btn-dark-background-color-hover);
        }
        &.outline{
            border: 1px solid var(--color-white);
        }
        /*&.hover-opacity{*/
        /*    opacity: 1;*/
        /*    transition: opacity .2s ease;*/
        /*    &:hover{*/
        /*        background-color: var(--color-black);*/
        /*        opacity: .8;*/
        /*    }*/
        /*}*/
    }
    &.btn-light{
        color: var(--color-white);
        background-color: var(--color-black);
        &:hover{
            background-color: var(--btn-light-background-color-hover);
        }
        &.outline{
            border: 1px solid var(--color-black);
        }
    }
    &.btn-sm{
        font-size: 12px;
        line-height: 20px;
        font-weight: var(--fw-medium);
        padding: 7px 16px;
    }
    &.btn-md{
        font-size: 16px;
        line-height: 20px;
        font-weight: var(--fw-medium);
        padding: 14px 24px;
    }
    &.btn-lg{
        font-size: 20px;
        line-height: 20px;
        font-weight: var(--fw-medium);
        padding: 14px 24px;
    }
    &.btn-fluid{
        width: 100%;
    }
}