:root {
    --ovt-grey--text: #7a7a7a;
    --ovt-grey--dark: #54595f;
    --ovt-grey--medium: #ebecef;
    --ovt-grey--light: #e6e6e6;
    --ovt-grey--x-light: #f2f2f2;
    --ovt-white-bg: #fafbfd;

    --ovt-dark-grey: var(--ovt-grey--dark);
    --ovt-grey-m: var(--ovt-grey--medium);

    --ovt-orange: #e89b4d;
    --ovt-orange--300: #f0c081;
    --ovt-orange--500: #e3812c;

    --ovt-primary: #5fbaa3;
    --ovt-primary--200: #ace3d2;
    --ovt-primary--500: #359781;
    --ovt-primary--700: #236255;

    --ovt-body: clamp(1.1rem, 1rem + 0.1vw, 1.125rem);
    --ovt-body-m: clamp(1.1rem, 1rem + 0.3vw, 1.25rem);
    --ovt-body-l: clamp(1.2rem, 1rem + 0.8vw, 1.75rem);
    --font-size-h3: clamp(1.25rem, 1rem + 1vw, 1.875rem);
    --ovt-sub-2: clamp(1.25rem, 1rem + 1vw, 1.875rem);
    --ovt-sub-3: clamp(1.1rem, 1rem + 0.6vw, 1.5rem);
    --font-size-bc-l: clamp(1.1rem, 1rem + 0.6vw, 1.5rem);
    --font-size-bc-m: clamp(1.1rem, 1rem + 0.3vw, 1.25rem);
    --font-size-bc: clamp(1.1rem, 1rem + 0.1vw, 1.125rem);
    --font-size-bc-s: 1rem;
    --font-size-h3: clamp(1.25rem, 1rem + 1vw, 1.875rem);
}

/** Sitewide styling for download button from Blocks/Gutenberg editor **/
.wp-block-file__button.wp-element-button {
    background-color: var(--ovt-orange);
    color: #fff;

    border: 1px solid var(--ovt-orange);
    border-radius: 4px;
    padding: 0.5rem 1.5rem;

    transition: all 0.2s;

    &:hover {
        background-color: transparent;
        color: var(--ovt-orange);
    }
}

/** Styling for OVT sessies overview page **/

.ovt-sessie__img {
    width: 100%;
    aspect-ratio: 1.75 / 1;
    object-fit: cover;
    border-radius: 10px 10px 0 0 !important;
    display: block;
}

.ovt-single-sessie .ovt-sessie__img {
    border-radius: 0 !important;
}

/* Styling for single OVT sessies pages */

.ovt-sessie-info p {
    margin-block-end: 0;
}

.ovt-sessie-info h3.ovt-sessie-info__heading {
    font-size: var(--ovt-sub-2);
    margin-block-end: 0;
}

.ovt-sessie-info h3.ovt-sessie-info__heading:not(:first-child) {
    margin-block-start: 2rem;
}

.ovt-sessie-info a.ovt-sessie-info__url {
    display: inline-block;
    width: fit-content;
    padding-inline: 1.5rem;
    padding-block: 0.5rem;
    background-color: var(--ovt-orange);
    margin-block-start: 0.5rem;
    color: #fff;
    border-radius: 4px;
    border: 2px solid var(--ovt-orange);
    transition: all 0.2s;
}

.ovt-sessie-info a.ovt-sessie-info__url:hover {
    background-color: transparent;
    color: var(--ovt-orange);
}

/* Styling for single podcast template */

.ovt-podcast-episode {
    display: flex;
    gap: 1rem;
    align-items: center;

    border: 1px solid var(--ovt-dark-grey);
    border-radius: 0.5rem;

    margin-bottom: 1.5rem;
    padding: 1rem;
}

@media screen and (max-width: 48em) {
    .ovt-podcast-episode__icon {
        width: 3.5em;
    }
}

.ovt-podcast-episode__details {
    flex: 1;
    text-align: center;
    color: var(--ovt-primary);
}

.ovt-podcast-episode__part {
    font-size: var(--ovt-sub-3);
}

.ovt-podcast-episode__title {
    font-size: var(--ovt-sub-2) !important;
}

