/*
 * BygMak shell-v1 — låst fælles desktopskal.
 * Denne fil ejer placering, mål, farver og states for side-menu,
 * context-menu, page-menu og fælles komponenter. Sidespecifik CSS må kun
 * style indholdet i page-content. Se DESIGN-SYSTEM.md.
 */
:root {
    --bm-side-menu-width: 58px;
    --bm-side-menu-expanded-width: 218px;
    --bm-context-menu-height: 42px;
    --bm-page-menu-height: 42px;
    --bm-shell-gap: 6px;
    --bm-page-content-inset: 8px;
    --bm-page-content-height: calc(100vh - var(--bm-context-menu-height) - var(--bm-page-menu-height) - var(--bm-shell-gap) - var(--bm-page-content-inset));
    --bm-control-height: 30px;
    --bm-project-action-height: var(--bm-control-height);
    --bm-control-gap: 6px;
    --bm-control-padding-x: 11px;
    --bm-control-bg: var(--bygmak-shell-control);
    --bm-control-border: var(--bygmak-shell-control-border);
    --bm-control-hover-bg: var(--bygmak-shell-control-hover);
    --bm-control-active-bg: var(--bygmak-shell-control-active);
    --bm-control-active-text: var(--bygmak-shell-control-active-text);
    --bm-control-danger: var(--bygmak-danger);
    --bm-control-danger-bg: var(--bygmak-danger-soft);
    --bm-control-success: var(--bygmak-success);
    --bm-control-success-bg: var(--bygmak-success-soft);
    --bm-data-header-height: 30px;
    --bm-data-header-padding-x: 8px;
    --bm-data-header-content-gap: 5px;
    --bm-data-header-bg: var(--bygmak-shell-data-header);
    --bm-data-header-text: var(--bygmak-shell-data-header-text);
    --bm-data-row-gap: 4px;
    --bm-data-row-radius: 2px;
    --bm-box-border-width: 1px;
    --bm-mini-header-overlap: var(--bm-box-border-width);
    --bm-box-border-color: var(--bygmak-shell-box-border);
    --bm-box-radius: 2px;
    --bm-box-gap: 6px;
    --bm-layout-card-gap: var(--bm-box-gap);
    --bm-content-box-padding: 10px;
    --bm-mini-header-height: 30px;
    --bm-mini-header-bg: var(--bygmak-shell-mini-header);
    --bm-side-menu-bg: var(--bygmak-shell-side-menu);
    --bm-context-menu-bg: var(--bygmak-shell-context-menu);
    --bm-page-menu-bg: var(--bygmak-shell-page-menu);
    --bm-menu-surface: var(--bygmak-shell-control);
    --bm-menu-border: var(--bygmak-border);
    --bm-menu-border-strong: var(--bygmak-border-strong);
    --bm-menu-text: var(--bygmak-text);
    --bm-menu-muted: var(--bygmak-muted);
    --bm-menu-active: var(--bygmak-primary);
    --bm-menu-active-bg: var(--bygmak-primary-soft);
    --bm-menu-radius: var(--bygmak-radius);
    --bm-menu-font-size: 12px;
    --bm-form-label-font-size: 11px;
    --bm-form-label-font-weight: 700;
    --bm-form-control-font-size: 12px;
    --bm-form-control-font-weight: 400;
    --bm-form-text-line-height: 1.2;
}

body[data-bygmak-ui],
body[data-bygmak-ui] :is(button, input, select, textarea) {
    font-family: var(--bygmak-font-family) !important;
}

.customer-admin-dialog {
    width: min(860px, calc(100vw - 24px));
    height: min(760px, calc(100vh - 24px));
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--bm-menu-border-strong);
    border-radius: var(--bm-menu-radius);
    box-shadow: 0 18px 48px rgba(20, 28, 36, .3);
}

