/**
 * Theme Name: YHB
 * Template:   twentytwentyfive
 */

* {
    box-sizing: border-box;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    text-decoration: none;
}

h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {
    text-decoration: underline;
}

.is-style-centered-mobile,
.wp-block-media-text {
    @media (max-width: 781px) {
        text-align: center;
        justify-content: center;

        .wp-block-media-text__media {
            max-width: 50vw;
            margin-inline: auto;
            min-height: 0 !important;
        }

        ul,
        ol {
            text-align: left;
        }
    }
}

.is-style-centered-tablet {
    @media (max-width: 1023px) {
        text-align: center;
        justify-content: center;
    }
}

.is-style-hide-mobile {
    @media (max-width: 781px) {
        display: none;
    }
}

.is-style-hide-tablet {
    @media (max-width: 1023px) {
        display: none;
    }
}

/* Fallback form styles */
:root {
    --form-accent: var(--wp--preset--color--teal); /* teal/green border color */
    --form-text: var(--wp--preset--color--navy);   /* dark navy text */
    --form-placeholder: #9ab0bb;
    --form-bg: #ffffff;
    --form-border-radius: 10px;
    --form-border: 1.5px solid var(--form-accent);
    --form-padding: 14px 18px;
    --form-font-size: 1rem;

    --yhb-button-arrow-transform: translateX(0.25em) rotate(45deg);
}

/* Base input, textarea, select */
input,
textarea,
select {
    display: block;
    width: 100%;
    padding: var(--form-padding);
    font-size: var(--form-font-size);
    font-family: inherit;
    color: var(--form-text);
    background-color: var(--form-bg);
    border: var(--form-border);
    border-radius: var(--form-border-radius);
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    margin-block-end: 1rem;
}

input::placeholder,
textarea::placeholder {
    color: var(--form-placeholder);
}

/* Focus state */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--form-accent);
    box-shadow: 0 0 0 3px rgba(46, 172, 138, 0.35);
}

/* Select dropdown — hide default arrow, add custom chevron */
select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%232eac8a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 44px;
    cursor: pointer;
}

input[type="submit"] {
    cursor: pointer;
    font-weight: 700;
    width: auto;
    background-color: var(--wp--preset--color--lime);
    border: 0;
    border-radius: 30px;
    color: var(--wp--preset--color--navy);
    font-size: var(--wp--preset--font-size--medium);
    padding-block: 0.5em;
    padding-inline: 2.5em;

    &:hover,
    &:focus {
        background-color: var(--wp--preset--color--teal);
    }
}

.hs_submit.hs-submit {
    margin-block: 1rem;
}

ul.inputs-list {
    list-style: none;
    padding: 0;
}