.ovt-podcast__guest {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;

    img.ovt-podcast__guest-image {
        border-radius: 100vw;
        width: 100%;
        aspect-ratio: 1 / 1;
        object-fit: cover;
    }

    span.ovt-podcast__guest-name {
        font-size: var(--ovt-body-l);
        font-weight: 600;
        line-height: 1.2em;
        color: var(--ovt-dark-grey);
        text-align: center;
    }
}

.ovt-podcast__info > div {
    margin-block-end: 1.5rem;
}

h3.ovt-podcast__h3 {
    font-size: var(--ovt-sub-2) !important;
    margin-block-start: 0;
    margin-block-end: 0.5rem;
}

.ovt-podcast-webinar {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;

    margin-block-end: 1rem;
}

.ovt-podcast-webinar img.ovt-podcast-webinar__img {
    border-radius: 0.5rem;
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
}

span.ovt-podcast-webinar__title {
    font-size: var(--ovt-body-m);
}

a.ovt-podcast-webinar__link,
a.ovt-podcast-document__link {
    background-color: var(--ovt-orange);
    color: #fff !important;
    font-size: var(--ovt-body);
    width: fit-content;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    border: 2px solid var(--ovt-orange);
    transition: all 0.2s;
}

a.ovt-podcast-webinar__link:hover,
a.ovt-podcast-document__link:hover {
    background-color: transparent;
    color: var(--ovt-orange) !important;
}

ul.ovt-podcast-links__list {
    padding-inline-start: 1rem;
}

li.ovt-podcast-links__item {
    text-decoration: underline;
    font-size: var(--ovt-body);
    line-height: 1.125em;
    margin-block-end: 0.25rem;
}

li.ovt-podcast-links__item a {
    color: var(--ovt-dark-grey);
}

.ovt-podcast-documents__item {
    display: flex;
    flex-direction: column;

    background-color: var(--ovt-grey-m);
    padding: 0.75rem;
    border-radius: 0.25rem;
}

.ovt-podcast-documents__item:not(:last-child) {
    margin-block-end: 0.75rem;
}

.ovt-podcast-documents__item p {
    font-size: var(--ovt-body);
    line-height: 1.25em;
    color: var(--ovt-dark-grey);
}

/*************************************************** Styling for courses (course grid, and single course) *****************************************/

#ovt-enrolled-courses.is-loading {
    opacity: 0.5;
    pointer-events: none; /* optional */
    transition: opacity 200ms ease;
}

.elementor-shortcode
    .learndash-wrapper
    a.ovt-course__continue-btn.ld-button:not(.button),
div.ovt-course__retake a,
div.ovt-course-page__btn-wrapper a,
.learndash-wrapper
    .ld-button:not([disabled]):not(.ld-button-reverse):not(
        .ld-button-transparent
    ):not(.ld--ignore-inline-css).ovt-course__continue-btn,
.ovt-course__start-btn {
    background-color: var(--ovt-primary) !important;
    border: 2px solid var(--ovt-primary) !important;
    border-bottom: 2px solid var(--ovt-primary) !important;
    color: #fff;
    width: 100%;
    padding-inline: 1.25rem;
    padding-block: 0.75rem;
    margin-block-end: 0.25rem;
    border-radius: 5px;
    font-size: 1rem;
    font-family: 'Hind';
    font-weight: 500;
    transition: all 0.4s;
    line-height: 1;
}

.ovt-course__btn-wrapper {
    display: flex;
}

.ovt-course__btn-wrapper a.ovt-course__start-btn {
    color: #fff;
}

.ovt-course__start-btn {
    text-align: center;
}

.ovt-course-page__continue-btn {
    font-size: var(--font-size-bc-l);
}

.elementor-shortcode
    .learndash-wrapper
    a.ovt-course__continue-btn.ld-button:not(.ld--ignore-inline-css):hover:not(
        .button
    ),
div.ovt-course__retake a:hover,
.ovt-course__start-btn:hover {
    background-color: transparent !important;
    color: var(--ovt-primary) !important;
}

