/* ARTICLE CARDS ================== */

:root {
    --bc-article-margin: 20px;
}

.bc-article,
.wp-block-blockcraft-article > .bc-article {
    color: var(--wp--color--palette--primary) !important;
    h2 {
        line-height: 140%;
        a {
            font-weight: 700;
            /*display: inline-block;*/
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 3;
        }
    }
    a {
        color: var(--wp--color--palette--primary) !important;
        &:hover {
            border-bottom: none !important;
            color: var(--wp--color--palette--hover-primary) !important;
        }
        &::before {
            display: none;
        }
    }
    .bc-single-category {
        text-transform: uppercase;
        color: var(--wp--color--palette--primary) !important;
    }
    .bc-single-author p {
        font-size: var(--wp--preset--font-size--small);
        font-style: italic;
        margin-top: 0;
        text-decoration: underline;
    }
    p {
        margin-top: calc(var(--bc-article-margin) / 2);
        font-size: var(--wp--preset--font-size--medium);
    }
    & > .block-group > .block-group {
        gap: calc(var(--bc-article-margin) / 4) !important;
    }
}

.bc-article.bc-opening {
    h2 {
        a {
            -webkit-line-clamp: none !important;
        }
    }
}

/* card-stack-medium.php */
.bc-article.bc-card--stack.bc-card--medium,
.wp-block-blockcraft-article > .bc-article.bc-card--stack.bc-card--medium {
    h2 {
        font-size: var(--wp--preset--font-size--large) !important;
    }
}

/* card-stack-small-article.php */
.bc-article.bc-card--stack.bc-card--small,
.wp-block-blockcraft-article > .bc-article.bc-card--stack.bc-card--small {
    h2 {
        font-size: var(--wp--preset--font-size--large);
    }
    .bc-single-category {
        font-size: var(--wp--preset--font-size--small);
    }
    img {
        aspect-ratio: 16 / 9;
    }
    .bc-single-author p {
        display: inline-block;
        font-size: var(--wp--preset--font-size--small);
        font-style: italic;
        text-decoration: underline;
    }
}

/* card-inline-small-article.php - card-inline-small-flipped-article.php */
.bc-article.bc-card--inline.bc-card--small,
.bc-article.bc-card--inline.bc-card--small.bc-card--flipped,
.wp-block-blockcraft-article
    > .bc-article.bc-card--inline.bc-card--small
    .wp-block-blockcraft-article
    > .bc-article.bc-card--inline.bc-card--small.bc-card--flipped {
    h2 {
        font-size: var(--wp--preset--font-size--medium);
        line-height: normal;
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--large);
        }
    }
    .bc-single-category {
        font-size: var(--wp--preset--font-size--x-small);
        margin: 0;
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--small);
        }
    }
    .bc-single-author p {
        font-size: var(--wp--preset--font-size--x-small);
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--small);
        }
    }
    a::before {
        display: none;
    }
    img {
        aspect-ratio: 16 / 9;
    }
    & > .block-group {
        align-items: center !important;
        a & > .block-group {
            gap: 0 !important;
        }
    }
}

/* card-inline-medium-article.php */
.bc-article.bc-card--inline.bc-card--medium,
.wp-block-blockcraft-article > .bc-article.bc-card--inline.bc-card--medium {
    h2 {
        font-size: var(--wp--preset--font-size--x-large);
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--4-x-large) !important;
        }
    }
    .bc-single-category {
        font-size: var(--wp--preset--font-size--small);
        margin: 0;
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--medium);
        }
    }
    a::before {
        display: none;
    }
    img {
        aspect-ratio: 16 / 9;
    }
    & > .block-group {
        & > .block-group {
            gap: 0 !important;
        }
    }
}

/* card-stack-huge-article.php */
.bc-article.bc-card--stack.bc-card--huge,
.wp-block-blockcraft-article > .bc-article.bc-card--stack.bc-card--huge {
    h2 {
        font-size: var(--wp--preset--font-size--2-x-large);
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--4-x-large);
        }
    }
    .bc-single-category {
        font-size: var(--wp--preset--font-size--small);
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--medium);
            margin-bottom: calc(var(--bc-article-margin) / 4);
        }
    }
    a::before {
        display: none;
    }
    img {
        /*aspect-ratio: 16 / 9;*/
        aspect-ratio: 5 / 2;
        @media (min-width: 600px) {
            aspect-ratio: 5 / 2;
        }
    }
    .bc-single-author p {
        margin-top: 10px;
        text-decoration: none;
        & > span {
            text-decoration: underline;
        }
    }
}

