/* Block Grid layout — honour configured spans (no *3 shrink, no columns:none) */
.umb-block-grid__layout-container {
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--umb-block-grid--grid-columns, 1), minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-rows: minmax(50px, min-content);
    column-gap: var(--umb-block-grid--column-gap, 5px);
    row-gap: var(--umb-block-grid--row-gap, 0);
}
.umb-block-grid__layout-item {
    overflow: hidden;
    position: relative;
    grid-column-end: span min(var(--umb-block-grid--item-column-span, 1), var(--umb-block-grid--grid-columns));
    grid-row: span var(--umb-block-grid--item-row-span, 1);
}
.umb-block-grid__area-container,
.umb-block-grid__block--view::part(area-container) {
    position: relative;
    padding-top: 20px;
    display: grid;
    grid-template-columns: repeat(var(--umb-block-grid--area-grid-columns, var(--umb-block-grid--grid-columns, 1)), minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-rows: minmax(50px, min-content);
    column-gap: var(--umb-block-grid--areas-column-gap, 0);
    row-gap: var(--umb-block-grid--areas-row-gap, 0);
}
.umb-block-grid__area {
    position: relative;
    height: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    grid-column-end: span min(var(--umb-block-grid--area-column-span, 1), var(--umb-block-grid--area-grid-columns, var(--umb-block-grid--grid-columns, 1)));
    grid-row: span var(--umb-block-grid--area-row-span, 1);
}

/*
 * Shared layout gap / column split (twoColumn, contentPlusSidebar, etc.).
 * Loaded on Platform / Sale / site masters so old issuer sheets (mkr, etc.)
 * still get gaps without copying rules into every brand CSS.
 * Medium ≈ former Tailwind gap-6. Unset gap in Razor maps to --md.
 */
.ic-layout-row.ic-cols {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .ic-layout-row.ic-cols--equal {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .ic-layout-row.ic-cols--narrow-left {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    }
    .ic-layout-row.ic-cols--narrow-right {
        grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    }
    .ic-layout-row.ic-cols--soft-left {
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    }
    .ic-layout-row.ic-cols--soft-right {
        grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    }
}

/* Content + Sidebar default = Medium when layout settings omit an explicit gap. */
.sidebarPlusContent {
    gap: 1.5rem;
}

.ic-col-gap--none { gap: 0; }
.ic-col-gap--sm { gap: 0.75rem; }
.ic-col-gap--md { gap: 1.5rem; }
.ic-col-gap--lg { gap: 2.5rem; }
.ic-col-gap--xl { gap: 4rem; }