.wp-block-mytheme-grid {
    position: relative;
    /*
    &.gridded {
        $updown: 2rem;
        $sides: 1rem;
        --border: 2px solid currentColor;
        border: var(--border);
        > * {
            position: static;
            padding: $sides $updown;
            // Vertical lines
            &:nth-child(2),
            &:nth-child(3) {
                &::before {
                    content: "";
                    display: block;
                    border-right: var(--border);
                    position: absolute;
                    top: 0;
                    bottom: 0;
                    margin-left: -$updown;
                }
            }

            // Horizontal lines
            &:nth-child(3n + 4) {
                &::before {
                    content: "";
                    display: block;
                    border-top: var(--border);
                    position: absolute;
                    left: 0;
                    right: 0;
                    margin-top: -$sides;
                }
            }
        }

        @media (max-width: 760px) {
            $updown: 1rem;
            $sides: 0.5rem;
            > * {
                padding: $sides $updown;
                &:nth-child(2),
                &:nth-child(3) {
                    &::before {
                        margin-left: -$updown;
                    }
                }
                &:nth-child(3n + 4) {
                    &::before {
                        margin-top: -$sides;
                    }
                }
            }
        }
    }
    */
}
.wp-block-mytheme-grid > * {
    box-sizing: border-box;
}
.wp-block-mytheme-grid:not([class*="is-style"]),
.wp-block-mytheme-grid.is-style-default {
    display: grid;
    border-style: none;
    grid-template-columns: repeat(var(--mytheme-columns), minmax(0, 1fr));
    gap: var(--mytheme-row-gap, 1rem) var(--mytheme-column-gap, 1rem);
}
@media (max-width: 760px) {
    .wp-block-mytheme-grid:not([class*="is-style"]),
    .wp-block-mytheme-grid.is-style-default {
        grid-template-columns: repeat(var(--mytheme-mobile-columns), minmax(0, 1fr));
    }
}
@media (max-width: 760px) {
    .wp-block-mytheme-grid:not([class*="is-style"]),
    .wp-block-mytheme-grid.is-style-default {
        gap: var(--mytheme-mobile-row-gap, var(--mytheme-row-gap, 1rem))
            var(--mytheme-mobile-column-gap, var(--mytheme-column-gap, 1rem));
    }
}
.wp-block-mytheme-grid.is-style-flexed {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.wp-block-mytheme-grid.is-style-flexed > * {
    box-sizing: border-box;
    flex: 0 0 calc(100% / var(--mytheme-columns));
    padding: var(--mytheme-row-gap, 1rem) var(--mytheme-column-gap, 1rem);
}
@media (max-width: 760px) {
    .wp-block-mytheme-grid.is-style-flexed > * {
        flex: 0 0 calc(100% / var(--mytheme-mobile-columns));
        padding: var(--mytheme-mobile-row-gap, var(--mytheme-row-gap, 1rem))
            var(--mytheme-mobile-column-gap, var(--mytheme-column-gap, 1rem));
    }
}
.wp-block-mytheme-grid.is-style-boxed {
    display: grid;
    border-style: none;
    grid-template-columns: repeat(var(--mytheme-columns), minmax(0, 1fr));
}
@media (max-width: 760px) {
    .wp-block-mytheme-grid.is-style-boxed {
        grid-template-columns: repeat(var(--mytheme-mobile-columns), minmax(0, 1fr));
    }
}
@media (min-width: 761px) {
    .wp-block-mytheme-grid.is-style-boxed {
        border-top: var(--mytheme-border-width, 1px) var(--mytheme-border-style, solid)
            var(--mytheme-border-color, currentColor);
        border-left: var(--mytheme-border-width, 1px) var(--mytheme-border-style, solid)
            var(--mytheme-border-color, currentColor);
    }
    .wp-block-mytheme-grid.is-style-boxed > * {
        position: static;
        padding: var(--mytheme-cell-padding-top, 1rem) var(--mytheme-cell-padding-right, 1rem)
            var(--mytheme-cell-padding-bottom, 1rem) var(--mytheme-cell-padding-left, 1rem);
        border-right: var(--mytheme-border-width, 1px) var(--mytheme-border-style, solid)
            var(--mytheme-border-color, currentColor);
        border-bottom: var(--mytheme-border-width, 1px) var(--mytheme-border-style, solid)
            var(--mytheme-border-color, currentColor);
    }
}
@media (max-width: 760px) {
    .wp-block-mytheme-grid.is-style-boxed {
        border-top: var(--mytheme-mobile-border-width, 1px) var(--mytheme-mobile-border-style, solid)
            var(--mytheme-mobile-border-color, currentColor);
        border-left: var(--mytheme-mobile-border-width, 1px) var(--mytheme-mobile-border-style, solid)
            var(--mytheme-mobile-border-color, currentColor);
    }
    .wp-block-mytheme-grid.is-style-boxed > * {
        position: static;
        padding: var(--mytheme-mobile-cell-padding-top, 1rem)
            var(--mytheme-mobile-cell-padding-right, 1rem)
            var(--mytheme-mobile-cell-padding-bottom, 1rem)
            var(--mytheme-mobile-cell-padding-left, 1rem);
        border-right: var(--mytheme-mobile-border-width, 1px)
            var(--mytheme-mobile-border-style, solid) var(--mytheme-mobile-border-color, currentColor);
        border-bottom: var(--mytheme-mobile-border-width, 1px)
            var(--mytheme-mobile-border-style, solid) var(--mytheme-mobile-border-color, currentColor);
    }
}