.customer-admin-dialog::backdrop { background: rgba(20, 28, 36, .42); }
.customer-admin-dialog iframe { width: 100%; height: 100%; border: 0; background: #f6f8fa; }

/* Desktopskallen er den eneste appskal. Smalle visninger får samme venstremenu;
 * en særskilt mobilskal bygges senere. */
@media screen {
    body[data-bygmak-ui] > .side-menu {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 1000;
        display: flex;
        width: var(--bm-side-menu-width);
        min-height: 100vh;
        padding: 8px 7px;
        flex-direction: column;
        align-items: stretch;
        gap: var(--bm-shell-gap);
        overflow: hidden;
        border: 0;
        border-right: 1px solid var(--bm-menu-border);
        background: var(--bm-side-menu-bg);
        box-shadow: 3px 0 12px color-mix(in srgb, var(--bygmak-primary) 28%, transparent);
        transition: width 180ms ease, box-shadow 180ms ease;
    }

    body[data-bygmak-ui] > .side-menu:hover,
    body[data-bygmak-ui] > .side-menu:focus-within {
        width: var(--bm-side-menu-expanded-width);
        box-shadow: 5px 0 16px color-mix(in srgb, var(--bygmak-primary) 34%, transparent);
    }

    .side-menu .side-menu-start,
    .side-menu .brand,
    .side-menu .main-nav,
    .side-menu .top-actions {
        width: 100%;
        min-width: 0;
    }

    .side-menu .brand,
    .side-menu .main-nav a,
    .side-menu .rail-link {
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 10px;
        align-items: center;
        overflow: hidden;
    }

    .side-menu .brand,
    .side-menu .brand small,
    .side-menu .main-nav a,
    .side-menu .rail-link,
    .side-menu .nav-icon {
        color: #ffffff;
    }

    .side-menu .brand {
        height: 44px;
    }

    .side-menu .brand-mark {
        width: 42px;
        height: 42px;
    }

    .side-menu .brand-mark-logo {
        position: relative;
        background: transparent;
        border: 0;
        overflow: hidden;
    }

    .side-menu .brand-logo-frame {
        position: absolute;
        inset: 0;
        display: grid;
        place-items: center;
        opacity: 0;
        animation: bm-brand-frame 40s linear infinite;
        pointer-events: none;
    }

    .side-menu .brand-logo-art {
        display: block;
        width: 38px;
        aspect-ratio: var(--bm-brand-crop-ratio);
        background-repeat: no-repeat;
        background-size: var(--bm-brand-crop-size) auto;
        background-position: var(--bm-brand-crop-position);
        filter: brightness(0) invert(1);
    }

    /* Each crop isolates one original box; the calendar includes its projecting check mark. */
    .side-menu .brand-logo-ruler {
        opacity: 1;
        --bm-brand-crop-ratio: 436 / 430;
        --bm-brand-crop-size: 293.577982%;
        --bm-brand-crop-position: 22.393365% 26.352941%;
    }

    .side-menu .brand-logo-list {
        animation-delay: -30s;
        --bm-brand-crop-ratio: 435 / 430;
        --bm-brand-crop-size: 294.252874%;
        --bm-brand-crop-position: 74.674556% 26.352941%;
    }

    .side-menu .brand-logo-document {
        animation-delay: -20s;
        --bm-brand-crop-ratio: 444 / 440;
        --bm-brand-crop-size: 288.288288%;
        --bm-brand-crop-position: 21.770335% 78.333333%;
    }

    .side-menu .brand-logo-calendar {
        animation-delay: -10s;
        --bm-brand-crop-ratio: 551 / 449;
        --bm-brand-crop-size: 232.304900%;
        --bm-brand-crop-position: 86.556927% 79.181709%;
    }

    @keyframes bm-brand-frame {
        0%, 20% { opacity: 1; }
        25%, 95% { opacity: 0; }
        100% { opacity: 1; }
    }

    @media (prefers-reduced-motion: reduce) {
        .side-menu .brand-logo-frame { animation: none; opacity: 0; }
        .side-menu .brand-logo-ruler { opacity: 1; }
    }

    .side-menu .brand-copy,
    .side-menu .nav-label {
        min-width: 0;
        opacity: 0;
        color: #ffffff !important;
        white-space: nowrap;
        transition: opacity 100ms ease;
    }

    .side-menu:hover :is(.brand-copy, .nav-label),
    .side-menu:focus-within :is(.brand-copy, .nav-label) {
        opacity: 1;
        transition-delay: 70ms;
    }

    .side-menu .main-nav,
    .side-menu .top-actions {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 3px;
        align-items: stretch;
    }

    .side-menu .main-nav {
        margin-top: var(--bm-page-menu-height);
        min-height: 0;
        overflow-y: auto;
        flex-shrink: 1;
    }

    .side-menu .main-nav > [data-main-nav-key] {
        flex-shrink: 0;
        user-select: none;
        -webkit-user-drag: none;
    }

    .side-menu .nav-section-divider {
        display: flex;
        height: 18px;
        align-items: center;
        cursor: grab;
    }

    .side-menu .nav-section-divider::before {
        content: '';
        width: 100%;
        border-top: 1px solid rgba(255, 255, 255, 0.24);
    }

    .side-menu .nav-section-divider:focus-visible {
        outline: 1px solid #ffffff;
        outline-offset: -1px;
    }

    .side-menu .main-nav .is-dragging {
        opacity: .55;
        outline: 1px dashed #ffffff;
        cursor: grabbing;
    }

    body[data-bygmak-ui] > .side-menu.is-reordering {
        width: var(--bm-side-menu-expanded-width);
        cursor: grabbing;
    }

    .side-menu.is-reordering .nav-label {
        opacity: 1;
    }

    .side-menu .main-nav a,
    .side-menu .rail-link {
        width: 100%;
        min-width: 0;
        min-height: 42px;
        padding: 0;
        border: 1px solid transparent;
        border-radius: var(--bm-menu-radius);
        background: transparent !important;
        color: #ffffff !important;
        font-size: var(--bm-menu-font-size);
        font-weight: 700;
        text-align: left;
        white-space: nowrap;
        cursor: pointer;
    }

    .side-menu :is(.main-nav a, .rail-link):is(:hover, .is-active) {
        border-color: rgba(255, 255, 255, 0.42);
        background: rgba(255, 255, 255, 0.16);
        color: #ffffff;
    }

    .side-menu .nav-icon {
        display: grid !important;
        width: 42px;
        height: 40px;
        place-items: center !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }

    .side-menu .nav-icon svg {
        width: 26px;
        height: 26px;
        color: inherit;
        stroke: currentColor;
    }

    .side-menu .nav-new-task .nav-icon svg {
        width: 22px;
        height: 22px;
        stroke-width: 2.5;
    }

    .side-menu .side-menu-utilities {
        flex: 1 1 auto;
        padding-top: var(--bm-shell-gap);
        justify-content: flex-end;
        border-top: 0;
    }

    .side-menu .side-menu-utilities.has-master {
        border-top: 1px solid rgba(255, 255, 255, 0.24);
    }

    .side-menu .side-menu-utilities .rail-link {
        min-height: 42px !important;
        padding: 0 !important;
        border-color: transparent !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }

    .side-menu .side-menu-utilities .rail-link:hover,
    .side-menu .side-menu-utilities .rail-link:focus-visible {
        background: rgba(255, 255, 255, 0.12) !important;
    }

    .side-menu .rail-settings {
        margin-top: auto;
    }

    body[data-bygmak-ui] > .context-menu {
        position: fixed;
        inset: 0 0 auto var(--bm-side-menu-width);
        z-index: 800;
        display: flex;
        height: var(--bm-context-menu-height);
        padding: 0 12px;
        align-items: center;
        gap: var(--bm-shell-gap);
        border-bottom: 1px solid var(--bm-menu-border);
        background: var(--bm-context-menu-bg);
        color: var(--bm-menu-text);
    }

    .context-menu-title {
        overflow: hidden;
        font-size: 13px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .context-menu .project-context-tabs {
        display: flex;
        height: 30px;
        margin-left: 12px;
        align-items: center;
        gap: 3px;
    }

    .context-menu.has-project-navigation {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    }

    .context-menu.has-project-navigation > .context-menu-title {
        grid-column: 1;
        min-width: 0;
    }

    .context-menu.has-project-navigation > .project-context-tabs {
        grid-column: 2;
        margin-left: 0;
    }

    .context-menu.has-project-navigation > .context-menu-account {
        grid-column: 3;
        justify-self: end;
        margin-left: 0;
    }

    .context-menu .project-context-tabs .workspace-tab {
        display: inline-flex;
        box-sizing: border-box;
        height: 28px;
        min-height: 28px;
        padding: 0 11px;
        align-items: center;
        justify-content: center;
        gap: 5px;
        border: 1px solid transparent;
        border-radius: var(--bm-menu-radius);
        background: transparent;
        color: var(--bm-menu-muted);
        font-size: var(--bm-menu-font-size);
        font-weight: 700;
        line-height: 1;
        text-decoration: none;
    }

    .context-menu .project-context-tabs .workspace-tab svg {
        width: 18px;
        height: 18px;
        flex: 0 0 auto;
        stroke-width: 2;
    }

    .context-menu .project-context-tabs .workspace-tab:hover {
        border-color: var(--bm-control-border);
        background: var(--bm-control-hover-bg);
        color: var(--bm-menu-active);
    }

    .context-menu .project-context-tabs .workspace-tab.is-active {
        border-color: var(--bm-menu-active);
        background: var(--bm-control-active-bg);
        color: var(--bm-control-active-text);
    }

    .context-menu .workspace-calculation-shortcuts {
        position: relative;
        display: flex;
        height: 28px;
        align-items: center;
    }

    .context-menu .workspace-tool-links {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1;
        display: grid;
        min-width: 215px;
        padding: 5px;
        border: 1px solid var(--bm-menu-border);
        border-radius: var(--bm-menu-radius);
        background: var(--bm-menu-surface);
        box-shadow: 0 6px 18px rgba(20, 28, 36, .16);
        visibility: hidden;
    }

    .context-menu .workspace-calculation-shortcuts:is(:hover, :focus-within) .workspace-tool-links {
        visibility: visible;
    }

    .context-menu .workspace-tool-links a {
        display: block;
        padding: 9px 10px;
        border-radius: var(--bm-menu-radius);
        color: var(--bm-menu-text);
        font-size: var(--bm-menu-font-size);
        font-weight: 600;
        text-decoration: none;
        white-space: nowrap;
    }

    .context-menu .workspace-tool-links a:is(:hover, :focus-visible) {
        background: var(--bm-control-hover-bg);
        color: var(--bm-menu-active);
    }

    .context-menu-account {
        display: flex;
        min-width: 0;
        margin-left: auto;
        align-items: center;
        gap: 8px;
        color: var(--bm-menu-muted);
        font-size: var(--bm-menu-font-size);
        white-space: nowrap;
    }

    .context-menu-account > span {
        overflow: hidden;
        max-width: 280px;
        text-overflow: ellipsis;
    }

    .context-menu-account > strong {
        display: grid;
        width: 26px;
        height: 26px;
        place-items: center;
        border: 1px solid var(--bm-menu-border-strong);
        border-radius: 50%;
        background: var(--bm-page-menu-bg);
        color: var(--bm-menu-text);
        font-size: 10px;
    }

    body[data-bygmak-ui] > .page-menu {
        position: fixed;
        inset: var(--bm-context-menu-height) 0 auto var(--bm-side-menu-width);
        z-index: 790;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        height: var(--bm-page-menu-height);
        margin: 0 !important;
        padding: 5px 8px;
        align-items: center;
        gap: var(--bm-shell-gap);
        border: 0;
        border-bottom: 1px solid var(--bm-menu-border);
        border-radius: 0;
        background: var(--bm-page-menu-bg) !important;
        box-shadow: none;
    }

    body[data-bygmak-ui].calculate-page > .page-menu:has(.calculation-version-dropdown[open]) {
        z-index: 1100;
    }

    .page-menu :is(.page-menu-left, .page-menu-center, .page-menu-right) {
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        align-items: center;
        gap: var(--bm-shell-gap);
    }

    .page-menu-center { justify-content: center; }
    .page-menu-right { justify-content: flex-end; }

    .page-menu .workspace-primary-actions {
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        align-items: center;
        gap: var(--bm-shell-gap);
    }

    .page-menu .page-menu-summary {
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        align-items: center;
        justify-content: flex-end;
        gap: 16px;
        color: var(--bm-menu-muted);
        font-size: var(--bm-menu-font-size);
        white-space: nowrap;
    }

    .page-menu .page-menu-summary span {
        display: inline-flex;
        align-items: baseline;
        gap: 5px;
    }

    .page-menu .page-menu-summary strong {
        color: var(--bm-menu-text);
        font-weight: 700;
    }

    .page-menu .calendar-page-month {
        color: var(--bm-menu-text);
        font-size: var(--bm-menu-font-size);
        font-weight: 700;
        white-space: nowrap;
    }

    .page-menu :is(button, .workspace-button, .btn, input, select) {
        box-sizing: border-box;
        height: var(--bm-control-height);
        min-height: var(--bm-control-height);
        max-height: var(--bm-control-height);
        border-radius: var(--bm-menu-radius);
        font-size: var(--bm-menu-font-size);
    }

    .page-menu :is(button, .workspace-button, .btn) {
        display: inline-flex;
        padding: 0 var(--bm-control-padding-x);
        align-items: center;
        justify-content: center;
        gap: var(--bm-control-gap);
        border: 1px solid var(--bm-control-border);
        background: var(--bm-control-bg);
        color: var(--bm-menu-text);
        box-shadow: none;
        font-weight: 700;
        line-height: 1;
        cursor: pointer;
        text-decoration: none;
    }

    .page-menu :is(button, .workspace-button, .btn) svg {
        width: 16px;
        height: 16px;
        flex: 0 0 auto;
        color: inherit;
        stroke: currentColor;
    }

    .page-menu :is(button, .workspace-button, .btn):hover {
        border-color: var(--bm-menu-active);
        background: var(--bm-control-hover-bg);
        color: var(--bm-menu-active);
    }

    .page-menu :is(button, .workspace-button, .btn):is(.is-active, [aria-pressed="true"]),
    .page-menu .segmented-control > .is-active {
        border-color: var(--bm-menu-active);
        background: var(--bm-control-active-bg);
        color: var(--bm-control-active-text);
    }

    .page-menu :is(button, .workspace-button, .btn):disabled {
        cursor: not-allowed;
        opacity: .5;
    }

    /* shell-v1 action-kontrakt: funktionel markup kan genbruges på alle sider. */
    .page-menu :is(
        .action-back,
        .action-create,
        .action-save,
        .action-pdf,
        .action-download,
        .action-more,
        .action-delete,
        .action-reset
    ) {
        display: inline-flex;
        box-sizing: border-box;
        height: var(--bm-control-height);
        min-height: var(--bm-control-height);
        padding: 0 var(--bm-control-padding-x);
        align-items: center;
        justify-content: center;
        gap: var(--bm-control-gap);
        border: 1px solid var(--bm-control-border);
        border-radius: var(--bm-menu-radius);
        background: var(--bm-control-bg);
        color: var(--bm-menu-text);
        font-size: var(--bm-menu-font-size);
        font-weight: 700;
        line-height: 1;
        text-decoration: none;
    }

    .page-menu :is(.action-create, .action-save) {
        border-color: var(--bm-menu-active);
        background: var(--bm-control-active-bg);
        color: var(--bm-control-active-text);
    }

    .page-menu :is(.action-create, .action-save):hover {
        border-color: var(--bm-menu-active);
        background: color-mix(in srgb, var(--bm-control-active-bg) 88%, #000000);
        color: var(--bm-control-active-text);
    }

    .page-menu :is(.action-delete, .action-reset) {
        border-color: color-mix(in srgb, var(--bm-control-danger) 45%, #ffffff);
        background: var(--bm-control-danger-bg);
        color: var(--bm-control-danger);
    }

    .page-menu :is(.action-delete, .action-reset):hover {
        border-color: var(--bm-control-danger);
        background: var(--bm-control-danger);
        color: #ffffff;
    }

    .page-menu-right :is(.action-delete, .action-reset):first-child,
    .page-menu-right :not(.action-delete, .action-reset) + :is(.action-delete, .action-reset) {
        margin-left: var(--bm-control-gap);
    }

    .page-menu :is(
        .action-back,
        .action-create,
        .action-save,
        .action-pdf,
        .action-download,
        .action-more,
        .action-delete,
        .action-reset
    ):is(:disabled, [aria-disabled="true"]) {
        cursor: not-allowed;
        opacity: .5;
        pointer-events: none;
    }

    .page-menu :is(
        .action-back,
        .action-create,
        .action-save,
        .action-pdf,
        .action-download,
        .action-more,
        .action-delete,
        .action-reset
    )[aria-busy="true"] {
        cursor: progress;
        opacity: .72;
        pointer-events: none;
    }

    .page-menu :is(
        .action-back,
        .action-create,
        .action-save,
        .action-pdf,
        .action-download,
        .action-more
    ).is-success {
        border-color: var(--bm-control-success);
        background: var(--bm-control-success-bg);
        color: var(--bm-control-success);
    }

    .page-menu .action-search {
        position: relative;
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        align-items: center;
        color: var(--bm-menu-muted);
    }

    .page-menu .action-search > :is(svg, i) {
        position: absolute;
        left: 10px;
        z-index: 1;
        width: 16px;
        height: 16px;
        color: inherit;
        pointer-events: none;
    }

    .page-menu .action-search > input[type="search"] {
        width: min(430px, 38vw);
        padding-right: 32px;
        padding-left: 34px;
        border: 1px solid var(--bm-control-border);
        background: var(--bm-control-bg);
        color: var(--bm-menu-text);
    }

    .page-menu .action-search > button {
        position: absolute;
        right: 3px;
        width: 24px;
        min-width: 24px;
        padding: 0;
        border: 0;
        background: transparent;
    }

    .page-menu .page-menu-filter-form {
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        margin: 0;
        align-items: center;
        justify-content: center;
        gap: var(--bm-control-gap);
        flex-wrap: nowrap;
    }

    .page-menu .page-menu-filter-form > label:not(.action-search) {
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        align-items: center;
    }

    .page-menu .page-menu-filter-form input:not(.task-search-input),
    .page-menu .page-menu-filter-form select {
        padding: 0 8px;
        border: 1px solid var(--bm-control-border);
        background: var(--bm-control-bg);
        color: var(--bm-menu-text);
    }

    .page-menu .page-menu-filter-form .page-menu-status-filter {
        width: 154px;
    }

    .page-menu .segmented-control {
        display: inline-flex;
        height: var(--bm-control-height);
        overflow: hidden;
        border-radius: var(--bm-menu-radius);
    }

    .page-menu .segmented-control > :is(button, a) {
        box-sizing: border-box;
        display: inline-flex;
        height: var(--bm-control-height) !important;
        min-height: var(--bm-control-height) !important;
        max-height: var(--bm-control-height) !important;
        margin: 0;
        padding: 0 var(--bm-control-padding-x) !important;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--bm-control-border) !important;
        border-radius: 0 !important;
        background: var(--bm-control-bg) !important;
        color: var(--bm-menu-text) !important;
        box-shadow: none !important;
        font: 700 var(--bm-menu-font-size)/1 "Open Sans", Arial, sans-serif !important;
        text-decoration: none !important;
        white-space: nowrap;
    }

    .page-menu .segmented-control > :is(button, a):not(:first-child) {
        margin-left: -1px;
    }

    .page-menu .segmented-control > :is(button, a):first-child {
        border-radius: var(--bm-menu-radius) 0 0 var(--bm-menu-radius) !important;
    }

    .page-menu .segmented-control > :is(button, a):last-child {
        border-radius: 0 var(--bm-menu-radius) var(--bm-menu-radius) 0 !important;
    }

    .page-menu .segmented-control > :is(button, a):hover {
        position: relative;
        border-color: var(--bm-menu-active) !important;
        background: var(--bm-control-hover-bg) !important;
        color: var(--bm-menu-active) !important;
    }

    .page-menu .segmented-control > :is(button, a).is-active {
        position: relative;
        z-index: 1;
        border-color: var(--bm-menu-active) !important;
        background: var(--bm-control-active-bg) !important;
        color: var(--bm-control-active-text) !important;
    }

    .page-menu .overview-toolbar-controls {
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        align-items: center;
        justify-content: center;
        gap: var(--bm-shell-gap);
        flex-wrap: nowrap;
    }

    .page-menu .overview-owner-filter {
        display: flex;
        min-width: 0;
        height: var(--bm-control-height);
        align-items: center;
    }

    .page-menu .overview-owner-filter select {
        width: auto;
        min-width: 0;
        max-width: none;
        field-sizing: content;
        padding: 0 30px 0 10px;
        border: 1px solid var(--bm-control-border);
        background: var(--bm-control-bg);
        color: var(--bm-menu-text);
    }

    .page-menu .page-menu-select {
        display: inline-flex;
        height: var(--bm-control-height) !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: center;
        border: 0 !important;
        background: transparent !important;
    }

    .page-menu .page-menu-select select {
        box-sizing: border-box;
        width: auto;
        min-width: 58px;
        height: var(--bm-control-height) !important;
        min-height: var(--bm-control-height) !important;
        max-height: var(--bm-control-height) !important;
        margin: 0;
        padding: 0 30px 0 10px !important;
        border: 1px solid var(--bm-control-border) !important;
        border-radius: var(--bm-menu-radius) !important;
        background: var(--bm-control-bg) !important;
        color: var(--bm-menu-text) !important;
        font: 700 var(--bm-menu-font-size)/1 "Open Sans", Arial, sans-serif !important;
    }

    .page-menu .task-workspace-status select { width: 150px; }

    .page-menu .task-search-wrap {
        position: relative;
        width: min(430px, 38vw);
        max-width: none;
    }

    .page-menu .task-search-input {
        width: 100%;
        padding-right: 32px !important;
        padding-left: 34px !important;
        border: 1px solid var(--bm-control-border);
        background: var(--bm-control-bg);
        color: var(--bm-menu-text);
    }

    .page-menu .task-search-icon {
        position: absolute;
        top: 50%;
        left: 10px;
        z-index: 1;
        display: grid;
        width: 16px;
        height: 16px;
        transform: translateY(-50%);
        place-items: center;
        color: var(--bm-menu-muted);
        pointer-events: none;
    }

    .page-menu .task-search-icon svg {
        width: 16px;
        height: 16px;
    }

    .page-menu .task-search-clear {
        position: absolute;
        top: 50%;
        right: 3px;
        width: 24px;
        min-width: 24px;
        padding: 0;
        transform: translateY(-50%);
        border: 0;
        background: transparent;
    }

    body[data-bygmak-ui] .data-table-header {
        box-sizing: border-box;
        position: relative;
        display: grid !important;
        grid-template-columns: var(--bm-data-header-columns, auto minmax(0, 1fr) auto);
        width: 100%;
        height: var(--bm-data-header-height) !important;
        min-height: var(--bm-data-header-height) !important;
        max-height: var(--bm-data-header-height) !important;
        padding: 0 var(--bm-data-header-padding-x) !important;
        align-items: center;
        border: 1px solid var(--bm-menu-border) !important;
        border-radius: var(--bm-menu-radius) !important;
        background: var(--bm-data-header-bg) !important;
        color: var(--bm-data-header-text) !important;
        box-shadow: none !important;
        font-family: "Open Sans", Arial, sans-serif;
        font-size: var(--bm-menu-font-size);
        font-weight: 700;
        line-height: 1;
    }

    body[data-bygmak-ui] .content-box.content-box {
        box-sizing: border-box;
        border: var(--bm-box-border-width) solid var(--bm-box-border-color) !important;
        border-radius: var(--bm-box-radius) !important;
        background: #ffffff !important;
        box-shadow: none !important;
    }

    /* Fælles topniveau for sidekort. Siden vælger layoutet; systemet ejer afstanden. */
    body[data-bygmak-ui] :is(.layout-card-grid, .layout-card-stack) {
        gap: var(--bm-layout-card-gap) !important;
    }

    body[data-bygmak-ui] .layout-card.layout-card {
        box-sizing: border-box;
        min-width: 0;
        min-height: 0;
    }

    body[data-bygmak-ui] .content-box.content-box:has(> .mini-header) {
        padding: 0 !important;
        overflow: visible !important;
    }

    body[data-bygmak-ui] .mini-header.mini-header.mini-header {
        box-sizing: border-box;
        display: flex;
        flex: 0 0 auto;
        width: calc(100% + (2 * var(--bm-mini-header-overlap)));
        min-height: var(--bm-mini-header-height) !important;
        margin: calc(-1 * var(--bm-mini-header-overlap)) calc(-1 * var(--bm-mini-header-overlap)) 0 !important;
        padding: 0 var(--bm-data-header-padding-x) !important;
        align-items: center;
        justify-content: space-between;
        gap: var(--bm-box-gap);
        border: var(--bm-box-border-width) solid var(--bm-box-border-color) !important;
        border-radius: var(--bm-box-radius) !important;
        background: var(--bm-mini-header-bg) !important;
        color: var(--bm-menu-text) !important;
        font: 700 var(--bm-menu-font-size)/1 "Open Sans", Arial, sans-serif !important;
        box-shadow: none !important;
    }

    body[data-bygmak-ui] .mini-header.mini-header.mini-header :is(h1, h2, h3, strong, span) {
        margin: 0;
        color: inherit !important;
        font: inherit !important;
        letter-spacing: 0 !important;
        text-transform: none !important;
    }

    body[data-bygmak-ui] .content-box :is(.document-mini-content, .content-box-body) {
        box-sizing: border-box;
        padding: var(--bm-content-box-padding) !important;
        font-family: "Open Sans", Arial, sans-serif;
    }

    /* Vinduesdesigneren genbruger de fælles boks-, miniheader-, tekst- og knaptokens. */
    body[data-bygmak-ui].window-designer-page .window-designer-root,
    body[data-bygmak-ui].window-designer-page .window-designer-root * {
        font-family: var(--bygmak-font-family, "Open Sans", Arial, sans-serif) !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root .compact-panel {
        box-sizing: border-box;
        border: var(--bm-box-border-width) solid var(--bm-box-border-color) !important;
        border-radius: var(--bm-box-radius) !important;
        background: #ffffff !important;
        box-shadow: none !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root .compact-panel > h2 {
        box-sizing: border-box;
        display: flex;
        width: calc(100% + (2 * var(--bm-mini-header-overlap)));
        min-height: var(--bm-mini-header-height) !important;
        margin: calc(-1 * var(--bm-mini-header-overlap)) calc(-1 * var(--bm-mini-header-overlap)) 0 !important;
        padding: 0 var(--bm-data-header-padding-x) !important;
        align-items: center;
        border: var(--bm-box-border-width) solid var(--bm-box-border-color) !important;
        border-radius: var(--bm-box-radius) !important;
        background: var(--bm-mini-header-bg) !important;
        color: var(--bm-menu-text) !important;
        font-size: var(--bm-menu-font-size) !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root :is(.btn, .seg button, .position-preset) {
        min-height: var(--bm-control-height) !important;
        border-radius: var(--bm-menu-radius) !important;
        font-size: var(--bm-menu-font-size) !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root .drawing-footer .spross-dim-toggle {
        box-sizing: border-box;
        display: flex;
        height: 16px !important;
        min-height: 16px !important;
        padding: 0 !important;
        align-items: center;
        justify-content: flex-start;
        gap: 5px;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #4b5563 !important;
        font: 500 11px/16px "Open Sans", Arial, sans-serif !important;
        letter-spacing: 0 !important;
        text-transform: none !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root .drawing-footer .spross-dim-toggle > span {
        color: inherit !important;
        font: inherit !important;
        letter-spacing: inherit !important;
        text-transform: inherit !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root .orders :is(.element-sheet, .element-sheet-head, .paper-thumb) {
        border: 0 !important;
        border-radius: 0 !important;
        background: #ffffff !important;
        box-shadow: none !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root .orders .paper {
        border: 0 !important;
        border-radius: 0 !important;
        background: #ffffff !important;
        box-shadow: none !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root .orders :is(.paper-input, .paper-select, .inline-edit) {
        border: 0 !important;
        border-radius: 0 !important;
        outline: 0 !important;
        background-color: transparent !important;
        box-shadow: none !important;
    }

    body[data-bygmak-ui].send-module-page :is(.send-page, .send-confirm),
    body[data-bygmak-ui].send-module-page :is(.send-page, .send-confirm) * {
        font-family: var(--bygmak-font-family, "Open Sans", Arial, sans-serif) !important;
    }

    body[data-bygmak-ui]:is(.task-detail-body, .calculate-page, .document-module-page, .send-module-page) .workspace-button {
        box-sizing: border-box;
        height: var(--bm-project-action-height) !important;
        min-height: var(--bm-project-action-height) !important;
        max-height: var(--bm-project-action-height) !important;
        padding: 0 var(--bm-control-padding-x) !important;
        border-radius: var(--bm-menu-radius) !important;
        font: 700 var(--bm-menu-font-size)/1 "Open Sans", Arial, sans-serif !important;
    }

    body[data-bygmak-ui] .data-table-header + .data-table-content {
        margin-top: var(--bm-data-header-content-gap) !important;
    }

    body[data-bygmak-ui] .data-table-header + .data-table {
        margin-top: calc(var(--bm-data-header-content-gap) - var(--bm-data-row-gap)) !important;
    }

    body[data-bygmak-ui] .data-table {
        border-collapse: separate !important;
        border-spacing: 0 var(--bm-data-row-gap) !important;
        background: transparent !important;
    }

    body[data-bygmak-ui] .data-table tbody td {
        border-width: 1px 0 !important;
        border-style: solid !important;
        border-color: var(--bm-menu-border) !important;
        background: #ffffff;
    }

    body[data-bygmak-ui] .data-table tbody td:first-child {
        border-left-width: 1px !important;
        border-radius: var(--bm-data-row-radius) 0 0 var(--bm-data-row-radius);
    }

    body[data-bygmak-ui] .data-table tbody td:last-child {
        border-right-width: 1px !important;
        border-radius: 0 var(--bm-data-row-radius) var(--bm-data-row-radius) 0;
    }

    body[data-bygmak-ui] .data-table tbody tr:hover td {
        background: var(--bm-control-hover-bg);
    }

    body[data-bygmak-ui] .data-table-header h2 {
        margin: 0;
        color: var(--bm-data-header-text);
        font-family: "Open Sans", Arial, sans-serif;
        font-size: var(--bm-menu-font-size);
        font-weight: 700;
        line-height: 1;
        text-align: left;
    }

    body[data-bygmak-ui] .data-table-header :is(.overview-column-summary, .overview-column-menu-trigger) {
        align-self: center;
        height: 22px;
        min-height: 22px;
        max-height: 22px;
        margin-top: 0;
        margin-bottom: 0;
        font-family: "Open Sans", Arial, sans-serif;
        line-height: 1;
    }

    body[data-bygmak-ui] .data-table-header .overview-column-summary {
        display: flex;
        justify-self: end;
        overflow: hidden;
        padding-top: 0;
        padding-bottom: 0;
        align-items: center;
        color: #000000 !important;
        font-size: var(--bm-menu-font-size);
        font-weight: 700;
        line-height: 1 !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body[data-bygmak-ui] .data-table-header .overview-column-menu-trigger {
        display: inline-flex;
        width: 24px;
        min-width: 24px;
        padding: 0;
        align-items: center;
        justify-content: center;
        gap: 0;
        border: 0;
        background: transparent;
        color: #000000;
        line-height: 1;
    }

    body[data-bygmak-ui] .overview-column-menu-trigger .sort-arrow-pair {
        display: grid;
        width: 12px;
        height: 18px;
        grid-template-rows: repeat(2, 9px);
        place-items: center;
        font-size: 11px;
        font-weight: 700;
        line-height: 8px;
    }

    body[data-bygmak-ui] .data-table-header .overview-column-menu {
        position: absolute;
        top: calc(100% + 4px);
        right: 4px;
        z-index: 1200;
        width: min(360px, calc(100vw - 24px));
        padding: 10px;
        border: 1px solid var(--bm-menu-border-strong);
        border-radius: var(--bm-menu-radius);
        background: var(--bm-menu-surface);
        color: var(--bm-menu-text);
        box-shadow: 0 8px 22px rgba(20, 28, 36, .16);
    }

    body[data-bygmak-ui] .overview-column-menu-content {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        color: #000000;
        font-size: 11px;
    }

    body[data-bygmak-ui] .overview-column-menu-content > div > strong {
        display: block;
        margin-bottom: 6px;
        color: #000000;
        font-size: 11px;
    }

    body[data-bygmak-ui] :is(.overview-column-statuses, .overview-column-sort-options) {
        display: grid;
        gap: 3px;
    }

    body[data-bygmak-ui] :is(.overview-column-status-choice, .overview-column-sort-choice) {
        display: grid;
        min-height: 22px;
        grid-template-columns: 14px minmax(0, 1fr);
        gap: 5px;
        align-items: center;
        color: #000000 !important;
        font-size: 10px;
        font-weight: 400;
    }

    body[data-bygmak-ui] :is(.overview-column-status-choice, .overview-column-sort-choice) input {
        width: 13px;
        height: 13px;
        margin: 0;
        accent-color: var(--bm-menu-active);
    }

    body[data-bygmak-ui] :is(.overview-column-status-choice, .overview-column-sort-choice) span {
        color: #000000 !important;
        font-weight: 400 !important;
    }

    body[data-bygmak-ui] .data-table-header .overview-column-menu[hidden] {
        display: none;
    }

    body[data-bygmak-ui] .overview-daily-section > .data-table-header {
        border-right: 0 !important;
        border-radius: var(--bm-menu-radius) 0 0 var(--bm-menu-radius) !important;
    }

    body[data-bygmak-ui] .overview-board-column-action > .data-table-header {
        border-right: 0 !important;
        border-radius: 0 !important;
    }

    body[data-bygmak-ui] .overview-board-column-waiting > .data-table-header {
        border-radius: 0 var(--bm-menu-radius) var(--bm-menu-radius) 0 !important;
    }

    body[data-bygmak-ui] .overview-latest-offers > .data-table-header {
        border-radius: var(--bm-menu-radius) !important;
    }

    body[data-bygmak-ui] .project-document-icon {
        display: inline-grid;
        width: 19px;
        height: 19px;
        place-items: center;
        border: 1px solid currentColor;
        border-radius: var(--bm-menu-radius);
        background: #f7fbff;
        text-decoration: none;
    }

    body[data-bygmak-ui] .project-document-icon.is-offer { color: var(--bm-menu-active); }
    body[data-bygmak-ui] .project-document-icon.is-invoice { background: #fff7f6; color: #c13d35; }
    body[data-bygmak-ui] .project-document-icon.is-material-list { color: #256f62; }
    body[data-bygmak-ui] .project-document-icon.is-material-list:hover { background: #e7f4f1; color: #175c50; }
    body[data-bygmak-ui] .project-document-icon.is-offer:hover { background: var(--bm-control-hover-bg); }
    body[data-bygmak-ui] .project-document-icon.is-invoice:hover { background: #fde9e7; }
    body[data-bygmak-ui] .project-document-icon.is-disabled { border-color: #e1e6eb; background: #f7f8f9; color: #aeb7c0; cursor: default; }
    body[data-bygmak-ui] .project-document-icon svg { width: 12px; height: 12px; stroke-width: 2; }

    body[data-bygmak-ui] > .page-content,
    body[data-bygmak-ui]:is(.dashboard-page, .calendar-page, .project-list-page, .invoice-list-page, .calculate-page, .task-detail-body, .document-module-page, .send-module-page, .window-designer-page) > .page-content {
        box-sizing: border-box !important;
        width: auto !important;
        max-width: none !important;
        margin-top: calc(var(--bm-context-menu-height) + var(--bm-page-menu-height) + var(--bm-shell-gap)) !important;
        margin-right: var(--bm-page-content-inset) !important;
        margin-bottom: var(--bm-page-content-inset) !important;
        margin-left: calc(var(--bm-side-menu-width) + var(--bm-page-content-inset)) !important;
        padding: 0 !important;
    }

    body[data-bygmak-ui]:is(.task-detail-body, .calculate-page, .document-module-page, .send-module-page, .window-designer-page) > .page-content {
        height: var(--bm-page-content-height) !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    body[data-bygmak-ui].window-designer-page > .page-content > .window-designer-root,
    body[data-bygmak-ui].window-designer-page > .page-content > .window-designer-root > .wrap {
        height: 100% !important;
        min-height: 0 !important;
    }

    body[data-bygmak-ui].send-module-page {
        overflow: hidden !important;
    }

    body[data-bygmak-ui]:is(.task-detail-body, .calculate-page, .document-module-page, .send-module-page) > .page-content :is(.task-workspace, .split-workspace, .document-module, .send-page) {
        box-sizing: border-box;
        width: 100% !important;
        max-width: none !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    body[data-bygmak-ui].task-detail-body > .page-content .task-workspace,
    body[data-bygmak-ui].calculate-page > .page-content .split-workspace,
    body[data-bygmak-ui].document-module-page > .page-content .document-module {
        height: 100% !important;
    }

    body[data-bygmak-ui].calculate-page > .page-content .split-workspace {
        grid-template-columns: minmax(0, 1fr) !important;
        min-height: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        background: transparent !important;
    }

    body[data-bygmak-ui].calculate-page > .page-content .calculation-workspace {
        margin: 0 !important;
        overflow: auto;
    }

    body[data-bygmak-ui].send-module-page > .page-content {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        scrollbar-gutter: stable;
    }

    body[data-bygmak-ui].calendar-page > .page-content {
        height: var(--bm-page-content-height) !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }
}

@media print {
    .side-menu,
    .context-menu,
    .page-menu {
        display: none !important;
    }
}

/* Vinduesdesigneren er den udtrykkeligt aftalte mobil-undtagelse. */
@media (max-width: 800px) {
    body[data-bygmak-ui].window-designer-page {
        overflow: auto !important;
    }

    body[data-bygmak-ui].window-designer-page > .side-menu {
        display: none !important;
    }

    body[data-bygmak-ui].window-designer-page > :is(.context-menu, .page-menu) {
        left: 0 !important;
        width: 100% !important;
    }

    body[data-bygmak-ui].window-designer-page > .page-menu {
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    body[data-bygmak-ui].window-designer-page > .page-content {
        width: auto !important;
        height: auto !important;
        min-height: calc(100dvh - var(--bm-context-menu-height) - var(--bm-page-menu-height) - 8px) !important;
        margin-right: 4px !important;
        margin-left: 4px !important;
        overflow: visible !important;
    }

    body[data-bygmak-ui].window-designer-page .window-designer-root,
    body[data-bygmak-ui].window-designer-page .window-designer-root > .wrap {
        height: auto !important;
    }
}

/* Desktop: flydende menuer og dialoger deler viewportens koordinater. */
@media screen {
    body[data-bygmak-ui] .task-menu.is-viewport-menu {
        position: fixed;
        inset: var(--task-menu-top, 0px) auto auto var(--task-menu-left, 0px);
        margin: 0;
        max-height: calc(100vh - 16px);
        overflow-y: auto;
        z-index: 1200;
    }
    body[data-bygmak-ui] .document-modal-backdrop:has(> .document-modal:not([data-floating-panel])) {
        box-sizing: border-box;
        position: fixed;
        inset: 0;
        align-items: center;
        justify-content: center;
        z-index: 1300;
    }
    body[data-bygmak-ui] .document-modal-backdrop > .document-modal:not([data-floating-panel]) {
        position: relative;
        inset: auto;
        margin: 0;
        transform: none;
    }
    body[data-bygmak-ui] dialog.workspace-leave-dialog {
        position: fixed;
        inset: 0;
        margin: auto;
        max-height: calc(100vh - 32px);
        overflow-y: auto;
    }
    body[data-bygmak-ui].document-module-page .document-module {
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        min-height: 0 !important;
        grid-template-rows: minmax(0, 1fr);
        gap: var(--bm-layout-card-gap);
    }
    body[data-bygmak-ui].document-module-page .document-editor,
    body[data-bygmak-ui].document-module-page .document-preview-shell {
        grid-row: 1;
    }
    body[data-bygmak-ui].document-module-page .document-editor {
        padding: 0 0 12px !important;
        scrollbar-width: none;
        scrollbar-gutter: auto !important;
    }
    body[data-bygmak-ui].document-module-page .document-editor::-webkit-scrollbar { display: none; }
    body[data-bygmak-ui].document-module-page .document-preview-shell {
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }
    body[data-bygmak-ui] .swedoor-lookup-modal {
        border: var(--bm-box-border-width) solid var(--bm-box-border-color);
        border-radius: var(--bm-box-radius);
        font-size: var(--bm-form-control-font-size);
    }
    body[data-bygmak-ui] .swedoor-lookup-modal :is(.swedoor-choice, .swedoor-door-card, .swedoor-calc) {
        border: 1px solid var(--bm-control-border);
        border-radius: var(--bm-menu-radius);
        background: var(--bm-control-bg);
        color: var(--bm-menu-text);
        font-size: var(--bm-form-control-font-size);
        box-shadow: none;
        min-height: var(--bm-control-height);
    }
    body[data-bygmak-ui] .swedoor-lookup-modal :is(.swedoor-choice, .swedoor-door-card, .swedoor-calc).is-active {
        border-color: var(--bm-control-active-bg);
        background: var(--bm-control-active-bg);
        color: var(--bm-control-active-text);
    }
    body[data-bygmak-ui] .swedoor-lookup-modal :is(button strong, button small) { font-size: inherit; color: inherit; }
    body[data-bygmak-ui] .swedoor-lookup-modal :is(h3, .swedoor-section-label, .swedoor-quantity-control) {
        font-size: var(--bm-form-label-font-size);
        font-weight: var(--bm-form-label-font-weight);
    }
}

@media screen and (min-width: 761px) {
    body[data-bygmak-ui] [data-floating-panel] {
        box-sizing: border-box;
        position: fixed;
        top: 0;
        max-width: calc(100vw - 16px);
        max-height: calc(100dvh - 8px);
        margin: 0;
        transform: none;
        overflow-y: auto;
        pointer-events: auto;
    }
    body[data-bygmak-ui] .velux-helper-modal { display: flex; flex-direction: column; overflow: hidden; }
    body[data-bygmak-ui] .velux-helper-frame { flex: 1 1 0; min-height: 0; height: auto; }
    body[data-bygmak-ui] [data-floating-tool] {
        position: fixed;
        inset: 0;
    }
}

/* Project controls keep the whole status readable and the initials compact. */
body[data-bygmak-ui] .page-menu .task-workspace-status select { width: 202px !important; min-width: 202px !important; }
body[data-bygmak-ui] .page-menu .task-workspace-owner select { width: 84px !important; min-width: 84px !important; padding: 0 8px 0 10px !important; }
body[data-bygmak-ui] .page-menu .workspace-calculation-actions { gap: var(--bm-shell-gap); }
body[data-bygmak-ui] .page-menu .workspace-calculation-actions > .workspace-button { margin: 0; }
.workspace-next-action { display: inline-flex; align-items: center; flex-shrink: 0; white-space: nowrap; }
.workspace-next-action > span { font-size: 12px; }

body[data-bygmak-ui] .page-menu .workspace-open-invoice-status {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--bm-menu-muted);
    font-size: var(--bm-menu-font-size);
    font-weight: 400;
}