/**
 * GENERAL BLOCK STYLES
 * This file is loaded in both the WordPress front- and backend.
 * Add styles here which should be present in both views.
 */



/* Layout & Grid
   ---------------------------------------------------------------------------------------------------- */

body .is-layout-constrained > .wp-block-post-content {
    max-width: unset;
}

body .is-layout-flex {
    gap: var(--wp--custom--spacing--gap-regular);
    row-gap: var(--wp--custom--spacing--gap-small);
}

body .is-layout-grid {
    gap: var(--wp--custom--spacing--gap-regular);
}

.site-main {
    margin-block-start: 0px;
}

:where(.wp-block-group.has-background.content-section, .wp-block-group.has-background.is-style-content-section),
:where(.is-style-content-section, .content-section) {
    margin-block-start: 0 !important;
    margin-block-end: 0 !important;
    padding-top: var(--wp--custom--spacing--section) !important;
    padding-bottom: var(--wp--custom--spacing--section) !important;
}

.wp-block-social-links.is-layout-flex,
.wp-block-navigation.is-vertical {
    gap: var(--wp--custom--spacing--gap-small);
}

body .is-layout-flex:has(.wp-block-wxblock-copyright) {
    gap: 0.5rem;
}
.wp-block-wxblock-copyright p {
    margin: 0;
}

:where(.wp-block-group.has-background) {
    padding: 1.25em;
}


.is-style-card {
    position: relative;
    padding: 1.5em;
    border: 1px solid rgb(13 34 65 / 25%);
    border-radius: var(--wp--custom--border-radius--medium);
}


/* Prevent portrait videos from being cropped in fullscreen if a poster is set (overwrite WordPress default) */
@supports (position:sticky) {
    .wp-block-video [poster]:-webkit-full-screen {
        object-fit: contain;
    }
    .wp-block-video [poster]:-moz-full-screen {
        object-fit: contain;
    }
    .wp-block-video [poster]:-ms-fullscreen {
        object-fit: contain;
    }
    .wp-block-video [poster]:fullscreen {
        object-fit: contain;
    }
}




/* Typography
   ---------------------------------------------------------------------------------------------------- */
a {
    color: var(--wp--preset--color--primary-darker);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    transition: 
        text-underline-offset 0.2s ease-in-out, 
        color 0.2s ease-in-out;
}
a:hover, 
a:focus {
    text-underline-offset: 0.4em;
}

:root .is-layout-constrained > h1 {
    max-width: 990px;
}




/* Latest Posts & Query Block
   ---------------------------------------------------------------------------------------------------- */
.wp-block-latest-posts li:not(:last-child),
.wp-block-post-template-is-layout-flow .wp-block-post:not(:last-child) {
    margin-bottom: 2em;
}
.wp-block-latest-posts li,
.wp-block-post {
    position: relative;
    padding: 1.5em;
    border: 1px solid var(--wp--preset--color--secondary-3-lighter);
    outline: 0px solid var(--wp--preset--color--white);
    border-radius: var(--wp--custom--border-radius--medium);
    transition: 
        border 0.1s ease-in-out,
        outline 0.2s ease-in-out,
        scale 0.2s ease-in-out;
}
.wp-block-latest-posts li:has(a:hover),
.wp-block-latest-posts li:focus-within,
.wp-block-post:has(a:hover),
.wp-block-post:focus-within {
    border-color: transparent;
    background-color: var(--wp--preset--color--white);
    outline-width: 9px;
    box-shadow: 0 12px 32px rgb(248 154 3 / 25%);
    scale: 1.01;
}
.latest-posts-cat,
.wp-block-post-terms > a {
    font-size: var(--wp--preset--font-size--small);
    font-weight: 700;
    line-height: var(--wp--custom--line-height--small);
    color: var(--wp--preset--color--black);
    text-decoration: none;
    display: inline-block;
    padding: 0.25rem 1rem;
    background-color: var(--wp--preset--color--secondary-3-lighter);
    border-radius: var(--wp--custom--border-radius--large);
    transition: background 0.2s ease-in-out;

    &:where(:hover, :focus) {
        background-color: var(--wp--preset--color--secondary-3);
    }
}
.wp-block-latest-posts__post-categories {
    margin-bottom: 0.5em;
}
.wp-block-latest-posts__post-title,
.wp-block-post-title {
    display: block;
    font-family: var(--wp--preset--font-family--host-grotesk);
    font-size: var(--wp--preset--font-size--large);
    text-transform: none;
    text-wrap: balance;
}
.wp-block-post-title > a {
    font-size: inherit;
}
.wp-block-latest-posts__read-more {
    display: block;
    margin-top: 0.5em;
}
.wp-block-latest-posts__post-title,
.wp-block-latest-posts__read-more,
.wp-block-post-title > a,
.wp-block-post-excerpt__more-link {
    font-weight: 700;
    text-decoration-color: transparent;
    color: var(--wp--preset--color--black);
    transition: text-decoration 0.2s ease-in-out;

    &:hover {
        text-decoration: underline;
        text-underline-offset: 0.2em;
    }
}
.wp-block-latest-posts__post-excerpt:last-child,
.wp-block-post-excerpt:last-child {
    margin-bottom: 0;
}