li.hs-form-checkbox {
    label {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

/* Gravity Forms adjustments */
.is-style-homepage-form {
    border-radius: 10px;
    gap: 10px;

    .gform-theme--foundation {
        --gf-form-gap-y: 0.5rem;
    }
}

.is-style-homepage-form .gform_wrapper {
    .ginput_container {
        margin-block-end: 0;

        input {
            border-radius: 0;
            border: 0;
            border-bottom: 2px solid var(--wp--preset--color--midnight);
            box-shadow: none;
            background: transparent;
        }
    }

    .gform-footer {
        margin: 0;
    }

    #field_submit {
        @media (max-width: 781px) {
            justify-content: center;
        }
    }

    button.gform-button {
        align-items: center;
        box-shadow: none !important;
        color: var(--wp--preset--color--midnight) !important;
        display: flex;
        background: transparent !important;
        font-weight: 600 !important;
        white-space: nowrap;

        &::before {
            content: "" !important;
            display: inline-block;
            background-color: var(--wp--preset--color--midnight) !important;
            background-image: url(./assets/images/arrow-white.svg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: 10px;
            border-radius: 50px;
            width: 30px;
            height: 30px;
        }
    }
}

.is-style-footer-form .gform_wrapper {
    --gf-form-gap-x: 16px;
    --gf-form-gap-y: 16px;

    .gform-footer,
    .gform_footer {
        @media (max-width: 781px) {
            justify-content: center;
        }
    }

    button.gform-button,
    button.gform_button {
        align-items: center;
        box-shadow: none !important;
        color: var(--wp--preset--color--midnight) !important;
        display: flex;
        background: transparent !important;
        font-weight: 600 !important;
        padding-inline: 5px !important;

        &::before {
            content: "" !important;
            display: inline-block;
            background-color: var(--wp--preset--color--lime) !important;
            background-image: url(./assets/images/arrow.svg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: 10px;
            border-radius: 50px;
            width: 30px;
            height: 30px;
            margin-inline-end: 10px;
            transition: transform 0.2s ease;
        }

        &:focus,
        &:hover {
            &::before {
                transform: var( --yhb-button-arrow-transform );
            }
        }
    }
}

.is-style-dark.is-style-footer-form .gform_wrapper,
.is-style-dark .is-style-footer-form .gform_wrapper {
    button.gform-button,
    button.gform_button {
        color: #fff !important;
    }
}

main.wp-block-group {
    overflow: hidden;
}

.wp-site-blocks {
    margin-inline: auto;
    /*max-width: 1980px;*/
}

.wp-block-button {
    &.is-style-icon a {
        align-items: center;
        display: flex;

        &:before {
            content: "";
            display: inline-block;
            background-color: var(--wp--preset--color--lime);
            background-image: url('./assets/images/arrow.svg');
            background-repeat: no-repeat;
            background-position: center;
            background-size: 10px;
            border-radius: 50px;
            width: 30px;
            height: 30px;
            margin-inline-end: 10px;
            transition: transform 0.2s ease;
        }

        &:focus,
        &:hover {
            &::before {
                transform: var( --yhb-button-arrow-transform );
            }
        }
    }
}

.wp-block-quote {
    position: relative;

    &::before {
        content: "\201C";
        color: var(--wp--preset--color--teal);
        font-family: var(--wp--preset--font-family--raleway);
        font-size: 7em;
        font-style: normal;
        font-weight: 700;
        line-height: 1;
        position: absolute;
        top: -10px;
        left: 0;
        width: var(--wp--preset--spacing--60);
    }

    @media (max-width: 781px) {
        align-items: center;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        padding-inline-start: 0;
        text-align: center;

        &::before {
            position: static;
            margin-bottom: -6rem;
            transform: translateX(-50%);
        }
    }
}

/* Header */
.is-style-header-nav {
    width: 100%;

    @media (max-width: 1023px) {
        justify-content: flex-end;
    }
}

header.wp-block-template-part {
    background: #fff;
    position: sticky;
    top: 0;
    z-index: 10;

    @media (max-width: 1023px) {
        .wp-block-group {
            position: static;
        }
    }
}

.yhb-portal-link {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    text-decoration: none;
    white-space: nowrap;

    &::before {
        background: url('./assets/images/person.svg') no-repeat center center;
        background-size: contain;
        content: "";
        height: 1rem;
        width: 1rem;
    }

    &:hover,
    &:focus-visible {
        text-decoration: underline;
    }
}

.global-header {
    .wp-block-search {
        color: var(--wp--preset--color--midnight);
        line-height: 1.2;

        input {
            border-radius: 0;
            margin: 0;
            padding-inline: 0.25rem;
            text-align: right;

            &:focus,
            &:focus-within {
                border: 0;
                box-shadow: none;
                outline: 2px var(--wp--preset--color--midnight) solid;
            }

            &::placeholder {
                color: var(--wp--preset--color--midnight);
            }
        }

        .wp-block-search__button {
            border-radius: 0;
            color: var(--wp--preset--color--midnight);
            margin: 0;
            padding: 0.25rem;
        }
    }

    .wp-block-site-logo {
        @media (min-width: 1024px) {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            z-index: 2;
        }
    }
}

/* Footer */
footer.wp-block-template-part {
    margin-block-start: 0;

    .wp-block-image {
        width: 30px;
    }
}

@media (max-width:781px) {
    .is-column-reverse {
        flex-direction: column-reverse;
    }
}

/* Responsive Grid styles */
.is-style-responsive-grid-two-one {
    display: grid;
    /*gap: var(--wp--style--block-gap, 1.5rem);*/

    @media (max-width: 1023px) {
        grid-template-columns: repeat(2, 1fr);
    }

    @media (max-width: 781px) {
        grid-template-columns: 1fr;
    }
}

.entry-content > * {
    position: relative;
    z-index: 1;
}

.wp-block-group {
    position: relative;
    z-index: 1;

    &.is-style-cover-group {
        position: relative;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
    }

    &.is-style-cover-group::before {
        content: '';
        position: absolute;
        inset: 0;
        background-color: var(--wp--preset--color--white);
        opacity: 0.85;
        z-index: 0;
    }

    /* Push inner content above the overlay */
    &.is-style-cover-group > * {
        position: relative;
        z-index: 1;
    }

    &.is-style-dark {
        &.is-style-cover-group::before {
            background-color: var(--wp--preset--color--navy);
        }
    }

    &.is-style-midnight {
        &.is-style-cover-group::before {
            background-color: var(--wp--preset--color--midnight);
        }
    }

    &.is-style-cover-group.is-style-rounded {
        border-radius: 20px;
    }
}

.is-style-navy-pull-bottom {
    position: relative;

    &::after {
        background: var(--wp--preset--color--navy);
        bottom: 0;
        content: "";
        display: block;
        height: 20vw;
        left: 0;
        position: absolute;
        width: 100%;
        z-index: 0;
    }
}

.is-style-white-pull-bottom {
    position: relative;

    &::after {
        background: var(--wp--preset--color--white);
        bottom: 0;
        content: "";
        display: block;
        height: 20vw;
        left: 0;
        position: absolute;
        width: 100%;
        z-index: 0;
    }
}

.is-style-midnight-pull-bottom {
    position: relative;

    &::after {
        background: var(--wp--preset--color--midnight);
        bottom: 0;
        content: "";
        display: block;
        height: 20vw;
        left: 0;
        position: absolute;
        width: 100%;
        z-index: 0;
    }
}

.is-style-navy-pull-top {
    position: relative;

    &::before {
        background: var(--wp--preset--color--navy);
        top: 0;
        content: "";
        display: block;
        height: 50%;
        left: 0;
        position: absolute;
        width: 100%;
        z-index: -1;
    }
}

.is-style-content-background-only {
    position: relative;
    z-index: 1;

    @media (max-width: 781px) {
        padding-block-start: 2rem;
    }

    @media (min-width: 782px) {
        background-color: transparent;
    }

    .wp-block-media-text__media {
        position: relative;
        z-index: 2;
    }

    .wp-block-media-text__content {
        padding-block-end: 2rem;
        position: relative;
        z-index: 1;

        > * {
            position: relative;
            z-index: 2;
        }

        &::before {
            background: var(--wp--preset--color--navy);
            top: 0;
            content: "";
            display: block;
            height: 100%;
            left: -50vw;
            position: absolute;
            width: 120vw;
            z-index: 0;
        }
    }
}

.is-style-play-button {
    a {
        position: relative;
    }
    a::after {
        background: url(./assets/images/play.svg) center center no-repeat;
        background-size: contain;
        content: "";
        width: 30px;
        height: 30px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 1;
    }
}

.is-style-callout-carousel {
    padding-bottom: 56px;

    .wp-block-splide-carousel {
        @media (min-width: 782px) {
            margin-right: -20vw;

            &::after {
                background-image: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) 100%);
                content: "";
                height: 100%;
                position: absolute;
                right: 0;
                top: 0;
                width: 10%;
            }
        }
    }

    .splide__arrows {
        align-items: center;
        bottom: -46px;
        display: flex;
        gap: 30px;

        position: absolute;
        width: 100%;

        @media (min-width: 782px) {
            padding-inline: 30px;
            width: 70%;
        }

        &::after {
            background: var(--wp--preset--color--navy);
            content: "";
            display: inline-block;
            flex: 1;
            height: 1px;
            order: 2;
        }
    }

    .splide__arrow {
        position: static;
        transform: none;

        svg {
            display: none;
        }

        &::before {
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
            content: "";
            width: 36px;
            height: 36px;
        }
    }

    .splide__arrow--next {
        order: 3;

        &::before {
            background-image: url(./assets/images/arrow-right.svg);
        }
    }

    .splide__arrow--prev {
        order: 1;

        &::before {
            background-image: url(./assets/images/arrow-left.svg);
        }
    }
}

.wp-block-splide-carousel__container {
    @media (max-width: 781px) {
        .wp-block-splide-carousel {
            padding-block-end: 46px;
        }
    }

    .splide__arrow {
        @media (max-width: 781px) {
            top: calc(100% - (36px / 2));
        }

        svg {
            display: none;
        }

        &::before {
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
            content: "";
            width: 36px;
            height: 36px;
        }
    }

    .splide__arrow--next {
        &::before {
            background-image: url(./assets/images/arrow-right.svg);
        }

        @media (max-width: 781px) {
            right: 20%;
        }
    }

    .splide__arrow--prev {
        &::before {
            background-image: url(./assets/images/arrow-left.svg);
        }

        @media (max-width: 781px) {
            left: 20%;
        }
    }
}

.wp-singular .wp-block-post-terms {
    a {
        background-color: #f7f7f7;
        border: 0;
        border-radius: 5px;
    }
}

/* posts archive styles */

/* ── Shared container ── */
.yhb-archive {
    --yhb-archive-color-border: #e0e2da;
    --yhb-archive-gap: 5rem;

    font-family: 'Inter', sans-serif;
    color: var(--wp--preset--color--midnight);
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 1.5rem;
    position: relative;

    @media (max-width: 781px) {
        --yhb-archive-gap: 2rem;
    }


    /* ── Divider ── */

    .yhb-divider {
        border: none;
        border-top: 1px solid var(--yhb-archive-color-border);
        margin: 3rem 0;
    }

    /* ══════════════════════════════════════════════
       SECTION 1 — HERO
    ══════════════════════════════════════════════ */

    .yhb-hero__inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--yhb-archive-gap);
        align-items: center;
        padding: 3rem 0 2rem;
        margin-block-end: 3rem;
    }

    @media (max-width: 768px) {
        .yhb-hero__inner {
            gap: 1rem;
            grid-template-columns: 1fr;
        }

        .yhb-hero__image {
            order: -1;
        }
    }

    .yhb-hero__date {
        font-family: 'Inter', sans-serif;
        font-size: 0.85rem;
        color: #555;
        margin: 0 0 0.75rem;
    }

    .yhb-hero__title {
        /*font-family: 'Raleway', sans-serif;*/
        font-size: clamp(1.6rem, 3vw, 2.4rem);
        font-weight: 800;
        line-height: 1.2;
        color: var(--wp--preset--color--navy);
        margin: 0 0 1.25rem;
    }

    .yhb-hero__title a {
        color: inherit;
        text-decoration: none;
    }

    .yhb-hero__title a:hover {
        /*color: var(--wp--preset--color--teal);*/
    }

    .yhb-hero__excerpt {
        font-size: 0.95rem;
        line-height: 1.7;
        color: #444;
        margin: 0 0 1.5rem;
    }

    .yhb-hero__image {
        border-radius: 20px;
        overflow: hidden;
        aspect-ratio: 4 / 3;
    }

    .yhb-hero__image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.4s ease;
    }

    .yhb-hero__image:hover img {
        transform: scale(1.03);
    }

    /* ══════════════════════════════════════════════
       SECTION 2 — SECONDARY PAIR
    ══════════════════════════════════════════════ */

    .yhb-secondary__grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--yhb-archive-gap);
        padding-bottom: 1rem;
    }

    @media (max-width: 781px) {
        .yhb-secondary__grid {
            grid-template-columns: 1fr;
        }
    }

    .yhb-secondary__card {
        display: flex;
        gap: 1rem;
        align-items: flex-start;

        @media (max-width: 781px) {
            flex-direction: column;
        }

        > p {
            display: none;
        }
    }

    .yhb-secondary__image-wrap {
        flex: 0 0 160px;
        border-radius: 20px;
        overflow: hidden;
        aspect-ratio: 4 / 3;
        display: block;
    }

    .yhb-secondary__image-wrap img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.4s ease;
    }

    .yhb-secondary__image-wrap:hover img {
        transform: scale(1.05);
    }

    .yhb-secondary__content {
        flex: 1;
    }

    .yhb-secondary__date {
        font-size: 1rem;
        color: #777;
        margin: 0 0 0.5rem;
    }

    .yhb-secondary__title {
        font-size: 1.25rem;
        font-weight: 700;
        line-height: 1.35;
        color: var(--wp--preset--color--navy);
        margin: 0;
    }

    .yhb-secondary__title a {
        color: inherit;
        text-decoration: none;
    }

    .yhb-secondary__title a:hover {
        /*color: var(--wp--preset--color--teal);*/
    }

    /* ══════════════════════════════════════════════
       SECTION 3 — FILTERS + GRID
    ══════════════════════════════════════════════ */

    /* Filter bar */

    .yhb-filters {
        margin-bottom: 2.5rem;
    }

    .yhb-filters__inner {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;

        @media (min-width: 782px) {
            flex-direction: row;
        }
    }

    .yhb-filters__select {
        font-family: 'Inter', sans-serif;
        font-size: 0.9rem;
        color: var(--wp--preset--color--midnight);
        background: #fff;
        border: 0;
        border-bottom: 1px solid var(--wp--preset--color--midnight);
        border-radius: 0;
        padding: 0.55rem 2rem 0.55rem 0.85rem;
        margin: 0;
        cursor: pointer;
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 0.65rem center;
        min-width: 160px;
    }

    .yhb-filters__select:focus {
        outline: 2px solid var(--wp--preset--color--lime);
        outline-offset: 2px;
    }

    .yhb-filters__search-wrap {
        display: flex;
        flex: 1;
        gap: 0.5rem;
        max-width: 540px;
        overflow: hidden;
        background: #fff;
    }

    .yhb-filters__search {
        background: #f7f7f7;
        flex: 1;
        font-family: 'Inter', sans-serif;
        font-size: 0.9rem;
        border: none;
        border-radius: 4px;
        padding: 0.55rem 0.85rem;
        margin: 0;
        outline: none;
        color: var(--wp--preset--color--midnight);
    }

    .yhb-filters__search::placeholder {
        color: var(--wp--preset--color--midnight);
    }

    .yhb-filters__search-btn {
        background: var(--wp--preset--color--lime);
        border: none;
        border-radius: 50px;
        padding: 5px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--wp--preset--color--midnight);
        transition: background 0.2s;
        flex-shrink: 0;
        width: 40px;
        height: 40px;
    }

    .yhb-filters__search-btn:hover {
        background: var(--wp--preset--color--teal);
    }

    /* Posts grid */

    .yhb-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2.5rem var(--yhb-archive-gap);
        margin-bottom: 3rem;
    }

    @media (max-width: 781px) {
        .yhb-grid {
            grid-template-columns: 1fr;
        }
    }

    /* Single card */

    .yhb-card {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }

    .yhb-card__date {
        font-size: 1rem;
        color: #777;
        margin: 0;
    }

    .yhb-pill {
        display: inline-block;
        font-size: 1rem;
        color: var(--wp--preset--color--navy);
        background: #f7f7f7;
        border: 0;
        border-radius: 4px;
        padding: 0.2em 0.75em;
        align-self: flex-start;
    }

    .yhb-card__title {
        font-size: 1.25rem;
        font-weight: 800;
        line-height: 1.3;
        color: var(--wp--preset--color--navy);
        margin: 0;
    }

    .yhb-card__title a {
        color: inherit;
        text-decoration: none;
    }

    .yhb-card__title a:hover {
        /*color: var(--wp--preset--color--teal);*/
    }

    .yhb-card__excerpt {
        font-size: 1.1rem;
        line-height: 1.65;
        color: #555;
        margin: 0;
    }

    /* ── Read More button (shared) ── */

    .yhb-read-more {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        font-family: 'Inter', sans-serif;
        font-size: 1rem;
        font-weight: 600;
        color: var(--wp--preset--color--navy);
        text-decoration: none;
        margin-top: 0.25rem;
    }

    .yhb-read-more__icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 26px;
        height: 26px;
        background: var(--wp--preset--color--lime);
        color: #fff;
        border-radius: 50%;
        font-size: 0.85rem;
        font-style: normal;
        line-height: 1;
        transition: background 0.2s, transform 0.2s;

        svg {
            width: 8px;
        }
    }

    .yhb-read-more:hover .yhb-read-more__icon {
        transform: var( --yhb-button-arrow-transform );
    }

    /* ── Pagination ── */

    .yhb-pagination {
        display: flex;
        justify-content: center;
        padding: 1rem 0 3rem;
        flex-wrap: wrap;
    }

    .yhb-pagination .page-numbers {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 34px;
        height: 34px;
        padding: 0 0.5rem;
        font-size: 0.9rem;
        font-family: 'Inter', sans-serif;
        color: var(--wp--preset--color--navy);
        text-decoration: none;
        border-left: 1px solid var(--wp--preset--color--midnight);
        transition: background 0.15s, color 0.15s;

        &:first-child {
            border-left: none;
        }
    }

    .yhb-pagination .page-numbers:hover,
    .yhb-pagination .page-numbers.current {
        background: var(--wp--preset--color--midnight);
        border-color: var(--wp--preset--color--midnight);
        color: #fff;
    }

    .yhb-pagination .page-numbers.dots {
        background: none;
        pointer-events: none;
        color: #888;
    }

    /* ── No results ── */

    .yhb-no-results {
        padding: 3rem 0;
        text-align: center;
        color: #777;
        font-size: 1rem;
    }

    .yhb-no-results a {
        color: var(--wp--preset--color--teal);
    }
}

