/*
 * Map and directions cards on single clinic pages.
 * The Google Maps iframe gets a fixed height after Complianz has initialized
 * it, so every layer needs an explicit height inside the stretched row.
 */
@media (min-width: 768px) {
    .clinic-directions-row {
        align-items: stretch;
    }

    /* Elementor otherwise lets the two columns shrink by different amounts. */
    .clinic-directions-row > .e-con {
        flex: 0 0 calc((100% - 30px) / 2) !important;
        width: calc((100% - 30px) / 2) !important;
        min-width: 0;
    }

    .clinic-directions-row > .e-con:has(.clinic-map-fill) {
        min-height: 0;
        overflow: hidden;
    }

    .clinic-map-fill {
        align-self: stretch;
        flex: 1 1 auto !important;
        min-height: 0;
    }

    .clinic-map-fill .elementor-custom-embed,
    .clinic-map-fill .cmplz-placeholder-parent,
    .clinic-map-fill iframe {
        display: block;
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
    }

    .clinic-map-fill iframe {
        border: 0;
    }
}