﻿.apo-card-media {
    container: card-media / inline-size;
    border-color: var(--bs-gray-500);
}

.apo-card-media__layout {
    --card-grid-columns: minmax(0, 1fr);    
    gap: 1.5rem 3rem;
    grid-template-columns: var(--card-grid-columns);
}

@container card-media (width >= 600px) {
    .apo-card-media__layout {
        --card-image-width: max(15rem, min(20rem, 38.0952cqi));
        --card-grid-columns: var(--card-image-width) minmax(0, 1fr)
    }
}

.apo-card-media__image {
    width: var(--card-image-width, min(15rem, 100%));
}

/* Force same height / equal columns */
:where(.sf_colsIn:has(> .apo-card-media)) {
    display: flex;
    flex-direction: column;
}