.wp-block-query-pagination {
    font-size: 1.125rem;

    &.is-layout-flex {
        gap: var(--wp--custom--spacing--gap-small);
    }

    a {
        color: var(--wp--preset--color--black);
    }
}
.wp-block-query-pagination-next,
.wp-block-query-pagination-previous {
    font-weight: 700;
}
.wp-block-query-pagination-numbers .page-numbers {
    padding: 0.1em 0.45em;
}
.wp-block-query-pagination-numbers .page-numbers.current {
    font-weight: 700;
    border-radius: var(--wp--custom--border-radius--medium);
    background-color: color-mix(in srgb, var(--wp--preset--color--secondary-3-lighter), white 50%);
}

.wp-block-post.wx_actuary {
    border-color: var(--wp--preset--color--secondary-2);
}
.wp-block-post.wx_actuary .info {
    font-size: var(--wp--preset--font-size--small);
}




/* Horizontal Scroll Container
   ---------------------------------------------------------------------------------------------------- */
.horizontal-scroll-container {
    display: flex;
    align-items: stretch;
    gap: 1.5em;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.5em 1.5em 2em 1.5em;
    scrollbar-width: auto;
    scrollbar-color: var(--wp--preset--color--primary) transparent;
    /*scroll-snap-type: x mandatory; /* optional: for snapping behavior */
    /*
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    */
    -webkit-touch-callout: none;
    -webkit-tap-highlighter-color: transparent;
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 8px;
}
::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
} 

.horizontal-scroll-container > * {
    flex: 0 0 auto; /* prevent shrinking and allow horizontal layout */
    width: min(400px, 42vh);
    min-width: 260px;
    max-width: calc(100vw - 5em);
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    position: relative;
    scroll-snap-align: start; /* optional: aligns to scroll snapping */
}

@media (max-width: 559px) {
    .is-layout-constrained > .horizontal-scroll-container:where(.alignwide),
    .is-layout-flow > .horizontal-scroll-container {
        margin-right: calc(var(--wp--style--root--padding-right) * -1) !important;
        margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
        max-width: none;
    }
}




/* Post Date with Prefix
   ---------------------------------------------------------------------------------------------------- */
.prefixed-post-date {
    display: flex;
    gap: 0.5em;
}




/* Search Page
   ---------------------------------------------------------------------------------------------------- */
.search-results .wp-block-post {
    border-color: var(--wp--preset--color--primary-lighter);
}
.search-results .wp-block-post:has(a:hover),
.search-results .wp-block-post:focus-within {
    box-shadow: 0 12px 32px rgb(0 28 119 / 25%);
}




/* Archieves
   ---------------------------------------------------------------------------------------------------- */
.archive.category .site-main .wp-block-query-title {
    font-family: var(--wp--preset--font-family--host-grotesk);
    font-size: var(--wp--preset--font-size--medium);
    text-transform: none;
    color: var(--wp--preset--color--dark-grey);

    > span {
        display: block;
        margin-top: 1rem;
        font-family: var(--wp--preset--font-family--space-grotesk);
        font-size: var(--wp--preset--font-size--h-2);
        color: var(--wp--preset--color--black);
        text-transform: uppercase;
    }
}




/* Category List Filters
   ---------------------------------------------------------------------------------------------------- */
.prefixed-category-list,
.wp-block-categories.is-style-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    align-items: center;
    justify-content: center;
}
.wp-block-categories.is-style-filter {
    list-style: none;
    margin: 0;
    padding: 0;
}
.prefixed-category-list .cat-item > a,
.wp-block-categories.is-style-filter .cat-item > a {
    font-weight: 700;
    line-height: var(--wp--custom--line-height--small);
    color: var(--wp--preset--color--black);
    text-decoration: none;
    display: inline-block;
    padding: 0.5rem 1rem;
    
    border-radius: var(--wp--custom--border-radius--small);
    transition: background 0.2s ease-in-out;

    &:where(:hover, :focus) {
        background-color: var(--wp--preset--color--secondary-3);
    }
}
.prefixed-category-list .cat-item.current-cat > a,
.wp-block-categories.is-style-filter .cat-item.current-cat > a {
    background-color: var(--wp--preset--color--secondary-3-lighter);
}