/* Editor column layouts (TipTap data-columns / data-column) */
[data-flux-editor] .ProseMirror [data-columns],
.blog-content [data-columns],
.fullpage-content [data-columns] {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: 1fr;
    margin: 1rem 0;
    width: 100%;
    align-items: start;
}

@media (min-width: 768px) {
    [data-flux-editor] .ProseMirror [data-columns="2"],
    .blog-content [data-columns="2"],
    .fullpage-content [data-columns="2"] {
        grid-template-columns: 1fr 1fr;
    }

    [data-flux-editor] .ProseMirror [data-columns="3"],
    .blog-content [data-columns="3"],
    .fullpage-content [data-columns="3"] {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

[data-flux-editor] .ProseMirror [data-column],
.blog-content [data-column],
.fullpage-content [data-column] {
    min-width: 0;
}

/* Visible column guides while editing */
[data-flux-editor] .ProseMirror [data-column] {
    border: 1px dashed color-mix(in oklab, currentColor 20%, transparent);
    border-radius: 0.375rem;
    padding: 0.5rem;
    cursor: text;
}

[data-flux-editor] .ProseMirror [data-column][data-active],
[data-flux-editor] .ProseMirror [data-column]:focus-within {
    border-color: color-mix(in oklab, currentColor 45%, transparent);
    background: color-mix(in oklab, currentColor 4%, transparent);
}

[data-flux-editor] .ProseMirror [data-column-content] {
    min-width: 0;
}

[data-flux-editor] .ProseMirror [data-column] > :first-child,
[data-flux-editor] .ProseMirror [data-column-content] > :first-child {
    margin-top: 0;
}

[data-flux-editor] .ProseMirror [data-column] > :last-child,
[data-flux-editor] .ProseMirror [data-column-content] > :last-child {
    margin-bottom: 0;
}