/* card-inline-small-podcast.php */
.bc-article.bc-card--inline.bc-card--small.bc-card--podcast,
.wp-block-blockcraft-article > .bc-article.bc-card--inline.bc-card--small.bc-card--podcast {
    h2 {
        font-size: var(--wp--preset--font-size--medium);
        @media (min-width: 600px) {
            font-size: var(--wp--preset--font-size--medium) !important;
        }
    }
    img {
        aspect-ratio: 1 !important;
    }
    .bc-podcast {
        margin-top: 0;
        width: 100%;
        font-size: var(--wp--preset--font-size--small);
        display: flex;
        align-items: center;
        svg {
            width: 24px;
            height: 24px;
        }
        span {
            margin-left: calc(var(--bc-article-margin) / 2);
            font-weight: 600;
        }
    }
}

/* card-stack-small-video.php */
.bc-article.bc-card--stack.bc-card--small.bc-card--video,
.wp-block-blockcraft-article > .bc-article.bc-card--stack.bc-card--small.bc-card--video {
    a.bc-featured {
        position: relative;
        &::after {
            display: block;
            content: "";
            position: absolute;
            z-index: 1;
            width: 40px;
            height: 40px;
            background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTIwLjUgMzUuMzc2YTE1IDE1IDAgMSAwIDAtMzAuMDAyIDE1IDE1IDAgMCAwIDAgMzAuMDAybS0yLjAyOC0yMS42ODMgOS40MDYgNS4yMjZhMS42NjcgMS42NjcgMCAwIDEgMCAyLjkxNGwtOS40MDYgNS4yMjZhMiAyIDAgMCAxLTIuOTcyLTEuNzV2LTkuODY2YTIgMiAwIDAgMSAyLjk3Mi0xLjc1IiBmaWxsPSIjZmZmIi8+PC9zdmc+");
            left: 6px;
            bottom: 6px;
            opacity: 1;
        }
    }
    .bc-single-category {
        font-size: var(--wp--preset--font-size--medium);
        margin-bottom: calc(var(--bc-article-margin) / 2);
    }
}

/* card-stack-small-video.php */
.bc-article.bc-card--stack.bc-card--small.bc-card--photogallery,
.wp-block-blockcraft-article > .bc-article.bc-card--stack.bc-card--small.bc-card--photogallery {
    a.bc-featured {
        position: relative;
        &::after {
            display: block;
            content: "";
            position: absolute;
            z-index: 1;
            width: 35px;
            height: 36px;
            background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzUiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNSAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB5PSIuMzc2IiB3aWR0aD0iMzUiIGhlaWdodD0iMzUiIHJ4PSIxNy41IiBmaWxsPSIjZmZmIi8+PG1hc2sgaWQ9ImEiIHN0eWxlPSJtYXNrLXR5cGU6YWxwaGEiIG1hc2tVbml0cz0idXNlclNwYWNlT25Vc2UiIHg9IjUiIHk9IjYiIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNCI+PHBhdGggZmlsbD0iI0Q5RDlEOSIgZD0iTTUuODMzIDYuMjFoMjMuMzMzdjIzLjMzM0g1LjgzM3oiLz48L21hc2s+PGcgbWFzaz0idXJsKCNhKSI+PHBhdGggZD0iTTE3LjUgMjMuMjI0cTEuODIzIDAgMy4wOTktMS4yNzZ0MS4yNzYtMy4wOTlUMjAuNiAxNS43NXEtMS4yNzYtMS4yNzUtMy4wOTktMS4yNzYtMS44MjMgMC0zLjA5OSAxLjI3NnQtMS4yNzYgMy4xcTAgMS44MjEgMS4yNzYgMy4wOTggMS4yNzUgMS4yNzYgMy4xIDEuMjc2bTAtMS45NDRxLTEuMDIgMC0xLjcyNi0uNzA1YTIuMzUgMi4zNSAwIDAgMS0uNzA0LTEuNzI2cTAtMS4wMi43MDQtMS43MjZhMi4zNSAyLjM1IDAgMCAxIDEuNzI2LS43MDRxMS4wMiAwIDEuNzI2LjcwNC43MDUuNzA2LjcwNSAxLjcyNnQtLjcwNSAxLjcyNnEtLjcwNS43MDUtMS43MjYuNzA1bS03Ljc3OCA1LjM0N3EtLjgwMSAwLTEuMzczLS41NzFhMS44NyAxLjg3IDAgMCAxLS41NzEtMS4zNzNWMTMuMDE2cTAtLjgwMy41NzEtMS4zNzMuNTcxLS41NzIgMS4zNzMtLjU3MmgzLjA2M2wxLjc5OC0xLjk0NGg1LjgzNGwxLjc5OCAxLjk0NGgzLjA2M3EuODAyIDAgMS4zNzMuNTcyLjU3LjU3LjU3MSAxLjM3M3YxMS42NjdxMCAuODAxLS41NyAxLjM3My0uNTczLjU3LTEuMzc0LjU3MXoiIGZpbGw9IiMwMDAiLz48L2c+PC9zdmc+");
            left: 6px;
            bottom: 6px;
            opacity: 1;
        }
    }
    .bc-single-category {
        font-size: var(--wp--preset--font-size--medium);
        margin-bottom: calc(var(--bc-article-margin) / 2);
    }
}

