/* Shared by the public, student and admin shells. Keep action spacing on
   the container so wrapped rows and right-to-left layouts stay consistent. */
:root {
    --action-spacing: 12px;
}

/* Only infer action rows when every child is an action. Exclude navigation,
   segmented controls, editor controls and input groups. */
:is(div, section, footer, form):has(> :is(button, a.btn, a.a-button, a.ds-button) + :is(button, a.btn, a.a-button, a.ds-button)):not(:has(> :not(button, a.btn, a.a-button, a.ds-button))):not(:where(
    .btn-group, .btn-group-vertical, .input-group, .pagination,
    .nav, .nav-tabs, .nav-pills, .a-tabs, .tabs, .langs,
    .settings-tabs, .password-actions, [role="tablist"], [role="toolbar"],
    .ck *, .ql-toolbar *, nav *, [role="tablist"] *, [role="toolbar"] *
)) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--action-spacing) !important;
}

/* The cookie banner has both Blade and Vue implementations. */
#cookie-consent-popup .cookie-actions,
.cookie-card .cookie-actions,
.admin-ds .cookie-preview .cookie-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--action-spacing) !important;
}

#cookie-consent-popup .cookie-actions > button,
.cookie-card .cookie-actions > button {
    min-width: 0;
    max-width: 100%;
    margin: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Inline actions can also follow descriptive text, a heading or a field.
   These parents must keep their block layout rather than becoming flex rows. */
:is(div, section, footer, form, p, td):has(> :not(button, a.btn, a.a-button, a.ds-button)):not(:where(
    .btn-group, .btn-group-vertical, .input-group, .pagination,
    .nav, .nav-tabs, .nav-pills, .a-tabs, .tabs, .langs,
    .settings-tabs, .password-actions, [role="tablist"], [role="toolbar"],
    .ck *, .ql-toolbar *, nav *, [role="tablist"] *, [role="toolbar"] *
)) > :is(button, a.btn, a.a-button, a.ds-button) + :is(button, a.btn, a.a-button, a.ds-button) {
    margin-inline-start: var(--action-spacing);
}