.yhb-specialties {
    [rel=tag] {
        color: var(--wp--preset--color--navy);
        text-decoration: none;
        font-size: 0.9rem;
        background: #f7f7f7;
        border-radius: 4px;
        padding: 0.2em 0.75em;
        margin-right: 0.5rem;
        margin-bottom: 0.5rem;
        display: inline-block;

        &:hover,
        &:focus {
            text-decoration: underline;
        }
    }
}

.single-staff {
    /* Connect row */
    .yhb-staff-modal__connect {
        margin-bottom: 1.5rem;
    }

    .yhb-staff-modal__connect-label {
        font-size: 0.9375rem;
        margin: 0 0 0.5rem;
    }

    .yhb-staff-modal__connect-links {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        flex-wrap: wrap;
    }

    .yhb-staff-modal__connect-links a {
        color: var(--wp--preset--color--navy, #1a2e5a);
        text-decoration: none;
        display: flex;
        align-items: center;
        gap: 0.3rem;
        font-size: 0.9375rem;
        transition: color 0.2s;
    }

    .yhb-staff-modal__connect-links a:hover {
        color: var(--wp--preset--color--lime, #8dc63f);
    }

    .yhb-staff-modal__connect-sep {
        color: #ccc;
    }
    /*.info-content {*/
    /*    > * {*/
    /*        text-align: left !important;*/
    /*    }*/
    /*}*/
}

.event-speakers {
    .event-speaker {
        display: flex;
        align-items: flex-start;
        gap: 1rem;

        @media (max-width: 781px) {
            align-items: center;
            flex-direction: column;
        }
    }

    .event-speaker-image {
        background: #f7f7f7;
        border-radius: 20px;
        height: 200px;
        overflow: hidden;
        width: 200px;

        > img {
            height: 100%;
            object-fit: cover;
            width: 100%;
        }
    }

    .inner-content {
        flex: 1;
    }

    .event-speakers-name {
        margin: 0;

        @media (max-width: 781px) {
            text-align: center;
        }
    }

    .event-speakers-title {
        color: var(--wp--preset--color--navy);
        margin-bottom: 1rem;
        font-size: 1rem;
        font-weight: bold;

        @media (max-width: 781px) {
            text-align: center;
        }
    }
}

.event-meta {
    background: #f7f7f7;
    border-radius: 1rem;
    padding: 1rem;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;

    > .meta-row {
        display: grid;
        gap: 1rem;
        grid-template-columns: 180px 1fr;

        :first-child {
            font-weight: bold;
            text-transform: capitalize;
        }
    }
}