@import url("theme.css?v=20261001-palette-v148");

:root{
    --bg: var(--bygmak-page-background);
    --surface: var(--bygmak-surface);
    --line: var(--bygmak-border);
    --line-dark: var(--bygmak-border-strong);
    --text: var(--bygmak-text);
    --muted: var(--bygmak-muted);
    --blue: var(--bygmak-primary);
    --blue-dark: var(--bygmak-primary-hover);
    --green: var(--bygmak-positive);
    --amber: var(--bygmak-warning);
    --red: var(--bygmak-error);
    --shadow: var(--bygmak-card-shadow);
    --task-dark-red: var(--bygmak-task-dark-red);
}

*{
    box-sizing: border-box;
}

body{
    margin: 0;
    overflow-x: hidden;
    background: var(--bg);
    color: var(--text);
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 13px;
    line-height: 1.45;
}

a{
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea{
    max-width: 100%;
    font: inherit;
}

input,
select,
textarea{
    width: 100%;
    border: 1px solid var(--line-dark);
    border-radius: 3px;
    background: #fff;
    color: var(--text);
    padding: 7px 9px;
    min-height: 34px;
}

textarea{
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus{
    border-color: var(--blue);
    outline: 2px solid rgba(36, 95, 159, 0.18);
}

label span{
    display: block;
    margin-bottom: 4px;
    color: var(--muted);
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
}

.sr-only{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.brand{
    display: flex;
    gap: 10px;
    align-items: center;
}

.brand strong{
    display: block;
    font-size: 17px;
    font-weight: 800;
}

.brand small{
    display: block;
    color: var(--muted);
    font-size: 11px;
}

.brand-mark{
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid #123b65;
    border-radius: 4px;
    background: linear-gradient(#2f73b6, #1d548e);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
}

.brand-mark-large{
    width: 46px;
    height: 46px;
    margin: 0 auto 10px;
}
.brand-mark-logo { background: var(--bygmak-shell-side-menu); }
.brand-mark-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.auth-brand .brand-mark-logo { width: 160px; height: 160px; background: transparent; border: 0; }

.button-row,
.form-actions,
.inline-form{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    background: #fff;
    color: var(--text);
    cursor: pointer;
    font-weight: 700;
    white-space: nowrap;
}

.btn:hover:not(:disabled){
    border-color: #7d8a96;
    background: #f2f6fa;
}

.btn:disabled{
    cursor: not-allowed;
    opacity: 0.52;
}

.btn-primary{
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
}

.btn-primary:hover:not(:disabled){
    background: var(--blue-dark);
}

.btn-secondary{
    background: #edf4ee;
    border-color: #9fbea7;
    color: #245d3d;
}

.btn-ghost{
    background: transparent;
}

.btn-small{
    min-height: 30px;
    padding: 5px 9px;
    font-size: 12px;
}

.btn-block{
    width: 100%;
}

.fit{
    width: fit-content;
}

.auth-shell{
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 24px;
}

.auth-card{
    width: min(390px, 100%);
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.auth-card-wide{
    width: min(820px, 100%);
}

.auth-brand{
    margin-bottom: 18px;
    text-align: center;
}

.auth-brand h1{
    margin: 0;
    font-size: 24px;
}

.auth-brand p{
    margin: 4px 0 0;
    color: var(--muted);
}

.auth-divider{
    height: 1px;
    margin: 16px 0;
    background: var(--line);
}

.auth-link{
    display: block;
    margin-top: 10px;
    color: var(--blue-dark);
    font-size: 12px;
    font-weight: 800;
    text-align: center;
}

.page-head{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 14px;
}

.page-head h1{
    margin: 0;
    font-size: 24px;
    letter-spacing: 0;
}

.master-title-line{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: baseline;
}

.eyebrow{
    margin: 0 0 2px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.panel{
    margin-bottom: 14px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.panel-title,
.master-company-head{
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.panel-title h2,
.master-company h2,
.archive-list h2,
.tool-drawer h2{
    margin: 0;
    font-size: 16px;
}

.workspace-grid{
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 14px;
}

.panel-span{
    min-width: 0;
}

.split-workspace{
    display: grid;
    grid-template-columns: 1fr 250px;
    gap: 14px;
}

.tool-drawer{
    align-self: start;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #f8fafc;
}

.tool-drawer button{
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: #fff;
    color: var(--muted);
    text-align: left;
}

.form-grid{
    display: grid;
    gap: 12px;
}

.two-col{
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.two-col h2,
.form-actions-full{
    grid-column: 1 / -1;
}

.narrow-panel{
    max-width: 780px;
}

.placeholder-box{
    display: grid;
    min-height: 160px;
    place-items: center;
    border: 1px dashed var(--line-dark);
    border-radius: 4px;
    background: #f9fbfc;
    color: var(--muted);
    font-weight: 700;
}

.placeholder-box.tall{
    min-height: 360px;
}

.calendar-placeholder{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
}

.calendar-placeholder span,
.calendar-placeholder strong{
    min-height: 36px;
    padding: 8px;
    border: 1px solid var(--line);
    background: #f8fafc;
}

.calendar-placeholder span{
    min-height: auto;
    background: #e9eef3;
    font-size: 11px;
    font-weight: 800;
}

.task-panel-heading{
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    min-width: 0;
}

.task-owner-filter{
    position: relative;
    display: inline-flex;
    min-width: 0;
}

.task-owner-filter select{
    width: auto;
    min-height: 16px;
    padding: 0 10px 0 0;
    border: 0;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

.calendar-next-summary{
    flex: 1 1 auto;
    min-width: 0;
    max-width: 68%;
    height: 14px;
    margin-left: 3px;
    overflow: hidden;
    color: var(--muted);
    font-size: 10px;
    line-height: 14px;
    white-space: nowrap;
}

.calendar-next-track{
    display: inline-flex;
    width: max-content;
    min-width: 100%;
    gap: 28px;
    animation: calendar-next-marquee 18s linear infinite;
}

.calendar-next-summary:hover .calendar-next-track{
    animation-play-state: paused;
}

.calendar-next-track span{
    flex: 0 0 auto;
    color: var(--muted);
    font-weight: 700;
}

@keyframes calendar-next-marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-50% - 14px));
    }
}

.address-field-wrap{
    position: relative;
}

.task-address-row{
    display: grid;
    grid-template-columns: minmax(0, 1fr) 72px;
    gap: 6px;
    align-items: end;
    min-width: 0;
}

.task-address-row > label{
    min-width: 0;
}

.task-house-number-field input{
    text-align: center;
}

.customer-field-wrap{
    position: relative;
}

.customer-suggestions{
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: auto;
    z-index: 60;
    width: min(380px, calc(100vw - 24px));
    max-height: 280px;
    overflow: auto;
    overflow-x: hidden;
    border: 1px solid #c7d0da;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

.customer-suggestion{
    display: grid;
    gap: 1px;
    width: 100%;
    min-height: 0;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid #e5e9ee;
    background: #fff;
    color: #1f2933;
    cursor: pointer;
    text-align: left;
}

.customer-suggestion:last-child{
    border-bottom: 0;
}

.customer-suggestion:hover,
.customer-suggestion:focus,
.customer-suggestion.is-active{
    background: #eef4fb;
}

.customer-suggestion strong{
    font-size: 13px;
    font-weight: 700;
}

.customer-suggestion span{
    color: #6b7280 !important;
    font-family: "Open Sans", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.3;
    letter-spacing: 0 !important;
    text-transform: none !important;
    white-space: normal;
}

.customer-suggestion-address{
    color: #66717f;
    font-weight: 400;
}

.customer-suggestion-city{ margin-bottom: 6px; }

.customer-suggestion-contact{
    display: grid;
    gap: 1px;
    color: #66717f;
    font-size: 12px !important;
}

.customer-suggestion-email{ font-size: inherit; }

/* Overblik: opgaver beholder sorte rammer og hvide bokse. Tilbud bruger fælles design. */
.task-detail-root.is-task-card .task-customer-details,
.task-detail-root.is-task-card .task-note-actions,
.task-detail-root.is-task-card .task-workspace-description,
.task-detail-root.is-task-card .task-workspace-box,
.task-detail-root.is-task-card .task-customer-statistics{
    border: var(--bygmak-case-border-width) solid var(--bygmak-task-border) !important;
    background: #fff !important;
}
.task-detail-root.is-task-card .task-attachment-dropzone:not(.is-dragging){
    background: #fff;
}
.task-detail-root.is-offer .task-description-heading{ background: #edf6fd; color: #164f80; }
.task-type-badge{ display: inline-flex; align-items: center; min-height: 29px; padding: 0 9px; border: 1px solid #b7c7d6; border-radius: 4px; background: #f3f6f8; color: #516273; font-size: 12px; font-weight: 800; }
.is-offer .task-type-badge{ border-color: #80afd4; background: #e8f4fc; color: #125987; }
.workspace-actions .task-type-badge{ display:inline-flex !important; flex:0 0 auto; white-space:nowrap; }
.task-offer-hint{ color: #637383; font-size: 9px; line-height: 1; white-space: nowrap; }

.address-suggestions{
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 40;
    overflow: auto;
    max-height: 220px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    box-shadow: var(--shadow);
}

.address-suggestion{
    display: block;
    width: 100%;
    min-height: 34px;
    padding: 7px 9px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    cursor: pointer;
    font-size: 12px;
    text-align: left;
}

.address-suggestion:last-child{
    border-bottom: 0;
}

.address-suggestion:hover,
.address-suggestion:focus{
    background: #eef3f8;
}

.task-create-drawing{
    display: grid;
    gap: 3px;
}

.task-create-drawing-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.task-create-drawing canvas{
    display: block;
    width: 100%;
    height: 110px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    touch-action: none;
}

.task-list-toolbar{
    flex: 0 0 auto;
    padding: 4px 6px;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.task-filter-bar{
    display: flex;
    gap: 3px;
    align-items: center;
}

.task-search-wrap{
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
}

.task-search-input{
    min-height: 28px;
    padding-right: 32px;
}

.task-sort-select{
    flex: 0 0 92px;
    min-height: 32px;
    padding: 5px 7px;
    font-size: 12px;
}

.task-search-clear{
    position: absolute;
    top: 50%;
    right: 6px;
    display: inline-grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #eef3f8;
    color: var(--muted);
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    transform: translateY(-50%);
}

.task-filter-dropdown{
    position: relative;
    flex: 0 0 auto;
}

.task-filter-trigger{
    display: inline-flex;
    gap: 3px;
    align-items: center;
    min-height: 28px;
    max-width: 100%;
    padding: 4px 7px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    background: #fff;
    color: var(--text);
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
}

.task-filter-trigger-count{
    color: var(--muted);
    font-weight: 400;
}

.task-filter-dropdown .task-filter-menu{
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 30;
    display: none;
    width: max-content;
    min-width: 210px;
    max-width: min(280px, 70vw);
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    box-shadow: var(--shadow);
}

.task-filter-dropdown.is-open .task-filter-menu{
    display: grid;
}

.task-filter-item{
    min-height: 32px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
    text-align: left;
    white-space: nowrap;
}

.task-filter-item:hover,
.task-filter-item.is-active{
    background: #eef3f8;
}

.task-filter-item .count{
    color: var(--muted);
    font-weight: 400;
}

.task-card-inner,
.task-main{
    min-width: 0;
}

.task-main{
    display: grid;
    gap: 3px;
    padding: 6px;
}

.task-header,
.task-title-row,
.task-header-meta,
.task-footer,
.task-actions{
    display: flex;
    gap: 3px;
    min-width: 0;
}

.task-header,
.task-footer{
    justify-content: space-between;
    align-items: flex-start;
}

.task-title-row{
    flex: 1 1 auto;
    flex-direction: column;
}

.task-header-meta,
.task-actions{
    flex: 0 0 auto;
    align-items: center;
}

.task-status-wrap{
    display: inline-flex;
    position: relative;
    gap: 3px;
    align-items: center;
}

.task-date{
    color: #8c98a3;
    font-size: 9px;
    font-weight: 600;
    line-height: 1.1;
}

.task-title{
    min-width: 0;
    outline: none;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.description{
    outline: none;
    color: #394653;
    font-size: 12px;
    line-height: 1.3;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.task-title:focus,
.description:focus{
    border-radius: 4px;
    box-shadow: 0 0 0 2px rgba(36, 95, 159, 0.16);
}

.task-owner-trigger{
    min-width: 34px;
    min-height: 26px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    background: #fff;
    color: var(--text);
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
}

.task-menu-wrap{
    position: relative;
}

.task-menu{
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 20;
    display: grid;
    width: 210px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    box-shadow: var(--shadow);
}

.task-menu[hidden]{
    display: none;
}

.task-menu-item{
    min-height: 32px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
    text-align: left;
}

.task-menu-item:hover,
.task-menu-item:focus{
    background: #eef3f8;
}

.task-owner-menu{
    width: 170px;
}

.task-owner-menu-item{
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 6px;
    align-items: center;
}

.task-owner-menu-item span{
    color: var(--text);
    font-weight: 800;
}

.task-owner-menu-item small{
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 11px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-owner-menu-item.is-active{
    background: #eef3f8;
}

.task-status-badge{
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 6px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #f4f6f8;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.task-has-images{
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.task-action-primary{
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 7px;
    border: 1px solid var(--blue-dark);
    border-radius: 4px;
    background: var(--blue);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.task-card.is-saving{
    background: #f7fbff;
}

.task-card.is-error{
    border-color: #d79a96;
    background: #fff6f5;
}

.task-detail-body{
    margin: 0;
    background: #f4f6f8;
}

.task-detail{
    display: grid;
    gap: 16px;
    padding: 18px;
}

.task-detail-head{
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 1px solid var(--line);
    padding-bottom: 12px;
}

.task-detail h1{
    margin: 3px 0 0;
    font-size: 22px;
    line-height: 1.2;
}

.task-detail h2{
    margin: 0 0 8px;
    font-size: 15px;
}

.task-detail-grid{
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    gap: 16px;
}

.task-detail-text{
    min-height: 110px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    padding: 12px;
    white-space: pre-wrap;
}

.task-detail-meta{
    display: grid;
    gap: 8px;
    margin: 0;
}

.task-detail-meta div{
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    padding: 9px;
}

.task-detail-meta dt{
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.task-detail-meta dd{
    margin: 3px 0 0;
    overflow-wrap: anywhere;
}

.task-detail-files{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
}

.task-detail-files a{
    display: block;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
}

.task-detail-files img{
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.placeholder-box.compact{
    min-height: 90px;
    margin: 10px;
}

.table-wrap{
    width: 100%;
    overflow-x: visible;
}

table{
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    background: #fff;
}

th,
td{
    padding: 8px;
    border: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
    overflow-wrap: anywhere;
}

th{
    background: #edf1f5;
    color: #34424f;
    font-size: 11px;
    text-transform: uppercase;
}

td input,
td select{
    min-width: 0;
}

.table-actions{
    min-width: 0;
}

.small-input{
    width: 130px;
}

.tiny-input{
    width: 58px;
    min-height: 30px;
    padding: 5px 8px;
}

.status-pill{
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid #b8c4ce;
    border-radius: 999px;
    background: #f4f6f8;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.notice-bar,
.notice-inline,
.flash,
.form-error{
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid #d6b16f;
    border-radius: 4px;
    background: #fff7e8;
    color: #6f420e;
    font-weight: 700;
}

.flash-success{
    border-color: #9fc5a8;
    background: #eef8f1;
    color: var(--green);
}

.form-error{
    border-color: #d9a19d;
    background: #fff0ef;
    color: var(--red);
}

.info-list{
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 8px 12px;
    margin: 0;
}

.info-list dt{
    color: var(--muted);
    font-weight: 800;
}

.info-list dd{
    margin: 0;
}

.archive-list{
    display: grid;
    gap: 8px;
}

.archive-list a{
    padding: 8px;
    border: 1px solid var(--line);
    background: #f8fafc;
}

.master-company-head{
    align-items: end;
}

.master-company-head p{
    margin: 2px 0 0;
    color: var(--muted);
}

.checkline{
    display: flex;
    gap: 6px;
    align-items: center;
    font-weight: 700;
}

.checkline input,
.inline-form input[type="checkbox"]{
    width: auto;
    min-height: auto;
}

.user-details summary{
    cursor: pointer;
    font-weight: 800;
}

.login-log-list{
    display: grid;
    gap: 6px;
    max-width: 520px;
    margin: 8px 0 0;
    padding-left: 18px;
}

.login-log-list span,
.login-log-list small{
    display: block;
    color: var(--muted);
    overflow-wrap: anywhere;
}

.input-action{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.field-hint{
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 11px;
}

.field-hint.is-error{
    color: var(--red);
}

.master-company-form{
    display: grid;
    gap: 12px;
}

.master-company-title{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
}

.master-company-title p{
    margin: 2px 0 0;
    color: var(--muted);
    overflow-wrap: anywhere;
}

.metric-strip{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

.metric-strip span{
    display: inline-flex;
    gap: 4px;
    align-items: center;
    min-height: 26px;
    padding: 4px 8px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: #f8fafc;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.metric-strip strong{
    color: var(--text);
}

.master-fields{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.wide-field{
    grid-column: span 2;
}

.master-switches{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.user-card-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 10px;
    margin-top: 10px;
}

.user-card{
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 5px;
    background: #fbfcfd;
    min-width: 0;
}

.user-card-actions{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
}

.user-card-actions span{
    color: var(--muted);
    font-size: 11px;
}

.login-details summary{
    cursor: pointer;
    color: var(--blue-dark);
    font-weight: 700;
}

.settings-grid{
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.settings-overview{
    display: grid;
    grid-template-columns: minmax(520px, 1.6fr) minmax(300px, 1fr) minmax(210px, .65fr);
    gap: 10px;
    align-items: stretch;
    padding: 10px;
}

.settings-company-block{
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 5px;
    background: #fbfcfd;
}

.settings-company-block h2{
    margin: 0 0 5px;
    color: var(--blue-dark);
    font-size: 12px;
    font-weight: 850;
}

.settings-company-block p{
    margin: 0 0 5px;
    overflow-wrap: anywhere;
}

.inline-edit-field{
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    min-height: 31px;
    margin: 0;
    border-top: 1px solid #edf0f2;
    align-items: center;
}

.inline-edit-field span{
    margin: 0;
    color: var(--bygmak-label-text);
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
}

.inline-edit-field input{
    min-width: 0;
    min-height: 26px;
    padding: 2px 5px;
    border-color: transparent;
    background: transparent;
    font-size: 12px;
    font-weight: 400;
}

.settings-field-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 14px;
}

.settings-number-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 18px;
}

.settings-number-column{
    min-width: 0;
}

.settings-number-details :is(.inline-edit-field, .settings-meta-row){
    grid-template-columns: 112px minmax(0, 1fr);
}

.settings-number-details :is(.inline-edit-field, .settings-meta-row) > span{
    white-space: nowrap;
}

.settings-meta-row{
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    min-height: 27px;
    border-top: 1px solid #edf0f2;
    align-items: center;
}

.settings-meta-row span{
    color: var(--muted);
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

.settings-meta-row strong{
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 12px;
}

.settings-logo-details .company-logo-field{
    display: grid;
    gap: 3px;
}

.settings-logo-details .autosave-status{
    margin: 4px 0 0;
}

.inline-edit-field input:hover:not(:disabled),
.inline-edit-field input:focus:not(:disabled){
    border-color: var(--line-dark);
    background: #fff;
}

.inline-edit-field input:disabled{
    border-color: transparent;
    background: transparent;
    opacity: 1;
    color: var(--text);
}

@media (max-width: 620px) {
    .settings-field-grid{
        grid-template-columns: 1fr;
    }

    .settings-overview .inline-edit-field,
.settings-overview .settings-meta-row{
        grid-template-columns: 96px minmax(0, 1fr);
    }
}

.archive-task-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 8px;
}

.archive-task-card{
    display: grid;
    gap: 4px;
    min-height: 126px;
    padding: 10px;
    border: 1px solid var(--line);
    border-top: 4px solid var(--status-archived);
    border-radius: 3px;
    background: #fff;
}

.archive-task-card-head,
.archive-task-card footer{
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
}

.archive-task-card-head > div{
    min-width: 0;
}

.archive-task-card-head strong{
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.archive-task-card > span,
.archive-task-card footer{
    color: var(--muted);
    font-size: 12px;
}

.archive-task-card footer{
    margin-top: auto;
    justify-content: flex-start;
}

.archive-delete-button{
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    min-height: 26px;
    padding: 0;
    border: 1px solid var(--status-archived);
    border-radius: 2px;
    cursor: pointer;
    line-height: 1;
}

.archive-delete-button svg{
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.archive-delete-button:disabled{
    opacity: .4;
    cursor: not-allowed;
}

.archive-history-note{
    margin-left: auto;
    color: #8a4b08;
    font-weight: 700;
}

.archive-empty{
    grid-column: 1 / -1;
}

.company-logo-field input[type="file"]{
    min-height: 28px;
    padding: 4px 0;
    border: 0;
    background: transparent;
    font-size: 11px;
}

.company-logo-preview{
    display: grid;
    align-items: center;
    justify-items: start;
    min-height: 54px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: #fff;
    padding: 7px;
}

.company-logo-preview img{
    display: block;
    max-width: 160px;
    max-height: 44px;
    object-fit: contain;
}

.company-logo-preview strong{
    color: var(--muted);
    font-size: 11px;
}

.autosave-status{
    color: var(--green);
    font-size: 11px;
    font-weight: 800;
}

.autosave-status.is-error{
    color: var(--red);
}

.create-user-row{
    display: grid;
    grid-template-columns: minmax(150px, 1fr) 110px minmax(210px, 1.25fr) minmax(150px, .8fr) auto minmax(190px, auto) auto;
    gap: 8px;
    align-items: end;
}

.row-note{
    color: var(--muted);
    font-size: 11px;
    overflow-wrap: anywhere;
}

.danger-panel{
    border-color: #d79a96;
    background: #fff7f6;
}

.danger-panel p{
    margin-top: 0;
    color: #6f201d;
    font-weight: 700;
}

.delete-dialog{
    width: min(440px, calc(100vw - 28px));
    padding: 0;
    border: 1px solid #b65b56;
    border-radius: 6px;
    background: #fff7f6;
    box-shadow: 0 18px 48px rgba(20, 28, 36, 0.28);
}

.delete-dialog::backdrop{
    background: rgba(20, 28, 36, 0.42);
}

.delete-dialog-card{
    display: grid;
    gap: 12px;
    padding: 18px;
}

.delete-dialog-card h2{
    margin: 0;
    color: var(--red);
    font-size: 20px;
}

.delete-dialog-card p{
    margin: 0;
    color: #6f201d;
    font-weight: 800;
}

.status-rules-dialog{
    width: min(760px, calc(100vw - 28px));
    padding: 0;
    border: 1px solid var(--line-dark);
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(20, 28, 36, 0.24);
}

.status-rules-dialog::backdrop{
    background: rgba(20, 28, 36, 0.36);
}

.status-rules-card{
    display: grid;
    gap: 8px;
    max-height: min(78vh, 720px);
    overflow: auto;
    padding: 16px;
}

.status-rules-card h3{
    margin: 8px 0 0;
    color: var(--blue-dark);
    font-size: 14px;
}

.status-rules-card p{
    margin: 0;
    color: var(--text);
    font-size: 12px;
    line-height: 1.5;
}

.danger-pill{
    border-color: #d79a96;
    background: #ffe7e5;
    color: var(--red);
}

.btn-danger{
    border-color: #842b28;
    background: var(--red);
    color: #fff;
}

.btn-danger:hover:not(:disabled){
    background: #842b28;
}

.delete-requested{
    border-color: #c8423c;
    background: #fff4f3;
}

.delete-warning{
    color: var(--red) !important;
    font-weight: 800;
}

.final-delete-form{
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: 8px;
    align-items: end;
    margin: 10px 0;
    padding: 10px;
    border: 1px solid #d79a96;
    border-radius: 5px;
    background: #ffe7e5;
}

.master-list{
    display: grid;
    gap: 8px;
}

.master-tools{
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(220px, 320px) auto auto;
    gap: 8px;
    align-items: end;
    margin-bottom: 8px;
    padding: 6px 8px;
    border: 1px solid var(--line);
    border-radius: 5px;
    background: #fff;
    box-shadow: var(--shadow);
}

.master-result-line{
    margin: -2px 0 8px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.master-tools label span{
    margin-bottom: 2px;
    font-size: 10px;
}

.master-tools input,
.master-tools select{
    min-height: 30px;
    padding: 5px 8px;
}

.master-summary{
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.master-defaults-form{
    align-items: end;
}

.master-defaults-form label span{
    margin-bottom: 2px;
    font-size: 10px;
}

.master-defaults-form .btn-small{
    min-width: 58px;
    min-height: 30px;
    padding: 5px 8px;
}

.master-row{
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: 5px;
    background: #fff;
    box-shadow: var(--shadow);
}

.master-row.payment-expired,
.master-row.trial-expired{
    border-color: #c8423c;
    background: #fff8f7;
}

.master-row-main{
    display: grid;
    gap: 8px;
}

.master-company-text{
    display: flex;
    flex-wrap: wrap;
    gap: 3px 18px;
    align-items: baseline;
    justify-content: flex-start;
    min-width: 0;
}

.master-company-text span{
    display: inline-flex;
    gap: 4px;
    align-items: baseline;
    color: var(--muted);
    font-size: 12px;
}

.master-company-text input,
.master-status-line input,
.master-status-line select{
    width: auto;
    min-width: 4ch;
    max-width: min(100%, 62ch);
    min-height: 24px;
    padding: 2px 4px;
    border-color: transparent;
    background: transparent;
    overflow: visible;
    text-overflow: clip;
}

.master-company-text input:hover,
.master-company-text input:focus,
.master-status-line input:hover,
.master-status-line input:focus,
.master-status-line select:hover,
.master-status-line select:focus{
    border-color: var(--line-dark);
    background: #fff;
}

.master-company-text .name{
    min-width: 20ch;
    max-width: min(100%, 46ch);
    color: var(--text);
    font-size: 14px;
    font-weight: 800;
}

.master-status-line{
    display: grid;
    grid-template-columns: minmax(170px, 220px) 126px 72px 126px 126px auto 72px auto auto minmax(160px, 1fr);
    gap: 6px 12px;
    align-items: end;
    width: 100%;
}

.master-status-line [data-status-field]{
    display: none;
}

.master-row.status-paid .master-status-line [data-status-field="paid"],
.master-row.status-trial .master-status-line [data-status-field="trial"]{
    display: inline-grid;
}

.master-row.status-trial .master-status-line .master-period-note{
    display: inline-flex;
}

.master-status-line label{
    display: inline-grid;
    gap: 2px;
    min-width: 0;
}

.master-status-line input,
.master-status-line select{
    width: 100%;
    max-width: 100%;
}

.master-status-line label span{
    margin: 0;
    font-size: 10px;
}

.master-count,
.master-save-status,
.master-last-active,
.master-period-note{
    align-self: center;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.master-last-active{
    justify-self: end;
    text-align: right;
}

.master-save-status.is-error{
    color: var(--red);
}

.master-status-warning{
    margin-top: 2px;
    color: var(--red);
    font-size: 12px;
    font-weight: 800;
}

.pagination{
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 12px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.master-users{
    margin-top: 6px;
}

.master-users summary{
    cursor: pointer;
    color: var(--blue-dark);
    font-size: 12px;
    font-weight: 800;
}

.master-delete-warning{
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(240px, 420px);
    gap: 8px;
    align-items: center;
    margin-top: 8px;
    padding: 8px;
    border: 1px solid #d79a96;
    border-radius: 4px;
    background: #ffe7e5;
    color: var(--red);
}

@media (max-width: 980px) {
    .workspace-grid,
.split-workspace,
.two-col,
.settings-grid,
.settings-overview,
.create-user-row,
.master-fields,
.master-company-title,
.master-tools{
        grid-template-columns: 1fr;
    }

    .task-filter-bar{
        align-items: stretch;
        flex-wrap: wrap;
    }

    .task-search-wrap{
        flex-basis: 100%;
    }

    .final-delete-form{
        grid-template-columns: 1fr;
    }

    .master-delete-warning{
        grid-template-columns: 1fr;
    }

    .master-status-line{
        grid-template-columns: minmax(180px, 1fr) 120px 72px 120px 120px;
    }

    .master-last-active{
        grid-column: 1 / -1;
        justify-self: start;
        text-align: left;
    }

    .master-period-note,
.master-count,
.master-save-status{
        align-self: end;
    }

    .wide-field{
        grid-column: auto;
    }

    .metric-strip{
        justify-content: flex-start;
    }
}

/* Beregn: integreret kalkulation i BygMak. */
.calculate-page{
    --calc-compact-border: #d7dde8;
    --calc-compact-bg: var(--bg);
    --calc-compact-header: #eef3f9;
    --calc-compact-muted: #64748b;
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    min-height: 100vh !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

.calculate-page .app-shell{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: hidden !important;
}

.calculate-page .split-workspace{
    align-items: stretch !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.calculate-page .calculation-workspace{
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.calculate-page .calculation-workspace-body{
    flex: 1 1 auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: auto !important;
    padding: 6px !important;
    background: #fff !important;
}

.calculate-page .calculation-case-select{
    display: none !important;
}

.calculate-page .tool-drawer{
    position: relative !important;
    top: auto !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 6px !important;
    background: var(--surface) !important;
    box-shadow: var(--shadow) !important;
}

.calculate-page .tool-drawer-body{
    display: grid !important;
    flex: 1 1 auto !important;
    gap: 8px !important;
    align-content: start !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    padding: 10px !important;
}

.bygmak-calculation,
.bygmak-calculation button,
.bygmak-calculation input,
.bygmak-calculation table,
.bygmak-calculation th,
.bygmak-calculation td{
    font-family: "Open Sans", Arial, sans-serif !important;
}

.bygmak-calculation{
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--text) !important;
    font-size: 12px !important;
}

.bygmak-calculation input{
    width: 100% !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--text) !important;
}

.bygmak-calculation .sheet-panel{
    margin: 0 0 10px !important;
    padding: 8px !important;
    border: 1px solid var(--calc-compact-border) !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 1px 5px rgba(15, 23, 42, 0.05) !important;
}

.bygmak-calculation .summary-panel{
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    overflow: hidden !important;
    padding: 4px 6px !important;
    margin: 0 0 5px !important;
    background: var(--calc-compact-bg) !important;
}

.calculate-page .bygmak-calculation .summary-panel{
    background: #eef5fb !important;
}

.bygmak-calculation .summary-panel .panel-title,
.bygmak-calculation .calculations-title,
.bygmak-calculation .calculation-header .eyebrow{
    display: none !important;
}

.bygmak-calculation .summary-grid{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 210px !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: start !important;
    overflow: hidden !important;
}

.bygmak-calculation .summary-output-box{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

.bygmak-calculation .summary-overview-grid{
    display: grid !important;
    grid-template-columns:
        minmax(174px, 1fr)
        minmax(174px, 1fr)
        minmax(188px, 1.08fr)
        minmax(116px, 0.62fr)
        minmax(122px, 0.66fr) !important;
    gap: 3px !important;
    min-width: 0 !important;
}

.bygmak-calculation .summary-item{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content !important;
    gap: 8px !important;
    align-items: center !important;
    min-width: 0 !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 8px !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: #e4e7ea !important;
    color: #0f172a !important;
    font-size: 11px !important;
    line-height: 18px !important;
    white-space: nowrap !important;
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.045) !important;
}

.bygmak-calculation .summary-label{
    min-width: 0 !important;
    overflow: hidden !important;
    color: var(--calc-compact-muted) !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    text-align: left !important;
    text-overflow: clip !important;
}

.bygmak-calculation .summary-value{
    min-width: 104px !important;
    overflow: hidden !important;
    color: #0f172a !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    text-align: right !important;
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums !important;
}

.bygmak-calculation .summary-item-primary .summary-label,
.bygmak-calculation .summary-item-primary .summary-value{
    color: #0f172a !important;
    font-weight: 800 !important;
}

.bygmak-calculation .summary-item-primary .summary-label{
    font-size: 12px !important;
}

.bygmak-calculation .summary-item-primary .summary-value{
    min-width: 124px !important;
    font-size: 14px !important;
}

.bygmak-calculation .summary-item-compact .summary-value{
    min-width: 36px !important;
}

.bygmak-calculation .summary-item-metric{
    grid-template-columns: minmax(24px, 34px) minmax(0, 1fr) !important;
    gap: 6px !important;
}

.bygmak-calculation .summary-item-metric .summary-value{
    min-width: 0 !important;
}

.bygmak-calculation .summary-item-metric .summary-label{
    color: #0f172a !important;
}

.bygmak-calculation .summary-overview-grid input{
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 1px 6px !important;
    border-radius: 7px !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-align: right !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.28) !important;
    outline: none !important;
}

.bygmak-calculation .summary-item-adjustment input{
    width: 60px !important;
    min-width: 60px !important;
    max-width: 60px !important;
}

.bygmak-calculation .settings-table{
    width: 210px !important;
    min-width: 210px !important;
    max-width: 210px !important;
}

@media (max-width: 1180px) {
    .bygmak-calculation .summary-grid{
        grid-template-columns: 1fr !important;
    }

    .bygmak-calculation .settings-table{
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
}

.bygmak-calculation .summary-table{
    border-collapse: collapse !important;
    table-layout: fixed !important;
}

.bygmak-calculation .settings-table{
    border-collapse: separate !important;
    background: transparent !important;
    table-layout: fixed !important;
}

.bygmak-calculation .settings-table{
    border-spacing: 0 3px !important;
}

.bygmak-calculation .settings-table tr{
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.045) !important;
}

.bygmak-calculation .settings-table tr{
    display: table-row !important;
    background: #e4e7ea !important;
}

.bygmak-calculation .settings-table th,
.bygmak-calculation .settings-table td{
    height: 18px !important;
    min-height: 18px !important;
    padding: 1px 7px !important;
    border: 0 !important;
    overflow: hidden !important;
    font-size: 11px !important;
    line-height: 1 !important;
    text-overflow: clip !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.bygmak-calculation .settings-table th,
.bygmak-calculation .settings-table td{
    background: transparent !important;
}

.bygmak-calculation .settings-table th{
    color: var(--calc-compact-muted) !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    text-transform: none !important;
}

.bygmak-calculation .settings-table th{ width: 112px !important; }

.bygmak-calculation .settings-table td{ width: 98px !important; }

.bygmak-calculation .settings-table td,
.bygmak-calculation .summary-table .calc-cell{
    color: #0f172a !important;
    font-weight: 400 !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
}

.bygmak-calculation .settings-table th:first-child{
    border-radius: 8px 0 0 8px !important;
}

.bygmak-calculation .settings-table td:last-child{
    border-radius: 0 8px 8px 0 !important;
}

.bygmak-calculation .summary-table .strong-summary{
    color: #020617 !important;
    font-weight: 400 !important;
}

.bygmak-calculation .summary-table input{
    width: 72px !important;
    min-width: 0 !important;
    max-width: 72px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 1px 4px !important;
    border-radius: 7px !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-align: right !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.22) !important;
    outline: none !important;
}

.bygmak-calculation .summary-table input:focus{
    background: #fff !important;
    box-shadow: inset 0 0 0 2px rgba(37, 99, 235, 0.38) !important;
}

.bygmak-calculation .calculations-stack{
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    overflow: visible !important;
    padding-right: 0 !important;
}

.bygmak-calculation .calculation-card{
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
}

.bygmak-calculation .calculation-header{
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 0 0 5px !important;
}

.bygmak-calculation .calculation-title-row{
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
}

.bygmak-calculation .calculation-title-input{
    width: 260px !important;
    max-width: 260px !important;
    height: 22px !important;
    min-height: 22px !important;
    padding: 2px 8px !important;
    border-radius: 7px !important;
    background: #eef3f9 !important;
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.35) !important;
    outline: none !important;
}

.bygmak-calculation .calculation-title-input:focus{
    background: #fff !important;
    box-shadow: inset 0 0 0 2px rgba(37, 99, 235, 0.45) !important;
}

.bygmak-calculation .calculation-include-toggle{
    position: relative !important;
    display: inline-grid !important;
    flex: 0 0 auto !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    place-items: center !important;
    cursor: pointer !important;
}

.bygmak-calculation .calculation-include-toggle input{
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 1px !important;
    height: 1px !important;
    transform: translate(-50%, -50%) !important;
    clip-path: inset(50%) !important;
    opacity: 0 !important;
}

.bygmak-calculation .calculation-include-toggle span{
    display: inline-grid !important;
    width: 20px !important;
    height: 20px !important;
    border: 1px solid #8fa3b8 !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #1f6f43 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    place-items: center !important;
}

.bygmak-calculation .calculation-include-toggle input:not(:checked) + span{
    color: transparent !important;
    background: #eef1f4 !important;
}

.bygmak-calculation .calculation-card.is-excluded{
    filter: grayscale(1) !important;
    opacity: 0.52 !important;
}

.bygmak-calculation .calculation-card.is-excluded input,
.bygmak-calculation .calculation-card.is-excluded button{
    color: #64748b !important;
}

.bygmak-calculation .hero-actions,
.bygmak-calculation .card-actions{
    display: grid !important;
    gap: 4px !important;
    justify-items: end !important;
}

.bygmak-calculation .card-actions-row{
    display: flex !important;
    gap: 6px !important;
    justify-content: flex-end !important;
}

.bygmak-calculation .primary-button,
.bygmak-calculation .secondary-button,
.bygmak-calculation .compact-button{
    min-height: 22px !important;
    padding: 4px 8px !important;
    border: 1px solid var(--line-dark) !important;
    border-radius: 6px !important;
    background: #fff !important;
    color: var(--text) !important;
    cursor: pointer !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
}

.bygmak-calculation .primary-button{
    border-color: var(--blue-dark) !important;
    background: var(--blue) !important;
    color: #fff !important;
}

.bygmak-calculation .danger-button{
    border-color: #efb1b1 !important;
    color: #8f2424 !important;
}

.bygmak-calculation .card-actions-row .compact-button,
.bygmak-calculation .natural-total-actions .compact-button{
    min-width: 92px !important;
}

.bygmak-calculation .table-scroll,
.bygmak-calculation .calculation-table{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.bygmak-calculation .table-scroll{
    overflow: visible !important;
}

.bygmak-calculation .calculation-table{
    border-collapse: collapse !important;
    table-layout: fixed !important;
    background: #fff !important;
}

.bygmak-calculation .calculation-table col.calculation-index-col,
.bygmak-calculation .calculation-table col:nth-child(1){ width: 1.5% !important; }

.bygmak-calculation .calculation-table col:nth-child(2){ width: 15% !important; }

.bygmak-calculation .calculation-table col:nth-child(3){ width: 4% !important; }

.calculation-note-input{ display:flex; align-items:center; min-width:0; gap:3px; }
.calculation-note-input input{ min-width:0; flex:1; }
.calculation-description-input{ display:flex; align-items:center; min-width:0; gap:3px; }
.calculation-description-input .autocomplete-wrap{ min-width:0; flex:1; }
.calculation-length-button{ flex:0 0 auto; width:auto; min-width:42px; height:18px; padding:0 4px; border:1px solid #b8cbe0; border-radius:3px; background:#fff; color:#245d8f; font:700 9px/1 "Open Sans", Arial, sans-serif; cursor:pointer; }
.calculation-length-button:hover{ background:#eef5fb; }
.calculation-length-button.has-lengths{ border-color:#4a8e7f; background:#eef8f5; color:#1f6b5c; }
.calculation-warehouse-button{ flex:0 0 22px; width:22px; height:18px; padding:0; border:1px solid #8daecc; border-radius:3px; background:#fff; color:#245d8f; font:800 11px/1 "Open Sans", Arial, sans-serif; cursor:pointer; }
.calculation-warehouse-button:hover{ background:#edf6ff; }
.calculation-warehouse-button.is-active{ border-color:#1875c1; background:#1875c1; color:#fff; }
.bygmak-calculation .calculation-table tbody[data-role='rows'] tr.is-warehouse-row > td:nth-child(n+2):nth-child(-n+11){ box-shadow:inset 0 1px #1875c1,inset 0 -1px #1875c1 !important; }
.bygmak-calculation .calculation-table tbody[data-role='rows'] tr.is-warehouse-row > td:nth-child(2){ box-shadow:inset 1px 0 #1875c1,inset 0 1px #1875c1,inset 0 -1px #1875c1 !important; }
.bygmak-calculation .calculation-table tbody[data-role='rows'] tr.is-warehouse-row > td:nth-child(11){ box-shadow:inset -1px 0 #1875c1,inset 0 1px #1875c1,inset 0 -1px #1875c1 !important; }
.calculation-length-dialog{ width: min(520px, calc(100vw - 48px)); padding: 0; border: 1px solid #b9c8d6; border-radius: 7px; box-shadow: 0 18px 55px rgba(24, 43, 61, .24); }
.calculation-length-dialog::backdrop{ background: rgba(20, 35, 49, .38); }
.calculation-length-dialog-head{ display: flex; padding: 15px 17px 12px; border-bottom: 1px solid #d8e0e7; align-items: flex-start; justify-content: space-between; gap: 18px; }
.calculation-length-dialog-head h2{ margin: 0; font-size: 17px; }
.calculation-length-dialog-head p{ margin: 3px 0 0; color: #607386; font-size: 12px; }
.calculation-length-dialog-head > button{ border: 0; background: transparent; color: #526678; font-size: 24px; line-height: 1; cursor: pointer; }
.calculation-length-actions{ display: flex; padding: 12px 17px; border-top: 1px solid #d8e0e7; background: #f7f9fb; justify-content: flex-end; gap: 7px; }
.material-length-editor{ min-width:0; }
.calculation-length-dialog .material-length-editor{ padding:15px 17px 13px; }
.material-length-heading{ display:flex; align-items:baseline; gap:8px; margin-bottom:5px; color:#3d5060; font-size:10px; }
.material-length-heading strong{ font-weight:700; }
.material-length-heading small{ color:#7a8792; font-size:9px; font-weight:400; }
.material-length-lines{ display:grid; max-height:330px; overflow:auto; gap:4px; }
.material-length-line{ display:grid; grid-template-columns:minmax(120px, 1fr) 90px 32px; gap:4px; }
.material-length-line input{ width:100%; height:34px; min-width:0; padding:5px 8px; border:1px solid #bdcbd7; border-radius:4px; background:#fff; color:#26323d; font:inherit; }
.material-length-line button,
.material-length-add{ border:1px solid #c3cdd6; border-radius:3px; background:#fff; color:#405668; font:inherit; cursor:pointer; }
.material-length-line button{ padding:0; font-size:18px; }
.material-length-add{ min-height:28px; margin-top:5px; padding:3px 8px; }
.material-length-line button:hover,
.material-length-add:hover{ border-color:#8295a5; background:#edf2f6; }

.bygmak-calculation .calculation-table col:nth-child(4){ width: 4% !important; }

.bygmak-calculation .calculation-table col:nth-child(5){ width: 5% !important; }

.bygmak-calculation .calculation-table col:nth-child(6){ width: 21% !important; }

.bygmak-calculation .calculation-table col:nth-child(7){ width: 7.5% !important; }

.bygmak-calculation .calculation-table col:nth-child(8){ width: 3.5% !important; }

.bygmak-calculation .calculation-table col:nth-child(9){ width: 7.5% !important; }

.bygmak-calculation .calculation-table col:nth-child(10){ width: 8% !important; }

.bygmak-calculation .calculation-table col:nth-child(11){ width: 8% !important; }

.bygmak-calculation .calculation-table col:nth-child(12){ width: 4% !important; }

.bygmak-calculation .calculation-table col:nth-child(13){ width: 5% !important; }

.bygmak-calculation .calculation-table col:nth-child(14){ width: 6.5% !important; }

.bygmak-calculation .calculation-table th,
.bygmak-calculation .calculation-table td{
    height: 21px !important;
    padding: 0 3px !important;
    border: 1px solid #8f98a6 !important;
    overflow: hidden !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    text-align: left !important;
    text-overflow: clip !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.bygmak-calculation .calculation-table thead th,
.bygmak-calculation .calculation-table .label-cell,
.bygmak-calculation .calculation-table th{
    background: var(--calc-compact-header) !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.bygmak-calculation .calculation-table .calc-cell,
.bygmak-calculation .calculation-table .index-cell{
    background: #d8d8d8 !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.bygmak-calculation .calculation-table th:nth-child(1),
.bygmak-calculation .calculation-table td:nth-child(1),
.bygmak-calculation .calculation-table .index-col,
.bygmak-calculation .calculation-table .index-cell{
    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
    font-size: 10px !important;
}

.bygmak-calculation .calculation-table .input-cell{
    padding: 0 !important;
    background: #fff !important;
}

.bygmak-calculation .calculation-table input,
.bygmak-calculation .calculation-table select,
.bygmak-calculation .calculation-table input[data-row-field="quantity"],
.bygmak-calculation .calculation-table input[data-row-field="hours"],
.bygmak-calculation .calculation-table input[data-row-field="unitPrice"]{
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 21px !important;
    box-sizing: border-box !important;
    padding: 2px 4px !important;
    border-radius: 0 !important;
    color: var(--text) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

.bygmak-calculation .calculation-table input[inputmode="decimal"]{
    text-align: right !important;
}

.bygmak-calculation .calculation-table input[data-row-field="description"]{
    text-align: left !important;
}

.bygmak-calculation .calculation-table select[data-row-field="unit"]{
    padding: 1px 12px 1px 1px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: #fff !important;
    color: var(--text) !important;
    font-size: 10px !important;
    text-align: center !important;
}

.bygmak-calculation .calculation-table .autocomplete-wrap,
.bygmak-calculation .calculation-table .override-wrap{
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
}

.bygmak-calculation .calculation-table .override-wrap{
    display: flex !important;
    align-items: center !important;
}

.bygmak-calculation .calculation-table .override-wrap input{
    padding-right: 16px !important;
}

.bygmak-calculation .calculation-table input:focus,
.bygmak-calculation .calculation-table select:focus{
    background: #f8fbff !important;
    outline: 1px solid #9fb8d4 !important;
    outline-offset: -1px !important;
}

.bygmak-calculation .override-reset{
    position: absolute !important;
    top: 50% !important;
    right: 2px !important;
    display: none !important;
    width: 12px !important;
    height: 12px !important;
    min-height: 12px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #cbd5e1 !important;
    color: #334155 !important;
    cursor: pointer !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    transform: translateY(-50%) !important;
}

.bygmak-calculation .override-wrap.is-overridden .override-reset{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.bygmak-calculation .override-wrap.is-overridden input{
    background: #fff7ed !important;
    box-shadow: inset 0 0 0 1px rgba(249, 115, 22, 0.35) !important;
}

.bygmak-calculation .autocomplete-wrap{
    z-index: 1 !important;
}

.bygmak-calculation .autocomplete-wrap:focus-within{
    z-index: 50 !important;
}

.bygmak-calculation .autocomplete-menu{
    position: absolute !important;
    top: calc(100% + 2px) !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 9999 !important;
    max-height: 220px !important;
    overflow-y: auto !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.18) !important;
}

.bygmak-calculation .autocomplete-item,
.bygmak-calculation .autocomplete-group-title{
    display: block !important;
    width: 100% !important;
    padding: 5px 7px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line) !important;
    text-align: left !important;
}

.bygmak-calculation .autocomplete-item{
    background: #fff !important;
    cursor: pointer !important;
}

.bygmak-calculation .autocomplete-item:hover,
.bygmak-calculation .autocomplete-item.is-active{
    background: #eef3f8 !important;
}

.bygmak-calculation .autocomplete-package-item,
.bygmak-calculation .autocomplete-group-title{
    background: #edf4ee !important;
    color: #245d3d !important;
    font-weight: 800 !important;
}

.bygmak-calculation .calculation-table td:has(.autocomplete-wrap),
.bygmak-calculation .calculation-table th:has(.autocomplete-wrap){
    overflow: visible !important;
}

.bygmak-calculation .summary-body th,
.bygmak-calculation .summary-body td{
    height: 22px !important;
    font-size: 12px !important;
}

.bygmak-calculation .summary-body tr:not(.natural-total-row) > :nth-last-child(-n + 2){
    padding-right: 2px !important;
    padding-left: 2px !important;
    font-size: 10px !important;
    letter-spacing: -0.1px !important;
}

.bygmak-calculation .natural-total-line-cell{
    padding: 4px 6px !important;
    border: 0 !important;
    background: transparent !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    white-space: nowrap !important;
}

.bygmak-calculation .natural-total-line-inner{
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 30px !important;
}

.bygmak-calculation .natural-total-text{
    display: inline-block !important;
    text-align: left !important;
    font-weight: 400 !important;
}

.bygmak-calculation .natural-total-text strong{
    color: #000 !important;
    font-weight: 900 !important;
}

.bygmak-calculation .natural-total-actions{
    display: inline-flex !important;
    flex: 0 0 auto !important;
    gap: 8px !important;
    align-items: center !important;
    margin-left: auto !important;
    padding-right: 4px !important;
}

.bygmak-calculation .natural-total-actions .compact-button{
    margin: 2px 0 !important;
}

@media (max-width: 980px) {
    .calculate-page .split-workspace,
.bygmak-calculation .summary-grid{
        grid-template-columns: 1fr !important;
    }

    .bygmak-calculation .calculation-header{
        align-items: stretch !important;
        flex-direction: column !important;
    }

}

/* Task workspace */
.task-detail-body{
    background: #f2f4f7;
    color: #1f2933;
    font-family: "Open Sans", Arial, sans-serif;
}

.task-workspace{
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 8px;
    min-height: 100vh;
    padding: 8px;
}

.task-workspace-top{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    border: 1px solid #d6dce3;
    border-radius: 4px;
    background: #ffffff;
    padding: 6px;
}

.task-workspace-title{
    display: flex;
    gap: 6px;
    align-items: center;
    min-width: 0;
}

.task-workspace-heading{
    flex: 1 1 auto;
    min-width: 160px;
    height: 32px;
    border: 1px solid #cbd3dc;
    border-radius: 3px;
    padding: 0 8px;
    color: #111827;
    font-size: 15px;
    font-weight: 900;
}

.task-workspace-offer,
.task-workspace-save-button,
.task-workspace-back,
.task-workspace-actions button,
.task-workspace-box button{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    border: 1px solid #1f5f9f;
    border-radius: 3px;
    background: #2368aa;
    color: #ffffff;
    cursor: pointer;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 850;
    line-height: 1;
    text-decoration: none;
}

.task-workspace-actions{
    display: inline-flex;
    gap: 6px;
    align-items: center;
}

.task-workspace-owner{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #5d6875;
    font-size: 11px;
    font-weight: 850;
}

.task-workspace-owner select{
    height: 32px;
    border: 1px solid #cbd3dc;
    border-radius: 3px;
    background: #ffffff;
    color: #26323d;
    padding: 0 8px;
    font-weight: 850;
}

.task-workspace-save{
    min-width: 62px;
    color: #16833b;
    font-size: 12px;
    font-weight: 850;
    text-align: center;
}

.task-workspace-save-button{
    background: #16833b;
    border-color: #127033;
}

.task-workspace-save-button:hover{
    background: #127033;
}

.task-workspace-save.is-error{
    color: #d92d20;
}

.task-workspace-grid{
    display: grid;
    grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
    gap: 8px;
    min-height: 0;
}

.task-workspace-fields,
.task-workspace-description{
    display: grid;
    gap: 6px;
    align-content: start;
    border: 1px solid #d6dce3;
    border-radius: 4px;
    background: #ffffff;
    padding: 8px;
}

.task-workspace-fields label,
.task-workspace-description{
    min-width: 0;
}

.task-workspace-fields span,
.task-workspace-description > span{
    display: block;
    margin-bottom: 3px;
    color: #5d6875;
    font-size: 11px;
    font-weight: 900;
}

.task-workspace-fields input,
.task-workspace-description textarea{
    width: 100%;
    border: 1px solid #cbd3dc;
    border-radius: 3px;
    background: #ffffff;
    color: #1f2933;
    font: inherit;
    font-size: 13px;
    box-shadow: none;
}

.task-workspace-fields input{
    height: 32px;
    padding: 0 8px;
}

.task-workspace-description{
    grid-template-rows: auto minmax(0, 1fr);
}

.task-workspace-description textarea{
    min-height: 0;
    height: 100%;
    resize: none;
    padding: 8px;
    line-height: 1.4;
}

.task-workspace-bottom{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(160px, 220px) minmax(160px, 220px);
    gap: 8px;
}

.task-workspace-box{
    min-height: 118px;
    border: 1px solid #d6dce3;
    border-radius: 4px;
    background: #ffffff;
    padding: 8px;
}

.task-workspace-box-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.task-workspace-box h2{
    margin: 0;
    color: #26323d;
    font-size: 13px;
    font-weight: 900;
}

.task-workspace-empty{
    color: #6b7280;
    font-size: 12px;
}

.task-workspace .task-detail-files{
    grid-template-columns: repeat(auto-fill, minmax(86px, 1fr));
    gap: 6px;
}

.task-workspace .task-detail-files a{
    border-radius: 3px;
}

@media (max-width: 860px) {
    .task-workspace-top,
.task-workspace-grid,
.task-workspace-bottom{
        grid-template-columns: minmax(0, 1fr);
    }

    .task-workspace-actions{
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

/* Workspace detail layout */
.task-detail-body .task-workspace{
    height: calc(100vh - 78px);
    min-height: 0;
    overflow: hidden;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 8px;
    padding: 8px;
}

.task-detail-body.is-embedded .side-menu{
    display: none;
}

.task-detail-body.is-embedded .task-workspace{
    height: calc(100vh - 12px);
}

.task-detail-body .task-workspace-top{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 46px;
    padding: 6px 8px;
}

.task-detail-body .task-workspace-title{
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.task-detail-body .task-workspace-heading{
    flex: 1 1 auto;
    min-width: 160px;
    height: 32px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    box-shadow: none;
    color: #111827;
    padding: 0 4px;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.2;
}

.task-detail-body .task-workspace-heading:focus{
    outline: 2px solid rgba(35, 104, 170, 0.18);
    background: #f8fafc;
}

.task-detail-body .task-workspace-actions{
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    white-space: nowrap;
}

.task-detail-body .task-workspace-offer,
.task-detail-body .task-workspace-save-button,
.task-detail-body .task-workspace-back{
    height: 32px;
    min-height: 32px;
    border-radius: 3px;
}

.task-detail-body .task-workspace-owner{
    height: 32px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #cbd3dc;
    border-radius: 3px;
    background: #ffffff;
    padding: 0 6px;
}

.task-detail-body .task-workspace-owner span{
    color: #5d6875;
    font-size: 11px;
    font-weight: 900;
}

.task-detail-body .task-workspace-owner select{
    width: 54px;
    height: 28px;
    border: 0;
    background: transparent;
    color: #26323d;
    padding: 0;
    font-size: 12px;
    font-weight: 900;
}

.task-detail-body .task-workspace-save{
    height: 32px;
    min-width: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.task-detail-body .task-workspace-grid{
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 8px;
    min-height: 0;
    overflow: hidden;
}

.task-detail-body .task-workspace-fields{
    width: 280px;
    max-width: 280px;
    align-content: start;
}

.task-detail-body .task-workspace-fields input{
    height: 30px;
}

.task-detail-body .task-workspace-description{
    min-width: 0;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    align-content: stretch;
}

.task-detail-body .task-workspace-description textarea{
    height: 100%;
    min-height: 340px;
    resize: none;
}

.task-detail-body .task-workspace-bottom{
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px 180px;
    gap: 8px;
}

@media (max-width: 860px) {
    .task-detail-body .task-workspace-top{
        display: flex;
    }

    .task-detail-body .task-workspace-grid{
        grid-template-columns: 240px minmax(0, 1fr);
    }

    .task-detail-body .task-workspace-fields{
        width: auto;
        max-width: none;
    }

    .task-detail-body .task-workspace-bottom{
        grid-template-columns: minmax(0, 1fr) 150px 150px;
    }
}

@media (max-width: 680px) {
    .task-detail-body .task-workspace{
        height: auto;
        overflow: visible;
    }

    .task-detail-body .task-workspace-top,
.task-detail-body .task-workspace-title,
.task-detail-body .task-workspace-actions{
        flex-wrap: wrap;
    }

    .task-detail-body .task-workspace-grid,
.task-detail-body .task-workspace-bottom{
        grid-template-columns: minmax(0, 1fr);
    }
}

.task-search-clear[hidden]{
    display: none !important;
}

.task-search-input::-webkit-search-cancel-button{
    display: none;
    -webkit-appearance: none;
    appearance: none;
}

.task-search-input::-ms-clear,
.task-search-input::-ms-reveal{
    display: none;
    width: 0;
    height: 0;
}

/* Samme visuelle sprog på alle faste undermenuer. */
.workspace-toolbar{
    height: 42px;
    min-height: 42px;
    max-height: 42px;
    border-color: #cbd3dc;
    background: #ffffff;
    color: #26323d;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 12px;
}

.workspace-tab,
.workspace-button,
.workspace-toolbar button,
.workspace-toolbar input,
.workspace-toolbar select{
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.workspace-tab{
    height: 30px;
    min-height: 30px;
    border-radius: 3px;
}

.workspace-tab.is-active,
.calendar-page .workspace-tab.is-active,
.workspace-button-primary{
    border-color: #1f5f9f;
    background: #2368aa;
    color: #ffffff;
}

.workspace-groups-button{
    flex: 0 0 auto;
    margin-left: 8px;
    text-decoration: none;
}

.workspace-list-button{ flex: 0 0 auto; text-decoration: none; }

.workspace-material-pdf-icon{
    display: inline-grid;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border: 1px solid #9ebbb5;
    border-radius: 4px;
    background: #edf7f5;
    color: #17665a;
    text-decoration: none;
    place-items: center;
}

.workspace-material-pdf-icon:hover{ background: #dff0ec; color: #0f554b; }
.workspace-material-pdf-icon.is-disabled{ border-color: #d4dae0; background: #f1f3f5; color: #a4adb6; cursor: default; }
.workspace-material-pdf-icon svg{ width: 17px; height: 17px; }

.workspace-groups-button.is-active{
    border-color: #1f5f9f;
    background: #2368aa;
    color: #fff;
}

.material-groups-dialog{
    width: min(980px, calc(100vw - 32px));
    height: min(820px, calc(100vh - 32px));
    max-width: none;
    max-height: none;
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid #aeb9c5;
    border-radius: 8px;
    background: #f5f7f9;
    box-shadow: 0 18px 55px rgba(15, 28, 40, .35);
}

.material-groups-dialog::backdrop{
    background: rgba(25, 36, 48, .55);
}

.material-groups-dialog[open]{
    display: grid;
    grid-template-rows: 46px minmax(0, 1fr);
}

.material-groups-dialog-bar{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px 0 18px;
    border-bottom: 1px solid #ccd4dd;
    background: #fff;
    color: #26323d;
}

.material-groups-dialog-bar button{
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #526170;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
}

.material-groups-dialog-bar button:hover{ background: #edf1f5; }
.material-groups-dialog iframe{ width: 100%; height: 100%; border: 0; background: #f5f7f9; }

.material-groups-workspace{
    width: min(1080px, calc(100% - 32px));
    margin: 24px auto 48px;
}

.material-groups-heading{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.material-groups-heading h1,
.material-group-new h2{
    margin: 0 0 6px;
}

.material-groups-heading p{
    max-width: 720px;
    margin: 0;
    color: #607080;
}

.material-groups-list{
    display: grid;
    gap: 12px;
}

.material-group-card,
.material-group-new{
    border: 1px solid #d8dee6;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(33, 48, 65, .06);
}

.material-group-card > summary{
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(260px, 2fr);
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    cursor: pointer;
}

.material-group-card > summary span:first-child{
    display: grid;
    gap: 3px;
}

.material-group-card > summary small,
.material-group-form label small{
    color: #718092;
    font-weight: 400;
}

.material-group-summary-items{
    overflow: hidden;
    color: #566575;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.material-group-form{
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 14px;
    padding: 18px;
    border-top: 1px solid #e4e8ed;
}

.material-group-form label{
    display: grid;
    gap: 6px;
    color: #2a3743;
    font-size: 13px;
    font-weight: 700;
}

.material-picker-field > span{
    display: block;
    margin-bottom: 6px;
    color: #2a3743;
    font-size: 13px;
    font-weight: 700;
}

.material-group-form input,
.material-group-form textarea{
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #bac5d0;
    border-radius: 4px;
    padding: 9px 10px;
    background: #fff;
    color: #1f2c38;
    font: inherit;
}

.material-group-materials,
.material-group-actions{
    grid-column: 1 / -1;
}

.material-group-materials textarea{
    resize: vertical;
}

.material-picker{
    display: grid;
    gap: 8px;
}

.material-picker-selected{
    display: grid;
    gap: 5px;
}

.material-picker-item{
    display: flex;
    min-height: 34px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 8px 5px 10px;
    border: 1px solid #d1d9e1;
    border-radius: 4px;
    background: #f7f9fb;
}

.material-picker-item button{
    width: 25px;
    height: 25px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #8c2e2e;
    font-size: 19px;
    cursor: pointer;
}

.material-picker-search{
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
}

.material-picker-search > button{
    min-width: 74px;
    border: 1px solid #1f5f9f;
    border-radius: 4px;
    background: #2368aa;
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}

.material-picker-suggestions{
    position: absolute;
    z-index: 20;
    top: calc(100% + 3px);
    right: 81px;
    left: 0;
    max-height: 245px;
    overflow-y: auto;
    border: 1px solid #aebbc8;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(25, 39, 52, .18);
}

.material-picker-suggestions button{
    display: block;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid #e0e5ea;
    background: #fff;
    color: #24313d;
    text-align: left;
    cursor: pointer;
}

.material-picker-suggestions button:hover,
.material-picker-suggestions button:focus{ background: #eaf2f9; }

.material-group-actions{
    display: flex;
    justify-content: flex-end;
}

.material-group-delete{
    padding: 0 18px 18px;
    text-align: right;
}

.material-group-delete button{
    border: 0;
    background: transparent;
    color: #a22e2e;
    cursor: pointer;
    text-decoration: underline;
}

.material-group-new{
    margin-top: 24px;
    padding-top: 18px;
}

.material-group-new h2{
    padding: 0 18px 12px;
}

.material-groups-embed{ min-height: 100%; background: #f5f7f9; }
.material-groups-embed .material-groups-workspace{ width: auto; margin: 16px; }
.material-groups-embed .material-groups-heading{ margin-bottom: 12px; }
.material-groups-embed > .flash{ margin: 12px 16px 0; }

.material-list-page{ min-height: 100%; margin: 0; background: #f5f7f9; color: #26323d; font-family: "Open Sans", Arial, sans-serif; font-size: 12px; }
.material-list-page *{ box-sizing: border-box; }
.material-list-page > .flash{ margin: 12px 16px 0; }
.material-list-workspace{ margin: 12px 14px 18px; }
.material-list-heading{ display: flex; min-height: 30px; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 8px; }
.material-list-heading h1{ margin: 0 0 4px; font-size: 19px; }
.material-list-heading p{ margin: 0; color: #667585; font-size: 12px; }
.material-list-heading-actions{ display: flex; align-items: center; gap: 8px; margin-left: auto; white-space: nowrap; }
.material-list-heading .workspace-button{ min-height: 27px; height: 27px; padding: 3px 8px; font-size: 11px; }
.material-list-customer-fields{ display: grid; grid-template-columns: 150px minmax(220px, .85fr) minmax(300px, 1.15fr); gap: 8px; margin-bottom: 10px; }
.material-list-customer-fields label{ display: grid; grid-template-rows: auto 27px; gap: 3px; min-width: 0; }
.material-list-customer-fields span{ padding-left: 1px; color: #637383; font-size: 10px; font-weight: 700; line-height: 1; white-space: nowrap; }
.material-list-customer-fields input{ width: 100%; height: 27px; min-width: 0; padding: 3px 6px; border: 1px solid #cbd4dd; border-radius: 3px; background: #fff; color: #26323d; font: inherit; }
.material-list-customer-fields input:focus{ outline: 2px solid #8fb8d5; outline-offset: -2px; }
.material-list-form{ display: grid; gap: 8px; }
.material-list-choices{ display: flex; min-height: 29px; flex-direction: column; align-items: flex-start; gap: 3px; padding: 5px 7px; border: 1px solid #d4dce4; border-radius: 3px; background: #fff; }
.material-list-choices-title{ color: #526271; font-size: 11px; }
.material-list-choices label{ display: inline-flex; min-height: 19px; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent; cursor: pointer; font-size: 11px; font-weight: 400; }
.material-list-choices label:has(input:checked){ color: #174f46; }
.material-list-choices input{ position: absolute; width: 1px; height: 1px; opacity: 0; }
.material-list-choices label > span{ display: inline-grid; width: 14px; height: 14px; border: 1px solid #9aa8b5; border-radius: 2px; background: #fff; color: transparent; font-size: 10px; line-height: 1; place-items: center; }
.material-list-choices input:checked + span{ border-color: #237467; background: #237467; color: #fff; }
.material-list-choices small{ color: #788694; font-size: 10px; }
.material-list-lines{ display: grid; gap: 6px; }
.material-list-calculation{ overflow: hidden; border: 1px solid #cbd4dd; border-radius: 3px; background: #fff; }
.material-list-calculation h2{ margin: 0; padding: 4px 8px; border-bottom: 1px solid #cbd4dd; background: #edf2f6; color: #274252; font-size: 11px; line-height: 1.2; }
.material-list-item{ display: grid; grid-template-columns: minmax(150px, 1fr) 58px 48px minmax(250px, .8fr) 62px; border-bottom: 1px solid #e1e6eb; }
.material-list-item:last-child{ border-bottom: 0; }
.material-list-line{ display: contents; font-size: 11px; line-height: 1.15; }
.material-list-description{ min-width: 0; overflow: hidden; padding: 3px 7px; text-overflow: ellipsis; white-space: nowrap; }
.material-list-quantity{ padding: 3px 7px; border-left: 1px solid #e1e6eb; text-align: right; font-weight: 700; }
.material-list-line input{ width: 100%; height: 23px; min-width: 0; padding: 2px 7px; border: 0; border-left: 1px solid #e1e6eb; background: #fbfcfd; color: #26323d; font: inherit; }
.material-list-line input.material-list-description{ border-left: 0; background: #fff; text-align: left; text-overflow: ellipsis; }
.material-list-line input.material-list-quantity{ background: #fff; text-align: right; font-weight: 700; }
.material-list-line input.material-list-unit{ background: #fff; padding-left: 3px; padding-right: 3px; text-align: center; }
.material-list-line input.material-list-note{ background: #fbfcfd; }
.material-list-line input:focus{ background: #fff; outline: 2px solid #8fb8d5; outline-offset: -2px; }
.material-list-spec-toggle{ align-self: stretch; border: 0; border-left: 1px solid #e1e6eb; background: #f3f6f8; color: #405668; font: inherit; font-weight: 700; cursor: pointer; }
.material-list-spec-toggle:hover,
.material-list-spec-toggle[aria-expanded="true"]{ background: #e5edf3; color: #174f46; }
.material-list-spec-preview{ grid-column: 4 / 6; min-height: 19px; padding: 5px 8px; border-top: 1px solid #edf0f3; border-left: 1px solid #e1e6eb; background: #fff; color: #526575; font-size: 10px; line-height: 1.35; }
.material-list-spec-preview strong{ display: block; color: #344b5d; }
.material-list-spec-preview span{ display: block; white-space: pre-line; }
.material-list-spec-panel{ grid-column: 4 / 6; padding: 6px 8px 7px; border-top: 1px solid #e1e6eb; border-left: 1px solid #e1e6eb; background: #f8fafb; }
.material-list-spec-panel .material-length-line{ grid-template-columns:minmax(120px, 1fr) 70px 28px; gap:3px; }
.material-list-spec-panel .material-length-line input{ height:28px; padding:3px 7px; border-radius:2px; }
.material-list-spec-panel .material-length-add{ min-height:26px; }
.material-list-actions{ position: sticky; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 10px; border: 1px solid #cbd4dd; border-radius: 5px; background: rgba(255,255,255,.96); box-shadow: 0 -3px 12px rgba(28,38,48,.08); }
.material-list-actions span{ color: #657483; font-size: 11px; }
.material-list-empty{ padding: 24px; border: 1px solid #d4dce4; border-radius: 5px; background: #fff; color: #667585; text-align: center; }

@media (max-width: 760px) {
    .material-groups-workspace{ width: min(100% - 20px, 1080px); margin-top: 14px; }
    .material-groups-heading{ display: grid; }
    .material-group-card > summary,
.material-group-form{ grid-template-columns: 1fr; }
    .material-group-summary-items{ white-space: normal; }
    .material-groups-dialog{ width: calc(100vw - 12px); height: calc(100vh - 12px); }
    .material-list-customer-fields{ grid-template-columns: 130px minmax(190px, .85fr) minmax(250px, 1.15fr); }
}

/* Fælles opsætningsguide. Typografi og kontroller følger BygMaks desktop-design. */
.onboarding-dialog{
    width: min(880px, calc(100vw - 48px));
    max-width: 880px;
    height: min(720px, calc(100vh - 48px));
    max-height: 720px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #b8c4cf;
    border-radius: 8px;
    background: #fff;
    color: #1f2e3d;
    font-family: "Open Sans", Arial, sans-serif;
    box-shadow: 0 18px 48px rgba(24, 42, 59, .24);
}
.onboarding-dialog::backdrop{ background: rgba(19, 31, 42, .48); }
.onboarding-card{ display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; height: 100%; }
.onboarding-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 72px;
    padding: 14px 20px;
    border-bottom: 1px solid #cbd5df;
    background: #edf3f8;
}
.onboarding-header h2{ margin: 0; font-size: 25px; font-weight: 700; line-height: 1.25; }
.onboarding-close{
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: #617181;
    font: 400 25px/1 "Open Sans", Arial, sans-serif;
    cursor: pointer;
}
.onboarding-close:hover{ background: #dfe8f0; color: #20384e; }
.onboarding-progress{
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
    padding: 10px 14px;
    border-bottom: 1px solid #d8e0e7;
    background: #f8fafc;
}
.onboarding-progress button{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #657485;
    font-size: 12px;
    font-weight: 400;
    font-family: "Open Sans", Arial, sans-serif;
    cursor: pointer;
}
.onboarding-progress button:hover{ border-color: #c3d4e3; background: #f0f5f9; color: #245d8f; }
.onboarding-progress button b{
    display: inline-grid;
    place-items: center;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background: #e1e7ed;
    color: #465868;
    font-size: 11px;
    font-weight: 700;
}
.onboarding-progress button.is-active{ border-color: #a9c8e4; background: #eaf3fb; color: #185b98; }
.onboarding-progress button.is-active b{ background: #2368aa; color: #fff; }
.onboarding-body{ min-height: 0; padding: 28px 34px; overflow-y: auto; }
.onboarding-step h3{ margin: 0 0 9px; font-size: 26px; font-weight: 700; line-height: 1.3; }
.onboarding-step > p{ max-width: 760px; margin: 0 0 25px; color: #586a7b; font-size: 16px; font-weight: 400; line-height: 1.6; }
.onboarding-fields{ display: grid; gap: 16px; }
.onboarding-fields.two-columns{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.onboarding-calculation-fields,
.onboarding-mail-fields{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.onboarding-fields .full-width{ grid-column: 1 / -1; }
.onboarding-fields label,
.onboarding-logo-field{ display: grid; gap: 6px; color: #314354; font-size: 14px; font-weight: 400; }
.onboarding-fields label > span,
.onboarding-logo-field > span{ font: 400 14px/1.35 "Open Sans", Arial, sans-serif; text-transform: none; letter-spacing: 0; }
.onboarding-fields input,
.onboarding-fields select,
.onboarding-logo-field input{
    width: 100%;
    min-height: 42px;
    box-sizing: border-box;
    padding: 8px 11px;
    border: 1px solid #b9c5cf;
    border-radius: 5px;
    background: #fff;
    color: #1f2e3d;
    font: 400 14px/1.35 "Open Sans", Arial, sans-serif;
}
.onboarding-fields input:focus,
.onboarding-fields select:focus,
.onboarding-logo-field input:focus{ border-color: #2368aa; outline: 2px solid rgba(35,104,170,.18); outline-offset: 0; }
.onboarding-logo-preview{
    display: grid;
    place-items: center;
    width: 210px;
    height: 105px;
    margin-top: 14px;
    overflow: hidden;
    border: 1px dashed #acbac7;
    border-radius: 6px;
    background: #f7f9fb;
    color: #6a7886;
    font-size: 13px;
}
.onboarding-logo-preview img{ max-width: 190px; max-height: 88px; object-fit: contain; }
.onboarding-finish-note{ margin-top: 20px; padding: 12px 14px; border: 1px solid #c6d9ea; border-radius: 5px; background: #eef5fb; color: #315572; font-size: 13px; line-height: 1.5; }
.onboarding-status{ min-height: 19px; margin: 16px 0 0; color: #657485; font-size: 13px; }
.onboarding-status.is-error{ color: #b42318; }
.onboarding-actions{
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-top: 1px solid #d5dde5;
    background: #fff;
}

/* Noter: kundeoplysninger som Firma-kortet under Indstillinger. */
.task-detail-body .task-workspace-fields{
    grid-template-areas:
        "head head"
        "name email"
        "address phone"
        "city .";
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 18px;
    padding: 10px 13px 12px;
}

.task-detail-body .task-customer-card-head{
    display: grid;
    grid-area: head;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding: 0;
    border: 0;
}

.task-detail-body .task-workspace-fields > label.task-customer-name{ grid-area: name; }
.task-detail-body .task-workspace-fields > label.task-customer-email{ grid-area: email; }
.task-detail-body .task-workspace-fields > label.task-customer-address{ grid-area: address; }
.task-detail-body .task-workspace-fields > label.task-customer-phone{ grid-area: phone; }
.task-detail-body .task-workspace-fields > label.task-customer-city{ grid-area: city; }

.task-detail-body .task-workspace-fields > label,
.task-detail-body .task-title-field,
.task-detail-body .task-next-offer{
    display: grid;
    min-width: 0;
    min-height: 42px;
    margin: 0;
    padding: 4px 0;
    border-top: 1px solid #e1e6eb;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 7px;
    align-items: center;
}

.task-detail-body .task-title-field,
.task-detail-body .task-next-offer{
    border-top: 0;
}

.task-detail-body .task-workspace-fields span,
.task-detail-body .task-next-offer span{
    margin: 0;
    color: #657280;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.task-detail-body .task-workspace-fields input,
.task-detail-body .task-workspace-heading{
    height: 31px;
    min-width: 0;
    padding: 0 7px;
    border: 1px solid transparent;
    border-radius: 3px;
    background: transparent;
    color: #111c2b;
    font-size: 13px;
    font-weight: 750;
}

.task-detail-body .task-workspace-fields input:hover{
    border-color: #d0d8e0;
    background: #fff;
}

.task-detail-body .task-workspace-fields input:focus{
    border-color: #8eaecb;
    background: #fff;
    outline: 1px solid #8eaecb;
}

.task-detail-body .task-title-field .task-workspace-heading{
    border-color: #aebdcb;
    background: #fff;
    font-size: 14px;
    font-weight: 800;
}

.task-detail-body .task-next-offer{
    min-width: 0;
}

.task-detail-body .task-next-offer strong{
    height: 31px;
    padding: 0 7px;
    border: 0;
    background: transparent;
    color: #111c2b;
    font-size: 13px;
    font-weight: 800;
    justify-content: flex-start;
}

.task-address-inputs{
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) 66px;
    gap: 3px;
}

.task-detail-body .task-address-inputs .address-field-wrap:last-child input{
    text-align: center;
}

/* Små visuelle miniaturer for alle bilag. */
.task-detail-body .task-workspace .task-detail-files{
    grid-template-columns: repeat(auto-fill, minmax(92px, 112px));
    justify-content: start;
}

.task-detail-body .task-attachment-item{
    width: 100%;
    height: 100%;
    min-height: 88px;
}

.task-attachment-tile{
    position: relative;
    min-width: 0;
}

.task-detail-body .task-attachment-tile > .task-attachment-delete{
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 2;
    width: 25px;
    height: 25px;
    min-height: 25px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(143, 23, 18, .35);
    border-radius: 4px;
    background: rgba(255, 255, 255, .94);
    color: #b42318;
    cursor: pointer;
}

.task-detail-body .task-attachment-tile > .task-attachment-delete:hover{
    border-color: #b42318;
    background: #fff0ef;
}

.task-attachment-delete svg{
    width: 14px;
    height: 14px;
}

.task-attachment-item img,
.task-attachment-pdf-thumb{
    display: block;
    width: 100%;
    height: 58px;
    border: 0;
    border-radius: 2px;
    background: #fff;
    object-fit: cover;
    pointer-events: none;
}

@media (max-width: 760px) {
    .task-detail-body .task-workspace-fields{
        grid-template-areas:
            "head"
            "name"
            "address"
            "city"
            "email"
            "phone";
        grid-template-columns: minmax(0, 1fr);
    }

    .task-detail-body .task-customer-card-head{
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .task-detail-body .task-next-offer{
        border-top: 1px solid #e1e6eb;
    }
}

/* Note-fanen: prioriteres efter alle ældre arbejdsområde-regler. */
.task-detail-body .task-workspace-fields{
    grid-template-areas: "head head" "name email" "address phone" "city ." !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 18px !important;
    padding: 10px 13px 12px !important;
}
.task-detail-body .task-workspace-fields > .task-customer-card-head{
    display: grid !important;
    grid-area: head !important;
    grid-column: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    padding: 0 !important;
    border: 0 !important;
}
.task-detail-body .task-workspace-fields > label.task-customer-name{ grid-area: name !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-email{ grid-area: email !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-address{ grid-area: address !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-phone{ grid-area: phone !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-city{ grid-area: city !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label,
.task-detail-body .task-customer-card-head .task-title-field,
.task-detail-body .task-customer-card-head .task-next-offer{
    display: grid !important;
    min-height: 42px;
    margin: 0 !important;
    padding: 4px 0 !important;
    border-top: 1px solid #e1e6eb !important;
    grid-template-columns: 112px minmax(0, 1fr) !important;
    gap: 7px !important;
    align-items: center !important;
}
.task-detail-body .task-customer-card-head .task-title-field,
.task-detail-body .task-customer-card-head .task-next-offer{ border-top: 0 !important; }
.task-detail-body .task-workspace-fields input,
.task-detail-body .task-customer-card-head .task-workspace-heading{
    height: 31px !important;
    border: 1px solid transparent !important;
    border-radius: 3px !important;
    background: transparent !important;
    color: #111c2b !important;
    font-size: 13px !important;
    font-weight: 750 !important;
}
.task-detail-body .task-customer-card-head .task-workspace-heading{ border-color: #aebdcb !important; background: #fff !important; font-size: 14px !important; font-weight: 800 !important; }
.task-detail-body .task-customer-card-head .task-next-offer strong{ height: 31px !important; padding: 0 7px !important; border: 0 !important; background: transparent !important; color: #111c2b !important; justify-content: flex-start !important; }
.task-detail-body .task-address-inputs{ grid-template-columns: minmax(0, 1fr) 66px !important; }
.task-detail-body .task-workspace .task-detail-files{ grid-template-columns: repeat(auto-fill, minmax(92px, 112px)) !important; justify-content: start !important; }
.task-detail-body .task-attachment-item{ width: 100% !important; height: 100% !important; min-height: 88px !important; }
.task-detail-body .task-attachment-item img,
.task-detail-body .task-attachment-pdf-thumb{ width: 100% !important; height: 58px !important; object-fit: cover; }
@media (max-width: 760px) {
    .task-detail-body .task-workspace-fields{ grid-template-areas: "head" "name" "address" "city" "email" "phone" !important; grid-template-columns: minmax(0, 1fr) !important; }
    .task-detail-body .task-workspace-fields > .task-customer-card-head{ grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; }
    .task-detail-body .task-customer-card-head .task-next-offer{ border-top: 1px solid #e1e6eb !important; }
}

/* Noter – endelig firmakort-layout. Denne blok ligger sidst, så ældre
   arbejdsområde-regler ikke kan splitte kundeoplysningerne op igen. */
.task-detail-body .task-workspace-fields{
    display: grid !important;
    grid-template-areas:
        "head head"
        "name email"
        "address phone"
        "city ." !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 18px !important;
    padding: 10px 13px 12px !important;
    align-content: start !important;
}

.task-detail-body .task-workspace-fields > .task-customer-card-head{
    display: grid !important;
    grid-area: head !important;
    grid-column: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    padding: 0 !important;
    border: 0 !important;
}

.task-detail-body .task-workspace-fields > label.task-customer-name{ grid-area: name !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-email{ grid-area: email !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-address{ grid-area: address !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-phone{ grid-area: phone !important; grid-column: auto !important; }
.task-detail-body .task-workspace-fields > label.task-customer-city{ grid-area: city !important; grid-column: auto !important; }

.task-detail-body .task-workspace-fields > label,
.task-detail-body .task-customer-card-head .task-title-field,
.task-detail-body .task-customer-card-head .task-next-offer{
    display: grid !important;
    min-width: 0;
    min-height: 42px;
    margin: 0 !important;
    padding: 4px 0 !important;
    border: 0;
    border-top: 1px solid #e1e6eb !important;
    grid-template-columns: 112px minmax(0, 1fr) !important;
    gap: 7px !important;
    align-items: center !important;
}

.task-detail-body .task-customer-card-head .task-title-field,
.task-detail-body .task-customer-card-head .task-next-offer{
    border-top: 0 !important;
}

.task-detail-body .task-workspace-fields span,
.task-detail-body .task-customer-card-head .task-next-offer span{
    margin: 0 !important;
    color: #657280 !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: .035em !important;
    text-transform: uppercase;
}

.task-detail-body .task-workspace-fields input,
.task-detail-body .task-customer-card-head .task-workspace-heading{
    height: 31px !important;
    min-width: 0;
    padding: 0 7px !important;
    border: 1px solid transparent !important;
    border-radius: 3px !important;
    background: transparent !important;
    color: #111c2b !important;
    font-size: 13px !important;
    font-weight: 750 !important;
}

.task-detail-body .task-customer-card-head .task-workspace-heading{
    border-color: #aebdcb !important;
    background: #fff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

.task-detail-body .task-workspace-fields input:hover,
.task-detail-body .task-workspace-fields input:focus{
    border-color: #8eaecb !important;
    background: #fff !important;
}

.task-detail-body .task-customer-card-head .task-next-offer strong{
    height: 31px !important;
    padding: 0 7px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #111c2b !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    justify-content: flex-start !important;
}

.task-detail-body .task-address-inputs{
    display: grid !important;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) 66px !important;
    gap: 3px !important;
}

.task-detail-body .task-workspace .task-detail-files{
    grid-template-columns: repeat(auto-fill, minmax(92px, 112px)) !important;
    justify-content: start !important;
}

.task-detail-body .task-attachment-item{
    width: 100% !important;
    height: 100% !important;
    min-height: 88px !important;
}

.task-detail-body .task-attachment-item img,
.task-detail-body .task-attachment-pdf-thumb{
    display: block;
    width: 100% !important;
    height: 58px !important;
    border: 0;
    border-radius: 2px;
    object-fit: cover;
    pointer-events: none;
}

@media (max-width: 760px) {
    .task-detail-body .task-workspace-fields{
        grid-template-areas:
            "head"
            "name"
            "address"
            "city"
            "email"
            "phone" !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .task-detail-body .task-workspace-fields > .task-customer-card-head{
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
    }

    .task-detail-body .task-customer-card-head .task-next-offer{
        border-top: 1px solid #e1e6eb !important;
    }
}

/* Noter: kompakt kundeområde, bilag og popup-værktøjer. */
.task-detail-body .task-workspace{
    grid-template-rows: minmax(0, 1fr) minmax(148px, 28vh) !important;
    gap: 8px;
}

.task-detail-body .task-workspace-grid{
    grid-template-columns: minmax(360px, 430px) minmax(0, 1fr);
    gap: 8px;
    overflow: visible;
}

.task-detail-body .task-workspace-fields{
    display: grid;
    width: auto;
    max-width: none;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 7px 8px;
    padding: 10px;
    align-content: start;
    border-radius: 5px;
}

.task-detail-body .task-workspace-fields > label,
.task-detail-body .task-customer-card-head{
    grid-column: 1 / -1;
}

.task-detail-body .task-address-row{
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) 78px;
    gap: 8px;
}

.task-detail-body .task-workspace-fields > label:nth-of-type(3),
.task-detail-body .task-workspace-fields > label:nth-of-type(4){
    grid-column: span 1;
}

.task-customer-card-head{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;
    padding-bottom: 9px;
    border-bottom: 1px solid #dfe5eb;
}

.task-detail-body .task-title-field{
    min-width: 0;
}

.task-detail-body .task-workspace-heading{
    min-width: 0;
    height: 30px;
    padding: 0 7px;
    border: 1px solid #c7d0da;
    border-radius: 3px;
    background: #fff;
    font-size: 14px;
    font-weight: 800;
}

.task-next-offer{
    display: grid;
    min-width: 108px;
    gap: 3px;
}

.task-detail-body .task-next-offer span{
    margin: 0;
}

.task-next-offer strong{
    display: flex;
    height: 30px;
    padding: 0 10px;
    border: 1px solid #b9cde0;
    border-radius: 3px;
    background: #edf5fc;
    color: #174f86;
    font-size: 13px;
    align-items: center;
    justify-content: center;
}

.task-detail-body .task-workspace-description{
    padding: 10px;
    border-radius: 5px;
}

.task-detail-body .task-workspace-description textarea{
    min-height: 0;
}

.workspace-actions .task-workspace-cancel{
    border-color: #c97570;
    background: #fff;
    color: #a52820;
}

.workspace-actions .task-workspace-cancel:hover{
    background: #fff1f0;
}

.task-detail-body .task-workspace-bottom{
    display: grid;
    min-height: 0;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 8px;
}

.task-attachment-tools{
    display: grid;
    grid-template-rows: repeat(3, minmax(0, 1fr));
    gap: 6px;
    min-height: 0;
}

.task-detail-body .task-attachment-tools button{
    display: flex;
    min-height: 0;
    padding: 7px 10px;
    border: 1px solid #c7d0da;
    border-radius: 5px;
    background: #fff;
    color: #26323d;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
    align-items: center;
    gap: 10px;
}

.task-detail-body .task-attachment-tools button:hover{
    border-color: #7da7cd;
    background: #f1f7fc;
    color: #174f86;
}

.task-attachment-tools svg{
    width: 21px;
    height: 21px;
    color: #2368aa;
    flex: 0 0 auto;
}

.task-detail-body .task-workspace-attachments{
    display: grid;
    min-height: 0;
    padding: 8px 10px 10px;
    grid-template-rows: auto minmax(0, 1fr);
    border-radius: 5px;
}

.task-attachment-dropzone{
    position: relative;
    min-height: 0;
    padding: 7px;
    overflow: auto;
    border: 1px dashed #bdc8d3;
    border-radius: 4px;
    background: #f9fbfc;
}

.task-attachment-dropzone.is-dragging{
    border-color: #2368aa;
    background: #eaf4fc;
}

.task-drop-hint{
    position: absolute;
    inset: 7px;
    display: none;
    border-radius: 3px;
    background: rgba(234, 244, 252, .96);
    color: #174f86;
    font-size: 15px;
    font-weight: 800;
    place-items: center;
}

.task-attachment-dropzone.is-dragging .task-drop-hint{
    display: grid;
}

.task-detail-body .task-workspace .task-detail-files{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
    gap: 7px;
}

.task-detail-body .task-attachment-item{
    display: grid;
    min-width: 0;
    min-height: 82px;
    padding: 5px;
    border: 1px solid #d5dde5;
    border-radius: 4px;
    background: #fff;
    color: #384553;
    cursor: pointer;
    grid-template-rows: minmax(0, 1fr) auto;
    place-items: center;
    gap: 4px;
}

.task-detail-body .task-attachment-item:hover{
    border-color: #7da7cd;
    box-shadow: 0 2px 7px rgba(35, 104, 170, .12);
}

.task-attachment-item img{
    width: 100%;
    height: 48px;
    object-fit: cover;
}

.task-attachment-item svg{
    width: 32px;
    height: 32px;
    color: #2368aa;
}

.task-attachment-item span{
    display: block;
    width: 100%;
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-popup{
    width: min(920px, calc(100vw - 32px));
    max-width: none;
    height: min(720px, calc(100vh - 32px));
    max-height: none;
    padding: 0;
    overflow: hidden;
    border: 1px solid #aebbc8;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .3);
}

.task-popup::backdrop{
    background: rgba(15, 23, 42, .5);
}

.task-popup[open]{
    display: grid;
}

.task-popup-bar{
    display: flex;
    min-height: 42px;
    padding: 6px 8px 6px 13px;
    border-bottom: 1px solid #d4dce4;
    background: #f5f7f9;
    align-items: center;
    justify-content: space-between;
}

.task-popup-bar strong{
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-attachment-browse{ margin-left:auto; display:flex; gap:3px; }
.task-popup-bar .task-attachment-browse button{ border:1px solid #cbd3dc; border-radius:3px; background:#fff; color:#245d8f; font-size:22px; line-height:1; }
.task-archive-delete{ display:inline-grid; width:31px; height:29px; padding:0; border:1px solid #efb5b5; border-radius:4px; background:#fff5f5; color:#b9232a; place-items:center; cursor:pointer; }
.task-archive-delete:hover{ border-color:#d42c33; background:#ffe7e7; }

.task-popup-bar button{
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #43505d;
    font-size: 24px;
    cursor: pointer;
}

.task-attachment-popup{
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.task-attachment-preview{
    display: grid;
    min-height: 0;
    padding: 12px;
    overflow: auto;
    background: #e9edf1;
    place-items: center;
}

.task-attachment-preview img{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    box-shadow: 0 2px 14px rgba(15, 23, 42, .16);
}

.task-attachment-preview iframe{
    width: 100%;
    height: 100%;
    border: 0;
    background: #fff;
}

.task-attachment-preview [data-task-attachment-fallback]{
    text-align: center;
}

.task-attachment-preview [data-task-attachment-fallback] svg{
    width: 54px;
    height: 54px;
    color: #2368aa;
}

.task-popup-download{
    margin: 8px 12px;
    justify-self: end;
}

.task-drawing-popup{
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.task-detail-body .task-drawing-popup .task-workspace-canvas{
    width: calc(100% - 24px);
    height: calc(100% - 24px);
    min-height: 0;
    margin: 12px;
    border-radius: 3px;
}

.task-drawing-popup .task-workspace-box-actions{
    padding: 8px 12px;
    border-top: 1px solid #d4dce4;
    justify-content: flex-end;
}

@media (max-width: 760px) {
    .task-detail-body .task-workspace{
        height: auto;
        min-width: 0;
        overflow: visible;
        grid-template-rows: auto auto !important;
    }

    .task-detail-body .task-workspace-grid,
.task-detail-body .task-workspace-bottom{
        grid-template-columns: minmax(0, 1fr);
    }

    .task-detail-body .task-workspace-bottom{
        display: grid;
    }

    .task-attachment-tools{
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-rows: auto;
    }

    .task-detail-body .task-attachment-tools button{
        justify-content: center;
        text-align: center;
    }
}

:is(.document-module-page, .send-module-page) .workspace-toolbar{
    margin-bottom: 4px !important;
}



/* Afsluttende justeringer: én Overblikslinje, ens lodret afstand og sikre skuffegreb. */
.workspace-toolbar{
    margin-bottom: 4px;
}

.page-list-toolbar + .panel{
    margin-top: 0 !important;
}

.calculation-notes-drawer{
    top: calc(50% - 76px);
}

.calculation-tools-drawer{
    top: calc(50% + 76px);
}

.calculation-side-drawer:not(.is-open){
    pointer-events: none;
}

.calculation-side-drawer:not(.is-open) .calculation-side-tab{
    pointer-events: auto;
}

.calculation-side-drawer:hover:not(.is-open),
.calculation-side-drawer:focus-within:not(.is-open){
    right: calc(0px - var(--calculation-drawer-width));
    z-index: 1400;
}

.calculation-side-drawer.is-open{
    right: 0;
    z-index: 1410;
    pointer-events: auto;
}

@media (max-width: 760px) {
    .calculation-notes-drawer{
        top: auto;
        bottom: 126px;
    }

    .calculation-tools-drawer{
        top: auto;
        bottom: 22px;
    }
}

/* Keep the desktop workspace structure inside narrow frames. */
.task-detail-body{
    overflow: auto;
}

.task-detail-body .task-workspace{
    min-width: 980px;
}

@media (max-width: 680px) {
    .task-detail-body .task-workspace{
        height: 100vh;
        overflow: hidden;
    }

    .task-detail-body .task-workspace-top,
.task-detail-body .task-workspace-title,
.task-detail-body .task-workspace-actions{
        flex-wrap: nowrap;
    }

    .task-detail-body .task-workspace-grid{
        grid-template-columns: 280px minmax(0, 1fr);
    }

    .task-detail-body .task-workspace-bottom{
        grid-template-columns: minmax(0, 1fr) 180px 180px;
    }
}

/* Leaner Excel-style task workspace */
.task-detail-body{
    background: #eef1f5;
    color: #1f2933;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 13px;
}

.task-detail-body .task-workspace{
    gap: 6px;
    padding: 6px;
}

.task-detail-body .task-workspace-top,
.task-detail-body .task-workspace-fields,
.task-detail-body .task-workspace-description,
.task-detail-body .task-workspace-box{
    border: 1px solid #cfd6df;
    border-radius: 2px;
    background: #ffffff;
    box-shadow: none;
}

.task-detail-body .task-workspace-top{
    min-height: 38px;
    padding: 4px 6px;
}

.task-detail-body .task-workspace-title,
.task-detail-body .task-workspace-actions{
    gap: 5px;
}

.task-detail-body .task-workspace-heading{
    height: 28px;
    color: #17212b;
    font-size: 15px;
    font-weight: 700;
    padding: 0 3px;
}

.task-detail-body .task-workspace-heading:focus{
    outline: 1px solid #2368aa;
    background: #ffffff;
}

.task-detail-body .task-workspace-offer,
.task-detail-body .task-workspace-save-button,
.task-detail-body .task-workspace-back,
.task-detail-body .task-workspace-box button{
    height: 28px;
    min-height: 28px;
    border-radius: 2px;
    padding: 0 9px;
    font-size: 12px;
    font-weight: 700;
}

.task-detail-body .task-workspace-owner,
.task-detail-body .task-workspace-status,
.task-detail-body .task-workspace-save{
    height: 28px;
    border-radius: 2px;
}

.task-detail-body .task-workspace-owner span,
.task-detail-body .task-workspace-fields span,
.task-detail-body .task-workspace-description > span{
    color: #53606d;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0;
}

.task-detail-body .task-workspace-owner select{
    height: 24px;
    font-size: 12px;
    font-weight: 700;
}

.task-detail-body .task-workspace-status{
    display: inline-flex;
    align-items: center;
    height: 28px;
    border: 1px solid var(--status-color);
    border-radius: 2px;
    background: color-mix(in srgb, var(--status-color) 10%, #ffffff);
}

.task-detail-body .task-workspace-status select{
    width: 132px;
    height: 26px;
    min-height: 26px;
    border: 0;
    background: transparent;
    padding: 0 7px;
    color: var(--status-color);
    font-size: 12px;
    font-weight: 800;
}

.task-detail-body .task-workspace-save{
    width: 86px;
    flex: 0 0 86px;
    color: #16833b;
    font-size: 11px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-detail-body .task-workspace-grid,
.task-detail-body .task-workspace-bottom{
    gap: 6px;
}

.task-detail-body .task-workspace-fields,
.task-detail-body .task-workspace-description,
.task-detail-body .task-workspace-box{
    padding: 6px;
}

.task-detail-body .task-workspace-fields{
    gap: 5px;
}

.task-detail-body .task-workspace-fields input,
.task-detail-body .task-workspace-description textarea{
    border: 1px solid #c7d0da;
    border-radius: 1px;
    background: #ffffff;
    color: #1f2933;
    font-size: 12px;
    font-weight: 400;
    box-shadow: none;
}

.task-detail-body .task-workspace-fields input{
    height: 26px;
    padding: 0 6px;
}

.task-detail-body .task-workspace-description textarea{
    padding: 6px;
    line-height: 1.35;
}

.task-detail-body .task-workspace-fields input:focus,
.task-detail-body .task-workspace-description textarea:focus{
    outline: 1px solid #2368aa;
    border-color: #2368aa;
}

.task-detail-body .task-workspace-box{
    min-height: 92px;
}

.task-detail-body .task-workspace-box h2{
    color: #26323d;
    font-size: 12px;
    font-weight: 700;
}

.task-detail-body .task-workspace-empty{
    color: #6b7280;
    font-size: 11px;
}

.task-detail-body .task-workspace-canvas{
    width: 100%;
    height: 140px;
    border: 1px solid #c7d0da;
    background: #ffffff;
    touch-action: none;
}

.task-detail-body .task-workspace-box-actions{
    display: flex;
    gap: 5px;
    align-items: center;
    flex-wrap: wrap;
}

.task-detail-body .address-field-wrap{
    position: relative;
}

.task-detail-body .address-suggestions{
    position: absolute;
    z-index: 40;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    max-height: 180px;
    overflow: auto;
    border: 1px solid #c7d0da;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.task-detail-body .address-suggestion{
    width: 100%;
    display: block;
    border: 0;
    border-bottom: 1px solid #e5e9ee;
    background: #ffffff;
    color: #1f2933;
    padding: 6px 8px;
    text-align: left;
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
}

.task-detail-body .address-suggestion:hover{
    background: #eef4fb;
}

.task-detail-body .task-workspace-offer-summary{
    border: 1px solid #cfd6df;
    border-radius: 2px;
    background: #ffffff;
    padding: 6px;
}

.task-detail-body .task-workspace-offer-summary{
    display: flex;
    align-items: center;
    gap: 12px;
    color: #26323d;
    font-size: 12px;
}

.task-detail-body .task-workspace-offer-summary strong{
    color: #2368aa;
}

.task-detail-body .task-workspace-offer-status{
    color: #a15c00;
    font-weight: 700;
}

.task-detail-body [data-task-detail-field].is-missing{
    border-color: #d92d20;
    outline: 1px solid #d92d20;
    background: #fff7f7;
}

.task-offer-number{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    max-width: 56px;
    margin-right: 5px;
    color: #2368aa;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.25;
    white-space: nowrap;
}

.task-document-numbers{
    display: inline-flex;
    gap: 5px;
    align-items: center;
    min-width: 0;
}

.task-document-numbers .task-offer-number{
    margin-right: 0;
}

.task-invoice-number{
    color: #8a4b08;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.offer-invoice-status{
    display: block;
    overflow: hidden;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-user-help{
    margin: 10px 0 0;
    color: var(--muted);
    font-size: 12px;
}

/* Indstillinger følger den fælles BygMak desktopskal og datatabel. */
.settings-page > .page-content{
    display: grid;
    align-content: start;
    gap: var(--bm-box-gap, 6px);
    padding: 0;
    overflow: auto;
}

.settings-page .panel{
    margin: 0;
    padding: var(--bm-content-box-padding, 10px);
    border: var(--bm-box-border-width, 1px) solid var(--bm-box-border-color, var(--line));
    border-radius: var(--bm-box-radius, 2px);
    box-shadow: none;
}

.settings-page .panel > .panel-title{
    min-height: var(--bm-mini-header-height, 30px);
    margin: calc(-1 * var(--bm-content-box-padding, 10px)) calc(-1 * var(--bm-content-box-padding, 10px)) 10px;
    padding: 0 var(--bm-data-header-padding-x, 8px);
    border-bottom: 1px solid var(--bm-box-border-color, var(--line));
    background: var(--bm-mini-header-bg, #eef3f9);
}

.settings-page .panel > .panel-title h2{
    font-size: 12px;
    font-weight: 700;
}

.settings-page .settings-overview{
    grid-template-columns: minmax(520px, 1.6fr) minmax(300px, 1fr) minmax(220px, .7fr);
    gap: var(--bm-box-gap, 6px);
}

.settings-page .settings-company-block{
    padding: 8px;
    border-color: var(--bm-box-border-color, var(--line));
    border-radius: var(--bm-box-radius, 2px);
    background: var(--bygmak-surface, #fff);
}

.settings-page :is(input, select){
    min-height: var(--bm-control-height, 30px);
    border-radius: var(--bygmak-radius, 4px);
    font-size: var(--bm-form-control-font-size, 12px);
    font-weight: var(--bm-form-control-font-weight, 400);
}

.settings-role-choice{
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: var(--bm-control-height, 30px);
    margin: 0;
    padding: 3px 8px;
    border: 1px solid var(--bygmak-border, #cbd3dc);
    border-radius: var(--bygmak-radius, 4px);
}

.settings-role-choice legend{
    padding: 0 3px;
    color: var(--bygmak-muted, #66737f);
    font-size: var(--bm-form-label-font-size, 11px);
    font-weight: var(--bm-form-label-font-weight, 700);
}

.settings-role-choice label,
.settings-page .checkline{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--bygmak-text, #26323d);
    font-size: 12px;
    font-weight: 400;
    white-space: nowrap;
}

.settings-page input:is([type="checkbox"], [type="radio"]){
    width: 14px;
    height: 14px;
    min-height: 14px;
    margin: 0;
    padding: 0;
    accent-color: var(--bygmak-primary, #2368aa);
}

.settings-users-table-wrap{
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--bm-box-border-color, var(--line));
    border-radius: var(--bm-box-radius, 2px);
}

.settings-users-table{
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    table-layout: fixed;
}

.settings-users-table th{
    height: var(--bm-data-header-height, 30px);
    padding: 0 7px;
    border-bottom: 1px solid var(--bm-box-border-color, var(--line));
    background: var(--bm-data-header-bg, #e8eef5);
    color: var(--bm-data-header-text, #26323d);
    font-size: 11px;
    font-weight: 700;
    text-align: left;
}

.settings-users-table th:nth-child(n+4):nth-child(-n+7){ text-align: center; }
.settings-users-table th:nth-child(1){ width: 15%; }
.settings-users-table th:nth-child(2){ width: 8%; }
.settings-users-table th:nth-child(3){ width: 20%; }
.settings-users-table th:nth-child(4),
.settings-users-table th:nth-child(5),
.settings-users-table th:nth-child(6){ width: 6%; }
.settings-users-table th:nth-child(7){ width: 9%; }
.settings-users-table th:nth-child(8){ width: 12%; }
.settings-users-table th:nth-child(9){ width: 18%; }

.settings-users-table td{
    height: 42px;
    padding: 5px 7px;
    border-bottom: 1px solid var(--bygmak-border-soft, #e1e6eb);
    vertical-align: middle;
}

.settings-users-table tbody tr:last-child td{ border-bottom: 0; }
.settings-users-table tbody tr:hover{ background: var(--bygmak-primary-soft, #f0f7ff); }
.settings-users-table td > input:not([type="checkbox"]):not([type="radio"]){ width: 100%; }
.settings-choice-cell{ text-align: center; }
.settings-users-table td small{ display: block; margin-top: 2px; color: var(--bygmak-muted, #66737f); font-size: 10px; }
.settings-master-indicator{ display: inline-flex; min-height: 22px; align-items: center; padding: 0 7px; border-radius: 999px; background: var(--bygmak-primary-soft, #f0f7ff); color: var(--bygmak-primary, #2368aa); font-size: 11px; font-weight: 700; }
.settings-empty{ color: var(--bygmak-muted, #66737f); }
.settings-row-actions{
    display: grid;
    grid-template-columns: 72px 92px;
    align-items: center;
    justify-content: end;
    gap: var(--bm-control-gap, 6px);
    white-space: nowrap;
}
.settings-row-actions .btn{ width: 100%; justify-content: center; }
.settings-role-help{ margin: 7px 0 0; color: var(--bygmak-muted, #66737f); font-size: 11px; font-weight: 400; }
.settings-access-state{ display: block; width: 100%; color: var(--bygmak-muted, #66737f); font-size: 11px; font-weight: 400; text-align: center; }



.calculation-embed-page{
    margin: 0;
    background: #eef1f5;
}

.calculation-embed-shell{
    min-height: 100vh;
    padding: 6px;
}

.calculation-embed-page .split-workspace{
    margin: 0;
}

.calculation-mobile-landscape .workspace-toolbar{ display: none !important; }
.calculation-mobile-landscape .calculation-side-drawer{
    display: none !important;
}
html.calculation-mobile-landscape-root{
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #fff;
}
body.calculation-mobile-landscape{
    --mobile-calc-canvas-width: 1180px;
    --mobile-calc-canvas-height: 100vh;
    --mobile-calc-scale: 1;
    --mobile-calc-visual-width: 100vw;
    position: fixed;
    top: 0;
    left: 0;
    width: var(--mobile-calc-canvas-width);
    height: var(--mobile-calc-canvas-height) !important;
    min-height: 0 !important;
    overflow: auto;
    transform: scale(var(--mobile-calc-scale));
    transform-origin: top left;
}
.calculation-mobile-landscape .calculation-embed-shell{
    display: flex;
    width: 100%;
    min-width: 1180px;
    height: 100%;
    min-height: 0;
    padding: 4px;
    flex-direction: column;
    overflow: visible;
}
.calculation-mobile-landscape .calculation-embed-shell > .split-workspace{
    flex: 1 1 0 !important;
    height: 100% !important;
    overflow: hidden;
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 0;
}
.calculation-mobile-landscape .calculation-workspace-body{
    min-height: 0;
    height: 100%;
    padding: 4px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.settings-download-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.settings-download-row > .panel { width: 100%; max-width: none; min-width: 0; }
.settings-download-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; border: 1px solid var(--bygmak-shell-box-border); }
.settings-download-choices label { display: flex; align-items: center; gap: 6px; }
.settings-download-choices input { width: auto; min-height: 0; margin: 0; }
.calculation-mobile-landscape .bygmak-calculation .summary-grid{
    grid-template-columns: minmax(0, 1fr) 210px !important;
}
.calculation-mobile-landscape .bygmak-calculation .summary-overview-grid{
    grid-template-columns: minmax(174px, 1fr) minmax(174px, 1fr) minmax(188px, 1.08fr) minmax(116px, .62fr) minmax(122px, .66fr) !important;
}

@media (orientation: portrait) and (max-width: 900px){
    body.calculation-mobile-landscape{
        transform: translateY(var(--mobile-calc-visual-width)) rotate(-90deg) scale(var(--mobile-calc-scale));
    }
}





/* Fælles projektarbejdsområde */
:root{
    --workspace-bg: var(--bg);
    --workspace-panel-bg: var(--surface);
    --workspace-border: var(--line);
    --workspace-text: var(--text);
    --workspace-muted-text: var(--muted);
    --workspace-radius: var(--bygmak-radius);
    --workspace-shadow: var(--shadow);
    --workspace-gap: 12px;
    --workspace-panel-padding: 14px;
    --workspace-input-height: 34px;
    --workspace-button-height: 34px;
    --workspace-font-size: 13px;
    --workspace-label-size: 11px;
}

.workspace-tabs,
.workspace-actions,
.workspace-actions .task-workspace-actions{
    display: flex;
    align-items: center;
}

.table-link-row{
    cursor: pointer;
}

.table-link-row:hover{
    background: #f3f6f8;
}

.workspace-toolbar{
    position: relative;
    z-index: 12;
    display: flex;
    min-height: 52px;
    margin: 0 0 var(--workspace-gap);
    border: 1px solid var(--workspace-border);
    border-radius: var(--workspace-radius);
    background: var(--workspace-panel-bg);
    box-shadow: 0 3px 10px rgba(28, 38, 48, .06);
    align-items: center;
    justify-content: space-between;
    gap: var(--workspace-gap);
    padding: 7px;
}

.workspace-tabs{
    min-width: 0;
    gap: 4px;
}

.workspace-tab{
    display: inline-flex;
    min-height: var(--workspace-button-height);
    padding: 7px 14px;
    border: 1px solid transparent;
    border-radius: 4px;
    color: var(--workspace-muted-text);
    font-weight: 700;
    align-items: center;
    justify-content: center;
}

.workspace-tab:hover{
    border-color: var(--workspace-border);
    background: #f3f6f8;
    color: var(--workspace-text);
}

.workspace-tab.is-active{
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
}

.workspace-actions,
.workspace-actions .task-workspace-actions{
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.workspace-actions .task-workspace-actions{
    padding: 0;
    border: 0;
    background: transparent;
}

.workspace-button,
.workspace-actions .task-workspace-save-button,
.workspace-actions .task-workspace-back{
    display: inline-flex;
    width: auto;
    min-height: var(--workspace-button-height);
    padding: 6px 12px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    font-weight: 700;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.workspace-button-primary,
.workspace-actions .task-workspace-save-button{
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
}

.workspace-button-secondary,
.workspace-actions .task-workspace-back{
    background: #fff;
    color: var(--workspace-text);
}

.workspace-button:disabled{
    cursor: not-allowed;
    opacity: .55;
}

.workspace-save-status{
    min-width: 42px;
    color: var(--workspace-muted-text);
    font-size: 11px;
    white-space: nowrap;
}

.workspace-leave-dialog{
    width: min(440px, calc(100vw - 32px));
    box-sizing: border-box;
    padding: 24px;
    border: 1px solid var(--line-dark);
    border-radius: 8px;
    background: #fff;
    color: var(--workspace-text);
    box-shadow: 0 16px 48px #0003;
}

.workspace-leave-dialog::backdrop{ background: #0006; }
.workspace-leave-dialog h2{ margin: 0 0 12px; font-size: 20px; }
.workspace-leave-dialog p{ margin: 0 0 20px; }
.workspace-leave-dialog [role="alert"]{ color: #b42318; }
.workspace-leave-actions{ display: flex; flex-wrap: wrap; gap: 8px; }

.workspace-save-status.is-saved{
    color: #157347;
    font-weight: 800;
}

.workspace-save-status.is-unsaved{
    color: #b42318;
    font-weight: 800;
}

.workspace-save-status.is-error{
    color: #b42318;
    font-weight: 800;
}

.workspace-calculation-actions,
.roof-toolbar-actions{
    display: flex;
    align-items: center;
    gap: 6px;
}

.workspace-calculation-actions[hidden],
.roof-toolbar-actions[hidden]{
    display: none !important;
}

.workspace-save-split{
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
}

.workspace-save-split .workspace-save-main{
    border-radius: 4px 0 0 4px;
}

.workspace-save-split .workspace-save-arrow{
    width: 28px;
    min-width: 28px;
    padding-right: 0;
    padding-left: 0;
    border-left-color: rgba(255, 255, 255, .35);
    border-radius: 0 4px 4px 0;
}

.workspace-save-menu{
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 220;
    min-width: 174px;
    padding: 5px;
    border: 1px solid var(--workspace-border);
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(20, 28, 36, .2);
}

.workspace-save-menu[hidden]{ display: none !important; }
.workspace-save-menu button{
    width: 100%;
    min-height: 31px;
    padding: 6px 9px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: var(--workspace-text);
    text-align: left;
    cursor: pointer;
}
.workspace-save-menu button:hover{ background: #eef5fb; }

.workspace-actions select{
    width: auto;
    min-height: var(--workspace-input-height);
}

.workspace-panel,
.workspace-card{
    padding: var(--workspace-panel-padding);
    border: 1px solid var(--workspace-border);
    border-radius: var(--workspace-radius);
    background: var(--workspace-panel-bg);
    box-shadow: 0 2px 8px rgba(28, 38, 48, .05);
}

.mobile-project-terminal{
    display: none;
}

@media (max-width: 980px) {
    .workspace-toolbar{
        align-items: stretch;
        flex-direction: column;
        padding: 6px;
    }

    .workspace-tabs{
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .workspace-tab{
        min-width: 0;
        padding: 7px 4px;
        font-size: 11px;
    }

    .workspace-actions,
.workspace-actions .task-workspace-actions{
        justify-content: flex-start;
    }
}

@media (max-width: 680px) {
    .calculate-page .split-workspace{
        overflow-x: auto;
    }
}

@media print {
    .workspace-toolbar{
        display: none !important;
    }
}

/* Beregn: genskab den originale kompakte lønramme og højre sidefaner. */
.calculate-page,
.task-detail-body,
.document-module-page{
    background: var(--workspace-bg) !important;
}

.workspace-toolbar{
    box-sizing: border-box;
    height: 50px;
    min-height: 50px;
    max-height: 50px;
    margin-bottom: 6px;
}

.task-detail-body .task-workspace{
    grid-template-rows: 50px auto minmax(0, 1fr) auto !important;
}

.calculation-embed-page .split-workspace{
    flex: 1 1 auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
    height: auto !important;
    background: var(--workspace-bg) !important;
}

.calculation-embed-page .calculation-workspace{
    border-color: var(--workspace-border) !important;
    background: var(--workspace-panel-bg) !important;
    box-shadow: var(--workspace-shadow) !important;
}

.calculate-page .summary-panel,
.calculation-embed-page .summary-panel{
    padding: 7px !important;
    border-color: var(--workspace-border) !important;
    background: var(--workspace-panel-bg) !important;
}

.calculate-page .summary-panel .summary-grid,
.calculation-embed-page .summary-panel .summary-grid{
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.calculate-page .summary-panel .summary-output-box,
.calculation-embed-page .summary-panel .summary-output-box{
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.calculate-page .summary-panel .summary-overview-grid,
.calculation-embed-page .summary-panel .summary-overview-grid{
    display: grid !important;
    grid-template-columns: repeat(3, minmax(190px, 1fr)) minmax(190px, .9fr) minmax(204px, 1fr) !important;
    grid-template-rows: repeat(4, 21px) !important;
    grid-auto-rows: 21px !important;
    column-gap: clamp(4px, 1vw, 18px) !important;
    row-gap: 3px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

.calculate-page .summary-panel .summary-overview-grid > .summary-item,
.calculation-embed-page .summary-panel .summary-overview-grid > .summary-item{
    box-sizing: border-box !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 21px !important;
    min-height: 21px !important;
    max-height: 21px !important;
    margin: 0 !important;
    padding: 0 7px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(123, 153, 180, .25) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 5px !important;
    overflow: hidden !important;
}

.calculate-page .summary-panel .summary-facts-column,
.calculation-embed-page .summary-panel .summary-facts-column{
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) !important;
    grid-template-rows: repeat(4, 21px) !important;
    column-gap: 8px !important;
    row-gap: 3px !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-row: 1 / 5 !important;
}

.calculate-page .summary-panel .summary-overview-grid > .summary-facts-column:nth-child(1),
.calculation-embed-page .summary-panel .summary-overview-grid > .summary-facts-column:nth-child(1){ grid-column: 1 !important; }
.calculate-page .summary-panel .summary-overview-grid > .summary-facts-column:nth-child(2),
.calculation-embed-page .summary-panel .summary-overview-grid > .summary-facts-column:nth-child(2){ grid-column: 2 !important; }
.calculate-page .summary-panel .summary-overview-grid > .summary-facts-column:nth-child(3),
.calculation-embed-page .summary-panel .summary-overview-grid > .summary-facts-column:nth-child(3){ grid-column: 3 !important; }

.calculate-page .summary-panel .summary-facts-column > .summary-item,
.calculation-embed-page .summary-panel .summary-facts-column > .summary-item{
    display: contents !important;
}

.calculate-page .summary-panel .summary-facts-column .summary-label,
.calculate-page .summary-panel .summary-facts-column .summary-value,
.calculation-embed-page .summary-panel .summary-facts-column .summary-label,
.calculation-embed-page .summary-panel .summary-facts-column .summary-value{
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 21px !important;
    padding: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    border-bottom: 1px solid rgba(123, 153, 180, .25) !important;
    line-height: 21px !important;
    white-space: nowrap !important;
}

.calculate-page .summary-panel .summary-facts-column .summary-label,
.calculation-embed-page .summary-panel .summary-facts-column .summary-label{
    text-align: left !important;
}

.calculate-page .summary-panel .summary-facts-column .summary-value,
.calculation-embed-page .summary-panel .summary-facts-column .summary-value{
    text-align: left !important;
}

.calculate-page .summary-panel .summary-workforce-column,
.calculation-embed-page .summary-panel .summary-workforce-column{
    box-sizing: border-box !important;
    display: grid !important;
    grid-column: 4 !important;
    grid-row: 1 / 5 !important;
    grid-template-columns: max-content minmax(100px, 1fr) !important;
    grid-template-rows: repeat(4, 21px) !important;
    column-gap: 8px !important;
    row-gap: 3px !important;
    width: 100% !important;
    min-width: 0 !important;
    padding-left: 10px !important;
    border-left: 2px solid #7894ad !important;
    justify-self: start !important;
    justify-content: start !important;
}

.calculate-page .summary-panel .summary-workforce-column > .summary-item.summary-item-workforce,
.calculation-embed-page .summary-panel .summary-workforce-column > .summary-item.summary-item-workforce{
    display: contents !important;
}

.calculate-page .summary-panel .summary-workforce-column .summary-label,
.calculate-page .summary-panel .summary-workforce-column .summary-value,
.calculation-embed-page .summary-panel .summary-workforce-column .summary-label,
.calculation-embed-page .summary-panel .summary-workforce-column .summary-value{
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 21px !important;
    padding: 0 !important;
    overflow: visible !important;
    text-overflow: clip !important;
    border-bottom: 1px solid rgba(123, 153, 180, .25) !important;
    line-height: 21px !important;
    white-space: nowrap !important;
}

.calculate-page .summary-panel .summary-workforce-column .summary-label,
.calculation-embed-page .summary-panel .summary-workforce-column .summary-label{
    text-align: left !important;
}

.calculate-page .summary-panel .summary-workforce-column .summary-value,
.calculation-embed-page .summary-panel .summary-workforce-column .summary-value{
    text-align: left !important;
}

.calculate-page .summary-panel .summary-overview-grid > .summary-item.summary-setting-item,
.calculation-embed-page .summary-panel .summary-overview-grid > .summary-item.summary-setting-item{
    grid-column: 5 !important;
    display: grid !important;
    grid-template-columns: 118px 78px !important;
    justify-content: start !important;
    justify-self: start !important;
    width: 100% !important;
    min-width: 0 !important;
    column-gap: 8px !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(123, 153, 180, .36) !important;
    border-radius: 0 !important;
}

.calculate-page .summary-panel .summary-setting-row-1,
.calculation-embed-page .summary-panel .summary-setting-row-1{ grid-row: 1 !important; }
.calculate-page .summary-panel .summary-setting-row-2,
.calculation-embed-page .summary-panel .summary-setting-row-2{ grid-row: 2 !important; }
.calculate-page .summary-panel .summary-setting-row-3,
.calculation-embed-page .summary-panel .summary-setting-row-3{ grid-row: 3 !important; }
.calculate-page .summary-panel .summary-setting-row-4,
.calculation-embed-page .summary-panel .summary-setting-row-4{ grid-row: 4 !important; }

.calculate-page .summary-panel .summary-setting-label,
.calculation-embed-page .summary-panel .summary-setting-label{
    all: unset !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
    color: #4f5963 !important;
    font-family: inherit !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-align: left !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.calculate-page .summary-panel .summary-setting-input,
.calculation-embed-page .summary-panel .summary-setting-input{
    all: unset !important;
    box-sizing: border-box !important;
    flex: 0 0 78px !important;
    width: 78px !important;
    max-width: 100% !important;
    height: 17px !important;
    padding: 0 5px !important;
    border: 1px solid #9ba6af !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #1f252b !important;
    font-family: inherit !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 15px !important;
    text-align: right !important;
}

.calculate-page .summary-panel .summary-setting-input:focus,
.calculation-embed-page .summary-panel .summary-setting-input:focus{
    border-color: var(--blue) !important;
    outline: 1px solid rgba(36, 95, 159, .22) !important;
}

.calculate-page .summary-panel,
.calculate-page .summary-panel .summary-label,
.calculate-page .summary-panel .summary-value,
.calculate-page .summary-panel .summary-setting-label,
.calculate-page .summary-panel input,
.calculation-embed-page .summary-panel,
.calculation-embed-page .summary-panel .summary-label,
.calculation-embed-page .summary-panel .summary-value,
.calculation-embed-page .summary-panel .summary-setting-label,
.calculation-embed-page .summary-panel input{
    color: #000000 !important;
}

.calculate-page .calculation-card,
.calculation-embed-page .calculation-card{
    border-color: var(--workspace-border) !important;
    border-radius: var(--workspace-radius) !important;
    background: var(--workspace-panel-bg) !important;
    box-shadow: 0 2px 8px rgba(28, 38, 48, .05) !important;
}

.calculation-side-drawer{
    --calculation-drawer-width: min(360px, calc(100vw - 58px));
    position: fixed;
    right: calc(0px - var(--calculation-drawer-width));
    z-index: 1400;
    display: flex;
    width: calc(var(--calculation-drawer-width) + 34px);
    max-height: 70vh;
    align-items: center;
    transform: translateY(-50%);
    transition: right .18s ease, top .18s ease;
}

.calculation-side-drawer[hidden]{
    display: none !important;
}

.calculation-notes-drawer{ top: calc(50% - 123px); }
.calculation-tools-drawer{ top: calc(50% - 41px); }
.calculation-roof-drawer{ top: calc(50% + 41px); }

.calculation-side-drawer.is-open{
    right: 0;
    z-index: 1410;
}

.calculation-side-tab{
    box-sizing: border-box !important;
    flex: 0 0 34px;
    width: 34px !important;
    min-width: 34px !important;
    height: 78px !important;
    min-height: 78px !important;
    margin: 0 !important;
    padding: 9px 7px !important;
    border: 1px solid var(--blue-dark) !important;
    border-right: 0 !important;
    border-radius: 7px 0 0 7px !important;
    background: var(--blue) !important;
    box-shadow: -2px 2px 8px rgba(0, 0, 0, .16) !important;
    color: #fff !important;
    cursor: pointer;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    writing-mode: vertical-rl;
}

.calculation-side-panel{
    box-sizing: border-box;
    flex: 0 0 var(--calculation-drawer-width);
    width: var(--calculation-drawer-width);
    max-height: 70vh;
    overflow: auto;
    padding: 12px 14px 14px;
    border: 1px solid var(--workspace-border);
    border-right: 0;
    border-radius: 7px 0 0 7px;
    background: var(--workspace-panel-bg);
    box-shadow: -5px 5px 18px rgba(0, 0, 0, .18);
}

.calculation-side-heading{
    margin: 0 0 8px;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--workspace-border);
    font-size: 12px;
    font-weight: 700;
}

.calculation-roof-summary dl{
    display: grid;
    gap: 0;
    margin: 0 0 12px;
}

.calculation-roof-summary dl > div{
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
    padding: 6px 0;
    border-bottom: 1px solid var(--workspace-border);
}

.calculation-roof-summary dt{
    color: var(--workspace-muted-text);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.calculation-roof-summary dd{
    margin: 0;
    font-weight: 700;
    text-align: left;
}
.calculation-roof-empty{ color: var(--workspace-muted-text); }
.calculation-roof-metrics{
    padding-top: 8px;
    border-top: 1px solid var(--workspace-border);
    color: var(--workspace-text);
    font-size: 11px;
    line-height: 1.45;
    white-space: pre-line;
}
.calculation-roof-drawer .calculation-side-panel{ scrollbar-width: none; }
.calculation-roof-drawer .calculation-side-panel::-webkit-scrollbar{ display: none; }

.calculation-notes-textarea{
    display: block;
    width: 100%;
    min-height: 210px;
    max-height: 52vh;
    resize: vertical;
}

.calculation-notes-actions{
    display: flex;
    min-height: 34px;
    margin-top: 9px;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.calculation-notes-close{
    margin-right: auto;
    padding: 2px 0;
    border: 0;
    background: transparent;
    color: var(--workspace-muted-text);
    cursor: pointer;
    font: inherit;
    font-size: 10.5px;
    text-decoration: underline;
}

.calculation-version-dropdown{ position: relative; flex: 0 0 auto; }
.calculate-page .workspace-toolbar:has(.calculation-version-dropdown[open]){ z-index: 1420; }
.calculation-version-dropdown > summary{
    display: inline-flex;
    min-height: 30px;
    box-sizing: border-box;
    padding: 6px 12px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    background: #fff;
    color: #26394c;
    align-items: center;
    cursor: pointer;
    font-weight: 700;
    list-style: none;
}
.calculation-version-dropdown > summary::-webkit-details-marker{ display: none; }
.calculation-version-dropdown > summary::after{ content: "\25be"; margin-left: 7px; color: #607386; font-size: 10px; }
.calculation-version-dropdown[open] > summary{ border-color: #7ca8d0; background: #f3f8fd; }
.calculation-version-dropdown[open] > summary::after{ transform: rotate(180deg); }
.calculation-version-menu{
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 220;
    width: min(330px, calc(100vw - 20px));
    overflow: hidden;
    border: 1px solid var(--workspace-border);
    border-radius: 6px;
    background: var(--workspace-panel-bg);
    box-shadow: 0 12px 30px rgba(20, 28, 36, .22);
}
.calculation-version-menu-head{ display: flex; padding: 8px 10px; border-bottom: 1px solid var(--workspace-border); align-items: center; justify-content: space-between; gap: 10px; }
.calculation-version-menu-head span{ color: var(--workspace-muted-text); font-size: 10px; }
.calculation-version-list{ display: grid; max-height: min(420px, calc(100vh - 120px)); padding: 6px; overflow: auto; gap: 4px; }
.calculation-version-row{ display: grid; grid-template-columns: minmax(0, 1fr) 28px; gap: 4px; }
.calculation-version-item{ display: flex; min-width: 0; min-height: 42px; padding: 7px 9px; border: 1px solid #d5dee7; border-radius: 4px; background: #fff; color: #26394c; text-decoration: none; align-items: center; justify-content: space-between; gap: 12px; }
.calculation-version-item:hover{ border-color: #7ca8d0; background: #f3f8fd; }
.calculation-version-item.is-open{ border-color: #237467; background: #eef8f5; }
.calculation-version-item span{ color: var(--workspace-muted-text); font-size: 10px; white-space: nowrap; }
.calculation-version-delete{ align-self: stretch; border: 1px solid #efb5b5; border-radius: 4px; background: #fff5f5; color: #bf2026; font: 700 18px/1 Arial, sans-serif; cursor: pointer; }
.calculation-version-delete:hover{ border-color: #d42c33; background: #ffe8e8; }
.calculation-version-delete:disabled{ cursor: wait; opacity: .55; }
.calculation-version-empty{ margin: 0; padding: 14px 10px; color: var(--workspace-muted-text); text-align: center; }

.calculation-table .index-cell{
    position: relative;
}

.calculation-row-insert{
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    display: grid;
    width: 16px;
    height: 16px;
    padding: 0;
    border: 1px solid #6f8da7;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(20, 35, 50, .18);
    color: #245f9f;
    cursor: pointer;
    font: 700 13px/14px "Open Sans", Arial, sans-serif;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%);
    place-items: center;
}

.calculation-table .index-cell:hover .calculation-row-insert,
.calculation-row-insert:focus-visible{
    opacity: 1;
    pointer-events: auto;
}

.calculation-row-insert:hover{ border-color: #245f9f; background: #eaf3fb; }

@media (hover: none) {
    .calculation-row-insert{ opacity: .55; pointer-events: auto; }
}

.calculation-notes-status{
    margin-right: 0;
    color: var(--workspace-muted-text);
    font-size: 10.5px;
}

.calculation-notes-status.is-error{ color: var(--red); }
.calculation-tools-grid{ display: grid; gap: 7px; }
.calculation-tool-button{ width: 100%; text-align: left; }

.has-fastener-modal{ overflow: hidden; }
.document-modal-backdrop[hidden]{ display:none !important; }
.fastener-calculator-backdrop,
.swedoor-lookup-backdrop,
.gavl-facade-backdrop{
    box-sizing: border-box;
    position: fixed;
    inset: 0;
    z-index: 1600;
    display: block;
    padding: 0;
    background: transparent;
    pointer-events: none;
}

.fastener-calculator-modal{
    position: absolute;
    top: 88px;
    right: 64px;
    width: min(480px, calc(100vw - 28px));
    max-height: min(86vh, 720px);
    padding: 0;
    border: 1px solid var(--workspace-border);
    background: #fff;
    box-shadow: 0 18px 48px rgba(20, 28, 36, .28);
    pointer-events: auto;
}

.fastener-calculator-header{
    display: flex;
    padding: 14px 16px 11px;
    border-bottom: 1px solid var(--workspace-border);
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.fastener-calculator-header h2{
    margin: 0;
    color: var(--blue-dark);
    font-size: 18px;
}

.fastener-calculator-close{
    display: inline-flex;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid var(--workspace-border);
    border-radius: 4px;
    background: #fff;
    color: var(--workspace-text);
    cursor: pointer;
    font-size: 22px;
    line-height: 1;
    align-items: center;
    justify-content: center;
}

.fastener-calculator-fields{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 15px 16px;
}

.fastener-field,
.fastener-mode{
    display: grid;
    min-width: 0;
    margin: 0;
    gap: 5px;
}

.fastener-field-wide,
.fastener-mode,
.fastener-custom-size{ grid-column: 1 / -1; }

.fastener-field > span,
.fastener-mode legend{
    padding: 0;
    color: var(--workspace-muted-text);
    font-size: var(--workspace-label-size);
    font-weight: 700;
}

.fastener-field input,
.fastener-field select{
    box-sizing: border-box;
    width: 100%;
    min-height: var(--workspace-input-height);
    padding: 6px 9px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    background: #fff;
    color: var(--workspace-text);
}

.fastener-field input:focus,
.fastener-field select:focus{
    border-color: var(--blue);
    outline: 2px solid rgba(36, 95, 159, .16);
}

.fastener-custom-size{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.fastener-custom-size[hidden],
.fastener-field[hidden],
.fastener-mode[hidden]{ display: none; }

.fastener-mode{
    grid-template-columns: repeat(2, max-content);
    padding: 0;
    border: 0;
    column-gap: 18px;
}

.fastener-mode legend{ margin-bottom: 5px; }
.fastener-mode label{ display: inline-flex; align-items: center; gap: 5px; }
.fastener-mode input[type="radio"]{
    box-sizing: border-box;
    flex: 0 0 16px;
    width: 16px !important;
    min-width: 16px;
    max-width: 16px;
    height: 16px;
    min-height: 16px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    accent-color: var(--blue);
    -webkit-appearance: auto;
    appearance: auto;
}

.fastener-mode input[type="radio"]:focus{
    border: 0;
    outline: 2px solid rgba(36, 95, 159, .2);
    outline-offset: 2px;
}

.fastener-result{
    display: block;
    margin: 0 16px 16px;
    padding: 13px 14px;
    border: 1px solid #b8c9da;
    border-radius: 5px;
    background: #eef3f8;
}

.fastener-result-heading{
    display: block;
    margin-bottom: 4px;
    color: var(--workspace-muted-text);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.fastener-result strong{
    color: var(--blue-dark);
    font-size: 18px;
    line-height: 1.55;
}

.roof-calculator-backdrop{
    z-index: 1600;
    padding: 12px;
}

.roof-calculator-modal{
    display: flex;
    width: min(1500px, calc(100vw - 24px));
    height: calc(100vh - 24px);
    max-height: none;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--workspace-border);
    box-shadow: 0 18px 48px rgba(20, 28, 36, .3);
    flex-direction: column;
}

.roof-calculator-frame{
    display: block;
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    border: 0;
    background: #f3f5f7;
}

.calculate-page .calculation-workspace[hidden],
.calculation-embed-page .calculation-workspace[hidden]{
    display: none !important;
}

.calculate-page .roof-calculator-page,
.calculation-embed-page .roof-calculator-page{
    padding: 0 !important;
}

.roof-calculator-page-header{
    flex: 0 0 auto;
}

.velux-helper-modal{
    width: min(980px, calc(100vw - 24px));
    height: min(900px, calc(100vh - 24px));
    background: #f4f5f6;
}

.gavl-facade-backdrop{
    z-index: 1700;
    display: block;
    padding: 0;
    background: transparent;
    pointer-events: none;
}

.gavl-facade-modal{
    position: absolute;
    top: 76px;
    right: 24px;
    display: flex;
    width: min(1180px, calc(100vw - 16px));
    height: min(850px, calc(100dvh - 8px));
    padding: 0;
    overflow: hidden;
    flex-direction: column;
    background: #f4f5f6;
    pointer-events: auto;
}

.gavl-facade-header{
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
}

.gavl-facade-actions{ display: flex; align-items: center; gap: 8px; }
.gavl-facade-clear{ min-height: 32px; padding: 5px 10px; }

.gavl-facade-frame{
    display: block;
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    border: 0;
    background: #eef3f6;
}

.dimension-lookup-backdrop{
    z-index: 1600;
    padding: 12px;
}

.dimension-lookup-modal{
    display: flex;
    width: min(860px, calc(100vw - 24px));
    max-height: calc(100vh - 24px);
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--workspace-border);
    box-shadow: 0 18px 48px rgba(20, 28, 36, .3);
    flex-direction: column;
}

.dimension-lookup-content{
    overflow-y: auto;
    padding: 12px 16px 16px;
}

.dimension-tabs{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.dimension-tabs .dimension-choice{ width: 100%; }

.dimension-control-section,
.dimension-lookup-section{
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid var(--workspace-border);
}

.dimension-control-section h3,
.dimension-lookup-section h3{
    margin: 0 0 9px;
    color: var(--workspace-text);
    font-size: 13px;
}

.dimension-control-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.dimension-input-field,
.dimension-choice-field,
.dimension-angle-field{
    display: grid;
    min-width: 0;
    gap: 5px;
}

.dimension-angle-field[hidden]{ display: none; }

.dimension-input-field > span,
.dimension-choice-field > span,
.dimension-angle-field > span{
    color: var(--workspace-muted-text);
    font-size: var(--workspace-label-size);
    font-weight: 700;
}

.dimension-input-field input{
    box-sizing: border-box;
    width: 100%;
    min-height: 42px;
    padding: 6px 9px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    background: #fff;
    color: var(--workspace-text);
    font-size: 15px;
}

.dimension-input-field input:focus{
    border-color: var(--blue);
    outline: 2px solid rgba(36, 95, 159, .16);
}

.dimension-choice-grid{
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
}

.dimension-choice{
    width: 100%;
    min-width: 0;
    min-height: 40px;
    padding: 5px 6px;
}

.dimension-choice.is-compact{
    width: auto;
    min-width: 66px;
    min-height: 32px;
}

.dimension-choice.is-active{
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
    box-shadow: inset 0 0 0 1px var(--blue-dark);
}

.dimension-choice-field{ margin-top: 10px; }
.dimension-angle-choices{ display: flex; flex-wrap: wrap; gap: 5px; }

.dimension-bonus{
    display: grid;
    margin-top: 3px;
    padding: 8px 9px;
    border: 1px solid #bcd3ca;
    border-radius: var(--workspace-radius);
    background: #f1f8f5;
    gap: 2px;
}

.dimension-bonus[hidden]{ display: none; }
.dimension-bonus small{ color: #567168; font-size: 9.5px; font-weight: 700; text-transform: uppercase; }
.dimension-bonus strong{ color: #285b48; font-size: 12px; }

.dimension-focus-grid{
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-areas:
        "cc-left top cc-right"
        "previous main next"
        ". bottom .";
    gap: 8px 10px;
}

.dimension-focus-grid.is-rem{
    grid-template-areas: "previous main next";
}

.dimension-focus-card{
    display: flex;
    min-width: 0;
    min-height: 118px;
    padding: 10px;
    border: 1px solid var(--workspace-border);
    border-radius: 7px;
    background: #fff;
    color: var(--workspace-text);
    box-shadow: 0 2px 8px rgba(20, 28, 36, .04);
    text-align: left;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 3px;
}

.dimension-focus-card:disabled{ cursor: default; opacity: 1; }
.dimension-focus-card[hidden]{ display: none; }
.dimension-cc-left{ grid-area: cc-left; }
.dimension-focus-top{ grid-area: top; }
.dimension-cc-right{ grid-area: cc-right; }
.dimension-size-left{ grid-area: previous; opacity: .43; transform: scale(.97); }
.dimension-focus-main{ grid-area: main; border: 2px solid var(--blue-dark); background: #f4f8fc; box-shadow: 0 8px 22px rgba(36, 95, 159, .15); }
.dimension-size-right{ grid-area: next; opacity: .55; transform: scale(.98); }
.dimension-focus-bottom{ grid-area: bottom; opacity: .75; }
.dimension-cc-left,
.dimension-cc-right,
.dimension-focus-top{ opacity: .68; }

.dimension-focus-card.is-clickable{
    cursor: pointer;
}

.dimension-focus-card.is-clickable:hover{
    opacity: 1;
    transform: scale(1);
    border-color: var(--blue);
    box-shadow: 0 7px 18px rgba(20, 28, 36, .1);
}

.dimension-focus-card.is-invalid{
    opacity: .24;
}

.dimension-card-eyebrow{
    color: var(--workspace-muted-text);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.dimension-card-value{
    margin-top: 2px;
    color: var(--workspace-text);
    font-size: 17px;
    line-height: 1.2;
}

.dimension-focus-main .dimension-card-value{ color: var(--blue-dark); font-size: 23px; }
.dimension-cc-left .dimension-card-value,
.dimension-focus-top .dimension-card-value,
.dimension-cc-right .dimension-card-value{
    color: var(--workspace-muted-text);
    font-size: 17px;
    font-weight: 800;
}

.dimension-card-meta{
    color: var(--workspace-muted-text);
    font-size: 10px;
    line-height: 1.4;
    white-space: pre-line;
}

.dimension-focus-main .dimension-card-meta{ color: var(--workspace-text); }

.dimension-card-state{
    margin-top: auto;
    color: var(--green);
    font-size: 9.5px;
    font-weight: 700;
}

.dimension-focus-card.is-invalid .dimension-card-state{ color: var(--red); }

.dimension-status{
    margin: 9px 0 0;
    padding-left: 8px;
    border-left: 3px solid #b8c9da;
    color: var(--workspace-muted-text);
    font-size: 10.5px;
    line-height: 1.45;
}

.dimension-disclaimer{
    display: block;
    margin-top: 13px;
    padding: 10px 12px;
    border: 1px solid #dfc67e;
    border-radius: var(--workspace-radius);
    background: #fff8e5;
    color: #604a13;
    font-size: 10.5px;
    line-height: 1.5;
}

.dimension-disclaimer strong{ margin-right: 3px; }
.dimension-disclaimer span{ display: inline; color: inherit; font: inherit; text-transform: none; }
.dimension-disclaimer small{ display: block; margin-top: 4px; color: #786532; font-size: 9.5px; }

.dimension-load-error{
    margin: 12px 0 0;
    padding: 9px 10px;
    border: 1px solid #d79a96;
    border-radius: var(--workspace-radius);
    background: #fff7f6;
    color: #7c2d29;
    font-weight: 700;
}

.dimension-load-error[hidden],
[data-dimension-ui][hidden]{ display: none; }

.insulation-helper-backdrop{
    align-items: flex-start;
    padding: 18px;
    overflow: auto;
}

.insulation-helper-modal{
    width: min(860px, calc(100vw - 36px));
    max-height: calc(100vh - 36px);
    padding: 0;
    overflow: auto;
}

.insulation-helper-content{ padding: 12px 16px 16px; }

.insulation-helper-toolbar{
    display: flex;
    justify-content: flex-end;
}

.insulation-converter-panel{
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--workspace-border);
}

.insulation-converter-panel-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.insulation-converter-panel-header h3{
    margin: 0;
    color: var(--workspace-text);
    font-size: 16px;
}

.insulation-converter-content{ padding-top: 13px; }

.insulation-control-section{
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--workspace-border);
}

.insulation-field-label,
.insulation-converter-input > span:first-child{
    display: block;
    margin-bottom: 6px;
    color: var(--workspace-muted-text);
    font-size: var(--workspace-label-size);
    font-weight: 700;
    text-transform: uppercase;
}

.insulation-choice-row{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.insulation-component-grid,
.insulation-existing-grid{
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
}

.insulation-component-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }

.insulation-choice{
    min-width: 0;
    min-height: 40px;
    padding: 6px 9px;
}

.insulation-component-grid .insulation-choice,
.insulation-existing-grid .insulation-choice{ width: 100%; }

.insulation-choice.is-compact{ min-height: 35px; }

.insulation-choice.is-active{
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
    box-shadow: inset 0 0 0 1px var(--blue-dark);
}

.insulation-result{
    margin-top: 14px;
    overflow: hidden;
    border: 1px solid var(--workspace-border);
    border-radius: 8px;
    background: #fff;
}

.insulation-result-header{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    padding: 11px 13px;
    border-bottom: 1px solid var(--workspace-border);
}

.insulation-result-header strong{ display: block; color: var(--workspace-text); font-size: 16px; }
.insulation-result-header div > span{ display: block; margin-top: 2px; color: var(--workspace-muted-text); font-size: 10.5px; }

.insulation-br-badge{
    padding: 5px 7px;
    border-radius: 5px;
    background: #edf2f6;
    color: var(--workspace-text);
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}

.insulation-result-main{
    display: flex;
    padding: 18px 12px 14px;
    text-align: center;
    flex-direction: column;
    align-items: center;
}

.insulation-result-main > small{
    color: var(--workspace-muted-text);
    font-size: 9.5px;
    font-weight: 700;
    text-transform: uppercase;
}

.insulation-result-main > strong{
    margin: 5px 0 3px;
    color: var(--blue-dark);
    font-size: 38px;
    line-height: 1;
}

.insulation-lambda-badge,
.insulation-alternative-card b,
.insulation-converter-card b{
    display: inline-block;
    padding: 4px 8px;
    border-radius: 5px;
    background: var(--workspace-text);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.insulation-result-main > span:last-child{
    margin-top: 7px;
    color: var(--workspace-muted-text);
    font-size: 10.5px;
}

.insulation-after-result{
    display: grid;
    margin: 0 12px 13px;
    padding: 9px 10px;
    border: 1px solid #bcd3ca;
    border-radius: 6px;
    background: #f1f8f5;
    text-align: center;
    gap: 2px;
}

.insulation-after-result strong{ color: #285b48; font-size: 17px; }
.insulation-after-result span{ color: #567168; font-size: 10px; }

.insulation-alternatives-wrap{ padding: 0 12px 13px; }
.insulation-alternatives-label{ display: block; margin-bottom: 6px; color: var(--workspace-muted-text); font-size: 9px; font-weight: 700; text-align: center; text-transform: uppercase; }

.insulation-alternatives,
.insulation-converter-results{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
}

.insulation-alternative-card,
.insulation-converter-card{
    display: flex;
    min-width: 0;
    padding: 9px 6px;
    border: 1px solid var(--workspace-border);
    border-radius: 6px;
    background: #f8fafb;
    text-align: center;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.insulation-alternative-card > span,
.insulation-converter-card > span{ color: var(--workspace-muted-text); font-size: 9.5px; font-weight: 700; }
.insulation-alternative-card > strong,
.insulation-converter-card > strong{ color: var(--workspace-text); font-size: 20px; }

.insulation-guidance{
    margin-top: 13px;
    padding: 10px 12px;
    border: 1px solid #dfc67e;
    border-radius: var(--workspace-radius);
    background: #fff8e5;
    color: #604a13;
    font-size: 10.5px;
    line-height: 1.5;
}

.insulation-converter-input{ display: grid; }
.insulation-converter-input > span:last-child{ display: flex; align-items: center; gap: 7px; color: var(--workspace-text); font-weight: 700; }
.insulation-converter-input input{
    box-sizing: border-box;
    width: 140px;
    min-height: 42px;
    padding: 6px 9px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    color: var(--workspace-text);
    font-size: 20px;
    font-weight: 700;
    text-align: right;
}

.insulation-converter-quick{ display: flex; flex-wrap: wrap; gap: 5px; margin: 10px 0; }
.insulation-converter-reference{ display: block; margin-bottom: 10px; padding: 8px; border: 1px solid var(--workspace-border); border-radius: 5px; background: #edf2f6; text-align: center; }
.insulation-converter-note{ margin: 10px 0 0; color: var(--workspace-muted-text); font-size: 10px; line-height: 1.45; }

.insulation-load-error{
    margin: 12px 0 0;
    padding: 9px 10px;
    border: 1px solid #d79a96;
    border-radius: var(--workspace-radius);
    background: #fff7f6;
    color: #7c2d29;
    font-weight: 700;
}

.insulation-control-section[hidden],
.insulation-converter-panel[hidden],
.insulation-helper-toolbar[hidden],
.insulation-after-result[hidden],
.insulation-alternatives-wrap[hidden],
.insulation-load-error[hidden],
[data-insulation-ui][hidden]{ display: none; }

@media (max-width: 700px) {
    .insulation-helper-backdrop{ padding: 4px; }
    .insulation-helper-modal{ width: calc(100vw - 8px); max-height: calc(100vh - 8px); }
    .insulation-helper-content{ padding: 9px 9px 12px; }
    .insulation-component-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .insulation-existing-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .insulation-alternatives,
.insulation-converter-results{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.swedoor-lookup-modal{
    position: absolute;
    top: 104px;
    right: 80px;
    display: flex;
    width: min(820px, calc(100vw - 28px));
    max-height: min(92vh, 860px);
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--workspace-border);
    background: #fff;
    box-shadow: 0 18px 48px rgba(20, 28, 36, .28);
    flex-direction: column;
    pointer-events: auto;
}

.floating-tool-drag-handle{
    cursor: move;
    user-select: none;
    touch-action: none;
}

.floating-tool-drag-handle .fastener-calculator-close{ cursor: pointer; }

.swedoor-lookup-content{
    overflow-y: auto;
    padding: 14px 16px 16px;
}

.swedoor-section-label{
    color: var(--workspace-muted-text);
    font-size: var(--workspace-label-size);
    font-weight: 700;
}

.swedoor-section{
    padding-top: 13px;
    margin-top: 13px;
    border-top: 1px solid var(--workspace-border);
}

.swedoor-section h3{
    margin: 0 0 8px;
    color: var(--workspace-text);
    font-size: 13px;
}

.swedoor-section-label{
    display: block;
    margin: 9px 0 5px;
}

.swedoor-choice-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
    gap: 6px;
}

.swedoor-frame-type-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.swedoor-threshold-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
.swedoor-wood-grid{ grid-template-columns: repeat(5, minmax(0, 1fr)); }

.swedoor-choice{
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    height: auto;
    padding: 6px 5px;
    line-height: 1.15;
    text-align: center;
    flex-direction: column;
    gap: 2px;
}

.swedoor-choice strong{
    font-size: 12px;
    overflow-wrap: anywhere;
}

.swedoor-choice small{
    color: var(--workspace-muted-text);
    font-size: 9.5px;
    font-weight: 600;
}

.swedoor-choice.is-active{
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
    box-shadow: inset 0 0 0 1px var(--blue-dark);
}

.swedoor-choice.is-active small{ color: rgba(255, 255, 255, .78); }

.swedoor-core-tabs,
.swedoor-frame-grid,
.swedoor-threshold-grid{
    display: grid;
    gap: 8px;
}

.swedoor-core-tabs{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.swedoor-frame-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.swedoor-threshold-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }

.swedoor-frame-grid .swedoor-choice{
    min-height: 82px;
    justify-content: flex-start;
    text-align: left;
}

.swedoor-door-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(105px, 1fr));
    gap: 8px;
    margin-top: 9px;
}

.swedoor-door-card{
    display: grid;
    place-items: center;
    gap: 3px;
    min-height: 142px;
    padding: 8px 5px;
    border: 1px solid var(--workspace-border);
    border-radius: 8px;
    background: #fff;
    color: var(--workspace-text);
    cursor: pointer;
}

.swedoor-door-card:hover{ border-color: var(--blue-dark); }
.swedoor-door-card.is-active{ border: 2px solid var(--blue-dark); background: #f2f7fd; }
.swedoor-door-card strong{ font-size: 11px; text-align: center; }
.swedoor-door-card small{ color: var(--workspace-muted-text); font-size: 9px; text-align: center; }

.swedoor-door-mini{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    width: 42px;
    height: 66px;
    padding: 4px;
    border: 2px solid #5f7285;
    border-radius: 2px;
    background: linear-gradient(90deg, #f8fbfd, #eaf0f5);
}

.swedoor-door-mini.nature{ background: repeating-linear-gradient(90deg, #d6b889 0 2px, #e8ce9f 2px 5px); }
.swedoor-door-mini.pine{ background: repeating-linear-gradient(90deg, #e9c787 0 2px, #f6ddb0 2px 5px); }
.swedoor-door-mini i{ display: block; flex: 1; border: 1px solid #7d8c9b; margin: 1px; }
.swedoor-door-mini.flat i{ display: none; }
.swedoor-door-mini.h500::after,
.swedoor-door-mini.q500::after,
.swedoor-door-mini.q505::after,
.swedoor-door-mini.q510::after,
.swedoor-door-mini.s300::after{ content: ""; position: absolute; inset: 9px; background: repeating-linear-gradient(180deg, transparent 0 8px, #8291a0 8px 9px); }

.swedoor-result-section{ background: transparent; padding: 0; border: 0; border-radius: 0; }
.swedoor-result-heading{ display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.swedoor-result-heading h3{ margin-bottom: 8px; }
.swedoor-quantity-control{ display: flex; align-items: center; gap: 6px; color: var(--workspace-muted-text); font-size: 11px; font-weight: 700; white-space: nowrap; }
.swedoor-quantity-control input{ width: 54px; min-height: 30px; padding: 4px 6px; border: 1px solid var(--workspace-border); border-radius: 5px; background: #fff; color: var(--workspace-text); font: inherit; text-align: center; }
.swedoor-result-box{ padding: 11px 12px; border: 1px solid #b8c9da; border-radius: 6px; background: #eef3f8; }
.swedoor-result-head{ display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 5px; }
.swedoor-result-head strong{ color: var(--blue-dark); font-size: 15px; }
.swedoor-result-head span{ color: var(--workspace-muted-text); font-size: 10px; }
.swedoor-result-lines{ display: grid; }
.swedoor-result-line{ display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; border-top: 1px solid #dce6ec; }
.swedoor-result-line:first-child{ border-top: 0; }
.swedoor-result-line span{ display: grid; gap: 2px; min-width: 0; }
.swedoor-result-line strong{ font-size: 11px; }
.swedoor-result-line small{ color: var(--workspace-muted-text); font-size: 10px; }
.swedoor-result-line b{ white-space: nowrap; font-size: 11px; }
.swedoor-calcbar{ display: flex; justify-content: space-between; align-items: end; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.swedoor-calculation-label{ display: block; margin: 0 0 5px; color: var(--workspace-muted-text); font-size: var(--workspace-label-size); font-weight: 700; }
.swedoor-calculations{ display: flex; flex-wrap: wrap; gap: 5px; }
.swedoor-calc{ border: 1px solid var(--workspace-border); background: #fff; border-radius: 4px; padding: 6px 8px; color: var(--workspace-text); font-size: 10px; font-weight: 700; cursor: pointer; }
.swedoor-calc.is-active{ border-color: var(--blue-dark); background: var(--blue); color: #fff; box-shadow: inset 0 0 0 1px var(--blue-dark); }
.swedoor-calculation-hint,
.swedoor-muted{ margin: 4px 0 0; color: var(--workspace-muted-text); font-size: 10px; }
.swedoor-transfer-button{ width: auto; min-width: 176px; margin: 0; }
.swedoor-transfer-status{ min-height: 17px; margin: 7px 0 0; color: var(--workspace-muted-text); font-size: 11px; text-align: right; }

.swedoor-dimensions{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 9px;
    overflow: hidden;
    border: 1px solid var(--workspace-border);
    border-radius: var(--workspace-radius);
    background: #f7f8fa;
}

.swedoor-dimensions > span{
    display: grid;
    min-width: 0;
    padding: 8px 6px;
    text-align: center;
    gap: 2px;
}

.swedoor-dimensions > span + span{ border-left: 1px solid var(--workspace-border); }
.swedoor-dimensions small{ color: var(--workspace-muted-text); font-size: 9.5px; }
.swedoor-dimensions strong{ font-size: 11px; }

.swedoor-info{
    margin: 8px 0 0;
    padding: 3px 0 3px 8px;
    border-left: 3px solid #b8c9da;
    color: var(--workspace-muted-text);
    font-size: 11px;
}

.swedoor-wood-section[hidden]{ display: none; }

.swedoor-lookup-footer{
    padding: 8px 16px;
    border-top: 1px solid var(--workspace-border);
    color: var(--workspace-muted-text);
    font-size: 10px;
    text-align: center;
}

.cut-list-backdrop{
    z-index: 1600;
    display: block;
    padding: 0;
    background: transparent;
    pointer-events: none;
}

.cut-list-modal{
    position: absolute;
    top: 70px;
    right: 48px;
    display: flex;
    width: min(680px, calc(100vw - 28px));
    max-height: calc(100vh - 90px);
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--workspace-border);
    box-shadow: 0 14px 38px rgba(20, 28, 36, .3);
    flex-direction: column;
    pointer-events: auto;
}





.cut-list-content{
    overflow-y: auto;
    padding: 4px 16px 16px;
}

.cut-list-section{
    padding-top: 13px;
}

.cut-list-section + .cut-list-section{
    margin-top: 13px;
    border-top: 1px solid var(--workspace-border);
}

.cut-list-section h3{
    margin: 0 0 8px;
    color: var(--workspace-text);
    font-size: 13px;
}

.cut-list-mode-grid{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.cut-list-mode-grid .workspace-button{
    width: 100%;
    min-width: 0;
}

.cut-list-mode-grid .is-active{
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
}

.cut-list-mode-grid .cut-list-exclude-mode.is-active{
    border-color: #923a35;
    background: var(--red);
}

.cut-list-stock-grid{
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-top: 9px;
    gap: 6px;
}

.cut-list-stock-button{
    width: 100%;
    min-width: 0;
    min-height: 42px;
    padding: 5px;
}

.cut-list-stock-button.is-included{
    border-color: #317055;
    background: #e9f4ee;
    color: #245a43;
    box-shadow: inset 0 0 0 1px #317055;
}

.cut-list-stock-button.is-excluded{
    border-color: #a94a44;
    background: #fff0ef;
    color: #842f2a;
    box-shadow: inset 0 0 0 1px #a94a44;
}

.cut-list-stock-button.is-locked{
    cursor: default;
    opacity: .8;
}

.cut-list-hint{
    margin: 7px 0 0;
    color: var(--workspace-muted-text);
    font-size: 10.5px;
    line-height: 1.4;
}

.cut-list-row-head,
.cut-list-row{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(90px, .55fr) 34px;
    gap: 7px;
}

.cut-list-row-head{
    padding: 8px 2px 4px;
    color: var(--workspace-muted-text);
    font-size: var(--workspace-label-size);
    font-weight: 700;
}

.cut-list-rows{
    display: grid;
    gap: 6px;
}

.cut-list-row input,
.cut-list-kerf-field input{
    box-sizing: border-box;
    width: 100%;
    min-height: var(--workspace-input-height);
    padding: 6px 9px;
    border: 1px solid var(--line-dark);
    border-radius: 4px;
    background: #fff;
    color: var(--workspace-text);
}

.cut-list-row input:focus,
.cut-list-kerf-field input:focus{
    border-color: var(--blue);
    outline: 2px solid rgba(36, 95, 159, .16);
}

.cut-list-remove{
    width: 34px;
    min-width: 34px;
    min-height: var(--workspace-input-height);
    padding: 0;
    color: var(--red);
    font-size: 18px;
}

.cut-list-remove.is-placeholder{
    pointer-events: none;
    visibility: hidden;
}

.cut-list-kerf-field{
    display: flex;
    margin-top: 10px;
    color: var(--workspace-text);
    font-size: 11px;
    font-weight: 700;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cut-list-kerf-field > span:last-child{
    display: flex;
    width: 120px;
    align-items: center;
    gap: 6px;
}

.cut-list-error{
    margin: 9px 0 0;
    padding: 8px 10px;
    border: 1px solid #d79a96;
    border-radius: 4px;
    background: #fff7f6;
    color: #7c2d29;
    font-size: 11px;
    font-weight: 700;
}

.cut-list-error[hidden],
.cut-list-result[hidden]{ display: none; }

.cut-list-calculate{
    width: 100%;
    margin-top: 10px;
}

.cut-list-result-summary{
    display: grid;
    padding: 11px 12px;
    border: 1px solid #b8c9da;
    border-radius: var(--workspace-radius);
    background: #eef3f8;
    gap: 3px;
}

.cut-list-result-summary > strong{
    color: var(--blue-dark);
    font-size: 16px;
}

.cut-list-result-summary > span,
.cut-list-result-summary > small{
    color: var(--workspace-muted-text);
    font-size: 10.5px;
    line-height: 1.4;
}

.cut-list-alternative-button{
    width: 100%;
    margin-top: 5px;
}

.cut-list-alternative-button[hidden]{ display: none; }

.cut-list-buy-list{
    display: grid;
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid var(--workspace-border);
    border-radius: var(--workspace-radius);
    background: #fff;
    gap: 5px;
}

.cut-list-buy-list h4,
.cut-list-patterns h4{
    margin: 0 0 3px;
    color: var(--workspace-text);
    font-size: 12px;
}

.cut-list-buy-line{
    color: var(--blue-dark);
    font-size: 14px;
    font-weight: 800;
}

.cut-list-patterns{
    display: grid;
    margin-top: 10px;
    gap: 7px;
}

.cut-list-pattern{
    padding: 9px 10px;
    border: 1px solid var(--workspace-border);
    border-radius: var(--workspace-radius);
    background: #f7f8fa;
}

.cut-list-pattern-head{
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.cut-list-pattern-head strong{ color: var(--blue-dark); font-size: 13px; }
.cut-list-pattern-head span{ color: var(--workspace-muted-text); font-size: 10px; }
.cut-list-pattern-cuts{ margin-top: 4px; font-size: 12px; font-weight: 700; }

.cut-list-pattern-bar{
    height: 5px;
    margin-top: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #dce2e8;
}

.cut-list-pattern-bar span{
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--blue);
}

.calculation-title-row{
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.calculation-include-status{
    flex: 0 0 auto;
    color: var(--workspace-muted-text);
    font-size: 10.5px;
    white-space: nowrap;
}

.calculation-include-status::before{ content: "Ikke medregnet"; }
.calculation-title-row:has(input[data-calc-field="included"]:checked) .calculation-include-status::before{ content: "Medregnet"; }

@media (max-width: 760px) {
    .workspace-toolbar{
        height: auto;
        max-height: none;
    }
    .calculation-notes-drawer{
        top: auto;
        bottom: 202px;
        transform: none;
    }
    .calculation-tools-drawer{
        top: auto;
        bottom: 112px;
        transform: none;
    }
    .calculation-roof-drawer{
        top: auto;
        bottom: 22px;
        transform: none;
    }
    .fastener-calculator-backdrop,
.swedoor-lookup-backdrop{ padding: 0; }
    .fastener-calculator-modal,
.swedoor-lookup-modal{
        top: 6px;
        right: auto;
        left: 6px !important;
        width: calc(100vw - 12px);
        max-height: calc(100vh - 12px);
    }
    .floating-tool-drag-handle{ cursor: default; touch-action: auto; }
    .roof-calculator-backdrop{ padding: 4px; }
    .roof-calculator-modal{
        width: calc(100vw - 8px);
        height: calc(100vh - 8px);
    }
    .velux-helper-modal{
        width: calc(100vw - 8px);
        height: calc(100vh - 8px);
    }
    .dimension-lookup-backdrop{ padding: 4px; }
    .dimension-lookup-modal{
        width: calc(100vw - 8px);
        max-height: calc(100vh - 8px);
    }
    .dimension-lookup-content{ padding: 9px 9px 12px; }
    .dimension-control-grid{ grid-template-columns: 1fr; }
    .dimension-choice-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dimension-focus-grid{ gap: 6px; }
    .dimension-focus-card{ min-height: 106px; padding: 7px; }
    .dimension-card-value{ font-size: 13px; overflow-wrap: anywhere; }
    .dimension-focus-main .dimension-card-value{ font-size: 19px; }
    .dimension-card-meta{ font-size: 8.7px; }
    .dimension-card-state{ font-size: 8.5px; }
    .swedoor-lookup-backdrop{ padding: 6px; }
    .swedoor-lookup-modal{
        width: calc(100vw - 12px);
        max-height: calc(100vh - 12px);
    }
    .swedoor-lookup-content{ padding: 11px 12px 13px; }
    .swedoor-threshold-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .swedoor-wood-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .swedoor-dimensions{ grid-template-columns: 1fr; }
    .swedoor-dimensions > span + span{
        border-top: 1px solid var(--workspace-border);
        border-left: 0;
    }
    .cut-list-backdrop{ padding: 6px; }
    .cut-list-modal{
        top: 6px;
        right: auto;
        left: 6px !important;
        width: calc(100vw - 12px);
        max-height: calc(100vh - 12px);
    }
    
    .cut-list-content{ padding: 3px 12px 13px; }
    .cut-list-mode-grid{ grid-template-columns: 1fr; }
    .cut-list-stock-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .fastener-calculator-fields{ grid-template-columns: 1fr; }
    .fastener-field-wide,
.fastener-mode,
.fastener-custom-size{ grid-column: auto; }
}

@media print {
    .calculation-side-drawer{ display: none !important; }
}

/* Fælles, lav undermenu direkte under hovedmenuen. */
:root{
    --topbar-height: 58px;
    --workspace-toolbar-height: 42px;
}

.task-detail-root,
.document-module-root{
    display: contents;
}

/* Beregning og Overblik har deres egen scroll-/flexramme under topbaren.
   Her skal sticky-afstanden derfor regnes fra rammens top, ikke fra viewporten. */
.calculate-page .workspace-toolbar{
    top: 0;
}

.workspace-toolbar{
    position: sticky;
    top: var(--topbar-height);
    z-index: 200;
    box-sizing: border-box;
    width: 100%;
    height: var(--workspace-toolbar-height);
    min-height: var(--workspace-toolbar-height);
    max-height: var(--workspace-toolbar-height);
    margin: 0 0 6px;
    padding: 4px 6px;
    border-top: 0;
    border-radius: 0 0 4px 4px;
    background: #ffffff;
    box-shadow: 0 2px 7px rgba(28, 38, 48, .08);
}

.calculate-page .split-workspace,
.calculation-embed-page .split-workspace{
    position: relative;
    z-index: 1;
}

.calculate-page .summary-panel .summary-output-box,
.calculation-embed-page .summary-panel .summary-output-box{
    box-sizing: border-box !important;
    padding: 5px !important;
    border: 1px solid rgba(35, 104, 170, .22) !important;
    border-radius: 6px !important;
    background: linear-gradient(135deg, rgba(35, 104, 170, .11), rgba(118, 173, 218, .045)) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 2px 7px rgba(35, 104, 170, .07) !important;
}

.calculate-page .summary-panel .summary-overview-grid > .summary-item:not(.summary-setting-item),
.calculation-embed-page .summary-panel .summary-overview-grid > .summary-item:not(.summary-setting-item){
    background: transparent !important;
}

.workspace-tabs{
    gap: 4px;
}

.workspace-offer-context{
    display: inline-flex;
    min-width: 0;
    max-width: 420px;
    margin-left: 5px;
    padding-left: 10px;
    border-left: 1px solid #d5dce3;
    color: #000000;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    align-items: center;
}

.workspace-tab{
    min-height: 30px;
    padding: 5px 12px;
    border-radius: 3px;
    font-size: 12px;
    line-height: 1;
}

.workspace-actions,
.workspace-actions .task-workspace-actions{
    flex-wrap: nowrap;
}

.workspace-actions .workspace-button,
.workspace-actions .task-workspace-save-button,
.workspace-actions .task-workspace-back,
.workspace-actions select{
    min-height: 30px;
    height: 30px;
}

.calculate-page .summary-panel .summary-item-profit-total .summary-label,
.calculate-page .summary-panel .summary-item-profit-total .summary-value,
.calculation-embed-page .summary-panel .summary-item-profit-total .summary-label,
.calculation-embed-page .summary-panel .summary-item-profit-total .summary-value{
    color: #000000 !important;
    font-weight: 800 !important;
}

@media (max-width: 900px) {
    .workspace-offer-context{ max-width: 260px; }
    .material-list-spec-preview{ padding-left: 8px; }
}

.task-detail-body .task-workspace{
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    height: calc(100vh - var(--topbar-height) - var(--workspace-toolbar-height) - 12px);
    padding-top: 0 !important;
}

.page-list-toolbar{
    display: flex;
    align-items: center;
}

.workspace-list-filters{
    display: grid;
    width: 100%;
    gap: 6px;
    align-items: center;
    margin: 0;
}

.page-list-toolbar input,
.page-list-toolbar select,
.page-list-toolbar .btn{
    height: 30px;
    min-height: 30px;
}

@media (max-width: 760px) {
    .workspace-toolbar{
        height: auto;
        min-height: var(--workspace-toolbar-height);
        max-height: none;
    }

    .workspace-actions,
.workspace-actions .task-workspace-actions{
        flex-wrap: wrap;
    }
    .swedoor-core-tabs,
.swedoor-frame-grid{ grid-template-columns: 1fr; }
    .swedoor-door-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    .page-list-toolbar{
        height: auto;
        min-height: var(--workspace-toolbar-height);
        max-height: none;
    }

    .gavl-facade-backdrop{ padding: 0; pointer-events: auto; }
    .gavl-facade-modal{ top: 4px; right: 4px; width: calc(100vw - 8px); height: calc(100vh - 8px); }
}

.workspace-toolbar{
    box-sizing: border-box;
    height: 42px;
    min-height: 42px;
    max-height: 42px;
    padding: 4px 6px;
    border-color: #cbd3dc;
    border-radius: 0 0 4px 4px;
    background: #ffffff;
    color: #26323d;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 12px;
}

.workspace-tab,
.workspace-button,
.workspace-toolbar button,
.workspace-toolbar input,
.workspace-toolbar select{
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.workspace-tab{
    height: 30px;
    min-height: 30px;
    padding: 5px 12px;
    border-radius: 3px;
}

.workspace-tab.is-active,
.calendar-page .workspace-tab.is-active,
.workspace-button-primary{
    border-color: #1f5f9f;
    background: #2368aa;
    color: #ffffff;
}

.task-search-clear[hidden]{
    display: none !important;
}

.task-search-input::-webkit-search-cancel-button{
    display: none;
    -webkit-appearance: none;
    appearance: none;
}

@media (max-width: 760px) {
    .workspace-toolbar{
        height: auto;
        max-height: none;
    }
}

/* Noter 2026: én rolig sagsside med Firma-kortets typografi og mål. */
.task-detail-body{
    overflow-x: hidden;
}
.task-detail-body .task-workspace,
.task-detail-body .task-workspace-grid,
.task-detail-body .task-workspace-bottom{
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.task-detail-body .task-workspace-grid > *,
.task-detail-body .task-workspace-bottom > *,
.task-detail-body .workspace-toolbar > *{
    min-width: 0;
}
.task-detail-body .workspace-toolbar{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 12px;
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 46px;
    max-height: none;
    padding: 5px 10px;
}

.workspace-context-zone{
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
    color: #17212d;
}

.workspace-project-context{
    display: grid;
    min-width: 0;
    align-content: center;
    gap: 1px;
}

.workspace-project-title-line{
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
}

.workspace-context-zone strong{ white-space: nowrap; }
.task-detail-body .workspace-context-zone strong,
.calculate-page .workspace-offer-context,
:is(.document-module-page, .send-module-page) .workspace-offer-context{ font-size: 15px; }
.workspace-context-title{
    width: min(100%, 360px);
    min-width: 120px;
    height: 32px;
    padding: 5px 9px !important;
    border: 1px solid #9db9d4 !important;
    border-radius: 4px;
    background: #fff !important;
    color: #17212d;
    font-size: 15px !important;
    font-weight: 800;
}

.task-detail-body .workspace-tabs{ justify-self: center; }
.task-detail-body .workspace-tab,
.task-detail-body .workspace-tab.is-active{
    border-color: transparent;
    background: transparent;
    color: #111b25;
    font-weight: 800;
}
.task-detail-body .workspace-tab:hover{ background: #eef4fa; color: #111b25; }
.task-detail-body .workspace-tab.is-active{ box-shadow: inset 0 -2px #2368aa; }
.task-detail-body .workspace-actions{ min-width: 0; justify-self: end; }
.task-detail-body .task-workspace-actions{ flex-wrap: nowrap; }
.task-detail-body .task-workspace-owner select{ min-width: 58px; height: 30px; }
.task-detail-body .task-workspace-owner{ display: inline-flex; align-items: center; gap: 4px; color: #4f6172; font-weight: 700; }
.task-detail-body .workspace-button-danger{ border: 1px solid #d2a29d; background: #fff; color: #b42318; }
.task-detail-body .workspace-button-danger:hover{ border-color: #b42318; background: #fff2f0; }

.task-detail-body .task-customer-details{
    padding: 6px 9px;
    border: 1px solid #cbd7e3;
    border-radius: 5px;
    background: #fbfcfd;
}
.task-detail-body .task-customer-details .settings-field-grid{ column-gap: 10px; }
.task-detail-body .task-customer-details .task-address-inputs{ grid-template-columns: minmax(0, 1fr) 56px; }
.task-detail-body .task-customer-details .inline-edit-field{
    grid-template-columns: 82px minmax(0, 1fr);
    min-height: 31px;
}
.task-detail-body .task-customer-details .inline-edit-field span{ font-size:10px; font-weight:700; text-transform:none; }
.task-detail-body .task-customer-details .inline-edit-field input{ min-height: 27px; padding: 2px 4px; font-size: 12px; }
.task-detail-body .task-customer-invoice-email{ grid-column: 1 / -1; }
.task-customer-offer-nav{
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    min-height: 31px;
    border-top: 1px solid #edf0f2;
    align-items: center;
}
.task-customer-offer-nav > span,
.task-note-actions label > span,
.task-fixed-rate > label span{
    color: #657485;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}
.task-customer-offer-nav select{ width: 100%; min-width: 0; height: 27px; border: 1px solid #c5d1dd; border-radius: 4px; background: #fff; font-size: 11px; }

.task-note-actions{
    display: grid;
    grid-template-rows: auto auto auto auto;
    align-content: start;
    gap: 5px;
    padding: 6px;
    border: 1px solid #cbd7e3;
    border-radius: 5px;
    background: #fbfcfd;
}
.task-note-actions label{ display: grid; gap: 5px; }
.task-note-actions select,
.task-note-actions input{ box-sizing: border-box; width: 100%; height: 30px; border: 1px solid #b9c9d8; border-radius: 4px; background: #fff; }
.task-note-action-button{ display: inline-flex; width: 100%; min-height: 30px; align-items: center; justify-content: center; gap: 5px; text-decoration: none; }
.task-note-action-button svg{ width: 15px; height: 15px; }
.task-fixed-rate{ display: grid; gap: 3px; }
.task-fixed-rate input{ padding: 5px 8px; font-weight: 700; }
/* Projektets undermenu: samme faste højde og placering på alle desktopfaner. */
@media screen and (min-width: 761px){
    body[data-bygmak-ui] [data-project-workspace-menu].workspace-toolbar {
        display: grid !important;
        grid-template-columns: minmax(270px, 1fr) auto minmax(310px, 1fr) !important;
        flex: 0 0 42px !important;
        width: 100% !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        margin: 0 0 6px !important;
        padding: 4px 6px !important;
        gap: 6px !important;
        align-items: center !important;
        position: sticky !important;
        top: 0 !important;
        overflow: visible !important;
    }
    body[data-bygmak-ui]:is(.document-module-page, .send-module-page) [data-project-workspace-menu].workspace-toolbar {
        top: var(--topbar-height) !important;
    }
    body[data-bygmak-ui] [data-project-workspace-menu] .workspace-context-zone {
        display: grid !important;
        grid-template-columns: minmax(120px, 1fr) 120px !important;
        gap: 6px !important;
        height: 30px !important;
        align-items: center !important;
    }
    body[data-bygmak-ui] [data-project-workspace-menu] .workspace-tabs {
        display: flex !important;
        grid-row: 1 !important;
        grid-column: 2 !important;
        height: 30px !important;
        justify-self: center !important;
        flex-wrap: nowrap !important;
    }
    body[data-bygmak-ui] [data-project-workspace-menu] .workspace-actions {
        display: flex !important;
        grid-row: 1 !important;
        grid-column: 3 !important;
        min-width: 0 !important;
        height: 30px !important;
        justify-self: end !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
    }
    body[data-bygmak-ui] [data-project-workspace-menu] .workspace-calculation-actions,
    body[data-bygmak-ui] [data-project-workspace-menu] .task-workspace-actions {
        height: 30px !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
    }
    body[data-bygmak-ui] [data-project-workspace-menu] :is(.workspace-tab, .workspace-button, button, select) {
        height: 30px !important;
        min-height: 30px !important;
    }
    body[data-bygmak-ui].window-designer-page {
        display: flex;
        flex-direction: column;
        height: 100vh;
        overflow: hidden;
    }
    body[data-bygmak-ui].window-designer-page > .app-shell {
        display: flex;
        flex: 1 1 0;
        flex-direction: column;
        width: auto !important;
        min-height: 0;
        margin: 0 4px 4px !important;
        overflow: hidden;
    }
    body[data-bygmak-ui].window-designer-page .window-designer-root {
        flex: 1 1 0;
        min-height: 0;
        margin-top: 0;
        overflow: auto;
    }
}

/* Projektformularer bruger den fælles formular-typografi. */
.task-detail-body .task-customer-details .inline-edit-field span{
    font-family: var(--bygmak-font-family) !important;
    font-size: var(--bm-form-label-font-size) !important;
    font-weight: var(--bm-form-label-font-weight) !important;
    line-height: var(--bm-form-text-line-height) !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}
.task-detail-body .task-customer-details .inline-edit-field input{
    font-family: var(--bygmak-font-family) !important;
    font-size: var(--bm-form-control-font-size) !important;
    font-weight: var(--bm-form-control-font-weight) !important;
    line-height: var(--bm-form-text-line-height) !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}
.task-detail-body .task-workspace-owner{ border: 0 !important; padding: 0 !important; background: transparent !important; }
.task-detail-body .task-customer-offer-nav select{ height: 32px !important; min-height: 32px !important; line-height: normal !important; padding: 4px 8px !important; }

.calculate-page .workspace-toolbar,
:is(.document-module-page, .send-module-page) .workspace-toolbar{
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto minmax(260px, 1fr);
    gap: 12px;
    height: auto;
    min-height: 46px;
    max-height: none;
    padding: 5px 10px;
}
.calculate-page .workspace-tabs,
:is(.document-module-page, .send-module-page) .workspace-tabs{ justify-self: center; }
.calculate-page .workspace-actions,
:is(.document-module-page, .send-module-page) .workspace-actions{ justify-self: end; }
.calculate-page .workspace-tab,
.calculate-page .workspace-tab.is-active,
:is(.document-module-page, .send-module-page) .workspace-tab,
:is(.document-module-page, .send-module-page) .workspace-tab.is-active{
    border-color: transparent;
    background: transparent;
    color: #111b25;
    font-weight: 800;
}
.calculate-page .workspace-tab.is-active,
:is(.document-module-page, .send-module-page) .workspace-tab.is-active{ box-shadow: inset 0 -2px #2368aa; }

/* Let actions reserve their actual width and wrap before they meet the tabs. */
:is(.calculate-page, .calculation-embed-page) .workspace-toolbar{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, max-content);
    height: auto;
    max-height: none;
    flex-shrink: 0;
}
:is(.calculate-page, .calculation-embed-page) .workspace-actions,
:is(.calculate-page, .calculation-embed-page) .workspace-calculation-actions{
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap;
}
:is(.calculate-page, .calculation-embed-page) .workspace-save-status{
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}
:is(.calculate-page, .calculation-embed-page) .workspace-offer-context{
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1100px) {
    :is(.calculate-page, .calculation-embed-page) .workspace-toolbar{ grid-template-columns: minmax(0, 1fr); }
    :is(.calculate-page, .calculation-embed-page) .workspace-tabs{ grid-row: 2; grid-column: 1; }
    :is(.calculate-page, .calculation-embed-page) .workspace-actions{ grid-row: 3; grid-column: 1; justify-self: stretch; }
    :is(.calculate-page, .calculation-embed-page) .workspace-calculation-actions{ justify-content: flex-start; }
    :is(.calculate-page, .calculation-embed-page) .workspace-tabs{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    :is(.document-module-page, .send-module-page) .workspace-toolbar{ grid-template-columns: 1fr auto; }
    :is(.document-module-page, .send-module-page) .workspace-tabs{ grid-row: 2; grid-column: 1 / -1; }
}

.velux-header-actions{display:flex;align-items:center;gap:8px}

/* Separate labour calculation, with a restrained tint on desktop. */
@media (min-width: 801px) {
    body:not(.calculation-mobile-landscape) .bygmak-calculation .calculation-table {
        --calc-labor-heading: #dfe9e3;
        --calc-labor-input: #f1f6f3;
        --calc-labor-total: #e4ede7;
    }
    body:not(.calculation-mobile-landscape) .bygmak-calculation .calculation-table thead th:nth-child(n+12) { background: var(--calc-labor-heading) !important; }
    body:not(.calculation-mobile-landscape) .bygmak-calculation .calculation-table tbody[data-role="rows"] td:nth-child(n+12) { background: var(--calc-labor-input) !important; }
    body:not(.calculation-mobile-landscape) .bygmak-calculation .calculation-table tbody[data-role="rows"] td:nth-child(14) { background: var(--calc-labor-total) !important; }
    body:not(.calculation-mobile-landscape) .bygmak-calculation .calculation-table tbody[data-role="rows"] td:nth-child(n+12) input:not(:focus) { background: transparent !important; }
}