/*
	README

	Modify this file as much or as little as needed.

	This file is shared across all CCL widgets in the Image Box family. This enables the ability to
	a family of widgets in a single update without touching the structure of the widget and without needing
	to duplicate efforts across several widget-specific CSS files.
*/

.ccl-v2-widget.core-v2-imagebox {
    .img-cont::before {
        top: 25%;
        display: block;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
    }

    .slide-title {
        font-size: var(--text-xl);
        font-weight: var(--font-weight-extrabold);
        line-height: 1.2;
    }

    .slide-desc {
        font-size: var(--text-base);
        font-weight: var(--font-weight-normal, 400);
        line-height: var(--leading-normal);
    }

    &:not(.imagebox-v2-1-across) .img-cont,
    :not(.imagebox-v2-1-across) .img-cont::before,
    :not(.imagebox-v2-1-across) .img-cont::after,
    :not(.imagebox-v2-1-across) .slide-img,
    &:not(.imagebox-v2-1-across):is(.animation-overlay) .img-cont {
        border-radius: unset !important;
    }
    
    .mini-date-section {
        border-radius: 0 0 8px 0;
        width: 7.5rem;
        height: 6.5625rem;
        font-weight: var(--font-weight-semibold);
        gap: var(--space-3);
    }

    @container(min-width: 64em) {
        .slide .inner .img-cont, .slide-img {
            max-height: 28.125rem;
            aspect-ratio: unset;
        }
    }

}