.elementor-shortcode
    .learndash-wrapper
    a.ovt-single-course__continue-btn.ovt-single-course__continue-btn.ld-button.ld-button {
    border-radius: 4px !important;
    color: #fff !important;
    font-size: var(--ovt-body) !important;
    font-weight: 400 !important;
    border: 1px solid var(--ovt-orange) !important;
    border-bottom: 1px solid var(--ovt-orange) !important;
    transition: all 0.2s !important;
}
.elementor-shortcode
    .learndash-wrapper
    a.ovt-single-course__continue-btn.ovt-single-course__continue-btn.ld-button.ld-button:hover {
    background-color: transparent !important;
    color: var(--ovt-orange) !important;
}
.ovt-course__instructor {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

img.ovt-course__instructor-image {
    width: 2rem;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 100vw !important;
}

@media screen and (max-width: 48em) {
    .learndash-wrapper:not(.ld-registration__outer-wrapper):not(
            .learndash-wrapper--modern
        )
        .ld-button {
        margin-left: 0 !important;
    }
}

div.ovt-course__retake {
    display: flex;
    justify-content: center;
}

.ovt-course__retake-btn {
    text-align: center;
    line-height: 1;
}

.ovt-course__price {
    color: #fff;
    background-color: var(--ovt-orange);
    padding-inline: 1rem;
    padding-block: 0.5rem;
    border-radius: 0 10px 0 10px;
    font-size: clamp(1.1rem, 1rem + 0.6vw, 1.5rem);
    font-family: 'Hind';
    font-weight: 400;
    line-height: 1;
}

#ovt-course__spacer {
    min-height: 0.75rem;
}

div.ovt-course__technician-exclusive {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 0.25rem;

    padding-inline: 1rem;
    padding-block: 0.375rem;
    background-color: var(--ovt-primary--500);
    border-radius: 10px 10px 0 0;
    color: #fff;
    font-family: 'Hind';
    width: max-content;
}

.ovt-course__technician-super {
    font-size: 0.75rem;
    line-height: 1em;
}

.ovt-course__technician-content {
    font-size: clamp(1.1rem, 1rem + 0.1vw, 1.125rem);
    line-height: 1em;
}

/* Styles for course filters */

form#onvt-course-filters {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    font-family: 'Hind';
    font-weight: 500;
}

.ovt-course-filters__section {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ovt-course-filters__section:has(label) {
    gap: 1.5rem;
}

#onvt-course-filters label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: clamp(1.1rem, 1rem + 0.3vw, 1.25rem);
    line-height: 1em;
}

#onvt-course-filters input[type='checkbox'] {
    width: 1.5rem;
    height: 1.5rem;
    accent-color: var(--ovt-orange);
    margin-top: -3px;
}

@media screen and (max-width: 48em) {
    .ovt-course-filters__section {
        flex-direction: column;
    }
}

/* Styling for favorite button */
.ovt-favorite-btn--accent
    .ldfc-favorite-button
    .ldfc-button.js-favcon-favorite {
    border-radius: 4px;
    border: 2px solid var(--ovt-orange);
    background-color: var(--ovt-orange);
    color: #fff;
    text-transform: uppercase;
    font-weight: 400;
    padding: 0.5rem 1rem 0.25rem;
    transition: all 0.3s;
}

.ovt-favorite-btn--accent
    .ldfc-favorite-button
    .ldfc-button.js-favcon-favorite
    span.ld-icon {
    height: 1.5rem;
}

.ovt-favorite-btn--accent
    .ldfc-favorite-button
    .ldfc-button.js-favcon-favorite:hover {
    background-color: transparent;
}

/*********************** Single course page *************************/

.ovt-course-tab__instructor {
    margin-block-end: 2rem;
}
.ovt-course-tab__heading {
    display: flex;
    align-items: center;
    font-size: var(--font-size-h3);
    gap: 2rem;
    color: var(--ovt-primary--700);
    margin-block-end: 0.75rem;
}

