/* General
   ========================================================================== */

html {
    scroll-padding-top: var(--wp--preset--spacing--xxx-large);
}

::selection {
    background: color-mix(in srgb, var(--wp--preset--color--secondary) 80%, transparent);
    color: #000000;
}

::-moz-selection {
    background: color-mix(in srgb, var(--wp--preset--color--secondary) 80%, transparent);
    color: #000000;
}

img {
    user-select: none;
}

code {
    font-family: var(--wp--preset--font-family--heading), serif;
    font-size: 1.11em;
    line-height: 0;
}

p > img {
    float: left;
    margin-right: 1ch;
}

/* Helper classes
   ========================================================================== */

@keyframes --home-info-appear {
    0%, 15% { transform: translateY(30px); opacity: 0; filter: blur(1px); }
    60% { transform: translateX(0); }
    100% { opacity: 1; filter: blur(0); }
}

.diakonos-home-info-appear {
    animation: --home-info-appear ease forwards;
    animation-duration: 2s;
}

.diakonos-footer-info {
    @media (max-width: 600px) {
        justify-content: center !important;
    }
}

.diakonos-wide-width-plus {
    max-width: 1400px !important;
}

.diakonos-icxc {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}

.diakonos-p-indent {
    text-indent: 1.5ch;
    overflow-wrap: break-word;
}

.diakonos-header-menu {
    @media (max-width: 800px) {
        display: none;
    }
}

.diakonos-header-logo {
    @media (max-width: 800px) {
        width: 150px !important;
    }
}

/* Overrides Cooblocs
   ========================================================================== */

@supports (animation-timeline: view(block)) {
    /* Clip */
    .wp-child-theme-diakonos .sym-scroll-clip {
        clip-path: inset(0);
        filter: blur(0);
        opacity: 1;
        will-change: clip-path, filter, opacity;
        animation: diakonos-scroll-clip 1ms linear both;
        animation-timeline: view(block);
        animation-range: exit calc(90% - var(--wp--preset--spacing--xxx-large)) exit 90%;
    }

    @keyframes diakonos-scroll-clip {
        100% {
            clip-path: inset(var(--wp--preset--spacing--x-small) var(--wp--preset--spacing--x-small) round var(--wp--preset--border-radius--medium));
            filter: blur(1px);
            opacity: 0.75;
        }
    }
}

/* TranslatePress
   ========================================================================== */

.trp-shortcode-switcher__wrapper {
    line-height: 0;
}

.trp-shortcode-switcher {
    padding: 0 !important;
}

img.trp-flag-image {
    display: none !important;
}

.trp-language-item {
    padding: 0.2rem 0.5rem !important;
    border-radius: var(--wp--preset--border-radius--x-small);
    transition-duration: 200ms;
    transition-property: background-color, color;

    .trp-language-item-name {
        font-family: var(--wp--preset--font-family--body), sans-serif;
        font-size: 0.8rem;
    }
}

footer .trp-language-item-name {
    color: #b8b5ac;
}

/* WP Forms
   ========================================================================== */

div.wpforms-container-full:not(:empty) {
    margin-bottom: unset !important;
}

.wpforms-container .wpforms-field, .wp-core-ui div.wpforms-container .wpforms-field {
    padding-block: var(--wp--preset--spacing--small) !important;
}

div.wpforms-container-full .wpforms-field-label, .wp-core-ui div.wpforms-container-full .wpforms-field-label {
    margin-bottom: var(--wp--preset--spacing--small) !important;
}

div.wpforms-container-full .wpforms-form label.wpforms-error, div.wpforms-container-full .wpforms-form em.wpforms-error {
    margin-top: var(--wp--preset--spacing--x-small) !important;
}

.wpforms-container .wpforms-field-label, .wp-core-ui div.wpforms-container .wpforms-field-label {
    font-weight: 500 !important;
    font-family: var(--wp--preset--font-family--heading), serif;
    font-size: var(--wp--preset--font-size--small) !important;
}

div.wpforms-container-full .wpforms-confirmation-container-full, div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
    background: var(--wp--preset--color--secondary) !important;
    border: unset !important;
    color: unset !important;
    border-radius: var(--wp--preset--border-radius--x-small) !important;
    padding: var(--wp--preset--spacing--small) !important;
    font-size: var(--wp--preset--font-size--small);
}

div.wpforms-container-full input[type=submit], div.wpforms-container-full button[type=submit], div.wpforms-container-full .wpforms-page-button, .wp-core-ui div.wpforms-container-full input[type=submit], .wp-core-ui div.wpforms-container-full button[type=submit], .wp-core-ui div.wpforms-container-full .wpforms-page-button {
    font-family: var(--wp--preset--font-family--heading), serif !important;
    font-size: var(--wp--preset--font-size--small) !important;
    font-weight: 500 !important;
    padding: var(--wp--preset--spacing--x-small) var(--wp--preset--spacing--medium) !important;
    color: var(--wp--preset--color--white) !important;
    box-shadow: var(--wp--preset--shadow--light);
}

div.wpforms-container-full button[type=submit]:hover {
    background: var(--wp--preset--color--accent-2) !important;
}

div.wpforms-container-full .wpforms-field.wpforms-field-checkbox ul, div.wpforms-container-full .wpforms-field.wpforms-field-radio ul, div.wpforms-container-full .wpforms-field.wpforms-field-payment-checkbox ul, div.wpforms-container-full .wpforms-field.wpforms-field-payment-multiple ul, div.wpforms-container-full .wpforms-field.wpforms-field-gdpr-checkbox ul {
    gap: var(--wp--preset--spacing--x-small) !important;
}

div.wpforms-container-full input[type=checkbox] + label, div.wpforms-container-full input[type=radio] + label {
    font-size: var(--wp--preset--font-size--small) !important;
    line-height: 1.4 !important;
    color: var(--wp--preset--color--text-70) !important;
    padding-left: var(--wp--preset--spacing--x-small) !important;;
}

