.BodyBlock {
    --gap-base: 88px;
    padding: var(--gap-base) 0;

    @media all and (max-width: 700px) {
        --gap-base: 56px;
    }

    /* A photo viewing block: it stays dark in both themes (it carries data-theme="dark") */
    &.dark {
        background: var(--color-bg);
        color: var(--color-text);
    }

    &.outlined {
        border-top: solid var(--color-border-subtle) 1px;
        border-bottom: solid var(--color-border-subtle) 1px;

        &+.outlined {
            margin-top: var(--gap-base);
        }
    }

    &.footer {
        border-top: solid var(--color-border-subtle) 1px;
        padding: 48px 0;
    }

    &:has(.tabSet) {
        /* Make top padding smaller when the block has a tabset so the position: sticky of the tabSet has also some padding on top */
        padding-top: calc(var(--gap-base) - 30px);
    }
}

.BodyBlock:not(.outlined,.dark,.footer) + .BodyBlock:not(.outlined,.dark,.footer) {
    padding-top: 0;
}