.ovt-course-tab__heading img.ovt-course-tab__instructor-image {
    min-width: 5rem;
    max-width: 5rem;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 50px;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list.ld-lesson-list
    .ld-section-heading
    h2 {
    font-size: clamp(1.8rem, 1rem + 1.7vw, 2.5rem);
    color: var(--ovt-primary--700);
}

.ovt-single-course__details .learndash-wrapper .ld-expand-button {
    font-size: var(--font-size-bc-l);
    font-weight: 400;
    font-family: 'Hind', sans-serif;
    padding: 0.5rem 1rem;
    border-radius: 4px;
}

.ovt-single-course__details .learndash-wrapper .ld-expand-button span.ld-text {
    padding-inline-start: 0.5rem;
    padding-inline-end: 0;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-list-item-preview
    .ld-status-icon {
    margin-top: 0;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-details {
    background-color: var(--ovt-primary);
    border-radius: 4px;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-details
    .ld-expand-button {
    margin: 0;
    padding: 0.5rem 1rem;
}
.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item {
    border: none;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-list-item-preview {
    padding: 0.75rem;
    background-color: var(--ovt-grey--x-light);
    border-radius: 0.5rem;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
}

.ovt-single-course__details .learndash-wrapper .ld-secondary-background,
.ovt-single-course__details
    .learndash-wrapper
    .ld-item-name
    .ld-status-complete {
    background-color: var(--ovt-primary--500) !important;
}

.ovt-course-header__instructor-info {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin-block-end: 0.75rem;

    color: #fff;
    font-size: var(--font-size-bc-l);
    font-weight: 400;
}

.ovt-course-header__instructor-info img.ovt-course-header__instructor-image {
    min-width: 3rem;
    max-width: 3rem;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 50px;
}

.ovt-course-content {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.ovt-course-content__item {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.ovt-course-content__icon {
    height: 1.5rem;
    width: 1.5rem;
}

.ovt-course-content__label {
    color: #fff;
    font-size: var(--font-size-bc);
}

.ovt-single-course__btn-wrapper {
    width: 100%;
}

.ovt-single-course__btn-wrapper a.ovt-single-course__btn,
.ovt-single-course__btn-wrapper a.ovt-single-course__start-btn {
    display: block;
    background-color: var(--ovt-primary);
    padding: 0.5rem 1rem;
    margin-block-end: 0.5rem;
    border-radius: 4px;
    border: 2px solid var(--ovt-primary);
    text-align: center;
    font-size: var(--font-size-bc-m);
    transition: all 0.2s;
    color: #fff;
}

.ovt-single-course__btn-wrapper a.ovt-single-course__btn:hover,
.ovt-single-course__btn-wrapper a.ovt-single-course__start-btn:hover {
    background-color: transparent;
}

.ovt-single-course__btn-wrapper a.ovt-single-course__start-btn {
    background-color: var(--ovt-orange);
    border-color: var(--ovt-orange);
}

.ovt-favorite-btn--accent
    .ldfc-shortcode
    .ldfc-favorite-button
    .ldfc-button.js-favcon-favorite {
    border-radius: 4px;
    border: 2px solid var(--ovt-orange) !important;
    background-color: var(--ovt-orange);
    color: #fff;
    text-transform: uppercase;
    font-weight: 400;
    padding: 0.5rem 1rem 0.25rem;
    transition: all 0.3s;
}

.ovt-favorite-btn--accent
    .ldfc-favorite-button
    .ldfc-button.js-favcon-favorite
    span.ld-icon {
    height: 1.5rem;
}

.ovt-favorite-btn--accent
    .ldfc-favorite-button
    .ldfc-button.js-favcon-favorite:hover {
    background-color: transparent;
    color: var(--ovt-orange);
}

.ovt-course-tab__instructor {
    margin-block-end: 2rem;
}
.ovt-course-tab__heading {
    display: flex;
    align-items: center;
    font-size: var(--font-size-h3);
    gap: 2rem;
    color: var(--ovt-primary--700);
    margin-block-end: 0.75rem;
}

.ovt-course-tab__heading img.ovt-course-tab__instructor-image {
    min-width: 5rem;
    max-width: 5rem;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 50px;
}
.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list.ld-lesson-list
    .ld-section-heading
    h2 {
    font-size: clamp(1.8rem, 1rem + 1.7vw, 2.5rem);
    color: var(--ovt-primary--700);
}

.ovt-single-course__details .learndash-wrapper .ld-expand-button {
    font-size: var(--font-size-bc-l);
    font-weight: 400;
    font-family: 'Hind', sans-serif;
    padding: 0.5rem 1rem;
    border-radius: 4px;
}

.ovt-single-course__details .learndash-wrapper .ld-expand-button span.ld-text {
    padding-inline-start: 0.5rem;
    padding-inline-end: 0;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-list-item-preview
    .ld-status-icon {
    margin-top: 0;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-details {
    background-color: var(--ovt-primary);
    border-radius: 4px;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-details
    .ld-expand-button {
    margin: 0;
    padding: 0.5rem 1rem;
}
.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item {
    border: none;
}

.ovt-single-course__details
    .learndash-wrapper
    .ld-item-list
    .ld-item-list-item
    .ld-item-list-item-preview {
    padding: 0.75rem;
    background-color: var(--ovt-grey--x-light);
    border-radius: 0.5rem;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
}

.ovt-single-course__details .learndash-wrapper .ld-secondary-background,
.ovt-single-course__details
    .learndash-wrapper
    .ld-item-name
    .ld-status-complete {
    background-color: var(--ovt-primary--500) !important;
}

.ovt-single-course-live__wrapper {
    background-color: #fff;
    color: var(--ovt-primary);
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 4px rgb(0 0 0 / 0.1);

    & h3.ovt-single-course-live__title {
        font-size: var(--ovt-body-l);
        margin-block-start: 0 !important;
    }

    & p {
        font-size: var(--ovt-body-m);
        margin-bottom: 0;
    }

    & > *:not(:last-child) {
        margin-bottom: 1rem;
    }
}
.ovt-single-course-live__wrapper a.ovt-single-course-live__registration-link {
    background-color: var(--ovt-orange);
    color: #fff !important;
    font-size: var(--ovt-body);
    text-transform: uppercase;
    width: fit-content;
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    border: 2px solid var(--ovt-orange);
    transition: all 0.2s;

    display: block;

    &:hover {
        background-color: transparent;
        color: var(--ovt-orange) !important;
    }
}

/****************************** Styling for promotion block **************************************************/

.ovt-course-promotion {
    display: flex;
    gap: 1rem;
    background-color: var(--ovt-grey-m);

    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
    border-radius: 0.5rem;
}

.ovt-course-promotion img.ovt-course-promotion__image {
    width: 45%;
    max-width: 30rem;
    border-radius: 0.5rem 0 0 0.5rem;
    flex-shrink: 0;

    object-fit: cover;
}

.ovt-course-promotion__content {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    flex: 1;
}

.ovt-course-promotion__heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 0.25rem;
    width: fit-content;

    line-height: 1.25em;
    font-size: var(--font-size-h3) !important;
    text-align: center;

    padding-inline: 2rem;
    padding-block-end: 1.25rem;
    border-block-end: 2px solid var(--ovt-primary--700);
}

.ovt-course-promotion__heading .ovt-course-promotion__type {
    font-weight: 600;
}

.ovt-course-promotion__description {
    color: var(--ovt-primary--700);
}

.ovt-course-promotion__content a.ovt-course-promotion__permalink {
    background-color: var(--ovt-orange);
    color: #fff;
    text-decoration: none;

    padding-inline: 1rem;
    padding-block: 0.5rem 0.35rem;

    font-size: var(--font-size-bc-m);
    font-weight: 500;
    border-radius: 4px;
    border: 2px solid var(--ovt-orange);

    transition: all 0.2s;
}

.ovt-course-promotion__content a.ovt-course-promotion__permalink:hover {
    background-color: transparent;
    color: var(--ovt-orange);
}

@media screen and (max-width: 48em) {
    .ovt-course-promotion {
        flex-direction: column;
        gap: 0.5rem;
    }

    .ovt-course-promotion img.ovt-course-promotion__image {
        width: 100%;
        border-radius: 0.5rem 0.5rem 0 0;
    }

    .ovt-course-promotion__content {
        padding-block-start: 0;
    }
}

/****************************************************** Styling for FluentForms *************************************************/
button.ff-btn.ff-btn-submit.ff-btn-md.ff_btn_style {
    background-color: var(--ovt-primary);
    border-radius: 4px;
    border: 2px solid var(--ovt-primary);
    color: #fff;
    transition: all 0.2s;
    text-transform: uppercase;
    font-family: 'Hind';
    font-size: var(--ovt-body);
    display: block;
}

button.ff-btn.ff-btn-submit.ff-btn-md.ff_btn_style:hover {
    background-color: transparent;
    color: var(--ovt-primary) !important;
}

@media screen and (max-width: 48em) {
    button.ff-btn.ff-btn-submit.ff-btn-md.ff_btn_style {
        margin-inline: auto;
    }
}

/************************************************* Styling for login/out button *************************************************/

.ovt-login-out-button a.ovt-login-out-text {
    color: var(--ovt-primary) !important;
    font-size: 1rem;
}

/************************************************* Styling for OVT single product (course) *************************************************/
h3.ovt-product__course-info-title {
    font-size: clamp(1.5rem, 1rem + 1.1vw, 2rem);
    margin-block-start: 0;
    margin-block-end: 0.125rem;
}

/************************************************* Styling for author meta on posts pages **************************************/
.ovt-post-meta {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.ovt-post-meta__author {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ovt-post-meta__date {
    padding-inline-start: 1.5rem;
    border-inline-start: 1px solid var(--ovt-dark-grey);
}

.ovt-post-meta img.ovt-post-meta__author-image {
    max-width: 2.5rem;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    border-radius: 50vw;
}

/************************************************* Styling for author block on posts pages **************************************/

div.ovt-post-author {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;

    @media (width <= 48em) {
        flex-direction: column;
        gap: 0.75rem;
    }
}

.ovt-post-author img.ovt-post-author__image {
    display: block;
    max-width: 6.25rem;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    border-radius: 50vw;
}

h3.ovt-post-author__name {
    font-size: var(--ovt-sub-2) !important;
    margin-bottom: 0.25rem;
}

span.ovt-post-author__title {
    display: block;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

/************************************************* Styling for protocols page **************************************/
.ovt-protocol__download-btn {
    display: inline-block;
    background-color: var(--ovt-primary);
    color: #fff !important;
    border-radius: 4px;
    border: 2px solid var(--ovt-primary);
    padding: 0.5rem 1.5rem;
    transition: all 0.2s;

    text-transform: uppercase;

    &:hover {
        background-color: transparent !important;
        color: var(--ovt-primary) !important;
    }
}

/************************************************* Styling for dashboard page *************************************/

.ovt-recent-topics {
    display: flex;
    flex-direction: column;
    gap: 1rem;

    color: var(--ovt-primary--700);
}

.ovt-recent-topics__topic {
    display: flex;
    flex-direction: column;
}

.ovt-recent-topics__topic-title {
    font-weight: 600;
}

.ovt-certificate-container .certificate-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: 2rem;
}

.ovt-certificate-container .certificate-list br {
    display: none;
}

.ovt-certificate {
    border-width: 2rem 1px 1px 1px;
    border-color: var(--ovt-grey--light);
    border-style: solid;
    border-radius: 4px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);

    padding-inline: 1rem;
    padding-block-end: 1rem;

    display: flex;
    flex-direction: column;
    align-items: center;
}

.ovt-certificate__icon {
    height: 3rem;
    width: 2.5rem;

    transform: translateY(-50%);
    margin-block-end: -1rem;
}

.ovt-certificate__before-title {
    font-size: var(--font-size-bc-s);
    color: var(--ovt-grey--text);
}

.ovt-certificate a.ovt-certificate__title {
    font-size: var(--font-size-bc-m);
    color: var(--ovt-primary--700);
}

.ovt-certificate__meta {
    display: flex;
    align-self: stretch;

    justify-content: space-between;
    align-items: center;

    margin-block-start: 0.5rem;
}

.ovt-certificate__date {
    display: flex;
    flex-direction: column;

    gap: 0.25rem;

    font-size: var(--font-size-bc-s);
    line-height: 1em;
}

.ovt-certificate__download {
    display: flex;
    align-items: center;
}

/******************************* Styling for search results *************************/

p.ovt-post-type {
    font-size: 1rem;
    margin-block-end: 0;
    padding: 0.125rem 0.5rem 0rem;
    border-radius: 4px;
    width: max-content;
}

p.ovt-post-type--post {
    background-color: var(--ovt-primary);
    color: #fff;
}

p.ovt-post-type--vet-case {
    background-color: var(--ovt-primary--200);
    color: #fff;
}

p.ovt-post-type--protocol {
    background-color: var(--ovt-primary--700);
    color: #fff;
}
p.ovt-post-type--podcast {
    background-color: var(--ovt--orange);
    color: #fff;
}

p.ovt-post-type--sfwd-courses {
    background-color: var(--ovt-orange--500);
    color: #fff;
}

p.ovt-post-type--leertraject {
    background-color: var(--ovt-grey-m);
    color: #000;
}

p.ovt-post-type--kennisdatabank {
    background-color: var(--ovt-grey--text);
    color: #fff;
}