/* card-stack-small-magazine.php */
.bc-article.bc-card--stack.bc-card--small.bc-card--magazine,
.wp-block-blockcraft-article > .bc-article.bc-card--stack.bc-card--small.bc-card--magazine {
    @media (max-width: 599px) {
        margin: 0 40px 40px 40px;
    }
    h2 {
        margin-top: var(--bc-article-margin);
        font-size: var(--wp--preset--font-size--2-x-large);
    }
    .bc-single-category {
        font-size: var(--wp--preset--font-size--small);
    }
    .bc-single-date {
        font-size: var(--wp--preset--font-size--small);
    }
    img {
        aspect-ratio: 3 / 4;
    }
    .bc-single-author p {
        display: none;
        @media (min-width: 600px) {
            display: inline-block;
            font-size: var(--wp--preset--font-size--small);
            font-style: italic;
            text-decoration: underline;
        }
    }
    .bc-card__cta {
        display: inline-block;
        border: 1px solid var(--wp--preset--color--secondary) !important;
        padding: 10px 10px 10px 15px;
        text-transform: uppercase;
        font-size: var(--wp--preset--font-size--small);
        margin-top: var(--bc-article-margin);
        a {
            position: relative;
            padding-right: 26px;
            font-weight: 600;
            &::after {
                display: block;
                content: "";
                position: absolute;
                z-index: 1;
                width: 20px;
                height: 20px;
                background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48bWFzayBpZD0iYSIgc3R5bGU9Im1hc2stdHlwZTphbHBoYSIgbWFza1VuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjIxIiBoZWlnaHQ9IjIxIj48cGF0aCBmaWxsPSIjRDlEOUQ5IiBkPSJNLjUuMDE1aDIwdjIwSC41eiIvPjwvbWFzaz48ZyBtYXNrPSJ1cmwoI2EpIj48cGF0aCBkPSJNMTQuMzU2IDEwLjY0SDQuMjVWOS4zOWgxMC4xMDZMOS42MDkgNC42NDNsLjg5MS0uODc4IDYuMjUgNi4yNS02LjI1IDYuMjUtLjg5MS0uODc4eiIgZmlsbD0iIzFDMUIxRiIvPjwvZz48L3N2Zz4=");
                top: -2px;
                right: 0;
                opacity: 1;
            }
        }
    }
}

/* card-inline-small-authors.php */
.bc-article.bc-card--inline.bc-card--small.bc-card--author,
.wp-block-blockcraft-article > .bc-article.bc-card--inline.bc-card--small.bc-card--author {
    & > .block-group {
        & > .bc-single-author {
            border-radius: 100%;
            overflow: hidden;
            width: 70px;
            height: 70px;
        }
    }
    img {
        aspect-ratio: 1 / 1 !important;
        width: 70px;
        height: 70px;
    }
    .bc-single-author p {
        text-decoration: underline;
    }
}

.bc-article.bc-card--stack {
    & > .block-group {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: 8px;
        > * {
            margin-top: 0 !important;
            margin-bottom: 0 !important;
        }
    }
}

.bc-article.bc-card--magazine {
    & > .block-group {
        gap: 20px;
        margin-top: 20px;
    }
    .bc-card__cta {
        width: fit-content;
    }
}
#bcc-authors-posts--swiper {
    .bc-article.bc-card--inline.bc-card--small.bc-card--author,
    .wp-block-blockcraft-article > .bc-article.bc-card--inline.bc-card--small.bc-card--author {
        & > .block-group {
            align-items: flex-start !important;
        }
    }
}