:root {
    color-scheme: light;
    --page: #faf9f8;
    --sidebar: #2b3033;
    --sidebar-border: #22272a;
    --sidebar-text: #f3f6f8;
    --sidebar-muted: #b9c1c8;
    --blue: #005a9e;
    --blue-strong: #005a9e;
    --blue-soft: #e1f1ff;
    --green: #107c10;
    --soft: #f3f2f1;
    --line: #dadada;
    --line-strong: #c8c6c4;
    --dummy-topbar-height: 32px;
    --surface: #ffffff;
    --surface-soft: #f8fafc;
    --border: #d8dde6;
    --border-soft: #e8ebef;
    --text: #1f2328;
    --muted: #6b7280;
    --primary: #155eef;
    --danger: #b42318;
}

/* Project CAD viewer: full main-frame workspace with an OpenConstructionERP-style CAD layout. */
.cad-viewer-backdrop {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 184;
    background: rgba(0, 0, 0, 0.18);
}

.dummy-shell:not(.is-sidebar-collapsed) .cad-viewer-backdrop {
    left: 260px;
}

.project-cad-viewer {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 185;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 42px minmax(0, 1fr) 34px;
    overflow: hidden;
    background: #171a1f;
    color: #e6eaf0;
    outline: 0;
}

.dummy-shell:not(.is-sidebar-collapsed) .project-cad-viewer {
    left: 260px;
}

.project-cad-toolbar {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto minmax(120px, 1fr);
    align-items: center;
    gap: 8px;
    padding: 0 6px;
    border-bottom: 1px solid #4a4f57;
    background: #30343a;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
}

.project-cad-toolbar-group {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.project-cad-toolbar-title {
    gap: 8px;
    overflow: hidden;
    color: #f1f3f5;
}

.project-cad-toolbar-title > span:not(.material-symbols-outlined) {
    min-width: 0;
    overflow: hidden;
    font-size: 13px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-cad-toolbar-title > small {
    flex: 0 0 auto;
    color: #aeb6c1;
    font-size: 11px;
}

.project-cad-toolbar-tools {
    justify-content: center;
}

.project-cad-toolbar-actions {
    justify-content: flex-end;
}

.project-cad-toolbar button,
.project-cad-toolbar a {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #e6eaf0;
    text-decoration: none;
    cursor: pointer;
}

.project-cad-toolbar button:hover,
.project-cad-toolbar button:focus-visible,
.project-cad-toolbar a:hover,
.project-cad-toolbar a:focus-visible,
.project-cad-toolbar button.is-active {
    background: #4a515a;
    color: #fff;
    outline: 2px solid #65a8e5;
    outline-offset: -2px;
}

.project-cad-toolbar button.is-active {
    background: #135f97;
}

.project-cad-toolbar button:disabled {
    opacity: 0.38;
    cursor: not-allowed;
}

.project-cad-toolbar button:disabled:hover,
.project-cad-toolbar button:disabled:focus-visible {
    background: transparent;
    color: #e6eaf0;
    outline: 0;
}

.project-cad-toolbar .material-symbols-outlined {
    font-size: 20px;
}

.project-cad-toolbar-divider {
    width: 1px;
    height: 20px;
    margin: 0 4px;
    background: #5a6069;
}

.project-cad-zoom {
    width: 48px;
    color: #d9dee5;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.project-cad-workspace {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    overflow: hidden;
}

.project-cad-viewer.is-panel-collapsed .project-cad-workspace {
    grid-template-columns: minmax(0, 1fr) 0;
}

.project-cad-viewer.is-panel-collapsed .project-cad-panel {
    visibility: hidden;
    border-left: 0;
}

.project-cad-stage {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: #171a1f;
}

.project-cad-viewer.is-light-canvas .project-cad-stage {
    background: #ffffff;
}

.project-cad-stage canvas {
    display: block;
    width: 100%;
    height: 100%;
    cursor: grab;
    touch-action: none;
}

.project-cad-stage canvas:active {
    cursor: grabbing;
}

.project-cad-stage canvas[data-cad-tool="select"] {
    cursor: crosshair;
}

.project-cad-stage canvas[data-cad-tool="distance"],
.project-cad-stage canvas[data-cad-tool="polyline"],
.project-cad-stage canvas[data-cad-tool="area"],
.project-cad-stage canvas[data-cad-tool="calibrate"] {
    cursor: none;
}

.project-cad-loading,
.project-cad-error {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 10px;
    padding: 24px;
    background: #171a1f;
    color: #cbd2db;
    text-align: center;
}

.project-cad-loading[hidden],
.project-cad-error[hidden] {
    display: none;
}

.project-cad-loading .material-symbols-outlined {
    font-size: 28px;
    animation: project-cad-spin 1.1s linear infinite;
}

.project-cad-error {
    color: #ffb4ab;
}

.project-cad-viewer.is-light-canvas .project-cad-loading,
.project-cad-viewer.is-light-canvas .project-cad-error {
    background: #ffffff;
    color: #3f4b57;
}

.project-cad-viewer.is-light-canvas .project-cad-error {
    color: #a1261d;
}

@keyframes project-cad-spin {
    to { transform: rotate(360deg); }
}

.project-cad-coordinate {
    position: absolute;
    right: 10px;
    bottom: 8px;
    min-width: 150px;
    padding: 4px 7px;
    border: 1px solid rgba(177, 190, 204, 0.24);
    border-radius: 3px;
    background: rgba(31, 35, 41, 0.9);
    color: #b9c2cc;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
    text-align: right;
    pointer-events: none;
}

.project-cad-panel {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 38px minmax(0, 1fr);
    overflow: hidden;
    border-left: 1px solid #4a4f57;
    background: #24282e;
}

.project-cad-panel-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-bottom: 1px solid #4a4f57;
}

.project-cad-panel-tabs button {
    min-width: 0;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #aeb6c1;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.project-cad-panel-tabs button:hover,
.project-cad-panel-tabs button:focus-visible,
.project-cad-panel-tabs button.is-active {
    background: #2d3239;
    color: #fff;
    outline: 0;
}

.project-cad-panel-tabs button.is-active {
    border-bottom-color: #4ba3df;
}

.project-cad-panel-view {
    min-width: 0;
    min-height: 0;
    display: none;
    overflow: auto;
    padding: 10px;
}

.project-cad-panel-view.is-active {
    display: block;
}

.project-cad-layer-search {
    height: 32px;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    margin-bottom: 8px;
    border: 1px solid #515862;
    border-radius: 3px;
    background: #1c2025;
}

.project-cad-layer-search .material-symbols-outlined {
    justify-self: center;
    color: #88929e;
    font-size: 17px;
}

.project-cad-layer-search input {
    min-width: 0;
    height: 30px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #e6eaf0;
    font-size: 12px;
}

.project-cad-layer-search input::placeholder {
    color: #818b97;
}

.project-cad-layer-actions {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
    margin-bottom: 6px;
}

.project-cad-layer-actions button {
    height: 27px;
    padding: 0 8px;
    border: 1px solid #515862;
    border-radius: 3px;
    background: #30353c;
    color: #d2d8e0;
    font-size: 11px;
    cursor: pointer;
}

.project-cad-layer-actions button:hover,
.project-cad-layer-actions button:focus-visible {
    border-color: #6caee0;
    color: #fff;
    outline: 1px solid #6caee0;
}

.project-cad-layer-list {
    display: grid;
    gap: 1px;
}

.project-cad-layer-row {
    min-width: 0;
    height: 31px;
    display: grid;
    grid-template-columns: 24px 12px minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding: 0 5px;
    border-radius: 2px;
    color: #d8dde4;
    font-size: 12px;
    cursor: pointer;
}

.project-cad-layer-row:hover {
    background: #31363e;
}

.project-cad-layer-row input {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: #2184bd;
}

.project-cad-layer-swatch {
    width: 10px;
    height: 10px;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.project-cad-layer-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-cad-layer-count {
    color: #8e98a4;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.project-cad-empty-panel {
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    color: #8994a0;
    font-size: 12px;
    text-align: center;
}

.project-cad-empty-panel .material-symbols-outlined {
    font-size: 28px;
}

.project-cad-property-list {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    margin: 0;
    border-top: 1px solid #3c424a;
    font-size: 12px;
}

.project-cad-property-list dt,
.project-cad-property-list dd {
    min-width: 0;
    margin: 0;
    padding: 8px 6px;
    border-bottom: 1px solid #3c424a;
}

.project-cad-property-list dt {
    color: #8f99a5;
}

.project-cad-property-list dd {
    overflow-wrap: anywhere;
    color: #e0e5eb;
}

.project-cad-measurements {
    display: grid;
    gap: 6px;
}

.project-cad-calibration {
    display: grid;
    gap: 9px;
    margin-bottom: 10px;
    padding: 10px;
    border: 1px solid #454c55;
    border-radius: 3px;
    background: #2b3037;
}

.project-cad-calibration > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.project-cad-calibration > header > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-cad-calibration strong {
    color: #eef2f6;
    font-size: 12px;
}

.project-cad-calibration header span:not(.project-cad-calibration-badge),
.project-cad-calibration > p,
.project-cad-calibration > small {
    margin: 0;
    color: #aeb7c2;
    font-size: 11px;
    line-height: 1.35;
}

.project-cad-calibration-badge {
    flex: 0 0 auto;
    padding: 2px 6px;
    border: 1px solid #646d78;
    border-radius: 9px;
    color: #bcc4cd;
    font-size: 9px;
    font-weight: 700;
}

.project-cad-calibration.is-calibrated .project-cad-calibration-badge {
    border-color: #397e59;
    background: #214d37;
    color: #c8f4d8;
}

.project-cad-calibration form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
}

.project-cad-calibration label {
    min-width: 0;
    display: grid;
    gap: 4px;
    color: #c5ccd5;
    font-size: 10px;
}

.project-cad-calibration input,
.project-cad-calibration select {
    min-width: 0;
    width: 100%;
    height: 30px;
    padding: 0 7px;
    border: 1px solid #59616c;
    border-radius: 2px;
    outline: 0;
    background: #1d2126;
    color: #eef2f6;
    font-size: 12px;
}

.project-cad-calibration input:focus,
.project-cad-calibration select:focus {
    border-color: #5da6dd;
    box-shadow: 0 0 0 1px #5da6dd;
}

.project-cad-calibration-actions {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}

.project-cad-calibration-actions button {
    min-width: 90px;
    height: 28px;
    padding: 0 9px;
    border: 1px solid #59616c;
    border-radius: 2px;
    background: #363c44;
    color: #e7ebf0;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}

.project-cad-calibration-actions button[type="submit"] {
    border-color: #176da7;
    background: #0d5f96;
}

.project-cad-calibration-actions button:hover,
.project-cad-calibration-actions button:focus-visible {
    border-color: #70b3e5;
    outline: 1px solid #70b3e5;
}

.project-cad-calibration-actions button:disabled {
    opacity: 0.42;
    cursor: not-allowed;
}

.project-cad-calibration-message {
    padding: 6px 7px;
    border-left: 2px solid #5da6dd;
    background: #232a31;
    color: #d9e6f2;
    font-size: 11px;
    line-height: 1.35;
}

.project-cad-calibration-message.is-error {
    border-left-color: #e06167;
    color: #ffcbc9;
}

.project-cad-measurement-row {
    min-width: 0;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 28px;
    align-items: center;
    gap: 6px;
    padding: 8px;
    border: 1px solid #454c55;
    border-radius: 3px;
    background: #2b3037;
}

.project-cad-measurement-row > .material-symbols-outlined {
    color: #f4c145;
    font-size: 20px;
}

.project-cad-measurement-row > div {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.project-cad-measurement-row strong,
.project-cad-measurement-row div span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-cad-measurement-row strong {
    color: #e8ecf1;
    font-size: 12px;
}

.project-cad-measurement-row div span {
    color: #afb7c1;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
}

.project-cad-measurement-row button {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #aeb6c1;
    cursor: pointer;
}

.project-cad-measurement-row button:hover,
.project-cad-measurement-row button:focus-visible {
    background: #444b54;
    color: #fff;
    outline: 1px solid #6caee0;
}

.project-cad-measurement-row button .material-symbols-outlined {
    font-size: 17px;
}

.project-cad-statusbar {
    min-width: 0;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid #4a4f57;
    background: #2b2f35;
}

.project-cad-layouts {
    min-width: 0;
    display: flex;
    align-items: stretch;
    overflow-x: auto;
}

.project-cad-layouts button {
    min-width: 70px;
    padding: 0 14px;
    border: 0;
    border-right: 1px solid #464c54;
    border-top: 2px solid transparent;
    background: transparent;
    color: #b2bac4;
    font-size: 11px;
    cursor: pointer;
}

.project-cad-layouts button:hover,
.project-cad-layouts button:focus-visible,
.project-cad-layouts button.is-active {
    background: #383e46;
    color: #fff;
    outline: 0;
}

.project-cad-layouts button.is-active {
    border-top-color: #4ba3df;
}

.project-cad-status {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 10px;
    color: #929ca8;
    font-size: 10px;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .project-cad-toolbar-title > small,
    .project-cad-status span:nth-child(4) {
        display: none;
    }

    .project-cad-workspace {
        grid-template-columns: minmax(0, 1fr) 260px;
    }
}

/* Project BIM viewer: local xBIM WebGL runtime with IFC structure and properties. */
.bim-viewer-backdrop {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 186;
    background: rgba(0, 0, 0, .18);
}

.dummy-shell:not(.is-sidebar-collapsed) .bim-viewer-backdrop {
    left: 260px;
}

.project-bim-viewer {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 187;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 42px minmax(0, 1fr) 30px;
    overflow: hidden;
    background: #f5f7f9;
    color: #dfe5ec;
    outline: 0;
}

.dummy-shell:not(.is-sidebar-collapsed) .project-bim-viewer {
    left: 260px;
}

.project-bim-toolbar {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto minmax(120px, 1fr);
    align-items: center;
    gap: 8px;
    padding: 0 6px;
    border-bottom: 1px solid #48515c;
    background: #29313a;
}

.project-bim-toolbar-group {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.project-bim-toolbar-title {
    gap: 8px;
    overflow: hidden;
}

.project-bim-toolbar-title > span:not(.material-symbols-outlined) {
    min-width: 0;
    overflow: hidden;
    font-size: 13px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-bim-toolbar-title > small {
    flex: 0 0 auto;
    color: #aeb8c3;
    font-size: 11px;
}

.project-bim-toolbar-tools {
    justify-content: center;
}

.project-bim-toolbar-actions {
    justify-content: flex-end;
}

.project-bim-toolbar button,
.project-bim-toolbar a {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #dfe5ec;
    text-decoration: none;
    cursor: pointer;
}

.project-bim-toolbar button:hover,
.project-bim-toolbar button:focus-visible,
.project-bim-toolbar a:hover,
.project-bim-toolbar a:focus-visible,
.project-bim-toolbar button.is-active {
    background: #424c57;
    color: #fff;
    outline: 2px solid #65a8e5;
    outline-offset: -2px;
}

.project-bim-toolbar button.is-active {
    background: #075d96;
}

.project-bim-toolbar button:disabled {
    opacity: .35;
}

.project-bim-toolbar button:disabled:hover {
    background: transparent;
    outline: 0;
}

.project-bim-toolbar .material-symbols-outlined {
    font-size: 20px;
}

.project-bim-toolbar-divider {
    width: 1px;
    height: 20px;
    margin: 0 4px;
    background: #59636f;
}

.project-bim-workspace {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    overflow: hidden;
}

.project-bim-viewer.is-panel-collapsed .project-bim-workspace {
    grid-template-columns: minmax(0, 1fr) 0;
}

.project-bim-viewer.is-panel-collapsed .project-bim-panel {
    visibility: hidden;
    border-left: 0;
}

.project-bim-stage {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: #f5f7f9;
}

.project-bim-viewer.is-dark-canvas .project-bim-stage {
    background: #1b1f24;
}

.project-bim-stage canvas {
    display: block;
    width: 100%;
    height: 100%;
    cursor: grab;
    touch-action: none;
}

.project-bim-stage canvas:active {
    cursor: grabbing;
}

.project-bim-loading,
.project-bim-error {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    padding: 24px;
    background: #f5f7f9;
    color: #495565;
    text-align: center;
}

.project-bim-loading[hidden],
.project-bim-error[hidden] {
    display: none;
}

.project-bim-loading .material-symbols-outlined {
    color: #005a9e;
    font-size: 30px;
    animation: project-cad-spin 1.1s linear infinite;
}

.project-bim-loading strong {
    color: #273442;
    font-size: 14px;
}

.project-bim-loading > span:not(.material-symbols-outlined) {
    color: #667383;
    font-size: 12px;
}

.project-bim-loading progress {
    width: min(280px, 70%);
    height: 4px;
    border: 0;
    accent-color: #005a9e;
}

.project-bim-error {
    color: #a1261d;
}

.project-bim-panel {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 38px minmax(0, 1fr);
    overflow: hidden;
    border-left: 1px solid #3f4853;
    background: #242a31;
}

.project-bim-panel-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-bottom: 1px solid #414a55;
}

.project-bim-panel-tabs button {
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #aeb8c3;
    font-size: 12px;
    font-weight: 650;
}

.project-bim-panel-tabs button:hover,
.project-bim-panel-tabs button:focus-visible,
.project-bim-panel-tabs button.is-active {
    background: #303740;
    color: #fff;
    outline: 0;
}

.project-bim-panel-tabs button.is-active {
    border-bottom-color: #4ba3df;
}

.project-bim-panel-view {
    min-width: 0;
    min-height: 0;
    display: none;
    overflow: auto;
    padding: 9px;
}

.project-bim-panel-view.is-active {
    display: block;
}

.project-bim-search {
    height: 32px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    margin-bottom: 8px;
    border: 1px solid #505b67;
    border-radius: 3px;
    background: #1b2026;
}

.project-bim-search .material-symbols-outlined {
    justify-self: center;
    color: #8995a2;
    font-size: 17px;
}

.project-bim-search input {
    min-width: 0;
    height: 30px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #e8edf2;
    font-size: 12px;
}

.project-bim-search input::placeholder {
    color: #818c98;
}

.project-bim-tree,
.project-bim-tree ul {
    min-width: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.project-bim-tree ul ul {
    margin-left: 18px;
    border-left: 1px solid #3b444e;
}

.project-bim-tree li.is-collapsed > ul {
    display: none;
}

.project-bim-tree-row {
    min-width: 0;
    min-height: 34px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: stretch;
}

.project-bim-tree-toggle,
.project-bim-tree-select {
    border: 0;
    background: transparent;
    color: #c9d1da;
}

.project-bim-tree-toggle {
    width: 24px;
    display: grid;
    place-items: center;
    padding: 0;
}

.project-bim-tree-toggle:disabled {
    visibility: hidden;
}

.project-bim-tree-toggle .material-symbols-outlined {
    font-size: 17px;
}

.project-bim-tree-select {
    min-width: 0;
    display: grid;
    grid-template-columns: 23px minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    padding: 3px 5px;
    border-radius: 2px;
    text-align: left;
}

.project-bim-tree-select:hover,
.project-bim-tree-select:focus-visible,
.project-bim-tree-select.is-selected {
    background: #343d47;
    color: #fff;
    outline: 1px solid #5d9dce;
}

.project-bim-tree-select.is-selected {
    background: #0d5687;
}

.project-bim-tree-select > .material-symbols-outlined {
    color: #7eb5dd;
    font-size: 17px;
}

.project-bim-tree-select > span:last-child {
    min-width: 0;
    display: grid;
}

.project-bim-tree-select strong,
.project-bim-tree-select small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-bim-tree-select strong {
    font-size: 11px;
    font-weight: 650;
}

.project-bim-tree-select small {
    color: #8f9ba8;
    font-size: 9px;
}

.project-bim-properties > header {
    display: grid;
    gap: 3px;
    padding: 5px 5px 10px;
    border-bottom: 1px solid #444d57;
}

.project-bim-properties > header strong {
    color: #fff;
    font-size: 13px;
}

.project-bim-properties > header span {
    color: #93a0ad;
    font-size: 10px;
}

.project-bim-properties section {
    padding: 10px 5px 3px;
}

.project-bim-properties h3 {
    margin: 0 0 6px;
    color: #cbd4dd;
    font-size: 10px;
    letter-spacing: 0;
    text-transform: uppercase;
}

.project-bim-properties dl {
    display: grid;
    grid-template-columns: minmax(90px, 42%) minmax(0, 1fr);
    margin: 0;
    border-top: 1px solid #3b444e;
}

.project-bim-properties dt,
.project-bim-properties dd {
    min-width: 0;
    margin: 0;
    padding: 6px 4px;
    border-bottom: 1px solid #3b444e;
    font-size: 11px;
    overflow-wrap: anywhere;
}

.project-bim-properties dt {
    color: #8f9ba8;
}

.project-bim-properties dd {
    color: #e2e7ec;
}

.project-bim-empty-panel {
    min-height: 190px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 6px;
    color: #8995a2;
    font-size: 11px;
    text-align: center;
}

.project-bim-empty-panel .material-symbols-outlined {
    font-size: 28px;
}

.project-bim-empty-panel strong {
    color: #cbd4dd;
    font-size: 12px;
}

.project-bim-statusbar {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    padding: 0 10px;
    border-top: 1px solid #48515c;
    background: #29313a;
    color: #9da8b4;
    font-size: 10px;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .project-bim-toolbar-title > small,
    .project-bim-statusbar span:nth-child(4) {
        display: none;
    }

    .project-bim-workspace {
        grid-template-columns: minmax(0, 1fr) 270px;
    }
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background: var(--page);
    font-size: 14px;
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

button:disabled,
input:disabled {
    cursor: not-allowed;
    opacity: .62;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

.module-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.module-header h1 {
    margin-bottom: 4px;
    font-size: 26px;
    line-height: 1.15;
    letter-spacing: 0;
}

.module-header p {
    margin-bottom: 0;
    color: var(--muted);
}

.toolbar {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.primary,
.project-tool-button {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 0 12px;
    background: #fff;
    color: var(--text);
    font-weight: 700;
    text-decoration: none;
}

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

.dummy-shell,
.dummy-shell.is-sidebar-collapsed {
    min-height: 100vh;
    display: block;
    padding-top: var(--dummy-topbar-height);
    background: var(--page);
}

.dummy-main {
    min-height: calc(100vh - var(--dummy-topbar-height));
    margin-left: 64px;
    display: block;
    transition: margin-left 150ms ease;
}

.dummy-shell:not(.is-sidebar-collapsed) .dummy-main {
    margin-left: 260px;
}

.dummy-topbar {
    height: var(--dummy-topbar-height);
    min-height: var(--dummy-topbar-height);
    padding: 0 8px;
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 120;
    display: grid;
    grid-template-columns: minmax(172px, auto) minmax(180px, 320px) minmax(260px, 1fr);
    align-items: center;
    gap: 16px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
    box-shadow: none;
}

.topbar-brand {
    min-width: 0;
    height: 100%;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--blue);
    text-decoration: none;
}

.topbar-brand .brand-mark {
    width: 22px;
    height: 22px;
    display: inline-grid;
    place-items: center;
    border-radius: 4px;
    background: var(--blue);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.topbar-brand-copy {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.topbar-brand-copy strong {
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}

.topbar-brand-copy span {
    max-width: 140px;
    overflow: hidden;
    color: var(--muted);
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dummy-sidebar .dummy-brand {
    display: none;
}

.dummy-sidebar {
    width: 64px;
    min-height: 0;
    height: calc(100vh - var(--dummy-topbar-height));
    padding: 8px 0 0;
    position: fixed;
    top: var(--dummy-topbar-height);
    left: 0;
    z-index: 100;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--sidebar-border);
    background: var(--sidebar);
    color: var(--sidebar-text);
    box-shadow: none;
    overflow-x: hidden;
    overflow-y: auto;
    transition: width 150ms ease, box-shadow 150ms ease;
}

.dummy-shell:not(.is-sidebar-collapsed) .dummy-sidebar,
.dummy-shell.is-sidebar-collapsed .dummy-sidebar:hover {
    width: 260px;
    box-shadow: 2px 0 6px rgba(0, 0, 0, 0.05);
}

.nav-label {
    height: 24px;
    margin: 0;
    padding: 8px 20px 4px;
    overflow: hidden;
    color: var(--sidebar-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 12px;
    text-transform: uppercase;
    white-space: nowrap;
}

.dummy-nav {
    display: grid;
    gap: 0;
    padding: 0;
}

.dummy-nav-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 24px;
    align-items: center;
}

.dummy-nav-row > button:not(.dummy-nav-parent) {
    width: 24px;
    min-height: 28px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--sidebar-muted);
    font-size: 12px;
    transition: background-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.dummy-nav-caret .material-symbols-outlined {
    font-size: 16px;
    transition: transform 150ms ease;
}

.dummy-nav-group.is-open .dummy-nav-caret .material-symbols-outlined {
    transform: rotate(180deg);
}

.dummy-nav-group.is-open .dummy-nav-parent {
    color: #69b7ff;
    background: rgba(0, 90, 158, 0.26);
}

.dummy-subnav-list {
    display: none;
    padding: 2px 0 4px;
    border-left: 1px solid var(--line);
    margin-left: 29px;
}

.dummy-nav-group.is-open .dummy-subnav-list {
    display: grid;
}

.dummy-nav a.dummy-subnav::before {
    display: none;
}

.dummy-shell.is-sidebar-collapsed .nav-label,
.dummy-shell.is-sidebar-collapsed .dummy-subnav-list,
.dummy-shell.is-sidebar-collapsed .dummy-nav-row > button:not(.dummy-nav-parent) {
    display: none;
}

.dummy-shell.is-sidebar-collapsed .dummy-nav-row {
    grid-template-columns: 64px;
}

.dummy-shell.is-sidebar-collapsed .dummy-sidebar:hover .nav-label {
    display: block;
}

.dummy-shell.is-sidebar-collapsed .dummy-sidebar:hover .dummy-nav-row {
    grid-template-columns: minmax(0, 1fr) 24px;
}

.dummy-shell.is-sidebar-collapsed .dummy-sidebar:hover .dummy-nav-row > button:not(.dummy-nav-parent) {
    display: grid;
}

.dummy-shell.is-sidebar-collapsed .dummy-sidebar:hover .dummy-subnav-list {
    margin-left: 29px;
}

.dummy-shell.is-sidebar-collapsed .dummy-sidebar:hover .dummy-nav-group.is-open .dummy-subnav-list {
    display: grid;
}

.sidebar-toggle {
    width: 28px;
    height: 28px;
    min-height: 28px;
    margin: auto 18px 12px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: var(--surface);
    color: #414750;
}

.dummy-shell.is-sidebar-collapsed .sidebar-toggle {
    margin-inline: 18px;
}

.sidebar-toggle:hover {
    border-color: #c8c6c4;
    background: #e1f1ff;
    color: var(--blue);
}

.sidebar-toggle span {
    width: 12px;
    height: 12px;
    position: relative;
    display: grid;
    place-items: center;
    transition: transform 0.18s ease;
}

.sidebar-toggle span::before {
    content: "";
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(135deg);
}

.dummy-shell.is-sidebar-collapsed .sidebar-toggle span {
    transform: rotate(180deg);
}

.search-box {
    width: 100%;
    max-width: 320px;
    min-height: 24px;
    height: 24px;
    padding: 0 8px;
    justify-self: start;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: #f4f3f2;
}

.search-box .material-symbols-outlined {
    color: var(--muted);
    font-size: 16px;
}

.search-box input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font-size: 11px;
}

.search-box:focus-within {
    border-color: var(--blue);
    background: #fff;
    box-shadow: 0 0 0 1px var(--blue);
}

.topbar-actions {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: nowrap;
}

.global-new-menu {
    position: relative;
    z-index: 130;
    justify-self: end;
}

.global-new-dismiss {
    position: fixed;
    inset: 0;
    z-index: 129;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    cursor: default;
}

.global-new-button {
    height: 24px;
    min-height: 24px;
    padding: 0 8px 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid var(--blue);
    border-radius: 4px;
    background: var(--blue);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
}

.global-new-button .material-symbols-outlined {
    width: auto;
    height: auto;
    font-size: 14px;
    transform: none;
    transition: transform 120ms ease;
}

.global-new-menu.is-open .global-new-button .material-symbols-outlined {
    transform: rotate(180deg);
}

.global-new-button > span:first-child {
    width: auto;
    height: auto;
    display: inline;
    font-size: 12px;
    font-weight: 700;
    transform: none;
}

.global-new-button:hover,
.global-new-button:focus-visible {
    border-color: #004881;
    background: #004881;
}

.global-new-dropdown {
    width: 184px;
    padding: 4px;
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 130;
    display: grid;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.14);
}

.global-new-dropdown[hidden] {
    display: none;
}

.global-new-dropdown button {
    min-height: 28px;
    padding: 0 8px;
    gap: 8px;
    border-radius: 3px;
    color: #414750;
    font-size: 11px;
    font-weight: 500;
}

.global-new-dropdown button span {
    width: 16px;
    height: 16px;
    color: var(--muted);
    font-size: 16px;
    transform: none;
}

.global-new-dropdown button:hover,
.global-new-dropdown button:focus-visible {
    background: #e1f1ff;
    color: var(--blue);
}

.topbar-icon-group {
    height: 24px;
    padding-left: 12px;
    display: flex;
    align-items: center;
    gap: 2px;
    border-left: 1px solid var(--line);
}

.topbar-icon-button {
    width: 24px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #414750;
}

.topbar-icon-button:hover,
.topbar-icon-button.active {
    background: #e1f1ff;
    color: var(--blue);
}

.topbar-icon-button .material-symbols-outlined {
    font-size: 18px;
}

.topbar-user {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.topbar-user > div {
    display: grid;
    gap: 1px;
    text-align: right;
}

.topbar-user strong {
    color: var(--text);
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
}

.topbar-user span {
    color: var(--muted);
    font-size: 10px;
    line-height: 1;
}

.topbar-avatar {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: #f4f3f2;
    color: var(--blue) !important;
    font-size: 10px !important;
    font-weight: 700;
}

.auth-layout {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 32px;
    background: #f3f2f1;
}

.auth-shell {
    width: min(100%, 420px);
    display: grid;
}

.auth-panel {
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .08);
}

.auth-brand {
    min-height: 48px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #d8dde6;
    background: #fff;
}

.auth-brand .brand-mark {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border-radius: 4px;
    background: var(--blue);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.auth-brand div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.auth-brand strong {
    color: var(--blue);
    font-size: 18px;
    font-weight: 800;
    line-height: 18px;
}

.auth-brand span {
    color: #727782;
    font-size: 11px;
    font-weight: 600;
    line-height: 12px;
}

.auth-copy {
    padding: 18px 18px 10px;
    border-bottom: 1px solid #edebe9;
}

.auth-copy h1 {
    margin-bottom: 6px;
    color: #1a1c1c;
    font-size: 22px;
    font-weight: 750;
    line-height: 26px;
}

.auth-copy p {
    margin-bottom: 0;
    color: #605e5c;
    font-size: 12px;
    line-height: 18px;
}

.auth-panel > .form-error,
.auth-panel > .form-success,
.auth-panel > .empty-state {
    margin: 14px 18px 0;
}

.auth-panel > .empty-state.compact {
    min-height: 96px;
    border-radius: 0;
    background: #faf9f8;
}

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

.auth-form.secondary {
    padding: 12px 0 0;
}

.auth-form label {
    display: grid;
    gap: 4px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

.auth-form input {
    width: 100%;
    min-height: 32px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 0 9px;
    background: #fff;
    color: #1a1c1c;
    font-size: 13px;
}

.auth-form input:focus {
    border-color: var(--blue);
    outline: 0;
    box-shadow: 0 0 0 1px var(--blue);
}

.auth-form small {
    color: #727782;
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
}

.auth-form .auth-checkbox {
    min-height: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #323130;
    cursor: pointer;
}

.auth-form .auth-checkbox input {
    width: 15px;
    min-height: 15px;
    height: 15px;
    margin: 0;
    accent-color: var(--blue);
}

.auth-form .auth-checkbox input:focus {
    box-shadow: 0 0 0 2px rgba(0, 90, 158, .22);
}

.auth-form button {
    min-height: 32px;
    border: 1px solid var(--blue);
    border-radius: 2px;
    background: var(--blue);
    color: #fff;
    font-size: 12px;
    font-weight: 750;
}

.auth-form button:hover,
.auth-form button:focus-visible {
    border-color: #004881;
    background: #004881;
}

.auth-text-link {
    width: fit-content;
    justify-self: center;
    color: #4f5966;
    font-size: 11px;
    font-weight: 650;
    line-height: 18px;
    text-decoration: none;
}

.auth-text-link:hover,
.auth-text-link:focus-visible {
    color: var(--blue);
    text-decoration: underline;
}

.auth-secondary-action {
    margin: -8px 18px 18px;
    display: flex;
    justify-content: flex-end;
}

.auth-secondary-action button {
    min-height: 28px;
    border: 0;
    background: transparent;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.auth-secondary-action button:hover,
.auth-secondary-action button:focus-visible {
    color: var(--blue);
    text-decoration: underline;
}

.auth-bootstrap {
    margin: 0 18px 18px;
    padding: 12px;
    border: 1px solid #c1c7d2;
    background: #faf9f8;
}

.auth-bootstrap > div:first-child {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.auth-bootstrap strong {
    color: #1a1c1c;
    font-size: 13px;
    font-weight: 750;
}

.auth-bootstrap span {
    color: #605e5c;
    font-size: 11px;
    line-height: 16px;
}

.auth-blocked {
    margin-top: 10px;
    display: grid;
    gap: 4px;
}

.auth-blocked span {
    padding: 6px 8px;
    border: 1px solid #fde68a;
    background: #fffbeb;
    color: #7a5d00;
    font-size: 11px;
    font-weight: 700;
}

.dummy-workspace {
    min-height: calc(100vh - var(--dummy-topbar-height));
    padding: 12px;
    display: grid;
    gap: 12px;
    align-content: start;
    background: #fff;
}

.view {
    display: none;
    gap: 16px;
}

.view.active {
    display: grid;
}

[data-ui-dummy-shell] .dummy-nav-link,
[data-ui-dummy-shell] .dummy-nav-parent {
    width: 100%;
    min-height: 28px;
    padding: 0 20px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    justify-items: start;
    gap: 12px;
    border: 0;
    border-right: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--sidebar-text);
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
    text-align: left;
    text-decoration: none;
    white-space: nowrap;
}

[data-ui-dummy-shell] .dummy-nav .nav-icon,
[data-ui-dummy-shell] .dummy-nav-parent .nav-icon {
    width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
    justify-self: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: currentColor;
}

[data-ui-dummy-shell] .dummy-nav .nav-icon svg {
    width: 18px;
    height: 18px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

[data-ui-dummy-shell] .dummy-nav-link:hover,
[data-ui-dummy-shell] .dummy-nav-link.active,
[data-ui-dummy-shell] .dummy-nav-group.is-current .dummy-nav-parent,
[data-ui-dummy-shell] .dummy-nav-parent:hover,
[data-ui-dummy-shell] .dummy-subnav:hover,
[data-ui-dummy-shell] .dummy-subnav.active {
    border-right-color: #69b7ff;
    background: rgba(0, 90, 158, 0.28);
    color: #69b7ff;
}

[data-ui-dummy-shell] .dummy-subnav {
    min-height: 24px;
    padding: 0 12px 0 22px;
    display: flex;
    align-items: center;
    border-right: 2px solid transparent;
    color: var(--sidebar-muted);
    font-size: 11px;
    font-weight: 400;
    line-height: 1;
    text-decoration: none;
}

[data-ui-dummy-shell].is-sidebar-collapsed .dummy-nav-link,
[data-ui-dummy-shell].is-sidebar-collapsed .dummy-nav-parent {
    width: 64px;
    min-height: 28px;
    margin: 0;
    padding: 0;
    grid-template-columns: 1fr;
    place-items: center;
    gap: 0;
    font-size: 0;
}

[data-ui-dummy-shell].is-sidebar-collapsed .dummy-nav-link .nav-text,
[data-ui-dummy-shell].is-sidebar-collapsed .dummy-nav-parent .nav-text {
    width: 0;
    max-width: 0;
    overflow: hidden;
}

[data-ui-dummy-shell].is-sidebar-collapsed .dummy-sidebar:hover .dummy-nav-link,
[data-ui-dummy-shell].is-sidebar-collapsed .dummy-sidebar:hover .dummy-nav-parent,
[data-ui-dummy-shell].is-sidebar-collapsed:has(.shell-sidebar-checkbox:checked) .dummy-nav-link,
[data-ui-dummy-shell].is-sidebar-collapsed:has(.shell-sidebar-checkbox:checked) .dummy-nav-parent {
    width: 100%;
    padding: 0 20px;
    grid-template-columns: 18px minmax(0, 1fr);
    place-items: center start;
    gap: 12px;
    font-size: 11px;
}

[data-ui-dummy-shell].is-sidebar-collapsed .dummy-sidebar:hover .dummy-nav-link .nav-text,
[data-ui-dummy-shell].is-sidebar-collapsed .dummy-sidebar:hover .dummy-nav-parent .nav-text,
[data-ui-dummy-shell].is-sidebar-collapsed:has(.shell-sidebar-checkbox:checked) .dummy-nav-link .nav-text,
[data-ui-dummy-shell].is-sidebar-collapsed:has(.shell-sidebar-checkbox:checked) .dummy-nav-parent .nav-text {
    width: auto;
    max-width: none;
    overflow: visible;
}

.project-list-panel {
    width: 100%;
    max-width: none;
    min-height: calc(100vh - var(--dummy-topbar-height) - 24px);
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
}

.project-list-panel > .project-list-header {
    order: 0;
    min-height: 44px;
    margin-bottom: 0;
    padding: 6px 8px;
    align-items: center;
    gap: 16px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.project-list-panel > .project-list-header > div:first-child {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 0;
}

.project-list-panel > .project-list-header h1 {
    margin: 0;
    color: #111;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

.project-list-panel > .project-list-header p {
    margin: 0 0 0 12px;
    display: inline-flex;
    color: #605e5c;
    font-size: 12px;
    font-weight: 400;
}

.project-create-button {
    height: 28px;
    min-height: 28px;
    padding: 0 14px;
    gap: 8px;
    border-color: #005a9e;
    border-radius: 2px;
    background: #005a9e;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.project-create-button .material-symbols-outlined {
    font-size: 16px;
}

.customer-list-panel {
    padding: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f8f8f8;
}

.supplier-list-panel {
    padding: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f8f8f8;
}

.customer-list-panel .module-header,
.supplier-list-panel .module-header {
    min-height: 44px;
    margin-bottom: 0;
    padding: 6px 8px;
    align-items: center;
    gap: 16px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.customer-list-panel .module-header > div:first-child,
.supplier-list-panel .module-header > div:first-child {
    display: flex;
    align-items: baseline;
    gap: 0;
    min-width: 0;
}

.customer-list-panel .module-header h1,
.supplier-list-panel .module-header h1 {
    margin: 0;
    color: #111;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

.customer-list-panel .module-header p,
.supplier-list-panel .module-header p {
    margin: 0 0 0 12px;
    display: inline-flex;
    color: #605e5c;
    font-size: 12px;
    font-weight: 400;
}

.customer-create-button,
.supplier-create-button {
    height: 28px;
    min-height: 28px;
    padding: 0 14px;
    gap: 8px;
    border-radius: 2px;
    font-size: 12px;
}

.customer-create-button .material-symbols-outlined,
.supplier-create-button .material-symbols-outlined {
    font-size: 16px;
}

.customer-list-panel > .form-error,
.customer-list-panel > .form-success,
.supplier-list-panel > .form-error,
.supplier-list-panel > .form-success {
    margin: 8px;
    padding: 6px 8px;
    border-radius: 2px;
    font-size: 11px;
}

.customer-list-panel > .empty-state,
.supplier-list-panel > .empty-state {
    min-height: 160px;
    margin: 8px;
    gap: 4px;
    border-radius: 0;
    background: #fff;
}

.customer-list-panel > .empty-state .material-symbols-outlined,
.supplier-list-panel > .empty-state .material-symbols-outlined {
    font-size: 28px;
}

.customer-list-panel > .empty-state strong,
.supplier-list-panel > .empty-state strong {
    font-size: 13px;
}

.customer-list-panel > .empty-state p,
.supplier-list-panel > .empty-state p {
    font-size: 11px;
}

.customer-form-panel,
.supplier-form-panel {
    margin: 8px;
    padding: 8px;
    border-color: #c7cdd4;
    border-radius: 2px;
    background: #fff;
}

.customer-form-panel .form-head,
.supplier-form-panel .form-head {
    min-height: 32px;
    margin: -8px -8px 8px;
    padding: 4px 8px;
    align-items: center;
    border-bottom: 1px solid #c1c7d2;
    background: #f3f2f1;
}

.customer-form-panel .form-head strong,
.supplier-form-panel .form-head strong {
    margin-bottom: 0;
    font-size: 13px;
}

.customer-form-panel .form-head span,
.supplier-form-panel .form-head span {
    font-size: 11px;
}

.customer-form-panel .form-head button,
.customer-form-panel .modal-actions button,
.supplier-form-panel .form-head button,
.supplier-form-panel .modal-actions button {
    min-height: 28px;
    border-radius: 2px;
    font-size: 12px;
}

.customer-form-panel .form-head button,
.supplier-form-panel .form-head button {
    width: 28px;
}

.customer-form-panel .form-grid,
.supplier-form-panel .form-grid {
    gap: 8px;
}

.customer-form-panel .form-grid label,
.supplier-form-panel .form-grid label {
    font-size: 11px;
}

.customer-form-panel .form-grid input,
.customer-form-panel .form-grid select,
.customer-form-panel .form-grid textarea,
.supplier-form-panel .form-grid input,
.supplier-form-panel .form-grid select,
.supplier-form-panel .form-grid textarea {
    min-height: 28px;
    border-radius: 2px;
    font-size: 12px;
}

.project-cockpit {
    margin-bottom: 14px;
    display: block;
}

.project-detail-kpis {
    padding: 8px;
    border: 1px solid #c1c7d2;
    background: #dadad9;
}

.dashboard-summary-head {
    min-height: 42px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-summary-head > div {
    display: grid;
    gap: 1px;
}

.dashboard-summary-head strong {
    color: #1a1c1c;
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
}

.dashboard-summary-head small {
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.cockpit-kicker {
    color: #727782;
    font-size: 10px;
    font-weight: 700;
    line-height: 12px;
    text-transform: uppercase;
}

.project-cockpit-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.cockpit-tile {
    min-height: 58px;
    padding: 8px;
    display: grid;
    align-content: space-between;
    gap: 4px;
    border: 1px solid #edebe9;
    border-radius: 0;
    background: #faf9f8;
    color: #1a1c1c;
    text-align: left;
    box-shadow: none;
}

button.cockpit-tile {
    font: inherit;
    cursor: pointer;
}

button.cockpit-tile:disabled {
    cursor: default;
    opacity: 1;
}

button.cockpit-tile:not(:disabled):hover,
button.cockpit-tile:not(:disabled):focus-visible {
    border-color: #cddbf7;
    background: #f8fbff;
    outline: 0;
}

.cockpit-tile.warning {
    border-color: #edebe9;
    border-left: 2px solid #ba1a1a;
    background: #faf9f8;
}

.cockpit-tile.critical {
    border-color: #edebe9;
    border-left: 2px solid #7a271a;
    background: #fff7f6;
}

.cockpit-tile span {
    color: #727782;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0;
}

.cockpit-tile strong {
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.cockpit-tile.warning strong {
    color: #ba1a1a;
}

.cockpit-tile.critical strong {
    color: #7a271a;
}

.cockpit-tile small {
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.dashboard-operational-grid {
    margin-top: 8px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.dashboard-operational-panel,
.dashboard-activity-strip {
    min-height: 118px;
    padding: 8px;
    border: 1px solid #edebe9;
    border-radius: 0;
    background: #faf9f8;
}

.dashboard-activity-strip {
    min-height: 74px;
    margin-top: 8px;
}

.project-controlling-reporting-overview {
    margin-top: 8px;
}

.dashboard-operational-panel header,
.dashboard-activity-strip header {
    margin-bottom: 7px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.dashboard-operational-panel header strong,
.dashboard-activity-strip header strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
}

.dashboard-operational-panel header span,
.dashboard-activity-strip header span {
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
}

.project-controlling-reporting-overview header > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.project-controlling-reporting-overview header small {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-controlling-reporting-kpis {
    margin-bottom: 8px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
}

.project-controlling-reporting-kpis article {
    min-height: 42px;
    padding: 6px;
    display: grid;
    gap: 2px;
    border: 1px solid #edebe9;
    background: #fff;
}

.project-controlling-reporting-kpis span,
.project-controlling-reporting-kpis strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-controlling-reporting-kpis span {
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.project-controlling-reporting-kpis strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.project-controlling-reporting-list {
    display: grid;
    gap: 4px;
}

.project-controlling-reporting-row {
    min-height: 42px;
    width: 100%;
    padding: 5px 6px;
    display: grid;
    grid-template-columns: minmax(150px, 1.2fr) repeat(4, minmax(80px, 1fr));
    gap: 6px;
    align-items: center;
    border: 1px solid #edebe9;
    border-left: 2px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.project-controlling-reporting-row.warning {
    border-left-color: #ba1a1a;
}

.project-controlling-reporting-row.critical {
    border-left-color: #7a271a;
    background: #fff7f6;
}

.project-controlling-reporting-row:hover,
.project-controlling-reporting-row:focus-visible {
    border-color: #cddbf7;
    outline: 0;
}

.project-controlling-reporting-row span {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.project-controlling-reporting-row small,
.project-controlling-reporting-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-controlling-reporting-row small {
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.project-controlling-reporting-row strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
    line-height: 15px;
}

.project-controlling-reporting-project-main strong {
    color: #005a9e;
}

.project-controlling-reporting-row.warning .project-controlling-reporting-warning strong {
    color: #ba1a1a;
}

.project-controlling-reporting-row.critical .project-controlling-reporting-warning strong {
    color: #7a271a;
}

.dashboard-line-list,
.dashboard-activity-list {
    display: grid;
    gap: 6px;
}

.dashboard-line-item,
.dashboard-activity-list > button {
    min-height: 34px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 6px;
    align-items: start;
}

button.dashboard-line-item,
.dashboard-activity-list > button {
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

button.dashboard-line-item:disabled {
    cursor: default;
    opacity: 1;
}

button.dashboard-line-item:not(:disabled):hover,
button.dashboard-line-item:not(:disabled):focus-visible,
.dashboard-activity-list > button:hover,
.dashboard-activity-list > button:focus-visible {
    outline: 0;
    background: #f3f2f1;
}

.dashboard-line-item > .material-symbols-outlined,
.dashboard-activity-list .material-symbols-outlined {
    color: #005a9e;
    font-size: 16px;
    line-height: 20px;
}

.dashboard-line-item.warning > .material-symbols-outlined {
    color: #ba1a1a;
}

.dashboard-line-item.critical > .material-symbols-outlined {
    color: #7a271a;
}

.dashboard-line-item strong,
.dashboard-activity-list strong {
    display: block;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 650;
    line-height: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-line-item small,
.dashboard-activity-list small {
    display: block;
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    line-height: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-empty-line {
    margin: 0;
    color: #727782;
    font-size: 11px;
    line-height: 15px;
}

.dashboard-summary-state {
    min-height: 120px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 6px;
    border: 1px dashed #c1c7d2;
    background: #efeeed;
    color: #727782;
    text-align: center;
}

.dashboard-summary-state .material-symbols-outlined {
    color: #727782;
    font-size: 26px;
}

.dashboard-summary-state strong {
    color: #1a1c1c;
    font-size: 13px;
}

.dashboard-summary-state p {
    max-width: 620px;
    margin-bottom: 0;
    font-size: 11px;
}

.project-list-toolbar {
    order: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 6px 8px;
    flex-wrap: wrap;
    border-bottom: 1px solid #c1c7d2;
    background: #f8f8f8;
}

.project-list-panel > .project-list-toolbar > strong {
    margin-left: auto;
    color: #605e5c;
    font-size: 11px;
    font-weight: 400;
}

.project-list-toolbar .project-tool-button,
.project-list-toolbar .project-filter-menu > summary {
    height: 28px;
    min-height: 28px;
    padding: 0 12px;
    gap: 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 11px;
    font-weight: 500;
    line-height: 14px;
    cursor: pointer;
}

.project-list-toolbar .project-tool-button:hover,
.project-list-toolbar .project-filter-menu > summary:hover {
    background: #e9e8e7;
}

.project-list-toolbar .project-tool-button .material-symbols-outlined,
.project-list-toolbar .project-filter-menu .material-symbols-outlined {
    font-size: 16px;
}

.project-view-toggle {
    height: 28px;
    display: inline-flex;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.project-view-toggle button {
    width: 34px;
    min-height: 26px;
    padding: 0;
    border: 0;
    border-right: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    color: #414750;
}

.project-view-toggle button:last-child {
    border-right: 0;
}

.project-view-toggle button.is-active,
.project-view-toggle button:hover {
    background: #e1f1ff;
    color: #005a9e;
}

.project-view-toggle .material-symbols-outlined {
    font-size: 16px;
}

.project-filter-menu {
    position: relative;
}

.project-filter-menu > summary {
    list-style: none;
}

.project-filter-menu > summary::-webkit-details-marker {
    display: none;
}

.project-filter-popover {
    width: 260px;
    padding: 8px;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 80;
    display: grid;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(26, 28, 28, 0.16);
}

.project-filter-menu:not([open]) .project-filter-popover {
    display: none;
}

.project-filter-popover .project-filter {
    display: grid;
    gap: 3px;
    color: #605e5c;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}

.project-filter-popover select {
    height: 28px;
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    text-transform: none;
}

.project-filter-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.project-filter-actions button {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    border: 1px solid var(--border);
    border-radius: 2px;
    background: #fff;
    color: var(--text);
    font-size: 11px;
    font-weight: 800;
}

.project-filter-actions button.primary {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
}

.article-search {
    flex: 1;
    min-width: 260px;
    height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--surface-soft);
    color: var(--muted);
}

.article-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
}

.compact-select {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.compact-select select {
    min-width: 150px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font-weight: 600;
}

.customer-list-toolbar {
    min-height: 42px;
    margin-bottom: 0;
    padding: 6px 8px;
    justify-content: flex-start;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f8f8f8;
}

.customer-list-toolbar .article-search {
    width: min(478px, 34vw);
    min-width: 260px;
    height: 28px;
    min-height: 28px;
    flex: 0 1 478px;
    padding: 0 8px;
    gap: 8px;
    border-radius: 2px;
    background: #fff;
}

.customer-list-toolbar .article-search .material-symbols-outlined {
    color: #68717d;
    font-size: 16px;
    font-weight: 400;
}

.customer-list-toolbar .article-search input {
    color: #414750;
    font-size: 12px;
}

.customer-list-toolbar .compact-select {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    gap: 6px;
    border-color: #c7cdd4;
    border-radius: 2px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 500;
}

.customer-list-toolbar .compact-select span {
    color: #68717d;
    font-size: 10px;
    font-weight: 700;
}

.customer-list-toolbar .compact-select select {
    min-width: 110px;
    height: 26px;
    color: #334155;
    font-size: 11px;
    font-weight: 500;
}

.customer-list-toolbar .customer-tool-button {
    height: 28px;
    min-height: 28px;
    padding: 0 12px;
    border-color: #c7cdd4;
    color: #334155;
    font-size: 12px;
}

.project-list-panel > .customer-list-toolbar > strong,
.customer-list-toolbar > strong {
    margin-left: auto;
    color: #605e5c;
    font-size: 12px;
    font-weight: 400;
}

.supplier-list-toolbar {
    min-height: 42px;
    margin-bottom: 0;
    padding: 6px 8px;
    justify-content: flex-start;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f8f8f8;
}

.supplier-list-toolbar .article-search {
    width: min(478px, 34vw);
    min-width: 260px;
    height: 28px;
    min-height: 28px;
    flex: 0 1 478px;
    padding: 0 8px;
    gap: 8px;
    border-radius: 2px;
    background: #fff;
}

.supplier-list-toolbar .article-search .material-symbols-outlined {
    color: #68717d;
    font-size: 16px;
    font-weight: 400;
}

.supplier-list-toolbar .article-search input {
    color: #414750;
    font-size: 12px;
}

.supplier-list-toolbar .compact-select {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    gap: 6px;
    border-color: #c7cdd4;
    border-radius: 2px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 500;
}

.supplier-list-toolbar .compact-select span {
    color: #68717d;
    font-size: 10px;
    font-weight: 700;
}

.supplier-list-toolbar .compact-select select {
    min-width: 110px;
    height: 26px;
    color: #334155;
    font-size: 11px;
    font-weight: 500;
}

.supplier-list-toolbar .supplier-tool-button {
    height: 28px;
    min-height: 28px;
    padding: 0 12px;
    border-color: #c7cdd4;
    color: #334155;
    font-size: 12px;
}

.project-list-panel > .supplier-list-toolbar > strong,
.supplier-list-toolbar > strong {
    margin-left: auto;
    color: #605e5c;
    font-size: 12px;
    font-weight: 400;
}

.project-form-panel {
    margin-bottom: 16px;
    padding: 16px;
    border: 1px solid #c9d8ff;
    border-radius: 8px;
    background: #f8fbff;
}

.project-modal-backdrop,
.project-status-modal-backdrop,
.project-document-create-modal-backdrop,
.customer-modal-backdrop,
.project-note-modal-backdrop,
.calendar-event-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(24, 31, 38, 0.35);
}

.catalog-export-modal.project-modal,
.quote-transfer-modal.project-modal,
.project-status-modal,
.project-document-create-modal,
.note-modal,
.accounting-dunning-block-modal,
.accounting-dunning-preview-modal {
    width: min(960px, calc(100vw - 28px));
    max-height: min(94vh, 920px);
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 90;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(20, 30, 45, 0.24);
}

.quote-transfer-modal.project-modal {
    width: min(1040px, calc(100vw - 32px));
    max-height: min(92vh, 860px);
}

.quote-transfer-modal .modal-body {
    gap: 12px;
    background: #fff;
}

.quote-transfer-row,
.quote-transfer-file-row {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.quote-transfer-modal .helper,
.quote-transfer-grid label {
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.quote-transfer-segmented {
    width: max-content;
    display: inline-flex;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
}

.quote-transfer-segmented button {
    min-width: 92px;
    min-height: 30px;
    padding: 0 14px;
    border: 0;
    border-right: 1px solid #c1c7d2;
    border-radius: 0;
    background: transparent;
    color: #414750;
    font-size: 12px;
    font-weight: 700;
}

.quote-transfer-segmented button:last-child {
    border-right: 0;
}

.quote-transfer-segmented button.active {
    background: #005a9e;
    color: #fff;
}

.quote-transfer-segmented button:disabled {
    color: #8a8f98;
    cursor: not-allowed;
}

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

.quote-transfer-grid label {
    display: grid;
    gap: 5px;
}

.quote-transfer-grid select {
    min-height: 32px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
    color: #414750;
    font-size: 12px;
}

.quote-transfer-version-select {
    min-width: 0;
    min-height: 34px;
    padding: 0 9px;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #252a31;
    font: inherit;
    text-overflow: ellipsis;
}

.quote-transfer-version-select:focus-visible {
    outline: 2px solid rgba(0, 90, 158, 0.22);
    outline-offset: 1px;
    border-color: #005a9e;
}

.quote-transfer-export-readiness,
.quote-transfer-export-result {
    min-height: 58px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    border: 1px solid #c1c7d2;
    border-left-width: 3px;
    background: #f7f8fa;
}

.quote-transfer-export-readiness.is-ready {
    border-left-color: #107c10;
    background: #f2faf2;
}

.quote-transfer-export-readiness.is-blocked {
    border-left-color: #8a8886;
}

.quote-transfer-export-readiness > .material-symbols-outlined,
.quote-transfer-export-result > .material-symbols-outlined {
    color: #516173;
    font-size: 20px;
}

.quote-transfer-export-readiness.is-ready > .material-symbols-outlined {
    color: #107c10;
}

.quote-transfer-export-readiness > div,
.quote-transfer-export-result > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.quote-transfer-export-readiness strong,
.quote-transfer-export-result strong {
    overflow: hidden;
    color: #252a31;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quote-transfer-export-readiness span,
.quote-transfer-export-result span,
.quote-transfer-export-result small {
    color: #605e5c;
    font-size: 11px;
}

.quote-transfer-export-result {
    grid-template-columns: 26px minmax(0, 1fr) auto;
    border-left-color: #005a9e;
    background: #eef6fc;
}

.quote-transfer-export-result .btn {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
}

.quote-transfer-export-result .btn .material-symbols-outlined {
    color: inherit;
    font-size: 17px;
}

.quote-transfer-file-input {
    min-height: 34px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.quote-transfer-file-input input[type="file"] {
    min-width: 260px;
    color: #414750;
    font-size: 11px;
}

.quote-transfer-file-input span {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quote-transfer-preview {
    min-height: 0;
    display: grid;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.quote-transfer-preview-head {
    min-height: 48px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.quote-transfer-preview-head > div:first-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.quote-transfer-preview-head strong {
    color: #1a1c1c;
    font-size: 12px;
}

.quote-transfer-preview-head span {
    color: #605e5c;
    font-size: 10px;
}

.quote-transfer-preview-badges {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: wrap;
}

.quote-transfer-preview-badges span {
    min-height: 22px;
    padding: 3px 7px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c8d9ef;
    border-radius: 2px;
    background: #edf5ff;
    color: #005a9e;
    font-size: 10px;
    font-weight: 700;
}

.quote-transfer-preview-badges span.has-errors {
    border-color: #edb8b8;
    background: #fff0f0;
    color: #a4262c;
}

.quote-transfer-preview-table {
    max-height: 330px;
    overflow: auto;
}

.quote-transfer-preview-table-head,
.quote-transfer-preview-table-row {
    min-width: 920px;
    display: grid;
    grid-template-columns: 54px 100px minmax(220px, 1.2fr) 120px 100px minmax(260px, 1fr);
}

.quote-transfer-preview-table-head {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f4f3f2;
}

.quote-transfer-preview-table-head span,
.quote-transfer-preview-table-row > span {
    min-height: 32px;
    padding: 7px 8px;
    overflow: hidden;
    border-right: 1px solid #dde2ea;
    border-bottom: 1px solid #dde2ea;
    color: #414750;
    font-size: 11px;
    text-overflow: ellipsis;
}

.quote-transfer-preview-table-head span {
    color: #414750;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.quote-transfer-preview-table-row.warning {
    background: #fff8df;
}

.quote-transfer-preview-table-row.error {
    background: #fff0f0;
}

.quote-transfer-preview-text {
    display: grid;
    gap: 2px;
}

.quote-transfer-preview-text strong,
.quote-transfer-preview-text small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .quote-transfer-row,
    .quote-transfer-file-row,
    .quote-transfer-grid {
        grid-template-columns: 1fr;
    }

    .quote-transfer-export-result {
        grid-template-columns: 26px minmax(0, 1fr);
    }

    .quote-transfer-export-result .btn {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .quote-transfer-preview-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .quote-transfer-preview-badges {
        justify-content: flex-start;
    }
}

.project-status-modal {
    width: min(600px, calc(100vw - 32px));
}

.project-document-create-modal {
    width: min(760px, calc(100vw - 32px));
}

.project-document-create-modal.document-create-picker-modal {
    width: min(520px, calc(100vw - 32px));
}

.project-document-create-modal.document-create-instance-modal {
    width: min(920px, calc(100vw - 32px));
}

.project-document-create-modal.project-document-register-export-modal {
    width: min(560px, calc(100vw - 32px));
}

.project-document-register-export-modal .modal-body {
    gap: 14px;
}

.project-document-register-export-option {
    min-height: 34px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid #d6dce5;
    border-radius: 2px;
    background: #f8f9fb;
    color: #24313e;
    font-size: 12px;
    font-weight: 700;
}

.project-document-register-export-option input {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #005a9e;
}

.project-document-create-modal.document-create-instance-modal .document-create-body {
    max-height: min(74vh, 700px);
}

.project-document-upload-modal,
.project-document-metadata-modal,
.customer-document-upload-modal,
.project-document-folder-action-modal,
.customer-document-folder-action-modal {
    width: min(720px, calc(100vw - 32px));
    max-height: min(88vh, 680px);
}

.project-document-upload-modal.project-document-upload-modal {
    width: min(540px, calc(100vw - 32px));
    max-height: min(82vh, 620px);
}

.project-document-upload-modal .document-upload-body {
    padding: 18px;
}

.project-document-upload-fields {
    min-width: 0;
    display: grid;
    gap: 16px;
}

.project-document-upload-number {
    min-width: 0;
    display: grid;
    gap: 5px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.project-document-upload-number input {
    width: 100%;
    min-height: 32px;
    padding: 0 9px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
    color: #414750;
    font: 600 12px/1.2 "Roboto Mono", Consolas, monospace;
}

.project-document-upload-number small {
    color: #727782;
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
}

.project-document-upload-choice {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.project-document-upload-choice-label {
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.project-document-upload-pickers {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.project-document-upload-picker {
    position: relative;
    min-width: 0;
    min-height: 72px;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #005a9e;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.project-document-upload-picker:hover,
.project-document-upload-picker:focus-within {
    border-color: #005a9e;
    background: #eef6fc;
}

.project-document-upload-picker .material-symbols-outlined {
    flex: 0 0 auto;
    color: #005a9e;
    font-size: 21px;
}

.project-document-upload-picker input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.project-document-upload-selection {
    min-width: 0;
    padding: 10px 12px;
    display: grid;
    gap: 5px;
    border: 1px solid #d9dee7;
    border-radius: 2px;
    background: #f8f9fb;
    color: #414750;
    font-size: 11px;
}

.project-document-upload-selection strong {
    color: #1a1c1c;
    font-size: 11px;
}

.project-document-upload-selection ul {
    min-width: 0;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 2px;
    list-style: none;
}

.project-document-upload-selection li {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-document-upload-selection > span {
    color: #727782;
    font-size: 10px;
}

@media (max-width: 620px) {
    .project-document-upload-pickers {
        grid-template-columns: 1fr;
    }
}

.project-document-folder-action-modal .form-grid,
.customer-document-folder-action-modal .form-grid {
    grid-template-columns: minmax(220px, 1fr) minmax(220px, .9fr);
}

.project-document-folder-modal-context,
.customer-document-folder-modal-context {
    min-width: 0;
    display: grid;
    gap: 4px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

.project-document-folder-modal-context strong,
.customer-document-folder-modal-context strong {
    min-height: 30px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-document-folder-modal-context small,
.customer-document-folder-modal-context small {
    color: #605e5c;
    font-size: 10px;
    font-weight: 600;
    line-height: 14px;
}

.note-modal {
    width: min(760px, calc(100vw - 32px));
    max-height: min(92vh, 780px);
}

.project-modal .modal-head,
.project-status-modal .modal-head,
.project-document-create-modal .modal-head,
.note-modal .modal-head {
    min-height: 40px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-modal .modal-head > div,
.project-status-modal .modal-head > div,
.project-document-create-modal .modal-head > div,
.note-modal .modal-head > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.project-modal .modal-head strong,
.project-status-modal .modal-head strong,
.project-document-create-modal .modal-head strong,
.note-modal .modal-head strong {
    color: #1a1c1c;
    font-size: 13px;
    font-weight: 700;
    line-height: 16px;
}

.project-modal .modal-head span,
.project-status-modal .modal-head span,
.project-document-create-modal .modal-head span,
.note-modal .modal-head span {
    color: #605e5c;
    overflow: hidden;
    font-size: 10px;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-modal .modal-head button,
.project-status-modal .modal-head button,
.project-document-create-modal .modal-head button,
.note-modal .modal-head button {
    width: 24px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #414750;
    font-size: 14px;
    font-weight: 800;
}

.project-modal .modal-head button:hover,
.project-status-modal .modal-head button:hover,
.project-document-create-modal .modal-head button:hover,
.note-modal .modal-head button:hover {
    background: #ffdad6;
    color: #93000a;
}

.project-modal .modal-body,
.project-status-modal .modal-body,
.project-document-create-modal .modal-body,
.note-modal .modal-body {
    min-height: 0;
    padding: 16px;
    display: grid;
    gap: 14px;
    overflow: auto;
}

.project-modal .modal-body::-webkit-scrollbar,
.project-status-modal .modal-body::-webkit-scrollbar,
.project-document-create-modal .modal-body::-webkit-scrollbar,
.note-modal .modal-body::-webkit-scrollbar {
    width: 4px;
}

.project-modal .modal-body::-webkit-scrollbar-thumb,
.project-status-modal .modal-body::-webkit-scrollbar-thumb,
.project-document-create-modal .modal-body::-webkit-scrollbar-thumb,
.note-modal .modal-body::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background: #c1c7d2;
}

.project-modal .form-grid,
.project-document-create-modal .form-grid {
    gap: 12px 14px;
}

.project-modal .form-grid label,
.project-document-create-modal .form-grid label {
    color: #414750;
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
}

.project-document-create-modal .form-grid .wide {
    grid-column: 1 / -1;
}

.project-modal .form-grid input,
.project-modal .form-grid select,
.project-modal .form-grid textarea,
.project-document-create-modal .form-grid input,
.project-document-create-modal .form-grid select,
.project-document-create-modal .form-grid textarea {
    min-height: 30px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
}

.project-modal .form-grid input:disabled,
.project-modal .form-grid select:disabled,
.project-document-create-modal .form-grid input:disabled,
.project-document-create-modal .form-grid select:disabled {
    background: #f4f3f2;
    color: #727782;
}

.project-modal .modal-actions,
.project-status-modal .modal-actions,
.project-document-create-modal .modal-actions {
    min-height: 52px;
    margin-top: 0;
    padding: 0 16px;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-modal .modal-actions button,
.project-status-modal .modal-actions button,
.project-document-create-modal .modal-actions button {
    min-height: 30px;
    padding: 0 16px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
}

.project-modal .modal-actions button.primary,
.project-status-modal .modal-actions button.primary,
.project-document-create-modal .modal-actions button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.project-modal .form-error,
.project-status-modal .form-error,
.project-document-create-modal .form-error {
    margin-bottom: 0;
    border-radius: 2px;
}

.project-modal .diagnostic-message,
.project-status-modal .diagnostic-message,
.project-document-create-modal .diagnostic-message {
    margin: 0;
}

.master-catalog-item-form-backdrop,
.master-catalog-import-backdrop,
.master-catalog-export-backdrop,
.master-catalog-price-backdrop,
.master-catalog-price-import-backdrop,
.master-catalog-master-list-backdrop,
.master-catalog-structure-management-backdrop,
.master-catalog-list-backdrop,
.master-catalog-category-backdrop {
    position: fixed;
    inset: 0;
    z-index: 170;
    display: block;
    background: rgba(24, 31, 38, 0.35);
}

.master-catalog-item-form-backdrop,
.master-catalog-import-backdrop,
.master-catalog-export-backdrop,
.master-catalog-price-backdrop,
.master-catalog-price-import-backdrop,
.master-catalog-master-list-backdrop,
.master-catalog-list-backdrop,
.master-catalog-category-backdrop {
    position: fixed;
    inset: 0;
    z-index: 170;
    display: block;
    background: rgba(24, 31, 38, 0.35);
}

.article-modal.master-catalog-item-modal,
.service-modal.master-catalog-item-modal,
.article-master-modal.master-catalog-item-modal,
.article-import-modal.master-catalog-item-modal,
.catalog-export-modal.master-catalog-item-modal,
.sales-price-import-modal.master-catalog-item-modal,
.sales-price-modal.master-catalog-item-modal,
.master-catalog-structure-management-modal.master-catalog-item-modal,
.catalog-list-modal.master-catalog-item-modal,
.catalog-category-modal.master-catalog-item-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 180;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(20, 30, 45, 0.24);
}

.article-modal.master-catalog-item-modal {
    width: min(980px, calc(100vw - 32px));
    max-height: min(92vh, 900px);
}

.service-modal.master-catalog-item-modal {
    width: min(1240px, calc(100vw - 24px));
    max-height: min(94vh, 920px);
}

.quote-position-modal.master-catalog-item-modal {
    width: min(1480px, calc(100vw - 48px));
    max-height: min(92vh, 920px);
}

.dummy-shell.is-sidebar-collapsed .quote-position-modal.master-catalog-item-modal {
    left: calc(50% + 32px);
    width: min(1480px, calc(100vw - 128px));
}

.dummy-shell:not(.is-sidebar-collapsed) .quote-position-modal.master-catalog-item-modal {
    left: calc(50% + 130px);
    width: min(1480px, calc(100vw - 324px));
}

.quote-position-modal.master-catalog-item-modal .quote-position-modal-body {
    background: #fff;
}

.quote-position-modal.master-catalog-item-modal .quote-position-modal-grid {
    align-items: start;
}

.quote-position-modal.master-catalog-item-modal .quote-position-modal-check {
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.quote-position-modal.master-catalog-item-modal .quote-position-modal-check input {
    width: 16px;
    min-height: 16px;
}

.quote-position-modal.master-catalog-item-modal .quote-position-calc-layout {
    display: grid;
    gap: 16px;
}

.quote-position-modal .quote-calculation-source-actions {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: wrap;
}

.quote-position-modal .quote-calculation-source-actions select {
    width: min(360px, 38vw);
    min-height: 30px;
    font-size: 10px;
}

.quote-position-modal .quote-position-calculation-persistence,
.quote-position-modal .quote-position-master-transfer {
    padding: 14px;
}

.quote-position-modal .quote-position-calculation-persistence {
    border-color: #9cc3dc;
    background: #f5fafd;
}

.quote-position-modal .quote-position-master-transfer {
    border-color: #d1d8df;
    background: #fafbfc;
}

.quote-position-modal .quote-position-calculation-persistence .service-calc-section-head,
.quote-position-modal .quote-position-master-transfer .service-calc-section-head {
    margin-bottom: 0;
}

.quote-position-modal .quote-calculation-transfer-confirmation {
    margin-top: 12px;
    padding: 14px;
    display: grid;
    gap: 10px;
    border: 1px solid #c6a55f;
    border-radius: 3px;
    background: #fffaf0;
}

.quote-position-modal .quote-calculation-transfer-confirmation > strong {
    color: #2c3945;
    font-size: 12px;
}

.quote-position-modal .quote-calculation-transfer-confirmation > p {
    margin: 0;
    color: #5f6c77;
    font-size: 10px;
    line-height: 15px;
}

.quote-position-modal .quote-calculation-transfer-confirmation textarea {
    min-height: 70px;
    resize: vertical;
}

.quote-position-modal .quote-calculation-transfer-confirmation footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.quote-position-modal .erp-inline-spinner {
    width: 22px;
    height: 22px;
    display: inline-block;
    border: 2px solid #c9d4de;
    border-top-color: #0067a8;
    border-radius: 50%;
    animation: quote-calculation-spin .8s linear infinite;
}

@keyframes quote-calculation-spin {
    to {
        transform: rotate(360deg);
    }
}

.quote-position-modal.master-catalog-item-modal .quote-position-modal-total-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.quote-position-display-settings-backdrop {
    position: fixed;
    inset: 0;
    z-index: 190;
    background: rgba(24, 31, 38, 0.35);
}

.quote-position-display-settings-modal.project-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 200;
    width: min(980px, calc(100vw - 40px));
    max-height: min(90vh, 760px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(20, 30, 45, 0.24);
}

.dummy-shell.is-sidebar-collapsed .quote-position-display-settings-modal.project-modal {
    left: calc(50% + 32px);
    width: min(980px, calc(100vw - 128px));
}

.dummy-shell:not(.is-sidebar-collapsed) .quote-position-display-settings-modal.project-modal {
    left: calc(50% + 130px);
    width: min(980px, calc(100vw - 324px));
}

.quote-position-display-settings-modal .quote-position-display-settings-body {
    padding: 24px 28px 28px;
    overflow: auto;
    background: #fff;
}

.quote-position-display-settings-body h2 {
    margin: 0 0 18px;
    color: #414750;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.25;
}

.quote-position-display-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 44px;
}

.quote-position-display-settings-column {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 2px;
}

.quote-position-display-settings-column label {
    min-height: 34px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    padding: 5px 0;
    color: #414750;
    font-size: 14px;
    line-height: 20px;
    cursor: pointer;
}

.quote-position-display-settings-column input[type="checkbox"] {
    width: 17px;
    height: 17px;
    min-height: 17px;
    margin: 1px 0 0;
    accent-color: #0f6cbd;
}

.quote-position-display-settings-column label:has(input:disabled) {
    color: #8a919a;
    cursor: default;
}

.quote-position-display-settings-modal .diagnostic-message,
.quote-position-display-settings-modal .form-error {
    margin: 0 0 14px;
}

@media (max-width: 1100px) {
    .dummy-shell.is-sidebar-collapsed .quote-position-display-settings-modal.project-modal,
    .dummy-shell:not(.is-sidebar-collapsed) .quote-position-display-settings-modal.project-modal {
        left: 50%;
        width: min(920px, calc(100vw - 32px));
    }

    .quote-position-display-settings-grid {
        gap: 8px 24px;
    }
}

.article-master-modal.master-catalog-master-list-modal {
    width: min(560px, calc(100vw - 32px));
    max-height: min(92vh, 760px);
}

.master-catalog-structure-management-modal.master-catalog-item-modal {
    width: min(1280px, calc(100vw - 28px));
    height: min(88vh, 820px);
    max-height: min(88vh, 820px);
}

.article-import-modal.master-catalog-import-modal {
    width: min(940px, calc(100vw - 32px));
    max-height: min(92vh, 900px);
}

.catalog-export-modal.master-catalog-export-modal {
    width: min(1120px, calc(100vw - 28px));
    max-height: min(94vh, 920px);
}

.master-catalog-position-arrange-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: block;
    background: rgba(24, 31, 38, 0.35);
}

.position-arrange-modal.master-catalog-item-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 90;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(20, 30, 45, 0.24);
}

.position-arrange-modal.master-catalog-position-arrange-modal {
    width: min(940px, calc(100vw - 32px));
    max-height: min(92vh, 900px);
}

.sales-price-import-modal.master-catalog-import-modal {
    width: min(1120px, calc(100vw - 28px));
    max-height: min(94vh, 920px);
}

.catalog-list-modal.master-catalog-structure-modal,
.catalog-category-modal.master-catalog-structure-modal {
    width: min(820px, calc(100vw - 32px));
    max-height: min(92vh, 820px);
}

.sales-price-modal.master-catalog-price-modal {
    width: min(1040px, calc(100vw - 28px));
    max-height: min(94vh, 920px);
}

.master-catalog-item-modal .modal-head {
    min-height: 40px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.master-catalog-item-modal .modal-head > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.master-catalog-item-modal .modal-head strong {
    color: #1a1c1c;
    font-size: 13px;
    font-weight: 700;
    line-height: 16px;
}

.master-catalog-item-modal .modal-head span {
    overflow: hidden;
    color: #605e5c;
    font-size: 10px;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-catalog-item-modal .modal-head button {
    width: 24px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #414750;
    font-size: 14px;
    font-weight: 800;
}

.master-catalog-item-modal .modal-head button:hover {
    background: #ffdad6;
    color: #93000a;
}

.master-catalog-item-modal .modal-body {
    min-height: 0;
    padding: 16px;
    display: grid;
    gap: 16px;
    overflow: auto;
}

.master-catalog-item-modal .modal-body::-webkit-scrollbar {
    width: 4px;
}

.master-catalog-item-modal .modal-body::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background: #c1c7d2;
}

.master-catalog-item-modal .service-modal-tabs {
    min-height: 54px;
    padding: 0 16px;
    display: flex;
    align-items: end;
    gap: 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
}

.master-catalog-item-modal .service-modal-tabs button {
    min-height: 40px;
    padding: 0 12px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #555f69;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.2px;
    text-transform: uppercase;
}

.master-catalog-item-modal .service-modal-tabs button.active {
    border-color: #24313e;
    color: #24313e;
}

.master-catalog-item-modal .service-modal-tabs button:disabled {
    color: #9aa3ad;
    cursor: not-allowed;
}

.master-catalog-item-modal .service-modal-panel {
    display: none;
}

.master-catalog-item-modal .service-modal-panel.active {
    display: grid;
    gap: 16px;
}

.master-catalog-item-modal .service-modal-panel[data-service-panel="service-info"].active {
    grid-template-columns: 220px minmax(360px, 1fr) minmax(420px, 1fr);
    align-items: start;
    gap: 24px;
}

.master-catalog-item-modal .service-upload-box {
    display: grid;
    justify-items: center;
    gap: 12px;
}

.master-catalog-item-modal .service-file-placeholder {
    width: 190px;
    height: 150px;
    display: grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.master-catalog-item-modal .service-file-placeholder span {
    width: 76px;
    height: 64px;
    position: relative;
    border: 8px solid #e1e3e6;
    border-radius: 8px;
}

.master-catalog-item-modal .service-file-placeholder span::before,
.master-catalog-item-modal .service-file-placeholder span::after {
    content: "";
    position: absolute;
    background: #e1e3e6;
}

.master-catalog-item-modal .service-file-placeholder span::before {
    width: 16px;
    height: 16px;
    left: 10px;
    top: 10px;
    border-radius: 50%;
}

.master-catalog-item-modal .service-file-placeholder span::after {
    width: 42px;
    height: 30px;
    left: 12px;
    bottom: 8px;
    clip-path: polygon(0 100%, 35% 45%, 52% 68%, 78% 20%, 100% 100%);
}

.master-catalog-item-modal .service-upload-box strong {
    max-width: 170px;
    color: #1a1c1c;
    font-size: 15px;
    line-height: 1.35;
    text-align: center;
}

.master-catalog-item-modal .service-upload-box button {
    min-height: 34px;
    background: #eef0f2;
}

.master-catalog-item-modal .service-info-form {
    display: grid;
    gap: 12px;
}

.master-catalog-item-modal .service-field-wide {
    grid-column: 1 / -1;
}

.master-catalog-item-modal .quote-position-option-grid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 42px;
    padding-top: 12px;
    border-top: 1px solid #c1c7d2;
}

.master-catalog-item-modal .quote-position-option-grid label {
    min-height: 22px;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: transparent;
    color: #4b5563;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
}

.master-catalog-item-modal .quote-position-option-grid input {
    width: 14px;
    height: 14px;
    min-height: 14px;
    flex: 0 0 14px;
    margin: 0;
    accent-color: #005a9e;
}

.master-catalog-item-modal .service-editor {
    min-height: 380px;
    display: grid;
    grid-template-rows: auto minmax(260px, 1fr);
    border: 1px solid #c1c7d2;
    background: #fff;
}

.master-catalog-item-modal .service-editor-toolbar {
    min-height: 76px;
    padding: 8px;
    display: flex;
    align-content: flex-start;
    flex-wrap: wrap;
    gap: 6px;
    border-bottom: 1px solid #c1c7d2;
    background: #f7f8fa;
}

.master-catalog-item-modal .service-editor-toolbar button {
    min-height: 30px;
    padding: 0 10px;
    border-color: #d7dee7;
    background: #eef1f4;
    color: #1d2731;
    font-size: 13px;
}

.master-catalog-item-modal .service-editor-area {
    min-height: 300px;
    padding: 14px;
    border: 0;
    outline: 0;
    color: #26313b;
    font-size: 14px;
    line-height: 1.5;
    resize: vertical;
}

.master-catalog-item-modal .service-calc-layout {
    display: grid;
    gap: 28px;
}

.master-catalog-item-modal .service-calc-section {
    display: grid;
    gap: 12px;
    overflow-x: auto;
}

.master-catalog-item-modal .service-calculation-preview-command {
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid #cfd6dc;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.master-catalog-item-modal .service-calculation-preview-command div {
    display: grid;
    gap: 2px;
}

.master-catalog-item-modal .service-calculation-preview-command strong {
    color: #1f2933;
    font-size: 14px;
    font-weight: 800;
}

.master-catalog-item-modal .service-calculation-preview-command span {
    color: #667482;
    font-size: 13px;
}

.master-catalog-item-modal .service-calculation-preview {
    border: 1px solid #cfd6dc;
    background: #fff;
    display: grid;
}

.master-catalog-item-modal .service-calculation-preview-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr));
    border-bottom: 1px solid #d7dde3;
}

.master-catalog-item-modal .service-calculation-preview-summary span {
    min-height: 54px;
    padding: 8px 12px;
    border-right: 1px solid #e1e5e9;
    display: grid;
    align-content: center;
    gap: 2px;
}

.master-catalog-item-modal .service-calculation-preview-summary span:last-child {
    border-right: 0;
}

.master-catalog-item-modal .service-calculation-preview-summary strong {
    color: #1f2933;
    font-size: 15px;
    font-weight: 800;
}

.master-catalog-item-modal .service-calculation-preview-summary small {
    color: #667482;
    font-size: 12px;
}

.master-catalog-item-modal .service-calculation-preview-lines {
    display: grid;
    grid-template-columns: 110px minmax(240px, 1fr) 130px 140px 140px;
}

.master-catalog-item-modal .service-calculation-preview-lines span {
    min-height: 36px;
    padding: 7px 10px;
    border-right: 1px solid #e1e5e9;
    border-bottom: 1px solid #e1e5e9;
    color: #303a45;
    font-size: 13px;
}

.master-catalog-item-modal .service-calculation-preview-lines span:nth-child(5n) {
    border-right: 0;
}

.master-catalog-item-modal .service-calculation-preview-messages {
    margin: 0;
    padding: 8px 12px 10px 28px;
    color: #667482;
    font-size: 13px;
}

.master-catalog-item-modal .service-calculation-preview-actions {
    min-height: 42px;
    padding: 8px 12px;
    border-top: 1px solid #d7dde3;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.master-catalog-item-modal .service-calculation-preview-actions span {
    color: #667482;
    font-size: 12px;
}

.master-catalog-item-modal .service-source-picker {
    border: 1px solid #cfd6dc;
    background: #fff;
    display: grid;
    gap: 0;
}

.master-catalog-item-modal .service-source-picker-head {
    min-height: 42px;
    padding: 8px 12px;
    border-bottom: 1px solid #d7dde3;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.master-catalog-item-modal .service-source-picker-head div {
    display: grid;
    gap: 2px;
}

.master-catalog-item-modal .service-source-picker-head strong {
    color: #1f2933;
    font-size: 14px;
    font-weight: 800;
}

.master-catalog-item-modal .service-source-picker-head span,
.master-catalog-item-modal .service-source-picker-toolbar span {
    color: #667482;
    font-size: 12px;
}

.master-catalog-item-modal .service-source-picker-toolbar {
    padding: 8px 12px;
    border-bottom: 1px solid #d7dde3;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 150px auto auto;
    gap: 8px;
    align-items: end;
}

.master-catalog-item-modal .service-source-picker-toolbar label {
    display: grid;
    gap: 3px;
}

.master-catalog-item-modal .service-source-picker-toolbar input,
.master-catalog-item-modal .service-source-picker-toolbar select {
    min-height: 32px;
    padding: 5px 8px;
    border: 1px solid #cfd6dc;
    background: #fff;
    color: #26313b;
    font-size: 14px;
}

.master-catalog-item-modal .service-source-picker-toolbar button {
    min-height: 32px;
    padding: 5px 12px;
    border: 1px solid #cfd6dc;
    background: #fff;
    color: #26313b;
    font-size: 13px;
    font-weight: 800;
}

.master-catalog-item-modal .service-source-picker-toolbar button[data-service-source-picker-manual] {
    color: #0d6efd;
}

.master-catalog-item-modal .service-source-picker-state {
    min-height: 42px;
    padding: 10px 12px;
    color: #667482;
    font-size: 13px;
}

.master-catalog-item-modal .service-source-picker-state.error {
    color: #b42318;
}

.master-catalog-item-modal .service-source-picker-table {
    display: grid;
    grid-template-columns: 130px minmax(220px, 1.2fr) minmax(260px, 1.5fr) 80px 120px 120px 100px;
    overflow-x: auto;
}

.master-catalog-item-modal .service-source-picker-table > strong {
    min-height: 34px;
    padding: 8px 10px;
    border-right: 1px solid #e1e5e9;
    border-bottom: 1px solid #d7dde3;
    background: #eeeeef;
    color: #3b3b3b;
    font-size: 13px;
    font-weight: 800;
}

.master-catalog-item-modal .service-source-picker-row {
    grid-column: 1 / -1;
    padding: 0;
    border: 0;
    background: transparent;
    display: grid;
    grid-template-columns: 130px minmax(220px, 1.2fr) minmax(260px, 1.5fr) 80px 120px 120px 100px;
    color: #26313b;
    text-align: left;
}

.master-catalog-item-modal .service-source-picker-row span {
    min-height: 36px;
    padding: 8px 10px;
    border-right: 1px solid #e1e5e9;
    border-bottom: 1px solid #e1e5e9;
    background: #fff;
    font-size: 13px;
}

.master-catalog-item-modal .service-source-picker-row:hover span,
.master-catalog-item-modal .service-source-picker-row:focus-visible span {
    background: #edf5ff;
}

.master-catalog-item-modal .service-calc-section h3 {
    margin: 0;
    color: #3f3f3f;
    font-size: 27px;
    font-weight: 400;
    line-height: 1.2;
}

.master-catalog-item-modal .service-calc-grid {
    display: grid;
    align-items: center;
    gap: 0;
}

.master-catalog-item-modal .service-calc-grid-material {
    min-width: 1460px;
    grid-template-columns: 160px minmax(220px, 1.5fr) 120px 120px 130px 130px 120px 140px 140px 140px;
}

.master-catalog-item-modal .service-calc-grid-labor {
    min-width: 1340px;
    grid-template-columns: 160px minmax(180px, 1fr) minmax(220px, 1.4fr) 120px 130px 140px 140px 140px 140px;
}

.master-catalog-item-modal .service-calc-grid > *,
.master-catalog-item-modal .service-net-table > *,
.master-catalog-item-modal .service-total-grid > * {
    min-height: 42px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
}

.master-catalog-item-modal .service-calc-grid strong,
.master-catalog-item-modal .service-net-table strong,
.master-catalog-item-modal .service-total-grid strong {
    min-height: 28px;
    color: #3b3b3b;
    font-size: 14px;
    font-weight: 800;
}

.master-catalog-item-modal .service-calc-grid span,
.master-catalog-item-modal .service-net-table span,
.master-catalog-item-modal .service-total-grid span {
    border: 1px solid #e0e0e0;
    background: #eeeeef;
    color: #788087;
    font-size: 15px;
}

.master-catalog-item-modal .service-calc-grid input,
.master-catalog-item-modal .service-calc-grid select,
.master-catalog-item-modal .service-net-table input,
.master-catalog-item-modal .service-total-grid input {
    width: 100%;
    min-height: 28px;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #303a45;
    font: inherit;
}

.master-catalog-item-modal .service-calc-grid select {
    padding-right: 18px;
    border: 1px solid #d7dde3;
    background: #fff;
}

.master-catalog-item-modal .service-calc-grid input:focus,
.master-catalog-item-modal .service-net-table input:focus,
.master-catalog-item-modal .service-total-grid input:focus {
    background: #fff;
    box-shadow: inset 0 0 0 1px #9fb6d0;
}

.master-catalog-item-modal .service-add-row {
    width: max-content;
    min-height: 26px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #0d6efd;
    font-size: 15px;
    font-weight: 800;
}

.master-catalog-item-modal .service-calc-command-head {
    color: transparent;
}

.master-catalog-item-modal .service-calc-grid .service-row-remove {
    width: 28px;
    min-height: 28px;
    padding: 0;
    justify-content: center;
    border: 1px solid #cfd6dc;
    background: #fff;
    color: #4b5563;
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
}

.master-catalog-item-modal .service-calc-grid .service-row-remove:hover:not(:disabled),
.master-catalog-item-modal .service-calc-grid .service-row-remove:focus-visible:not(:disabled) {
    border-color: #9fb6d0;
    background: #f8f9fa;
    color: #0f172a;
}

.master-catalog-item-modal .service-calc-grid .service-row-remove:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.master-catalog-item-modal .service-net-summary {
    display: grid;
    grid-template-columns: minmax(260px, 30%) minmax(0, 1fr);
    gap: 18px;
}

.master-catalog-item-modal .service-net-labels {
    padding-top: 58px;
    display: grid;
    grid-template-rows: repeat(3, 42px);
    align-items: center;
}

.master-catalog-item-modal .service-net-labels strong {
    color: #3b3b3b;
    font-size: 14px;
    font-weight: 800;
}

.master-catalog-item-modal .service-net-table {
    min-width: 720px;
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    align-items: center;
}

.master-catalog-item-modal .service-total-grid {
    width: min(620px, 100%);
    display: grid;
    grid-template-columns: repeat(3, minmax(160px, 1fr));
    align-items: center;
}

.master-catalog-item-modal .service-price-publish-preview {
    border-top: 1px solid #d7dde3;
    padding-top: 14px;
}

.master-catalog-item-modal .service-price-publish-grid {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 150px 120px auto;
    gap: 8px;
    align-items: end;
}

.master-catalog-item-modal .service-price-publish-grid label {
    display: grid;
    gap: 4px;
}

.master-catalog-item-modal .service-price-publish-grid label span {
    color: #667482;
    font-size: 12px;
    font-weight: 700;
}

.master-catalog-item-modal .service-price-publish-grid input {
    min-height: 32px;
    padding: 5px 8px;
    border: 1px solid #cfd6dc;
    background: #fff;
    color: #26313b;
    font-size: 14px;
}

.master-catalog-item-modal .service-price-publish-result {
    display: grid;
    grid-template-columns: repeat(5, minmax(130px, 1fr));
    border: 1px solid #cfd6dc;
    background: #fff;
}

.master-catalog-item-modal .service-price-publish-result.is-confirmed {
    margin-top: 10px;
    border-top: 2px solid #0070c0;
}

.master-catalog-item-modal .service-price-publish-reason {
    display: grid;
    gap: 5px;
    margin: 10px 0;
}

.master-catalog-item-modal .service-price-publish-reason span {
    color: #667482;
    font-size: 12px;
    font-weight: 700;
}

.master-catalog-item-modal .service-price-publish-reason input {
    min-height: 32px;
    padding: 5px 8px;
    border: 1px solid #cfd6dc;
    background: #fff;
    color: #26313b;
    font-size: 14px;
}

.master-catalog-item-modal .service-price-publish-result span {
    min-height: 52px;
    padding: 8px 12px;
    border-right: 1px solid #e1e5e9;
    display: grid;
    align-content: center;
    gap: 2px;
}

.master-catalog-item-modal .service-price-publish-result span:last-child {
    border-right: 0;
}

.master-catalog-item-modal .service-price-publish-result strong {
    color: #1f2933;
    font-size: 14px;
    font-weight: 800;
}

.master-catalog-item-modal .service-price-publish-result small {
    color: #667482;
    font-size: 12px;
}

.master-catalog-item-modal .service-net-table output,
.master-catalog-item-modal .service-total-grid output {
    color: #788087;
}

.master-catalog-master-list-modal .article-master-modal-body {
    gap: 12px;
}

.master-catalog-master-list-modal .article-master-modal-body > p {
    margin: 0;
    color: #667482;
    font-size: 13px;
    line-height: 1.45;
}

.master-catalog-master-list-modal .article-master-toggle-list {
    display: grid;
    gap: 8px;
}

.master-catalog-master-list-modal .article-master-toggle-row {
    min-height: 62px;
    padding: 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px;
    align-items: start;
    gap: 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.master-catalog-master-list-modal .article-master-row-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.master-catalog-master-list-modal .article-master-toggle-choice {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    min-width: 0;
}

.master-catalog-master-list-modal .article-master-toggle-list input {
    width: 14px;
    height: 14px;
    min-height: 14px;
    margin-top: 3px;
    accent-color: #005a9e;
}

.master-catalog-master-list-modal .article-master-toggle-list span,
.master-catalog-master-list-modal .article-master-toggle-list strong,
.master-catalog-master-list-modal .article-master-toggle-list small {
    min-width: 0;
    display: block;
}

.master-catalog-master-list-modal .article-master-toggle-list strong {
    overflow: hidden;
    color: #33404b;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-catalog-master-list-modal .article-master-toggle-list small {
    margin-top: 2px;
    overflow: hidden;
    color: #667482;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-catalog-master-list-modal .article-master-delete,
.master-catalog-master-list-modal .article-master-edit {
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #5b6673;
    cursor: pointer;
}

.master-catalog-master-list-modal .article-master-delete .material-symbols-outlined,
.master-catalog-master-list-modal .article-master-edit .material-symbols-outlined {
    font-size: 18px;
}

.master-catalog-master-list-modal .article-master-delete:hover:not(:disabled),
.master-catalog-master-list-modal .article-master-delete:focus-visible {
    border-color: #c1c7d2;
    background: #f4f7fb;
    color: #a52828;
}

.master-catalog-master-list-modal .article-master-edit:hover:not(:disabled),
.master-catalog-master-list-modal .article-master-edit:focus-visible {
    border-color: #8fb7d4;
    background: #f2f8fc;
    color: #005a9e;
}

.master-catalog-master-list-modal .article-master-delete:disabled,
.master-catalog-master-list-modal .article-master-edit:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.master-catalog-master-list-modal .article-master-rename {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 12px;
    padding: 12px;
    border-top: 1px solid #d7dde5;
    background: #f7f9fb;
}

.master-catalog-master-list-modal .article-master-rename label {
    display: grid;
    gap: 5px;
    min-width: 0;
    color: #3d4752;
    font-size: 12px;
    font-weight: 700;
}

.master-catalog-master-list-modal .article-master-rename input {
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 0 10px;
    border: 1px solid #aeb8c5;
    border-radius: 2px;
    background: #fff;
    color: #1d2733;
    font: inherit;
    font-weight: 500;
}

.master-catalog-master-list-modal .article-master-rename input:focus {
    border-color: #0067a8;
    box-shadow: 0 0 0 1px #0067a8;
    outline: none;
}

.master-catalog-master-list-modal .article-master-rename .modal-actions {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

.master-catalog-master-list-modal .article-master-delete-confirm {
    grid-column: 1 / -1;
    display: grid;
    gap: 8px;
    margin-top: 2px;
    padding: 10px 12px;
    border: 1px solid #d9b8b8;
    border-radius: 2px;
    background: #fff8f8;
    color: #26323f;
}

.master-catalog-master-list-modal .article-master-delete-confirm strong {
    font-size: 14px;
}

.master-catalog-master-list-modal .article-master-delete-confirm span {
    font-size: 13px;
    line-height: 1.35;
    color: #5b6673;
}

.master-catalog-master-list-modal .article-master-delete-confirm .modal-actions {
    padding: 0;
    border: 0;
    justify-content: flex-end;
}

.master-catalog-master-list-modal .article-master-delete-confirm .modal-actions .danger {
    background: #a52828;
    border-color: #a52828;
}

.master-catalog-master-list-modal .service-master-create {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    align-items: end;
    gap: 10px;
    padding-top: 4px;
}

.master-catalog-master-list-modal .service-master-create button {
    width: 36px;
    min-width: 36px;
    height: 34px;
    min-height: 34px;
    justify-content: center;
}

.master-catalog-item-modal .article-form-section {
    padding: 14px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.master-catalog-item-modal .article-form-section h3 {
    margin: 0 0 12px;
    color: #5c6875;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.master-catalog-item-modal .article-form-section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.master-catalog-item-modal .article-form-section-title-row h3 {
    margin: 0;
}

.master-catalog-item-modal .article-form-section-title-row .article-head-action {
    height: 28px;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 3px;
    font-size: 12px;
}

.master-catalog-price-modal .master-price-calculation-preview {
    margin-top: 10px;
}

.master-catalog-item-modal .article-form-grid,
.master-catalog-item-modal .article-calculation-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.master-catalog-import-modal .csv-import-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.master-catalog-price-modal .catalog-import-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.master-catalog-import-modal .catalog-mapping-grid {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(180px, 1fr) 80px;
    align-items: center;
    gap: 0;
    border: 1px solid #cfd6df;
    background: #fff;
}

.master-catalog-import-modal .catalog-mapping-grid > * {
    min-height: 34px;
    padding: 8px 10px;
    border-right: 1px solid #dde3ea;
    border-bottom: 1px solid #dde3ea;
    color: #27313d;
    font-size: 13px;
}

.master-catalog-import-modal .catalog-mapping-grid > :nth-child(3n) {
    border-right: 0;
}

.master-catalog-import-modal .catalog-mapping-grid > :nth-last-child(-n + 3) {
    border-bottom: 0;
}

.master-catalog-import-modal .catalog-mapping-grid > span:nth-child(-n + 3) {
    background: #f4f6f8;
    color: #5c6875;
    font-weight: 800;
    text-transform: uppercase;
}

.master-catalog-import-modal .catalog-mapping-grid select {
    width: 100%;
    min-height: 28px;
    border: 1px solid #cfd6df;
    background: #f8fafc;
}

.master-catalog-structure-modal .catalog-structure-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.master-catalog-import-modal .catalog-import-summary,
.master-catalog-export-modal .catalog-import-summary,
.master-catalog-structure-modal .catalog-import-summary,
.master-catalog-price-modal .catalog-import-summary {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
}

.master-catalog-position-arrange-modal .catalog-import-summary {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
}

.master-catalog-import-modal .catalog-import-summary p,
.master-catalog-export-modal .catalog-import-summary p,
.master-catalog-structure-modal .catalog-import-summary p,
.master-catalog-price-modal .catalog-import-summary p {
    max-width: 720px;
    margin: 0;
    color: #667482;
    font-size: 13px;
    line-height: 1.45;
}

.master-catalog-position-arrange-modal .catalog-import-summary p {
    max-width: 720px;
    margin: 0;
    color: #667482;
    font-size: 13px;
    line-height: 1.45;
}

.master-catalog-import-modal .section-label,
.master-catalog-export-modal .section-label,
.master-catalog-structure-modal .section-label,
.master-catalog-price-modal .section-label {
    display: block;
    margin-bottom: 8px;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 12px;
    text-transform: uppercase;
}

.master-catalog-position-arrange-modal .section-label {
    display: block;
    margin-bottom: 8px;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 12px;
    text-transform: uppercase;
}

.master-catalog-import-modal .catalog-import-badges,
.master-catalog-export-modal .catalog-import-badges,
.master-catalog-structure-modal .catalog-import-badges,
.master-catalog-price-modal .catalog-import-badges {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.master-catalog-position-arrange-modal .catalog-import-badges {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.master-catalog-import-modal .catalog-import-badges span,
.master-catalog-export-modal .catalog-import-badges span,
.master-catalog-structure-modal .catalog-import-badges span,
.master-catalog-price-modal .catalog-import-badges span {
    padding: 5px 10px;
    border-radius: 999px;
    background: #edf3ff;
    color: #2d66cc;
    font-size: 12px;
    font-weight: 900;
}

.master-catalog-position-arrange-modal .catalog-import-badges span {
    padding: 5px 10px;
    border-radius: 999px;
    background: #edf3ff;
    color: #2d66cc;
    font-size: 12px;
    font-weight: 900;
}

.master-catalog-price-modal input[readonly] {
    background: #f4f3f2;
    color: #414750;
}

.master-catalog-item-modal .article-field-wide {
    grid-column: 1 / -1;
}

.master-catalog-item-modal .manual-master-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    align-items: end;
    gap: 8px;
}

.master-catalog-item-modal .manual-master-add {
    width: 38px;
    min-height: 36px;
    padding: 0;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #eef4ff;
    color: #005a9e;
    font-size: 20px;
    font-weight: 700;
}

.master-catalog-item-modal .manual-master-add:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.master-catalog-item-modal .manual-new-master.article-field-wide {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.master-catalog-item-modal .modal-body label {
    gap: 5px;
    color: #3a424b;
    font-size: 13px;
    font-weight: 700;
}

.master-catalog-item-modal .modal-body input,
.master-catalog-item-modal .modal-body select,
.master-catalog-item-modal .modal-body textarea {
    min-height: 36px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 13px;
}

.master-catalog-item-modal .modal-body textarea {
    min-height: 84px;
    padding-top: 8px;
    resize: vertical;
}

.master-catalog-item-modal .modal-body input:disabled,
.master-catalog-item-modal .modal-body select:disabled {
    background: #f4f3f2;
    color: #727782;
}

.master-catalog-item-modal .article-calc-result {
    min-height: 66px;
    padding: 12px;
    display: grid;
    align-content: center;
    gap: 4px;
    border: 1px solid #d7dee7;
    border-radius: 2px;
    background: #f7f9fc;
}

.master-catalog-item-modal .article-calc-result span {
    color: #667482;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.master-catalog-item-modal .article-calc-result strong {
    color: #1a1c1c;
    font-size: 20px;
    font-weight: 800;
}

.master-catalog-item-modal .article-calc-note {
    margin: 10px 0 0;
    color: #667482;
    font-size: 12px;
}

.master-catalog-item-modal .article-history {
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
    list-style: none;
}

.master-catalog-item-modal .article-history li {
    padding: 10px 12px;
    display: grid;
    gap: 3px;
    border-left: 3px solid #d7dee7;
    background: #f8fafc;
}

.master-catalog-item-modal .article-history strong {
    color: #33404b;
    font-size: 13px;
}

.master-catalog-item-modal .article-history span {
    color: #667482;
    font-size: 13px;
}

.master-catalog-item-modal .article-history-detailed li {
    gap: 8px;
}

.master-catalog-item-modal .article-history-entry-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.master-catalog-item-modal .article-history-change-grid {
    display: grid;
    grid-template-columns: minmax(130px, 0.45fr) minmax(160px, 1fr) minmax(160px, 1fr);
    border: 1px solid #d7dee7;
    background: #fff;
    overflow: hidden;
}

.master-catalog-item-modal .article-history-change-grid strong,
.master-catalog-item-modal .article-history-change-grid span {
    min-width: 0;
    padding: 7px 8px;
    border-right: 1px solid #d7dee7;
    border-bottom: 1px solid #d7dee7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-catalog-item-modal .article-history-change-grid strong:nth-child(3n),
.master-catalog-item-modal .article-history-change-grid span:nth-child(3n) {
    border-right: 0;
}

.master-catalog-item-modal .article-history-change-grid strong {
    background: #f1f3f5;
    color: #3f4852;
    font-size: 12px;
    text-transform: uppercase;
}

.master-catalog-import-modal .csv-option-list {
    display: grid;
    gap: 8px;
}

.master-catalog-import-modal .csv-option-card {
    min-height: 64px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    cursor: pointer;
}

.master-catalog-import-modal .csv-option-card input {
    width: 14px;
    min-height: 14px;
    height: 14px;
    margin-top: 3px;
    accent-color: #005a9e;
}

.master-catalog-import-modal .csv-option-card strong,
.master-catalog-import-modal .csv-option-card small {
    display: block;
}

.master-catalog-import-modal .csv-option-card small {
    margin-top: 2px;
    color: #667482;
    font-weight: 500;
}

.master-catalog-import-modal .csv-option-card:has(input:checked) {
    border-color: #b9cdf8;
    background: #f3f7ff;
}

.master-catalog-import-modal .csv-preview-toolbar {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: #667482;
}

.master-catalog-import-modal .csv-preview-toolbar strong {
    color: #005a9e;
}

.master-catalog-import-modal .csv-preview-toolbar em {
    color: #33404b;
    font-style: normal;
    font-weight: 700;
}

.master-catalog-import-modal .catalog-import-checks {
    margin-bottom: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.master-catalog-import-modal .master-catalog-gaeb-format-readiness-grid span[data-readiness="active"] {
    border-color: #8ebfa0;
    background: #f3fbf5;
}

.master-catalog-import-modal .master-catalog-gaeb-format-readiness-grid span[data-readiness="preview"] {
    border-color: #b8c6d8;
    background: #f5f8fc;
}

.master-catalog-import-modal .master-catalog-gaeb-format-readiness-grid span[data-readiness="blocked"] {
    border-color: #e4c1bc;
    background: #fff7f5;
}

.master-catalog-import-modal .master-import-table {
    max-height: 360px;
    overflow: auto;
}

.master-catalog-import-modal .master-gaeb-import-table .article-list-head,
.master-catalog-import-modal .master-gaeb-import-table .article-list-row {
    grid-template-columns: 56px 86px 88px 120px minmax(180px, 1.2fr) 58px 76px minmax(140px, .8fr) minmax(220px, 1fr);
    min-width: 1040px;
}

.master-catalog-export-modal .catalog-export-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.master-catalog-export-modal .catalog-export-columns {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.master-catalog-export-modal .catalog-export-columns label {
    min-height: 30px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #d7dee7;
    border-radius: 2px;
    background: #f8fafc;
    color: #414750;
    font-size: 12px;
    font-weight: 700;
}

.master-catalog-export-modal .catalog-export-columns input {
    width: 14px;
    min-height: 14px;
    height: 14px;
    accent-color: #005a9e;
}

.master-catalog-export-modal .catalog-preview-table {
    display: grid;
    grid-template-columns: 130px minmax(180px, 1.4fr) minmax(140px, 1fr) 64px 110px 90px;
    overflow: auto;
    border: 1px solid #c1c7d2;
    border-bottom: 0;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
}

.master-catalog-export-modal .catalog-preview-table > span {
    min-height: 30px;
    padding: 6px 8px;
    overflow: hidden;
    border-right: 1px solid #d7dee7;
    border-bottom: 1px solid #d7dee7;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-catalog-export-modal .catalog-preview-table > span:nth-child(-n + 6) {
    background: #f4f3f2;
    color: #414750;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.master-catalog-item-modal .modal-actions {
    min-height: 52px;
    margin-top: 0;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.master-catalog-item-modal .modal-actions button,
.master-catalog-item-modal .modal-actions a {
    min-height: 30px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    line-height: 28px;
    text-decoration: none;
}

.master-catalog-item-modal .modal-actions button.primary,
.master-catalog-item-modal .modal-actions a.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

/* Professional catalog position editor. Scoped to avoid changing quote-position dialogs. */
.master-catalog-item-modal.catalog-position-editor {
    width: min(1480px, calc(100vw - 48px));
    height: min(92vh, 920px);
    max-height: min(92vh, 920px);
    border-color: #b9c2cc;
    border-radius: 4px;
    box-shadow: 0 20px 56px rgba(27, 39, 51, .22);
}

.master-catalog-item-modal.catalog-position-editor.catalog-article-editor {
    width: min(1160px, calc(100vw - 48px));
}

.catalog-position-editor .modal-head {
    min-height: 58px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #d6dde5;
    background: #fff;
}

.master-catalog-item-modal.catalog-position-editor .modal-head > .position-editor-title,
.master-catalog-item-modal.catalog-position-editor .modal-head > .position-editor-head-meta {
    display: flex;
    align-items: center;
}

.catalog-position-editor .position-editor-title {
    min-width: 0;
    gap: 10px;
}

.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-title-icon {
    width: 34px;
    height: 34px;
    display: grid;
    flex: 0 0 34px;
    place-items: center;
    border: 1px solid #bfd0df;
    border-radius: 3px;
    background: #edf5fb;
    color: #005a9e;
    font-size: 19px;
}

.catalog-position-editor .position-editor-title > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-title strong {
    overflow: hidden;
    color: #1f2933;
    font-size: 15px;
    line-height: 19px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-title > div > span {
    overflow: hidden;
    color: #667788;
    font-size: 11px;
    line-height: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-position-editor .position-editor-head-meta {
    gap: 10px;
}

.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-status {
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #c8d0d8;
    border-radius: 12px;
    background: #f5f7f9;
    color: #4b5966;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.catalog-position-editor .position-editor-status i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #758391;
}

.catalog-position-editor .position-editor-status.is-active {
    border-color: #aad8bd;
    background: #edf8f1;
    color: #176b3a;
}

.catalog-position-editor .position-editor-status.is-active i {
    background: #249452;
}

.catalog-position-editor .position-editor-status.is-review {
    border-color: #e4cf8d;
    background: #fff8df;
    color: #7a5b00;
}

.catalog-position-editor .position-editor-status.is-review i {
    background: #c39300;
}

.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-head-meta > button {
    width: 32px;
    height: 32px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #4b5966;
}

.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-head-meta > button:hover,
.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-head-meta > button:focus-visible {
    background: #edf1f5;
    color: #17212b;
}

.master-catalog-item-modal.catalog-position-editor .modal-head .position-editor-head-meta > button span {
    font-size: 20px;
}

.catalog-position-editor .service-modal-tabs {
    min-height: 46px;
    padding: 0 16px;
    gap: 4px;
    border-bottom: 1px solid #d6dde5;
    background: #fff;
}

.catalog-position-editor .service-modal-tabs button {
    min-width: 0;
    min-height: 46px;
    padding: 0 14px;
    gap: 7px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #52616f;
    font-size: 12px;
    letter-spacing: 0;
    text-transform: none;
}

.catalog-position-editor .service-modal-tabs button .material-symbols-outlined {
    font-size: 18px;
}

.catalog-position-editor .service-modal-tabs button small {
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    display: inline-grid;
    place-items: center;
    border-radius: 9px;
    background: #e6ebf0;
    color: #52616f;
    font-size: 9px;
}

.catalog-position-editor .service-modal-tabs button.active {
    border-bottom-color: #0067a8;
    background: transparent;
    color: #005a9e;
}

.catalog-position-editor .modal-body {
    min-height: 0;
    padding: 16px;
    flex: 1 1 auto;
    overflow: auto;
    background: #f3f5f7;
}

.catalog-position-editor .service-modal-panel.active {
    min-height: 100%;
}

.catalog-position-editor .position-editor-info.active {
    display: grid;
    grid-template-columns: 220px minmax(500px, 1.2fr) minmax(360px, .9fr);
    align-items: start;
    gap: 14px;
}

.catalog-position-editor .position-editor-info.is-article.active {
    grid-template-columns: 220px minmax(0, 1fr);
}

.catalog-position-editor .position-editor-summary,
.catalog-position-editor .article-form-section,
.catalog-position-editor .position-editor-description,
.catalog-position-editor .position-editor-calc-section,
.catalog-position-editor .position-editor-price-section,
.catalog-position-editor .position-editor-total-section,
.catalog-position-editor [data-master-catalog-item-history] {
    margin: 0;
    border: 1px solid #ccd4dc;
    border-radius: 4px;
    background: #fff;
}

.catalog-position-editor .position-editor-summary {
    min-width: 0;
    padding: 18px 16px;
    display: grid;
    align-content: start;
    gap: 7px;
}

.catalog-position-editor .position-editor-summary-icon {
    width: 44px;
    height: 44px;
    margin-bottom: 4px;
    display: grid;
    place-items: center;
    border: 1px solid #bfd0df;
    border-radius: 4px;
    background: #edf5fb;
    color: #005a9e;
}

.catalog-position-editor .position-editor-summary-icon span {
    font-size: 24px;
}

.catalog-position-editor .position-editor-summary-kicker {
    color: #667788;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.catalog-position-editor .position-editor-summary > strong {
    overflow: hidden;
    color: #1f2933;
    font-size: 15px;
    line-height: 19px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-position-editor .position-editor-summary > p {
    min-height: 34px;
    margin: 0 0 6px;
    color: #4b5966;
    font-size: 12px;
    line-height: 17px;
}

.catalog-position-editor .position-editor-summary dl {
    margin: 0;
    display: grid;
}

.catalog-position-editor .position-editor-summary dl div {
    min-width: 0;
    padding: 8px 0;
    display: grid;
    gap: 2px;
    border-top: 1px solid #e2e7ec;
}

.catalog-position-editor .position-editor-summary dt {
    color: #71808e;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.catalog-position-editor .position-editor-summary dd {
    margin: 0;
    overflow: hidden;
    color: #263442;
    font-size: 11px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-position-editor .position-editor-main {
    min-width: 0;
    display: grid;
    gap: 14px;
}

.catalog-position-editor .article-form-section,
.catalog-position-editor .position-editor-description,
.catalog-position-editor [data-master-catalog-item-history] {
    padding: 16px;
}

.catalog-position-editor .position-editor-section-head,
.catalog-position-editor .position-editor-history-head,
.catalog-position-editor .service-calc-section-head {
    margin-bottom: 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.catalog-position-editor .position-editor-section-head h3,
.catalog-position-editor .position-editor-history-head h3,
.catalog-position-editor .service-calc-section-head h3 {
    margin: 0;
    color: #263442;
    font-size: 13px;
    font-weight: 800;
    line-height: 18px;
}

.catalog-position-editor .position-editor-section-head span,
.catalog-position-editor .position-editor-history-head span,
.catalog-position-editor .service-calc-section-head span {
    color: #71808e;
    font-size: 10px;
    line-height: 14px;
}

.catalog-position-editor .position-editor-history-head > .material-symbols-outlined {
    color: #758391;
    font-size: 20px;
}

.catalog-position-editor .position-editor-core-grid {
    grid-template-columns: minmax(150px, .75fr) minmax(180px, 1fr) minmax(120px, .55fr);
    gap: 11px 12px;
}

.catalog-position-editor .position-editor-number-field {
    grid-column: span 1;
}

.catalog-position-editor .position-editor-name-field {
    grid-column: span 2;
}

.catalog-position-editor .position-editor-assignment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px 12px;
}

.catalog-position-editor .modal-body label {
    gap: 5px;
    color: #44525f;
    font-size: 10px;
    font-weight: 700;
}

.catalog-position-editor .modal-body label > span em {
    color: #bd2f2f;
    font-style: normal;
}

.catalog-position-editor .modal-body input,
.catalog-position-editor .modal-body select,
.catalog-position-editor .modal-body textarea {
    width: 100%;
    min-height: 34px;
    border-color: #bcc7d2;
    border-radius: 3px;
    background: #fff;
    color: #1f2933;
    font-size: 12px;
}

.catalog-position-editor .modal-body input:focus,
.catalog-position-editor .modal-body select:focus,
.catalog-position-editor .modal-body textarea:focus {
    border-color: #0067a8;
    outline: 2px solid rgba(0, 103, 168, .12);
    outline-offset: 0;
}

.catalog-position-editor .manual-master-row {
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 6px;
}

.catalog-position-editor .manual-master-add {
    width: 34px;
    min-height: 34px;
    margin-top: 19px;
    border-radius: 3px;
}

.catalog-position-editor .position-editor-description {
    min-width: 0;
    padding: 16px;
    display: flex;
    flex-direction: column;
}

.catalog-position-editor .position-editor-description .service-editor-area {
    min-height: 330px;
    padding: 12px;
    flex: 1 1 auto;
    resize: vertical;
    font-family: inherit;
    line-height: 18px;
}

.catalog-position-editor .position-editor-description > footer {
    padding-top: 8px;
    color: #71808e;
    font-size: 9px;
    line-height: 13px;
}

.catalog-position-editor .position-editor-info.is-article > .position-editor-description,
.catalog-position-editor .position-editor-info.is-article > .article-form-section,
.catalog-position-editor .position-editor-info.is-article > [data-master-catalog-item-history] {
    grid-column: 1 / -1;
}

.catalog-position-editor .position-editor-info.is-article .position-editor-description .service-editor-area {
    min-height: 180px;
}

.catalog-position-editor .article-calculation-grid {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 10px;
}

.catalog-position-editor .article-calc-result {
    min-height: 56px;
    padding: 10px 12px;
    border: 1px solid #d5dce3;
    border-radius: 3px;
    background: #f7f9fa;
}

.catalog-position-editor .service-calc-layout {
    display: grid;
    gap: 14px;
}

.catalog-position-editor .position-editor-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.catalog-position-editor .position-editor-kpis article {
    min-width: 0;
    padding: 11px 12px;
    display: grid;
    gap: 3px;
    border: 1px solid #ccd4dc;
    border-radius: 4px;
    background: #fff;
}

.catalog-position-editor .position-editor-kpis span {
    color: #71808e;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.catalog-position-editor .position-editor-kpis strong {
    color: #263442;
    font-size: 16px;
    line-height: 20px;
}

.catalog-position-editor .service-calculation-preview-command {
    min-height: 58px;
    padding: 10px 12px;
    border: 1px solid #c7d4df;
    border-radius: 4px;
    background: #eef5fa;
}

.catalog-position-editor .position-editor-calc-section,
.catalog-position-editor .position-editor-price-section,
.catalog-position-editor .position-editor-total-section {
    padding: 14px;
}

.catalog-position-editor .service-calc-section-head {
    margin-bottom: 10px;
}

.catalog-position-editor .service-calc-section-head > div {
    display: grid;
    gap: 2px;
}

.catalog-position-editor .service-add-row,
.catalog-position-editor .article-head-action {
    min-height: 30px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #9fb2c2;
    border-radius: 3px;
    background: #fff;
    color: #005a9e;
    font-size: 10px;
    font-weight: 800;
}

.catalog-position-editor .service-add-row .material-symbols-outlined {
    font-size: 16px;
}

.catalog-position-editor .service-line-table {
    overflow-x: auto;
    border: 1px solid #d5dce3;
    border-radius: 3px;
    background: #fff;
}

.catalog-position-editor .service-line-table-head,
.catalog-position-editor .service-line-row {
    min-width: 1040px;
    display: grid;
    align-items: center;
}

.catalog-position-editor .service-material-table .service-line-table-head,
.catalog-position-editor .service-material-table .service-line-row {
    grid-template-columns: minmax(220px, 2fr) 76px 64px 96px 96px 92px 100px 112px 34px;
}

.catalog-position-editor .service-labor-table .service-line-table-head,
.catalog-position-editor .service-labor-table .service-line-row {
    grid-template-columns: 112px minmax(220px, 2fr) 72px 78px 96px 92px 100px 112px 34px;
}

.catalog-position-editor .service-line-table-head {
    min-height: 30px;
    border-bottom: 1px solid #d5dce3;
    background: #edf1f4;
}

.catalog-position-editor .service-line-table-head span {
    padding: 0 8px;
    color: #52616f;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

.catalog-position-editor .service-line-row {
    min-height: 42px;
    border-bottom: 1px solid #e2e7ec;
}

.catalog-position-editor .service-line-row:last-child {
    border-bottom: 0;
}

.catalog-position-editor .service-line-row label,
.catalog-position-editor .service-line-row output {
    min-width: 0;
    padding: 5px 4px;
}

.catalog-position-editor .service-line-row input,
.catalog-position-editor .service-line-row select {
    width: 100%;
    min-height: 30px;
    padding: 0 7px;
}

.catalog-position-editor .service-line-row output {
    overflow: hidden;
    color: #263442;
    font-size: 11px;
    font-weight: 700;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-position-editor .service-row-remove {
    width: 28px;
    height: 28px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #788693;
}

.catalog-position-editor .service-row-remove:hover:not(:disabled),
.catalog-position-editor .service-row-remove:focus-visible:not(:disabled) {
    background: #fff0f0;
    color: #b52b2b;
}

.catalog-position-editor .service-row-remove .material-symbols-outlined {
    font-size: 17px;
}

.catalog-position-editor .service-line-empty {
    min-height: 92px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    color: #71808e;
    text-align: center;
}

.catalog-position-editor .service-line-empty .material-symbols-outlined {
    font-size: 22px;
}

.catalog-position-editor .service-line-empty strong {
    color: #44525f;
    font-size: 11px;
}

.catalog-position-editor .service-line-empty small {
    font-size: 9px;
}

.catalog-position-editor .service-net-summary {
    min-width: 0;
    display: block;
}

.catalog-position-editor .service-net-table {
    width: 100%;
    min-width: 0;
    display: block;
    overflow-x: auto;
    border: 1px solid #d5dce3;
    border-radius: 3px;
}

.catalog-position-editor .service-net-row {
    width: 100%;
    min-width: 850px;
    padding: 0;
    display: grid;
    grid-template-columns: 160px repeat(5, minmax(120px, 1fr));
    align-items: center;
    box-sizing: border-box;
    border-bottom: 1px solid #e2e7ec;
}

.catalog-position-editor .service-net-row:last-child {
    border-bottom: 0;
}

.catalog-position-editor .service-net-row > * {
    min-width: 0;
    padding: 6px 8px;
}

.catalog-position-editor .service-net-row-head {
    min-height: 30px;
    background: #edf1f4;
}

.catalog-position-editor .service-net-row-head strong {
    color: #52616f;
    font-size: 9px;
    text-transform: uppercase;
}

.catalog-position-editor .service-net-row input {
    width: 100%;
    min-height: 30px;
}

.catalog-position-editor .service-net-row output {
    color: #263442;
    font-size: 11px;
    font-weight: 700;
    text-align: right;
}

.catalog-position-editor .service-net-row-total {
    background: #f4f7f9;
}

.catalog-position-editor .service-total-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.catalog-position-editor .service-total-grid label {
    min-height: 64px;
    padding: 10px 12px;
    display: grid;
    align-content: center;
    gap: 4px;
    border: 1px solid #d5dce3;
    border-radius: 3px;
    background: #f7f9fa;
}

.catalog-position-editor .service-total-grid output {
    color: #263442;
    font-size: 15px;
    font-weight: 800;
}

.catalog-position-editor .service-total-input {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 5px;
}

.catalog-position-editor .article-history {
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
    list-style: none;
}

.catalog-position-editor .article-history li {
    padding: 11px 12px;
    border: 1px solid #dbe1e7;
    border-left: 3px solid #8ca7bd;
    border-radius: 3px;
    background: #f8fafb;
}

.catalog-position-editor .article-history-entry-head {
    margin-bottom: 8px;
}

.catalog-position-editor .article-history-change-grid {
    border-color: #d5dce3;
    border-radius: 2px;
    background: #fff;
}

.catalog-position-editor .modal-actions {
    min-height: 58px;
    padding: 0 16px;
    justify-content: space-between;
    border-top-color: #cbd3db;
    background: #fff;
}

.catalog-position-editor .modal-actions > div:last-child {
    display: flex;
    align-items: center;
    gap: 8px;
}

.catalog-position-editor .position-editor-save-state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #657482;
    font-size: 10px;
    font-weight: 700;
}

.catalog-position-editor .position-editor-save-state .material-symbols-outlined {
    color: #2d8652;
    font-size: 17px;
}

.catalog-position-editor .position-editor-save-state[data-position-editor-save-state="dirty"] .material-symbols-outlined {
    color: #a36b00;
}

.catalog-position-editor .modal-actions button {
    min-height: 32px;
    border-radius: 3px;
}

.catalog-position-editor .modal-actions button.primary {
    gap: 6px;
}

.catalog-position-editor .modal-actions button.primary .material-symbols-outlined {
    font-size: 17px;
}

.catalog-position-editor .position-editor-discard-layer {
    position: absolute;
    inset: 0;
    z-index: 8;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(31, 41, 51, .48);
}

.catalog-position-editor .position-editor-discard-layer section {
    width: min(430px, 100%);
    padding: 20px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    border: 1px solid #c6ced6;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(20, 30, 40, .28);
}

.catalog-position-editor .position-editor-discard-layer section > .material-symbols-outlined {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 3px;
    background: #fff3d9;
    color: #9c6500;
    font-size: 21px;
}

.catalog-position-editor .position-editor-discard-layer strong {
    color: #263442;
    font-size: 14px;
}

.catalog-position-editor .position-editor-discard-layer p {
    margin: 4px 0 0;
    color: #61717f;
    font-size: 11px;
    line-height: 16px;
}

.catalog-position-editor .position-editor-discard-layer footer {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.catalog-position-editor .position-editor-discard-layer button {
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid #b9c3cc;
    border-radius: 3px;
    background: #fff;
    color: #263442;
    font-size: 11px;
    font-weight: 700;
}

.catalog-position-editor .position-editor-discard-layer button.danger {
    border-color: #ae2c2c;
    background: #ae2c2c;
    color: #fff;
}

.catalog-position-editor.quote-position-editor .position-editor-info.active {
    grid-template-columns: 220px minmax(500px, 1.2fr) minmax(360px, .9fr);
    gap: 14px;
}

.quote-position-editor .position-editor-core-grid {
    grid-template-columns: minmax(150px, .75fr) minmax(180px, 1fr) minmax(120px, .55fr);
}

.quote-position-editor .position-editor-core-grid > label:first-child {
    grid-column: span 1;
}

.quote-position-editor .quote-position-currency-field {
    grid-column: 3;
}

.quote-position-editor .quote-position-option-grid {
    gap: 8px 18px;
    padding-top: 10px;
    border-top-color: #e2e7ec;
}

.quote-position-editor .quote-position-option-grid label {
    min-height: 20px;
    color: #52616f;
    font-size: 10px;
    font-weight: 700;
}

.quote-position-editor .quote-position-option-grid input {
    width: 14px;
    height: 14px;
    min-height: 14px;
}

.quote-position-editor .modal-body input[readonly],
.quote-position-editor .modal-body select:disabled {
    background: #f3f5f7;
    color: #667482;
}

.quote-position-editor .quote-position-calculation-grid {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
}

.quote-position-editor .quote-position-summary-kpis {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.quote-position-editor .quote-position-saved-snapshot {
    display: grid;
}

.quote-position-editor .position-editor-status.is-archived {
    border-color: #d8b6b6;
    background: #fff1f1;
    color: #8f2e2e;
}

.quote-position-editor .position-editor-status.is-archived i {
    background: #b54141;
}

@media (max-width: 1180px) {
    .master-catalog-item-modal.catalog-position-editor {
        width: calc(100vw - 24px);
        height: calc(100vh - 24px);
        max-height: calc(100vh - 24px);
    }

    .catalog-position-editor .position-editor-info.active {
        grid-template-columns: 200px minmax(0, 1fr);
    }

    .catalog-position-editor .position-editor-description {
        grid-column: 1 / -1;
    }

    .catalog-position-editor .position-editor-description .service-editor-area {
        min-height: 210px;
    }

    .catalog-position-editor.quote-position-editor .position-editor-info.active {
        grid-template-columns: 200px minmax(0, 1fr);
    }

    .quote-position-editor .quote-position-summary-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Professional Plantafel: operative focus, hour capacity and synchronized Gantt lanes. */
[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 16px;
    margin-bottom: 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-title {
    flex-basis: 240px;
    min-width: 240px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
    width: 100%;
    max-width: none;
    gap: 6px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar button,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar select,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar input {
    min-height: 30px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-chips {
    margin-bottom: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board {
    order: 3;
    gap: 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card {
    order: 2;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
    grid-template-columns: 420px minmax(0, 1fr);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-head,
[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row {
    grid-template-columns: minmax(0, 1fr) 82px 150px 34px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row {
    height: 40px;
    min-height: 40px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr);
    grid-template-rows: 14px 12px;
    align-content: center;
    column-gap: 6px;
    padding: 3px 7px !important;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity strong {
    grid-row: 1 / span 2;
    align-self: center;
    color: #344050;
    font-size: 10px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity > i {
    align-self: end;
    width: 100%;
    height: 4px;
    overflow: hidden;
    border-radius: 2px;
    background: #e3e7ec;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity > i > b {
    display: block;
    width: var(--capacity, 0%);
    height: 100%;
    background: #0d67d6;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity small {
    overflow: hidden;
    color: #727782;
    font-size: 8px;
    line-height: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity.is-near-capacity > i > b {
    background: #a86100;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity.is-overloaded > i > b,
[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity.is-conflict > i > b {
    background: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline {
    min-height: calc(var(--planning-row-count, 6) * 40px);
    grid-auto-rows: 40px;
    background:
        repeating-linear-gradient(to right, transparent 0, transparent calc(100% / var(--planning-day-units, 7) - 1px), #e8ebef calc(100% / var(--planning-day-units, 7) - 1px), #e8ebef calc(100% / var(--planning-day-units, 7))),
        repeating-linear-gradient(to bottom, transparent 0, transparent 39px, #e8ebef 39px, #e8ebef 40px);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day {
    z-index: 0;
    grid-column: var(--start);
    grid-row: var(--row);
    align-self: stretch;
    pointer-events: none;
    border-right: 1px solid rgba(193, 199, 210, 0.25);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-planned {
    background: rgba(13, 103, 214, 0.055);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-overloaded,
[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-absence_conflict {
    background: rgba(186, 26, 26, 0.13);
    box-shadow: inset 0 -3px 0 rgba(186, 26, 26, 0.62);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-absence {
    background: rgba(96, 112, 128, 0.11);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-weekend,
[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-unavailable {
    background: rgba(96, 112, 128, 0.045);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline .erp-bar {
    z-index: 3;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline .erp-bar.absence {
    z-index: 4;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-today-line {
    z-index: 2;
    grid-column: var(--start);
    grid-row: 1 / span var(--rows);
    justify-self: start;
    align-self: stretch;
    width: 2px;
    margin-left: var(--planning-today-offset, 0px);
    pointer-events: none;
    background: rgba(186, 26, 26, 0.72);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-legend {
    display: inline-block;
    width: 14px;
    height: 8px;
    border-radius: 2px;
    background: rgba(168, 97, 0, 0.18);
    box-shadow: inset 0 -2px 0 #a86100;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-legend.is-overloaded {
    background: rgba(186, 26, 26, 0.14);
    box-shadow: inset 0 -2px 0 #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-footer {
    border: 1px solid #e3e7ec;
    border-top: 0;
    border-radius: 0 0 4px 4px;
    background: #fff;
}

@media (max-width: 1300px) {
    [data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
        grid-template-columns: 1fr;
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
        justify-content: flex-start;
    }

}

@media (max-width: 1050px) {
    [data-view="planning-board"].plantafel-buildpro-view.active {
        min-width: 900px;
        padding: 16px;
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
        grid-template-columns: 340px minmax(0, 1fr);
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-resource-head,
    [data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row {
        grid-template-columns: minmax(0, 1fr) 68px 118px 30px;
    }
}

.supplier-export-modal {
    width: min(720px, calc(100vw - 32px));
    max-height: min(88vh, 620px);
}

.supplier-export-modal-body {
    display: grid;
    gap: 16px;
}

.supplier-export-relations {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    color: #263746;
    font-weight: 600;
}

.supplier-export-relations input {
    width: 18px;
    height: 18px;
    margin: 0;
}

.supplier-export-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.supplier-export-options button {
    display: grid;
    gap: 6px;
    min-height: 92px;
    padding: 14px;
    border: 1px solid #bdc9d4;
    border-radius: 2px;
    background: #fff;
    color: #23313e;
    text-align: left;
}

.supplier-export-options button:hover:not(:disabled),
.supplier-export-options button:focus-visible:not(:disabled) {
    border-color: #0067a3;
    background: #f3f8fb;
}

.supplier-export-options button strong {
    color: #005b91;
    font-size: 16px;
}

.supplier-export-options button span,
.supplier-export-privacy {
    color: #667687;
    font-size: 13px;
    line-height: 1.4;
}

.supplier-export-privacy {
    margin: 0;
    padding-top: 10px;
    border-top: 1px solid #d8e0e7;
}

.accounting-export-modal {
    width: min(780px, calc(100vw - 32px));
}

.accounting-export-filter-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.accounting-export-filter-grid label {
    display: grid;
    gap: 5px;
    color: #344453;
    font-size: 13px;
    font-weight: 600;
}

.accounting-export-filter-grid input,
.accounting-export-filter-grid select {
    width: 100%;
    min-height: 38px;
    padding: 7px 10px;
    border: 1px solid #bdc9d4;
    border-radius: 2px;
    background: #fff;
    color: #1f2d39;
    font: inherit;
}

.accounting-export-filter-grid input:focus,
.accounting-export-filter-grid select:focus {
    border-color: #0067a3;
    outline: 2px solid rgb(0 103 163 / 14%);
    outline-offset: 0;
}

@media (max-width: 720px) {
    .supplier-export-options {
        grid-template-columns: 1fr;
    }

    .accounting-export-filter-grid {
        grid-template-columns: 1fr;
    }
}

/* Employee-led resource board: master data, availability and dated absences. */
[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row.person {
    width: 100%;
    padding: 0 8px;
    border: 0;
    border-bottom: 1px solid #e3e6ea;
    border-radius: 0;
    background: #fff;
    color: #252a31;
    font: inherit;
    text-align: left;
}

[data-view="planning-board"].plantafel-buildpro-view button.erp-left-row.person {
    cursor: pointer;
}

[data-view="planning-board"].plantafel-buildpro-view button.erp-left-row.person:hover,
[data-view="planning-board"].plantafel-buildpro-view button.erp-left-row.person:focus-visible {
    background: #f2f6fa;
    box-shadow: inset 3px 0 0 #0067a8;
    outline: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.person.is-unplanned {
    background: #fafbfc;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.person.is-inactive {
    color: #777d86;
    background: #f3f4f5;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-person {
    display: flex !important;
    min-width: 0;
    align-items: center;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-person > span {
    display: grid;
    min-width: 0;
    gap: 1px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-person strong,
[data-view="planning-board"].plantafel-buildpro-view .planning-resource-person small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-person strong {
    font-size: 12px;
    line-height: 15px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-person small {
    color: #6d7480;
    font-size: 9px;
    line-height: 11px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-resource-capacity.is-unavailable i b {
    background: #8a9098;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-vacation {
    background: rgba(47, 105, 159, 0.12);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-sick {
    background: rgba(176, 68, 68, 0.12);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-training {
    background: rgba(166, 109, 20, 0.13);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-absence_other,
[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-inactive,
[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-not_employed {
    background: rgba(96, 112, 128, 0.1);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-employment_conflict,
[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day.is-inactive_conflict {
    background: rgba(186, 26, 26, 0.13);
    box-shadow: inset 0 -3px 0 rgba(186, 26, 26, 0.62);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline .erp-bar.absence.is-vacation {
    border-color: #2f699f;
    background: #dce9f5;
    color: #244f76;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline .erp-bar.absence.is-sick {
    border-color: #b04444;
    background: #f5dddd;
    color: #7d2929;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline .erp-bar.absence.is-training {
    border-color: #a66d14;
    background: #f5ead3;
    color: #70480e;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline .erp-bar.absence.is-other {
    border-color: #858b94;
    background: #e8eaed;
    color: #555b64;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.vacation {
    background: #2f699f;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.sick {
    background: #b04444;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.training {
    background: #a66d14;
}

/* Professional Gantt interaction and timeline layers. */
[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-head::after {
    display: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-controls {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-controls button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    cursor: pointer;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-controls button:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-controls button:focus-visible {
    border-color: #004277;
    color: #004277;
    outline: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-controls .material-symbols-outlined {
    font-size: 17px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-gantt {
    cursor: grab;
    scrollbar-color: #9aa4b0 #f4f3f2;
    scrollbar-width: thin;
    touch-action: pan-y;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-gantt.is-panning,
[data-view="planning-board"].plantafel-buildpro-view.is-gantt-panning .erp-gantt {
    cursor: grabbing;
    user-select: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-timeline {
    isolation: isolate;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-day-band {
    z-index: 0;
    grid-column: var(--start);
    grid-row: 1 / span var(--rows);
    align-self: stretch;
    pointer-events: none;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-day-band.is-weekend {
    background: rgba(96, 112, 128, 0.065);
    box-shadow: inset 1px 0 rgba(193, 199, 210, 0.28);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-timeline .erp-bar {
    z-index: 3;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card.is-drag-mode .erp-bar[data-planning-drag-item] {
    touch-action: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.is-saving,
[data-view="planning-board"].plantafel-buildpro-view.is-gantt-saving .erp-bar.is-dragging {
    cursor: progress;
    opacity: 0.72;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-today-line {
    position: relative;
    z-index: 8;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-today-line small {
    position: absolute;
    top: 2px;
    left: 4px;
    display: inline-flex;
    min-height: 16px;
    align-items: center;
    border-radius: 2px;
    background: #ba1a1a;
    padding: 0 5px;
    color: #fff;
    font-size: 8px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-dependency-layer {
    position: absolute;
    inset: 0 auto auto 0;
    z-index: 5;
    overflow: visible;
    pointer-events: none;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-dependency-path {
    fill: none;
    stroke: #607080;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-dependency-path.has-lag {
    stroke-dasharray: 4 3;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-dependency-path.conflict {
    stroke: #ba1a1a;
    stroke-width: 2;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency {
    position: absolute;
    z-index: 7;
    display: none;
    width: 28px;
    min-width: 28px;
    height: 18px;
    margin: 0;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0;
    color: #414750;
    cursor: pointer;
    transform: translate(-50%, -50%);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency.is-routed {
    display: inline-flex;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency::after {
    display: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency span {
    min-width: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
    font-size: 8px;
    line-height: 1;
    transform: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency.has-lag {
    border-style: dashed;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency.conflict {
    border-color: #ba1a1a;
    color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-dependency:focus-visible {
    border-color: #004277;
    color: #004277;
    outline: 2px solid rgba(0, 66, 119, 0.16);
    outline-offset: 1px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-gantt-live-status {
    position: fixed;
    z-index: 880;
    max-width: min(440px, calc(100vw - 48px));
    border: 1px solid #004277;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(31, 42, 55, 0.16);
    padding: 8px 12px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.35;
    pointer-events: none;
}

@media (max-width: 900px) {
    .catalog-position-editor .position-editor-info.active,
    .catalog-position-editor .position-editor-info.is-article.active {
        grid-template-columns: 1fr;
    }

    .catalog-position-editor .position-editor-summary,
    .catalog-position-editor .position-editor-main,
    .catalog-position-editor .position-editor-description,
    .catalog-position-editor .position-editor-info.is-article > .article-form-section,
    .catalog-position-editor .position-editor-info.is-article > [data-master-catalog-item-history] {
        grid-column: 1;
    }

    .catalog-position-editor .position-editor-kpis,
    .catalog-position-editor .article-calculation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .catalog-position-editor .position-editor-save-state {
        display: none;
    }
}

.status-current {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f8f8f8;
}

.status-current span,
.status-current small {
    color: #605e5c;
    font-size: 11px;
    line-height: 14px;
}

.status-current strong {
    color: #1a1c1c;
    font-size: 15px;
    font-weight: 800;
    line-height: 18px;
}

.project-document-create-modal .document-create-body {
    max-height: min(70vh, 620px);
    gap: 12px;
}

.project-document-create-modal .modal-helper-text {
    margin: 0;
    color: #64717f;
    font-size: 13px;
    line-height: 18px;
}

.project-document-create-modal .document-number-preview {
    padding: 10px 12px;
    display: grid;
    grid-template-columns: minmax(110px, .75fr) minmax(150px, 1fr);
    align-items: center;
    gap: 4px 12px;
    border: 1px solid #dbe7ff;
    border-radius: 7px;
    background: #f5f8ff;
}

.project-document-create-modal .document-number-preview span,
.project-document-create-modal .document-number-preview small {
    color: #617082;
    font-size: 12px;
    line-height: 15px;
}

.project-document-create-modal .document-number-preview strong {
    color: #214eaa;
    font-size: 15px;
    font-weight: 800;
    line-height: 18px;
}

.project-document-create-modal .document-number-preview small {
    grid-column: 1 / -1;
}

.project-document-create-modal .document-context-preview {
    padding: 10px 12px;
    display: grid;
    gap: 2px;
    border: 1px solid #e1e8f2;
    border-radius: 7px;
    background: #fbfcfe;
}

.project-document-create-modal .document-context-preview strong {
    color: #24313e;
    font-size: 14px;
    font-weight: 750;
    line-height: 17px;
}

.project-document-create-modal .document-context-preview span {
    color: #667381;
    font-size: 12px;
    line-height: 15px;
}

.global-project-context-modal.project-document-create-modal {
    width: min(640px, calc(100vw - 32px));
}

.global-project-context-modal .document-project-body {
    max-height: min(70vh, 620px);
    overflow: auto;
}

.global-project-context-modal .modal-helper-text {
    margin: 0 0 12px;
    color: #64717f;
    font-size: 14px;
    line-height: 1.45;
}

.document-project-search {
    margin-bottom: 12px;
    display: grid;
    gap: 6px;
    color: #546171;
    font-size: 13px;
    font-weight: 700;
}

.document-project-search input {
    width: 100%;
    min-height: 40px;
    padding: 8px 11px;
    border: 1px solid #d8e0ea;
    border-radius: 6px;
    background: #fff;
    color: #202a35;
    font: inherit;
}

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

.document-project-option {
    position: relative;
    min-height: 62px;
    padding: 10px 12px 10px 42px;
    display: grid;
    align-items: center;
    border: 1px solid #e1e6ed;
    border-radius: 7px;
    background: #fff;
    cursor: pointer;
}

.document-project-option::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 50%;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    border: 1px solid #b8c3d0;
    border-radius: 50%;
    background: #fff;
}

.document-project-option:has(input:checked) {
    border-color: #9db8f5;
    background: #f2f6ff;
    box-shadow: inset 3px 0 0 var(--blue);
}

.document-project-option:has(input:checked)::before {
    border-color: var(--blue);
    box-shadow: inset 0 0 0 4px #fff;
    background: var(--blue);
}

.document-project-option:hover {
    background: #f6f9ff;
}

.document-project-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.document-project-option span {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.document-project-option strong,
.document-project-option small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-project-option strong {
    color: #223142;
    font-size: 14px;
    font-weight: 750;
}

.document-project-option small {
    color: #657180;
    font-size: 12px;
}

.document-project-empty {
    padding: 14px;
    border: 1px dashed #cfd8e3;
    border-radius: 7px;
    color: #667381;
    font-size: 13px;
    text-align: center;
}

.document-draft-picker {
    display: grid;
    gap: 6px;
}

.document-draft-picker > header,
.document-create-section-head {
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.document-draft-picker > header > div {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.document-draft-picker > header .material-symbols-outlined {
    color: #536272;
    font-size: 17px;
}

.document-draft-picker > header strong,
.document-create-section-head strong {
    color: #2c3947;
    font-size: 12px;
    font-weight: 800;
    line-height: 16px;
}

.document-draft-picker > header > span,
.document-create-section-head span {
    color: #687584;
    font-size: 11px;
    line-height: 15px;
}

.document-draft-picker-tabs {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 2px;
    border: 1px solid #d4dce6;
    border-radius: 4px;
    background: #f4f6f9;
}

.document-draft-picker-tabs button {
    min-height: 24px;
    padding: 3px 7px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid transparent;
    border-radius: 3px;
    background: transparent;
    color: #667585;
    font-size: 10px;
    font-weight: 750;
    line-height: 14px;
    cursor: pointer;
}

.document-draft-picker-tabs button:hover {
    color: #274b70;
}

.document-draft-picker-tabs button:focus-visible {
    outline: 2px solid #83a9e6;
    outline-offset: 1px;
}

.document-draft-picker-tabs button.active {
    border-color: #b9cce3;
    background: #fff;
    color: #155f9f;
    box-shadow: 0 1px 2px rgba(31, 58, 85, 0.08);
}

.document-draft-picker-tabs button span {
    min-width: 16px;
    padding: 0 4px;
    border-radius: 3px;
    background: #e2e8ef;
    color: #526170;
    font-size: 9px;
    line-height: 14px;
    text-align: center;
}

.document-draft-picker-tabs button.active span {
    background: #e4eef9;
    color: #155f9f;
}

.document-draft-list {
    max-height: 142px;
    overflow-y: auto;
    border: 1px solid #d8dfe8;
    border-radius: 6px;
    background: #fff;
}

.document-draft-row {
    width: 100%;
    min-height: 58px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    border-bottom: 1px solid #e3e8ef;
    background: #fff;
}

.document-draft-row:last-child {
    border-bottom: 0;
}

.document-draft-row--single {
    grid-template-columns: minmax(0, 1fr);
}

.document-draft-row__open {
    min-width: 0;
    min-height: 58px;
    padding: 7px 8px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto 22px;
    align-items: center;
    gap: 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #263442;
    text-align: left;
    cursor: pointer;
}

.document-draft-row__open:not(:disabled):hover {
    background: #f3f7fd;
}

.document-draft-row__open:not(:disabled):focus-visible,
.document-draft-row__archive:not(:disabled):focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid #83a9e6;
    outline-offset: -2px;
}

.document-draft-row__open:disabled,
.document-draft-row__archive:disabled {
    cursor: not-allowed;
    background: #f7f8fa;
}

.document-draft-row__archive {
    width: 36px;
    min-height: 58px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    border-left: 1px solid #e3e8ef;
    border-radius: 0;
    background: #fff;
    color: #667585;
    cursor: pointer;
}

.document-draft-row__archive:not(:disabled):hover {
    background: #fff2f0;
    color: #a33228;
}

.document-draft-row__archive .material-symbols-outlined {
    font-size: 18px;
}

.document-draft-row__icon,
.document-draft-row__action {
    color: #506477;
    font-size: 19px;
}

.document-draft-row__action {
    justify-self: end;
    color: #1f63a7;
    font-size: 18px;
}

.document-draft-row__copy,
.document-draft-row__meta {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.document-draft-row__copy strong,
.document-draft-row__copy small,
.document-draft-row__meta small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-draft-row__copy strong {
    font-size: 13px;
    font-weight: 800;
    line-height: 16px;
}

.document-draft-row__copy small,
.document-draft-row__meta small {
    color: #697787;
    font-size: 10px;
    line-height: 13px;
}

.document-draft-row__copy small.blocked {
    color: #a23a2e;
}

.document-draft-row__meta {
    justify-items: end;
}

.document-draft-row__meta mark {
    padding: 1px 6px;
    border-radius: 999px;
    background: #e7edf5;
    color: #4b5f73;
    font-size: 9px;
    font-weight: 800;
    line-height: 14px;
    text-transform: uppercase;
}

.document-archive-list {
    max-height: 174px;
    overflow-y: auto;
    border: 1px solid #d8dfe8;
    border-radius: 6px;
    background: #fff;
}

.document-archive-row {
    min-width: 0;
    min-height: 82px;
    padding: 8px 9px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: start;
    gap: 3px 8px;
    border-bottom: 1px solid #e3e8ef;
    background: #fbfcfd;
    color: #324150;
}

.document-archive-row:last-child {
    border-bottom: 0;
}

.document-archive-row__icon {
    grid-row: 1 / span 4;
    align-self: center;
    color: #6a7785;
    font-size: 19px;
}

.document-archive-row__copy,
.document-archive-row__meta {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.document-archive-row__copy strong,
.document-archive-row__copy small,
.document-archive-row__meta small,
.document-archive-row__reason,
.document-archive-row__actor,
.document-archive-row__warning {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-archive-row__copy strong {
    font-size: 12px;
    font-weight: 800;
    line-height: 15px;
}

.document-archive-row__copy small,
.document-archive-row__meta small,
.document-archive-row__actor {
    color: #71808f;
    font-size: 9px;
    line-height: 12px;
}

.document-archive-row__meta {
    justify-items: end;
}

.document-archive-row__meta mark {
    padding: 1px 5px;
    border-radius: 3px;
    background: #e4e8ed;
    color: #576574;
    font-size: 8px;
    font-weight: 800;
    line-height: 13px;
    text-transform: uppercase;
}

.document-archive-row__reason,
.document-archive-row__actor,
.document-archive-row__warning {
    grid-column: 2 / -1;
}

.document-archive-row__reason {
    color: #4e5d6c;
    font-size: 10px;
    line-height: 13px;
}

.document-archive-row__warning {
    color: #9b473c;
    font-size: 9px;
    line-height: 12px;
}

.document-archive-pager {
    min-height: 28px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

.document-archive-pager button {
    width: 28px;
    height: 28px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1px solid #cbd4df;
    border-radius: 3px;
    background: #fff;
    color: #40566b;
    cursor: pointer;
}

.document-archive-pager button:disabled {
    color: #a6b0ba;
    background: #f5f6f8;
    cursor: not-allowed;
}

.document-archive-pager button:not(:disabled):hover {
    border-color: #8eafd2;
    background: #eef5fc;
}

.document-archive-pager button:focus-visible {
    outline: 2px solid #83a9e6;
    outline-offset: 1px;
}

.document-archive-pager button .material-symbols-outlined {
    font-size: 17px;
}

.document-archive-pager > span {
    color: #667585;
    font-size: 10px;
    line-height: 14px;
}

.document-draft-picker-state,
.document-draft-picker-warnings,
.document-draft-picker-success {
    min-height: 38px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    gap: 7px;
    border: 1px dashed #d2dae5;
    border-radius: 6px;
    background: #fafbfd;
    color: #667585;
    font-size: 11px;
    line-height: 15px;
}

.document-draft-picker-state .material-symbols-outlined {
    flex: 0 0 auto;
    color: #617487;
    font-size: 17px;
}

.document-draft-picker-state.error,
.document-draft-picker-warnings {
    border-color: #e5c0ba;
    background: #fff7f5;
    color: #913c31;
}

.document-draft-picker-warnings {
    display: grid;
    gap: 2px;
}

.document-draft-picker-success {
    border-style: solid;
    border-color: #b9dec4;
    background: #f1faf4;
    color: #2f6a40;
}

.document-draft-picker-success .material-symbols-outlined {
    color: #2f7d46;
    font-size: 17px;
}

.document-create-section-head {
    margin-top: 2px;
    padding-top: 8px;
    border-top: 1px solid #e2e7ee;
}

.document-draft-archive-backdrop {
    z-index: 100;
}

.project-document-create-modal.document-draft-archive-modal {
    width: min(460px, calc(100vw - 32px));
    z-index: 110;
}

.document-draft-archive-body {
    gap: 12px;
}

.document-draft-archive-context {
    min-width: 0;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #d9e0e8;
    border-radius: 6px;
    background: #f8fafc;
}

.document-draft-archive-context > .material-symbols-outlined {
    color: #556879;
    font-size: 22px;
}

.document-draft-archive-context div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.document-draft-archive-context strong,
.document-draft-archive-context small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-draft-archive-context strong {
    color: #263442;
    font-size: 13px;
    line-height: 16px;
}

.document-draft-archive-context small {
    color: #667585;
    font-size: 11px;
    line-height: 14px;
}

.document-draft-archive-reason {
    display: grid;
    gap: 5px;
    color: #344353;
    font-size: 12px;
    font-weight: 700;
}

.document-draft-archive-reason textarea {
    width: 100%;
    min-height: 76px;
    padding: 8px 10px;
    resize: vertical;
    border: 1px solid #bcc7d3;
    border-radius: 4px;
    background: #fff;
    color: #202d3a;
    font: inherit;
    font-weight: 400;
    line-height: 17px;
}

.document-draft-archive-reason textarea:focus {
    outline: 2px solid #8fb0e4;
    outline-offset: 1px;
}

.document-draft-archive-reason small {
    color: #6a7785;
    font-size: 10px;
    font-weight: 400;
    line-height: 13px;
}

.project-document-create-modal .modal-actions button.primary.danger {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #b42318;
    border-color: #b42318;
}

.project-document-create-modal .modal-actions button.primary.danger:hover:not(:disabled) {
    background: #941f17;
    border-color: #941f17;
}

.project-document-create-modal .modal-actions button.primary.danger .material-symbols-outlined {
    font-size: 17px;
}

.document-create-context {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.document-create-context article {
    min-width: 0;
    padding: 10px 12px;
    display: grid;
    gap: 3px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f8f8f8;
}

.document-create-context span,
.document-create-context small {
    overflow: hidden;
    color: #605e5c;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-create-context strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 13px;
    font-weight: 800;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-create-template-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.document-create-template-option {
    position: relative;
    min-height: 52px;
    padding: 9px 12px 9px 42px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 8px;
    align-items: center;
    text-align: left;
    border: 1px solid #e1e6ed;
    border-radius: 6px;
    background: #fff;
    color: #24313e;
    cursor: pointer;
}

.document-create-template-option::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 50%;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    border: 1px solid #b8c3d0;
    border-radius: 5px;
    background: #fff;
}

.document-create-template-option:not(:disabled):hover {
    background: #f4f8ff;
}

.document-create-template-option:not(:disabled):focus-visible {
    outline: 2px solid #9db8f5;
    outline-offset: 2px;
}

.document-create-template-option:disabled {
    cursor: not-allowed;
    opacity: 1;
    background: #f8f9fb;
    color: #657180;
}

.document-create-template-option .material-symbols-outlined {
    display: none;
}

.document-create-template-option strong {
    grid-column: 1 / -1;
    min-width: 0;
    overflow: hidden;
    color: #24313e;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-create-template-option small {
    grid-column: 1;
    justify-self: start;
    min-width: 34px;
    max-width: 100%;
    padding: 3px 7px;
    border-radius: 999px;
    background: #eef2f7;
    color: #657180;
    font-size: 11px;
    font-weight: 800;
    line-height: 13px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-create-template-option mark {
    grid-column: 2;
    min-height: 18px;
    padding: 1px 6px;
    justify-self: end;
    border-radius: 999px;
    background: #e9e8e7;
    color: #605e5c;
    font-size: 10px;
    font-weight: 800;
    line-height: 16px;
    text-transform: uppercase;
}

.document-plus-type-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.document-plus-type-list label {
    position: relative;
    min-height: 52px;
    padding: 9px 12px 9px 42px;
    display: grid;
    align-items: center;
    border: 1px solid #e1e6ed;
    border-radius: 6px;
    background: #fff;
    color: #24313e;
    font-size: 14px;
    line-height: 1.35;
    cursor: pointer;
}

.document-plus-type-list label::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 50%;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    border: 1px solid #b8c3d0;
    border-radius: 5px;
    background: #fff;
}

.document-plus-type-list label:has(input:checked)::before {
    border-color: var(--blue-strong);
    background: var(--blue-strong);
}

.document-plus-type-list label:has(input:checked)::after {
    content: "";
    position: absolute;
    left: 18px;
    top: 50%;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: translateY(-58%) rotate(45deg);
}

.document-plus-type-list label:not(.is-disabled):hover {
    background: #f4f8ff;
}

.document-plus-type-list input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}

.document-plus-type-list label:has(input:checked) {
    border-color: #9db8f5;
    background: #f2f6ff;
    box-shadow: inset 3px 0 0 var(--blue-strong);
}

.document-plus-type-list label.is-disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.document-plus-type-list span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.document-plus-type-list strong {
    font-size: 14px;
    font-weight: 700;
}

.document-plus-type-list small {
    min-width: 34px;
    padding: 3px 7px;
    border-radius: 999px;
    background: #eef2f7;
    color: #657180;
    font-size: 11px;
    font-weight: 800;
    text-align: center;
}

.document-template-instance-result {
    padding: 10px 12px;
    display: grid;
    gap: 3px;
    border: 1px solid #94c998;
    border-radius: 2px;
    background: #f1faf1;
}

.document-template-instance-result span,
.document-template-instance-result small {
    color: #386a20;
    font-size: 11px;
    line-height: 14px;
}

.document-template-instance-result strong {
    color: #1b4d13;
    font-size: 14px;
    font-weight: 800;
    line-height: 17px;
}

.document-template-instance-runtime {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.document-template-instance-runtime div {
    min-width: 0;
    padding: 8px 10px;
    display: grid;
    gap: 2px;
    border: 1px solid #d0d7de;
    border-left: 3px solid #005a9e;
    background: #f8f9fb;
}

.document-template-instance-runtime span,
.document-template-instance-runtime small,
.document-template-instance-runtime-warnings span {
    color: #5d6673;
    font-size: 10px;
    line-height: 1.3;
}

.document-template-instance-runtime strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-instance-runtime-warnings {
    display: grid;
    gap: 4px;
    padding: 6px 8px;
    border-left: 3px solid #f2c94c;
    background: #fff8e1;
}

.document-template-instance-runtime-warnings span {
    color: #7a5100;
}

.document-template-instance-editor {
    padding: 10px 12px;
    display: grid;
    gap: 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.document-template-instance-editor-head {
    min-height: 30px;
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    border-bottom: 1px solid #e0e0e0;
    color: #605e5c;
    font-size: 11px;
}

.document-template-instance-editor-head strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-instance-editor-head small {
    color: #727782;
    font-size: 10px;
}

.document-template-instance-editor-section {
    display: grid;
    gap: 6px;
}

.document-template-instance-editor-section header {
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #414750;
    font-size: 11px;
}

.document-template-instance-editor-section header strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
}

.document-template-instance-editor-section header span {
    color: #727782;
    font-size: 10px;
}

.document-template-instance-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.document-template-instance-field {
    min-height: 58px;
    padding: 7px 8px;
    display: grid;
    gap: 5px;
    align-content: start;
    border: 1px solid #d7dce4;
    border-radius: 2px;
    background: #fafafa;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.document-template-instance-field.wide {
    grid-column: 1 / -1;
}

.document-template-instance-field.readonly {
    background: #f4f3f2;
}

.document-template-instance-field span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.document-template-instance-field span em {
    min-height: 16px;
    padding: 0 5px;
    border-radius: 2px;
    background: #fdecc8;
    color: #6f4e00;
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
    line-height: 16px;
}

.document-template-instance-field strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-instance-field input,
.document-template-instance-field textarea {
    width: 100%;
    min-height: 28px;
    padding: 5px 7px;
    box-sizing: border-box;
    resize: vertical;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font: inherit;
    font-size: 11px;
    font-weight: 600;
}

.document-template-instance-field textarea {
    min-height: 62px;
}

.document-template-instance-field small {
    color: #727782;
    font-size: 10px;
    font-weight: 600;
    line-height: 13px;
}

.document-template-instance-editor-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.document-template-instance-editor-actions button {
    min-height: 28px;
    padding: 0 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-result {
    padding: 8px 10px;
    grid-template-columns: minmax(130px, .5fr) minmax(0, 1fr);
    align-items: center;
    gap: 2px 10px;
    border-color: #a8d5aa;
    border-radius: 7px;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-result small {
    grid-column: 1 / -1;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-editor {
    padding: 0;
    gap: 0;
    overflow: hidden;
    border-color: #d8dee8;
    border-radius: 7px;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-editor-head {
    min-height: 36px;
    padding: 0 10px;
    grid-template-columns: 70px minmax(0, 1fr) auto;
    background: #f6f8fb;
    border-bottom: 1px solid #dfe6ef;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-editor-section {
    gap: 0;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-editor-section header {
    min-height: 32px;
    padding: 0 10px;
    border-top: 1px solid #edf1f6;
    border-bottom: 1px solid #edf1f6;
    background: #fafbfc;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-field-grid {
    gap: 0;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-field {
    min-height: 50px;
    padding: 7px 9px;
    border-width: 0 1px 1px 0;
    border-radius: 0;
    background: #fff;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-field.readonly {
    background: #f8f9fb;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-field textarea {
    min-height: 54px;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-editor-actions {
    padding: 8px 10px;
    gap: 6px;
    border-top: 1px solid #e4eaf2;
    background: #f8fafc;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-editor-actions button {
    min-height: 30px;
}

.document-instance-photo-gallery {
    display: grid;
    min-width: 0;
    border-top: 1px solid #dfe6ef;
    background: #fff;
}

.document-instance-photo-gallery__head,
.document-instance-photo-gallery__subhead,
.document-instance-photo-gallery__toolbar,
.document-instance-photo-gallery__paging,
.document-instance-photo-gallery__save-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.document-instance-photo-gallery__head {
    min-height: 36px;
    padding: 0 10px;
    border-bottom: 1px solid #dfe6ef;
    background: #f6f8fb;
}

.document-instance-photo-gallery__head > div {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

.document-instance-photo-gallery__head .material-symbols-outlined {
    color: #005a9e;
    font-size: 18px;
}

.document-instance-photo-gallery__head strong,
.document-instance-photo-gallery__subhead strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
}

.document-instance-photo-gallery__head > span,
.document-instance-photo-gallery__subhead > span,
.document-instance-photo-gallery__paging > span,
.document-instance-photo-gallery__save-row > span {
    color: #727782;
    font-size: 10px;
    font-weight: 700;
}

.document-instance-photo-gallery__toolbar {
    justify-content: flex-start;
    min-height: 42px;
    padding: 6px 10px;
    border-bottom: 1px solid #edf1f6;
    background: #fafbfc;
}

.document-instance-photo-gallery__search {
    width: min(420px, 100%);
    min-height: 30px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    box-sizing: border-box;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.document-instance-photo-gallery__search .material-symbols-outlined {
    color: #727782;
    font-size: 17px;
}

.document-instance-photo-gallery__search input {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
}

.document-instance-photo-gallery__toolbar > button,
.document-instance-photo-gallery__paging button,
.document-instance-photo-gallery__item-actions button {
    min-height: 30px;
    padding: 0 10px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 11px;
    font-weight: 800;
}

.document-instance-photo-gallery__toolbar > button.icon-button,
.document-instance-photo-gallery__paging button.icon-button,
.document-instance-photo-gallery__item-actions button.icon-button {
    width: 30px;
    min-width: 30px;
    padding: 0;
}

.document-instance-photo-gallery__toolbar .material-symbols-outlined,
.document-instance-photo-gallery__paging .material-symbols-outlined,
.document-instance-photo-gallery__item-actions .material-symbols-outlined {
    font-size: 17px;
}

.document-instance-photo-gallery button:disabled {
    opacity: .48;
    cursor: not-allowed;
}

.document-instance-photo-gallery__workspace {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr);
    border-bottom: 1px solid #e4eaf2;
}

.document-instance-photo-gallery__candidates,
.document-instance-photo-gallery__selection {
    min-width: 0;
    padding: 10px;
    display: grid;
    align-content: start;
    gap: 8px;
}

.document-instance-photo-gallery__candidates {
    border-right: 1px solid #e4eaf2;
    background: #f8f9fb;
}

.document-instance-photo-gallery__subhead {
    min-height: 22px;
}

.document-instance-photo-gallery__candidate-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}

.document-instance-photo-gallery__candidate {
    min-width: 0;
    position: relative;
    display: grid;
    grid-template-rows: auto minmax(38px, auto);
    overflow: hidden;
    border: 1px solid #cfd6df;
    border-radius: 2px;
    background: #fff;
}

.document-instance-photo-gallery__candidate.selected {
    border-color: #7f9fc4;
    background: #f2f7fc;
}

.document-instance-photo-gallery__candidate img {
    width: 100%;
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: cover;
    border-bottom: 1px solid #e1e6ec;
    background: #eef1f4;
}

.document-instance-photo-gallery__candidate > div {
    min-width: 0;
    padding: 5px 34px 5px 6px;
    display: grid;
    align-content: center;
    gap: 2px;
}

.document-instance-photo-gallery__candidate strong,
.document-instance-photo-gallery__candidate small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-instance-photo-gallery__candidate strong {
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 800;
}

.document-instance-photo-gallery__candidate small {
    color: #727782;
    font-size: 9px;
}

.document-instance-photo-gallery__candidate > button {
    width: 26px;
    height: 26px;
    position: absolute;
    right: 5px;
    bottom: 6px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1px solid #8ba9ca;
    border-radius: 2px;
    background: #eaf2fb;
    color: #005a9e;
}

.document-instance-photo-gallery__candidate > button .material-symbols-outlined {
    font-size: 17px;
}

.document-instance-photo-gallery__paging {
    justify-content: center;
    min-height: 30px;
}

.document-instance-photo-gallery__selection-list {
    display: grid;
    gap: 5px;
}

.document-instance-photo-gallery__selection-item {
    min-width: 0;
    min-height: 70px;
    padding: 5px;
    display: grid;
    grid-template-columns: 24px 78px minmax(0, 1fr) 30px;
    align-items: center;
    gap: 7px;
    border: 1px solid #d7dce4;
    border-radius: 2px;
    background: #fff;
}

.document-instance-photo-gallery__selection-item.unavailable {
    border-color: #d9a6a6;
    background: #fff7f7;
}

.document-instance-photo-gallery__order {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    color: #414750;
    font-size: 10px;
    font-weight: 800;
}

.document-instance-photo-gallery__selection-item > img {
    width: 78px;
    height: 58px;
    display: block;
    object-fit: cover;
    border: 1px solid #d7dce4;
    border-radius: 2px;
    background: #eef1f4;
}

.document-instance-photo-gallery__selection-item > label {
    min-width: 0;
    display: grid;
    gap: 3px;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
}

.document-instance-photo-gallery__selection-item input {
    width: 100%;
    min-height: 28px;
    padding: 4px 7px;
    box-sizing: border-box;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.document-instance-photo-gallery__selection-item label small {
    color: #386a20;
    font-size: 9px;
}

.document-instance-photo-gallery__selection-item label small.blocked {
    color: #a4262c;
}

.document-instance-photo-gallery__item-actions {
    display: grid;
    gap: 4px;
}

.document-instance-photo-gallery__item-actions button.danger {
    color: #a4262c;
}

.document-instance-photo-gallery__save-row {
    min-height: 34px;
    justify-content: flex-end;
}

.document-instance-photo-gallery__save-row button {
    min-height: 30px;
    padding: 0 12px;
    border: 1px solid #005a9e;
    border-radius: 2px;
    background: #005a9e;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.document-instance-photo-gallery__state {
    min-height: 72px;
    padding: 12px;
    display: grid;
    place-items: center;
    box-sizing: border-box;
    border: 1px dashed #c1c7d2;
    border-radius: 2px;
    background: #fafbfc;
    color: #727782;
    font-size: 11px;
    text-align: center;
}

.document-instance-photo-gallery > .form-error {
    margin: 8px 10px 10px;
}

@media (max-width: 1180px) {
    .document-instance-photo-gallery__workspace {
        grid-template-columns: minmax(0, 1fr);
    }

    .document-instance-photo-gallery__candidates {
        border-right: 0;
        border-bottom: 1px solid #e4eaf2;
    }

    .document-instance-photo-gallery__candidate-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* GAEB document viewer: structured LV view inside the ERP main frame. */
.gaeb-viewer-backdrop {
    position: fixed;
    inset: var(--dummy-topbar-height) 0 0 64px;
    z-index: 184;
    background: rgba(21, 29, 38, 0.18);
}

.dummy-shell:not(.is-sidebar-collapsed) .gaeb-viewer-backdrop {
    left: 260px;
}

.project-gaeb-viewer {
    position: fixed;
    inset: var(--dummy-topbar-height) 0 0 64px;
    z-index: 185;
    display: grid;
    grid-template-rows: 48px minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    color: #202936;
    background: #f5f6f8;
}

.dummy-shell:not(.is-sidebar-collapsed) .project-gaeb-viewer {
    left: 260px;
}

.project-gaeb-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(260px, 520px) auto 36px 36px;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 5px 8px 5px 12px;
    border-bottom: 1px solid #cbd3dc;
    background: #fff;
}

.project-gaeb-title {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.project-gaeb-title > .material-symbols-outlined {
    color: #0063a6;
}

.project-gaeb-title > div {
    display: grid;
    min-width: 0;
}

.project-gaeb-title strong,
.project-gaeb-title span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-gaeb-title strong {
    font-size: 13px;
}

.project-gaeb-title span {
    color: #697586;
    font-size: 11px;
}

.project-gaeb-search {
    display: flex;
    align-items: center;
    gap: 7px;
    height: 34px;
    padding: 0 10px;
    border: 1px solid #bdc7d3;
    background: #fff;
}

.project-gaeb-search .material-symbols-outlined {
    color: #697586;
    font-size: 19px;
}

.project-gaeb-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
}

.project-gaeb-summary {
    display: flex;
    gap: 4px;
    white-space: nowrap;
}

.project-gaeb-summary span {
    padding: 3px 6px;
    border: 1px solid #d5dbe3;
    color: #526070;
    background: #f8f9fb;
    font-size: 11px;
}

.project-gaeb-summary .is-warning {
    color: #8a4f00;
    border-color: #eacb8c;
    background: #fff8e7;
}

.project-gaeb-summary .is-error {
    color: #a2231d;
    border-color: #efbbb7;
    background: #fff1f0;
}

.project-gaeb-toolbar .icon-button {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid transparent;
    color: #344054;
    background: transparent;
    text-decoration: none;
}

.project-gaeb-toolbar .icon-button:hover {
    border-color: #bdc7d3;
    background: #eef2f6;
}

.project-gaeb-workspace {
    display: grid;
    grid-template-columns: 264px minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
}

.project-gaeb-outline {
    min-width: 0;
    min-height: 0;
    overflow: auto;
    border-right: 1px solid #cbd3dc;
    background: #eef1f5;
}

.project-gaeb-outline-head > strong {
    display: block;
    padding: 13px 14px 8px;
    color: #5b6675;
    font-size: 11px;
    text-transform: uppercase;
}

.project-gaeb-outline-row {
    width: 100%;
    min-height: 42px;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 0;
    border-left: 3px solid transparent;
    color: #273444;
    background: transparent;
    text-align: left;
}

.project-gaeb-outline-row:hover,
.project-gaeb-outline-row.is-active {
    background: #fff;
}

.project-gaeb-outline-row.is-active {
    border-left-color: #0063a6;
}

.project-gaeb-outline-row .material-symbols-outlined {
    color: #738196;
    font-size: 18px;
}

.project-gaeb-outline-row > span:not(.material-symbols-outlined) {
    display: grid;
    min-width: 0;
}

.project-gaeb-outline-row strong,
.project-gaeb-outline-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-gaeb-outline-row small {
    color: #6d7887;
    font-size: 11px;
}

.project-gaeb-content {
    min-width: 0;
    min-height: 0;
    overflow: auto;
    background: #fff;
}

.project-gaeb-table {
    min-width: 860px;
}

.project-gaeb-table-head,
.project-gaeb-table-row {
    display: grid;
    grid-template-columns: 150px minmax(320px, 1fr) 110px 70px 110px;
    align-items: start;
}

.project-gaeb-table-head {
    position: sticky;
    top: 0;
    z-index: 2;
    border-bottom: 1px solid #aeb8c5;
    color: #536071;
    background: #f2f4f7;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.project-gaeb-table-head > span,
.project-gaeb-table-row > span,
.project-gaeb-table-row > strong {
    min-width: 0;
    padding: 9px 11px;
    border-right: 1px solid #e0e5eb;
}

.project-gaeb-table-row {
    width: 100%;
    min-height: 48px;
    padding: 0;
    border-bottom: 1px solid #dde3ea;
    border-top: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: #fff;
    color: inherit;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    text-align: left;
}

.project-gaeb-table-row:nth-of-type(odd) {
    background: #f9fafb;
}

.project-gaeb-table-row:hover {
    background: #eaf3fb;
}

.project-gaeb-table-row:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid #0063a6;
    outline-offset: -2px;
}

.project-gaeb-table-row.is-selected {
    box-shadow: inset 3px 0 0 #0063a6;
    background: #eaf3fb;
}

.project-gaeb-table-row.is-remark {
    box-shadow: inset 3px 0 0 #7a8796;
    color: #253344;
    background: #f1f4f7;
}

.project-gaeb-table-row.is-remark:hover,
.project-gaeb-table-row.is-remark.is-selected {
    background: #e7edf3;
}

.project-gaeb-remark-kind {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #4d5c6d;
}

.project-gaeb-remark-kind .material-symbols-outlined {
    font-size: 18px;
}

.project-gaeb-table-row > span:nth-child(2) {
    display: grid;
    gap: 3px;
}

.project-gaeb-table-row small {
    max-width: 90ch;
    overflow: hidden;
    color: #657184;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-gaeb-table-row .numeric {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.project-gaeb-longtext {
    padding: 13px 16px 15px 161px;
    border-bottom: 1px solid #b9c7d6;
    box-shadow: inset 3px 0 0 #0063a6;
    background: #f5f9fc;
}

.project-gaeb-longtext header {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 7px;
}

.project-gaeb-longtext header span {
    color: #0063a6;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-gaeb-longtext header strong {
    color: #344054;
    font-size: 12px;
}

.project-gaeb-longtext p {
    max-width: 110ch;
    margin: 0;
    color: #273444;
    font-size: 13px;
    line-height: 1.55;
    white-space: pre-wrap;
}

.project-gaeb-longtext p.is-empty {
    color: #697586;
    font-style: italic;
}

.project-gaeb-longtext.is-remark {
    box-shadow: inset 3px 0 0 #7a8796;
    background: #f7f9fb;
}

.project-gaeb-longtext.is-remark header span {
    color: #4d5c6d;
}

.project-gaeb-empty {
    min-height: 240px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 5px;
    color: #697586;
}

.project-gaeb-diagnostics {
    margin: 12px;
    border: 1px solid #cbd3dc;
    background: #fff;
}

.project-gaeb-diagnostics summary {
    padding: 9px 11px;
    cursor: pointer;
    font-weight: 700;
}

.project-gaeb-diagnostics > div {
    max-height: 220px;
    overflow: auto;
    border-top: 1px solid #dde3ea;
}

.project-gaeb-diagnostics p {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 10px;
    margin: 0;
    padding: 7px 11px;
    border-bottom: 1px solid #edf0f3;
    font-size: 12px;
}

.project-gaeb-diagnostics p.is-error {
    color: #a2231d;
}

.project-gaeb-diagnostics p.is-warning {
    color: #8a4f00;
}

@media (max-width: 1120px) {
    .project-gaeb-toolbar {
        grid-template-columns: minmax(180px, 1fr) minmax(220px, 1fr) 36px 36px;
    }

    .project-gaeb-summary {
        display: none;
    }

    .project-gaeb-workspace {
        grid-template-columns: 220px minmax(0, 1fr);
    }
}

.document-template-instance-message {
    color: #386a20;
    font-size: 11px;
    font-weight: 700;
}

.document-template-instance-readiness {
    padding: 8px 10px;
    display: grid;
    gap: 3px;
    border: 1px solid #c9d8ff;
    border-radius: 2px;
    background: #f8fbff;
}

.document-template-instance-readiness strong,
.document-template-instance-readiness span,
.document-template-instance-readiness small {
    color: #21426f;
    font-size: 11px;
    line-height: 14px;
}

.document-template-instance-readiness strong {
    font-size: 12px;
    font-weight: 800;
}

.document-template-instance-preview-fields {
    margin-top: 4px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
}

.document-template-instance-preview-fields span {
    min-height: 24px;
    padding: 4px 6px;
    display: grid;
    grid-template-columns: 42px minmax(0, .7fr) minmax(0, 1fr);
    gap: 5px;
    align-items: center;
    border: 1px solid #d7dce4;
    border-radius: 2px;
    background: #fff;
}

.document-template-instance-preview-fields em {
    color: #386a20;
    font-size: 9px;
    font-style: normal;
    font-weight: 900;
    text-transform: uppercase;
}

.document-template-instance-preview-fields strong,
.document-template-instance-preview-fields small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-instance-readiness .blocked {
    color: #93000a;
}

.document-template-instance-preview {
    padding: 8px 10px;
    display: grid;
    gap: 5px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.document-template-instance-preview-head {
    min-height: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: center;
}

.document-template-instance-preview-head strong,
.document-template-instance-preview-head span,
.document-template-instance-preview-head small,
.document-template-instance-preview-warning,
.document-template-instance-preview-blocker {
    min-width: 0;
    color: #414750;
    font-size: 11px;
    line-height: 14px;
    font-weight: 700;
}

.document-template-instance-preview-head strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 900;
}

.document-template-instance-preview-warning {
    color: #6c5100;
}

.document-template-instance-preview-blocker {
    color: #93000a;
}

.document-template-instance-dms-readiness {
    padding: 8px 10px;
    display: grid;
    gap: 5px;
    border: 1px solid #d9c77a;
    border-radius: 2px;
    background: #fffdf3;
}

.document-template-instance-dms-target {
    min-height: 26px;
    padding: 5px 6px;
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    gap: 7px;
    align-items: center;
    border: 1px solid #e2d59d;
    background: #fff;
}

.document-template-instance-dms-target span,
.document-template-instance-dms-target strong,
.document-template-instance-dms-target small {
    min-width: 0;
    overflow: hidden;
    color: #414750;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-instance-dms-target span {
    color: #6c5100;
    font-weight: 900;
    text-transform: uppercase;
}

.document-template-instance-dms-target strong {
    color: #1a1c1c;
    font-weight: 900;
}

.document-template-instance-dms-checks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
}

.document-template-instance-dms-checks span {
    min-height: 42px;
    padding: 5px 6px;
    display: grid;
    gap: 2px;
    border: 1px solid #d7dce4;
    background: #fff;
}

.document-template-instance-dms-checks em,
.document-template-instance-dms-checks strong,
.document-template-instance-dms-checks small {
    min-width: 0;
    overflow: hidden;
    font-size: 10px;
    line-height: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-instance-dms-checks em {
    color: #93000a;
    font-style: normal;
    font-weight: 900;
    text-transform: uppercase;
}

.document-template-instance-dms-checks strong {
    color: #1a1c1c;
    font-weight: 900;
}

.document-template-instance-dms-checks small {
    color: #727782;
    font-weight: 700;
}

.document-template-instance-preview-html {
    max-height: 360px;
    overflow: auto;
    border: 1px solid #d7dce4;
    background: #f3f2f1;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-readiness,
.project-document-create-modal.document-create-instance-modal .document-template-instance-preview,
.project-document-create-modal.document-create-instance-modal .document-template-instance-dms-readiness {
    padding: 0;
    gap: 0;
    overflow: hidden;
    border-radius: 7px;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-readiness > strong,
.project-document-create-modal.document-create-instance-modal .document-template-instance-readiness > span,
.project-document-create-modal.document-create-instance-modal .document-template-instance-readiness > small,
.project-document-create-modal.document-create-instance-modal .document-template-instance-preview > small,
.project-document-create-modal.document-create-instance-modal .document-template-instance-dms-readiness > small {
    padding: 6px 10px;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-preview-head {
    min-height: 34px;
    padding: 0 10px;
    background: #f8fafc;
    border-bottom: 1px solid #e4eaf2;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-preview-fields {
    margin-top: 0;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-preview-fields span {
    min-height: 26px;
    padding: 5px 7px;
    grid-template-columns: 34px minmax(0, 1fr);
    border-width: 0 1px 1px 0;
    border-radius: 0;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-preview-fields small {
    grid-column: 1 / -1;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-dms-target {
    min-height: 32px;
    padding: 6px 10px;
    grid-template-columns: 88px minmax(0, 1fr) auto;
    border-width: 0 0 1px;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-dms-checks {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-dms-checks span {
    min-height: 30px;
    padding: 5px 7px;
    border-width: 0 1px 1px 0;
}

.project-document-create-modal.document-create-instance-modal .document-template-instance-preview-html {
    max-height: 220px;
    border-width: 0;
    border-top: 1px solid #d7dce4;
}

.document-template-instance-preview-sheet {
    margin: 10px auto;
    width: min(100%, 720px);
    min-height: 360px;
    padding: 22px 28px;
    box-sizing: border-box;
    display: grid;
    align-content: start;
    gap: 14px;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
    font-family: Arial, sans-serif;
}

.document-template-instance-preview-sheet header {
    display: grid;
    gap: 2px;
    padding-bottom: 10px;
    border-bottom: 2px solid #005ea8;
}

.document-template-instance-preview-sheet header.template-missing {
    border-bottom-color: #f2c94c;
}

.document-template-instance-preview-sheet main {
    display: grid;
    gap: 14px;
}

.document-template-instance-preview-sheet header span,
.document-template-instance-preview-sheet header small,
.document-template-instance-preview-sheet footer span,
.document-template-instance-preview-sheet footer small {
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.document-template-instance-preview-sheet header strong {
    color: #1a1c1c;
    font-size: 18px;
    line-height: 22px;
}

.document-template-instance-preview-runtime,
.document-template-instance-preview-template-runtime {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.document-template-instance-preview-runtime span,
.document-template-instance-preview-template-runtime span {
    min-height: 20px;
    padding: 3px 7px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #d8dce3;
    border-radius: 999px;
    background: #f8f9fb;
    color: #5d6673;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

.document-template-instance-preview-section {
    display: grid;
    gap: 6px;
}

.document-template-instance-preview-section h4 {
    margin: 0;
    color: #005ea8;
    font-size: 12px;
    line-height: 16px;
    font-weight: 900;
}

.document-template-instance-preview-section div {
    display: grid;
    border-top: 1px solid #e1e4e8;
}

.document-template-instance-preview-section p {
    margin: 0;
    min-height: 28px;
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    border-bottom: 1px solid #e1e4e8;
}

.document-template-instance-preview-section p[data-document-template-preview-field-placement-source="layout"],
.document-template-instance-preview-section p[data-document-template-preview-field-placement-source="content"],
.document-template-instance-preview-section p[data-document-template-preview-field-placement-source="placeholder-schema"] {
    box-shadow: inset 3px 0 0 #005ea8;
}

.document-template-instance-preview-section p[data-document-template-preview-field-placement-source="default-preview"] {
    box-shadow: inset 3px 0 0 #d8dce3;
}

.document-template-instance-preview-section p span,
.document-template-instance-preview-section p strong {
    min-width: 0;
    padding: 6px 8px;
    font-size: 11px;
    line-height: 15px;
}

.document-template-instance-preview-section p span {
    color: #727782;
    font-weight: 800;
    background: #faf9f8;
}

.document-template-instance-preview-section p strong {
    color: #1a1c1c;
    font-weight: 700;
    white-space: pre-wrap;
}

.document-template-instance-preview-sheet footer {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid #d7dce4;
}

.document-template-instance-preview-sheet footer.template-missing {
    border-top-color: #f2c94c;
}

@media (max-width: 900px) {
    .document-create-context,
    .document-create-template-grid,
    .document-template-instance-field-grid,
    .document-template-instance-preview-fields,
    .document-template-instance-dms-checks,
    .document-template-instance-dms-target,
    .document-template-instance-preview-head,
    .document-template-instance-preview-section p {
        grid-template-columns: 1fr;
    }
}

.project-status-field {
    display: grid;
    gap: 6px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.project-status-field select,
.project-status-field textarea {
    width: 100%;
    min-height: 32px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
}

.project-status-field textarea {
    min-height: 86px;
    padding: 8px;
    resize: vertical;
}

.status-hint {
    padding: 8px 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
    color: #605e5c;
    font-size: 11px;
    line-height: 16px;
}

.form-head,
.modal-actions {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.form-head {
    margin-bottom: 14px;
}

.form-head strong {
    display: block;
    margin-bottom: 2px;
    font-size: 16px;
}

.form-head span {
    color: var(--muted);
    font-size: 13px;
}

.form-head button,
.modal-actions button,
.row-actions button,
.row-actions a {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    color: var(--text);
    font-weight: 700;
    text-decoration: none;
}

.form-head button {
    width: 32px;
}

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

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

.form-grid label {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
    min-height: 36px;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 0 10px;
    background: #fff;
    color: var(--text);
}

.form-grid textarea {
    min-height: 116px;
    padding: 9px 10px;
    resize: vertical;
}

.form-grid input:disabled {
    background: #eef1f5;
    color: var(--muted);
}

.form-grid .wide {
    grid-column: 1 / -1;
}

.project-customer-unlink {
    display: grid;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px solid #d6c47a;
    border-radius: 7px;
    background: #fff8df;
}

.project-customer-unlink-head {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
}

.project-customer-unlink-head .material-symbols-outlined {
    color: #7a5d00;
    font-size: 20px;
}

.project-customer-unlink-head strong,
.project-customer-unlink-head span {
    display: block;
}

.project-customer-unlink-head strong {
    color: var(--text);
    font-size: 12px;
    font-weight: 750;
}

.project-customer-unlink-head span {
    color: var(--muted);
    font-size: 12px;
    line-height: 16px;
}

.project-customer-unlink-actions {
    display: flex;
    justify-content: flex-end;
}

.project-customer-unlink-actions button {
    min-height: 32px;
    border: 1px solid #7a5d00;
    border-radius: 7px;
    background: #fff;
    padding: 0 12px;
    color: #654d00;
    font-weight: 700;
}

.checkbox-field {
    align-content: center;
    grid-template-columns: auto 1fr;
    min-height: 36px;
}

.checkbox-field input {
    width: 16px;
    min-height: 16px;
}

.form-error {
    display: grid;
    gap: 3px;
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid #fecaca;
    border-radius: 7px;
    background: #fff7f7;
    color: var(--danger);
    font-size: 13px;
    font-weight: 700;
}

.form-success {
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 7px;
    background: #f0fdf4;
    color: #166534;
    font-size: 13px;
    font-weight: 800;
}

.form-feedback {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 12px 0;
    padding: 9px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 7px;
    background: #f0fdf4;
    color: #166534;
    font-size: 13px;
    font-weight: 760;
}

.form-feedback.is-warning {
    border-color: #fde68a;
    background: #fffbeb;
    color: #92400e;
}

.form-feedback .material-symbols-outlined {
    font-size: 18px;
    line-height: 1.1;
}

.form-feedback > div {
    display: grid;
    gap: 2px;
}

.modal-actions {
    justify-content: flex-end;
    margin-top: 14px;
}

.modal-actions button {
    padding: 0 12px;
}

.project-list-table {
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: visible;
}

.project-list-head,
.project-list-row {
    display: grid;
    grid-template-columns: 130px minmax(220px, 1.4fr) minmax(180px, 1fr) minmax(140px, .8fr) minmax(150px, .8fr) 76px;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    padding: 0 14px;
}

.project-list-head {
    background: #f3f5f8;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-sort-button {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-align: left;
    text-transform: inherit;
    cursor: pointer;
}

.project-sort-button span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-sort-button .material-symbols-outlined {
    font-size: 17px;
    color: #98a2b3;
}

.project-sort-button.is-active {
    color: var(--text);
}

.project-sort-button.is-active .material-symbols-outlined,
.project-sort-button:hover .material-symbols-outlined {
    color: #155eef;
}

.project-list-row {
    border-top: 1px solid var(--border-soft);
    cursor: pointer;
}

.project-list-row:hover,
.project-list-row:focus-visible {
    background: #f4f8ff;
    outline: 0;
}

.project-list-row.is-selected {
    background: #eef5ff;
    box-shadow: inset 3px 0 0 #155eef;
}

.project-list-row mark {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #155eef;
    font-size: 12px;
    font-weight: 800;
}

.project-row-actions {
    justify-self: center;
    color: #155eef;
}

.project-row-actions.is-archived,
.project-card-archive-state {
    color: #667085;
    font-size: 12px;
    font-weight: 800;
}

.project-action-menu {
    position: relative;
}

.project-action-menu summary {
    min-height: 32px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: transparent;
    color: #155eef;
    font-size: 12px;
    font-weight: 800;
    list-style: none;
    cursor: pointer;
}

.project-row-actions summary {
    width: 32px;
    padding: 0;
}

.project-action-menu summary::-webkit-details-marker {
    display: none;
}

.project-action-menu summary::marker {
    content: "";
}

.project-action-menu[open] summary,
.project-action-menu summary:hover,
.project-action-menu summary:focus-visible {
    border-color: #cddbf7;
    background: #eef4ff;
    outline: 0;
}

.project-action-menu .material-symbols-outlined {
    font-size: 17px;
}

.project-action-menu > div {
    min-width: 212px;
    margin-top: 4px;
    padding: 6px;
    position: absolute;
    right: 0;
    z-index: 90;
    display: grid;
    gap: 2px;
    border: 1px solid var(--border);
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(26, 28, 28, 0.16);
}

.project-action-menu button {
    width: 100%;
    min-height: 30px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--text);
    font-size: 12px;
    font-weight: 700;
    text-align: left;
}

.project-action-menu button:hover,
.project-action-menu button:focus-visible {
    background: #f3f5f8;
    outline: 0;
}

.project-action-menu button:disabled {
    color: #8a8f98;
    cursor: not-allowed;
}

.project-action-menu button:disabled:hover,
.project-action-menu button:disabled:focus-visible {
    background: transparent;
}

.project-action-menu button.danger {
    color: var(--danger);
}

.project-register-table {
    order: 3;
    min-height: 0;
    overflow: auto;
    border: 0;
    border-radius: 0;
    background: #f8f8f8;
}

.project-list-panel > .form-error,
.project-list-panel > .form-success,
.project-list-panel > [data-project-create-auto-apply-feedback] {
    order: 2;
}

.project-list-panel > .empty-state,
.project-list-panel > .project-register-grid {
    order: 3;
}

.project-register-table .project-list-head,
.project-register-table .project-list-row {
    width: 100%;
    min-width: 860px;
    grid-template-columns: 96px minmax(260px, 1fr) 190px 140px 150px 64px;
    gap: 0;
    padding: 0;
}

.project-register-table .project-list-head {
    min-height: 32px;
    border-bottom: 1px solid #c1c7d2;
    background: #f3f2f1;
    color: #414750;
    text-transform: none;
}

.project-register-table .project-list-head > span,
.project-register-table .project-list-head > button {
    min-height: 32px;
    padding: 4px 12px;
    display: flex;
    align-items: center;
    border-right: 1px solid #c1c7d2;
    color: #414750;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.project-register-table .project-list-head > button {
    justify-content: flex-start;
    border-radius: 0;
}

.project-register-table .project-list-head > button .material-symbols-outlined {
    margin-left: auto;
    color: #727782;
    font-size: 14px;
}

.project-register-table .project-list-head > button:hover,
.project-register-table .project-list-head > button:focus-visible {
    background: #e9e8e7;
    color: #005a9e;
    outline: 0;
}

.project-register-table .project-list-row {
    min-height: 28px;
    border-top: 0;
    border-bottom: 1px solid #d7dce3;
    background: #fff;
    color: #1a1c1c;
}

.project-register-table .project-list-row:nth-child(odd) {
    background: #f8f8f8;
}

.project-register-table .project-list-row:hover,
.project-register-table .project-list-row:focus-visible {
    background: #efeeed;
}

.project-register-table .project-list-row.is-selected {
    box-shadow: none;
}

.project-register-table .project-list-row.is-selected:nth-child(even) {
    background: #fff;
}

.project-register-table .project-list-row.is-selected:nth-child(odd) {
    background: #f8f8f8;
}

.project-register-table .project-list-row > * {
    min-height: 28px;
    padding: 2px 12px;
    overflow: hidden;
    display: flex;
    align-items: center;
    border-right: 1px solid #d7dce3;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-register-table .project-list-head > *:nth-child(5),
.project-register-table .project-list-head > *:nth-child(6),
.project-register-table .project-list-row > *:nth-child(5),
.project-register-table .project-list-row > *:nth-child(6) {
    justify-content: center;
}

.project-register-table .project-list-head > *:last-child,
.project-register-table .project-list-row > *:last-child {
    border-right: 0;
}

.project-register-table .project-list-row strong {
    color: #605e5c;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
    font-weight: 500;
}

.project-register-table .project-list-row > span:nth-child(2) {
    color: #1a1c1c;
    font-weight: 700;
}

.project-register-table .project-list-row mark {
    min-height: 16px;
    padding: 1px 6px;
    border-radius: 2px;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.project-register-table .project-row-actions {
    justify-self: stretch;
    justify-content: center;
    overflow: visible;
    position: relative;
    z-index: 2;
    color: #005a9e;
}

.project-register-table .project-row-actions[open] {
    z-index: 120;
}

.project-register-table .project-row-actions summary {
    width: 28px;
    min-height: 24px;
}

.project-register-table .project-row-actions .material-symbols-outlined {
    font-size: 16px;
}

.project-detail-appbar {
    height: 32px;
    min-height: 32px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid #c1c7d2;
    border-bottom: 0;
    background: #faf9f8;
}

.project-detail-titlebar {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 16px;
}

.project-detail-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #666462;
    font-size: 10px;
    line-height: 12px;
}

.project-detail-breadcrumb button {
    min-height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #666462;
    font-size: 10px;
}

.project-detail-breadcrumb button:hover,
.project-detail-breadcrumb button:focus-visible {
    color: #005a9e;
    text-decoration: underline;
    outline: 0;
}

.project-detail-breadcrumb .material-symbols-outlined {
    font-size: 12px;
}

.project-detail-breadcrumb strong {
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 600;
}

.project-detail-appbar h1 {
    min-width: 0;
    margin: 0;
    display: flex;
    align-items: center;
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.project-detail-appbar h1 span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-detail-actions {
    display: flex;
    align-items: center;
    gap: 4px;
}

.project-detail-actions > button,
.project-detail-actions .project-action-menu summary {
    height: 24px;
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #efeeed;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 500;
    line-height: 12px;
}

.project-detail-actions > button:hover,
.project-detail-actions > button:focus-visible,
.project-detail-actions .project-action-menu summary:hover,
.project-detail-actions .project-action-menu summary:focus-visible {
    background: #e9e8e7;
    outline: 0;
}

.project-detail-actions > button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.project-detail-actions .material-symbols-outlined {
    font-size: 14px;
}

.project-detail-actions .project-action-menu > div {
    margin-top: 4px;
    border-color: #c1c7d2;
    border-radius: 2px;
    box-shadow: 0 8px 24px rgba(26, 28, 28, 0.16);
}

.project-detail-action-separator {
    width: 1px;
    height: 16px;
    margin: 0 4px;
    background: #c1c7d2;
}

.project-detail-actions > button.project-detail-status-pill {
    height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-color: transparent;
    border-radius: 999px;
    background: #605e5c;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
}

.project-detail-status-pill i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4ade80;
}

.project-body[data-project-detail] {
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-top: 0;
    background: #dadad9;
}

.project-body[data-project-detail] .project-detail-kpis {
    margin: 0;
    padding: 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    background: #dadad9;
}

.project-body[data-project-detail] .project-cockpit-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.project-body[data-project-detail] .cockpit-tile {
    min-height: 58px;
    padding: 8px;
    align-content: space-between;
    gap: 4px;
    border: 1px solid #edebe9;
    border-radius: 0;
    background: #faf9f8;
    box-shadow: none;
}

.project-body[data-project-detail] .cockpit-tile.warning {
    border-color: #edebe9;
    border-left: 2px solid #ba1a1a;
    background: #faf9f8;
}

.project-body[data-project-detail] .cockpit-tile:nth-child(4) {
    border-left: 2px solid #005aa1;
}

.project-body[data-project-detail] .cockpit-tile span {
    color: #727782;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0;
}

.project-body[data-project-detail] .cockpit-tile strong {
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.project-body[data-project-detail] .cockpit-tile.warning strong {
    color: #ba1a1a;
}

.project-body[data-project-detail] .cockpit-tile:nth-child(4) strong {
    color: #004279;
}

.project-body[data-project-detail] .cockpit-tile small {
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.project-body .project-browser {
    min-height: 0;
    height: 100%;
    padding: 0;
    display: grid;
    grid-template-columns: 192px minmax(0, 1fr);
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #efeeed;
    box-shadow: none;
}

.project-browser-wide {
    min-height: 0;
}

.project-body .project-browser.project-browser-wide {
    height: 100%;
    min-height: 0;
    max-height: 100%;
}

@media (max-width: 1180px) {
    .project-detail-titlebar {
        gap: 8px;
    }

    .project-detail-breadcrumb {
        display: none;
    }

    .project-body[data-project-detail] .project-cockpit-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .project-body .project-browser {
        grid-template-columns: 160px minmax(0, 1fr);
    }

    .project-info-overview {
        grid-template-columns: 1fr;
    }
}

.project-body .vertical-tabs {
    padding: 8px 0;
    display: grid;
    align-content: start;
    overflow-y: auto;
    border-right: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-body .vertical-tabs button {
    min-height: 28px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border: 0;
    border-left: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #414750;
    font-size: 12px;
    font-weight: 400;
    text-align: left;
}

.project-body .vertical-tabs button.active,
.project-body .vertical-tabs button:hover,
.project-body .vertical-tabs button:focus-visible {
    border-left-color: #005a9e;
    background: #e3e2e1;
    color: #005a9e;
    outline: 0;
}

.project-body .vertical-tabs button.active .project-nav-label {
    font-weight: 600;
}

.project-body .vertical-tabs .project-nav-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-body .vertical-tabs .project-nav-count {
    margin-left: auto;
    min-width: 18px;
    height: 16px;
    padding: 0 5px;
    display: inline-grid;
    place-items: center;
    border-radius: 2px;
    background: #e9e8e7;
    color: #414750;
    font-size: 9px;
    font-weight: 700;
}

.project-body .browser-content {
    min-width: 0;
    min-height: 0;
    padding: 8px;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    align-content: stretch;
    overflow: hidden;
    background: #efeeed;
}

.project-body.has-inline-mainframe-module .browser-content {
    grid-template-rows: minmax(0, 1fr);
    align-content: stretch;
    overflow: hidden;
}

.project-body.has-inline-mainframe-module .project-mainframe-inline-host > .project-tab-panel {
    display: none !important;
}

.project-body.has-inline-mainframe-module .project-mainframe-inline-host > .project-detail-inline-module.active {
    grid-row: 1;
    grid-column: 1;
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
    max-height: 100%;
    min-height: 0;
}

.project-body.has-inline-mainframe-module > .project-detail-inline-module,
.project-list-panel.has-project-detail > .project-detail-inline-module {
    display: none !important;
}

.project-list-panel.has-project-detail {
    --project-detail-titlebar-height: 41px;
    --project-detail-kpi-height: 91px;
    --project-detail-shell-height: calc(100vh - var(--dummy-topbar-height) - 24px);
    --project-detail-mainframe-height: max(500px, calc(var(--project-detail-shell-height) - var(--project-detail-titlebar-height) - var(--project-detail-kpi-height)));
    position: relative;
    height: var(--project-detail-shell-height);
    min-height: 0;
    max-height: var(--project-detail-shell-height);
    overflow: hidden;
}

.project-list-panel.has-project-detail.has-quote-editor-focus {
    --project-detail-titlebar-height: 0px;
    --project-detail-shell-height: calc(100vh - var(--dummy-topbar-height) - 16px);
}

.project-list-panel.has-project-detail > .project-detail-appbar {
    height: var(--project-detail-titlebar-height);
    min-height: var(--project-detail-titlebar-height);
    max-height: var(--project-detail-titlebar-height);
}

.project-list-panel.has-project-detail.has-quote-editor-focus > .project-detail-appbar {
    display: none;
}

.project-list-panel.has-project-detail > .project-body[data-project-detail] {
    display: grid;
    grid-template-rows: var(--project-detail-kpi-height) minmax(0, 1fr);
    height: calc(var(--project-detail-shell-height) - var(--project-detail-titlebar-height));
    min-height: 0;
    max-height: calc(var(--project-detail-shell-height) - var(--project-detail-titlebar-height));
}

.project-list-panel.has-project-detail > .project-body[data-project-detail] > .project-detail-kpis {
    height: var(--project-detail-kpi-height);
    min-height: var(--project-detail-kpi-height);
    max-height: var(--project-detail-kpi-height);
    overflow: hidden;
}

.project-list-panel.has-project-detail > .project-body[data-project-detail] > .project-browser.project-browser-wide {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
}

.project-mainframe-inline-host {
    position: relative;
    min-width: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
    isolation: isolate;
}

.project-mainframe-inline-host:has([data-project-pdf-viewer-modal]) {
    isolation: auto;
}

.project-mainframe-inline-host:empty {
    display: none;
}

.project-body .browser-content > .project-mainframe-inline-host > [data-project-panel] {
    position: relative;
    grid-row: 1;
    grid-column: 1;
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-height: 100%;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-tab-panel.active {
    height: 100%;
    min-height: 0;
    overflow: auto;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-detail-inline-module {
    position: relative;
    grid-row: 1;
    grid-column: 1;
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
    overflow: auto;
    border-left: 0 !important;
    border-top: 0 !important;
    background: #efeeed;
    box-shadow: none;
}

.project-body .browser-content > .project-mainframe-inline-host:has(> .project-detail-inline-module) > .project-tab-panel {
    display: none !important;
}

.project-body .browser-content > .project-mainframe-inline-host.has-inline-module > .project-tab-panel {
    display: none !important;
}

.project-body .browser-content > .project-mainframe-inline-host > [data-project-panel] {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-detail-inline-module .notes-head {
    min-height: 32px;
    margin: 0 0 8px;
    padding: 0 0 6px;
    align-items: center;
    border-bottom: 1px solid #d7dce3;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-detail-inline-module .notes-title-group h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-detail-inline-module .note-count {
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-detail-inline-module .toolbar button,
.project-body .browser-content > .project-mainframe-inline-host > .project-detail-inline-module .project-tool-button,
.project-body .browser-content > .project-mainframe-inline-host > .project-detail-inline-module .primary {
    min-height: 28px;
    border-radius: 2px;
    padding: 0 8px;
    font-size: 11px;
    line-height: 14px;
}

.project-body .browser-content > .project-mainframe-inline-host > section.project-detail-inline-module {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.project-body .browser-content::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.project-body .browser-content::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.project-body .browser-content::-webkit-scrollbar-thumb {
    background: #c1c7d2;
}

.project-tab-panel {
    display: none;
}

.project-tab-panel.active {
    display: grid;
    gap: 8px;
}

.project-tab-panel[data-project-panel="project-info"] > .content-head {
    display: none;
}

.project-info-overview {
    display: grid;
    gap: 8px;
}

.overview-stack {
    display: grid;
    gap: 8px;
}

.overview-card {
    border: 1px solid #edebe9;
    background: #faf9f8;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.06);
}

.project-info-subtabs {
    min-height: 32px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #c1c7d2;
    background: #efeeed;
}

.project-info-subtabs button {
    min-height: 32px;
    padding: 0 12px;
    border: 0;
    border-right: 1px solid transparent;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #414750;
    font-size: 11px;
    font-weight: 500;
}

.project-info-subtabs button.active,
.project-info-subtabs button:hover,
.project-info-subtabs button:focus-visible {
    border-bottom-color: #005a9e;
    background: transparent;
    color: #005a9e;
    font-weight: 700;
    outline: 0;
}

.project-info-subtabs button:disabled {
    color: #9aa0a8;
    cursor: not-allowed;
}

.project-info-subtabs button:disabled:hover {
    background: transparent;
    color: #9aa0a8;
}

.info-tab-panel {
    padding: 8px;
}

.info-tab-panel:not(.active) {
    display: none;
}

.project-data-list {
    display: grid;
}

.project-data-row {
    min-height: 42px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    border-bottom: 1px solid #edebe9;
}

.project-data-row:last-child {
    border-bottom: 0;
}

.project-data-label {
    color: #727782;
    font-size: 10px;
    font-weight: 600;
    line-height: 12px;
    text-transform: uppercase;
}

.project-data-value {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-data-value small {
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.project-data-value strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-data-pairs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 14px;
    row-gap: 4px;
}

.project-data-pairs > span {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.project-data-pairs > span em {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    font-style: normal;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-data-pairs > span.project-data-missing {
    padding-left: 8px;
    border-left: 2px solid #c7cbd1;
}

.project-data-missing strong {
    color: #605e5c;
    font-weight: 600;
}

.project-data-missing em {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    font-style: normal;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-tab-panel[data-project-panel="project-info"] {
    gap: 8px;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-overview {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.52fr);
    gap: 8px;
    align-items: stretch;
}

.project-tab-panel[data-project-panel="project-info"] .overview-stack {
    min-height: 0;
    gap: 8px;
}

.project-tab-panel[data-project-panel="project-info"] .overview-card {
    padding: 0;
    overflow: hidden;
    border: 1px solid #edebe9;
    border-radius: 0;
    background: #faf9f8;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.06);
}

.project-tab-panel[data-project-panel="project-info"] .project-info-subtabs {
    height: 32px;
    min-height: 32px;
    margin: 0;
    border-bottom: 1px solid #c1c7d2;
    background: #efeeed;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-subtabs button {
    height: 32px;
    min-height: 32px;
    padding: 0 12px;
    font-size: 11px;
    font-weight: 500;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-subtabs button.active {
    border-bottom-color: #005a9e;
    color: #005a9e;
    font-weight: 700;
}

.project-tab-panel[data-project-panel="project-info"] .info-tab-panel {
    padding: 8px;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-list {
    overflow: hidden;
    border: 1px solid #edebe9;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.04);
}

.project-tab-panel[data-project-panel="project-info"] .project-data-row {
    min-height: 40px;
    padding: 0;
    grid-template-columns: minmax(164px, 28%) minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
    border-bottom: 1px solid #edebe9;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-label {
    min-height: 40px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    border-right: 1px solid #edebe9;
    background: #faf9f8;
    color: #414750;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 16px;
    text-transform: none;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-value {
    min-height: 40px;
    padding: 8px 12px;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-value strong {
    overflow: visible;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    text-overflow: clip;
    white-space: normal;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-value small,
.project-tab-panel[data-project-panel="project-info"] .project-data-value em {
    color: #727782;
    font-size: 10px;
    font-style: normal;
    line-height: 13px;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-pairs {
    display: grid;
    grid-template-columns: repeat(2, minmax(120px, 1fr));
    gap: 8px 18px;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-pairs > span {
    min-width: 0;
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: baseline;
    column-gap: 6px;
    row-gap: 2px;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-pairs > span > em {
    grid-column: 1 / -1;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-pairs-dates {
    grid-template-columns: repeat(3, minmax(105px, 1fr));
}

.project-tab-panel[data-project-panel="project-info"] .project-data-pairs-dates > span {
    grid-template-columns: 1fr;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-pairs-steering > span:nth-child(3) {
    grid-column: 1 / -1;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-pairs-steering > span {
    grid-template-columns: 1fr;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-lines {
    display: grid;
    gap: 2px;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-missing {
    padding-left: 8px;
    border-left: 2px solid #c7cbd1;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-value strong.project-data-status-chip,
.project-tab-panel[data-project-panel="project-info"] .project-data-value strong.project-data-next-step-chip {
    width: max-content;
    max-width: 100%;
    min-height: 18px;
    padding: 2px 7px;
    display: inline-flex;
    align-items: center;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    line-height: 12px;
    text-transform: uppercase;
    white-space: nowrap;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-status-chip {
    background: #e5f1fb;
    color: #005a9e;
}

.project-tab-panel[data-project-panel="project-info"] .project-data-next-step-chip {
    background: #fff0e8;
    color: #b54708;
}

@media (max-width: 1360px) {
    .project-tab-panel[data-project-panel="project-info"] .project-data-row {
        grid-template-columns: minmax(150px, 27%) minmax(0, 1fr);
    }

    .project-tab-panel[data-project-panel="project-info"] .project-data-pairs-dates {
        grid-template-columns: repeat(2, minmax(120px, 1fr));
    }

    .project-tab-panel[data-project-panel="project-info"] .project-data-pairs-dates > span:last-child {
        grid-column: 1 / -1;
    }
}

.project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card {
    min-height: 0;
    display: grid;
    grid-template-rows: 32px 29px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #edebe9;
    border-radius: 0;
    background: #fff;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.06);
}

.project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card .overview-card-title {
    height: 32px;
    margin: 0;
    padding: 0 8px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #efeeed;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card .overview-card-title small {
    justify-self: end;
    min-width: 0;
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card .activity-filter-line {
    min-height: 29px;
    margin: 0;
    padding: 4px 8px;
    display: flex;
    gap: 4px;
    overflow-x: auto;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card .activity-filter-line button {
    min-height: 20px;
    padding: 0 8px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #414750;
    font-size: 9px;
    font-weight: 600;
    white-space: nowrap;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card .activity-filter-line button.active,
.project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card .activity-filter-line button:hover {
    background: #005a9e;
    color: #fff;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline {
    min-height: 0;
    padding: 8px;
    display: grid;
    align-content: start;
    gap: 0;
    overflow-y: auto;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline article {
    position: relative;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 8px;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline article:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 28px;
    bottom: 0;
    left: 11px;
    width: 1px;
    background: rgba(193, 199, 210, 0.65);
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline .avatar {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #d3e4ff;
    color: #005a9e;
    font-size: 10px;
    font-weight: 700;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline .avatar.system {
    background: #e3e2e1;
    color: #414750;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline .avatar.warning {
    background: #fff0e8;
    color: #d83b01;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline article > div {
    min-width: 0;
    padding-bottom: 14px;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline small {
    display: block;
    color: #727782;
    font-size: 9px;
    line-height: 12px;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline p {
    margin: 2px 0 0;
    color: #414750;
    font-size: 10px;
    line-height: 14px;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline mark {
    margin-top: 4px;
    padding: 2px 6px;
    border-radius: 2px;
    background: #ffdad6;
    color: #93000a;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline mark.done {
    background: #eef8ee;
    color: #107c10;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-timeline mark.neutral {
    background: #e9e8e7;
    color: #414750;
}

.project-tab-panel[data-project-panel="project-info"] .project-info-activity-state {
    margin: 8px;
    min-height: 120px;
    border: 1px dashed #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

@media (max-width: 1180px) {
    .project-tab-panel[data-project-panel="project-info"] .project-info-overview {
        grid-template-columns: minmax(0, 1fr);
    }

    .project-tab-panel[data-project-panel="project-info"] .project-info-logbook-card {
        min-height: 240px;
    }
}

.project-customer-projects {
    display: grid;
    gap: 8px;
}

.project-customer-projects-toolbar {
    min-height: 30px;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: end;
}

.project-customer-projects-toolbar label {
    display: grid;
    gap: 3px;
    color: #727782;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}

.project-customer-projects-toolbar select {
    height: 24px;
    min-width: 120px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    font-size: 11px;
}

.customer-project-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.customer-project-summary article {
    min-height: 54px;
    padding: 7px 8px;
    display: grid;
    gap: 2px;
    border: 1px solid #d7dce3;
    background: #fff;
}

.customer-project-summary span,
.customer-project-summary small {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-project-summary strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 14px;
    line-height: 17px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-project-table {
    display: grid;
    border: 1px solid #d7dce3;
    background: #fff;
}

.customer-project-head,
.customer-project-row {
    min-height: 30px;
    display: grid;
    grid-template-columns: minmax(140px, 1.3fr) minmax(90px, .8fr) minmax(96px, .8fr) minmax(90px, .8fr) minmax(130px, 1fr);
    gap: 8px;
    align-items: center;
    padding: 5px 8px;
    border-bottom: 1px solid #edebe9;
}

.customer-project-head {
    min-height: 28px;
    background: #f4f3f2;
    color: #727782;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

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

.customer-project-row.is-current {
    box-shadow: inset 3px 0 0 #005a9e;
    background: #f4f8ff;
}

.customer-project-row strong,
.customer-project-row span,
.customer-project-row small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.customer-project-row strong {
    font-size: 12px;
    line-height: 15px;
}

.customer-project-row small {
    display: block;
    color: #727782;
    font-size: 10px;
    line-height: 12px;
    white-space: nowrap;
}

.customer-project-row span {
    font-size: 11px;
    white-space: nowrap;
}

.customer-project-row mark {
    min-height: 18px;
    display: inline-flex;
    align-items: center;
    padding: 1px 7px;
    border-radius: 999px;
    background: #edf3ff;
    color: #345fae;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.project-info-status-summary {
    margin-bottom: 8px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.project-info-status-summary article {
    min-height: 54px;
    padding: 8px 9px;
    display: grid;
    gap: 2px;
    border: 1px solid #d7dce3;
    border-radius: 0;
    background: #fbfcfd;
}

.project-info-status-summary span,
.project-info-status-summary small {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-info-status-summary span {
    font-weight: 800;
    text-transform: uppercase;
}

.project-info-status-summary strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 700;
    line-height: 17px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.status-overview-table.project-info-status-table {
    width: 100%;
    border: 1px solid #d7dce3;
    border-collapse: collapse;
    background: #fff;
}

.status-overview-table.project-info-status-table th,
.status-overview-table.project-info-status-table td {
    min-height: 32px;
    padding: 6px 8px;
    border-right: 1px solid rgba(193, 199, 210, 0.55);
    border-bottom: 1px solid rgba(193, 199, 210, 0.55);
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    text-align: left;
    vertical-align: top;
}

.status-overview-table.project-info-status-table th {
    background: #f4f3f2;
    color: #414750;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.status-overview-table.project-info-status-table tr.done td:first-child {
    color: #2f7d45;
    font-weight: 850;
}

.status-overview-table.project-info-status-table tr.current {
    background: #fffaf0;
}

.status-overview-table.project-info-status-table tr.current td:first-child,
.status-overview-table.project-info-status-table tr.current strong {
    color: #8a5b12;
}

.project-register-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(292px, 1fr));
    gap: 10px;
}

.project-register-card {
    min-height: 252px;
    padding: 12px;
    display: grid;
    align-content: start;
    gap: 10px;
    border: 1px solid #d7dce3;
    border-radius: 4px;
    background: #fff;
}

.project-register-card.is-archived {
    background: #f8fafc;
    color: #667085;
}

.project-register-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.project-register-card header div,
.project-register-card p,
.project-card-facts span {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.project-register-card small,
.project-register-card p span,
.project-card-facts small {
    color: #68737f;
    font-size: 11px;
    font-weight: 700;
}

.project-register-card header small {
    color: #605e5c;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-weight: 500;
}

.project-register-card header strong {
    color: #1a1c1c;
    font-size: 15px;
    line-height: 1.25;
}

.project-register-card mark {
    min-height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1px 7px;
    border-radius: 999px;
    background: #edf3ff;
    color: #345fae;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.project-card-meta {
    display: grid;
    gap: 5px;
    color: #414750;
    font-size: 12px;
}

.project-card-meta > span {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.project-card-meta .material-symbols-outlined {
    color: #727782;
    font-size: 16px;
}

.project-card-facts {
    padding-top: 8px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    border-top: 1px solid var(--border-soft);
}

.project-card-facts strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-register-card p {
    margin: 0;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 1.4;
}

.project-card-actions {
    padding-top: 2px;
    display: flex;
    justify-content: flex-end;
}

.project-list-footer {
    order: 4;
    height: 32px;
    min-height: 32px;
    padding: 0 8px;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto minmax(180px, 1fr);
    align-items: center;
    gap: 12px;
    border: 0;
    border-top: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    color: #605e5c;
    font-size: 11px;
}

.project-list-footer > div {
    display: flex;
    align-items: center;
    gap: 6px;
}

.project-list-footer > div:last-child {
    justify-content: flex-end;
}

.project-pagination {
    margin-left: 0;
    justify-content: center;
    color: #414750;
    font-size: 11px;
}

.project-list-footer button {
    width: 24px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #414750;
}

.project-list-footer button:disabled {
    opacity: 0.35;
}

.project-list-footer button:not(:disabled):hover {
    background: #efeeed;
}

.project-list-footer .material-symbols-outlined {
    font-size: 16px;
}

.project-sort-status {
    padding-left: 8px;
    color: #667085;
}

.project-list-footer select {
    height: 20px;
    min-height: 20px;
    padding: 0 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
}

.customer-list-footer {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #c1c7d2;
    background: #f3f2f1;
    color: #605e5c;
    font-size: 10px;
}

.customer-list-footer > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.customer-list-footer select {
    height: 20px;
    min-height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 700;
}

.customer-list-footer button {
    width: 20px;
    height: 20px;
    min-height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #605e5c;
}

.customer-list-footer .material-symbols-outlined {
    font-size: 14px;
}

.customer-list-footer .customer-pagination {
    margin-left: 0;
    justify-content: flex-end;
    color: #605e5c;
    font-size: 10px;
}

.customer-view-toggle {
    height: 28px;
    display: inline-flex;
    overflow: hidden;
    border: 1px solid #c7cdd4;
    border-radius: 2px;
    background: #fff;
}

.customer-view-toggle button {
    width: 36px;
    min-height: 26px;
    padding: 0;
    border: 0;
    border-right: 1px solid #c7cdd4;
    border-radius: 0;
    background: #fff;
    color: #334155;
}

.customer-view-toggle button:last-child {
    border-right: 0;
}

.customer-view-toggle button.is-active,
.customer-view-toggle button:hover {
    background: #e1f1ff;
    color: var(--blue);
}

.customer-view-toggle .material-symbols-outlined {
    font-size: 16px;
}

.customer-list-head,
.customer-list-row {
    grid-template-columns: 40px 120px minmax(220px, 1.2fr) 90px 120px 140px minmax(170px, 1fr) 80px 115px 88px 56px;
}

.customer-list-table {
    border-color: #c7cdd4;
    border-radius: 0;
    background: #f8f8f8;
}

.customer-list-table .project-list-head,
.customer-list-table .project-list-row {
    width: 100%;
    min-width: 1239px;
    gap: 0;
    padding: 0;
}

.customer-list-table .project-list-head {
    min-height: 32px;
    border-bottom: 1px solid #c7cdd4;
    background: #f3f2f1;
    color: #303844;
    font-size: 12px;
    font-weight: 700;
    text-transform: none;
}

.customer-list-table .project-list-head > span {
    min-height: 32px;
    padding: 4px 12px;
    display: inline-flex;
    align-items: center;
    border-right: 1px solid #c7cdd4;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
}

.customer-list-table .project-list-row {
    min-height: 28px;
    border-top: 0;
    border-bottom: 1px solid #cfd6df;
    background: #fff;
    color: #111;
}

.customer-list-table .project-list-row:nth-child(odd) {
    background: #f7f7f7;
}

.customer-list-table .project-list-row:hover,
.customer-list-table .project-list-row:focus-visible {
    background: #efeeed;
}

.customer-list-table .project-list-row.is-selected {
    background: #e1f1ff;
    box-shadow: none;
}

.customer-list-table .project-list-row > * {
    min-height: 28px;
    padding: 2px 12px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border-right: 1px solid #c7cdd4;
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-list-table .project-list-head > span:last-child,
.customer-list-table .project-list-row > *:last-child {
    border-right: 0;
}

.supplier-list-head,
.supplier-list-row {
    grid-template-columns: 138px minmax(210px, 1.25fr) 150px minmax(140px, .8fr) minmax(145px, .8fr) 150px 118px 56px;
}

.supplier-list-table {
    border-color: #c7cdd4;
    border-radius: 0;
    background: #f8f8f8;
}

.supplier-list-table .project-list-head,
.supplier-list-table .project-list-row {
    width: 100%;
    min-width: 1107px;
    gap: 0;
    padding: 0;
}

.supplier-list-table .project-list-head {
    min-height: 32px;
    border-bottom: 1px solid #c7cdd4;
    background: #f3f2f1;
    color: #303844;
    font-size: 12px;
    font-weight: 700;
    text-transform: none;
}

.supplier-list-table .project-list-head > span {
    min-height: 32px;
    padding: 4px 12px;
    display: inline-flex;
    align-items: center;
    border-right: 1px solid #c7cdd4;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
}

.supplier-list-table .project-list-row {
    min-height: 28px;
    border-top: 0;
    border-bottom: 1px solid #cfd6df;
    background: #fff;
    color: #111;
}

.supplier-list-table .project-list-row:nth-child(odd) {
    background: #f7f7f7;
}

.supplier-list-table .project-list-row:hover,
.supplier-list-table .project-list-row:focus-visible {
    background: #efeeed;
}

.supplier-list-table .project-list-row > * {
    min-height: 28px;
    padding: 2px 12px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border-right: 1px solid #c7cdd4;
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplier-list-table .project-list-head > span:last-child,
.supplier-list-table .project-list-row > *:last-child {
    border-right: 0;
}

.supplier-list-table .supplier-row-actions {
    justify-self: center;
}

.supplier-list-table .supplier-row-actions summary {
    width: 28px;
    min-height: 24px;
}

.supplier-list-table .supplier-row-actions .material-symbols-outlined {
    font-size: 16px;
}

.supplier-list-table .supplier-row-actions.is-archived {
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.supplier-list-footer {
    height: 30px;
    min-height: 30px;
    border-top-color: #c7cdd4;
    background: #f3f2f1;
    font-size: 10px;
}

.supplier-list-footer > div:first-child {
    min-width: 0;
}

.supplier-list-footer .supplier-pagination {
    justify-content: center;
    font-size: 10px;
}

.supplier-list-footer button {
    width: 22px;
    height: 22px;
    min-height: 22px;
}

.supplier-list-footer .material-symbols-outlined {
    font-size: 15px;
}

.supplier-list-footer select {
    height: 20px;
    min-height: 20px;
    font-size: 10px;
}

.supplier-contact-footer {
    margin: 0 8px 8px;
    grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr);
    border: 1px solid #c7cdd4;
    border-top: 0;
    background: #f3f2f1;
}

.supplier-contact-footer .supplier-contact-pagination {
    min-width: 128px;
}

.supplier-address-footer {
    margin: 0 8px 8px;
    grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr);
    border: 1px solid #c7cdd4;
    border-top: 0;
    background: #f3f2f1;
}

.supplier-address-footer .supplier-address-pagination {
    min-width: 128px;
}

.customer-list-row > span,
.customer-list-row > strong,
.supplier-list-row > span,
.supplier-list-row > strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-form-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customer-mono {
    font-variant-numeric: tabular-nums;
    color: #374151;
}

.customer-email {
    color: #155eef;
}

.customer-selection-label {
    min-height: 20px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
    color: #323130;
    font-size: 11px;
    font-weight: 700;
}

.customer-list-toolbar .customer-bulk-archive-button {
    gap: 6px;
    color: #8a1f11;
}

.customer-list-toolbar .customer-bulk-archive-button .material-symbols-outlined {
    font-size: 15px;
}

.customer-bulk-archive-panel,
.customer-archive-panel,
.supplier-archive-panel,
.supplier-relation-archive-panel {
    margin: 8px;
    padding: 0;
    border: 1px solid #c7cdd4;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.customer-bulk-archive-panel .form-head,
.customer-archive-panel .form-head,
.supplier-archive-panel .form-head,
.supplier-relation-archive-panel .form-head {
    min-height: 32px;
    margin: 0;
    padding: 4px 8px;
    align-items: center;
    border-bottom: 1px solid #c1c7d2;
    background: #f1f3f5;
}

.customer-bulk-archive-panel .form-head strong,
.customer-archive-panel .form-head strong,
.supplier-archive-panel .form-head strong,
.supplier-relation-archive-panel .form-head strong {
    font-size: 13px;
}

.customer-bulk-archive-panel .form-head span,
.customer-archive-panel .form-head span,
.supplier-archive-panel .form-head span,
.supplier-relation-archive-panel .form-head span {
    color: #605e5c;
    font-size: 11px;
}

.customer-bulk-archive-panel > .form-error,
.customer-bulk-archive-panel > .form-success,
.customer-archive-panel > .form-error,
.supplier-archive-panel > .form-error,
.supplier-relation-archive-panel > .form-error {
    margin: 8px;
    padding: 6px 8px;
    border-radius: 2px;
    font-size: 11px;
}

.customer-bulk-preview,
.customer-bulk-result-list,
.customer-archive-summary,
.supplier-archive-summary {
    margin: 8px 8px 0;
    display: grid;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.customer-bulk-preview,
.customer-archive-summary,
.supplier-archive-summary {
    grid-template-columns: 112px minmax(160px, 1fr);
}

.customer-bulk-preview > *,
.customer-bulk-result-row > *,
.customer-archive-summary > *,
.supplier-archive-summary > * {
    min-height: 24px;
    padding: 3px 8px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border-right: 1px solid #c1c7d2;
    border-bottom: 1px solid #c1c7d2;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-bulk-preview > *:nth-child(2n),
.customer-bulk-result-row > *:last-child,
.customer-archive-summary > *:nth-child(2n),
.supplier-archive-summary > *:nth-child(2n) {
    border-right: 0;
}

.customer-bulk-preview > *:nth-last-child(-n + 2),
.customer-bulk-result-row:last-child > *,
.customer-archive-summary > *:nth-last-child(-n + 2),
.supplier-archive-summary > *:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.customer-bulk-result-row {
    display: grid;
    grid-template-columns: 112px minmax(160px, 1fr) 76px minmax(136px, 0.7fr);
}

.customer-bulk-result-row mark {
    justify-content: center;
    min-height: 18px;
    padding: 0 6px;
    border-radius: 2px;
    font-size: 10px;
    text-transform: uppercase;
}

.customer-bulk-reason,
.customer-archive-reason,
.supplier-archive-reason {
    margin: 8px 8px 0;
    display: grid;
    gap: 4px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.customer-bulk-reason textarea,
.customer-archive-reason textarea,
.supplier-archive-reason textarea {
    min-height: 52px;
    padding: 6px 8px;
    border: 1px solid #c7cdd4;
    border-radius: 2px;
    resize: vertical;
    color: #1a1c1c;
    font: inherit;
}

.customer-bulk-archive-panel .modal-actions,
.customer-archive-panel .modal-actions,
.supplier-archive-panel .modal-actions,
.supplier-relation-archive-panel .modal-actions {
    margin: 8px;
    padding-top: 8px;
    gap: 6px;
    border-top: 1px solid #d0d5dd;
}

.customer-bulk-archive-panel .modal-actions .danger,
.customer-archive-panel .modal-actions .danger,
.supplier-archive-panel .modal-actions .danger,
.supplier-relation-archive-panel .modal-actions .danger {
    border-color: #b42318;
    background: #b42318;
    color: #fff;
}

.customer-modal.customer-form-panel {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 90;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 0;
    padding: 0;
    transform: translate(-50%, -50%);
    border-color: #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(20, 30, 45, 0.24);
}

.customer-edit-modal {
    width: min(900px, calc(100vw - 32px));
    max-height: min(92vh, 760px);
}

.customer-bulk-archive-panel {
    width: min(700px, calc(100vw - 32px));
    max-height: min(88vh, 640px);
}

.customer-archive-panel {
    width: min(560px, calc(100vw - 32px));
    max-height: min(84vh, 520px);
}

.customer-contact-modal {
    width: min(760px, calc(100vw - 32px));
    max-height: min(92vh, 780px);
}

.customer-modal .modal-head {
    min-height: 40px;
    padding: 0 12px;
}

.customer-modal .modal-head strong {
    font-size: 13px;
}

.customer-modal .modal-head span {
    max-width: 560px;
}

.customer-modal .modal-body {
    padding: 10px 12px;
    gap: 8px;
}

.customer-modal .customer-form-grid {
    gap: 8px 10px;
}

.customer-contact-modal .customer-modal-body {
    padding: 10px;
    gap: 10px;
    overflow-y: auto;
    background: #f7f8fa;
}

.customer-contact-modal-section {
    border: 1px solid #d0d5dd;
    border-radius: 2px;
    background: #fff;
}

.customer-contact-modal-section > header {
    min-height: 32px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 7px;
    border-bottom: 1px solid #e1e5ea;
    background: #f3f4f6;
    color: #25313d;
}

.customer-contact-modal-section > header .material-symbols-outlined {
    color: #005a9e;
    font-size: 17px;
}

.customer-contact-modal-section > header strong {
    font-size: 12px;
}

.customer-contact-modal-grid {
    padding: 10px;
    gap: 9px 12px;
}

.customer-contact-modal-grid input,
.customer-contact-modal-grid select {
    min-height: 32px;
}

.customer-contact-modal-grid textarea {
    min-height: 72px;
    resize: vertical;
}

.customer-contact-name-hint {
    display: block;
    padding: 0 10px 9px;
    color: #667085;
    font-size: 10px;
}

.customer-modal .form-error,
.customer-modal .form-success,
.customer-modal .customer-bulk-preview,
.customer-modal .customer-bulk-result-list,
.customer-modal .customer-archive-summary,
.customer-modal .customer-bulk-reason,
.customer-modal .customer-archive-reason {
    margin: 0;
}

.customer-modal .customer-bulk-preview,
.customer-modal .customer-archive-summary {
    grid-template-columns: 112px minmax(0, 1fr);
}

.customer-modal .customer-bulk-reason textarea,
.customer-modal .customer-archive-reason textarea {
    min-height: 60px;
}

.customer-modal.customer-bulk-archive-panel .modal-actions,
.customer-modal.customer-archive-panel .modal-actions,
.customer-modal.customer-edit-modal .modal-actions,
.customer-modal.customer-contact-modal .modal-actions {
    min-height: 44px;
    margin: 0;
    padding: 0 12px;
    gap: 8px;
    border-top: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-modal .modal-actions .danger {
    border-color: #b42318;
    background: #b42318;
    color: #fff;
}

.customer-select-cell {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.customer-list-table .project-list-head .customer-select-cell,
.customer-list-table .project-list-row > .customer-select-cell {
    justify-content: center;
    padding: 0;
}

.customer-list-table .project-list-head > *:nth-child(4),
.customer-list-table .project-list-head > *:nth-child(8),
.customer-list-table .project-list-row > *:nth-child(4),
.customer-list-table .project-list-row > *:nth-child(8) {
    justify-self: center;
    justify-content: center;
}

.customer-select-cell .customer-checkbox {
    appearance: none;
    width: 14px;
    height: 14px;
    min-height: 14px;
    margin: 0;
    display: grid;
    flex: 0 0 14px;
    place-items: center;
    border: 1px solid #a7b0bb;
    border-radius: 2px;
    background: #fff;
    cursor: pointer;
}

.customer-select-cell .customer-checkbox::before {
    content: "";
    width: 4px;
    height: 7px;
    border: solid #fff;
    border-width: 0 1.5px 1.5px 0;
    transform: scale(0) rotate(45deg);
    transform-origin: center;
}

.customer-select-cell .customer-checkbox:checked {
    border-color: #005a9e;
    background: #005a9e;
}

.customer-select-cell .customer-checkbox:checked::before {
    transform: scale(1) rotate(45deg);
}

.customer-select-cell .customer-checkbox:focus-visible {
    outline: 2px solid #005a9e;
    outline-offset: 2px;
}

.customer-type,
.customer-status,
.project-list-row .customer-project-count {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.customer-list-table .customer-type,
.customer-list-table .customer-status,
.customer-list-table .customer-project-count {
    min-height: 16px;
    justify-content: center;
    padding: 1px 6px;
    border-radius: 2px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.customer-list-table .customer-project-count {
    min-width: 20px;
    background: var(--blue);
    color: #fff;
    text-transform: none;
}

.customer-list-table .customer-mono {
    color: #334155;
    font-size: 11px;
}

.customer-list-table .customer-email {
    color: #605e5c;
}

.customer-type.customer-type-commercial {
    background: #eef4ff;
    color: #155eef;
}

.customer-type.customer-type-public {
    background: #e9f9ee;
    color: #087443;
}

.customer-type.customer-type-private {
    background: #fff4de;
    color: #946200;
}

.customer-status.customer-status-active {
    background: #e9f9ee;
    color: #087443;
}

.customer-status.customer-status-prospect {
    background: #eef4ff;
    color: #155eef;
}

.customer-status.customer-status-blocked,
.customer-status.customer-status-archived {
    background: #f2f4f7;
    color: #475467;
}

.project-list-row .customer-project-count {
    background: #edf3ff;
    color: var(--primary);
}

.customer-list-table .customer-row-actions {
    justify-self: center;
}

.customer-list-table .customer-row-actions summary {
    width: 28px;
    min-height: 24px;
}

.customer-list-table .customer-row-actions .material-symbols-outlined {
    font-size: 16px;
}

.customer-list-table .customer-row-actions.is-archived {
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.customer-register-grid {
    min-height: 0;
    padding: 8px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    align-content: start;
    gap: 8px;
    overflow: auto;
    background: #f8f8f8;
}

.customer-register-card {
    min-height: 176px;
    padding: 8px;
    display: grid;
    align-content: start;
    gap: 7px;
    border: 1px solid #c7cdd4;
    border-radius: 0;
    background: #fff;
}

.customer-register-card.is-archived {
    background: #f8fafc;
    color: #667085;
}

.customer-register-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.customer-register-card header div,
.customer-card-meta span,
.customer-card-facts span {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.customer-register-card header small,
.customer-card-facts small {
    color: #605e5c;
    font-size: 10px;
    font-weight: 700;
}

.customer-register-card header small {
    font-family: "JetBrains Mono", Consolas, monospace;
    font-weight: 500;
}

.customer-register-card header strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 13px;
    line-height: 1.2;
    text-overflow: ellipsis;
}

.customer-register-card mark {
    min-height: 16px;
    padding: 1px 6px;
    border-radius: 2px;
    font-size: 10px;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.customer-card-meta {
    display: grid;
    gap: 3px;
    color: #414750;
    font-size: 11px;
}

.customer-card-meta > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-card-meta .material-symbols-outlined {
    color: #727782;
    font-size: 14px;
}

.customer-card-facts {
    padding-top: 6px;
    display: grid;
    grid-template-columns: minmax(50px, 0.8fr) minmax(82px, 1fr) minmax(90px, 1fr);
    gap: 6px;
    border-top: 1px solid var(--border-soft);
}

.customer-card-facts strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-card-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px;
}

.customer-card-action-menu summary {
    width: 28px;
    min-height: 24px;
    padding: 0;
}

.customer-card-action-menu .material-symbols-outlined {
    font-size: 16px;
}

.customer-card-archive-state {
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
}

.customer-card-archive-state {
    display: inline-flex;
    align-items: center;
}

.customer-detail-panel {
    margin-top: 18px;
    padding: 0;
    display: grid;
    grid-template-rows: 32px minmax(0, 1fr) 24px;
    gap: 0;
    overflow: hidden;
    border: 1px solid #dadada;
    background: #f4f3f2;
}

.customer-detail-appbar {
    min-width: 0;
    min-height: 32px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 0;
    border-bottom: 1px solid #dadada;
    background: #fff;
}

.customer-detail-breadcrumb {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    color: #605e5c;
    font-size: 11px;
}

.customer-detail-breadcrumb .material-symbols-outlined {
    color: #8a8886;
    font-size: 12px;
}

.customer-detail-breadcrumb strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-detail-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 4px;
}

.customer-detail-actions button {
    height: 24px;
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--border);
    border-radius: 2px;
    background: #fff;
    color: #323130;
    font-size: 12px;
    font-weight: 700;
}

.customer-detail-actions .primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.customer-detail-actions .material-symbols-outlined {
    font-size: 16px;
}

.customer-identifier > div:nth-child(2) {
    min-width: 0;
}

.customer-detail-canvas {
    min-height: 0;
    display: block;
    overflow-y: auto;
    padding: 8px;
    background: #f4f3f2;
}

.customer-detail-shell-state {
    min-height: 160px;
    padding: 16px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 4px;
    background: #f4f3f2;
    color: #605e5c;
    text-align: center;
}

.customer-detail-shell-state .material-symbols-outlined {
    font-size: 22px;
}

.customer-detail-shell-state strong {
    color: #1a1c1c;
    font-size: 12px;
}

.customer-detail-shell-state p {
    margin: 0;
    max-width: 520px;
    font-size: 11px;
}

.customer-identifier {
    margin-bottom: 12px;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
}

.customer-identifier h1 {
    margin: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-identifier p {
    margin: 0;
    overflow: hidden;
    color: #605e5c;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-avatar {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 4px;
    background: #e6e2df;
    color: #666462;
    font-size: 13px;
    font-weight: 700;
}

.customer-identity-badges {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.customer-identity-badges .customer-type,
.customer-identity-badges .customer-status {
    min-height: 18px;
    padding: 2px 8px;
    border-radius: 2px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.customer-identity-badges .customer-type,
.customer-identity-badges .customer-status.customer-status-prospect {
    background: #005aa1;
    color: #b3d1ff;
}

.customer-identity-badges .customer-status.customer-status-active {
    border: 1px solid #b9d9b9;
    background: #dcf3dc;
    color: #107c10;
}

.customer-identity-badges .customer-status.customer-status-blocked,
.customer-identity-badges .customer-status.customer-status-archived {
    border: 1px solid #c8c6c4;
    background: #e6e2df;
    color: #414750;
}

.customer-detail-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 8px;
}

.customer-detail-card {
    min-width: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid #edebe9;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.customer-detail-card > header {
    height: 32px;
    min-height: 32px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #efeeed;
    color: #1a1c1c;
}

.customer-detail-card > header strong {
    font-size: 12px;
    font-weight: 700;
}

.customer-detail-card > header .material-symbols-outlined,
.customer-detail-card > header button {
    color: #605e5c;
}

.customer-detail-card > header button {
    height: 22px;
    min-height: 22px;
    padding: 0 4px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 2px;
    background: transparent;
    font-size: 10px;
}

.customer-document-header-actions {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.customer-document-header-actions button:disabled {
    opacity: .5;
    cursor: not-allowed;
}

.customer-master-card {
    grid-column: span 8;
}

.customer-settings-card {
    grid-column: span 4;
}

.customer-project-card {
    grid-column: span 4;
}

.customer-detail-card.customer-project-card {
    justify-content: flex-start;
}

.customer-detail-card.customer-project-card,
.customer-detail-card.customer-documents-card,
.customer-detail-card.customer-contact-card {
    height: 220px;
    min-height: 220px;
    overflow: hidden;
}

.customer-project-header-actions {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.customer-project-header-actions .material-symbols-outlined {
    font-size: 14px;
    line-height: 1;
}

.customer-project-toolbar {
    min-height: 28px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-project-overview {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.customer-project-overview article {
    padding: 0;
    display: flex;
    align-items: center;
    gap: 3px;
}

.customer-project-overview article + article {
    border-left: 0;
}

.customer-project-overview span,
.customer-project-filter-row span,
.customer-project-state p {
    color: #605e5c;
    font-size: 10px;
}

.customer-project-overview strong {
    color: #1a1c1c;
    font-size: 12px;
    line-height: 1;
}

.customer-project-filter-row {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.customer-project-filter-row select {
    height: 20px;
    min-height: 20px;
    padding: 0 18px 0 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
}

.customer-project-list {
    min-height: 0;
    flex: 1;
    display: grid;
    align-content: start;
    gap: 0;
    overflow-y: auto;
}

.customer-project-list button {
    min-height: 44px;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    color: #1a1c1c;
    text-align: left;
}

.customer-project-list button:last-child {
    border-bottom: 0;
}

.customer-project-list button:hover {
    background: #f4f3f2;
}

.customer-project-list button > span {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.customer-project-list strong {
    overflow: hidden;
    color: #005a9e;
    font-family: Consolas, "JetBrains Mono", monospace;
    font-size: 11px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-project-list small {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-project-list mark {
    flex: 0 0 auto;
    padding: 2px 6px;
    border-radius: 2px;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.customer-project-list mark.blue {
    border: 1px solid #c9dcff;
    background: #eef5ff;
    color: #005a9e;
}

.customer-project-list mark.orange {
    border: 1px solid #ffd0bc;
    background: #fff2ed;
    color: #d83b01;
}

.customer-project-list mark.green {
    border: 1px solid #c2dfc2;
    background: #eef8ee;
    color: #107c10;
}

.customer-detail-card.customer-documents-card {
    grid-column: span 5;
}

.customer-contact-card {
    grid-column: span 3;
}

.customer-documents-card > header > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.customer-documents-card > header > div span {
    padding: 1px 4px;
    border-radius: 2px;
    background: #e3e2e1;
    color: #605e5c;
    font-size: 10px;
}

.customer-detail-card.customer-activity-card {
    grid-column: 1 / -1;
}

@media (max-width: 1180px) {
    .customer-master-card,
    .customer-settings-card,
    .customer-project-card,
    .customer-documents-card,
    .customer-contact-card {
        grid-column: 1 / -1;
    }

    .customer-detail-panel {
        max-height: none;
    }

    .customer-detail-card.customer-project-card,
    .customer-detail-card.customer-documents-card,
    .customer-detail-card.customer-contact-card {
        height: auto;
        min-height: 220px;
        overflow: visible;
    }
}

.customer-activity-card > header > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.customer-activity-card > header > div span {
    color: #605e5c;
    font-size: 18px;
}

.customer-activity-card > header button {
    width: auto;
    height: 20px;
    min-height: 20px;
    padding: 0 8px;
    border-radius: 2px;
    background: #005a9e;
    color: #fff;
    font-size: 10px;
}

.customer-activity-card > header button:disabled {
    opacity: .58;
}

.customer-note-section {
    border-bottom: 1px solid #edebe9;
    background: #fff;
}

.customer-note-command-row {
    min-height: 28px;
    padding: 4px 8px;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(140px, 180px);
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-communication-command-row {
    grid-template-columns: minmax(180px, 1fr) minmax(120px, 150px) minmax(120px, 150px);
}

.customer-note-command-row label,
.customer-note-form-grid label {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    color: #605e5c;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}

.customer-note-command-row label {
    flex-direction: row;
    align-items: center;
    gap: 4px;
    font-weight: 400;
    text-transform: none;
}

.customer-note-command-row input,
.customer-note-command-row select,
.customer-note-form-grid input,
.customer-note-form-grid select,
.customer-note-form-grid textarea {
    min-width: 0;
    width: 100%;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.customer-note-command-row input,
.customer-note-command-row select,
.customer-note-form-grid input,
.customer-note-form-grid select {
    min-height: 24px;
}

.customer-note-command-row input,
.customer-note-command-row select {
    height: 20px;
    min-height: 20px;
    padding: 0 4px;
    font-size: 10px;
}

.customer-note-form-grid input,
.customer-note-form-grid select {
    height: 22px;
    min-height: 22px;
    padding: 0 6px;
    font-size: 10px;
}

.customer-note-form {
    padding: 6px 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-note-form .form-head {
    margin-bottom: 6px;
}

.customer-note-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 6px 8px;
}

.customer-note-form-grid label {
    gap: 2px;
}

.customer-note-form-grid .wide {
    grid-column: 1 / -1;
}

.customer-note-form-grid textarea {
    min-height: 60px;
    font-size: 10px;
    resize: vertical;
}

.customer-note-pin {
    justify-content: end;
}

.customer-note-pin input {
    width: auto;
}

.customer-note-form-actions {
    margin-top: 6px;
    display: flex;
    justify-content: flex-end;
    gap: 4px;
}

.customer-note-form-actions button {
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #323130;
    font-size: 10px;
}

.customer-note-form-actions .primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.customer-note-list {
    display: grid;
    gap: 0;
}

.customer-note-list article {
    padding: 6px 8px;
    display: grid;
    gap: 3px;
    border-bottom: 1px solid #c1c7d2;
}

.customer-note-list article:last-child {
    border-bottom: 0;
}

.customer-note-list article.is-archived {
    opacity: .72;
    background: #faf9f8;
}

.customer-note-list article > div,
.customer-note-list footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.customer-note-list strong {
    color: #1a1c1c;
    font-size: 11px;
}

.customer-note-list span,
.customer-note-list small {
    color: #605e5c;
    font-size: 10px;
}

.customer-note-list p {
    margin: 0;
    color: #414750;
    font-size: 10px;
    line-height: 1.3;
}

.customer-note-list .row-actions.compact {
    gap: 4px;
}

.customer-note-list .row-actions button {
    min-width: auto;
    min-height: 20px;
    padding: 0 6px;
    font-size: 10px;
}

.customer-note-state {
    min-height: 64px;
    padding: 8px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    color: #605e5c;
    text-align: center;
}

.customer-note-state .material-symbols-outlined {
    font-size: 18px;
}

.customer-note-state strong {
    color: #1a1c1c;
    font-size: 11px;
}

.customer-note-state p {
    margin: 0;
    max-width: 420px;
    font-size: 10px;
}

.customer-activity-filter-row {
    min-height: 28px;
    padding: 4px 8px;
    display: grid;
    grid-template-columns: minmax(140px, 180px) minmax(180px, 1fr);
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-activity-filter-row label {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}

.customer-activity-filter-row span {
    color: #605e5c;
    font-size: 10px;
}

.customer-activity-filter-row select,
.customer-activity-filter-row input {
    min-width: 0;
    width: 100%;
    height: 20px;
    min-height: 20px;
    padding: 0 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
}

.customer-activity-timeline {
    position: relative;
    display: grid;
    gap: 16px;
    padding: 12px;
}

.customer-activity-timeline::before {
    content: "";
    position: absolute;
    top: 16px;
    bottom: 16px;
    left: 22px;
    width: 1px;
    background: #c1c7d2;
}

.customer-activity-timeline article {
    position: relative;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 12px;
}

.customer-activity-timeline article > .material-symbols-outlined {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    z-index: 1;
    border: 1px solid #edebe9;
    border-radius: 50%;
    background: #fff;
    font-size: 12px;
}

.customer-activity-timeline .call {
    color: #005a9e;
    background: #eef5ff;
}

.customer-activity-timeline .mail {
    color: #107c10;
    background: #eef8ee;
}

.customer-activity-timeline .note {
    color: #605e5c;
    background: #e3e2e1;
}

.customer-activity-timeline header {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.customer-activity-timeline strong {
    color: #1a1c1c;
    font-size: 12px;
}

.customer-activity-timeline time,
.customer-activity-timeline small {
    color: #605e5c;
    font-size: 10px;
}

.customer-activity-timeline p {
    margin: 2px 0 0;
    color: #414750;
    font-size: 11px;
    line-height: 1.4;
}

.customer-detail-status {
    height: 24px;
    min-height: 24px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #c1c7d2;
    background: #fff;
    color: #605e5c;
    font-size: 10px;
}

.customer-detail-status div {
    display: flex;
    align-items: center;
    gap: 16px;
}

.customer-detail-status i {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    background: #107c10;
}

.customer-detail-status .is-offline i {
    background: #d83b01;
}

.customer-activity-state {
    min-height: 96px;
    padding: 16px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 4px;
    color: #605e5c;
    text-align: center;
}

.customer-activity-state .material-symbols-outlined {
    font-size: 18px;
}

.customer-activity-state strong {
    color: #1a1c1c;
    font-size: 12px;
}

.customer-activity-state p {
    margin: 0;
    max-width: 440px;
    font-size: 11px;
}

.customer-document-browser {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    overflow-y: auto;
    border: 0;
    border-radius: 0;
    background: #fff;
}

.customer-document-path {
    position: sticky;
    top: 0;
    z-index: 1;
    min-height: 24px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    color: #605e5c;
    font-size: 10px;
    font-weight: 400;
}

.customer-document-path .material-symbols-outlined {
    font-size: 14px;
}

.customer-document-path-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-folder-back {
    width: 18px;
    height: 18px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #605e5c;
}

.customer-document-folder-back:disabled {
    color: #a19f9d;
}

.customer-document-breadcrumbs {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
}

.customer-document-breadcrumbs span,
.customer-document-breadcrumbs button {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    font: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-breadcrumbs button {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.customer-document-breadcrumbs span + span::before,
.customer-document-breadcrumbs button + span::before,
.customer-document-breadcrumbs span + button::before,
.customer-document-breadcrumbs button + button::before {
    content: "/";
    margin-right: 4px;
    color: #8a8886;
}

.customer-document-path-main > small {
    color: #8a8886;
    font-size: 10px;
}

.customer-document-path-filter {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.customer-document-path-filter span {
    color: #605e5c;
    font-size: 10px;
}

.customer-document-path-filter select {
    height: 20px;
    min-height: 20px;
    padding: 0 18px 0 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
}

.customer-document-row {
    min-height: 24px;
    padding: 0 12px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #c1c7d2;
}

.customer-document-row.folder-row {
    grid-template-columns: 18px minmax(0, 1fr) auto auto;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

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

.customer-document-row:hover {
    background: #f4f3f2;
}

.customer-document-row.is-archived {
    background: #faf9f8;
}

.customer-document-row strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-row small {
    color: #605e5c;
    font-size: 10px;
    white-space: nowrap;
}

.customer-document-row small.customer-document-meta,
.document-meta-line {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.customer-document-row small.customer-document-meta {
    max-width: 245px;
}

.customer-document-meta > span:first-child,
.document-meta-line > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-row .material-symbols-outlined {
    font-size: 16px;
}

.customer-document-row .folder-icon {
    color: #b97800;
}

.customer-document-row .folder-open-icon {
    color: #605e5c;
    font-size: 14px;
}

.customer-document-folder-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 3px;
}

.customer-document-folder-actions button {
    width: 22px;
    min-height: 22px;
    display: grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #605e5c;
}

.customer-document-folder-actions button:hover {
    border-color: #c1c7d2;
    background: #fff;
    color: #005a9e;
}

.document-system-folder-marker {
    width: 22px;
    min-width: 22px;
    min-height: 22px;
    display: inline-grid;
    place-items: center;
    color: #605e5c;
}

.document-system-folder-marker .material-symbols-outlined {
    font-size: 16px;
}

.customer-document-row .pdf-icon {
    color: #ba1a1a;
}

.customer-document-row .doc-icon {
    color: #005a9e;
}

.customer-document-row .file-icon {
    color: #605e5c;
}

.customer-document-actions {
    display: flex;
    align-items: center;
    gap: 2px;
}

.customer-document-actions button,
.customer-document-actions a {
    width: 22px;
    min-height: 22px;
    display: grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #605e5c;
    text-decoration: none;
}

.customer-document-actions button:hover,
.customer-document-actions a:hover {
    border-color: #c1c7d2;
    background: #fff;
    color: #005a9e;
}

.customer-document-state {
    min-height: 72px;
    padding: 8px;
    display: grid;
    place-items: center;
    gap: 2px;
    color: #605e5c;
    text-align: center;
}

.customer-document-state .material-symbols-outlined {
    font-size: 18px;
}

.customer-document-state strong {
    color: #1a1c1c;
    font-size: 11px;
}

.customer-document-state p,
.customer-document-preview-note {
    margin: 0;
    color: #605e5c;
    font-size: 10px;
}

.customer-document-preview-note {
    min-height: 24px;
    padding: 4px 8px;
    border-top: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-document-upload-form {
    padding: 6px 8px;
    display: grid;
    gap: 6px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-document-upload-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 8px;
}

.customer-document-upload-grid label {
    display: grid;
    gap: 2px;
    color: #605e5c;
    font-size: 10px;
}

.customer-document-upload-grid input {
    min-height: 24px;
    padding: 0 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.customer-document-upload-grid select {
    min-height: 24px;
    padding: 0 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.customer-document-upload-file {
    grid-column: 1 / -1;
}

.customer-document-upload-actions {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
}

.customer-document-upload-actions button {
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
}

.customer-document-upload-actions .primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.customer-document-upload-modal.customer-document-upload-form {
    padding: 0;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
}

.customer-document-upload-modal .customer-document-upload-grid {
    gap: 8px 10px;
}

.customer-document-upload-modal .customer-document-upload-grid input {
    min-height: 30px;
    font-size: 12px;
}

.customer-document-upload-modal .customer-document-upload-actions {
    min-height: 52px;
    margin: 0;
    padding: 0 16px;
    gap: 8px;
    border-top: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-document-folder-create-panel,
.customer-document-folder-apply-panel,
.customer-document-folder-rename-panel,
.customer-document-folder-copy-panel,
.customer-document-folder-archive-panel,
.customer-document-folder-restore-panel {
    min-height: 36px;
    padding: 6px 8px;
    display: grid;
    grid-template-columns: minmax(170px, 1fr) minmax(150px, auto) auto;
    align-items: end;
    gap: 6px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-document-folder-create-panel label,
.customer-document-folder-apply-panel label,
.customer-document-folder-rename-panel label,
.customer-document-folder-copy-panel label,
.customer-document-folder-archive-panel label,
.customer-document-folder-restore-panel label,
.customer-document-folder-create-parent,
.customer-document-folder-apply-parent,
.customer-document-folder-rename-parent,
.customer-document-folder-copy-parent,
.customer-document-folder-archive-parent,
.customer-document-folder-restore-parent {
    min-width: 0;
    display: grid;
    gap: 3px;
    color: #605e5c;
    font-size: 10px;
    font-weight: 700;
}

.customer-document-folder-create-panel input,
.customer-document-folder-apply-panel input,
.customer-document-folder-rename-panel input,
.customer-document-folder-copy-panel input,
.customer-document-folder-archive-panel input,
.customer-document-folder-restore-panel input {
    min-height: 24px;
    padding: 0 7px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.customer-document-folder-create-parent strong,
.customer-document-folder-apply-parent strong,
.customer-document-folder-rename-parent strong,
.customer-document-folder-copy-parent strong,
.customer-document-folder-archive-parent strong,
.customer-document-folder-restore-parent strong {
    min-height: 24px;
    padding: 0 7px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-folder-create-actions,
.customer-document-folder-apply-actions,
.customer-document-folder-rename-actions,
.customer-document-folder-copy-actions,
.customer-document-folder-archive-actions,
.customer-document-folder-restore-actions {
    display: inline-flex;
    justify-content: flex-end;
    gap: 4px;
}

.customer-document-folder-create-actions button,
.customer-document-folder-apply-actions button,
.customer-document-folder-rename-actions button,
.customer-document-folder-copy-actions button,
.customer-document-folder-archive-actions button,
.customer-document-folder-restore-actions button {
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #323130;
    font-size: 10px;
    font-weight: 700;
}

.customer-document-folder-create-actions .primary,
.customer-document-folder-apply-actions .primary,
.customer-document-folder-rename-actions .primary,
.customer-document-folder-copy-actions .primary,
.customer-document-folder-restore-actions .primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.customer-document-folder-archive-actions .danger {
    border-color: var(--danger);
    background: var(--danger);
    color: #fff;
}

.customer-document-folder-create-actions button:disabled,
.customer-document-folder-apply-actions button:disabled,
.customer-document-folder-rename-actions button:disabled,
.customer-document-folder-copy-actions button:disabled,
.customer-document-folder-archive-actions button:disabled,
.customer-document-folder-restore-actions button:disabled {
    opacity: .62;
    cursor: not-allowed;
}

.customer-document-folder-create-errors,
.customer-document-folder-create-message,
.customer-document-folder-apply-errors,
.customer-document-folder-apply-message,
.customer-document-folder-rename-errors,
.customer-document-folder-rename-message,
.customer-document-folder-copy-errors,
.customer-document-folder-copy-message,
.customer-document-folder-archive-errors,
.customer-document-folder-archive-message,
.customer-document-folder-restore-errors,
.customer-document-folder-restore-message {
    min-height: 26px;
    padding: 5px 8px;
    display: grid;
    align-items: center;
    gap: 2px;
    border-bottom: 1px solid #c1c7d2;
    font-size: 11px;
}

.customer-document-folder-create-errors,
.customer-document-folder-apply-errors,
.customer-document-folder-rename-errors,
.customer-document-folder-copy-errors,
.customer-document-folder-archive-errors,
.customer-document-folder-restore-errors {
    background: #fff1f0;
    color: #7a1d1d;
}

.customer-document-folder-create-message,
.customer-document-folder-apply-message,
.customer-document-folder-rename-message,
.customer-document-folder-copy-message,
.customer-document-folder-archive-message,
.customer-document-folder-restore-message {
    background: #f0fbf4;
    color: #14532d;
}

.customer-document-revisions-panel {
    border-top: 1px solid #c1c7d2;
    background: #fff;
}

.customer-document-revision-head {
    min-height: 28px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.customer-document-revision-head > div:first-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.customer-document-revision-head strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-revision-head span {
    overflow: hidden;
    color: #605e5c;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-revision-actions {
    display: flex;
    align-items: center;
    gap: 2px;
}

.customer-document-revision-actions button,
.customer-document-revision-actions a {
    width: 22px;
    min-height: 22px;
    display: grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #605e5c;
    text-decoration: none;
}

.customer-document-revision-actions button:hover,
.customer-document-revision-actions a:hover {
    border-color: #c1c7d2;
    background: #fff;
    color: #005a9e;
}

.customer-document-revision-actions .material-symbols-outlined {
    font-size: 16px;
}

.customer-document-revision-upload-form {
    padding: 6px 8px;
    display: grid;
    gap: 6px;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

.customer-document-revision-table {
    overflow-x: auto;
}

.customer-document-revision-table-head {
    min-width: 884px;
    min-height: 24px;
    padding: 0 8px;
    display: grid;
    grid-template-columns: 58px minmax(170px, 1fr) 74px 104px 132px 88px 112px 34px;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
    color: #605e5c;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.customer-document-revision-table-row {
    min-width: 884px;
    min-height: 24px;
    padding: 0 8px;
    display: grid;
    grid-template-columns: 58px minmax(170px, 1fr) 74px 104px 132px 88px 112px 34px;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    color: #1a1c1c;
    font-size: 10px;
}

.customer-document-revision-table-row:last-child {
    border-bottom: 0;
}

.customer-document-revision-table-row strong {
    color: #005a9e;
    font-family: Consolas, "JetBrains Mono", monospace;
    font-size: 11px;
    font-weight: 500;
}

.customer-document-revision-table-row span,
.customer-document-revision-table-row time {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-document-revision-table-row time {
    color: #605e5c;
}

.customer-document-revision-actions-cell {
    display: flex;
    justify-content: flex-end;
    gap: 2px;
}

.customer-document-revision-actions-cell a,
.customer-document-revision-actions-cell button {
    width: 22px;
    min-height: 22px;
    display: grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #605e5c;
    text-decoration: none;
    cursor: pointer;
    padding: 0;
}

.customer-document-revision-actions-cell a:hover,
.customer-document-revision-actions-cell button:hover {
    border-color: #c1c7d2;
    background: #fff;
    color: #005a9e;
}

.customer-document-revision-actions-cell .material-symbols-outlined {
    font-size: 16px;
}

.customer-project-state {
    min-height: 72px;
    padding: 8px;
    display: grid;
    place-items: center;
    gap: 2px;
    text-align: center;
}

.customer-project-state .material-symbols-outlined {
    color: #605e5c;
    font-size: 18px;
}

.customer-project-state strong {
    color: #1a1c1c;
    font-size: 11px;
}

.customer-master-table-wrap {
    padding: 8px;
    overflow-x: auto;
}

.customer-master-table {
    width: 100%;
    border-collapse: collapse;
    color: #1a1c1c;
    font-size: 12px;
    text-align: left;
}

.customer-master-table tr {
    height: 24px;
}

.customer-master-table tr:nth-child(even) {
    background: #f8f8f8;
}

.customer-master-table th,
.customer-master-table td {
    padding: 3px 8px;
    border-top: 0;
    text-align: left;
    vertical-align: top;
}

.customer-master-table th {
    width: 132px;
    color: #605e5c;
    font-weight: 400;
}

.customer-master-table td {
    font-weight: 400;
}

.customer-master-table td strong {
    font-weight: 700;
}

.customer-master-table a.customer-inline-link {
    color: #005a9e;
    text-decoration: underline;
}

.customer-master-table a.customer-inline-link:hover {
    text-decoration: underline;
}

.customer-setting-list {
    display: grid;
    gap: 0;
    padding: 8px;
}

.customer-setting-list div {
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 8px;
    border: 0;
    border-bottom: 1px dashed #c1c7d2;
    border-radius: 0;
    background: transparent;
    font-size: 12px;
}

.customer-setting-list div:last-child {
    border-bottom: 0;
}

.customer-setting-list span {
    color: #605e5c;
}

.customer-setting-list strong {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #1a1c1c;
}

.customer-setting-list strong.text-primary {
    color: #005a9e;
}

.customer-setting-list .material-symbols-outlined {
    font-size: 14px;
    line-height: 1;
}

.customer-detail-contact-list {
    min-height: 0;
    flex: 1;
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 8px;
    overflow-y: auto;
}

.customer-detail-contact-list article {
    min-height: 76px;
    padding: 8px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 4px;
    border: 1px solid #edebe9;
    border-radius: 2px;
    background: #f4f3f2;
}

.customer-detail-contact-list article > div:first-child {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.customer-detail-contact-list strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

.customer-detail-contact-list span:not(.material-symbols-outlined) {
    padding: 1px 5px;
    border-radius: 2px;
    background: #e6e2df;
    color: #414750;
    font-size: 9px;
}

.customer-detail-contact-list article p {
    margin: 0;
    color: #605e5c;
    font-size: 10px;
}

.customer-detail-contact-list article .customer-contact-quick-links {
    display: flex;
    gap: 8px;
}

.customer-detail-contact-list .customer-contact-quick-links a,
.customer-detail-contact-list .customer-contact-quick-links button {
    width: auto;
    height: auto;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #005a9e;
}

.customer-detail-contact-list .customer-contact-quick-links a:hover,
.customer-detail-contact-list .customer-contact-quick-links button:hover {
    border-color: transparent;
    background: transparent;
    color: #005a9e;
}

.customer-detail-contact-list .material-symbols-outlined {
    font-size: 14px;
}

.customer-contact-state {
    min-height: 64px;
    padding: 8px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    color: #605e5c;
    text-align: center;
}

.customer-contact-state .material-symbols-outlined {
    font-size: 18px;
}

.customer-contact-state strong {
    color: #1a1c1c;
    font-size: 11px;
}

.customer-contact-state p {
    margin: 0;
    max-width: 360px;
    font-size: 10px;
}

.customer-contact-quick-links a,
.customer-contact-quick-links button {
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    border: 1px solid #edebe9;
    border-radius: 50%;
    background: #fff;
    color: #605e5c;
    cursor: pointer;
    text-decoration: none;
}

.customer-contact-quick-links a:hover,
.customer-contact-quick-links button:hover {
    border-color: #c1c7d2;
    background: #f4f3f2;
    color: #005a9e;
}

.customer-contact-quick-links .material-symbols-outlined {
    font-size: 14px;
}

.customer-contacts-panel {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.customer-contact-command-row {
    grid-template-columns: minmax(260px, 1fr) 140px auto;
}

.real-customer-contact-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
}

.customer-contact-list-card {
    min-height: 174px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
}

.customer-contact-list-card > div:first-child {
    display: grid;
    gap: 3px;
}

.customer-contact-list-card strong {
    font-size: 14px;
}

.customer-contact-list-card span,
.customer-contact-list-card small,
.customer-contact-list-card p {
    color: var(--muted);
    font-size: 12px;
}

.customer-contact-list-card p {
    min-height: 34px;
    margin: 0;
    line-height: 1.45;
}

.customer-contact-channels {
    display: grid;
    gap: 3px;
    padding-top: 8px;
    border-top: 1px solid var(--border-soft);
}

.row-actions button,
.row-actions a {
    min-width: 70px;
    padding: 0 8px;
}

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

.row-actions.compact {
    justify-content: flex-end;
}

.project-notes-panel {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.project-addresses-panel {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.project-suppliers-panel {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.project-orders-panel {
    border-top-color: var(--border-soft);
}

.notes-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.notes-title-group {
    display: inline-flex;
    align-items: flex-start;
    gap: 9px;
}

.notes-title-group h2 {
    margin-bottom: 2px;
    font-size: 20px;
    letter-spacing: 0;
}

.note-count {
    color: var(--muted);
    font-size: 13px;
}

.note-command-row {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 150px 150px 120px auto;
    align-items: end;
    gap: 10px;
    margin-bottom: 14px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fbfcfd;
}

.address-command-row {
    grid-template-columns: 140px auto;
}

.project-supplier-command-row {
    grid-template-columns: 140px auto;
}

.project-supplier-assignments-panel {
    display: grid;
    gap: 8px;
    padding-top: 0;
}

.project-supplier-assignments-panel > .notes-head {
    min-height: 48px;
    margin: 0;
    padding-bottom: 8px;
    align-items: center;
    gap: 12px;
    border-bottom: 0;
}

.project-supplier-assignments-panel .notes-title-group {
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.project-supplier-assignments-panel .notes-title-group .material-symbols-outlined {
    color: #005a9e;
    font-size: 18px;
}

.project-supplier-assignments-panel .notes-title-group h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
}

.project-supplier-assignments-panel .note-count {
    min-height: 20px;
    padding: 2px 8px;
    display: inline-flex;
    align-items: center;
    border-radius: 2px;
    background: #e3e2e1;
    color: #605e5c;
    font-size: 11px;
    font-weight: 500;
}

.project-supplier-assignments-panel > .notes-head .toolbar {
    gap: 8px;
}

.project-supplier-assignments-panel > .notes-head .toolbar button {
    height: 28px;
    min-height: 28px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
}

.project-supplier-assignments-panel > .notes-head .toolbar .primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.12);
}

.project-supplier-assignments-panel > .notes-head .toolbar .project-tool-button {
    border-color: #c7cdd4;
    background: #fff;
    color: #334155;
    box-shadow: none;
}

.project-supplier-assignments-panel > .notes-head .toolbar .material-symbols-outlined {
    font-size: 18px;
}

.project-supplier-assignments-panel .project-supplier-command-row {
    min-height: 38px;
    margin: 0;
    padding: 8px 12px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
}

.project-supplier-assignments-panel .project-supplier-command-row label {
    min-width: 140px;
    gap: 4px;
    color: #605e5c;
    font-size: 10px;
    font-weight: 700;
}

.project-supplier-assignments-panel .project-supplier-command-row select {
    min-height: 28px;
    padding: 0 8px;
    border-color: #c7cdd4;
    border-radius: 2px;
    color: #334155;
    font-size: 12px;
}

.project-supplier-assignments-panel .project-supplier-command-row button {
    height: 28px;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 4px;
    font-size: 12px;
}

.note-command-row label {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.note-command-row input,
.note-command-row select {
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 0 10px;
    background: #fff;
    color: var(--text);
}

.note-form-panel {
    background: #fbfcfe;
}

.project-supplier-assignments-panel > .note-form-panel {
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-color: #c1c7d2;
    border-radius: 4px;
    background: #faf9f8;
}

.project-supplier-assignments-panel > .note-form-panel .form-head {
    min-height: 32px;
    margin: 0;
    padding: 6px 8px;
    align-items: center;
    border-bottom: 1px solid #d7dce3;
    background: #f3f2f1;
}

.project-supplier-assignments-panel > .note-form-panel .form-head strong {
    margin: 0;
    color: #1a1c1c;
    font-size: 13px;
}

.project-supplier-assignments-panel > .note-form-panel .form-head span {
    color: #605e5c;
    font-size: 11px;
}

.project-supplier-assignments-panel > .note-form-panel .form-head button,
.project-supplier-assignments-panel > .note-form-panel .modal-actions button {
    min-height: 28px;
    border-radius: 4px;
    font-size: 12px;
}

.project-supplier-assignments-panel > .note-form-panel .form-head button {
    width: 28px;
}

.project-supplier-assignments-panel > .note-form-panel .form-grid {
    padding: 8px;
    gap: 8px;
}

.project-supplier-assignments-panel > .note-form-panel .form-grid label {
    gap: 4px;
    color: #605e5c;
    font-size: 11px;
}

.project-supplier-assignments-panel > .note-form-panel .form-grid input,
.project-supplier-assignments-panel > .note-form-panel .form-grid select,
.project-supplier-assignments-panel > .note-form-panel .form-grid textarea {
    min-height: 28px;
    padding: 0 8px;
    border-color: #c7cdd4;
    border-radius: 2px;
    color: #334155;
    font-size: 12px;
}

.project-supplier-assignments-panel > .note-form-panel .form-grid textarea {
    min-height: 76px;
    padding: 6px 8px;
}

.project-supplier-form-sections {
    display: grid;
    gap: 10px;
}

.project-supplier-form-section {
    display: grid;
    gap: 10px;
    padding: 10px;
    border: 1px solid #e2e7ee;
    border-radius: 4px;
    background: #fbfcfe;
}

.project-supplier-form-section h3 {
    margin: 0;
    color: #24313e;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
}

.project-supplier-form-section .form-grid.two {
    margin: 0;
    padding: 0;
}

.project-supplier-form-section .form-hint,
.project-supplier-form-section .form-error.compact {
    grid-column: 1 / -1;
    margin: 0;
}

.project-supplier-material-picker {
    display: grid;
    max-height: 180px;
    overflow: auto;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
}

.project-supplier-material-picker label {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 4px 8px;
    border-bottom: 1px solid #edf0f4;
    color: #24313e;
}

.project-supplier-material-picker label:last-child {
    border-bottom: 0;
}

.project-supplier-material-picker input[type="checkbox"] {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: #005a9e;
}

.project-supplier-material-picker span {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.project-supplier-material-picker strong,
.project-supplier-material-picker small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-supplier-material-picker strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
}

.project-supplier-material-picker small {
    color: #727782;
    font-size: 10px;
}

.project-supplier-material-picker em {
    color: #475569;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
}

.project-supplier-assignments-panel > .note-form-panel .form-hint,
.project-supplier-assignments-panel > .note-form-panel .form-error {
    margin: 0 8px;
    font-size: 12px;
}

.project-supplier-assignments-panel > .note-form-panel .modal-actions {
    min-height: 40px;
    margin: 0;
    padding: 6px 8px;
    align-items: center;
    justify-content: flex-end;
    border-top: 1px solid #d7dce3;
    background: #fff;
}

.project-supplier-assignments-panel > .empty-state {
    min-height: 132px;
    margin: 0;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
}

.address-table {
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: hidden;
}

.address-table-head,
.address-table-row {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(180px, .7fr) 180px 90px 180px;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 12px;
}

.address-table-head {
    background: #f3f5f8;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.address-table-row {
    border-top: 1px solid var(--border-soft);
}

.address-table-row > span,
.address-table-row > strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplier-relation-panel {
    margin: 8px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
}

.supplier-relation-panel .notes-head {
    min-height: 36px;
    margin: 0;
    padding: 4px 8px;
    align-items: center;
    border-bottom: 1px solid #c1c7d2;
    background: #f3f2f1;
}

.supplier-relation-panel .notes-title-group {
    align-items: center;
    gap: 7px;
}

.supplier-relation-panel .notes-title-group .material-symbols-outlined {
    color: #414750;
    font-size: 16px;
}

.supplier-relation-panel .notes-title-group h2 {
    margin: 0;
    color: #111;
    font-size: 14px;
    line-height: 1.2;
}

.supplier-relation-panel .note-count {
    color: #605e5c;
    font-size: 11px;
}

.supplier-relation-toolbar {
    gap: 6px;
}

.supplier-relation-primary,
.supplier-relation-button {
    height: 28px;
    min-height: 28px;
    padding: 0 10px;
    gap: 6px;
    border-radius: 2px;
    font-size: 12px;
}

.supplier-relation-primary .material-symbols-outlined,
.supplier-relation-button .material-symbols-outlined {
    font-size: 15px;
}

.supplier-relation-command-row {
    margin: 0;
    padding: 6px 8px;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #d0d5dd;
    border-radius: 0;
    background: #f8f8f8;
}

.supplier-address-command-row {
    grid-template-columns: 140px auto;
    justify-content: start;
}

.supplier-contact-command-row {
    grid-template-columns: minmax(240px, 1fr) 140px auto;
}

.supplier-relation-command-row label {
    gap: 3px;
    color: #605e5c;
    font-size: 10px;
    font-weight: 700;
}

.supplier-relation-command-row input,
.supplier-relation-command-row select {
    min-height: 28px;
    padding: 0 8px;
    border-color: #c7cdd4;
    border-radius: 2px;
    color: #334155;
    font-size: 11px;
}

.supplier-relation-form-panel {
    margin: 8px;
    padding: 8px;
    border-color: #c7cdd4;
    border-radius: 2px;
    background: #fff;
}

.supplier-relation-form-panel .form-head {
    min-height: 32px;
    margin: -8px -8px 8px;
    padding: 4px 8px;
    align-items: center;
    border-bottom: 1px solid #c1c7d2;
    background: #f3f2f1;
}

.supplier-relation-form-panel .form-head strong {
    margin-bottom: 0;
    font-size: 13px;
}

.supplier-relation-form-panel .form-head span {
    font-size: 11px;
}

.supplier-relation-form-panel .form-grid {
    gap: 8px;
}

.supplier-relation-form-panel .form-grid label {
    font-size: 11px;
}

.supplier-relation-form-panel .form-grid input,
.supplier-relation-form-panel .form-grid select,
.supplier-relation-form-panel .form-grid textarea {
    min-height: 28px;
    border-radius: 2px;
    font-size: 12px;
}

.supplier-relation-form-panel .form-head button,
.supplier-relation-form-panel .modal-actions button {
    min-height: 28px;
    border-radius: 2px;
    font-size: 12px;
}

.supplier-relation-form-panel .form-head button {
    width: 28px;
}

.supplier-relation-state {
    min-height: 118px;
    margin: 8px;
    gap: 4px;
    border-radius: 0;
    background: #fff;
}

.supplier-relation-state .material-symbols-outlined {
    font-size: 26px;
}

.supplier-relation-state strong {
    font-size: 13px;
}

.supplier-relation-state p {
    font-size: 11px;
}

.supplier-address-table {
    margin: 8px 8px 0;
    overflow-x: auto;
    border-color: #c1c7d2;
    border-radius: 0;
    background: #fff;
}

.supplier-address-table .supplier-address-table-head,
.supplier-address-table .supplier-address-table-row {
    min-width: 744px;
    grid-template-columns: minmax(220px, 1.3fr) minmax(140px, .8fr) minmax(160px, 1fr) 92px 132px;
    gap: 0;
    padding: 0;
}

.supplier-address-table .supplier-address-table-head {
    min-height: 32px;
    border-bottom: 1px solid #c7cdd4;
    background: #f3f2f1;
    color: #303844;
    font-size: 12px;
    font-weight: 700;
    text-transform: none;
}

.supplier-address-table .supplier-address-table-row {
    min-height: 28px;
    border-top: 0;
    border-bottom: 1px solid #cfd6df;
    background: #fff;
}

.supplier-address-table .supplier-address-table-row:nth-child(odd) {
    background: #f7f7f7;
}

.supplier-address-table .supplier-address-table-row:hover {
    background: #efeeed;
}

.supplier-address-table .supplier-address-table-head > span,
.supplier-address-table .supplier-address-table-row > * {
    min-height: 28px;
    padding: 2px 8px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border-right: 1px solid #c7cdd4;
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplier-address-table .supplier-address-table-head > span {
    min-height: 32px;
    padding: 4px 8px;
    font-weight: 700;
}

.supplier-address-table .supplier-address-table-head > span:last-child,
.supplier-address-table .supplier-address-table-row > *:last-child {
    border-right: 0;
}

.supplier-address-table .supplier-address-action-cell {
    justify-content: center;
    overflow: visible;
    padding: 2px 4px;
}

.supplier-address-row-actions summary {
    width: 28px;
    min-height: 24px;
    padding: 0;
    border-radius: 4px;
}

.supplier-address-row-actions .material-symbols-outlined {
    font-size: 16px;
}

.supplier-address-row-actions > div {
    min-width: 176px;
}

.supplier-address-row-actions.is-archived {
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.supplier-contact-list {
    margin: 8px;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 8px;
}

.supplier-contact-card {
    min-height: 138px;
    gap: 6px;
    padding: 8px;
    border-color: #c7cdd4;
    border-radius: 2px;
    box-shadow: none;
}

.supplier-contact-card > div:first-child {
    gap: 2px;
}

.supplier-contact-card strong {
    color: #111;
    font-size: 13px;
}

.supplier-contact-card span,
.supplier-contact-card small,
.supplier-contact-card p {
    color: #605e5c;
    font-size: 11px;
}

.supplier-contact-card p {
    min-height: 28px;
    line-height: 1.35;
}

.supplier-contact-card .customer-contact-channels {
    gap: 2px;
    padding-top: 6px;
    border-top-color: #d0d5dd;
}

.supplier-contact-card-actions {
    align-self: end;
    justify-self: end;
    color: #155eef;
}

.supplier-contact-card-actions summary {
    width: 28px;
    min-height: 24px;
    padding: 0;
    border-radius: 4px;
}

.supplier-contact-card-actions .material-symbols-outlined {
    font-size: 16px;
}

.supplier-contact-card-actions > div {
    min-width: 176px;
}

.supplier-contact-card-actions.is-archived {
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.supplier-overview-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.project-supplier-assignments-panel .project-supplier-overview {
    gap: 12px;
    margin-bottom: 0;
}

.project-supplier-metric {
    display: grid;
    gap: 5px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
}

.project-supplier-assignments-panel .project-supplier-metric {
    border-color: #dadada;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.06);
}

.project-supplier-metric span,
.project-supplier-metric small {
    color: var(--muted);
    font-size: 12px;
}

.project-supplier-assignments-panel .project-supplier-metric span {
    color: #7a8590;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.project-supplier-assignments-panel .project-supplier-metric small {
    color: #64717f;
    font-size: 12px;
}

.project-supplier-metric strong {
    color: var(--text);
    font-size: 22px;
}

.project-supplier-assignments-panel .project-supplier-metric strong {
    color: #22303a;
    font-size: 18px;
    line-height: 1.25;
}

.supplier-board {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
    gap: 12px;
}

.project-supplier-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.supplier-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(18, 30, 45, 0.04);
}

.project-supplier-card {
    padding: 14px;
    border-color: #dadada;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(20, 30, 45, 0.04);
}

.supplier-card-head,
.supplier-footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.supplier-card-head div,
.supplier-meta {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.supplier-card-head strong {
    color: var(--text);
    font-size: 15px;
}

.project-supplier-card .supplier-card-head strong {
    color: #24313e;
}

.supplier-card-head span,
.supplier-meta,
.supplier-footer span {
    color: var(--muted);
    font-size: 13px;
}

.project-supplier-card .supplier-card-head span,
.project-supplier-card .supplier-meta,
.project-supplier-card .supplier-footer span {
    color: #64717f;
}

.supplier-card mark {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #155eef;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.project-supplier-card mark {
    min-height: 0;
    padding: 3px 8px;
    background: #edf3ff;
    color: #345fae;
}

.supplier-material-list {
    display: grid;
    border: 1px solid var(--border-soft);
    border-radius: 7px;
    overflow: hidden;
}

.project-supplier-card .supplier-material-list {
    border-color: #e2e7ee;
    border-radius: 6px;
}

.supplier-material-list div {
    min-height: 36px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--border-soft);
    background: #fbfcfe;
}

.project-supplier-card .supplier-material-list div {
    border-bottom-color: #edf0f4;
}

.supplier-material-list div:last-child {
    border-bottom: 0;
}

.supplier-material-list span {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-supplier-card .supplier-material-list span {
    color: #24313e;
}

.supplier-footer strong {
    color: var(--text);
    white-space: nowrap;
}

.project-supplier-card .supplier-footer strong {
    color: #24313e;
}

.project-supplier-card .row-actions.compact {
    min-height: 28px;
    margin-top: -2px;
    gap: 6px;
}

.project-supplier-card .row-actions.compact button {
    min-height: 28px;
    padding: 0 10px;
    border-radius: 4px;
    font-size: 12px;
}

.project-supplier-card-actions {
    justify-self: end;
    color: #155eef;
}

.project-supplier-card-actions summary {
    width: 28px;
    min-height: 28px;
    padding: 0;
    border-radius: 4px;
}

.project-supplier-card-actions .material-symbols-outlined {
    font-size: 16px;
}

.project-supplier-card-actions > div {
    min-width: 188px;
}

.project-supplier-order-overview {
    display: grid;
    gap: 10px;
    margin-top: 12px;
    padding: 12px;
    border-color: #dadada;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(20, 30, 45, 0.04);
}

.project-supplier-order-overview .section-title-row {
    margin-bottom: 0;
}

.project-supplier-order-overview .overview-card-title {
    font-size: 16px;
}

.project-supplier-order-overview .supplier-order-table {
    border-color: #dadada;
    border-radius: 4px;
}

.project-supplier-order-overview .supplier-order-head,
.project-supplier-order-overview .supplier-order-row {
    min-width: 960px;
    grid-template-columns: 140px 250px 160px 130px 140px 130px;
}

.project-supplier-order-overview .supplier-order-head span,
.project-supplier-order-overview .supplier-order-row > * {
    min-height: 36px;
    padding: 8px 10px;
}

@media (max-width: 1180px) {
    .project-supplier-assignments-panel .project-supplier-overview,
    .project-supplier-assignments-panel .project-supplier-board,
    .project-supplier-assignments-panel > .note-form-panel .form-grid.two {
        grid-template-columns: 1fr;
    }
}

.procurement-overview-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.procurement-order-panel {
    display: grid;
    gap: 10px;
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: #fbfcfe;
}

.section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 2px;
}

.overview-card-title {
    margin: 0;
    color: var(--text);
    font-size: 18px;
    letter-spacing: 0;
}

.supplier-order-table {
    overflow-x: auto;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
}

.supplier-order-head,
.supplier-order-row {
    min-width: 960px;
    display: grid;
    grid-template-columns: 140px 250px 160px 130px 140px 130px;
    align-items: center;
}

.supplier-order-head {
    min-height: 44px;
    background: #eeeeef;
    color: #23303a;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.supplier-order-head span,
.supplier-order-row > * {
    min-height: 44px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    min-width: 0;
    border-right: 1px solid var(--border-soft);
}

.supplier-order-head span:last-child,
.supplier-order-row > *:last-child {
    border-right: 0;
}

.supplier-order-row {
    border-top: 1px solid var(--border-soft);
}

.supplier-order-row:nth-child(odd) {
    background: #fafafa;
}

.supplier-order-row strong,
.supplier-order-row span,
.supplier-order-row small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.supplier-order-row strong,
.supplier-order-row span {
    color: var(--text);
}

.supplier-order-row small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.supplier-order-row mark,
.supplier-card mark.is-draft,
.supplier-card mark.is-review,
.supplier-card mark.is-approved,
.supplier-card mark.is-archived {
    width: fit-content;
    min-height: 22px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.supplier-order-row mark.is-draft,
.supplier-card mark.is-draft {
    background: #eef2f6;
    color: #5d6673;
}

.supplier-order-row mark.is-review,
.supplier-card mark.is-review {
    background: #fff4de;
    color: #946200;
}

.supplier-order-row mark.is-approved,
.supplier-card mark.is-approved {
    background: #ecfdf3;
    color: #067647;
}

.supplier-order-row mark.is-archived,
.supplier-card mark.is-archived {
    background: #fef3f2;
    color: var(--danger);
}

.appointment-table-row mark {
    width: fit-content;
    min-height: 22px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.appointment-table-row mark.is-draft {
    background: #eef2f6;
    color: #5d6673;
}

.appointment-table-row mark.is-review {
    background: #fff4de;
    color: #946200;
}

.appointment-table-row mark.is-approved {
    background: #ecfdf3;
    color: #067647;
}

.appointment-table-row mark.is-archived {
    background: #fef3f2;
    color: var(--danger);
}

.procurement-command-row {
    grid-template-columns: minmax(260px, 1fr) 160px 130px auto;
}

.procurement-award-row {
    grid-template-columns: minmax(260px, 1fr);
}

.order-status-row {
    grid-template-columns: auto auto auto auto minmax(240px, 1fr) auto;
}

.procurement-request-table .supplier-order-head,
.procurement-request-table .supplier-order-row {
    min-width: 1140px;
    grid-template-columns: minmax(190px, 1fr) 130px 120px 180px 130px 130px 260px;
}

.order-request-table .supplier-order-head,
.order-request-table .supplier-order-row {
    min-width: 1180px;
    grid-template-columns: minmax(170px, 1fr) minmax(180px, 1fr) 145px 115px 120px 130px 260px;
}

.procurement-item-table .supplier-order-head,
.procurement-item-table .supplier-order-row {
    min-width: 900px;
    grid-template-columns: minmax(220px, 1fr) minmax(210px, .8fr) 130px 120px 230px;
}

.order-item-table .supplier-order-head,
.order-item-table .supplier-order-row {
    min-width: 980px;
    grid-template-columns: minmax(220px, 1fr) 120px 130px 130px 130px 220px;
}

.project-invoices-panel {
    border-top-color: var(--border-soft);
}

.invoice-detail-status-route {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    border: 1px solid var(--border-soft);
    background: #fff;
    margin: 0 0 14px;
}

.invoice-detail-status-route div {
    min-height: 74px;
    display: grid;
    gap: 4px;
    align-content: center;
    padding: 10px 12px;
    border-left: 4px solid var(--border-soft);
    border-right: 1px solid var(--border-soft);
}

.invoice-detail-status-route div:last-child {
    border-right: 0;
}

.invoice-detail-status-route div.ready {
    border-left-color: #1f7a4d;
}

.invoice-detail-status-route div.pending {
    border-left-color: #0b62a3;
}

.invoice-detail-status-route div.blocked {
    border-left-color: #c23b3b;
}

.invoice-detail-status-route span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.invoice-detail-status-route strong {
    color: var(--text);
    font-size: 15px;
}

.invoice-detail-status-route small {
    color: var(--muted);
    font-size: 12px;
}

.invoice-export-dms-route {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border: 1px solid var(--border-soft);
    background: #fff;
    margin: 0 0 12px;
}

.invoice-export-dms-route div {
    min-height: 68px;
    display: grid;
    gap: 4px;
    align-content: center;
    padding: 9px 12px;
    border-left: 4px solid var(--border-soft);
    border-right: 1px solid var(--border-soft);
}

.invoice-export-dms-route div:last-child {
    border-right: 0;
}

.invoice-export-dms-route div.ready {
    border-left-color: #1f7a4d;
}

.invoice-export-dms-route div.pending {
    border-left-color: #0b62a3;
}

.invoice-export-dms-route div.blocked {
    border-left-color: #c23b3b;
}

.invoice-export-dms-route span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.invoice-export-dms-route strong {
    color: var(--text);
    font-size: 15px;
}

.invoice-export-dms-route small {
    color: var(--muted);
    font-size: 12px;
}

.invoice-table .supplier-order-head,
.invoice-table .supplier-order-row {
    min-width: 1180px;
    grid-template-columns: minmax(170px, 1fr) minmax(190px, 1fr) 140px 110px 110px 140px 260px;
}

.invoice-item-table .supplier-order-head,
.invoice-item-table .supplier-order-row {
    min-width: 1060px;
    grid-template-columns: minmax(220px, 1fr) 120px 130px 130px 120px 130px 220px;
}

.invoice-export-panel .appointment-table-head,
.invoice-export-panel .appointment-table-row {
    grid-template-columns: minmax(260px, 1fr) 180px 160px 180px;
}

.invoice-payment-panel .appointment-table-head,
.invoice-payment-panel .appointment-table-row {
    grid-template-columns: 120px 140px minmax(220px, 1fr) 140px 260px;
}

.invoice-correction-panel .appointment-table-head,
.invoice-correction-panel .appointment-table-row {
    min-width: 1080px;
    grid-template-columns: minmax(210px, 1fr) 150px 130px minmax(260px, 1.2fr) 190px 150px;
}

.invoice-allocation-summary {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.invoice-allocation-summary article {
    min-height: 58px;
    display: grid;
    gap: 3px;
    align-content: center;
    border: 1px solid var(--border-soft);
    border-radius: 7px;
    padding: 8px 10px;
    background: #fff;
}

.invoice-allocation-summary span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.invoice-allocation-summary strong {
    font-size: 18px;
}

.invoice-allocation-line-table {
    grid-column: 1 / -1;
    background: #fff;
}

.invoice-allocation-line-table .appointment-table-head,
.invoice-allocation-line-table .appointment-table-row {
    min-width: 760px;
    grid-template-columns: minmax(260px, 1fr) 120px 140px 56px;
}

.invoice-allocation-line-table select,
.invoice-allocation-line-table input {
    width: 100%;
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 0 9px;
    background: #fff;
    color: var(--text);
}

.invoice-allocation-line-table button {
    width: 32px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    color: var(--text);
}

.invoice-einvoice-source-table .appointment-table-head,
.invoice-einvoice-source-table .appointment-table-row {
    grid-template-columns: 170px 130px minmax(260px, 1fr);
}

.einvoice-artifact-section {
    margin-top: 14px;
}

.invoice-einvoice-artifact-table .appointment-table-head,
.invoice-einvoice-artifact-table .appointment-table-row {
    min-width: 1040px;
    grid-template-columns: minmax(260px, 1fr) 170px 150px 210px 190px;
}

.invoice-einvoice-artifact-table small {
    display: block;
    color: var(--muted);
    margin-top: 4px;
}

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

.einvoice-issue {
    padding: 10px 12px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: #fff;
}

.einvoice-issue span {
    display: inline-flex;
    margin-bottom: 6px;
    font-size: .75rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--muted);
}

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

.einvoice-issue.is-blocker {
    border-color: #f5b5ae;
}

.einvoice-issue.is-warning {
    border-color: #f6d28d;
}

.procurement-supplier-board {
    margin-top: 4px;
}

.notes-board {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 14px;
}

.note-card {
    min-height: 184px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.08);
}

.note-card.is-pinned {
    border-left: 4px solid var(--danger);
}

.note-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.note-card-title-group {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.note-card-labels {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

.note-card-title {
    color: var(--text);
    font-size: 14px;
    line-height: 18px;
}

.note-card-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.note-card-actions button {
    width: 28px;
    min-width: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: var(--muted);
}

.note-card-actions button:hover {
    border-color: #cddbf7;
    background: #edf3ff;
    color: var(--primary);
}

.note-card-preview {
    max-height: 50px;
    margin: 0;
    overflow: hidden;
    color: #4e5964;
    font-size: 13px;
    line-height: 1.45;
}

.note-tag,
.note-priority-chip {
    width: fit-content;
    min-height: 20px;
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.35;
}

.note-tag {
    background: #edf3ff;
    color: #345fae;
}

.note-tag.muted {
    background: #eef2f6;
    color: #5d6673;
}

.note-priority-chip {
    background: #fff4de;
    color: #946200;
}

.note-card-footer {
    margin-top: auto;
    padding-top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-top: 1px solid var(--border-soft);
    color: var(--muted);
    font-size: 12px;
}

.note-card-author {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.note-avatar {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 4px;
    background: #e8eef7;
    color: var(--primary);
    font-size: 10px;
    font-weight: 800;
}

.notes-empty {
    min-height: 180px;
}

.project-body .project-notes-checklists-panel {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0 !important;
    overflow: hidden;
    background: #faf9f8;
}

.project-body .project-notes-checklists-panel.project-checklist-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.notes-checklists-head {
    min-height: 52px;
    padding: 8px;
    display: grid;
    grid-template-columns: minmax(200px, 1fr) auto;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #ffffff;
}

.notes-checklists-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.notes-checklists-heading > .material-symbols-outlined {
    color: #005a9e;
    font-size: 20px;
}

.notes-checklists-heading h2,
.notes-checklists-heading p {
    margin: 0;
    letter-spacing: 0;
}

.notes-checklists-heading h2 {
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
}

.notes-checklists-heading p {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.notes-checklists-actions {
    position: relative;
    z-index: 32;
    display: inline-flex;
    justify-content: flex-end;
}

.notes-checklists-actions > button {
    height: 30px;
    min-height: 30px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #005a9e;
    border-radius: 4px;
    background: #005a9e;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
}

.notes-checklists-actions > button:disabled {
    border-color: #c1c7d2;
    background: #efeeed;
    color: #727782;
}

.notes-checklists-actions .material-symbols-outlined {
    font-size: 15px;
}

.notes-checklists-actions .notes-checklists-add-chevron {
    margin-left: 2px;
    font-size: 16px;
}

.notes-checklists-add-menu {
    width: 236px;
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 34;
    padding: 4px;
    display: grid;
    gap: 2px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(26, 28, 28, 0.18);
}

.notes-checklists-add-menu > button {
    min-height: 48px;
    padding: 7px 8px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #1a1c1c;
    text-align: left;
}

.notes-checklists-add-menu > button:hover,
.notes-checklists-add-menu > button:focus-visible {
    background: #efeeed;
    color: #005a9e;
}

.notes-checklists-add-menu > button > span:last-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.notes-checklists-add-menu strong,
.notes-checklists-add-menu small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.notes-checklists-add-menu strong {
    font-size: 12px;
    line-height: 16px;
}

.notes-checklists-add-menu small {
    color: #727782;
    font-size: 10px;
    line-height: 14px;
}

.notes-checklists-add-backdrop {
    position: fixed;
    inset: 0;
    z-index: 31;
    padding: 0;
    border: 0;
    background: transparent;
}

.notes-checklists-workspace {
    min-height: 0;
    padding: 8px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    align-content: start;
    gap: 8px;
    overflow: auto;
    background: #faf9f8;
}

.notes-checklists-pane {
    display: contents;
}

@media (max-width: 1180px) {
    .notes-checklists-head {
        grid-template-columns: minmax(170px, 1fr) auto;
    }

    .notes-checklists-actions {
        grid-column: 2;
    }

    .notes-checklists-workspace {
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }
}

.project-body .project-notes-panel.notes-panel {
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
}

.project-body .project-notes-panel.notes-panel > .content-head.notes-head {
    min-height: 48px;
    margin: 0 0 8px;
    padding: 0 0 8px;
    align-items: center;
    gap: 12px;
    border-bottom: 0;
}

.project-body .project-notes-panel .notes-title-group {
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.project-body .project-notes-panel .notes-title-group > .material-symbols-outlined {
    color: #005a9e;
    font-size: 18px;
}

.project-body .project-notes-panel .notes-head h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
}

.project-body .project-notes-panel .notes-head .note-count {
    min-height: 20px;
    padding: 2px 8px;
    display: inline-flex;
    align-items: center;
    border-radius: 2px;
    background: #e3e2e1;
    color: #605e5c;
    font-size: 11px;
    font-weight: 500;
}

.project-body .project-notes-panel .notes-head .toolbar button {
    height: 28px;
    min-height: 28px;
    padding: 0 12px;
    border-color: #005a9e;
    border-radius: 4px;
    background: #005a9e;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.12);
}

.project-body .project-notes-panel .notes-workbench {
    min-height: 0;
    padding: 8px;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 8px;
    overflow: hidden;
}

.project-body .project-notes-panel .note-command-row {
    margin: 0;
    padding: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #faf9f8;
    box-shadow: none;
}

.project-body .project-notes-panel .note-command-row label {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
}

.project-body .project-notes-panel .note-search-field {
    position: relative;
    flex: 1 1 240px;
    min-width: 240px;
}

.project-body .project-notes-panel .note-search-field::before {
    content: "search";
    position: absolute;
    left: 8px;
    top: 50%;
    z-index: 1;
    color: #727782;
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: normal;
    line-height: 1;
    transform: translateY(-50%);
}

.project-body .project-notes-panel .note-command-row input,
.project-body .project-notes-panel .note-command-row select {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
}

.project-body .project-notes-panel .note-search-field input {
    width: 100%;
    padding-left: 30px;
}

.project-body .project-notes-panel .notes-board {
    min-height: 0;
    overflow: auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 16px;
    align-items: stretch;
    padding-right: 2px;
}

.project-body .project-notes-panel .note-card {
    min-height: 184px;
    position: relative;
    padding: 12px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #faf9f8;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.08);
    cursor: pointer;
    transition: border-color 150ms ease, background-color 150ms ease;
}

.project-body .project-notes-panel .note-card.is-pinned {
    border-left: 4px solid #ba1a1a;
    border-color: #c1c7d2;
    background: #faf9f8;
}

.project-body .project-notes-panel .note-card:hover {
    border-color: #005a9e;
    background: #fff;
}

.project-body .project-notes-panel .note-card-open-layer {
    position: absolute;
    inset: 0;
    z-index: 1;
    padding: 0;
    border: 0;
    background: transparent;
    color: transparent;
    cursor: pointer;
}

.project-body .project-notes-panel .note-card-head,
.project-body .project-notes-panel .note-card-preview,
.project-body .project-notes-panel .note-card-footer {
    position: relative;
    z-index: 2;
}

.project-body .project-notes-panel .note-card-title-group {
    gap: 8px;
}

.project-body .project-notes-panel .note-card-labels {
    gap: 4px;
}

.project-body .project-notes-panel .note-tag,
.project-body .project-notes-panel .note-priority-chip {
    min-height: 18px;
    padding: 2px 6px;
    border-radius: 2px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 12px;
    text-transform: uppercase;
}

.project-body .project-notes-panel .note-tag {
    background: rgba(0, 90, 158, 0.1);
    color: #005a9e;
}

.project-body .project-notes-panel .note-tag.muted {
    background: rgba(0, 66, 121, 0.08);
    color: #004279;
}

.project-body .project-notes-panel .note-priority-chip.is-normal {
    background: #e6e2df;
    color: #666462;
}

.project-body .project-notes-panel .note-priority-chip.is-high {
    background: rgba(186, 26, 26, 0.1);
    color: #ba1a1a;
}

.project-body .project-notes-panel .note-card-title {
    color: #1a1c1c;
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
}

.project-body .project-notes-panel .note-card-actions {
    z-index: 4;
    gap: 4px;
    opacity: 0;
    transition: opacity 150ms ease;
}

.project-body .project-notes-panel .note-card:hover .note-card-actions,
.project-body .project-notes-panel .note-card:focus-within .note-card-actions {
    opacity: 1;
}

.project-body .project-notes-panel .note-card-actions button {
    width: 22px;
    height: 22px;
    min-height: 22px;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #727782;
}

.project-body .project-notes-panel .note-card-actions button:hover {
    background: #efeeed;
    color: #005a9e;
}

.project-body .project-notes-panel .trash-button:hover {
    color: #ba1a1a;
}

.project-body .project-notes-panel .note-card-preview {
    max-height: 48px;
    color: #414750;
    font-size: 12px;
    line-height: 16px;
}

.project-body .project-notes-panel .note-card-footer {
    padding-top: 12px;
    border-top: 1px solid rgba(193, 199, 210, 0.55);
    color: #605e5c;
    font-size: 11px;
    line-height: 14px;
}

.project-body .project-notes-panel .note-avatar {
    border-radius: 2px;
    background: #e3e2e1;
    color: #005a9e;
    font-weight: 700;
}

.project-body .project-notes-panel .note-pin-indicator {
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 3;
    color: #ba1a1a;
    font-size: 16px;
    font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 20;
}

.note-modal .note-modal-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.note-modal .note-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.note-modal .note-form-grid .is-wide,
.note-modal .note-body-field {
    grid-column: 1 / -1;
}

.note-modal label {
    display: grid;
    gap: 6px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
}

.note-modal input,
.note-modal select,
.note-modal textarea {
    min-height: 30px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font: inherit;
    font-weight: 500;
}

.note-modal input:disabled,
.note-modal select:disabled,
.note-modal textarea:disabled {
    background: #f4f3f2;
    color: #414750;
    opacity: 1;
}

.note-modal .note-pin-toggle {
    min-height: 32px;
    padding: 7px 10px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    align-self: end;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fbfcfd;
}

.note-modal .note-pin-toggle input {
    width: auto;
    min-height: auto;
    padding: 0;
}

.note-modal .note-editor {
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.note-modal .note-editor-area {
    width: 100%;
    min-height: 170px;
    padding: 12px;
    border: 0;
    outline: 0;
    resize: vertical;
    color: #33404b;
    line-height: 1.45;
}

.note-modal .note-modal-error {
    margin: 12px 16px 0;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-activity-panel.project-detail-inline-module {
    padding: 8px !important;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    background: #efeeed;
    overflow: hidden;
}

.project-activity-panel {
    min-height: 0;
    height: 100%;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.project-activity-logbook-card {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-rows: 32px 29px 37px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.project-activity-panel .overview-card-title {
    height: 32px;
    margin: 0;
    padding: 0 4px 0 8px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) 24px;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #efeeed;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.project-activity-panel .overview-card-title small {
    min-width: 0;
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-activity-close {
    width: 24px;
    min-height: 24px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #414750;
}

.project-activity-close .material-symbols-outlined {
    font-size: 16px;
}

.project-activity-panel .activity-filter-line {
    min-height: 29px;
    margin: 0;
    padding: 4px 8px;
    display: flex;
    gap: 4px;
    overflow-x: auto;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-activity-panel .activity-filter-line button {
    min-height: 20px;
    padding: 0 8px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #414750;
    font-size: 9px;
    font-weight: 600;
    white-space: nowrap;
}

.project-activity-panel .activity-filter-line button.active,
.project-activity-panel .activity-filter-line button:hover {
    background: #005a9e;
    color: #fff;
}

.project-activity-search-line {
    min-height: 37px;
    padding: 5px 8px;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    align-items: center;
    gap: 6px;
    border-bottom: 1px solid #d4d8e0;
    background: #fff;
}

.project-activity-search {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 6px;
    color: #727782;
    font-size: 10px;
    font-weight: 700;
}

.project-activity-search input {
    width: 100%;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f8f8f8;
    color: #1a1c1c;
    font-size: 11px;
}

.project-activity-search-line .project-tool-button {
    min-height: 24px;
    padding: 0 8px;
    border-radius: 2px;
    font-size: 11px;
}

.project-activity-search-line .project-tool-button .material-symbols-outlined {
    font-size: 15px;
}

.project-activity-panel .activity-timeline {
    min-height: 0;
    padding: 8px;
    display: grid;
    align-content: start;
    gap: 0;
    overflow-y: auto;
}

.project-activity-panel .activity-timeline article {
    position: relative;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 8px;
}

.project-activity-panel .activity-timeline article:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 28px;
    bottom: 0;
    left: 11px;
    width: 1px;
    background: rgba(193, 199, 210, 0.65);
}

.project-activity-panel .activity-timeline .avatar {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #d3e4ff;
    color: #005a9e;
    font-size: 10px;
    font-weight: 700;
}

.project-activity-panel .activity-timeline .avatar.system {
    background: #e3e2e1;
    color: #414750;
}

.project-activity-panel .activity-timeline .avatar.warning {
    background: #fff0e8;
    color: #d83b01;
}

.project-activity-panel .activity-timeline article > div {
    min-width: 0;
    padding-bottom: 14px;
}

.project-activity-panel .activity-timeline strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

.project-activity-panel .activity-timeline small {
    display: block;
    color: #727782;
    font-size: 9px;
    line-height: 12px;
}

.project-activity-panel .activity-timeline p {
    margin: 2px 0 0;
    color: #414750;
    font-size: 10px;
    line-height: 14px;
}

.project-activity-panel .activity-timeline mark {
    margin-top: 4px;
    padding: 2px 6px;
    border-radius: 2px;
    background: #ffdad6;
    color: #93000a;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.project-activity-panel .activity-timeline mark.done {
    background: #eef8ee;
    color: #107c10;
}

.project-activity-panel .activity-timeline mark.neutral {
    background: #e9e8e7;
    color: #414750;
}

.project-activity-state {
    margin: 8px;
    min-height: 160px;
    border: 1px dashed #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-image-gallery-panel.project-detail-inline-module {
    padding: 8px !important;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    align-content: stretch;
    background: #efeeed;
}

.project-image-upload-modal.project-document-create-modal {
    width: min(620px, calc(100vw - 32px));
    max-height: min(88vh, 760px);
}

.project-image-upload-modal .modal-head button .material-symbols-outlined {
    font-size: 18px;
}

.project-image-upload-body {
    gap: 16px !important;
}

.project-image-upload-file-field,
.project-image-category-heading label,
.project-image-category-create-row label {
    min-width: 0;
    display: grid;
    gap: 6px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.project-image-upload-file-field input[type="file"] {
    min-height: 36px;
    padding: 6px 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
}

.project-image-upload-file-field small {
    overflow: hidden;
    color: #605e5c;
    font-size: 10px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-image-upload-file-count {
    color: #1a1c1c;
    font-size: 11px;
    line-height: 16px;
}

.project-image-upload-file-list {
    max-height: 144px;
    display: grid;
    border: 1px solid #d6dae1;
    border-radius: 2px;
    background: #fff;
    overflow-y: auto;
}

.project-image-upload-file-list small {
    min-width: 0;
    min-height: 28px;
    padding: 5px 8px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid #e1e4e8;
}

.project-image-upload-file-list small:last-child {
    border-bottom: 0;
}

.project-image-upload-file-list small span:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-image-upload-file-list small span:last-child {
    color: #6b7078;
    font-variant-numeric: tabular-nums;
}

.project-image-upload-name-option {
    min-height: 48px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f8f9fb;
    color: #414750;
    cursor: pointer;
}

.project-image-upload-name-option input {
    width: 16px;
    height: 16px;
    margin: 2px 0 0;
    accent-color: #005a9e;
}

.project-image-upload-name-option > span {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-image-upload-name-option strong {
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
}

.project-image-upload-name-option small {
    color: #605e5c;
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
}

.project-image-category-manager {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.project-image-category-heading select,
.project-image-category-create-row input {
    width: 100%;
    min-height: 32px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
}

.project-image-category-create-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px;
    align-items: end;
    gap: 8px;
}

.project-image-category-icon-button {
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1px solid #8aa9ca;
    border-radius: 2px;
    background: #edf5ff;
    color: #005a9e;
}

.project-image-category-icon-button:hover:not(:disabled) {
    border-color: #005a9e;
    background: #dbeeff;
}

.project-image-category-icon-button.danger {
    width: 28px;
    height: 28px;
    min-height: 28px;
    border-color: transparent;
    background: transparent;
    color: #a4262c;
}

.project-image-category-icon-button.danger:hover:not(:disabled) {
    border-color: #edb8b8;
    background: #fff0f0;
}

.project-image-category-icon-button .material-symbols-outlined {
    font-size: 18px;
}

.project-image-category-state {
    min-height: 34px;
    padding: 7px 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-top: 1px solid #dde2ea;
    border-bottom: 1px solid #dde2ea;
    color: #605e5c;
    font-size: 11px;
}

.project-image-category-state .material-symbols-outlined {
    font-size: 16px;
}

.project-image-category-list {
    max-height: 154px;
    overflow: auto;
    border-top: 1px solid #c1c7d2;
}

.project-image-category-row {
    min-height: 36px;
    padding: 3px 4px 3px 10px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #dde2ea;
    color: #1a1c1c;
    font-size: 12px;
}

.project-image-category-row > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-image-category-confirm {
    padding: 10px;
    display: grid;
    gap: 10px;
    border: 1px solid #edb8b8;
    border-radius: 2px;
    background: #fff8f7;
    color: #6d1c21;
    font-size: 11px;
    line-height: 15px;
}

.project-image-category-confirm > div {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.project-image-category-confirm button {
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

.project-image-category-confirm button.danger {
    border-color: #a4262c;
    background: #a4262c;
    color: #fff;
}

.project-image-gallery-panel {
    display: grid;
    gap: 8px;
    margin-top: 0;
    padding-top: 0;
    overflow: auto;
    border-top: 0;
}

.project-image-gallery-panel.images-panel {
    min-height: 0;
    height: 100%;
}

.project-image-gallery-panel .images-head {
    min-height: 40px;
    margin: 0 0 8px;
    padding: 0 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 0;
}

.project-image-gallery-panel .images-title-group {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.project-image-gallery-panel .images-title-group > .material-symbols-outlined {
    color: #005a9e;
    font-size: 18px;
}

.project-image-gallery-panel .images-head h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
}

.project-image-gallery-panel .image-total-count {
    min-height: 20px;
    padding: 2px 8px;
    display: inline-flex;
    align-items: center;
    border-radius: 2px;
    background: #e3e2e1;
    color: #605e5c;
    font-size: 11px;
    font-weight: 500;
}

.project-image-gallery-panel .image-toolbar {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
}

.project-image-gallery-panel .image-toolbar button {
    height: 28px;
    min-height: 28px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 700;
}

.project-image-gallery-panel .image-toolbar button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.project-image-gallery-panel .image-toolbar button.image-export-button {
    border: 1px solid #8aa9ca;
    background: #fff;
    color: #005a9e;
}

.project-image-gallery-panel .image-toolbar button.image-export-button:hover:not(:disabled),
.project-image-gallery-panel .image-toolbar button.image-export-button:focus-visible,
.project-image-gallery-panel .project-image-export.open button.image-export-button {
    border-color: #005a9e;
    background: #edf5ff;
}

.project-image-gallery-panel .image-toolbar button.image-export-button .image-export-chevron {
    margin-left: -2px;
    font-size: 16px;
}

.project-image-gallery-panel .image-toolbar .material-symbols-outlined {
    font-size: 18px;
}

.project-image-gallery-panel .project-image-category-filter {
    position: relative;
    display: inline-flex;
}

.project-image-gallery-panel .project-image-export {
    position: relative;
    display: inline-flex;
}

.project-image-gallery-panel .project-image-category-filter.open,
.project-image-gallery-panel .project-image-export.open {
    z-index: 31;
}

.project-image-gallery-panel .image-toolbar button.image-category-filter-button {
    width: 28px;
    min-width: 28px;
    padding: 0;
    justify-content: center;
    border: 1px solid #8aa9ca;
    background: #fff;
    color: #414750;
}

.project-image-gallery-panel .image-toolbar button.image-category-filter-button:hover:not(:disabled),
.project-image-gallery-panel .image-toolbar button.image-category-filter-button:focus-visible,
.project-image-gallery-panel .image-toolbar button.image-category-filter-button.active {
    border-color: #005a9e;
    background: #edf5ff;
    color: #005a9e;
}

.project-image-gallery-panel .project-image-category-filter-backdrop,
.project-image-gallery-panel .project-image-export-backdrop {
    position: fixed;
    inset: 0;
    z-index: 30;
    background: transparent;
}

.project-image-gallery-panel .project-image-category-filter-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 31;
    width: 240px;
    max-height: 280px;
    padding: 4px;
    display: grid;
    gap: 1px;
    overflow-y: auto;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(31, 41, 55, .18);
}

.project-image-gallery-panel .project-image-export-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 31;
    width: 286px;
    padding: 4px;
    display: grid;
    gap: 1px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(31, 41, 55, .18);
}

.project-image-gallery-panel .image-toolbar .project-image-export-menu button {
    width: 100%;
    height: auto;
    min-height: 52px;
    padding: 8px 10px;
    align-items: flex-start;
    justify-content: flex-start;
    border: 0;
    background: transparent;
    color: #323b46;
    text-align: left;
}

.project-image-gallery-panel .image-toolbar .project-image-export-menu button:hover:not(:disabled),
.project-image-gallery-panel .image-toolbar .project-image-export-menu button:focus-visible {
    background: #edf5ff;
    color: #005a9e;
}

.project-image-gallery-panel .project-image-export-menu button > .material-symbols-outlined {
    flex: 0 0 auto;
    margin-top: 1px;
    color: #005a9e;
    font-size: 18px;
}

.project-image-gallery-panel .project-image-export-menu button > span:last-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-image-gallery-panel .project-image-export-menu strong {
    color: inherit;
    font-size: 12px;
    line-height: 16px;
}

.project-image-gallery-panel .project-image-export-menu small {
    color: #727782;
    font-size: 11px;
    font-weight: 400;
    line-height: 15px;
}

.project-image-gallery-panel .image-toolbar .project-image-category-filter-menu button {
    width: 100%;
    height: auto;
    min-height: 32px;
    padding: 6px 8px;
    justify-content: space-between;
    border: 0;
    background: transparent;
    color: #323b46;
    font-size: 12px;
    font-weight: 500;
    text-align: left;
}

.project-image-gallery-panel .image-toolbar .project-image-category-filter-menu button:hover,
.project-image-gallery-panel .image-toolbar .project-image-category-filter-menu button:focus-visible,
.project-image-gallery-panel .image-toolbar .project-image-category-filter-menu button.selected {
    background: #edf5ff;
    color: #005a9e;
}

.project-image-gallery-panel .project-image-category-filter-menu button > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-image-gallery-panel .project-image-category-filter-menu .material-symbols-outlined {
    flex: 0 0 auto;
    font-size: 16px;
}

.project-image-gallery-panel .project-image-category-filter-empty {
    padding: 8px;
    color: #727782;
    font-size: 11px;
}

.project-image-gallery-panel .project-image-category-filter-reset {
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #8aa9ca;
    border-radius: 2px;
    background: #fff;
    color: #005a9e;
    font-size: 12px;
    font-weight: 700;
}

.project-image-gallery-panel .project-image-category-filter-reset:hover,
.project-image-gallery-panel .project-image-category-filter-reset:focus-visible {
    border-color: #005a9e;
    background: #edf5ff;
}

.project-image-gallery-panel .image-selection-actions {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.project-image-gallery-panel .image-selection-count {
    margin-right: 4px;
    color: #414750;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.project-image-gallery-panel .image-toolbar button.image-selection-action {
    width: 28px;
    min-width: 28px;
    padding: 0;
    justify-content: center;
    border: 1px solid #8aa9ca;
    background: #fff;
    color: #005a9e;
}

.project-image-gallery-panel .image-toolbar button.image-selection-action:hover:not(:disabled),
.project-image-gallery-panel .image-toolbar button.image-selection-action:focus-visible {
    border-color: #005a9e;
    background: #edf5ff;
}

.project-image-gallery-panel .image-toolbar button.image-selection-action.danger {
    border-color: #d5a1a4;
    color: #a4262c;
}

.project-image-gallery-panel .image-toolbar button.image-selection-action.danger:hover:not(:disabled),
.project-image-gallery-panel .image-toolbar button.image-selection-action.danger:focus-visible {
    border-color: #a4262c;
    background: #fff0f0;
}

.project-image-selection-feedback {
    min-height: 28px;
    margin: 0 0 4px;
    padding: 5px 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    font-size: 11px;
}

.project-image-selection-feedback.success {
    border-color: #9bc89b;
    background: #f1fbf1;
    color: #107c10;
}

.project-image-gallery-panel .image-date-overview {
    min-height: 0;
    padding: 0;
    display: grid;
    align-content: start;
    gap: 32px;
    overflow: visible;
}

.project-image-gallery-panel .image-date-group {
    min-width: 0;
    display: grid;
    gap: 12px;
}

.project-image-gallery-panel .date-bar {
    min-height: 28px;
    padding: 0 0 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid rgba(193, 199, 210, .55);
    border-radius: 0;
    background: transparent;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

.project-image-gallery-panel .date-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #727782;
    font-size: 11px;
    font-weight: 400;
}

.project-image-gallery-panel .date-actions strong {
    color: #727782;
    font-size: 11px;
    font-weight: 400;
}

.project-image-gallery-panel .date-actions button {
    width: 24px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #727782;
    font-size: 0;
}

.project-image-gallery-panel .date-actions button::before {
    content: "download_for_offline";
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: normal;
    line-height: 1;
}

.project-image-gallery-panel .date-actions button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.project-image-gallery-panel .date-actions button:hover:not(:disabled),
.project-image-gallery-panel .date-actions button:focus-visible {
    background: #edf5ff;
    color: #005a9e;
}

.project-image-gallery-panel .image-gallery-grid {
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 12px;
    align-items: start;
}

.project-image-gallery-panel .photo-card {
    min-width: 0;
    min-height: 0;
    position: relative;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.project-image-gallery-panel .photo-preview-button {
    width: 100%;
    min-width: 0;
    min-height: 0;
    padding: 0;
    position: relative;
    display: block;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.project-image-gallery-panel .project-image-select-toggle {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 3;
    width: 22px;
    min-width: 22px;
    height: 22px;
    min-height: 22px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1px solid rgba(32, 43, 56, .44);
    border-radius: 4px;
    background: rgba(255, 255, 255, .82);
    color: transparent;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .2);
    backdrop-filter: blur(3px);
    outline: none;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-2px);
    transition: background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease, color 120ms ease, opacity 120ms ease, transform 120ms ease;
}

.project-image-gallery-panel .project-image-select-toggle .material-symbols-outlined {
    font-size: 16px;
    font-variation-settings: "FILL" 0, "wght" 650, "GRAD" 0, "opsz" 16;
    line-height: 1;
    opacity: 0;
    transition: opacity 120ms ease;
}

.project-image-gallery-panel .project-image-edit-button {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 3;
    display: inline-grid;
    width: 28px;
    min-width: 28px;
    height: 28px;
    padding: 0;
    place-items: center;
    border: 1px solid rgba(65, 71, 80, .45);
    border-radius: 2px;
    background: rgba(255, 255, 255, .94);
    color: #414750;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .35);
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-2px);
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, opacity 120ms ease, transform 120ms ease;
}

.project-image-gallery-panel .project-image-edit-button .material-symbols-outlined {
    font-size: 18px;
}

.project-image-gallery-panel .project-image-edit-button:hover,
.project-image-gallery-panel .project-image-edit-button:focus-visible {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.project-image-gallery-panel .project-image-select-toggle:hover,
.project-image-gallery-panel .project-image-select-toggle:focus-visible {
    border-color: #005a9e;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 0 0 2px rgba(0, 90, 158, .18), 0 2px 4px rgba(16, 24, 40, .2);
    outline: none;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.project-image-gallery-panel .photo-card:hover .project-image-select-toggle,
.project-image-gallery-panel .photo-card:focus-within .project-image-select-toggle,
.project-image-gallery-panel .photo-card:hover .project-image-edit-button,
.project-image-gallery-panel .photo-card:focus-within .project-image-edit-button {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.project-image-gallery-panel .photo-card.selected .project-image-select-toggle,
.project-image-gallery-panel .project-image-select-toggle[aria-pressed="true"] {
    border-color: #0067a5;
    background: #0067a5;
    color: #fff;
    box-shadow: 0 1px 3px rgba(0, 55, 92, .34);
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.project-image-gallery-panel .photo-card.selected .project-image-select-toggle .material-symbols-outlined,
.project-image-gallery-panel .project-image-select-toggle[aria-pressed="true"] .material-symbols-outlined {
    opacity: 1;
}

.project-image-gallery-panel .photo-card.selected .project-image-select-toggle:focus-visible,
.project-image-gallery-panel .project-image-select-toggle[aria-pressed="true"]:focus-visible {
    box-shadow: 0 0 0 2px rgba(0, 103, 165, .22), 0 1px 3px rgba(0, 55, 92, .34);
}

@media (hover: none), (pointer: coarse) {
    .project-image-gallery-panel .project-image-select-toggle,
    .project-image-gallery-panel .project-image-edit-button {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }
}

.project-image-gallery-panel .photo-card img,
.project-image-gallery-panel .project-image-placeholder {
    width: 100%;
    min-height: 0;
    aspect-ratio: 1 / 1;
    display: grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background-color: #e9edf1;
    color: #87929f;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .45);
    object-fit: cover;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.project-image-gallery-panel .project-image-placeholder .material-symbols-outlined {
    font-size: 26px;
    font-variation-settings: "FILL" 0, "wght" 350, "GRAD" 0, "opsz" 24;
    opacity: .72;
}

.project-image-gallery-panel .photo-card:hover img,
.project-image-gallery-panel .photo-card:hover .project-image-placeholder,
.project-image-gallery-panel .photo-card:focus-within img,
.project-image-gallery-panel .photo-card:focus-within .project-image-placeholder,
.project-image-gallery-panel .photo-card.selected img,
.project-image-gallery-panel .photo-card.selected .project-image-placeholder {
    border-color: #005a9e;
    box-shadow: inset 0 0 0 1px #005a9e;
}

.project-image-gallery-panel .photo-card > span,
.project-image-gallery-panel .photo-card > small {
    min-width: 0;
    display: block;
    overflow: hidden;
    background: transparent;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-image-gallery-panel .photo-card > span {
    color: #414750;
    font-size: 11px;
    font-weight: 500;
    line-height: 14px;
}

.project-image-gallery-panel .photo-card > small {
    color: #727782;
    font-size: 10px;
    line-height: 13px;
}

.project-image-selection-confirm-modal.project-document-create-modal {
    width: min(460px, calc(100vw - 32px));
}

.project-image-selection-confirm-modal .modal-body {
    padding: 18px;
}

.project-image-selection-confirm-modal .modal-body p {
    margin: 0;
    color: #414750;
    font-size: 12px;
    line-height: 18px;
}

.project-image-selection-confirm-modal .modal-actions button.danger {
    border-color: #a4262c;
    background: #a4262c;
    color: #fff;
}

.project-image-selection-confirm-modal .modal-actions button.danger:hover:not(:disabled) {
    border-color: #7f1d22;
    background: #7f1d22;
}

.project-image-photo-documentation-modal.project-document-create-modal {
    width: min(540px, calc(100vw - 32px));
}

.project-image-photo-documentation-body {
    gap: 16px !important;
}

.project-image-photo-documentation-scope {
    min-width: 0;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    border: 0;
}

.project-image-photo-documentation-scope legend {
    width: 100%;
    margin: 0 0 8px;
    padding: 0;
    grid-column: 1 / -1;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.project-image-photo-documentation-scope label {
    min-width: 0;
    min-height: 64px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    color: #1a1c1c;
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.project-image-photo-documentation-scope label:hover:not(.disabled),
.project-image-photo-documentation-scope label:focus-within:not(.disabled) {
    border-color: #005a9e;
    background: #f7fbff;
}

.project-image-photo-documentation-scope label:has(input:checked) {
    border-color: #005a9e;
    background: #edf5ff;
    box-shadow: inset 3px 0 0 #005a9e;
}

.project-image-photo-documentation-scope label.disabled {
    background: #f5f5f5;
    color: #8a8886;
    cursor: not-allowed;
}

.project-image-photo-documentation-scope input[type="radio"] {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #005a9e;
}

.project-image-photo-documentation-scope label > span {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.project-image-photo-documentation-scope strong {
    font-size: 12px;
    line-height: 16px;
}

.project-image-photo-documentation-scope small {
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
}

.project-image-photo-documentation-summary {
    min-height: 54px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    border-top: 1px solid #dde2ea;
    border-bottom: 1px solid #dde2ea;
    color: #414750;
}

.project-image-photo-documentation-summary > .material-symbols-outlined {
    color: #005a9e;
    font-size: 21px;
}

.project-image-photo-documentation-summary > span:last-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-image-photo-documentation-summary strong {
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
}

.project-image-photo-documentation-summary small {
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
}

.project-image-photo-documentation-modal .modal-actions button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.project-image-photo-documentation-modal .modal-actions button.primary:hover:not(:disabled) {
    border-color: #004578;
    background: #004578;
}

.project-mainframe-inline-host:has(> .project-photo-viewer) {
    z-index: 130;
    overflow: visible;
}

.project-photo-viewer {
    position: fixed;
    inset: 0;
    z-index: 1200;
    overflow: hidden;
    background: rgba(5, 8, 12, .91);
    color: #f5f6f7;
    outline: 0;
    isolation: isolate;
}

.project-photo-viewer::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(0, 0, 0, .18);
}

.project-photo-viewer__counter,
.project-photo-viewer__toolbar,
.project-photo-viewer__nav,
.project-photo-viewer__copy-status,
.project-photo-viewer__caption {
    position: absolute;
    z-index: 4;
}

.project-photo-viewer__counter {
    top: 18px;
    left: 20px;
    color: rgba(255, 255, 255, .9);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}

.project-photo-viewer__toolbar {
    top: 14px;
    right: 18px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.project-photo-viewer__tool,
.project-photo-viewer__nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 3px;
    background: rgba(4, 7, 10, .72);
    color: #f5f6f7;
    text-decoration: none;
    box-shadow: none;
}

.project-photo-viewer__tool {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
}

.project-photo-viewer__tool .material-symbols-outlined,
.project-photo-viewer__nav .material-symbols-outlined {
    font-size: 24px;
    line-height: 1;
}

.project-photo-viewer__tool:hover:not(:disabled),
.project-photo-viewer__tool:focus-visible,
.project-photo-viewer__nav:hover,
.project-photo-viewer__nav:focus-visible {
    background: rgba(28, 32, 37, .96);
    color: #fff;
}

.project-photo-viewer__tool:focus-visible,
.project-photo-viewer__nav:focus-visible {
    outline: 2px solid #8ec5ff;
    outline-offset: 2px;
}

.project-photo-viewer__tool:disabled {
    opacity: .36;
    cursor: not-allowed;
}

.project-photo-viewer__copy-status {
    top: 60px;
    right: 18px;
    max-width: min(360px, calc(100vw - 36px));
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 3px;
    background: rgba(20, 112, 67, .95);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    pointer-events: none;
}

.project-photo-viewer__copy-status.is-error {
    background: rgba(164, 38, 44, .96);
}

.project-photo-viewer__copy-status[hidden] {
    display: none;
}

.project-photo-viewer__stage {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: grid;
    place-items: safe center;
    box-sizing: border-box;
    overflow: auto;
    padding: 0 84px;
    scrollbar-color: rgba(255, 255, 255, .34) transparent;
    scrollbar-width: thin;
}

.project-photo-viewer__image {
    width: auto;
    height: auto;
    max-width: calc(100vw - 168px);
    max-height: 100vh;
    display: block;
    flex: none;
    object-fit: contain;
    transform-origin: center;
    box-shadow: 0 3px 22px rgba(0, 0, 0, .42);
    user-select: none;
}

.project-photo-viewer__unavailable {
    display: grid;
    place-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, .72);
    text-align: center;
}

.project-photo-viewer__unavailable .material-symbols-outlined {
    font-size: 48px;
}

.project-photo-viewer__unavailable strong {
    color: #fff;
    font-size: 15px;
    line-height: 20px;
}

.project-photo-viewer__unavailable span:last-child {
    max-width: min(560px, calc(100vw - 160px));
    overflow: hidden;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-photo-viewer__nav {
    width: 44px;
    min-width: 44px;
    height: 48px;
    min-height: 48px;
    top: 50%;
    transform: translateY(-50%);
}

.project-photo-viewer__nav--previous {
    left: 18px;
}

.project-photo-viewer__nav--next {
    right: 18px;
}

.project-photo-viewer__caption {
    max-width: calc(100vw - 180px);
    bottom: 10px;
    left: 50%;
    padding: 5px 10px;
    overflow: hidden;
    transform: translateX(-50%);
    border-radius: 2px;
    background: rgba(4, 7, 10, .7);
    color: rgba(255, 255, 255, .92);
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1180px) {
    .project-photo-viewer__counter {
        top: 12px;
        left: 14px;
    }

    .project-photo-viewer__toolbar {
        top: 8px;
        right: 10px;
    }

    .project-photo-viewer__copy-status {
        top: 54px;
        right: 10px;
    }

    .project-photo-viewer__stage {
        padding: 0 62px;
    }

    .project-photo-viewer__image {
        max-width: calc(100vw - 124px);
        max-height: 100vh;
    }

    .project-photo-viewer__nav--previous {
        left: 8px;
    }

    .project-photo-viewer__nav--next {
        right: 8px;
    }
}

.project-documents-panel {
    min-height: 0;
    height: 100%;
    display: flex;
    flex: 1 1 auto;
    margin-top: 0;
    padding-top: 0;
    overflow: hidden;
    border-top: 0;
    background: #f1f3f4;
}

.project-documents-panel .document-list-card-head {
    display: grid;
    gap: 8px;
}

.project-documents-panel .notes-head {
    align-items: center;
    margin-bottom: 0;
}

.project-documents-panel .notes-title-group {
    align-items: center;
}

.project-documents-panel .notes-title-group .material-symbols-outlined {
    color: #005a9e;
    font-size: 20px;
}

.project-documents-panel .notes-title-group h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 18px;
    line-height: 24px;
}

.project-documents-panel .note-count {
    color: #605e5c;
    font-size: 11px;
}

.project-documents-panel .document-toolbar {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.project-documents-panel .document-toolbar button,
.project-documents-panel .document-toolbar .project-tool-button {
    min-height: 28px;
    padding: 0 10px;
    border-radius: 4px;
    font-size: 12px;
}

.project-documents-panel .document-toolbar button[aria-label="Dokumentenbereich schliessen"] {
    width: 28px;
    min-width: 28px;
    padding: 0;
    justify-content: center;
}

.project-documents-panel .document-card-tabs {
    min-height: 30px;
    display: inline-flex;
    align-items: flex-end;
    gap: 0;
    border-bottom: 1px solid #c1c7d2;
}

.project-documents-panel .document-card-tabs button {
    min-height: 29px;
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: 0;
    background: transparent;
    color: #605e5c;
    font-size: 12px;
    font-weight: 700;
}

.project-documents-panel .document-card-tabs button.active {
    border-color: #c1c7d2;
    background: #fff;
    color: #1a1c1c;
}

.project-documents-panel .document-card-tabs button[aria-disabled="true"] {
    opacity: .62;
}

.project-body .documents-panel.active,
.project-body .project-documents-panel.project-detail-inline-module.active {
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-documents-panel.project-detail-inline-module {
    overflow: hidden;
    background: #f1f3f4;
}

.project-document-list-card {
    min-width: 0;
    min-height: 0;
    width: 100%;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #edebe9;
    border-radius: 0;
    background: #faf9f8;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.06);
}

.project-documents-panel .document-list-card-tabs.document-card-tabs {
    height: 32px;
    min-height: 32px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #efeeed;
}

.document-list-tabset {
    height: 100%;
    display: flex;
    align-items: stretch;
}

.project-documents-panel .document-list-tabset button {
    height: 100%;
    min-height: 0;
    padding: 0 12px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #414750;
    font-size: 11px;
    font-weight: 400;
}

.project-documents-panel .document-list-tabset button.active {
    border-bottom-color: #005a9e;
    background: rgba(250, 249, 248, 0.55);
    color: #005a9e;
    font-weight: 700;
}

.document-card-edit {
    width: 24px;
    height: 24px;
    min-height: 24px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #727782;
}

.document-card-edit .material-symbols-outlined {
    font-size: 16px;
}

.document-card-edit:hover {
    background: #e3e2e1;
    color: #005a9e;
}

.document-list-card-body {
    min-height: 0;
    padding: 8px;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
}

.document-list-card-body::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.document-list-card-body::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.document-list-card-body::-webkit-scrollbar-thumb {
    background: #c1c7d2;
}

.project-body .document-list-toolbar {
    padding: 8px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.document-toolbar-top {
    display: grid;
    grid-template-columns: max-content minmax(160px, 1fr) max-content;
    align-items: center;
    gap: 12px;
}

.project-body .document-list-toolbar .document-toolbar {
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-self: start;
    flex-wrap: nowrap;
    gap: 8px;
    margin-left: -16px;
    border: 0;
    background: transparent;
}

.project-body .document-list-toolbar .document-toolbar button {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 700;
}

.project-body .document-list-toolbar .document-toolbar button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.project-body .document-list-toolbar .document-toolbar .material-symbols-outlined {
    font-size: 16px;
}

.document-toolbar-search {
    position: relative;
    width: 100%;
    height: 28px;
    display: flex;
    align-items: center;
    justify-self: center;
}

.document-toolbar-search > .material-symbols-outlined {
    position: absolute;
    left: 8px;
    color: #605e5c;
    font-size: 15px;
    pointer-events: none;
}

.document-toolbar-search input {
    width: 100%;
    height: 28px;
    min-height: 28px;
    padding: 0 10px 0 29px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.document-toolbar-search input:focus {
    border-color: #005a9e;
    outline: 1px solid #005a9e;
    outline-offset: -1px;
}

.document-view-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    justify-self: end;
    white-space: nowrap;
}

.document-view-switch > span {
    color: #605e5c;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.document-view-switch button {
    width: 26px;
    height: 26px;
    min-height: 26px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #605e5c;
}

.document-view-switch button.active {
    background: #e9e8e7;
    color: #005a9e;
}

.document-view-switch .material-symbols-outlined {
    font-size: 16px;
}

.project-body .document-list-toolbar .folder-path {
    min-height: 18px;
    margin-top: 0;
    font-size: 10px;
}

.project-body .document-list-toolbar .folder-path > .material-symbols-outlined,
.project-body .document-list-toolbar .folder-path .material-symbols-outlined {
    font-size: 12px;
}

.document-history-command-row {
    grid-template-columns: minmax(260px, 1fr) 190px auto auto auto;
}

.project-documents-panel .document-history-command-row {
    grid-template-columns: minmax(260px, 1fr) 190px auto auto auto;
}

.project-documents-panel .document-search-field {
    position: relative;
}

.project-documents-panel .document-search-field > .material-symbols-outlined {
    position: absolute;
    left: 9px;
    bottom: 7px;
    color: #605e5c;
    font-size: 16px;
}

.project-documents-panel .document-search-field input {
    padding-left: 32px;
}

.project-documents-panel .document-count {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
    white-space: nowrap;
}

.project-document-path {
    min-height: 30px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    color: #605e5c;
    font-size: 12px;
}

.project-document-path .material-symbols-outlined {
    color: #d29200;
    font-size: 18px;
}

.project-document-path .document-folder-back {
    width: 24px;
    min-width: 24px;
    min-height: 24px;
    padding: 0;
    border-radius: 3px;
}

.project-document-path .document-folder-back .material-symbols-outlined {
    color: #605e5c;
    font-size: 16px;
}

.project-document-path .folder-breadcrumbs {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
}

.project-document-path .folder-breadcrumbs span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-document-path .folder-breadcrumbs button {
    min-width: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: #323130;
    font: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.project-document-path .folder-breadcrumbs span + span::before {
    content: "/";
    margin-right: 6px;
    color: #8a8886;
}

.project-document-path .folder-breadcrumbs button + span::before,
.project-document-path .folder-breadcrumbs span + button::before,
.project-document-path .folder-breadcrumbs button + button::before {
    content: "/";
    margin-right: 6px;
    color: #8a8886;
}

.document-folder-summary {
    margin-left: auto;
    color: #8a8886;
    font-size: 11px;
    white-space: nowrap;
}

.document-folder-state {
    min-height: 30px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #faf9f8;
    color: #605e5c;
    font-size: 12px;
}

.document-folder-state p {
    margin: 0;
}

.document-folder-state .material-symbols-outlined {
    font-size: 16px;
}

.project-document-action-strip {
    min-height: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #faf9f8;
}

.project-document-action-strip .document-action-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #605e5c;
    font-size: 12px;
}

.project-document-action-strip .material-symbols-outlined {
    font-size: 16px;
}

.project-document-bulk-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.project-document-bulk-actions button {
    min-height: 26px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #c1c7d2;
    border-radius: 3px;
    background: #fff;
    color: #323130;
    font-size: 11px;
    font-weight: 700;
}

.project-document-bulk-actions button:disabled {
    opacity: .62;
    cursor: not-allowed;
}

.project-document-bulk-actions button[aria-pressed="true"] {
    border-color: #005a9e;
    background: #e6f2fb;
    color: #005a9e;
}

.project-document-standard-folder-readiness {
    min-height: 34px;
    padding: 5px 10px 5px 8px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #005a9e;
    border-radius: 4px;
    background: #f7f9fb;
    color: #323130;
    font-size: 12px;
}

.project-document-standard-folder-readiness > .material-symbols-outlined {
    color: #005a9e;
    font-size: 17px;
}

.project-document-standard-folder-readiness strong,
.project-document-standard-folder-readiness small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-document-standard-folder-readiness strong {
    font-size: 12px;
    font-weight: 700;
}

.project-document-standard-folder-readiness small {
    color: #605e5c;
    font-size: 11px;
}

.project-document-standard-folder-readiness button {
    min-height: 26px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.project-document-standard-folder-readiness button:disabled {
    opacity: .62;
    cursor: not-allowed;
}

.project-document-move-panel,
.project-document-rename-panel,
.project-document-copy-panel,
.project-document-archive-panel,
.project-document-restore-panel,
.project-document-share-panel,
.project-document-folder-create-panel,
.project-document-folder-apply-panel,
.project-document-folder-rename-panel,
.project-document-folder-copy-panel,
.project-document-folder-archive-panel,
.project-document-folder-restore-panel {
    min-height: 36px;
    padding: 6px 10px;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    align-items: end;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
}

.project-document-copy-panel {
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
}

.project-document-archive-panel {
    grid-template-columns: minmax(190px, 1fr) minmax(220px, 1fr) auto;
}

.project-document-restore-panel {
    grid-template-columns: minmax(190px, 1fr) minmax(220px, 1fr) auto;
}

.project-document-share-panel {
    grid-template-columns: minmax(160px, 1fr) 170px minmax(180px, 1fr) auto;
}

.project-document-archive-context,
.project-document-restore-context,
.project-document-share-context,
.project-document-share-revoke-reason,
.project-document-share-list {
    grid-column: 1 / -1;
}

.project-document-archive-context,
.project-document-restore-context,
.project-document-share-context {
    padding: 5px 8px;
    border: 1px solid #d2d8e1;
    border-radius: 3px;
    background: #f7f9fb;
}

.project-document-share-list {
    display: grid;
    gap: 4px;
}

.project-document-share-list.is-loading,
.project-document-share-list.is-empty {
    min-height: 28px;
    padding: 6px 8px;
    align-items: center;
    border: 1px dashed #c1c7d2;
    border-radius: 3px;
    color: #605e5c;
    font-size: 12px;
}

.project-document-share-row {
    min-height: 30px;
    padding: 4px 6px;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 96px auto;
    align-items: center;
    gap: 6px;
    border: 1px solid #d2d8e1;
    border-radius: 3px;
    background: #fff;
}

.project-document-share-row.is-revoked {
    opacity: .72;
    background: #f6f7f8;
}

.project-document-share-row strong,
.project-document-share-row small {
    display: block;
}

.project-document-share-row small {
    color: #605e5c;
    font-size: 11px;
}

.project-document-share-row button {
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    justify-self: end;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 700;
}

.project-document-folder-create-panel,
.project-document-folder-apply-panel,
.project-document-folder-rename-panel,
.project-document-folder-copy-panel,
.project-document-folder-archive-panel,
.project-document-folder-restore-panel {
    grid-template-columns: minmax(190px, 1fr) minmax(170px, auto) auto;
}

.project-document-move-panel label,
.project-document-rename-panel label,
.project-document-copy-panel label,
.project-document-archive-panel label,
.project-document-restore-panel label,
.project-document-share-panel label,
.project-document-folder-create-panel label,
.project-document-folder-apply-panel label,
.project-document-folder-rename-panel label,
.project-document-folder-copy-panel label,
.project-document-folder-archive-panel label,
.project-document-folder-restore-panel label,
.project-document-folder-rename-parent,
.project-document-folder-apply-parent,
.project-document-folder-copy-parent,
.project-document-folder-archive-parent,
.project-document-folder-restore-parent,
.project-document-archive-context,
.project-document-restore-context,
.project-document-share-context {
    display: grid;
    gap: 3px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

.project-document-move-panel input,
.project-document-rename-panel input,
.project-document-copy-panel input,
.project-document-archive-panel input,
.project-document-restore-panel input,
.project-document-share-panel input,
.project-document-folder-create-panel input,
.project-document-folder-apply-panel input,
.project-document-folder-rename-panel input,
.project-document-folder-copy-panel input,
.project-document-folder-archive-panel input,
.project-document-folder-restore-panel input {
    min-height: 26px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 3px;
    font-size: 12px;
}

.project-document-move-actions,
.project-document-rename-actions,
.project-document-copy-actions,
.project-document-archive-actions,
.project-document-restore-actions,
.project-document-share-actions,
.project-document-folder-create-actions,
.project-document-folder-apply-actions,
.project-document-folder-rename-actions,
.project-document-folder-copy-actions,
.project-document-folder-archive-actions,
.project-document-folder-restore-actions {
    display: inline-flex;
    justify-content: flex-end;
    gap: 6px;
}

.project-document-move-actions button,
.project-document-rename-actions button,
.project-document-copy-actions button,
.project-document-archive-actions button,
.project-document-restore-actions button,
.project-document-share-actions button,
.project-document-folder-create-actions button,
.project-document-folder-apply-actions button,
.project-document-folder-rename-actions button,
.project-document-folder-copy-actions button,
.project-document-folder-archive-actions button,
.project-document-folder-restore-actions button {
    min-height: 26px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 700;
}

.project-document-move-actions button:disabled,
.project-document-rename-actions button:disabled,
.project-document-copy-actions button:disabled,
.project-document-archive-actions button:disabled,
.project-document-restore-actions button:disabled,
.project-document-share-actions button:disabled,
.project-document-folder-create-actions button:disabled,
.project-document-folder-apply-actions button:disabled,
.project-document-folder-rename-actions button:disabled,
.project-document-folder-copy-actions button:disabled,
.project-document-folder-archive-actions button:disabled,
.project-document-folder-restore-actions button:disabled {
    opacity: .62;
    cursor: not-allowed;
}

.project-document-selection-count {
    margin-left: 6px;
    padding-left: 8px;
    border-left: 1px solid #c1c7d2;
    color: #1a1c1c;
    font-weight: 700;
}

.project-document-bulk-errors,
.project-document-bulk-message,
.project-document-move-errors,
.project-document-move-message,
.project-document-rename-errors,
.project-document-rename-message,
.project-document-copy-errors,
.project-document-copy-message,
.project-document-archive-errors,
.project-document-archive-message,
.project-document-restore-errors,
.project-document-restore-message,
.project-document-share-errors,
.project-document-share-message,
.project-document-folder-create-errors,
.project-document-folder-create-message,
.project-document-folder-apply-errors,
.project-document-folder-apply-message,
.project-document-folder-rename-errors,
.project-document-folder-rename-message,
.project-document-folder-copy-errors,
.project-document-folder-copy-message,
.project-document-folder-archive-errors,
.project-document-folder-archive-message,
.project-document-folder-restore-errors,
.project-document-folder-restore-message {
    min-height: 28px;
    padding: 5px 10px;
    display: grid;
    align-items: center;
    gap: 2px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    font-size: 12px;
}

.project-document-bulk-errors,
.project-document-move-errors,
.project-document-rename-errors,
.project-document-copy-errors,
.project-document-archive-errors,
.project-document-restore-errors,
.project-document-share-errors,
.project-document-folder-create-errors,
.project-document-folder-apply-errors,
.project-document-folder-rename-errors,
.project-document-folder-copy-errors,
.project-document-folder-archive-errors,
.project-document-folder-restore-errors {
    border-color: #f3b5b5;
    background: #fff1f0;
    color: #7a1d1d;
}

.project-document-bulk-message,
.project-document-move-message,
.project-document-rename-message,
.project-document-copy-message,
.project-document-archive-message,
.project-document-restore-message,
.project-document-share-message,
.project-document-folder-create-message,
.project-document-folder-apply-message,
.project-document-folder-rename-message,
.project-document-folder-copy-message,
.project-document-folder-archive-message,
.project-document-folder-restore-message {
    border-color: #a7d4b5;
    background: #f0fbf4;
    color: #14532d;
}

.project-document-folder-create-parent,
.project-document-folder-rename-parent,
.project-document-folder-copy-parent,
.project-document-folder-archive-parent,
.project-document-folder-restore-parent {
    min-width: 0;
    display: grid;
    gap: 3px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

.project-document-folder-create-parent strong,
.project-document-folder-rename-parent strong,
.project-document-folder-copy-parent strong,
.project-document-folder-archive-parent strong,
.project-document-folder-restore-parent strong {
    min-height: 26px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 3px;
    background: #f4f3f2;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-document-folder-archive-actions .danger,
.project-document-archive-actions .danger {
    border-color: var(--danger);
    background: var(--danger);
    color: #fff;
}

.project-document-history-panel {
    display: grid;
    gap: 8px;
}

.project-document-history-table {
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}

.project-document-history-table-head {
    min-height: 32px;
    display: grid;
    grid-template-columns: 132px 150px minmax(220px, 1fr) minmax(120px, .7fr) minmax(160px, .8fr) minmax(160px, .8fr);
    align-items: center;
    gap: 10px;
    padding: 0 10px;
    background: #f3f2f1;
    color: #605e5c;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-document-history-table-row {
    min-height: 34px;
    display: grid;
    grid-template-columns: 132px 150px minmax(220px, 1fr) minmax(120px, .7fr) minmax(160px, .8fr) minmax(160px, .8fr);
    align-items: center;
    gap: 10px;
    padding: 0 10px;
    border-top: 1px solid #c1c7d2;
}

.project-document-history-table-row:hover {
    background: #f7f8fa;
}

.project-document-history-table-row > span,
.project-document-history-table-row > strong,
.project-document-history-table-row > time {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-document-history-table-row > strong {
    color: #1a1c1c;
    font-size: 12px;
}

.project-document-history-table-row > span,
.project-document-history-table-row > time {
    color: #605e5c;
    font-size: 11px;
}

.project-document-approvals-panel {
    display: grid;
    gap: 16px;
}

.project-document-approval-toolbar {
    min-height: 42px;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-document-approval-toolbar .document-approval-filters {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.project-document-approval-toolbar .document-approval-search {
    width: min(260px, 30vw);
    min-width: 230px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.project-document-approval-toolbar .document-approval-search .material-symbols-outlined {
    margin-left: 6px;
    color: #727782;
    font-size: 14px;
}

.project-document-approval-toolbar .document-approval-search input {
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0 8px 0 0;
    border: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 10px;
    outline: none;
}

.project-document-approval-toolbar select {
    height: 26px;
    min-height: 26px;
    padding: 0 24px 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
}

.document-approval-toolbar-summary {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    white-space: nowrap;
}

.document-approval-toolbar-summary strong {
    color: #414750;
    font-size: 10px;
    font-weight: 600;
}

.document-approval-toolbar-actions {
    gap: 2px;
}

.document-approval-reject-panel textarea {
    width: 100%;
    min-height: 78px;
    resize: vertical;
}

.project-document-approval-table-wrap {
    overflow-x: auto;
    background: #fff;
}

.project-document-approval-table {
    width: 100%;
    min-width: 840px;
    border-collapse: collapse;
    color: #414750;
    font-size: 11px;
}

.project-document-approval-table th,
.project-document-approval-table td {
    height: 36px;
    padding: 4px 8px;
    border-bottom: 1px solid rgba(193, 199, 210, .3);
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
}

.project-document-approval-table th {
    background: #f4f3f2;
    color: #727782;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.project-document-approval-table th:last-child,
.project-document-approval-table td:last-child {
    text-align: right;
}

.project-document-approval-table tbody tr:nth-child(even) {
    background: #f8f8f8;
}

.project-document-approval-table-row:hover {
    background: #f4f3f2;
}

.project-document-approval-table-row.is-archived {
    background: #fff8f7;
}

.project-document-approval-table tbody tr:last-child td {
    border-bottom: 0;
}

.project-document-approval-table td,
.project-document-approval-table time {
    color: #414750;
    font-size: 11px;
}

.approval-document-name {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    color: #1a1c1c;
    font-weight: 600;
}

.approval-document-name .material-symbols-outlined {
    flex: 0 0 auto;
    font-size: 16px;
}

.approval-document-name .is-pdf {
    color: #ba1a1a;
}

.approval-document-name .is-file {
    color: #15803d;
}

.approval-document-name .document-name-cell {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.project-document-approval-table-row .document-name-cell strong {
    color: #1a1c1c;
    overflow: hidden;
    font-size: 11px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-document-approval-table-row .document-name-cell small {
    color: #727782;
    overflow: hidden;
    font-size: 9px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.approval-priority,
.approval-status {
    display: inline-flex;
    align-items: center;
    border-radius: 2px;
    font-size: 9px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
}

.approval-priority {
    padding: 2px 6px;
    background: #e9e8e7;
    color: #414750;
}

.approval-priority.is-normal {
    background: #e9e8e7;
    color: #414750;
}

.approval-priority.is-high,
.approval-priority.is-urgent {
    background: #ffdad6;
    color: #ba1a1a;
}

.approval-status {
    padding: 2px 8px;
    border: 1px solid #c1c7d2;
    border-radius: 999px;
    background: #e3e2e1;
    color: #605e5c;
}

.approval-status.is-review {
    border-color: #fed7aa;
    background: #fff7ed;
    color: #9a3412;
}

.approval-status.is-approved {
    border-color: #bbf7d0;
    background: #dcfce7;
    color: #166534;
}

.approval-status.is-rejected {
    border-color: #fecaca;
    background: #fef2f2;
    color: #991b1b;
}

.document-approval-row-actions {
    justify-content: flex-end;
}

.document-approval-row-actions .project-document-archive-marker {
    width: 26px;
    min-width: 26px;
    min-height: 26px;
}

.approval-actions button {
    width: 26px;
    height: 26px;
    min-height: 26px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #727782;
}

.approval-actions button:hover {
    background: #e9e8e7;
    color: #005a9e;
}

.approval-actions button.is-approve {
    color: #005a9e;
}

.approval-actions button.is-approve:hover {
    background: rgba(0, 90, 158, .1);
}

.approval-actions button.is-reject {
    color: #ba1a1a;
}

.approval-actions button.is-reject:hover {
    background: rgba(186, 26, 26, .1);
}

.approval-actions .material-symbols-outlined {
    font-size: 18px;
}

.project-appointments-panel {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.appointment-export-message {
    margin: 10px 0 0;
}

.project-time-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 8px;
    margin: 0 0 12px;
}

.project-time-summary article {
    display: grid;
    gap: 2px;
    min-height: 58px;
    padding: 10px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #f8f8f8;
}

.project-time-summary span,
.project-time-summary small {
    color: #605e5c;
    font-size: 11px;
}

.project-time-summary strong {
    color: #1a1c1c;
    font-size: 16px;
    line-height: 1.1;
}

.project-time-table {
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    overflow: hidden;
}

.project-time-table-head,
.project-time-table-row {
    display: grid;
    grid-template-columns: 98px minmax(170px, .85fr) minmax(220px, 1fr) 120px 82px 112px;
    align-items: center;
    gap: 10px;
    min-height: 34px;
    padding: 0 10px;
}

.project-time-table-head {
    background: #f3f2f1;
    color: #605e5c;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-time-table-row {
    border-top: 1px solid #c1c7d2;
    color: #323130;
    font-size: 12px;
}

.project-time-table-row:hover {
    background: #f7f8fa;
}

.project-time-table-row > span,
.project-time-table-row > strong,
.project-time-table-row > time {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-time-table-row > time {
    color: #605e5c;
    font-size: 11px;
}

.project-body .browser-content > .project-mainframe-inline-host > .project-time-entries-panel.project-detail-inline-module.project-time-density-view {
    min-height: 100%;
    padding: 8px !important;
    gap: 8px;
    overflow: auto;
    background: #faf9f8;
    color: #1a1c1c;
    font-family: Inter, sans-serif;
    font-size: 12px;
    line-height: 16px;
}

.project-time-density-header {
    margin-bottom: 0;
}

.project-time-density-header h1 {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0;
}

.project-time-density-header button.primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.project-time-filter select:disabled,
.project-time-density-card select:disabled,
.project-time-density-card button:disabled {
    opacity: 1;
    color: #1a1c1c;
    cursor: default;
}

.project-time-filter select:disabled {
    background: #f8f8f8;
}

.project-time-density-kpis {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.project-time-density-kpis article {
    min-height: 52px;
}

.project-time-density-card {
    min-height: 0;
}

.project-time-density-card .approve-all {
    background: #004277;
}

.project-rapport-panel {
    gap: 8px;
}

.project-rapport-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.project-rapport-summary article {
    display: grid;
    gap: 2px;
    min-height: 54px;
    padding: 9px 10px;
    border: 1px solid #d6dbe3;
    background: #f8fafc;
}

.project-rapport-summary span,
.project-rapport-summary small,
.project-rapport-list span,
.project-rapport-footer small {
    color: #727782;
    font-size: 11px;
}

.project-rapport-summary strong {
    color: #1a1c1c;
    font-size: 16px;
    line-height: 1.15;
}

.project-rapport-issues {
    display: grid;
    gap: 4px;
    padding: 8px 10px;
    border: 1px solid #f3c3bd;
    background: #fff7f5;
    color: #a23b2a;
    font-size: 12px;
}

.project-rapport-document-readiness {
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid #d6dbe3;
    background: #fff;
}

.project-rapport-document-readiness-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.project-rapport-document-readiness-head div {
    display: grid;
    gap: 2px;
}

.project-rapport-document-readiness-head strong {
    color: #1a1c1c;
    font-size: 13px;
}

.project-rapport-document-readiness-head small {
    color: #727782;
    font-size: 11px;
}

.project-rapport-document-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.project-rapport-document-actions button {
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid #c8d0dc;
    background: #fff;
    color: #1f2937;
    font-weight: 700;
}

.project-rapport-document-actions button[data-project-rapport-document-dms-finalize-active] {
    border-color: #00599f;
    background: #00599f;
    color: #fff;
}

.project-rapport-document-actions button[data-project-rapport-document-governance-finalize-action],
.project-rapport-document-actions button[data-project-rapport-document-governance-retention-legal-decision-action] {
    border-color: #3d4b59;
    background: #3d4b59;
    color: #fff;
}

.project-rapport-document-actions button:disabled {
    cursor: not-allowed;
    opacity: .55;
}

.project-rapport-document-readiness-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}

.project-rapport-document-readiness-grid article {
    display: grid;
    gap: 2px;
    min-height: 48px;
    padding: 8px 9px;
    border: 1px solid #e2e6ec;
    background: #f8fafc;
}

.project-rapport-document-readiness-grid span,
.project-rapport-document-readiness-grid small {
    color: #727782;
    font-size: 11px;
}

.project-rapport-document-readiness-grid strong {
    color: #1a1c1c;
    font-size: 14px;
}

.project-rapport-document-target-folder,
.project-rapport-document-render-staging-readiness,
.project-rapport-document-dms-status,
.project-rapport-document-template-list,
.project-rapport-document-governance-result {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.project-rapport-document-target-folder span,
.project-rapport-document-render-staging-readiness span,
.project-rapport-document-dms-status span,
.project-rapport-document-template-list span,
.project-rapport-document-governance-result span {
    display: grid;
    gap: 2px;
    min-width: 180px;
    padding: 7px 9px;
    border: 1px solid #e2e6ec;
    background: #f8fafc;
}

.project-rapport-document-target-folder strong,
.project-rapport-document-render-staging-readiness strong,
.project-rapport-document-dms-status strong,
.project-rapport-document-template-list strong,
.project-rapport-document-governance-result strong {
    color: #1a1c1c;
    font-size: 12px;
}

.project-rapport-document-target-folder small,
.project-rapport-document-render-staging-readiness small,
.project-rapport-document-dms-status small,
.project-rapport-document-template-list small,
.project-rapport-document-governance-result small {
    color: #727782;
    font-size: 11px;
}

.project-rapport-document-compliance-badge {
    border-color: #2e7d32 !important;
    background: #edf7ee !important;
}

.project-rapport-document-compliance-badge strong {
    color: #1f6f35 !important;
}

.project-rapport-document-governance-actions {
    align-items: center;
}

.project-rapport-document-governance-actions small {
    color: #727782;
    font-size: 11px;
}

.project-rapport-document-governance-modal {
    width: min(780px, calc(100vw - 48px));
}

.project-rapport-document-governance-body {
    display: grid;
    gap: 12px;
}

.project-rapport-document-governance-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.project-rapport-document-governance-summary span {
    display: grid;
    gap: 2px;
    min-height: 46px;
    padding: 8px 9px;
    border: 1px solid #e2e6ec;
    background: #f8fafc;
}

.project-rapport-document-governance-summary strong {
    color: #1a1c1c;
    font-size: 12px;
}

.project-rapport-document-governance-summary small {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #727782;
    font-size: 11px;
}

.project-rapport-document-governance-field,
.project-rapport-document-governance-reason {
    display: grid;
    gap: 6px;
    color: #4b5563;
    font-size: 12px;
    font-weight: 700;
}

.project-rapport-document-governance-field select,
.project-rapport-document-governance-field input,
.project-rapport-document-governance-reason textarea {
    min-height: 112px;
    resize: vertical;
    border: 1px solid #c8d0dc;
    padding: 9px 10px;
    color: #1a1c1c;
    font: inherit;
}

.project-rapport-document-governance-field select,
.project-rapport-document-governance-field input {
    min-height: 36px;
    resize: none;
}

.project-rapport-list {
    display: grid;
    border: 1px solid #d6dbe3;
}

.project-rapport-list article {
    display: grid;
    grid-template-columns: 92px minmax(220px, 1.2fr) minmax(140px, .8fr) 72px 110px 180px;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 0 10px;
    border-top: 1px solid #e5e7eb;
    background: #fff;
    font-size: 12px;
}

.project-rapport-list article:first-child {
    border-top: 0;
}

.project-rapport-list strong,
.project-rapport-list span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-rapport-list time {
    color: #727782;
    font-size: 11px;
}

.project-rapport-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.project-rapport-target-invoice,
.project-rapport-confirm-reason {
    display: flex;
    align-items: center;
    gap: 6px;
}

.project-rapport-target-invoice {
    min-width: 280px;
}

.project-rapport-confirm-reason {
    min-width: 360px;
}

.project-rapport-target-invoice span,
.project-rapport-confirm-reason span {
    color: #727782;
    font-size: 11px;
    white-space: nowrap;
}

.project-rapport-target-invoice select,
.project-rapport-confirm-reason input {
    width: 100%;
    min-height: 32px;
    border: 1px solid #cfd6df;
    padding: 5px 8px;
    font: inherit;
    font-size: 12px;
}

.project-rapport-target-hint {
    color: #727782;
    font-size: 11px;
    text-align: right;
}

.project-time-density-state.compact {
    min-height: 92px;
    padding: 14px;
}

.project-time-high-density-table {
    min-width: 1120px;
}

.project-time-high-density-table td:nth-child(5),
.project-time-high-density-table td:nth-child(6),
.project-time-high-density-table td:nth-child(7),
.project-time-high-density-table td:nth-child(9),
.project-time-high-density-table th:nth-child(5),
.project-time-high-density-table th:nth-child(6),
.project-time-high-density-table th:nth-child(7),
.project-time-high-density-table th:nth-child(9) {
    text-align: center;
}

.project-time-high-density-table td:nth-child(3),
.project-time-high-density-table td:nth-child(8) {
    max-width: 210px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.project-time-density-state {
    min-height: 220px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    padding: 24px;
    color: #414750;
    text-align: center;
}

.project-time-density-state .material-symbols-outlined {
    color: #004277;
    font-size: 28px;
}

.project-time-density-state strong {
    color: #1a1c1c;
    font-size: 13px;
}

.project-time-density-state p {
    margin: 0;
    max-width: 420px;
    color: #727782;
    font-size: 12px;
}

.project-time-density-state.is-error,
.project-time-density-state.is-error .material-symbols-outlined,
.project-time-density-state.is-error strong {
    color: #ba1a1a;
}

.project-status-panel {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.project-status-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.project-status-summary article {
    display: grid;
    gap: 3px;
    min-height: 74px;
    padding: 12px;
    border: 1px solid var(--border-soft);
    border-radius: 7px;
    background: #fbfcfe;
}

.project-controlling-kpis article[data-project-controlling-severity="warning"] {
    border-left: 3px solid #ba1a1a;
}

.project-controlling-kpis article[data-project-controlling-severity="critical"] {
    border-left: 3px solid #7a271a;
    background: #fff7f6;
}

.project-controlling-source-table {
    margin-bottom: 12px;
}

.project-controlling-warning-list {
    display: grid;
    gap: 8px;
}

.project-controlling-warning {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--border-soft);
    background: #fbfcfe;
}

.project-controlling-warning.is-warning {
    border-left: 3px solid #ba1a1a;
}

.project-controlling-warning.is-critical {
    border-left: 3px solid #7a271a;
    background: #fff7f6;
}

.project-controlling-warning > span {
    width: 28px;
    height: 28px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #414750;
    font-size: 12px;
    font-weight: 700;
}

.project-controlling-warning strong,
.project-controlling-warning p {
    margin: 0;
}

.project-controlling-warning strong {
    color: #1a1c1c;
    font-size: 12px;
}

.project-controlling-warning p {
    color: #727782;
    font-size: 11px;
}

.project-controlling-warning button {
    min-height: 28px;
    padding: 0 10px;
}

.project-status-summary span,
.project-status-summary small {
    color: var(--muted);
    font-size: 12px;
}

.project-status-form {
    margin-bottom: 14px;
}

.status-history-table {
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: hidden;
}

.status-history-table-head,
.status-history-table-row {
    display: grid;
    grid-template-columns: minmax(130px, .75fr) minmax(150px, .9fr) minmax(220px, 1fr) minmax(110px, .6fr) 150px;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 12px;
}

.status-history-table-head {
    background: #f3f5f8;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.status-history-table-row {
    border-top: 1px solid var(--border-soft);
}

.status-history-table-row span,
.status-history-table-row strong,
.status-history-table-row time {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.status-history-table-row time {
    color: var(--muted);
    font-size: 12px;
}

.appointment-command-row {
    grid-template-columns: minmax(260px, 1fr) 150px 140px 120px auto;
}

.appointment-table {
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: hidden;
}

.appointment-table-head,
.appointment-table-row {
    display: grid;
    grid-template-columns: minmax(210px, 1.1fr) 130px 190px minmax(160px, .8fr) 118px 210px;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 12px;
}

.appointment-table-head {
    background: #f3f5f8;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.appointment-table-row {
    border-top: 1px solid var(--border-soft);
}

.appointment-name-cell,
.appointment-meta-cell {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.appointment-name-cell strong,
.appointment-name-cell small,
.appointment-meta-cell strong,
.appointment-meta-cell small,
.appointment-table-row time {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.appointment-name-cell small,
.appointment-meta-cell small,
.appointment-table-row time {
    color: var(--muted);
    font-size: 12px;
}

.project-appointments-panel .appointment-content-head {
    min-height: 40px;
    margin: 0;
    padding: 0 0 8px;
    align-items: center;
    border-bottom: 1px solid #e3e2e1;
}

.project-appointments-panel .appointment-content-head .notes-title-group {
    align-items: center;
    gap: 8px;
}

.project-appointments-panel .appointment-content-head .notes-title-group .material-symbols-outlined {
    color: #005a9e;
    font-size: 18px;
}

.project-appointments-panel .appointment-content-head h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
}

.project-appointments-panel .appointment-content-head .toolbar {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.project-appointments-panel .appointment-command-row {
    min-height: 38px;
    margin: 0;
    padding: 6px;
    gap: 6px;
    border-color: #e3e2e1;
    border-radius: 2px;
    background: #faf9f8;
}

.project-appointments-panel .appointment-command-row label {
    gap: 2px;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
}

.project-appointments-panel .appointment-command-row input,
.project-appointments-panel .appointment-command-row select {
    min-height: 28px;
    border-radius: 2px;
    font-size: 11px;
}

.project-appointments-panel .appointment-compact-table {
    border-color: #c1c7d2;
    border-radius: 2px;
}

.project-appointments-panel .appointment-compact-table table {
    min-width: 980px;
}

.project-appointments-panel .appointment-compact-table th,
.project-appointments-panel .appointment-compact-table td {
    min-height: 32px;
    padding: 6px 8px;
    border-color: #e3e2e1;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 15px;
    vertical-align: middle;
}

.project-appointments-panel .appointment-compact-table th {
    background: #eeeeef;
    color: #303943;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.project-appointments-panel .appointment-compact-table tbody tr:nth-child(odd) {
    background: #f3f3f3;
}

.project-appointments-panel .appointment-compact-table tbody tr:hover {
    background: #e9eef6;
}

.project-appointments-panel .appointment-compact-table td,
.project-appointments-panel .appointment-compact-table time,
.project-appointments-panel .appointment-compact-table strong,
.project-appointments-panel .appointment-compact-table small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.project-appointments-panel .appointment-compact-table time,
.project-appointments-panel .appointment-compact-table small {
    color: #605e5c;
    font-size: 10px;
}

.project-appointments-panel .appointment-compact-table .appointment-name-cell {
    display: grid;
    gap: 2px;
}

.project-appointments-panel .appointment-compact-table .row-actions.compact {
    display: flex;
    flex-wrap: nowrap;
    gap: 4px;
    min-width: 142px;
}

.project-appointments-panel .appointment-compact-table .row-actions.compact button {
    min-height: 24px;
    padding: 0 6px;
    border-radius: 2px;
    font-size: 10px;
}

.project-appointments-panel .table-pill {
    min-height: 20px;
    padding: 2px 7px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #edf3ff;
    color: #345fae;
    font-size: 10px;
    font-weight: 800;
    line-height: 14px;
    white-space: nowrap;
}

.project-appointments-panel .table-pill.is-approved {
    background: #ebf6ee;
    color: #2f7d45;
}

.project-appointments-panel .table-pill.is-review {
    background: #fff8e6;
    color: #946200;
}

.project-appointments-panel .table-pill.is-archived {
    background: #f1f1f1;
    color: #6b7280;
}

.document-table {
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: hidden;
}

.document-table-head,
.document-table-row {
    display: grid;
    grid-template-columns: 68px minmax(210px, 1fr) 118px minmax(105px, .7fr) 132px 72px 330px;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 12px;
}

.document-table-head {
    background: #f3f5f8;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.document-table-row {
    border-top: 1px solid var(--border-soft);
}

.project-document-table {
    border-color: #c1c7d2;
    border-radius: 4px;
    overflow: visible;
}

.project-document-table-head {
    grid-template-columns: 58px minmax(240px, 1fr) 122px minmax(125px, .65fr) 132px 80px 56px;
    min-height: 32px;
    padding: 0 10px;
    background: #f3f2f1;
    color: #605e5c;
    font-size: 11px;
}

.project-document-table-row {
    grid-template-columns: 58px minmax(240px, 1fr) 122px minmax(125px, .65fr) 132px 80px 56px;
    min-height: 34px;
    padding: 0 10px;
    border-top: 1px solid #c1c7d2;
}

.project-document-table.is-selection-mode .project-document-table-head {
    grid-template-columns: 28px 58px minmax(220px, 1fr) 122px minmax(125px, .65fr) 132px 80px 56px;
}

.project-document-table.is-selection-mode .project-document-table-row {
    grid-template-columns: 28px 58px minmax(220px, 1fr) 122px minmax(125px, .65fr) 132px 80px 56px;
}

.project-document-selection-cell {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.project-document-checkbox {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: #005a9e;
}

.project-document-checkbox:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.project-document-table-row:hover {
    background: #f7f8fa;
}

.project-document-table-row.is-archived {
    background: #fff8f7;
}

.project-document-table-row.is-draft-document {
    opacity: .58;
    background: #f7f8fa;
}

.project-document-table-row.is-draft-document:hover {
    opacity: .76;
}

.project-document-table-row.document-folder-row {
    cursor: pointer;
}

.project-document-table-row.document-folder-row:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: -2px;
}

.project-document-table-row > span,
.project-document-table-row > time {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-name-cell {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.document-name-cell strong,
.document-name-cell small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-name-cell small,
.document-table-row time {
    color: var(--muted);
    font-size: 12px;
}

.project-document-table-row .document-name-cell {
    gap: 1px;
}

.project-document-name-open {
    display: grid;
    width: 100%;
    min-width: 0;
    gap: 1px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.project-document-name-open:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

.project-document-table-row .document-name-cell strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
}

.project-document-table-row .document-name-cell small,
.project-document-table-row time {
    color: #605e5c;
    font-size: 10px;
}

.project-document-file-icon {
    width: 30px;
    min-width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
    overflow: visible;
    border: 0;
    background: transparent;
    color: #727782;
}

.project-document-file-icon .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
    letter-spacing: 0;
}

.project-document-file-icon.is-folder {
    color: #b97800;
}

.project-document-file-icon.is-folder .material-symbols-outlined {
    font-size: 20px;
}

.project-document-file-icon.is-pdf {
    color: #ba1a1a;
}

.project-document-file-icon.is-spreadsheet {
    color: #15803d;
}

.project-document-file-icon.is-document {
    color: #005a9e;
}

.project-document-file-icon.is-image {
    color: #a15c00;
}

.project-document-file-icon.is-plan {
    color: #056174;
}

.project-document-file-icon.is-bim {
    color: #087568;
}

.project-document-file-icon.is-data {
    color: #5c3f92;
}

.project-document-file-icon.is-archive,
.project-document-file-icon.is-other {
    color: #605e5c;
}

.project-document-file-icon.is-mail {
    color: #7a4f01;
}

.project-document-file-icon.is-presentation {
    color: #b1440e;
}

.project-document-file-icon.is-video,
.project-document-file-icon.is-audio {
    color: #3949ab;
}

.project-document-file-icon.is-report {
    color: #166534;
}

.project-document-table-row .document-status-chip {
    min-height: 20px;
    border-radius: 3px;
    padding: 0 7px;
    font-size: 10px;
}

.project-document-table-row.is-navigation-target {
    border-left: 3px solid #005a9e;
    background: #eef6ff;
}

.project-document-navigation-message {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px 0 0;
    padding: 7px 9px;
    border: 1px solid #b7d7f1;
    border-left: 3px solid #005a9e;
    background: #f4f9ff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

.project-document-navigation-message .material-symbols-outlined {
    color: #005a9e;
    font-size: 18px;
}

.project-document-navigation-message small {
    margin-left: auto;
    color: #605e5c;
    font-size: 10px;
    font-weight: 700;
}

.document-revision-count {
    color: #605e5c;
    font-size: 12px;
    font-weight: 700;
}

.project-document-row-actions {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    overflow: visible !important;
}

.project-document-row-actions.is-open {
    z-index: 72;
}

.project-document-row-menu-toggle {
    width: 24px;
    min-width: 24px;
    min-height: 24px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #727782;
}

.project-document-row-menu-toggle:hover,
.project-document-row-menu-toggle:focus-visible,
.project-document-row-actions.is-open .project-document-row-menu-toggle {
    border-color: transparent;
    background: #efeeed;
    color: #414750;
}

.project-document-row-menu-toggle .material-symbols-outlined {
    font-size: 18px;
}

.project-document-row-menu-dismiss-layer {
    position: fixed;
    inset: 0;
    z-index: 70;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    cursor: default;
}

.project-document-file-action-menu {
    width: 168px;
    padding: 6px;
    position: absolute;
    top: calc(100% + 3px);
    right: 0;
    z-index: 73;
    display: grid;
    gap: 2px;
    overflow: visible !important;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(20, 30, 45, .16);
    white-space: nowrap;
}

.project-document-file-action-menu button,
.project-document-file-action-menu a {
    width: 100%;
    min-width: 0;
    min-height: 32px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #33404b;
    font: inherit;
    font-size: 11px;
    font-weight: 650;
    line-height: 1;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.project-document-file-action-menu button:hover,
.project-document-file-action-menu button:focus-visible,
.project-document-file-action-menu a:hover,
.project-document-file-action-menu a:focus-visible {
    border-color: transparent;
    background: #edf3ff;
    color: #345fae;
    outline: 0;
}

.project-document-folder-lock-note {
    min-height: 30px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 7px;
    border-top: 1px solid #e3e2e1;
    color: #727782;
    font-size: 10px;
    font-weight: 600;
}

.project-document-folder-lock-note .material-symbols-outlined {
    font-size: 15px;
}

.project-document-archive-marker {
    width: 26px;
    min-width: 26px;
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #f4f3f2;
    color: #605e5c;
}

.document-security-badge {
    min-width: 74px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 0 6px;
    border: 1px solid #c1c7d2;
    border-radius: 3px;
    background: #f4f3f2;
    color: #605e5c;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.document-security-badge.is-security-clean {
    border-color: #8dcf9d;
    background: #eef8ee;
    color: #107c10;
}

.document-security-badge.is-security-pending {
    border-color: #f0c36a;
    background: #fff4de;
    color: #946200;
}

.document-security-badge.is-security-warning {
    border-color: #d0a7a0;
    background: #fff7ed;
    color: #a14f00;
}

.document-security-badge.is-security-blocked {
    border-color: #d98a82;
    background: #fef3f2;
    color: #ba1a1a;
}

.document-status-chip {
    width: fit-content;
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0 8px;
    font-size: 11px;
    font-weight: 800;
}

.document-status-chip.is-approved {
    background: #ecfdf3;
    color: #067647;
}

.document-status-chip.is-review {
    background: #fff4de;
    color: #946200;
}

.document-status-chip.is-draft {
    background: #eef2f6;
    color: #5d6673;
}

.document-status-chip.is-archived {
    background: #fef3f2;
    color: var(--danger);
}

.document-revisions-panel {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: #fbfcfe;
}

.project-boq-import-panel {
    margin-bottom: 14px;
    border-color: #c7d2e2;
    background: #fafbfc;
}

.project-boq-import-panel .form-head {
    align-items: center;
    gap: 10px;
}

.project-boq-import-panel .form-head > span {
    margin-left: auto;
}

.project-boq-import-upload-grid {
    align-items: end;
}

.project-boq-import-upload-grid input[readonly] {
    background: #f3f5f8;
    color: #414750;
}

.project-boq-import-feedback {
    min-height: 34px;
    margin: 0 0 10px;
    padding: 7px 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #b7d6c3;
    border-radius: 4px;
    background: #f0fdf4;
    color: #067647;
    font-size: 12px;
}

.project-boq-import-feedback .material-symbols-outlined {
    font-size: 18px;
}

.project-boq-import-feedback.is-warning {
    border-color: #d8c38a;
    background: #fff8e6;
    color: #7a5200;
}

.project-boq-import-feedback.is-danger {
    border-color: #d8a19c;
    background: #fff2f1;
    color: #a4262c;
}

.project-boq-import-feedback > div {
    display: grid;
    gap: 2px;
}

.project-boq-import-feedback small {
    color: inherit;
    opacity: .82;
}

.project-boq-gaeb-export-version-history-content-preview-message-list {
    display: grid;
    gap: 2px;
}

.project-boq-import-preview {
    margin-top: 12px;
    padding: 12px;
}

.project-boq-import-merge-preview {
    margin-top: 12px;
    padding: 12px;
}

.project-boq-import-history {
    margin-top: 12px;
    padding: 12px;
}

.project-boq-import-match-history {
    margin-top: 12px;
    padding: 12px;
}

.project-boq-gaeb-export-readiness {
    margin-top: 12px;
    padding: 12px;
}

.project-boq-gaeb-export-runtime-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    margin: 10px 0;
    padding: 8px 10px;
    border: 1px solid #c7cdd4;
    border-left: 3px solid #605e5c;
    border-radius: 4px;
    background: #fff;
    color: #1a1c1c;
}

.project-boq-gaeb-export-runtime-summary .material-symbols-outlined {
    font-size: 18px;
}

.project-boq-gaeb-export-runtime-summary strong,
.project-boq-gaeb-export-runtime-summary small {
    display: block;
    min-width: 0;
}

.project-boq-gaeb-export-runtime-summary strong {
    font-size: 13px;
    line-height: 18px;
}

.project-boq-gaeb-export-runtime-summary small {
    color: #605e5c;
    font-size: 12px;
    line-height: 16px;
}

.project-boq-gaeb-export-runtime-summary.is-ready {
    border-left-color: #005a9e;
    background: #f7fbff;
}

.project-boq-gaeb-export-runtime-summary.is-success {
    border-left-color: #107c10;
    background: #f6fbf6;
}

.project-boq-gaeb-export-runtime-summary.is-reused {
    border-left-color: #8a6d00;
    background: #fffbf0;
}

.project-boq-gaeb-export-runtime-summary.is-blocked {
    border-left-color: #a4262c;
    background: #fff7f7;
}

.project-boq-gaeb-export-history-status {
    margin-top: -2px;
}

.project-boq-gaeb-export-history-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin: -2px 0 10px 29px;
    border: 1px solid #c7cdd4;
    background: #dfe3e7;
}

.project-boq-gaeb-export-history-meta span {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 7px 9px;
    background: #fff;
}

.project-boq-gaeb-export-history-meta small,
.project-boq-gaeb-export-history-meta strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-boq-gaeb-export-history-meta small {
    color: #667085;
    font-size: 11px;
    line-height: 14px;
    text-transform: uppercase;
}

.project-boq-gaeb-export-history-meta strong {
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
}

.project-boq-gaeb-export-runtime-warnings {
    display: grid;
    gap: 6px;
    margin-top: 8px;
}

.project-boq-gaeb-export-runtime-warnings p {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    font-size: 12px;
}

.project-boq-gaeb-export-runtime-warnings .material-symbols-outlined {
    font-size: 17px;
}

.project-boq-gaeb-export-version-history {
    display: grid;
    gap: 8px;
    margin: 12px 0;
}

.project-boq-gaeb-export-version-history .notes-head {
    margin: 0;
}

.project-boq-gaeb-export-version-history-tools {
    display: flex;
    align-items: center;
    gap: 8px;
}

.project-boq-gaeb-export-version-history-tools select {
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 4px;
    background: #fff;
    color: var(--text);
    padding: 6px 10px;
}

.project-boq-gaeb-export-version-history-table {
    margin-top: 0;
}

.project-boq-gaeb-export-version-history-table .appointment-table-head,
.project-boq-gaeb-export-version-history-table .appointment-table-row {
    grid-template-columns: 96px minmax(190px, 1fr) 125px minmax(150px, .8fr) 94px 176px;
}

.project-boq-gaeb-export-version-history-download-link {
    justify-content: center;
    text-decoration: none;
}

.project-boq-gaeb-export-version-history-dms-link,
.project-boq-gaeb-export-version-history-preview-link,
.project-boq-gaeb-export-version-history-compare-link,
.project-boq-gaeb-export-version-history-content-preview-link,
.project-boq-gaeb-export-version-history-content-compare-link,
.project-boq-gaeb-export-version-history-xml-viewer-link,
.project-boq-gaeb-export-version-history-archive-link {
    justify-content: center;
    margin-top: 4px;
    width: fit-content;
}

.project-boq-gaeb-export-version-history-preview,
.project-boq-gaeb-export-version-history-compare,
.project-boq-gaeb-export-version-history-content-preview,
.project-boq-gaeb-export-version-history-content-compare,
.project-boq-gaeb-export-version-history-xml-viewer,
.project-boq-gaeb-export-version-history-archive-dialog {
    display: grid;
    gap: 10px;
    border: 1px solid var(--border);
    background: #fff;
    padding: 12px;
}

.project-boq-gaeb-export-version-history-preview .notes-head,
.project-boq-gaeb-export-version-history-compare .notes-head,
.project-boq-gaeb-export-version-history-content-preview .notes-head,
.project-boq-gaeb-export-version-history-content-compare .notes-head,
.project-boq-gaeb-export-version-history-xml-viewer .notes-head {
    border: 0;
    padding: 0;
}

.project-boq-gaeb-export-version-history-archive-dialog .form-head {
    margin-bottom: 0;
}

.project-boq-gaeb-export-version-history-archive-dialog textarea {
    min-height: 78px;
}

.project-boq-gaeb-export-version-history-archive-dialog .form-hint {
    color: var(--muted);
    font-size: 12px;
    margin-top: 4px;
}

.project-boq-gaeb-export-version-history-preview-grid,
.project-boq-gaeb-export-version-history-compare-grid,
.project-boq-gaeb-export-version-history-content-preview-grid,
.project-boq-gaeb-export-version-history-content-compare-grid,
.project-boq-gaeb-export-version-history-xml-viewer-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.project-boq-gaeb-export-version-history-preview-grid article,
.project-boq-gaeb-export-version-history-compare-grid article,
.project-boq-gaeb-export-version-history-content-preview-grid article,
.project-boq-gaeb-export-version-history-content-compare-grid article,
.project-boq-gaeb-export-version-history-xml-viewer-grid article {
    border: 1px solid var(--border);
    background: var(--surface);
    padding: 10px;
    min-width: 0;
}

.project-boq-gaeb-export-version-history-preview-grid span,
.project-boq-gaeb-export-version-history-preview-grid small,
.project-boq-gaeb-export-version-history-compare-grid span,
.project-boq-gaeb-export-version-history-compare-grid small,
.project-boq-gaeb-export-version-history-content-preview-grid span,
.project-boq-gaeb-export-version-history-content-preview-grid small,
.project-boq-gaeb-export-version-history-content-compare-grid span,
.project-boq-gaeb-export-version-history-content-compare-grid small,
.project-boq-gaeb-export-version-history-xml-viewer-grid span,
.project-boq-gaeb-export-version-history-xml-viewer-grid small {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.project-boq-gaeb-export-version-history-preview-grid strong,
.project-boq-gaeb-export-version-history-compare-grid strong,
.project-boq-gaeb-export-version-history-content-preview-grid strong,
.project-boq-gaeb-export-version-history-content-compare-grid strong,
.project-boq-gaeb-export-version-history-xml-viewer-grid strong {
    display: block;
    color: var(--text);
    font-size: 14px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.project-boq-gaeb-export-version-history-content-preview-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.project-boq-gaeb-export-version-history-content-compare-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.project-boq-gaeb-export-version-history-xml-viewer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.project-boq-gaeb-export-version-history-xml-viewer-code {
    max-height: 360px;
    overflow: auto;
    margin: 0;
    border: 1px solid var(--border);
    background: #101418;
    color: #f4f7fb;
    padding: 12px;
    font-family: Consolas, "Courier New", monospace;
    font-size: 12px;
    line-height: 1.45;
    white-space: pre;
}

.project-boq-gaeb-export-version-history-content-preview-items .appointment-table-head,
.project-boq-gaeb-export-version-history-content-preview-items .appointment-table-row {
    grid-template-columns: 110px minmax(240px, 1fr) 96px 80px minmax(140px, .7fr);
}

.project-boq-gaeb-export-version-history-content-compare-items .appointment-table-head,
.project-boq-gaeb-export-version-history-content-compare-items .appointment-table-row {
    grid-template-columns: 120px 100px minmax(210px, 1fr) minmax(210px, 1fr) 120px;
}

.project-boq-import-summary {
    margin-bottom: 10px;
}

.project-boq-import-message-table,
.project-boq-import-preview-table {
    margin-top: 10px;
}

.project-boq-import-message-table .appointment-table-head,
.project-boq-import-message-table .appointment-table-row {
    grid-template-columns: 100px 150px minmax(260px, 1fr) 150px;
}

.project-boq-import-preview-table .appointment-table-head,
.project-boq-import-preview-table .appointment-table-row {
    grid-template-columns: minmax(220px, 1fr) 140px 130px minmax(180px, .8fr);
}

.project-boq-import-merge-preview-table {
    margin-top: 10px;
}

.project-boq-import-merge-preview-table .appointment-table-head,
.project-boq-import-merge-preview-table .appointment-table-row {
    grid-template-columns: 130px minmax(220px, 1fr) 120px minmax(150px, .55fr) minmax(260px, 1fr);
}

.project-boq-import-history-table {
    margin-top: 10px;
}

.project-boq-import-history-table .appointment-table-head,
.project-boq-import-history-table .appointment-table-row {
    grid-template-columns: 110px minmax(220px, 1fr) 110px minmax(190px, .8fr) minmax(210px, .7fr);
}

.project-boq-import-match-history-table {
    margin-top: 10px;
}

.project-boq-import-match-history-table .appointment-table-head,
.project-boq-import-match-history-table .appointment-table-row {
    grid-template-columns: 100px 130px minmax(170px, .8fr) minmax(160px, .8fr) minmax(260px, 1fr) minmax(120px, .5fr);
}

.project-boq-gaeb-export-readiness-table {
    margin-top: 10px;
}

.project-boq-gaeb-export-readiness-table .appointment-table-head,
.project-boq-gaeb-export-readiness-table .appointment-table-row {
    grid-template-columns: 110px minmax(180px, .55fr) minmax(320px, 1fr);
}

.project-boq-import-history-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: flex-end;
}

.project-boq-import-history-actions .project-tool-button {
    min-height: 30px;
    padding: 5px 9px;
}

.project-boq-import-history-actions .project-tool-button.danger {
    border-color: #d0a7a7;
    color: #8f1f1f;
    background: #fff7f7;
}

.quote-price-preview-table .appointment-table-head,
.quote-price-preview-table .appointment-table-row {
    grid-template-columns: 118px minmax(220px, 1fr) 170px 190px minmax(220px, 1fr);
}

.quote-price-preview-table .appointment-table-row.is-selected {
    background: #eef6ff;
}

.quote-supplier-price-snapshot-confirm {
    margin: 8px;
    padding: 8px;
    border: 1px solid #dde2ea;
    background: #fff;
}

.quote-supplier-price-snapshot-confirm textarea {
    min-height: 54px;
    resize: vertical;
}

.quote-email-table .appointment-table-head,
.quote-email-table .appointment-table-row {
    grid-template-columns: minmax(220px, 1.15fr) 130px 190px 130px 110px 160px 110px;
}

.quote-email-command-row {
    grid-template-columns: 180px;
    margin-bottom: 12px;
}

.quote-email-attachment-table .appointment-table-row {
    grid-template-columns: minmax(260px, 1fr) 160px;
}

.quote-email-provider-dispatch-handoff {
    min-width: 0;
    padding: 7px 8px;
    display: grid;
    gap: 5px;
    border: 1px solid #cfd6df;
    border-radius: 2px;
    background: #fff;
}

.quote-email-provider-dispatch-handoff.is-blocked {
    border-left: 3px solid #a4262c;
    background: #fff8f8;
}

.quote-email-provider-dispatch-handoff.is-ready {
    border-left: 3px solid #107c10;
    background: #f7fff7;
}

.quote-email-provider-dispatch-state-head {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #414750;
}

.quote-email-provider-dispatch-state-head .material-symbols-outlined {
    color: #a4262c;
    font-size: 17px;
}

.quote-email-provider-dispatch-handoff.is-ready .quote-email-provider-dispatch-state-head .material-symbols-outlined {
    color: #107c10;
}

.quote-email-provider-dispatch-state-head strong {
    min-width: 0;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.quote-email-provider-dispatch-handoff button {
    min-height: 26px;
    justify-content: center;
    gap: 5px;
    border-radius: 2px;
    font-size: 11px;
    font-weight: 700;
}

.quote-email-provider-dispatch-handoff button .material-symbols-outlined {
    font-size: 15px;
}

.quote-email-provider-dispatch-handoff button:disabled {
    border-color: #d5d9e2;
    background: #ecebea;
    color: #605e5c;
    opacity: 1;
}

.quote-email-provider-dispatch-handoff small {
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
}

.quote-email-attempt-history {
    margin: -1px 0 8px;
    padding: 10px;
    border: 1px solid #c1c7d2;
    border-top: 0;
    background: #f8f8f8;
}

.quote-email-attempt-history-head {
    min-height: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #414750;
    font-size: 12px;
}

.quote-email-attempt-history-head strong {
    color: #1a1c1c;
    font-size: 13px;
}

.quote-email-attempt-history-head span {
    color: #605e5c;
    font-size: 11px;
}

.quote-email-attempt-table {
    border: 1px solid #d5d9e2;
    background: #fff;
}

.quote-email-attempt-table-head,
.quote-email-attempt-table-row {
    display: grid;
    grid-template-columns: 90px 140px minmax(190px, 1fr) minmax(150px, 0.8fr) minmax(160px, 0.8fr) 112px;
    align-items: center;
}

.quote-email-attempt-table-head {
    min-height: 30px;
    border-bottom: 1px solid #d5d9e2;
    background: #f4f3f2;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

.quote-email-attempt-table-row {
    min-height: 44px;
    border-bottom: 1px solid #ebedf2;
    color: #1a1c1c;
    font-size: 12px;
}

.quote-email-attempt-table-row:last-child {
    border-bottom: 0;
}

.quote-email-attempt-table-head > span,
.quote-email-attempt-table-row > span {
    min-width: 0;
    padding: 7px 9px;
}

.project-quotes-panel {
    display: flex;
    flex-direction: column;
}

.project-body.has-quote-editor-focus > .project-cockpit.project-detail-kpis {
    display: none;
}

.project-list-panel.has-project-detail > .project-body[data-project-detail].has-quote-editor-focus {
    grid-template-rows: minmax(0, 1fr);
}

.project-body.has-quote-editor-focus .project-browser.project-browser-wide {
    min-height: calc(100vh - var(--dummy-topbar-height) - 70px);
    grid-template-columns: minmax(0, 1fr);
}

.project-body.has-quote-editor-focus .vertical-tabs {
    display: none;
}

.project-body.has-quote-editor-focus .browser-content {
    padding: 0;
}

.project-quotes-panel.has-focused-quote {
    gap: 0;
}

.project-quotes-panel.has-focused-quote > [data-quote-selected-mainframe-detail] {
    order: 1;
    padding: 0;
    border: 0;
    background: #efeeed;
}

.project-quotes-panel.has-focused-quote > [data-quote-selected-mainframe-detail] > .quote-editor-view {
    order: 1;
    min-height: 820px;
    height: calc(100vh - var(--dummy-topbar-height) - 16px);
    margin-top: 0;
}

.project-quotes-panel.has-focused-quote > [data-quote-selected-mainframe-detail] > .notes-head {
    order: 2;
    display: none;
}

.project-quotes-panel.has-focused-quote > [data-quote-selected-mainframe-detail] > [data-quote-commercial-summary] {
    order: 3;
    display: none;
}

.project-quotes-panel.has-focused-quote > [data-quote-selected-mainframe-detail] > .quote-workspace-drawer {
    order: 4;
    display: none;
}

.project-quotes-panel.has-focused-quote > .notes-head {
    order: 2;
    display: none;
}

.project-quotes-panel.has-focused-quote > .note-command-row {
    order: 3;
    display: none;
}

.project-quotes-panel.has-focused-quote > [data-quote-list-mainframe-list] {
    order: 4;
    display: none;
}

.project-quotes-panel > [data-quote-selected-mainframe-detail] {
    order: 3;
    flex: 0 0 auto;
    margin-top: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

.project-quotes-panel > [data-quote-list-mainframe-list] {
    order: 4;
}

.project-quotes-panel .quote-editor-view {
    flex: 0 0 auto;
    min-height: 760px;
    height: min(920px, calc(100vh - var(--dummy-topbar-height) - 64px));
    max-height: none;
    margin-top: 8px;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #efeeed;
    color: #1a1c1c;
    font-family: Inter, "Segoe UI", sans-serif;
}

.project-quotes-panel .quote-editor-view .quote-shell {
    --quote-catalog-height: 192px;
    --quote-catalog-head-height: 32px;
    position: relative;
    min-height: 760px;
    height: 100%;
    max-height: 100%;
    padding: 0;
    display: grid;
    grid-template-rows: 32px minmax(0, 1fr) 4px minmax(180px, var(--quote-catalog-height));
    gap: 0;
    overflow: hidden;
    background: #efeeed;
}

.project-quotes-panel .quote-editor-view .quote-shell.is-catalog-resizing,
.project-quotes-panel .quote-editor-view .quote-shell.is-catalog-resizing * {
    user-select: none;
}

.project-quotes-panel .quote-editor-view .quote-shell.catalog-collapsed {
    grid-template-rows: 32px minmax(0, 1fr) 0 var(--quote-catalog-head-height);
}

.project-quotes-panel .quote-editor-view .quote-shell.catalog-collapsed .quote-splitter,
.project-quotes-panel .quote-editor-view .quote-shell.catalog-collapsed .quote-catalog-main {
    display: none;
}

.project-quotes-panel .quote-editor-view .quote-shell.catalog-locked .quote-catalog {
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: auto;
    width: auto;
    height: auto;
    max-height: none;
    box-shadow: none;
}

.project-quotes-panel .quote-editor-view .quote-shell.catalog-locked.catalog-collapsed .quote-catalog {
    height: var(--quote-catalog-head-height);
}

.project-quotes-panel .quote-editor-view .quote-shell.catalog-locked .quote-splitter {
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: auto;
    width: auto;
}

.project-quotes-panel .quote-editor-view .quote-shell.catalog-locked.catalog-collapsed .quote-splitter {
    bottom: auto;
}

.project-quotes-panel .quote-editor-view .quote-toolbar {
    position: relative;
    z-index: 40;
    min-height: 32px;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    overflow: visible;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-breadcrumb,
.project-quotes-panel .quote-editor-view .quote-toolbar-left,
.project-quotes-panel .quote-editor-view .quote-toolbar-right {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 6px;
}

.project-quotes-panel .quote-editor-view .quote-toolbar-left {
    flex-wrap: nowrap;
    position: relative;
    z-index: 1;
}

.project-quotes-panel .quote-editor-view .quote-toolbar-right {
    position: relative;
    z-index: 2;
}

.project-quotes-panel .quote-editor-view .quote-project-return-button {
    font-weight: 800;
    text-decoration: none;
    color: inherit;
}

.project-quotes-panel .quote-editor-view .quote-breadcrumb {
    overflow: hidden;
    color: #605e5c;
    font-size: 11px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.project-quotes-panel .quote-editor-view .quote-breadcrumb strong {
    overflow: hidden;
    color: #1a1c1c;
    font-weight: 800;
    text-overflow: ellipsis;
}

.project-quotes-panel .quote-editor-view .quote-breadcrumb .material-symbols-outlined {
    color: #9aa6b2;
    font-size: 14px;
}

.project-quotes-panel .quote-editor-view .btn,
.project-quotes-panel .quote-editor-view .mini-tool {
    min-height: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0 8px;
    border: 1px solid #727782;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
    box-shadow: none;
}

.project-quotes-panel .quote-editor-view .btn:disabled,
.project-quotes-panel .quote-editor-view .mini-tool:disabled,
.project-quotes-panel .quote-editor-view .quote-lib-select:disabled,
.project-quotes-panel .quote-editor-view .quote-lib-add:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.project-quotes-panel .quote-editor-view .btn .material-symbols-outlined,
.project-quotes-panel .quote-editor-view .mini-tool .material-symbols-outlined {
    font-size: 16px;
}

.project-quotes-panel .quote-editor-view .btn-primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.project-quotes-panel .quote-editor-view .quote-status-tag {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #e3e2e1;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-dropdown {
    position: relative;
}

.project-quotes-panel .quote-editor-view .quote-dropdown.is-open {
    z-index: 2;
}

.project-quotes-panel .quote-editor-view .quote-dropdown-trigger {
    cursor: pointer;
    user-select: none;
}

.project-quotes-panel .quote-editor-view .quote-dropdown-trigger:hover,
.project-quotes-panel .quote-editor-view .quote-dropdown-trigger:focus-visible,
.project-quotes-panel .quote-editor-view .quote-dropdown.is-open > .quote-dropdown-trigger {
    border-color: #004277;
    background: #eef5fb;
    color: #004277;
}

.project-quotes-panel .quote-editor-view .quote-toolbar-menu-dismiss-layer {
    position: fixed;
    inset: 0;
    z-index: 39;
    background: transparent;
    cursor: default;
}

.project-quotes-panel .quote-editor-view .quote-inline-filters {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.project-quotes-panel .quote-editor-view .quote-inline-filters label {
    min-width: 0;
    display: inline-grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    color: #605e5c;
    font-size: 10px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-inline-filters input,
.project-quotes-panel .quote-editor-view .quote-inline-filters select {
    height: 24px;
    min-width: 0;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-inline-filters input {
    width: 150px;
    padding: 0 7px;
}

.project-quotes-panel .quote-editor-view .quote-inline-filters select {
    width: 86px;
    padding: 0 5px;
}

.project-quotes-panel .quote-editor-view .dropdown-menu {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    z-index: 35;
    min-width: 190px;
    padding: 4px 0;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(26, 28, 28, .14);
}

.project-quotes-panel .quote-editor-view .dropdown-menu button {
    width: 100%;
    min-height: 30px;
    padding: 0 12px;
    border: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
    text-align: left;
}

.project-quotes-panel .quote-editor-view .dropdown-menu button:hover:not(:disabled) {
    background: #efeeed;
}

.project-quotes-panel .quote-editor-view .dropdown-divider {
    height: 1px;
    margin: 4px 0;
    background: #c1c7d2;
}

.project-quotes-panel .quote-editor-view .quote-editor {
    position: relative;
    z-index: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 16px;
    overflow: hidden;
}

.project-quotes-panel .quote-editor-view .quote-panel,
.project-quotes-panel .quote-editor-view .quote-document-panel,
.project-quotes-panel .quote-editor-view .quote-side-panel,
.project-quotes-panel .quote-editor-view .quote-catalog {
    border-radius: 0;
    box-shadow: none;
}

.project-quotes-panel .quote-editor-view .quote-document-panel {
    position: relative;
    min-width: 0;
    min-height: 0;
    display: grid;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #dadad9;
}

.project-quotes-panel .quote-editor-view .quote-document-tools {
    position: absolute;
    top: 10px;
    right: 12px;
    left: auto;
    z-index: 12;
    width: max-content;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border: 1px solid #c1c7d2;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(26, 28, 28, .12);
    transform: none;
}

.project-quotes-panel .quote-editor-view .quote-document-tools .mini-tool {
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-tools button:not(:disabled):hover {
    border-color: #00558c;
    color: #00558c;
    background: #eef6fb;
}

.project-quotes-panel .quote-editor-view .quote-document-tools button:focus-visible {
    outline: 2px solid #0b6fab;
    outline-offset: 1px;
}

.project-quotes-panel .quote-editor-view .quote-document-tools .quote-zoom-tag {
    min-width: 50px;
    height: 28px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #25313d;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.project-quotes-panel .quote-editor-view .mini-tool {
    width: 24px;
    min-width: 24px;
    padding: 0;
    border: 0;
    border-radius: 999px;
}

.project-quotes-panel .quote-editor-view .quote-zoom-tag {
    min-width: 44px;
    color: #605e5c;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
    text-align: center;
}

.project-quotes-panel .quote-editor-view .quote-sheet-wrap {
    min-width: 0;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow: auto;
    padding: 52px 18px 18px;
    background: #dadad9;
}

.project-quotes-panel .quote-editor-view .quote-document-loading-state {
    min-width: 0;
    min-height: 620px;
    height: 100%;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 8px;
    padding: 72px 24px 24px;
    background: #dadad9;
    color: #354150;
    text-align: center;
}

.project-quotes-panel .quote-editor-view .quote-document-loading-state strong {
    font-size: 14px;
    font-weight: 650;
}

.project-quotes-panel .quote-editor-view .quote-document-loading-state small {
    color: #667487;
    font-size: 12px;
}

.project-quotes-panel .quote-editor-view .quote-document-loading-state .material-symbols-outlined {
    font-size: 30px;
    color: #00558c;
}

.project-quotes-panel .quote-editor-view .quote-document-loading-state .quote-document-loading-hourglass {
    animation: quote-document-hourglass-turn 1.25s ease-in-out infinite;
}

.project-quotes-panel .quote-editor-view .quote-document-loading-state.is-error {
    color: #8f1d1d;
}

.project-quotes-panel .quote-editor-view .quote-document-loading-state.is-error small {
    max-width: 520px;
    color: #8f1d1d;
}

@keyframes quote-document-hourglass-turn {
    0%,
    40% {
        transform: rotate(0deg);
    }

    60%,
    100% {
        transform: rotate(180deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .project-quotes-panel .quote-editor-view .quote-document-loading-state .quote-document-loading-hourglass {
        animation: none;
    }
}

.project-quotes-panel .quote-editor-view .quote-pdf-preview-surface {
    position: absolute;
    inset: 0;
    z-index: 30;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    box-sizing: border-box;
    padding: 16px;
    overflow: hidden;
    background: #dadad9;
}

.project-quotes-panel .quote-editor-view .quote-pdf-preview-frame {
    min-width: 0;
    min-height: 620px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: 1px solid #aeb6c2;
    background: #fff;
    box-shadow: 0 2px 8px rgba(26, 28, 28, .14);
}

.project-quotes-panel .quote-editor-view .quote-pdf-preview-frame iframe {
    width: 100%;
    height: 100%;
    min-height: 620px;
    display: block;
    border: 0;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-pdf-preview-state {
    width: min(794px, calc(100% - 12px));
    min-height: 260px;
    margin: auto;
    padding: 24px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 8px;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #475569;
    text-align: center;
}

.project-quotes-panel .quote-editor-view .quote-pdf-preview-state.is-error {
    border-color: #d7a0a0;
    color: #9b1c1c;
}

.project-quotes-panel .quote-editor-view .quote-pdf-preview-state .material-symbols-outlined {
    font-size: 28px;
}

.project-quotes-panel .quote-editor-view .quote-sheet-zoom-wrap {
    --quote-document-zoom: 1;
    width: max-content;
    margin: 0 auto;
    zoom: var(--quote-document-zoom);
}

.project-quotes-panel .quote-editor-view .quote-sheet {
    width: 794px;
    min-height: 1123px;
    padding: 56px;
    border: 1px solid #c1c7d2;
    background: #fff;
    box-shadow: 0 5px 16px rgba(26, 28, 28, .16);
}

.project-quotes-panel .quote-editor-view .quote-sheet.is-template-bound {
    position: relative;
    width: 210mm;
    min-height: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.project-quotes-panel .quote-editor-view .quote-template-live-background {
    --quote-template-page-gap: 18px;
    position: relative;
    z-index: 0;
    width: 210mm;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: var(--quote-template-page-gap);
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-template-live-background > .document-template-layout-page {
    flex: 0 0 auto;
}

.project-quotes-panel .quote-editor-view .quote-template-live-overlay-stack {
    --quote-template-page-gap: 18px;
    position: absolute;
    inset: 0 auto auto 0;
    z-index: 1;
    width: 210mm;
    display: flex;
    flex-direction: column;
    gap: var(--quote-template-page-gap);
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-template-live-overlay-page {
    position: relative;
    flex: 0 0 auto;
    box-sizing: border-box;
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-template-inline-text-field {
    position: absolute;
    box-sizing: border-box;
    display: block;
    margin: 0;
    padding: 0;
    overflow: hidden;
    resize: none;
    border: 1px solid transparent;
    border-radius: 0;
    outline: 0;
    background: transparent;
    white-space: pre-wrap;
    pointer-events: auto;
    transition: border-color 120ms ease, background-color 120ms ease;
}

.project-quotes-panel .quote-editor-view .quote-template-inline-text-field:hover:not(:disabled) {
    border-color: #9eb4c7;
    background: rgba(255, 255, 255, .92);
}

.project-quotes-panel .quote-editor-view .quote-template-inline-text-field:focus {
    border-color: #0b67a3;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 0 0 1px rgba(11, 103, 163, .18);
}

.project-quotes-panel .quote-editor-view .quote-template-inline-text-field:disabled {
    color: inherit;
    opacity: 1;
    -webkit-text-fill-color: currentColor;
}

.project-quotes-panel .quote-editor-view .quote-template-fallback-page-stack,
.project-quotes-panel .quote-editor-view .quote-template-fallback-page {
    display: contents;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] {
    position: absolute;
    box-sizing: border-box;
    margin: 0;
    overflow: visible;
    background: #fff;
    color: #172033;
    font-family: Inter, "Segoe UI", sans-serif;
    font-size: 8.5pt;
    line-height: 1.25;
    pointer-events: auto;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-table {
    font-size: 8.5pt;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-drag {
    width: 5mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-position {
    width: 17mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-article-number {
    width: 16mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-ean {
    width: 20mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-quantity {
    width: 11.5mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-unit {
    width: 13mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-unit-price {
    width: 22mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-markup {
    width: 15mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-measurement {
    width: 18mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-vat {
    width: 12mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-line-total {
    width: 26mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-col-actions {
    width: 6mm;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-template-live-position-anchor="true"] .quote-row-action-rail {
    display: none;
}

.project-quotes-panel .quote-editor-view .quote-template-live-totals {
    width: 64mm;
    margin: 4mm 0 0 auto;
    display: grid;
    gap: 1.2mm;
    color: #334155;
    font-size: 8.5pt;
}

.project-quotes-panel .quote-editor-view .quote-template-live-totals > div {
    display: flex;
    justify-content: space-between;
    gap: 5mm;
}

.project-quotes-panel .quote-editor-view .quote-template-live-totals .is-grand-total {
    padding-top: 1.5mm;
    border-top: 1px solid #0f5f99;
    color: #0f5f99;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-template-layout-state {
    margin: 0 0 16px;
    padding: 8px 10px;
    border-left: 3px solid #8f98a1;
    background: #f4f3f2;
    color: #30363d;
    font-size: 11px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-template-layout-state.is-error {
    border-left-color: #c50f1f;
    background: #fff4f4;
    color: #a80000;
}

.project-quotes-panel .quote-editor-view .quote-sheet-top,
.project-quotes-panel .quote-editor-view .quote-address-meta,
.project-quotes-panel .quote-editor-view .quote-document-footer-summary {
    display: flex;
    justify-content: space-between;
    gap: 34px;
}

.project-quotes-panel .quote-editor-view .quote-logo {
    display: flex;
    align-items: center;
    gap: 10px;
}

.project-quotes-panel .quote-editor-view .quote-logo-mark {
    width: 38px;
    height: 38px;
    display: none;
    place-items: center;
    overflow: hidden;
    border: 1px solid #8f98a1;
    color: #5e6872;
    font-size: 12px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-company-brand-logo {
    width: 120px;
    height: 42px;
}

.project-quotes-panel .quote-editor-view .quote-logo-text {
    display: grid;
    gap: 2px;
    color: #004277;
    font-size: 20px;
    line-height: 28px;
}

.project-quotes-panel .quote-editor-view .quote-logo-text span:first-child {
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-logo-text span + span {
    color: #605e5c;
    font-size: 11px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-meta-grid {
    display: grid;
    grid-template-columns: auto minmax(96px, auto);
    gap: 4px 12px;
    color: #605e5c;
    font-size: 11px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-document-kind {
    grid-column: 1 / -1;
    justify-self: end;
    margin-bottom: 12px;
    padding: 4px 12px;
    background: #e3e2e1;
    color: #1a1c1c;
    font-weight: 800;
    letter-spacing: .04em;
}

.project-quotes-panel .quote-editor-view .quote-document-output-status-stack {
    display: contents;
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack {
    position: absolute;
    top: 58px;
    right: 12px;
    z-index: 11;
    width: clamp(244px, 16vw, 292px);
    max-height: min(520px, calc(100vh - var(--dummy-topbar-height) - 250px));
    display: grid;
    gap: 8px;
    overflow: auto;
    margin: 0;
    padding: 10px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #005a9e;
    background: #eef2f6;
    box-shadow: 0 4px 14px rgba(26, 28, 28, .18);
}

.project-quotes-panel .quote-editor-view[data-quote-editor-layout="document-and-position-list"] .quote-document-output-status-stack {
    display: none;
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-template-source-strip {
    grid-template-columns: minmax(0, 1fr);
    margin: 0;
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-template-source-strip small {
    text-align: left;
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-output-workflow,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-dms-status-route,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-email-status-route,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-commercial-handoff-status-flow,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-to-invoice-route {
    grid-template-columns: minmax(0, 1fr);
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-instance-preview-sync header,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-instance-preview-sync-summary,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-dms-status-sync header,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-dms-status-sync-summary,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-email-status-sync header,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-email-status-sync-summary,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-commercial-handoff-status header,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-commercial-handoff-status-summary {
    align-items: flex-start;
    flex-direction: column;
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-dms-status-result,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-dms-status-checks,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-email-status-checks,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-email-status-outbox,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-email-status-provider,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-commercial-handoff-actions {
    grid-template-columns: minmax(0, 1fr);
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-commercial-handoff-actions {
    display: grid;
}

.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-commercial-handoff-actions button,
.project-quotes-panel.has-focused-quote .quote-editor-view .quote-document-output-status-stack .quote-document-dms-status-actions .btn {
    width: 100%;
    min-height: 28px;
    justify-content: center;
}

.project-quotes-panel .quote-editor-view .quote-document-output-status-stack[hidden] {
    display: none !important;
}

@media print {
    .project-quotes-panel .quote-editor-view .quote-sheet-nonprint-workflow {
        display: none !important;
    }
}

.project-quotes-panel .quote-editor-view .quote-meta-grid strong {
    justify-self: end;
    color: #1a1c1c;
    font-weight: 700;
    text-align: right;
}

.project-quotes-panel .quote-editor-view .quote-template-source-strip {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    margin: 18px 0 6px;
    padding: 6px 8px;
    border-left: 3px solid #c1c7d2;
    background: #f4f3f2;
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-template-source-strip strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-template-source-strip span {
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-template-source-strip small {
    text-align: right;
}

.project-quotes-panel .quote-editor-view .quote-template-source-strip.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-template-source-strip.is-blocked {
    border-left-color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-document-output-workflow {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    margin: 8px 0 16px;
}

.project-quotes-panel .quote-editor-view .quote-document-output-workflow div {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid #d7dde7;
    border-left: 3px solid #c1c7d2;
    background: #fff;
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-document-output-workflow div.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-output-workflow div.is-blocked {
    border-left-color: #d13438;
    background: #fff7f7;
}

.project-quotes-panel .quote-editor-view .quote-document-output-workflow span {
    overflow: hidden;
    color: #004277;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-output-workflow strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-output-workflow small {
    overflow: hidden;
    color: #605e5c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync {
    display: grid;
    gap: 8px;
    margin: 12px 0 18px;
    padding: 10px;
    border: 1px solid #d7dde7;
    border-left: 3px solid #c1c7d2;
    background: #fbfbfb;
    color: #1a1c1c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync.is-blocked {
    border-left-color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync header,
.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync-summary,
.project-quotes-panel .quote-editor-view .document-template-instance-preview-sheet header,
.project-quotes-panel .quote-editor-view .document-template-instance-preview-sheet footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync header strong {
    min-width: 0;
    overflow: hidden;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync header span {
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync header small {
    color: #605e5c;
    text-align: right;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync-summary {
    justify-content: flex-start;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-sync-summary span {
    padding: 2px 6px;
    border: 1px solid #d7dde7;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-html {
    border-top: 1px solid #e3e8ef;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-sheet {
    display: grid;
    gap: 10px;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-sheet header {
    padding-bottom: 6px;
    border-bottom: 1px solid #d7dde7;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-sheet header span,
.project-quotes-panel .quote-editor-view .document-template-instance-preview-sheet footer span {
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-section {
    display: grid;
    gap: 4px;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-section h4 {
    margin: 0;
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
    text-transform: uppercase;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-section div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 10px;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-section p {
    display: grid;
    gap: 1px;
    margin: 0;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-section p span,
.project-quotes-panel .quote-editor-view .document-template-instance-preview-blockers span {
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .document-template-instance-preview-section p strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-preview-blockers {
    display: grid;
    gap: 4px;
    padding: 8px;
    border: 1px solid #f1c8c8;
    background: #fff7f7;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync {
    display: grid;
    gap: 8px;
    margin: 12px 0 18px;
    padding: 10px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #c1c7d2;
    border-radius: 0;
    background: #f4f3f2;
    color: #1a1c1c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync.is-blocked {
    border-left-color: #d13438;
    background: #fff7f7;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync header,
.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync header span {
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync header strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync header small {
    color: #605e5c;
    text-align: right;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync-summary {
    justify-content: flex-start;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-sync-summary span {
    min-height: 22px;
    padding: 2px 6px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid #c1c7d2;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route div {
    display: grid;
    gap: 2px;
    min-width: 0;
    min-height: 48px;
    padding: 6px 8px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route div.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route div.is-open {
    border-left-color: #727782;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route div.is-blocked {
    border-left-color: #d13438;
    background: #fff7f7;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route span {
    overflow: hidden;
    color: #004277;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-route small {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-result,
.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid #e3e8ef;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-result p,
.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks p {
    display: grid;
    gap: 2px;
    margin: 0;
    padding: 6px;
    border: 1px solid #d7dde7;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-result p span,
.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks p span,
.project-quotes-panel .quote-editor-view .quote-document-dms-status-result p small,
.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks p small {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-result p strong,
.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks p strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks p.ready {
    border-left: 3px solid #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-checks p.blocked {
    border-left: 3px solid #d13438;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-messages {
    display: grid;
    gap: 4px;
    padding: 8px;
    border: 1px solid #d7dde7;
    background: #fff;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-messages strong {
    color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.project-quotes-panel .quote-editor-view .quote-document-dms-status-actions .btn {
    min-height: 28px;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync {
    display: grid;
    gap: 8px;
    margin: 0 0 18px;
    padding: 10px;
    border: 1px solid #d7dde7;
    border-left: 3px solid #c1c7d2;
    background: #fbfaf6;
    color: #1a1c1c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync.is-blocked {
    border-left-color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync header,
.project-quotes-panel .quote-editor-view .quote-document-email-status-sync-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync header span {
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync header strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync header small {
    color: #605e5c;
    text-align: right;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync-summary {
    justify-content: flex-start;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-sync-summary span {
    padding: 2px 6px;
    border: 1px solid #d7dde7;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid #c1c7d2;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route div {
    display: grid;
    gap: 2px;
    min-width: 0;
    min-height: 48px;
    padding: 6px 8px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route div.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route div.is-open {
    border-left-color: #727782;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route div.is-blocked {
    border-left-color: #d13438;
    background: #fff7f7;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route span {
    overflow: hidden;
    color: #004277;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-route small {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-checks,
.project-quotes-panel .quote-editor-view .quote-document-email-status-outbox,
.project-quotes-panel .quote-editor-view .quote-document-email-status-provider {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid #e3e8ef;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-provider {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-checks p,
.project-quotes-panel .quote-editor-view .quote-document-email-status-outbox p,
.project-quotes-panel .quote-editor-view .quote-document-email-status-provider p {
    display: grid;
    gap: 2px;
    margin: 0;
    padding: 6px;
    border: 1px solid #d7dde7;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-checks p span,
.project-quotes-panel .quote-editor-view .quote-document-email-status-outbox p span,
.project-quotes-panel .quote-editor-view .quote-document-email-status-provider p span,
.project-quotes-panel .quote-editor-view .quote-document-email-status-checks p small,
.project-quotes-panel .quote-editor-view .quote-document-email-status-outbox p small,
.project-quotes-panel .quote-editor-view .quote-document-email-status-provider p small {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-checks p strong,
.project-quotes-panel .quote-editor-view .quote-document-email-status-outbox p strong,
.project-quotes-panel .quote-editor-view .quote-document-email-status-provider p strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-checks p.ready {
    border-left: 3px solid #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-checks p.blocked {
    border-left: 3px solid #d13438;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-messages {
    display: grid;
    gap: 4px;
    padding: 8px;
    border: 1px solid #d7dde7;
    background: #fff;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-document-email-status-messages strong {
    color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status {
    display: grid;
    gap: 8px;
    margin: 0 0 18px;
    padding: 10px;
    border: 1px solid #d7dde7;
    border-left: 3px solid #c1c7d2;
    background: #f8faf8;
    color: #1a1c1c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status.is-blocked {
    border-left-color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status.is-unchecked {
    border-left-color: #c1c7d2;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status header,
.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status header span {
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status header strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status header small {
    color: #605e5c;
    text-align: right;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-summary {
    justify-content: flex-start;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-summary span {
    padding: 2px 6px;
    border: 1px solid #d7dde7;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 7px 8px;
    border: 1px solid #d7dde7;
    border-left: 3px solid #107c10;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback.is-blocked {
    border-left-color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback .material-symbols-outlined {
    color: #107c10;
    font-size: 17px;
    line-height: 18px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback.is-blocked .material-symbols-outlined {
    color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback strong,
.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback strong {
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-feedback small {
    color: #605e5c;
    font-size: 10px;
    line-height: 13px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-flow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid #e3e8ef;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-flow p {
    display: grid;
    gap: 2px;
    margin: 0;
    padding: 6px;
    border: 1px solid #d7dde7;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-flow p.ready {
    border-left: 3px solid #107c10;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-flow p.pending {
    border-left: 3px solid #c1c7d2;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-flow p span,
.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-flow p small {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-flow p strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid #c1c7d2;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route div {
    display: grid;
    gap: 2px;
    min-width: 0;
    min-height: 48px;
    padding: 6px 8px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route div.ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route div.pending {
    border-left-color: #727782;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route div.blocked {
    border-left-color: #d13438;
    background: #fff7f7;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route span {
    overflow: hidden;
    color: #004277;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-to-invoice-route small {
    min-width: 0;
    overflow: hidden;
    color: #605e5c;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    border-top: 1px solid #e3e8ef;
    padding-top: 8px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-actions button {
    min-height: 26px;
    padding: 0 10px;
    border: 1px solid #c8d0dc;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 700;
    line-height: 24px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-actions button.primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-actions button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-actions span {
    margin-left: auto;
    color: #605e5c;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-messages {
    display: grid;
    gap: 4px;
    padding: 8px;
    border: 1px solid #d7dde7;
    background: #fff;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-commercial-handoff-status-messages strong {
    color: #d13438;
}

.project-quotes-panel .quote-editor-view .quote-company-line {
    width: fit-content;
    max-width: 100%;
    margin: 22px 0 18px;
    padding: 2px 4px 3px;
    border-bottom: 1px solid #c1c7d2;
    color: #605e5c;
    font-size: 11px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-address-meta {
    margin-top: 18px;
}

.project-quotes-panel .quote-editor-view .quote-address-block {
    min-width: 320px;
    color: #1a1c1c;
    font-size: 13px;
    line-height: 18px;
}

.project-quotes-panel .quote-editor-view .quote-project-heading {
    width: fit-content;
    max-width: 100%;
    margin: 30px 0 14px -4px;
    padding: 2px 4px;
}

.project-quotes-panel .quote-editor-view .quote-project-heading strong {
    display: block;
    min-width: 0;
    color: #0d1724;
    font-size: 20px;
    line-height: 26px;
    font-weight: 760;
    letter-spacing: 0;
}

.project-quotes-panel .quote-editor-view .quote-project-heading strong + strong {
    margin-top: 2px;
    color: #30363d;
    font-size: 15px;
    line-height: 20px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-template-intro,
.project-quotes-panel .quote-editor-view .quote-template-closing,
.project-quotes-panel .quote-editor-view .quote-template-footer {
    color: #605e5c;
    font-size: 11px;
    line-height: 16px;
}

.project-quotes-panel .quote-editor-view .quote-template-intro {
    margin: 0 0 10px;
}

.project-quotes-panel .quote-editor-view .quote-template-intro p,
.project-quotes-panel .quote-editor-view .quote-template-closing p {
    margin: 0;
}

.project-quotes-panel .quote-editor-view .quote-drop-hint {
    margin: 8px 0;
    padding: 14px;
    border: 2px dashed #c1c7d2;
    border-radius: 4px;
    background: #f4f3f2;
    color: #727782;
    text-align: center;
}

.project-quotes-panel .quote-editor-view .quote-document-inline-errors {
    display: grid;
    gap: 3px;
    margin: 6px 0;
    padding: 6px 8px;
    border: 1px solid #c50f1f;
    background: #fff4f4;
    color: #a80000;
    font-size: 11px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border: 0;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-col-drag {
    width: 24px;
}

.project-quotes-panel .quote-editor-view .quote-col-position {
    width: 88px;
}

.project-quotes-panel .quote-editor-view .quote-col-article-number {
    width: 92px;
}

.project-quotes-panel .quote-editor-view .quote-col-ean {
    width: 116px;
}

.project-quotes-panel .quote-editor-view .quote-col-quantity {
    width: 60px;
}

.project-quotes-panel .quote-editor-view .quote-col-unit {
    width: 52px;
}

.project-quotes-panel .quote-editor-view .quote-col-unit-price {
    width: 96px;
}

.project-quotes-panel .quote-editor-view .quote-col-markup {
    width: 86px;
}

.project-quotes-panel .quote-editor-view .quote-col-measurement {
    width: 104px;
}

.project-quotes-panel .quote-editor-view .quote-col-vat {
    width: 62px;
}

.project-quotes-panel .quote-editor-view .quote-col-line-total {
    width: 112px;
}

.project-quotes-panel .quote-editor-view .quote-col-actions {
    width: 30px;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone {
    position: relative;
    min-height: 70px;
    overflow: visible;
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-catalog-drop-state="armed"],
.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-catalog-drop-state="active"],
.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-document-row-reorder-state="armed"],
.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-document-row-reorder-state="active"] {
    outline: 2px dashed #005a9e;
    outline-offset: 3px;
    background: rgba(0, 90, 158, .035);
}

.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-catalog-drop-state="saving"]::after,
.project-quotes-panel .quote-editor-view .quote-positions-dropzone[data-quote-document-row-reorder-state="saving"]::after {
    position: absolute;
    inset: 8px 10px auto auto;
    z-index: 3;
    padding: 4px 8px;
    border: 1px solid #005a9e;
    background: #fff;
    color: #005a9e;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    content: "Position wird gespeichert";
}

.project-quotes-panel .quote-editor-view .quote-catalog-insert-marker-row {
    height: 0;
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-catalog-insert-marker-row td {
    position: relative;
    height: 0;
    padding: 0;
    border-bottom: 0;
    background: transparent;
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-catalog-insert-marker {
    position: absolute;
    z-index: 4;
    top: -10px;
    right: 0;
    left: 0;
    display: grid;
    grid-template-columns: minmax(20px, 1fr) auto minmax(20px, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 20px;
    padding: 2px 0;
    color: #005a9e;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-catalog-insert-marker::after,
.project-quotes-panel .quote-editor-view .quote-catalog-insert-line {
    content: "";
    height: 2px;
    background: #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-catalog-insert-marker strong {
    min-width: max-content;
    padding: 1px 6px;
    border: 1px solid #005a9e;
    background: #fff;
    color: #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item.is-catalog-insert-target td,
.project-quotes-panel .quote-editor-view .quote-doc-row-item.is-row-reorder-target td {
    background: rgba(211, 228, 255, .55);
    box-shadow: inset 0 1px 0 #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-table th,
.project-quotes-panel .quote-editor-view .quote-table td {
    box-sizing: border-box;
    padding: 3px 4px;
    border-bottom: 1px solid #8d97a1;
    vertical-align: top;
}

.project-quotes-panel .quote-editor-view .quote-table th {
    border-top: 2px solid #66707a;
    border-bottom: 1px solid #66707a;
    background: transparent;
    color: #30363d;
    font-weight: 500;
    text-align: left;
}

.project-quotes-panel .quote-editor-view .quote-table td small {
    display: block;
    margin-top: 2px;
    color: #605e5c;
    font-size: 10px;
    line-height: 12px;
}

.project-quotes-panel .quote-editor-view .quote-table .num {
    text-align: right;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-table .pos {
    overflow: hidden;
    white-space: nowrap;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.project-quotes-panel .quote-editor-view .quote-row-pos-value {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.project-quotes-panel .quote-editor-view .quote-position-title-text,
.project-quotes-panel .quote-editor-view .quote-position-item-text {
    display: block;
    overflow-wrap: anywhere;
}

.project-quotes-panel .quote-editor-view .quote-position-title-text {
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-position-item-text {
    font-weight: 400;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item[data-quote-document-row-type="heading"] .pos,
.project-quotes-panel .quote-editor-view .quote-doc-row-item[data-quote-document-row-type="section"] .pos {
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-doc-inline-input {
    width: 100%;
    min-width: 0;
    height: 18px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #1f2933;
    font: inherit;
    line-height: 16px;
}

.project-quotes-panel .quote-editor-view .quote-doc-inline-input:hover,
.project-quotes-panel .quote-editor-view .quote-doc-inline-input:focus {
    border-color: #8aa4c8;
    background: #fff;
    outline: none;
}

.project-quotes-panel .quote-editor-view .quote-doc-inline-select {
    padding: 0;
    -webkit-appearance: none;
    appearance: none;
    background-image: none;
    cursor: pointer;
}

.project-quotes-panel .quote-editor-view .quote-doc-inline-select::-ms-expand {
    display: none;
}

.project-quotes-panel .quote-editor-view .quote-doc-inline-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.project-quotes-panel .quote-editor-view .quote-doc-inline-position {
    font-variant-numeric: tabular-nums;
}

.project-quotes-panel .quote-editor-view .quote-drag-head,
.project-quotes-panel .quote-editor-view .quote-drag-cell,
.project-quotes-panel .quote-editor-view .quote-actions-head,
.project-quotes-panel .quote-editor-view .quote-row-actions-cell {
    text-align: center;
}

.project-quotes-panel .quote-editor-view .quote-drag-cell,
.project-quotes-panel .quote-editor-view .quote-row-actions-cell {
    padding-right: 1px;
    padding-left: 1px;
}

.project-quotes-panel .quote-editor-view .quote-money-table-cell,
.project-quotes-panel .quote-editor-view .line-total-cell {
    max-width: 0;
    overflow: hidden;
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-money-table-cell > *,
.project-quotes-panel .quote-editor-view .line-total-cell > * {
    max-width: 100%;
    box-sizing: border-box;
}

.project-quotes-panel .quote-editor-view .line-total-cell .line-total {
    display: block;
}

.project-quotes-panel .quote-editor-view .quote-row-drag-handle {
    width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #727782;
    cursor: grab;
    opacity: 0;
    pointer-events: none;
    user-select: none;
    transition: color 120ms ease, opacity 120ms ease, background-color 120ms ease;
}

.project-quotes-panel .quote-editor-view .quote-row-drag-handle .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-row-remove-button {
    width: 22px;
    height: 22px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #66707a;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: color 120ms ease, opacity 120ms ease, background-color 120ms ease;
}

.project-quotes-panel .quote-editor-view .quote-row-remove-button .material-symbols-outlined {
    font-size: 17px;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item:hover .quote-row-drag-handle:not([data-quote-document-row-drag-state="disabled"]),
.project-quotes-panel .quote-editor-view .quote-doc-row-item.is-row-dragging .quote-row-drag-handle,
.project-quotes-panel .quote-editor-view .quote-doc-row-item:hover .quote-row-remove-button,
.project-quotes-panel .quote-editor-view .quote-row-remove-button:focus-visible {
    opacity: 1;
    pointer-events: auto;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item:hover .quote-row-drag-handle:not([data-quote-document-row-drag-state="disabled"]):hover {
    background: #edf2f6;
    color: #23313f;
}

.project-quotes-panel .quote-editor-view .quote-row-remove-button:hover,
.project-quotes-panel .quote-editor-view .quote-row-remove-button:focus-visible {
    background: #fbe8e8;
    color: #b42318;
    outline: none;
}

.project-quotes-panel .quote-editor-view .quote-row-remove-button:focus-visible {
    box-shadow: 0 0 0 2px rgba(0, 90, 158, .25);
}

.project-quotes-panel .quote-editor-view .quote-row-remove-button:disabled {
    cursor: wait;
    opacity: .35;
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item:hover .quote-row-remove-button:disabled {
    opacity: .35;
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-row-drag-handle[draggable="true"]:active {
    cursor: grabbing;
}

.project-quotes-panel .quote-editor-view .quote-row-drag-handle[data-quote-document-row-drag-state="disabled"] {
    cursor: default;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item.is-row-dragging td {
    background: rgba(211, 228, 255, .35);
    opacity: .65;
}

@media (hover: none) {
    .project-quotes-panel .quote-editor-view .quote-doc-row-item.is-selected .quote-row-drag-handle:not([data-quote-document-row-drag-state="disabled"]),
    .project-quotes-panel .quote-editor-view .quote-doc-row-item.is-selected .quote-row-remove-button {
        opacity: 1;
        pointer-events: auto;
    }
}

.project-quotes-panel .quote-editor-view .quote-row-action-rail {
    position: absolute;
    top: 0;
    right: -28px;
    bottom: 0;
    width: 34px;
    pointer-events: none;
    z-index: 12;
}

.project-quotes-panel .quote-editor-view .quote-table tbody tr:nth-child(even) td {
    background: #f8f8f8;
}

.project-quotes-panel .quote-editor-view .quote-table tbody .quote-doc-row-item[data-quote-document-row-type="heading"]:not(.is-selected) td,
.project-quotes-panel .quote-editor-view .quote-table tbody .quote-doc-row-item[data-quote-document-row-type="section"]:not(.is-selected) td {
    background: #f3f6f8;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item[data-quote-document-row-type="heading"] td {
    border-top: 1px solid #66707a;
}

.project-quotes-panel .quote-editor-view .quote-table tbody tr.is-archived td {
    background: #f4f3f2;
    color: #727782;
}

.project-quotes-panel .quote-editor-view .quote-table tbody tr.is-archived strong {
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-row-archive-note {
    color: #a33a2b;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-template-closing {
    margin-top: 20px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-snapshot-strip {
    margin-top: 18px;
    padding: 8px 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    border-top: 1px solid #c1c7d2;
    border-bottom: 1px solid #c1c7d2;
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-snapshot-strip p {
    min-width: 0;
    margin: 0;
    display: grid;
    gap: 2px;
}

.project-quotes-panel .quote-editor-view .quote-commercial-snapshot-strip span,
.project-quotes-panel .quote-editor-view .quote-commercial-snapshot-strip small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-commercial-snapshot-strip span {
    color: #727782;
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
}

.project-quotes-panel .quote-editor-view .quote-commercial-snapshot-strip strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-commercial-snapshot-strip p:last-child strong {
    color: #004277;
}

.project-quotes-panel .quote-editor-view .quote-document-footer-summary {
    align-items: flex-end;
    margin-top: auto;
    padding-top: 40px;
    border-top: 1px solid #c1c7d2;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 16px;
}

.project-quotes-panel .quote-editor-view .quote-signature-block {
    width: 192px;
    color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-signature-block div {
    height: 40px;
    border-bottom: 1px solid #c1c7d2;
}

.project-quotes-panel .quote-editor-view .quote-signature-block span {
    display: block;
    margin-top: 4px;
}

.project-quotes-panel .quote-editor-view .quote-document-totals {
    width: 192px;
    display: grid;
    gap: 0;
}

.project-quotes-panel .quote-editor-view .quote-document-totals div,
.project-quotes-panel .quote-editor-view .quote-summary-list div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.project-quotes-panel .quote-editor-view .quote-document-grand-total,
.project-quotes-panel .quote-editor-view .quote-summary-total {
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px solid #1a1c1c;
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-totals strong {
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-side-panel {
    width: 360px;
    min-width: 360px;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-side-tabs {
    min-height: 32px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-quotes-panel .quote-editor-view .quote-side-collapse-toggle,
.project-quotes-panel .quote-editor-view .quote-side-summary-tab {
    min-height: 32px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #605e5c;
    font-size: 11px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-side-collapse-toggle {
    border-bottom: 2px solid #005a9e;
    color: #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-side-body {
    display: grid;
    gap: 12px;
    padding: 12px;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-detail-card {
    display: grid;
    gap: 10px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.project-quotes-panel .quote-editor-view .quote-detail-card h2 {
    margin: 0;
    padding-bottom: 8px;
    border-bottom: 1px solid #c1c7d2;
    font-size: 12px;
}

.project-quotes-panel .quote-editor-view .quote-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.project-quotes-panel .quote-editor-view .quote-detail-field {
    display: grid;
    gap: 4px;
    color: #605e5c;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-detail-field.span-2 {
    grid-column: 1 / -1;
}

.project-quotes-panel .quote-editor-view .quote-detail-field em {
    color: #d44b4b;
    font-style: normal;
}

.project-quotes-panel .quote-editor-view .quote-detail-field[hidden],
.project-quotes-panel .quote-editor-view .quote-text-editor-tools[hidden] {
    display: none !important;
}

.project-quotes-panel .quote-editor-view .quote-detail-field input,
.project-quotes-panel .quote-editor-view .quote-detail-field select,
.project-quotes-panel .quote-editor-view .quote-detail-field textarea {
    min-width: 0;
    min-height: 28px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-detail-field textarea {
    min-height: 96px;
    padding-top: 7px;
}

.project-quotes-panel .quote-editor-view .quote-text-editor-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    padding: 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f4f3f2;
}

.project-quotes-panel .quote-editor-view .quote-text-editor-tools button,
.project-quotes-panel .quote-editor-view .quote-text-editor-tools select {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #e9e8e7;
    color: #1a1c1c;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-money-input {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
}

.project-quotes-panel .quote-editor-view .quote-money-input input {
    border-radius: 2px 0 0 2px;
}

.project-quotes-panel .quote-editor-view .quote-money-input strong {
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-left: 0;
    border-radius: 0 2px 2px 0;
    background: #f4f3f2;
    color: #605e5c;
    font-size: 10px;
}

.project-quotes-panel .quote-editor-view .quote-detail-helper {
    margin: -4px 0 0;
    color: #605e5c;
    font-size: 9px;
    text-align: right;
}

.project-quotes-panel .quote-editor-view .quote-detail-actions {
    display: grid;
    gap: 8px;
}

.project-quotes-panel .quote-editor-view .quote-sort-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px 38px 30px;
    align-items: center;
    color: #605e5c;
    font-size: 10px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-sort-control button,
.project-quotes-panel .quote-editor-view .quote-sort-control strong {
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-sort-control button:first-of-type {
    border-radius: 2px 0 0 2px;
}

.project-quotes-panel .quote-editor-view .quote-sort-control button:last-of-type {
    border-radius: 0 2px 2px 0;
}

.project-quotes-panel .quote-editor-view .quote-sort-control strong {
    border-left: 0;
    border-right: 0;
}

.project-quotes-panel .quote-editor-view .quote-sort-control button:disabled,
.project-quotes-panel .quote-editor-view .quote-delete-position:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.project-quotes-panel .quote-editor-view .quote-delete-position {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid #d8c58d;
    border-radius: 2px;
    background: #fffaf0;
    color: #6d5200;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-position-source-strip,
.project-quotes-panel .quote-editor-view .quote-position-snapshot-strip,
.project-quotes-panel .quote-editor-view .quote-position-total-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-quotes-panel .quote-editor-view .quote-position-source-strip.is-edit-context,
.project-quotes-panel .quote-editor-view .quote-position-total-strip.is-edit-snapshot {
    background: #fafafa;
}

.project-quotes-panel .quote-editor-view .quote-position-source-strip.is-form-prefill {
    border-color: #a7c4e4;
    background: #f8fbff;
}

.project-quotes-panel .quote-editor-view .quote-position-snapshot-strip {
    border-color: #d7dce3;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-position-total-strip.is-server-snapshot {
    border-color: #b7d7b4;
    background: #f5fbf4;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px;
    border: 1px solid #b7d7b4;
    background: #f5fbf4;
    color: #1f5c28;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback strong,
.project-quotes-panel .quote-editor-view .quote-position-save-feedback small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback.is-archive {
    border-color: #d6c28b;
    background: #fffaf0;
    color: #705100;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback.is-archive small {
    white-space: normal;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback.is-restore {
    border-color: #9fcf9a;
    background: #f1fbf0;
    color: #245a24;
}

.project-quotes-panel .quote-editor-view .quote-position-save-feedback.is-restore small {
    white-space: normal;
}

.project-quotes-panel .quote-editor-view .quote-position-archived-detail {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px;
    border: 1px solid #d8c58d;
    background: #fffaf0;
    color: #6d5200;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-position-archived-detail .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-position-archived-detail div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-quotes-panel .quote-editor-view .quote-position-archived-detail small {
    overflow-wrap: anywhere;
}

.project-quotes-panel .quote-editor-view .quote-detail-readonly-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #d8c58d;
    background: #fffaf0;
    color: #6d5200;
    font-size: 11px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-position-archive-dialog {
    display: grid;
    gap: 10px;
    padding: 10px;
    border: 1px solid #d7dce3;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-position-archive-dialog .form-head {
    margin-bottom: 0;
}

.project-quotes-panel .quote-editor-view .quote-position-archive-dialog textarea {
    min-height: 74px;
}

.project-quotes-panel .quote-editor-view .quote-position-source-strip p,
.project-quotes-panel .quote-editor-view .quote-position-snapshot-strip p,
.project-quotes-panel .quote-editor-view .quote-position-total-strip p {
    min-width: 0;
    margin: 0;
    padding: 8px;
    border-left: 1px solid #d8dde6;
    color: #605e5c;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-position-source-strip p:first-child,
.project-quotes-panel .quote-editor-view .quote-position-snapshot-strip p:first-child,
.project-quotes-panel .quote-editor-view .quote-position-total-strip p:first-child {
    border-left: 0;
}

.project-quotes-panel .quote-editor-view .quote-position-source-strip span,
.project-quotes-panel .quote-editor-view .quote-position-snapshot-strip span,
.project-quotes-panel .quote-editor-view .quote-position-total-strip span,
.project-quotes-panel .quote-editor-view .quote-position-source-strip small,
.project-quotes-panel .quote-editor-view .quote-position-snapshot-strip small,
.project-quotes-panel .quote-editor-view .quote-position-total-strip small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-position-source-strip strong,
.project-quotes-panel .quote-editor-view .quote-position-snapshot-strip strong,
.project-quotes-panel .quote-editor-view .quote-position-total-strip strong {
    display: block;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-summary-card {
    padding: 10px;
    border: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.project-quotes-panel .quote-editor-view .quote-summary-list {
    display: grid;
    gap: 6px;
    color: #605e5c;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-summary-list strong {
    color: #1a1c1c;
}

.project-quotes-panel .quote-editor-view .quote-readiness-card-head {
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.project-quotes-panel .quote-editor-view .quote-readiness-card-head h2 {
    padding-bottom: 0;
    border-bottom: 0;
}

.project-quotes-panel .quote-editor-view .quote-document-generation-card .btn {
    min-height: 28px;
    border-radius: 2px;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step {
    min-width: 0;
    display: grid;
    gap: 2px;
    padding: 6px;
    border: 1px solid #d8dce3;
    border-left: 3px solid #8a8886;
    background: #fff;
    color: #605e5c;
    font-size: 10px;
    line-height: 1.25;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step.is-ready {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step.is-open,
.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step.is-unchecked {
    border-left-color: #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step.is-blocked {
    border-left-color: #c50f1f;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step span,
.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step span {
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-sidepanel-status-step strong {
    color: #1a1c1c;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-template-selection {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    gap: 6px;
    align-items: end;
    padding: 8px;
    border: 1px solid #d8dce3;
    background: #f4f3f2;
}

.project-quotes-panel .quote-editor-view .quote-template-selection label {
    grid-column: 1 / -1;
    color: #605e5c;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-quotes-panel .quote-editor-view .quote-template-selection select {
    min-width: 0;
    height: 28px;
    padding: 0 8px;
    border: 1px solid #aeb6c2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-template-selection small {
    grid-column: 1 / -1;
    color: #605e5c;
    font-size: 10px;
    line-height: 1.3;
}

.project-quotes-panel .quote-editor-view .quote-document-action-row {
    position: relative;
    border-left: 3px solid #005a9e;
    background: #f7f9fb;
}

.project-quotes-panel .quote-editor-view .quote-document-action-row::before {
    content: attr(data-quote-document-action-label);
    grid-column: 1 / -1;
    display: block;
    color: #605e5c;
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-document-action-row[data-quote-document-action-group="basis"] {
    border-left-color: #605e5c;
}

.project-quotes-panel .quote-editor-view .quote-document-action-row[data-quote-document-action-group="template"],
.project-quotes-panel .quote-editor-view .quote-document-action-row[data-quote-document-action-group="instance"],
.project-quotes-panel .quote-editor-view .quote-document-action-row[data-quote-document-action-group="preview"] {
    border-left-color: #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-document-action-row[data-quote-document-action-group="dms"] {
    border-left-color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-document-action-row[data-quote-document-action-group="email"] {
    border-left-color: #c50f1f;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-fields {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e3e2e1;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-fields-head,
.project-quotes-panel .quote-editor-view .quote-document-instance-field-section header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #605e5c;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-fields-head strong,
.project-quotes-panel .quote-editor-view .quote-document-instance-field-section header span {
    color: #1a1c1c;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field-section {
    display: grid;
    gap: 6px;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field {
    display: grid;
    gap: 3px;
    font-size: 10px;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field span {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #605e5c;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field em {
    color: #d13438;
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field input,
.project-quotes-panel .quote-editor-view .quote-document-instance-field textarea {
    width: 100%;
    min-height: 28px;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
    font: inherit;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field textarea {
    min-height: 72px;
    resize: vertical;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field.readonly {
    padding: 6px;
    border: 1px solid #e3e2e1;
    background: #f8f8f8;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field.readonly strong {
    color: #1a1c1c;
}

.project-quotes-panel .quote-editor-view .quote-document-instance-field small,
.project-quotes-panel .quote-editor-view .quote-document-instance-field-message {
    color: #727782;
    font-size: 10px;
    line-height: 14px;
}

.project-quotes-panel .quote-editor-view .quote-readiness-summary {
    padding-top: 4px;
    border-top: 1px solid #d8dce3;
}

.project-quotes-panel .quote-editor-view .quote-readiness-template-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.project-quotes-panel .quote-editor-view .quote-readiness-template-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 22px;
    max-width: 100%;
    padding: 2px 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-readiness-template-chip small {
    color: #605e5c;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-readiness-template-chip.blocked {
    border-color: #c50f1f;
    color: #a80000;
}

.project-quotes-panel .quote-editor-view .quote-readiness-checks {
    display: grid;
    gap: 4px;
}

.project-quotes-panel .quote-editor-view .quote-readiness-check {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 8px;
    padding: 6px;
    border-left: 3px solid #107c10;
    background: #fff;
    font-size: 10px;
}

.project-quotes-panel .quote-editor-view .quote-readiness-check.blocked {
    border-left-color: #c50f1f;
}

.project-quotes-panel .quote-editor-view .quote-readiness-check span,
.project-quotes-panel .quote-editor-view .quote-readiness-check strong {
    color: #1a1c1c;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-readiness-check small {
    grid-column: 1 / -1;
    color: #605e5c;
    line-height: 1.25;
}

.project-quotes-panel .quote-editor-view .quote-readiness-warnings {
    display: grid;
    gap: 4px;
    color: #8a5a00;
    font-size: 10px;
    line-height: 1.3;
}

.project-quotes-panel .quote-editor-view .quote-template-runtime {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.project-quotes-panel .quote-editor-view .quote-template-runtime span {
    min-height: 20px;
    padding: 3px 7px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #d8dce3;
    border-radius: 999px;
    background: #fff;
    color: #605e5c;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-template-runtime span.ready {
    border-color: #b7e4c2;
    background: #e8f8ed;
    color: #107c10;
}

.project-quotes-panel .quote-editor-view .quote-template-runtime span.warning {
    border-color: #f7d690;
    background: #fff8e1;
    color: #8a5a00;
}

.project-quotes-panel .quote-editor-view .quote-add-free-position {
    width: 100%;
    height: 32px;
    border-color: #1a1c1c;
    background: #1a1c1c;
    color: #faf9f8;
}

.project-quotes-panel .quote-editor-view .quote-splitter {
    position: relative;
    height: 4px;
    margin: -2px 0;
    padding: 2px 0;
    border: 0;
    background: #e3e2e1;
    background-clip: content-box;
    cursor: row-resize;
    touch-action: none;
    user-select: none;
    -webkit-user-drag: none;
    z-index: 3;
}

.project-quotes-panel .quote-editor-view .quote-splitter::before {
    display: none;
}

.project-quotes-panel .quote-editor-view .quote-splitter:hover,
.project-quotes-panel .quote-editor-view .quote-splitter.is-resizing {
    background: #c7ced6;
    background-clip: content-box;
}

.project-quotes-panel .quote-editor-view .quote-splitter::after {
    display: none;
}

.project-quotes-panel .quote-editor-view .quote-resize-capture {
    position: absolute;
    inset: 0;
    z-index: 12;
    cursor: row-resize;
    touch-action: none;
    user-select: none;
    background: transparent;
}

.project-quotes-panel .quote-editor-view .quote-catalog {
    min-height: 0;
    display: grid;
    grid-template-rows: var(--quote-catalog-head-height) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.project-quotes-panel .quote-editor-view .quote-catalog-head {
    min-height: var(--quote-catalog-head-height);
    display: grid;
    grid-template-columns: minmax(380px, max-content) minmax(220px, 1fr) max-content;
    gap: 12px;
    align-items: center;
    padding: 0 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #f7f9fb;
}

.project-quotes-panel .quote-editor-view .quote-catalog-tabs {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
    justify-self: start;
    min-width: 0;
}

.project-quotes-panel .quote-editor-view .quote-tab {
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #605e5c;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-tab small {
    margin-left: 4px;
    color: #727782;
    font-size: 9px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-tab.active {
    border-color: #c1c7d2;
    background: #fff;
    color: #1a1c1c;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .catalog-collapsed .quote-tab[data-quote-collapsed-picker-draggable="true"] {
    cursor: grab;
}

.project-quotes-panel .quote-editor-view .catalog-collapsed .quote-tab[data-quote-collapsed-picker-draggable="true"]:hover,
.project-quotes-panel .quote-editor-view .catalog-collapsed .quote-tab[data-quote-collapsed-picker-draggable="true"]:focus-visible {
    border-color: #9ebce8;
    background: #eaf4ff;
    color: #004277;
}

.project-quotes-panel .quote-editor-view .catalog-collapsed .quote-tab[data-quote-collapsed-picker-draggable="true"]:active {
    cursor: grabbing;
}

.project-quotes-panel .quote-editor-view .quote-catalog-search {
    width: 100%;
    max-width: 560px;
    justify-self: center;
    flex: 0 1 auto;
    min-width: 220px;
    position: relative;
}

.project-quotes-panel .quote-editor-view .quote-catalog-search::before {
    content: "search";
    position: absolute;
    left: 8px;
    top: 50%;
    z-index: 1;
    transform: translateY(-50%);
    color: #727782;
    font-family: "Material Symbols Outlined";
    font-size: 14px;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-catalog-search input {
    width: 100%;
    height: 24px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 0 10px 0 28px;
    font-size: 12px;
}

.project-quotes-panel .quote-editor-view .quote-catalog-head > .quote-icon-button {
    justify-self: end;
}

.project-quotes-panel .quote-editor-view .quote-catalog-actions {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.project-quotes-panel .quote-editor-view .quote-lock-button-active {
    border-color: #005a9e;
    background: #eef4ff;
    color: #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-catalog-main {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: 192px minmax(0, 1fr);
    overflow: hidden;
}

.project-quotes-panel .quote-editor-view .quote-tree {
    overflow: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
    padding: 8px;
    border-right: 1px solid #c1c7d2;
    background: #f7f8fa;
}

.project-quotes-panel .quote-editor-view .quote-tree::-webkit-scrollbar {
    width: 4px;
}

.project-quotes-panel .quote-editor-view .quote-tree::-webkit-scrollbar-track {
    background: transparent;
}

.project-quotes-panel .quote-editor-view .quote-tree::-webkit-scrollbar-thumb {
    background: #c9c6c3;
    border-radius: 2px;
}

.project-quotes-panel .quote-editor-view .quote-tree-group,
.project-quotes-panel .quote-editor-view .quote-tree-node {
    display: grid;
    gap: 10px;
}

.project-quotes-panel .quote-editor-view .quote-tree-title {
    margin: 0;
    min-height: 24px;
    display: flex;
    align-items: center;
    padding: 0 4px;
    color: #727782;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.project-quotes-panel .quote-editor-view .quote-tree-node-row {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 2px;
}

.project-quotes-panel .quote-editor-view .quote-tree-toggle {
    width: 22px;
    height: 24px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #9aa6b2;
    font-size: 0;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-tree-toggle::before {
    content: "expand_more";
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    line-height: 1;
}

.project-quotes-panel .quote-editor-view .quote-tree-node.is-collapsed .quote-tree-toggle::before {
    display: inline-block;
    transform: rotate(-90deg);
}

.project-quotes-panel .quote-editor-view .quote-tree-toggle-placeholder::before {
    content: "";
}

.project-quotes-panel .quote-editor-view .quote-tree-node.is-collapsed .quote-tree-sublist {
    display: none;
}

.project-quotes-panel .quote-editor-view .quote-tree-sublist {
    display: grid;
    gap: 2px;
    margin-left: 25px;
    padding-left: 8px;
    border-left: 1px solid #c1c7d2;
}

.project-quotes-panel .quote-editor-view .quote-tree-item {
    min-width: 0;
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #605e5c;
    font-size: 11px;
    font-weight: 650;
    text-align: left;
}

.project-quotes-panel .quote-editor-view .quote-tree-item span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-tree-item-static {
    cursor: default;
}

.project-quotes-panel .quote-editor-view .quote-tree-item small {
    margin-left: auto;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-tree-item.active,
.project-quotes-panel .quote-editor-view .quote-tree-item:hover {
    border-color: #cfd7e0;
    background: #eaf0f7;
    color: #004277;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-tree-item:hover {
    background: #efeeed;
}

.project-quotes-panel .quote-editor-view .quote-folder-icon {
    width: 12px;
    height: 9px;
    border: 1px solid #8c99a7;
    border-top-width: 4px;
    border-radius: 1px;
}

.project-quotes-panel .quote-editor-view .quote-library {
    min-height: 0;
    overflow: auto;
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 12px;
}

.project-quotes-panel .quote-editor-view .quote-catalog-quickbar {
    min-height: 32px;
    display: grid;
    grid-template-columns: 126px 190px 190px minmax(220px, 1fr);
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-bottom: 1px solid #d8dce3;
    background: #fbfbfb;
}

.project-quotes-panel .quote-editor-view .quote-catalog-quickbar label {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 6px;
    margin: 0;
    color: #605e5c;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-quotes-panel .quote-editor-view .quote-catalog-quickbar select {
    min-width: 0;
    height: 24px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.project-quotes-panel .quote-editor-view .quote-catalog-route {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    overflow: hidden;
}

.project-quotes-panel .quote-editor-view .quote-catalog-route span,
.project-quotes-panel .quote-editor-view .quote-catalog-route strong {
    min-width: 0;
    max-width: 150px;
    overflow: hidden;
    padding: 2px 6px;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #004277;
    font-size: 10px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-catalog-route strong {
    border-color: #005a9e;
    background: #eaf4ff;
    color: #003a66;
}

.project-quotes-panel .quote-editor-view .quote-text-title-manage {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
    padding: 2px 8px;
    border: 1px solid #9ebce8;
    border-radius: 2px;
    background: #fff;
    color: #004277;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-text-title-manage:hover,
.project-quotes-panel .quote-editor-view .quote-text-title-manage:focus-visible {
    border-color: #005a9e;
    background: #eaf4ff;
}

.project-quotes-panel .quote-editor-view .quote-text-title-manage .material-symbols-outlined {
    font-size: 15px;
}

.project-quotes-panel .quote-editor-view .quote-text-title-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 3px 0;
    border-bottom: 1px solid #d8dce3;
}

.project-quotes-panel .quote-editor-view .quote-text-title-actions button,
.quote-text-title-manager-toolbar button,
.quote-text-title-type-switch button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 26px;
    padding: 3px 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #2e353c;
    font-size: 11px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-text-title-actions button:hover,
.quote-text-title-manager-toolbar button:hover,
.quote-text-title-type-switch button:hover,
.quote-text-title-type-switch button.is-active {
    border-color: #005a9e;
    background: #eaf4ff;
    color: #004277;
}

.project-quotes-panel .quote-editor-view .quote-text-title-actions .material-symbols-outlined,
.quote-text-title-manager-toolbar .material-symbols-outlined,
.quote-text-title-type-switch .material-symbols-outlined {
    font-size: 16px;
}

.project-quotes-panel .quote-editor-view .quote-text-title-list {
    display: grid;
    align-content: start;
    gap: 4px;
}

.project-quotes-panel .quote-editor-view .quote-text-title-header {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    gap: 8px;
    min-height: 25px;
    align-items: center;
    padding: 0 10px;
    border-bottom: 1px solid #cfd5df;
    color: #5f6873;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-quotes-panel .quote-editor-view .quote-text-title-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-height: 48px;
    border: 1px solid #cfd5df;
    border-radius: 2px;
    background: #fbfcfd;
    overflow: hidden;
}

.project-quotes-panel .quote-editor-view .quote-text-title-card:hover,
.project-quotes-panel .quote-editor-view .quote-text-title-card.is-selected {
    border-color: #8eb5de;
    background: #eef6ff;
}

.project-quotes-panel .quote-editor-view .quote-text-title-card.is-heading {
    border-left: 3px solid #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-text-title-card[data-quote-catalog-item-draggable="true"] {
    cursor: grab;
}

.project-quotes-panel .quote-editor-view .quote-text-title-card[data-quote-catalog-item-drag-state="dragging"] {
    cursor: grabbing;
    opacity: .68;
}

.project-quotes-panel .quote-editor-view .quote-text-title-body {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 6px 10px;
    border: 0;
    background: transparent;
    color: #20252b;
    text-align: left;
}

.project-quotes-panel .quote-editor-view .quote-text-title-code {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    color: #004277;
}

.project-quotes-panel .quote-editor-view .quote-text-title-code .material-symbols-outlined {
    flex: 0 0 auto;
    font-size: 17px;
}

.project-quotes-panel .quote-editor-view .quote-text-title-code strong {
    min-width: 0;
    overflow: hidden;
    font-size: 10px;
    font-variant-numeric: tabular-nums;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-text-title-body:disabled {
    color: #20252b;
    opacity: .65;
}

.quote-text-title-kind {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 1px solid #cad2dc;
    border-radius: 2px;
    background: #f4f7fa;
    color: #005a9e;
}

.quote-text-title-kind .material-symbols-outlined {
    font-size: 18px;
}

.project-quotes-panel .quote-editor-view .quote-text-title-copy,
.quote-text-title-manager-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-quotes-panel .quote-editor-view .quote-text-title-copy strong,
.project-quotes-panel .quote-editor-view .quote-text-title-copy small,
.quote-text-title-manager-copy strong,
.quote-text-title-manager-copy small,
.quote-text-title-manager-copy em {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-text-title-card.is-heading .quote-text-title-copy strong {
    color: #172330;
    font-size: 12px;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-text-title-copy strong {
    font-size: 11px;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-text-title-copy small,
.quote-text-title-manager-copy small,
.quote-text-title-manager-copy em {
    color: #687482;
    font-size: 10px;
    font-style: normal;
}

.quote-text-title-catalog-backdrop {
    z-index: 1510;
}

.project-modal.quote-text-title-catalog-modal {
    position: fixed;
    z-index: 1520;
    top: 50%;
    left: 50%;
    display: flex;
    flex-direction: column;
    width: min(900px, calc(100vw - 64px));
    height: min(720px, calc(100vh - 72px));
    margin: 0;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #aeb8c4;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 16px 42px rgba(24, 37, 51, .24);
}

.quote-text-title-catalog-modal .modal-head,
.quote-text-title-catalog-modal .modal-actions {
    flex: 0 0 auto;
}

.quote-text-title-catalog-modal .modal-head > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.quote-text-title-catalog-modal .modal-head strong {
    font-size: 15px;
}

.quote-text-title-catalog-modal .modal-head span {
    color: #687482;
    font-size: 10px;
}

.quote-text-title-catalog-body {
    min-height: 0;
    overflow: auto;
}

.quote-text-title-manager-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #d8dce3;
}

.quote-text-title-manager-toolbar > div {
    display: flex;
    gap: 6px;
}

.quote-text-title-manager-toolbar label {
    width: min(360px, 45%);
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    min-height: 30px;
    padding: 0 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.quote-text-title-manager-toolbar input {
    min-width: 0;
    border: 0;
    outline: 0;
}

.quote-text-title-manager-list {
    display: grid;
    align-content: start;
    gap: 5px;
    margin-top: 10px;
}

.quote-text-title-manager-list article {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 32px 32px;
    align-items: center;
    gap: 8px;
    min-height: 54px;
    padding: 5px 7px;
    border: 1px solid #d3d9e1;
    border-radius: 2px;
    background: #fbfcfd;
}

.quote-text-title-manager-list article > button {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #48535f;
}

.quote-text-title-manager-list article > button:hover,
.quote-text-title-manager-list article > button:focus-visible {
    border-color: #9ebce8;
    background: #eaf4ff;
    color: #004277;
}

.quote-text-title-manager-list article > button:last-child:hover,
.quote-text-title-manager-list article > button:last-child:focus-visible {
    border-color: #e5a9a9;
    background: #fff0f0;
    color: #9d1c1c;
}

.quote-text-title-manager-list article > button .material-symbols-outlined {
    font-size: 18px;
}

.quote-text-title-form {
    display: grid;
    gap: 14px;
}

.quote-text-title-type-switch {
    display: flex;
    gap: 6px;
}

.quote-text-title-form-grid {
    align-items: start;
}

.quote-text-title-form-grid textarea {
    resize: vertical;
}

.quote-text-title-archive-confirm {
    display: grid;
    grid-template-columns: 24px minmax(180px, auto) minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 8px;
    border: 1px solid #e2b6b6;
    border-radius: 2px;
    background: #fff5f5;
    color: #6e1a1a;
    font-size: 11px;
}

.quote-text-title-archive-confirm button {
    min-height: 26px;
    padding: 3px 9px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    font-weight: 800;
}

.quote-text-title-archive-confirm button.danger {
    border-color: #a4262c;
    background: #a4262c;
    color: #fff;
}

.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip {
    min-height: 42px;
    display: grid;
    grid-template-columns: minmax(260px, 1.6fr) 132px minmax(150px, 1fr) 118px 112px;
    align-items: stretch;
    gap: 0;
    margin-bottom: 2px;
    border: 1px solid #9ebce8;
    border-left: 3px solid #005a9e;
    background: #eef6ff;
}

.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip span {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 1px;
    padding: 5px 8px;
    border-right: 1px solid #cbdcf3;
}

.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip span:last-child {
    border-right: 0;
}

.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip small,
.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip strong,
.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip em {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip small {
    color: #004277;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.project-quotes-panel .quote-editor-view .quote-catalog-selection-strip em {
    color: #605e5c;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
}

.project-quotes-panel .quote-editor-view .quote-catalog-load-error {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 2px 0 6px;
}

.project-quotes-panel .quote-editor-view .quote-catalog-load-retry {
    min-height: 22px;
    padding: 0 8px;
    font-size: 10px;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-lib-header {
    display: grid;
    grid-template-columns: 132px minmax(260px, 1fr) 72px 128px;
    align-items: center;
    gap: 8px;
}

.project-quotes-panel .quote-editor-view .quote-lib-header {
    min-height: 28px;
    padding: 0 12px;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-quotes-panel .quote-editor-view .quote-lib-card {
    display: grid;
    grid-template-columns: 132px minmax(260px, 1fr) 72px 128px;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 52px;
    padding: 10px 12px;
    border: 1px solid #c1c7d2;
    background: #fafbfd;
    color: #1a1c1c;
    font-size: 12px;
}

.project-quotes-panel .quote-editor-view .quote-lib-card[data-quote-catalog-item-card] {
    grid-template-columns: minmax(0, 1fr);
}

.project-quotes-panel .quote-editor-view .quote-lib-card:nth-child(even) {
    background: #fafbfd;
}

.project-quotes-panel .quote-editor-view .quote-lib-card:hover {
    background: rgba(211, 228, 255, .55);
}

.project-quotes-panel .quote-editor-view .quote-lib-card.is-selected {
    border-color: #005a9e;
    background: #eaf4ff;
    box-shadow: inset 3px 0 0 #005a9e;
}

.project-quotes-panel .quote-editor-view .quote-lib-card[data-quote-catalog-item-draggable="true"] {
    cursor: grab;
}

.project-quotes-panel .quote-editor-view .quote-lib-card.is-dragging {
    border-color: #005a9e;
    background: #eaf4ff;
    opacity: .72;
}

.project-quotes-panel .quote-editor-view .quote-lib-card.is-dragging .quote-lib-select {
    cursor: grabbing;
}

.project-quotes-panel .quote-editor-view .quote-lib-select {
    display: grid;
    grid-template-columns: 132px minmax(260px, 1fr) 72px 128px;
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 27px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
}

.project-quotes-panel .quote-editor-view .quote-lib-select:disabled {
    cursor: default;
    opacity: .65;
}

.project-quotes-panel .quote-editor-view .quote-lib-select strong,
.project-quotes-panel .quote-editor-view .quote-lib-select small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-lib-select strong {
    color: #2e353c;
    font-size: 13px;
}

.project-quotes-panel .quote-editor-view .quote-lib-select small {
    color: #727782;
}

.project-quotes-panel .quote-editor-view .quote-lib-snapshot {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
    min-width: 0;
}

.project-quotes-panel .quote-editor-view .quote-lib-snapshot span {
    display: inline-flex;
    align-items: center;
    min-height: 16px;
    padding: 1px 5px;
    border: 1px solid #d2d8e2;
    background: #fff;
    color: #4b5563;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

.project-quotes-panel .quote-editor-view .quote-lib-snapshot .quote-catalog-price-readiness.is-ready {
    border-color: #b7e4c7;
    background: #ecfdf3;
    color: #067647;
}

.project-quotes-panel .quote-editor-view .quote-lib-snapshot .quote-catalog-price-readiness.is-warning {
    border-color: #fedf89;
    background: #fff4de;
    color: #946200;
}

.project-quotes-panel .quote-editor-view .quote-lib-snapshot .quote-catalog-price-readiness.is-blocked {
    border-color: #d2d8e2;
    background: #eef2f6;
    color: #5d6673;
}

.project-quotes-panel .quote-editor-view .quote-lib-code {
    color: #004277;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.project-quotes-panel .quote-editor-view .quote-lib-price {
    font-variant-numeric: tabular-nums;
}

.project-quotes-panel .quote-editor-view .quote-lib-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
    min-width: 94px;
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid #9ebce8;
    border-radius: 0;
    background: #d3e4ff;
    color: #001c38;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    opacity: 1;
}

.project-quotes-panel .quote-editor-view .quote-lib-add:focus-visible {
    background: #b8d5ff;
    border-color: #6e9bd7;
}

.project-quotes-panel .quote-editor-view .quote-lib-add:disabled {
    opacity: .65;
}

.project-quotes-panel .quote-editor-view .quote-library .project-form-errors {
    margin: 4px 0 8px;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item {
    cursor: pointer;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item[data-quote-document-position-dblclick-modal] {
    cursor: pointer;
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item[data-quote-document-position-dblclick-modal]:hover td {
    background: rgba(211, 228, 255, .28);
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item.selected {
    background: rgba(211, 228, 255, .55);
}

.project-quotes-panel .quote-editor-view .quote-doc-row-item.is-selected td {
    background: rgba(211, 228, 255, .55);
    box-shadow: inset 0 1px 0 #004277, inset 0 -1px 0 #004277;
}

.project-quotes-panel .quote-editor-view .quote-doc-commercial-row td {
    color: #1f2937;
    font-variant-numeric: tabular-nums;
}

.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-chapter-total td,
.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-subchapter-total td,
.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-carry-in td,
.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-carry-out td {
    border-top: 1px solid #334155;
    font-weight: 800;
}

.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-chapter-total td,
.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-subchapter-total td {
    border-bottom: 2px solid #334155;
}

.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-chapter-total td {
    background: #eef4f8;
}

.project-quotes-panel .quote-editor-view .quote-doc-commercial-row.row-carry-in td {
    background: #f8fafc;
}

.project-quotes-panel .quote-editor-view .quote-doc-commercial-row .quote-row-actions-cell,
.project-quotes-panel .quote-editor-view .quote-doc-commercial-row .quote-drag-cell {
    pointer-events: none;
}

.project-quotes-panel .quote-editor-view .quote-lib-empty {
    margin: 12px;
    padding: 14px;
    border: 1px dashed #c1c7d2;
    background: #f4f3f2;
    color: #727782;
    font-size: 12px;
}

.quote-catalog-picker-backdrop {
    z-index: 1530;
}

.project-modal.quote-catalog-picker-modal {
    position: fixed;
    z-index: 1540;
    top: 50%;
    left: 50%;
    width: min(1080px, calc(100vw - 64px));
    height: min(720px, calc(100vh - 72px));
    margin: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #aeb8c4;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 16px 42px rgba(24, 37, 51, .24);
}

.quote-catalog-picker-modal .modal-head,
.quote-catalog-picker-modal .modal-actions {
    flex: 0 0 auto;
}

.quote-catalog-picker-modal .modal-head > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.quote-catalog-picker-modal .modal-head strong {
    color: #1a1c1c;
    font-size: 15px;
}

.quote-catalog-picker-modal .modal-head span,
.quote-catalog-picker-modal .modal-actions > span {
    min-width: 0;
    overflow: hidden;
    color: #687482;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quote-catalog-picker-modal .modal-actions {
    justify-content: space-between;
}

.quote-catalog-picker-body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0 !important;
    overflow: hidden !important;
}

.quote-catalog-picker-toolbar {
    flex: 0 0 auto;
    min-height: 44px;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto 30px;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-bottom: 1px solid #d8dce3;
    background: #f7f9fb;
}

.quote-catalog-picker-toolbar label {
    min-width: 0;
    height: 28px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.quote-catalog-picker-toolbar label .material-symbols-outlined {
    justify-self: center;
    color: #727782;
    font-size: 16px;
}

.quote-catalog-picker-toolbar input {
    min-width: 0;
    height: 26px;
    padding: 0 8px 0 2px;
    border: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
    outline: 0;
}

.quote-catalog-picker-result-count {
    color: #605e5c;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.quote-catalog-picker-toolbar .quote-icon-button {
    width: 28px;
    min-width: 28px;
    height: 28px;
    padding: 0;
}

.quote-catalog-picker-errors {
    flex: 0 0 auto;
    margin: 8px 10px 0;
}

.quote-catalog-picker-main {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: 236px minmax(0, 1fr);
    overflow: hidden;
}

.quote-catalog-picker-tree {
    min-height: 0;
    padding: 10px 8px;
    overflow: auto;
    border-right: 1px solid #c1c7d2;
    background: #f7f8fa;
}

.quote-catalog-picker-tree-title {
    margin: 0 0 8px;
    padding: 0 7px;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.quote-catalog-picker-tree-node {
    display: grid;
    gap: 2px;
    margin-top: 3px;
}

.quote-catalog-picker-tree-node-row {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 1px;
}

.quote-catalog-picker-tree-toggle {
    width: 24px;
    height: 30px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: #8c99a7;
}

.quote-catalog-picker-tree-toggle .material-symbols-outlined {
    font-size: 17px;
    transition: transform 120ms ease;
}

.quote-catalog-picker-tree-node.is-collapsed .quote-catalog-picker-tree-toggle .material-symbols-outlined {
    transform: rotate(-90deg);
}

.quote-catalog-picker-tree-node.is-collapsed .quote-catalog-picker-tree-sublist {
    display: none;
}

.quote-catalog-picker-tree-sublist {
    display: grid;
    gap: 2px;
    margin-left: 25px;
    padding-left: 8px;
    border-left: 1px solid #c1c7d2;
}

.quote-catalog-picker-tree-item {
    width: 100%;
    min-width: 0;
    min-height: 30px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 8px;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #4c5662;
    font-size: 11px;
    font-weight: 650;
    text-align: left;
}

.quote-catalog-picker-tree-item > span:not(.material-symbols-outlined) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quote-catalog-picker-tree-item .material-symbols-outlined {
    flex: 0 0 auto;
    color: #7d8b99;
    font-size: 17px;
}

.quote-catalog-picker-tree-item small {
    margin-left: auto;
    color: #727782;
    font-size: 9px;
    font-weight: 800;
}

.quote-catalog-picker-tree-item:hover,
.quote-catalog-picker-tree-item:focus-visible,
.quote-catalog-picker-tree-item.active {
    border-color: #c5d4e5;
    background: #eaf0f7;
    color: #004277;
}

.quote-catalog-picker-tree-item.active {
    font-weight: 800;
}

.quote-catalog-picker-results {
    min-width: 0;
    min-height: 0;
    overflow: auto;
    background: #fff;
}

.quote-catalog-picker-list-head,
.quote-catalog-picker-row {
    display: grid;
    grid-template-columns: 126px minmax(260px, 1fr) 108px 112px;
    align-items: center;
    gap: 8px;
}

.quote-catalog-picker-list-head {
    position: sticky;
    top: 0;
    z-index: 1;
    min-height: 30px;
    padding: 0 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    color: #5e6975;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.quote-catalog-picker-list {
    display: grid;
    align-content: start;
}

.quote-catalog-picker-row {
    width: 100%;
    min-height: 48px;
    padding: 6px 12px;
    border: 0;
    border-bottom: 1px solid #d8dce3;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    text-align: left;
}

.quote-catalog-picker-row:nth-child(even) {
    background: #fafbfd;
}

.quote-catalog-picker-row:hover,
.quote-catalog-picker-row:focus-visible {
    background: #eaf4ff;
    box-shadow: inset 3px 0 0 #005a9e;
    outline: 0;
}

.quote-catalog-picker-row:disabled {
    cursor: wait;
    opacity: .6;
}

.quote-catalog-picker-code,
.quote-catalog-picker-price {
    font-variant-numeric: tabular-nums;
}

.quote-catalog-picker-code {
    color: #004277;
    font-weight: 800;
}

.quote-catalog-picker-price {
    text-align: right;
}

.quote-catalog-picker-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.quote-catalog-picker-copy strong,
.quote-catalog-picker-copy small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quote-catalog-picker-copy strong {
    color: #20252b;
    font-size: 12px;
}

.quote-catalog-picker-copy small {
    color: #687482;
    font-size: 10px;
}

.quote-catalog-picker-state {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 20px;
    color: #687482;
    font-size: 11px;
}

.quote-catalog-picker-state.is-error {
    flex-direction: column;
    color: #9d1c1c;
}

@media (max-width: 900px) {
    .project-modal.quote-catalog-picker-modal {
        width: calc(100vw - 24px);
        height: calc(100vh - 32px);
    }

    .quote-catalog-picker-main {
        grid-template-columns: 196px minmax(0, 1fr);
    }

    .quote-catalog-picker-list-head,
    .quote-catalog-picker-row {
        grid-template-columns: 100px minmax(220px, 1fr) 92px 100px;
    }
}

@media (max-width: 1200px) {
    .project-quotes-panel .quote-editor-view .quote-editor {
        grid-template-columns: minmax(0, 1fr) 300px;
    }

    .project-quotes-panel .quote-editor-view .quote-side-panel {
        width: 300px;
        min-width: 300px;
    }

    .project-quotes-panel .quote-editor-view .quote-catalog-main {
        grid-template-columns: 192px minmax(0, 1fr);
    }

    .project-quotes-panel .quote-editor-view .quote-catalog-quickbar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .project-quotes-panel .quote-editor-view .quote-catalog-route {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .project-quotes-panel .quote-editor-view .quote-catalog-selection-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .project-quotes-panel .quote-editor-view .quote-catalog-selection-title {
        grid-column: 1 / -1;
    }
}

.project-quotes-panel .quote-editor-view[data-quote-editor-layout="document-and-position-list"] .quote-editor {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}

.project-quotes-panel .quote-editor-view[data-quote-editor-layout="document-and-position-list"] .quote-inline-filters {
    display: none;
}

.project-quotes-panel .quote-editor-view[data-quote-editor-layout="document-and-position-list"] .quote-side-panel {
    display: none;
}

.project-quotes-panel .quote-workspace-drawer {
    margin-top: 0;
    border: 1px solid #c1c7d2;
    border-top: 0;
    background: #efeeed;
    color: #1a1c1c;
    font-family: Inter, "Segoe UI", sans-serif;
}

.project-quotes-panel .quote-workspace-head {
    min-height: 38px;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 0 10px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
}

.project-quotes-panel .quote-workspace-title,
.project-quotes-panel .quote-workspace-tabs {
    min-width: 0;
    display: flex;
    align-items: center;
}

.project-quotes-panel .quote-workspace-title {
    gap: 8px;
}

.project-quotes-panel .quote-workspace-title .material-symbols-outlined {
    color: #005a9e;
    font-size: 19px;
}

.project-quotes-panel .quote-workspace-title strong,
.project-quotes-panel .quote-workspace-title small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-quotes-panel .quote-workspace-title strong {
    font-size: 12px;
    line-height: 16px;
}

.project-quotes-panel .quote-workspace-title small {
    color: #605e5c;
    font-size: 10px;
    line-height: 13px;
}

.project-quotes-panel .quote-workspace-tabs {
    justify-content: flex-end;
    gap: 4px;
}

.project-quotes-panel .quote-workspace-tab {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border: 1px solid transparent;
    border-radius: 2px;
    color: #605e5c;
    font-size: 10px;
    font-weight: 750;
    white-space: nowrap;
}

.project-quotes-panel .quote-workspace-tab.active {
    border-color: #c1c7d2;
    background: #e9e8e7;
    color: #005a9e;
}

.project-quotes-panel .quote-workspace-body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 8px;
    background: #efeeed;
}

.project-quotes-panel .quote-workspace-body > .form-error,
.project-quotes-panel .quote-workspace-body > .empty-state,
.project-quotes-panel .quote-workspace-body > .project-form-panel,
.project-quotes-panel .quote-workspace-body > .note-command-row,
.project-quotes-panel .quote-workspace-body > .appointment-table {
    grid-column: 1 / -1;
}

.project-quotes-panel .quote-workspace-body > .project-status-panel,
.project-quotes-panel .quote-workspace-body > .project-form-panel {
    margin: 0;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.project-quotes-panel .quote-workspace-body > .document-revisions-panel {
    padding: 0;
}

.project-quotes-panel .quote-workspace-body .notes-head.compact,
.project-quotes-panel .quote-workspace-body .form-head {
    min-height: 34px;
    margin: 0;
    padding: 0 10px;
    border-bottom: 1px solid #c1c7d2;
    background: #fbfbfb;
}

.project-quotes-panel .quote-workspace-body .notes-title-group h4,
.project-quotes-panel .quote-workspace-body .form-head strong {
    font-size: 12px;
}

.project-quotes-panel .quote-workspace-body .notes-title-group .material-symbols-outlined {
    font-size: 18px;
}

.project-quotes-panel .quote-workspace-body .note-count,
.project-quotes-panel .quote-workspace-body .form-head span {
    color: #605e5c;
    font-size: 10px;
}

.project-quotes-panel .quote-workspace-body .project-tool-button,
.project-quotes-panel .quote-workspace-body .toolbar button,
.project-quotes-panel .quote-workspace-body .row-actions button,
.project-quotes-panel .quote-workspace-body .modal-actions button {
    min-height: 26px;
    border-radius: 2px;
    font-size: 11px;
}

.project-quotes-panel .quote-workspace-body .appointment-table {
    margin: 0;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.project-quotes-panel .quote-workspace-body .document-revisions-panel .appointment-table,
.project-quotes-panel .quote-workspace-body .project-form-panel .appointment-table {
    margin: 8px;
    border-color: #dde2ea;
}

.project-quotes-panel .quote-workspace-body .appointment-table-head {
    min-height: 30px;
    background: #f4f3f2;
    color: #3b3f45;
    font-size: 10px;
}

.project-quotes-panel .quote-workspace-body .appointment-table-row {
    min-height: 32px;
    font-size: 11px;
}

.project-quotes-panel .quote-workspace-body .empty-state.notes-empty {
    margin: 8px;
    min-height: 86px;
    border-radius: 0;
    background: #fbfbfb;
}

.project-quotes-panel .quote-workspace-body > .empty-state.notes-empty {
    margin: 0;
}

.project-quotes-panel .quote-workspace-body .note-command-row {
    min-height: 38px;
    margin: 0;
    padding: 6px 8px;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.project-quotes-panel .quote-workspace-body .note-command-row label {
    font-size: 10px;
}

.project-quotes-panel .quote-workspace-body .note-command-row input,
.project-quotes-panel .quote-workspace-body .note-command-row select,
.project-quotes-panel .quote-workspace-body .form-grid input,
.project-quotes-panel .quote-workspace-body .form-grid select,
.project-quotes-panel .quote-workspace-body .form-grid textarea {
    min-height: 28px;
    border-radius: 2px;
    font-size: 11px;
}

.project-quotes-panel .quote-workspace-body .document-preview-frame {
    margin: 8px;
    border-radius: 0;
}

@media (max-width: 1200px) {
    .project-quotes-panel .quote-workspace-head {
        grid-template-columns: 1fr;
        align-items: stretch;
        padding: 8px 10px;
    }

    .project-quotes-panel .quote-workspace-tabs {
        justify-content: flex-start;
        overflow-x: auto;
    }

    .project-quotes-panel .quote-workspace-body {
        grid-template-columns: 1fr;
    }
}

.document-preview-panel {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: #fbfcfe;
}

.invoice-export-preview-panel {
    padding: 0;
    overflow: hidden;
    background: #eef1f5;
}

.invoice-export-preview-head {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--border-soft);
    background: #fff;
}

.invoice-export-preview-meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-bottom: 1px solid var(--border-soft);
    background: #f8fafc;
}

.invoice-export-preview-meta span {
    min-width: 0;
    display: grid;
    gap: 2px;
    padding: 8px 10px;
    border-right: 1px solid var(--border-soft);
}

.invoice-export-preview-meta span:last-child {
    border-right: 0;
}

.invoice-export-preview-meta small,
.invoice-export-preview-inspector span {
    color: var(--muted);
    font-size: 11px;
}

.invoice-export-preview-meta strong,
.invoice-export-preview-inspector b {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-export-preview-shell {
    margin: 10px;
    border: 1px solid var(--border);
    background: #fff;
}

.invoice-export-preview-toolbar {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border-bottom: 1px solid var(--border-soft);
    background: #f6f7f9;
}

.invoice-export-preview-tool {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px;
    border: 1px solid var(--border-soft);
    border-radius: 4px;
    background: #fff;
    color: var(--text);
    font-size: 12px;
    font-weight: 700;
}

.invoice-export-preview-tool .material-symbols-outlined {
    font-size: 16px;
}

.invoice-export-preview-tool.active {
    border-color: #0b67a3;
    background: #eaf4ff;
    color: #0b67a3;
}

.invoice-export-preview-tool.muted {
    color: var(--muted);
}

.invoice-export-preview-body {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    min-height: 540px;
}

.invoice-export-preview-inspector {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    border-right: 1px solid var(--border-soft);
    background: #f8fafc;
}

.invoice-export-preview-inspector strong {
    font-size: 13px;
}

.invoice-export-preview-inspector span {
    display: grid;
    gap: 2px;
}

.invoice-export-preview-stage {
    min-width: 0;
    padding: 12px;
    background: #dfe3e8;
}

.invoice-export-preview-stage .document-preview-frame {
    min-height: 520px;
    border-color: #c6ced8;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(24, 34, 48, 0.08);
}

.invoice-export-preview-stage .document-preview-frame iframe {
    min-height: 520px;
}

@media (max-width: 1200px) {
    .invoice-export-preview-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .invoice-export-preview-body {
        grid-template-columns: 1fr;
    }

    .invoice-export-preview-inspector {
        border-right: 0;
        border-bottom: 1px solid var(--border-soft);
    }
}

.document-diagnostics-panel {
    margin: 12px 0 14px;
    padding: 14px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: #fbfcfe;
}

.diagnostic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 10px;
}

.diagnostic-grid span {
    min-height: 58px;
    display: grid;
    align-content: center;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid var(--border-soft);
    border-radius: 7px;
    background: #fff;
}

.diagnostic-grid strong {
    font-size: 20px;
}

.diagnostic-grid small,
.diagnostic-message {
    color: var(--muted);
}

.diagnostic-message {
    margin: 12px 0 0;
    font-size: 13px;
}

.revision-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.revision-panel-head strong {
    display: block;
    margin-bottom: 2px;
    font-size: 15px;
}

.revision-panel-head span {
    color: var(--muted);
    font-size: 12px;
}

.revision-table {
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.revision-table-head,
.revision-table-row {
    display: grid;
    grid-template-columns: 96px minmax(190px, 1fr) 90px minmax(110px, .6fr) 132px 92px 124px 38px;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 0 12px;
}

.revision-table-head {
    background: #f3f5f8;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.revision-table-row {
    border-top: 1px solid var(--border-soft);
    font-size: 13px;
}

.revision-table-row span,
.revision-table-row time {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.revision-table-row time {
    color: var(--muted);
}

.revision-table-actions {
    display: flex;
    justify-content: flex-end;
    gap: 2px;
}

.revision-table-actions a,
.revision-table-actions button {
    width: 28px;
    min-height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    text-decoration: none;
    cursor: pointer;
    padding: 0;
}

.revision-table-actions a:hover,
.revision-table-actions button:hover {
    border-color: var(--border);
    background: #edf3ff;
    color: var(--primary);
}

.revision-table-actions .material-symbols-outlined {
    font-size: 18px;
}

.document-preview-frame {
    min-height: 420px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.document-preview-frame iframe {
    width: 100%;
    min-height: 420px;
    border: 0;
}

.document-preview-frame.image {
    display: grid;
    place-items: center;
    padding: 12px;
}

.document-preview-frame img {
    max-width: 100%;
    max-height: 560px;
    object-fit: contain;
}

.document-preview-native-state {
    min-height: 160px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    border: 1px solid var(--border-soft);
    background: #f7f8fa;
    color: var(--muted);
}

.document-preview-native-state .material-symbols-outlined {
    color: #c13b32;
    font-size: 34px;
}

.pdf-viewer-backdrop {
    z-index: 180;
}

.native-pdf-viewer-modal {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 181;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 40px minmax(0, 1fr);
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #25262b;
    box-shadow: none;
}

.dummy-shell:not(.is-sidebar-collapsed) .native-pdf-viewer-modal {
    left: 260px;
}

.native-pdf-viewer-backdrop {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
}

.dummy-shell:not(.is-sidebar-collapsed) .native-pdf-viewer-backdrop {
    left: 260px;
}

.embedpdf-standard-modal {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 183;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #25262b;
    box-shadow: none;
}

.dummy-shell:not(.is-sidebar-collapsed) .embedpdf-standard-modal {
    left: 260px;
}

.embedpdf-standard-backdrop {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 182;
}

.dummy-shell:not(.is-sidebar-collapsed) .embedpdf-standard-backdrop {
    left: 260px;
}

.embedpdf-standard-dialog-title {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.embedpdf-standard-stage,
.embedpdf-standard-host,
.embedpdf-standard-host > *,
.embedpdf-standard-host embed-pdf-container {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
}

.embedpdf-standard-stage {
    position: relative;
    overflow: hidden;
    background: #25262b;
}

.embedpdf-standard-host {
    display: block;
    overflow: hidden;
}

.embedpdf-standard-host embed-pdf-container {
    display: block;
}

.embedpdf-standard-loading {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    background: #25262b;
    color: #e7e7e8;
    font-size: 13px;
}

.embedpdf-standard-loading strong {
    font-size: 14px;
    font-weight: 650;
}

.embedpdf-standard-loading > span:last-child {
    color: #aeb2ba;
}

.embedpdf-standard-loading[hidden] {
    display: none;
}

.embedpdf-standard-loading-hourglass {
    animation: embedpdf-standard-spin 1s linear infinite;
}

.embedpdf-standard-loading-close {
    position: absolute;
    top: 10px;
    right: 12px;
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #d8d9dc;
    cursor: pointer;
}

.embedpdf-standard-loading-close:hover,
.embedpdf-standard-loading-close:focus-visible {
    background: #3b3d43;
    color: #fff;
}

.embedpdf-standard-preparation-error {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 10px;
    padding: 24px;
    background: #25262b;
    color: #f3f3f4;
    text-align: center;
}

.embedpdf-standard-preparation-error[hidden] {
    display: none;
}

.embedpdf-standard-preparation-error > span:not(.material-symbols-outlined) {
    max-width: 620px;
    color: #c0c3c9;
}

.embedpdf-standard-preparation-error button {
    min-height: 34px;
    padding: 6px 14px;
    border: 1px solid #60636a;
    border-radius: 4px;
    background: #303238;
    color: #fff;
    cursor: pointer;
}

.embedpdf-standard-preparation-error button:hover,
.embedpdf-standard-preparation-error button:focus-visible {
    border-color: #858992;
    background: #3a3c42;
}

.embedpdf-standard-status {
    position: absolute;
    right: 18px;
    bottom: 18px;
    z-index: 5;
    max-width: min(520px, calc(100% - 36px));
    padding: 9px 12px;
    border: 1px solid #60636a;
    border-radius: 4px;
    background: #303238;
    box-shadow: 0 5px 18px rgb(0 0 0 / 30%);
    color: #f5f5f5;
    font-size: 12px;
}

.embedpdf-standard-status.is-success {
    border-color: #3f8056;
}

.embedpdf-standard-status.is-error {
    border-color: #ba514b;
    background: #442c2d;
}

.erp-embedpdf-close-confirm {
    position: absolute;
    inset: 0;
    z-index: 30;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgb(12 15 20 / 74%);
    backdrop-filter: blur(2px);
}

.erp-embedpdf-close-confirm[hidden] {
    display: none;
}

.erp-embedpdf-close-confirm > section {
    width: min(510px, 100%);
    padding: 20px;
    border: 1px solid #4c5360;
    border-radius: 6px;
    background: #252b34;
    box-shadow: 0 18px 46px rgb(0 0 0 / 42%);
    color: #f2f4f7;
}

.erp-embedpdf-close-confirm header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    font-size: 16px;
}

.erp-embedpdf-close-confirm header .material-symbols-outlined {
    color: #79aefb;
    font-size: 22px;
}

.erp-embedpdf-close-confirm p {
    margin: 0;
    color: #d9dde4;
    font-size: 13px;
    line-height: 1.5;
}

.erp-embedpdf-close-confirm .erp-embedpdf-close-confirm-note {
    margin-top: 8px;
    color: #aeb6c2;
}

.erp-embedpdf-close-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 20px;
}

.erp-embedpdf-close-confirm-actions button {
    min-height: 34px;
    padding: 0 13px;
    border: 1px solid #606a78;
    border-radius: 4px;
    background: #303743;
    color: #f4f6f8;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.erp-embedpdf-close-confirm-actions button:hover,
.erp-embedpdf-close-confirm-actions button:focus-visible {
    border-color: #8aa8cf;
    background: #3a4452;
    outline: 2px solid rgb(100 161 237 / 35%);
    outline-offset: 1px;
}

.erp-embedpdf-close-confirm-actions button.is-danger {
    border-color: #8e5454;
    color: #ffd6d4;
}

.erp-embedpdf-close-confirm-actions button.is-primary {
    border-color: #1f6fbb;
    background: #1769aa;
    color: #fff;
}

.erp-embedpdf-close-confirm-actions button:disabled {
    cursor: wait;
    opacity: 0.55;
}

@keyframes embedpdf-standard-spin {
    to {
        transform: rotate(360deg);
    }
}

.native-pdf-viewer-actions {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.native-pdf-viewer-actions a,
.native-pdf-viewer-actions button {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #f1f3f4;
    text-decoration: none;
    cursor: pointer;
}

.native-pdf-viewer-actions a:hover,
.native-pdf-viewer-actions button:hover,
.native-pdf-viewer-actions a:focus-visible,
.native-pdf-viewer-actions button:focus-visible {
    background: #4a4a4a;
    outline: 2px solid #8ab4f8;
    outline-offset: -2px;
}

.native-pdf-viewer-actions button:disabled {
    color: #777;
    cursor: not-allowed;
    opacity: 0.6;
}

.native-pdf-viewer-actions button:disabled:hover {
    background: transparent;
    outline: 0;
}

.native-pdf-viewer-actions .material-symbols-outlined {
    font-size: 21px;
}

.native-pdf-viewer-content {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: clamp(176px, 15vw, 224px) minmax(0, 1fr);
    background: #25262b;
}

.native-pdf-viewer-modal.is-pdfjs-sidebar-collapsed .native-pdf-viewer-content {
    grid-template-columns: 0 minmax(0, 1fr);
}

.native-pdf-viewer-modal.is-pdfjs-sidebar-collapsed .project-pdfjs-sidebar {
    visibility: hidden;
    border-right: 0;
}

.project-pdfjs-toolbar {
    position: relative;
    z-index: 6;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 0 6px;
    border-bottom: 1px solid #1d1e22;
    background: #35363d;
    color: #e7e7e8;
}

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

.project-pdfjs-toolbar-group {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.project-pdfjs-toolbar-start {
    justify-self: start;
}

.project-pdfjs-toolbar-center {
    justify-self: center;
}

.project-pdfjs-toolbar-end {
    justify-self: end;
}

.project-pdfjs-toolbar button,
.project-pdfjs-toolbar a {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #e2e2e3;
    text-decoration: none;
    cursor: pointer;
}

.project-pdfjs-toolbar button:hover,
.project-pdfjs-toolbar button:focus-visible,
.project-pdfjs-toolbar a:hover,
.project-pdfjs-toolbar a:focus-visible {
    background: #484950;
    outline: 2px solid #9ca9c8;
    outline-offset: -2px;
}

.project-pdfjs-toolbar button.is-active {
    background: #5a6579;
    color: #fff;
}

.project-pdfjs-toolbar button:disabled {
    color: #74767d;
    cursor: not-allowed;
    opacity: 0.65;
}

.project-pdfjs-toolbar button:disabled:hover {
    background: transparent;
    outline: 0;
}

.project-pdfjs-toolbar .material-symbols-outlined {
    font-size: 21px;
}

.project-pdfjs-toolbar-divider {
    width: 1px;
    height: 24px;
    margin: 0 4px;
    background: #55565d;
}

.project-pdfjs-page-control {
    height: 32px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #e2e2e3;
    font-size: 12px;
    white-space: nowrap;
}

.project-pdfjs-page-control input {
    width: 46px;
    height: 30px;
    padding: 0 5px;
    border: 1px solid #5c5d64;
    border-radius: 2px;
    background: #2a2b30;
    color: #fff;
    font-variant-numeric: tabular-nums;
    text-align: center;
    appearance: textfield;
}

.project-pdfjs-page-control input::-webkit-inner-spin-button,
.project-pdfjs-page-control input::-webkit-outer-spin-button {
    margin: 0;
    appearance: none;
}

.project-pdfjs-zoom-value {
    width: 64px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #4f5057;
    border-radius: 2px;
    background: #404147;
    color: #fff;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.project-pdfjs-sidebar {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 44px minmax(0, 1fr);
    overflow: hidden;
    border-right: 1px solid #3c3d43;
    background: #31323a;
}

.project-pdfjs-sidebar-header {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 16px;
    border-bottom: 1px solid #45464d;
    color: #ededee;
}

.project-pdfjs-sidebar-header button {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #c7c8cd;
    cursor: pointer;
}

.project-pdfjs-sidebar-header button:hover,
.project-pdfjs-sidebar-header button:focus-visible,
.project-pdfjs-sidebar-header button.is-active {
    background: #484950;
    color: #fff;
    outline: 0;
}

.project-pdfjs-sidebar-header .material-symbols-outlined {
    color: #c7c8cd;
    font-size: 20px;
}

.project-pdfjs-sidebar-header strong {
    overflow: hidden;
    font-size: 13px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-pdfjs-thumbnails {
    min-width: 0;
    min-height: 0;
    padding: 14px 12px;
    overflow: auto;
}

.project-pdfjs-thumbnails[hidden],
.project-pdfjs-markup-list[hidden] {
    display: none;
}

.project-pdfjs-markup-list {
    min-width: 0;
    min-height: 0;
    padding: 10px;
    overflow: auto;
}

.project-pdfjs-markup-item {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    margin: 0 0 6px;
    padding: 7px 8px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 3px;
    background: #383940;
    color: #e5e5e6;
    text-align: left;
    cursor: pointer;
}

.project-pdfjs-markup-item:hover,
.project-pdfjs-markup-item:focus-visible,
.project-pdfjs-markup-item.is-active {
    border-color: #6e9fd1;
    background: #434955;
    outline: 0;
}

.project-pdfjs-markup-item > span:last-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-pdfjs-markup-item strong,
.project-pdfjs-markup-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-pdfjs-markup-item strong {
    font-size: 12px;
}

.project-pdfjs-markup-item small {
    color: #b8bbc3;
    font-size: 10px;
}

.project-pdfjs-markup-empty {
    min-height: 150px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    color: #aeb1b9;
    font-size: 11px;
    text-align: center;
}

.project-pdfjs-thumbnail {
    width: 100%;
    min-height: 142px;
    margin: 0 0 12px;
    padding: 7px;
    display: grid;
    place-items: center;
    gap: 6px;
    border: 2px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #d8d8d8;
    cursor: pointer;
}

.project-pdfjs-thumbnail:hover,
.project-pdfjs-thumbnail:focus-visible {
    background: #363636;
    outline: 0;
}

.project-pdfjs-thumbnail.is-active {
    border-color: #55cfe0;
    background: #3b3c45;
}

.project-pdfjs-thumbnail canvas {
    max-width: 116px;
    max-height: 118px;
    display: block;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}

.project-pdfjs-thumbnail span {
    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.project-pdfjs-stage {
    position: relative;
    min-width: 0;
    min-height: 0;
    padding: 8px 16px 16px;
    overflow: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: #25262b;
}

.project-pdfjs-page-surface {
    position: relative;
    flex: 0 0 auto;
    min-width: 1px;
    min-height: 1px;
}

.project-pdfjs-stage canvas {
    max-width: none;
    display: block;
    background: #fff;
    box-shadow: 0 3px 18px rgba(0, 0, 0, 0.55);
}

.project-pdfjs-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
    touch-action: none;
}

.project-pdfjs-overlay.is-interactive {
    pointer-events: auto;
}

.project-pdfjs-overlay [data-markup-kind] {
    cursor: pointer;
}

.project-pdfjs-overlay [data-markup-kind].is-selected > :first-child {
    filter: drop-shadow(0 0 2px #2f72b7);
    stroke-width: 3;
}

.project-pdfjs-note-symbol {
    fill: #fff;
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    pointer-events: none;
}

.project-pdfjs-measure-point {
    fill: #fff;
    stroke: #d04444;
    stroke-width: 1.5;
}

.project-pdfjs-measure-label-bg {
    fill: rgba(25, 27, 33, 0.92);
    stroke: rgba(255, 255, 255, 0.25);
    stroke-width: 0.5;
}

.project-pdfjs-measure-label {
    fill: #fff;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-weight: 600;
    pointer-events: none;
}

.project-pdfjs-draft-line {
    stroke: #2f72b7;
    stroke-width: 1.5;
    stroke-dasharray: 6 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

.project-pdfjs-draft-highlight {
    fill: rgba(255, 225, 106, 0.35);
    stroke: #d4a900;
    stroke-width: 1;
    stroke-dasharray: 4 3;
    pointer-events: none;
}

.project-pdfjs-tool-menu {
    position: relative;
    display: inline-flex;
}

.project-pdfjs-tool-popover {
    position: absolute;
    top: 38px;
    right: 0;
    z-index: 10;
    min-width: 42px;
    padding: 4px;
    display: grid;
    gap: 2px;
    border: 1px solid #555862;
    border-radius: 3px;
    background: #35363d;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.project-pdfjs-tool-popover[hidden] {
    display: none;
}

.project-pdfjs-tool-status {
    position: absolute;
    top: 12px;
    left: 50%;
    z-index: 4;
    max-width: min(620px, calc(100% - 40px));
    transform: translateX(-50%);
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 3px;
    background: rgba(28, 30, 36, 0.94);
    color: #f2f3f5;
    font-size: 11px;
    text-align: center;
}

.project-pdfjs-tool-status[data-kind="error"] {
    border-color: #d36a62;
    color: #ffd7d4;
}

.project-pdfjs-tool-status[data-kind="success"] {
    border-color: #5d9f70;
    color: #d8f3df;
}

.project-pdfjs-tool-status[hidden] {
    display: none;
}

.project-pdfjs-flyout {
    position: absolute;
    right: 18px;
    bottom: 18px;
    z-index: 5;
    width: min(340px, calc(100% - 36px));
    padding: 14px;
    display: grid;
    gap: 12px;
    border: 1px solid #c7cbd2;
    border-radius: 4px;
    background: #fff;
    color: #29323d;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.35);
}

.project-pdfjs-flyout[hidden] {
    display: none;
}

.project-pdfjs-flyout label {
    display: grid;
    gap: 5px;
    font-size: 12px;
    font-weight: 600;
}

.project-pdfjs-flyout input,
.project-pdfjs-flyout textarea {
    width: 100%;
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid #b9c0ca;
    border-radius: 2px;
    background: #fff;
    color: #1e2732;
    font: inherit;
    resize: vertical;
}

.project-pdfjs-flyout > div,
.project-pdfjs-input-suffix {
    display: flex;
    align-items: center;
    gap: 8px;
}

.project-pdfjs-flyout > div {
    justify-content: flex-end;
}

.project-pdfjs-input-suffix input {
    flex: 1 1 auto;
}

.project-pdfjs-flyout button {
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid #b9c0ca;
    border-radius: 2px;
    background: #fff;
    color: #26313e;
    font-weight: 600;
    cursor: pointer;
}

.project-pdfjs-flyout button.is-primary {
    border-color: #0b5f9e;
    background: #0b5f9e;
    color: #fff;
}

.project-pdfjs-loading,
.project-pdfjs-error {
    position: absolute;
    inset: 14px auto auto 50%;
    z-index: 2;
    transform: translateX(-50%);
    padding: 8px 12px;
    border-radius: 3px;
    background: rgba(22, 22, 22, 0.9);
    color: #f1f3f4;
    font-size: 12px;
}

.project-pdfjs-loading {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.project-pdfjs-loading[hidden],
.project-pdfjs-error[hidden] {
    display: none;
}

.project-pdfjs-loading .material-symbols-outlined {
    font-size: 18px;
    animation: pdfjs-spin 0.9s linear infinite;
}

.project-pdfjs-error {
    color: #ffd5d2;
}

@keyframes pdfjs-spin {
    to { transform: rotate(360deg); }
}

.office-document-editor-backdrop {
    position: fixed;
    top: var(--dummy-topbar-height);
    right: 0;
    bottom: 0;
    left: 64px;
    z-index: 184;
}

.dummy-shell:not(.is-sidebar-collapsed) .office-document-editor-backdrop {
    left: 260px;
}

.office-document-editor-modal {
    position: fixed;
    top: calc(var(--dummy-topbar-height) + 8px);
    right: 8px;
    bottom: 8px;
    left: 72px;
    z-index: 185;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 48px auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #c4ccd7;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 24px 72px rgba(0, 0, 0, 0.44);
}

.dummy-shell:not(.is-sidebar-collapsed) .office-document-editor-modal {
    left: 268px;
}

.office-document-editor-header {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 8px 0 14px;
    border-bottom: 1px solid #cfd5de;
    background: #f5f6f8;
    color: #273341;
}

.office-document-editor-heading,
.office-document-editor-actions {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.office-document-editor-heading {
    flex: 1 1 auto;
    overflow: hidden;
}

.office-document-editor-actions {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
}

.office-document-editor-heading > div {
    min-width: 0;
    display: grid;
}

.office-document-editor-heading strong,
.office-document-editor-heading small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.office-document-editor-heading strong {
    font-size: 13px;
}

.office-document-editor-heading small {
    color: #687586;
    font-size: 10px;
}

.office-document-editor-mode {
    padding: 3px 7px;
    border: 1px solid #b9c4d1;
    border-radius: 3px;
    background: #fff;
    color: #47576a;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.office-document-editor-actions button {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #273341;
    cursor: pointer;
}

.office-document-editor-actions button:hover,
.office-document-editor-actions button:focus-visible {
    background: #e2e7ed;
    outline: 2px solid #0b6cad;
    outline-offset: -2px;
}

.office-document-editor-actions button:disabled {
    color: #9aa4b0;
    cursor: not-allowed;
}

.office-document-editor-state:empty {
    display: none;
}

.office-document-editor-state[hidden] {
    display: none;
}

.office-document-editor-state {
    padding: 8px 14px;
    border-bottom: 1px solid #dfb4b0;
    background: #fff0ef;
    color: #9d2a22;
    font-size: 12px;
}

.office-document-editor-host {
    min-width: 0;
    min-height: 0;
    background: #e9edf2;
}

.office-document-editor-host iframe,
.office-document-editor-modal > iframe[name="frameEditor"] {
    width: 100% !important;
    height: 100% !important;
    min-width: 0;
    min-height: 0;
    display: block;
    border: 0;
}

.office-document-editor-modal > iframe[name="frameEditor"] {
    grid-row: 3;
    align-self: stretch;
    justify-self: stretch;
}

.pdf-viewer-modal {
    width: calc(100vw - 16px);
    height: calc(100vh - 16px);
    padding: 0;
    position: fixed;
    inset: 8px;
    z-index: 181;
    display: flex;
    flex-direction: column;
    border: 1px solid #202a3a;
    border-radius: 8px;
    background: #0f141d;
    box-shadow: 0 32px 90px rgba(0, 0, 0, 0.58);
    overflow: hidden;
}

.pdf-viewer-topbar {
    min-height: 64px;
    padding: 10px 14px;
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid #20293a;
    background: #0b111b;
    color: #d7deea;
}

.compdf-brand {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.compdf-logo-mark {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    background: #4b8dff;
    color: #fff;
    font-weight: 900;
}

.compdf-brand strong,
.pdf-viewer-title strong {
    display: block;
    color: #f5f7fb;
    font-size: 14px;
    line-height: 1.15;
}

.compdf-brand small,
.pdf-viewer-title span,
.pdf-viewer-title small {
    display: block;
    overflow: hidden;
    color: #8f9bad;
    font-size: 10px;
    font-weight: 760;
    letter-spacing: 0.05em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.compdf-close {
    min-height: 30px;
    padding: 0 12px;
    border: 1px solid #2b3445;
    border-radius: 7px;
    background: #151d2a;
    color: #d7deea;
    font-weight: 800;
}

.pdf-viewer-shell {
    min-height: 0;
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    background: #0f141d;
}

.compdf-document-workspace {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: 34px 48px auto auto minmax(0, 1fr);
    background: #0f141d;
}

.embedpdf-tabbar {
    min-width: 0;
    min-height: 34px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    border-bottom: 1px solid #20293a;
    background: #0b111b;
    color: #d7deea;
}

.embedpdf-file-tab,
.embedpdf-new-tab {
    height: 27px;
    padding: 0 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 7px;
    background: transparent;
    color: #8f9bad;
    font-size: 12px;
    font-weight: 760;
}

.embedpdf-file-tab.active {
    max-width: 360px;
    border-color: #2c3546;
    background: #1b2534;
    color: #f5f7fb;
}

.embedpdf-file-tab span:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.embedpdf-new-tab:disabled {
    opacity: 0.42;
}

.embedpdf-tab-close {
    color: #7f8ba0;
    font-size: 14px;
}

.embedpdf-document-meta {
    min-width: 0;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #758196;
    font-size: 10px;
    font-weight: 760;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.embedpdf-document-meta small {
    color: #5f6b7f;
    font-size: 10px;
}

.compdf-main-toolbar {
    min-height: 48px;
    display: grid;
    grid-template-columns: minmax(220px, auto) minmax(420px, 1fr) minmax(92px, auto);
    gap: 10px;
    align-items: center;
    padding: 0 10px;
    border-bottom: 1px solid #2b3445;
    background: #151d2a;
}

.compdf-toolbar-left,
.compdf-toolbar-right,
.pdf-viewer-actions {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.compdf-toolbar-right {
    justify-content: flex-end;
}

.compdf-icon-button,
.compdf-caret-button,
.compdf-context-toolbar button,
.compdf-context-toolbar a {
    min-height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid transparent;
    background: transparent;
    color: #aeb8c8;
    font-size: 12px;
    text-decoration: none;
}

.compdf-icon-button {
    min-width: 36px;
    border-radius: 7px;
}

.compdf-icon-button:hover,
.compdf-icon-button.active {
    border-color: #344156;
    background: #202a3a;
    color: #f4f7fb;
}

.compdf-icon-button:disabled,
.compdf-context-toolbar button:disabled,
.compdf-context-toolbar a[aria-disabled="true"],
.compdf-mode-tabs button:disabled {
    color: #566276;
    cursor: not-allowed;
    opacity: 0.68;
}

.compdf-icon-button .material-symbols-outlined {
    font-size: 19px;
}

.compdf-zoom-label {
    min-width: 76px;
    min-height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #2f394b;
    border-radius: 7px;
    background: #0f1623;
    color: #e6ebf5;
    font-size: 13px;
}

.pdf-viewer-separator {
    width: 1px;
    height: 26px;
    margin: 0 4px;
    background: #303a4d;
}

.compdf-mode-tabs {
    height: 40px;
    justify-content: center;
    gap: 2px;
    overflow: hidden;
    border: 1px solid #273247;
    border-radius: 8px;
    background: #111928;
}

.compdf-mode-tabs button {
    min-height: 38px;
    padding: 0 14px;
    color: #aeb8c8;
    font-size: 13px;
    font-weight: 860;
}

.compdf-mode-tabs button.active {
    color: #f4f7fb;
    box-shadow: inset 0 -3px 0 #4b8dff;
}

.pdf-service-strip {
    min-height: 36px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    border-bottom: 1px solid #2b3445;
    background: #111928;
    color: #8f9bad;
    font-size: 11px;
}

.pdf-service-strip span {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.pdf-service-strip code {
    max-width: 420px;
    overflow: hidden;
    color: #d7deea;
    font-family: inherit;
    text-overflow: ellipsis;
}

.pdf-access-chip {
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid #2b3445;
    border-radius: 999px;
    background: #151d2a;
}

.pdf-manifest-readiness {
    min-height: 42px;
    padding: 7px 10px;
    display: grid;
    grid-template-columns: auto minmax(190px, 1fr) minmax(260px, 2fr) auto auto;
    gap: 8px;
    align-items: center;
    border-bottom: 1px solid #2b3445;
    background: #111a28;
    color: #d7deea;
}

.pdf-manifest-readiness span[data-pdf-viewer-manifest-state] {
    min-height: 20px;
    padding: 0 7px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #34594b;
    border-radius: 999px;
    background: #132a24;
    color: #8fe3bd;
    font-size: 10px;
    font-weight: 860;
    text-transform: uppercase;
    white-space: nowrap;
}

.pdf-manifest-readiness.is-loading span[data-pdf-viewer-manifest-state],
.pdf-manifest-readiness.is-fallback span[data-pdf-viewer-manifest-state] {
    border-color: #3d485e;
    background: #192235;
    color: #9db7df;
}

.pdf-manifest-readiness.is-blocked span[data-pdf-viewer-manifest-state] {
    border-color: #684338;
    background: #2a1c18;
    color: #f0a08d;
}

.pdf-manifest-readiness strong,
.pdf-manifest-readiness small,
.pdf-manifest-readiness code {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pdf-manifest-readiness strong {
    font-size: 12px;
    font-weight: 860;
}

.pdf-manifest-readiness small {
    color: #9aa6b8;
    font-size: 11px;
}

.pdf-manifest-readiness code {
    padding: 2px 6px;
    border: 1px solid #2b3445;
    border-radius: 5px;
    background: #151d2a;
    color: #aeb8c8;
    font-family: inherit;
    font-size: 10px;
}

.pdf-runtime-readiness {
    min-height: 54px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(360px, 1.4fr);
    gap: 10px;
    align-items: center;
    border-bottom: 1px solid #2b3445;
    background: #0f1724;
    color: #d7deea;
}

.pdf-runtime-readiness > div:first-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.pdf-runtime-readiness span[data-pdf-viewer-embedpdf-runtime-state] {
    width: fit-content;
    min-height: 20px;
    padding: 0 7px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #33415a;
    border-radius: 999px;
    background: #182235;
    color: #94b8ff;
    font-size: 10px;
    font-weight: 860;
    text-transform: uppercase;
}

.pdf-runtime-readiness strong {
    font-size: 13px;
    font-weight: 860;
}

.pdf-runtime-readiness small {
    overflow: hidden;
    color: #8f9bad;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pdf-runtime-checks {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.pdf-runtime-checks span {
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #2b3445;
    border-radius: 6px;
    background: #151d2a;
    color: #aeb8c8;
    font-size: 11px;
    font-weight: 760;
}

.compdf-context-toolbar {
    min-height: 36px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    border-bottom: 1px solid #2b3445;
    background: #151d2a;
}

.compdf-context-toolbar button,
.compdf-context-toolbar a {
    min-height: 28px;
    padding: 0 10px;
    border-radius: 6px;
    font-weight: 760;
}

.compdf-context-toolbar button.active {
    border-color: #344156;
    background: #202a3a;
    color: #f4f7fb;
}

.compdf-disabled-toolbar {
    min-height: 34px;
    color: #8f9bad;
    font-size: 12px;
}

.compdf-canvas-layout {
    min-height: 0;
    display: grid;
    grid-template-columns: 146px minmax(0, 1fr);
}

.pdf-thumbnail-rail,
.pdf-inspector {
    min-height: 0;
    overflow: auto;
    background: #151d2a;
}

.pdf-thumbnail-rail {
    border-right: 1px solid #2b3445;
}

.pdf-side-head {
    min-height: 42px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #2b3445;
}

.pdf-side-head strong {
    color: #d7deea;
    font-size: 12px;
}

.pdf-side-head span {
    color: #8f9bad;
    font-size: 10px;
    font-weight: 760;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.pdf-thumbnail-list {
    padding: 10px;
    display: grid;
    gap: 10px;
}

.pdf-thumb {
    min-height: 124px;
    padding: 8px;
    display: grid;
    gap: 8px;
    border: 1px solid #2b3445;
    border-radius: 7px;
    background: #101725;
    color: #aeb8c8;
}

.pdf-thumb.active {
    border-color: #4b8dff;
}

.pdf-thumb-preview {
    min-height: 86px;
    border-radius: 5px;
    background:
        linear-gradient(#273247 0 0) 18px 22px / 72px 5px no-repeat,
        linear-gradient(#273247 0 0) 18px 36px / 92px 5px no-repeat,
        linear-gradient(#273247 0 0) 18px 50px / 62px 5px no-repeat,
        #d7deea;
}

.pdf-viewer-stage {
    min-width: 0;
    min-height: 0;
    position: relative;
    display: grid;
    grid-template-rows: 42px minmax(0, 1fr);
    background: #0f141d;
}

.pdf-stage-toolbar {
    padding: 0 12px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #2b3445;
}

.pdf-stage-status {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #8f9bad;
    font-size: 12px;
}

.pdf-tool-status,
.pdf-measure-readiness {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border: 1px solid #2b3445;
    border-radius: 999px;
    background: #151d2a;
}

.pdf-page-scroll {
    min-height: 0;
    overflow: auto;
    padding: 18px;
    display: grid;
    place-items: start center;
}

.pdf-page-preview {
    width: min(980px, 100%);
    min-height: 70vh;
    border: 1px solid #2b3445;
    border-radius: 8px;
    background: #0b111b;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}

.pdf-native-frame {
    width: 100%;
    min-height: 70vh;
    display: block;
    border: 0;
    background: #fff;
}

.pdf-page-controls {
    position: absolute;
    right: 18px;
    bottom: 18px;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px;
    border: 1px solid #2b3445;
    border-radius: 8px;
    background: #151d2a;
    color: #d7deea;
}

.pdf-page-controls button {
    width: 28px;
    height: 26px;
    border: 0;
    border-radius: 6px;
    background: #202a3a;
    color: #aeb8c8;
}

.pdf-page-controls button:disabled {
    opacity: 0.5;
}

.pdf-inspector {
    border-left: 1px solid #2b3445;
}

.pdf-inspector section {
    padding: 14px;
    display: grid;
    gap: 10px;
    border-bottom: 1px solid #2b3445;
}

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

.pdf-meta-list div {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 8px;
    align-items: baseline;
}

.pdf-meta-list dt {
    color: #8f9bad;
    font-size: 10px;
    font-weight: 760;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.pdf-meta-list dd {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: #d7deea;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pdf-approval-card {
    color: #aeb8c8;
}

.pdf-approval-card span,
.pdf-approval-card p,
.pdf-inspector-note {
    color: #8f9bad;
    font-size: 12px;
}

.pdf-approval-card strong {
    color: #f5f7fb;
}

.pdf-approval-card div {
    display: flex;
    gap: 6px;
}

.pdf-approval-card button {
    min-height: 28px;
    padding: 0 9px;
    border: 1px solid #2b3445;
    border-radius: 6px;
    background: #111928;
    color: #566276;
    font-weight: 760;
}

.pdf-version-list,
.pdf-link-list {
    display: grid;
    gap: 8px;
}

.pdf-version-list article {
    min-width: 0;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) 72px;
    gap: 8px;
    align-items: center;
    padding: 8px;
    border: 1px solid #2b3445;
    border-radius: 7px;
    background: #111928;
}

.pdf-version-list strong,
.pdf-version-list span {
    min-width: 0;
    overflow: hidden;
    color: #d7deea;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pdf-version-list small {
    display: block;
    color: #8f9bad;
    font-size: 10px;
}

.pdf-version-list mark {
    min-height: 20px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
}

.pdf-version-list mark.is-approved {
    background: #12351f;
    color: #86efac;
}

.pdf-version-list mark.is-draft {
    background: #2b3445;
    color: #c8d0dc;
}

.pdf-version-list mark.is-archived {
    background: #3a1f25;
    color: #fca5a5;
}

.pdf-link-list span {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border: 1px solid #2b3445;
    border-radius: 999px;
    background: #111928;
    color: #aeb8c8;
    font-size: 11px;
    font-weight: 760;
}

@media (max-width: 1180px) {
    .pdf-viewer-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .pdf-inspector {
        display: none;
    }

    .compdf-main-toolbar {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .compdf-mode-tabs button {
        padding-inline: 10px;
    }
}

.project-checklist-panel {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.checklist-command-row {
    grid-template-columns: minmax(260px, 1fr) 140px auto;
}

.checklist-board {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}

.checklist-sheet {
    min-height: 210px;
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(18, 30, 45, 0.04);
}

.checklist-sheet-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.checklist-sheet-head h3 {
    margin: 0 0 2px;
    font-size: 15px;
    letter-spacing: 0;
}

.checklist-sheet-head small,
.checklist-description {
    color: var(--muted);
    font-size: 12px;
}

.checklist-description {
    margin: 0;
}

.checklist-tools {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.checklist-tools button {
    width: 28px;
    min-width: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: var(--muted);
}

.checklist-tools button:hover {
    border-color: #cddbf7;
    background: #edf3ff;
    color: var(--primary);
}

.checklist-progress {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #dfe4ec;
}

.checklist-progress span {
    height: 100%;
    display: block;
    border-radius: inherit;
    background: #107c10;
}

.checklist-items {
    display: grid;
    gap: 4px;
}

.checklist-item {
    min-height: 34px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid var(--border-soft);
    color: #4e5964;
}

.checklist-item button {
    width: 28px;
    min-width: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--muted);
}

.checklist-item button:hover {
    background: #edf3ff;
    color: var(--primary);
}

.checklist-item button:disabled {
    background: transparent;
    color: #9aa3af;
}

.checklist-item-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.checklist-item.is-done .checklist-item-text {
    color: var(--muted);
    text-decoration: line-through;
}

.checklist-item-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
}

.checklist-item-edit-input {
    width: 100%;
    min-height: 30px;
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 0 8px;
}

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

.checklist-add-row input {
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 0 10px;
}

.checklist-add-row button {
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    font-weight: 700;
}

.project-body .checklists-panel.active,
.project-body .project-checklist-panel.project-detail-inline-module.active {
    height: 100%;
    min-height: 0;
    padding: 0 !important;
    overflow: hidden !important;
    background: #faf9f8;
}

.project-checklist-frame {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 288px;
    background: #faf9f8;
}

.project-notes-checklists-panel .project-checklist-frame {
    height: 100%;
    grid-template-columns: minmax(0, 1fr) 220px;
    overflow: hidden;
}

.notes-checklists-checklists-pane .project-checklist-filterbar {
    grid-template-columns: minmax(120px, 1fr) 112px auto;
}

.project-body .notes-checklists-checklists-pane .checklist-board {
    grid-template-columns: minmax(0, 1fr);
}

.project-checklist-main {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.project-checklist-main::-webkit-scrollbar,
.project-checklist-details .checklist-detail-body::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

.project-checklist-main::-webkit-scrollbar-track,
.project-checklist-details .checklist-detail-body::-webkit-scrollbar-track {
    background: transparent;
}

.project-checklist-main::-webkit-scrollbar-thumb,
.project-checklist-details .checklist-detail-body::-webkit-scrollbar-thumb {
    background: #d2d0ce;
    border-radius: 2px;
}

.project-checklist-head {
    min-height: 64px;
    padding: 12px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #ffffff;
}

.project-checklist-head h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 24px;
}

.project-checklist-head p {
    margin: 2px 0 0;
    color: #414750;
    font-size: 11px;
    line-height: 14px;
}

.project-checklist-head-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.project-checklist-create {
    height: 32px;
    min-height: 32px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
}

.project-checklist-create .material-symbols-outlined {
    font-size: 14px;
}

.project-checklist-filterbar {
    min-height: 38px;
    padding: 6px 8px;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 144px auto;
    gap: 6px;
    align-items: end;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

.project-checklist-filterbar label {
    min-width: 0;
    display: grid;
    gap: 2px;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.project-checklist-filterbar input,
.project-checklist-filterbar select {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #ffffff;
    color: #1a1c1c;
    font-size: 11px;
}

.project-body .checklists-panel .checklist-board,
.project-checklist-panel .checklist-board {
    padding: 8px;
    display: grid;
    grid-template-columns: repeat(2, minmax(280px, 1fr));
    gap: 8px;
    align-content: start;
}

.project-body .checklist-sheet,
.project-checklist-panel .checklist-sheet {
    min-width: 0;
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    border: 1px solid #dadad9;
    border-radius: 4px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.08);
}

.project-body .checklist-sheet:hover,
.project-checklist-panel .checklist-sheet:hover {
    border-color: #c1c7d2;
    background: #ffffff;
}

.project-body .checklist-sheet-head,
.project-checklist-panel .checklist-sheet-head {
    min-height: 40px;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #efeeed;
}

.checklist-title-group {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.checklist-title-group h3 {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.checklist-title-select {
    min-width: 0;
    max-width: 100%;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.checklist-title-select:hover,
.checklist-title-select:focus-visible {
    color: #005a9e;
}

.project-body .checklist-sheet.is-selected,
.project-checklist-panel .checklist-sheet.is-selected {
    border-color: #005a9e;
    box-shadow: 0 0 0 1px rgba(0, 90, 158, 0.12);
}

.checklist-toggle-icon,
.checklist-actions button,
.checklist-item-actions button {
    width: 22px;
    height: 22px;
    min-height: 22px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #414750;
}

.checklist-toggle-icon:hover,
.checklist-actions button:hover,
.checklist-item-actions button:hover {
    background: #e3e2e1;
    color: #005a9e;
}

.checklist-actions button[data-archive-checklist]:hover,
.checklist-item-actions button[data-archive-checklist-item]:hover {
    color: #ba1a1a;
}

.checklist-toggle-icon .material-symbols-outlined,
.checklist-actions .material-symbols-outlined,
.checklist-item-actions .material-symbols-outlined {
    font-size: 16px;
}

.checklist-actions,
.checklist-item-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #414750;
}

.checklist-code,
.checklist-archive-badge {
    min-height: 16px;
    padding: 1px 4px;
    border-radius: 2px;
    background: rgba(0, 90, 158, 0.12);
    color: #004277;
    font-size: 10px;
    line-height: 12px;
}

.checklist-archive-badge {
    background: #efeeed;
    color: #727782;
}

.project-body .checklist-description,
.project-checklist-panel .checklist-description {
    margin: 0;
    padding: 6px 8px;
    border-bottom: 1px solid #c1c7d2;
    color: #414750;
    font-size: 11px;
    line-height: 14px;
}

.project-body .checklist-items,
.project-checklist-panel .checklist-items {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.project-body .checklist-item,
.project-checklist-panel .checklist-item {
    min-height: 32px;
    padding: 0 8px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
}

.project-body .checklist-item:nth-child(even),
.project-checklist-panel .checklist-item:nth-child(even) {
    background: #f8f8f8;
}

.project-body .checklist-item:hover,
.project-checklist-panel .checklist-item:hover {
    background: #e9e8e7;
}

.project-body .checklist-item input[type="checkbox"],
.project-checklist-panel .checklist-item input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #107c10;
}

.project-body .checklist-item > span:not(.material-symbols-outlined):not(.checklist-item-spacer):not(.checklist-item-actions),
.project-checklist-panel .checklist-item > span:not(.material-symbols-outlined):not(.checklist-item-spacer):not(.checklist-item-actions) {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-body .checklist-item small,
.project-checklist-panel .checklist-item small {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
    color: #414750;
    font-size: 10px;
    font-style: normal;
    white-space: nowrap;
}

.project-body .checklist-item.is-done span:not(.material-symbols-outlined),
.project-body .checklist-item.is-locked span:not(.material-symbols-outlined),
.project-checklist-panel .checklist-item.is-done span:not(.material-symbols-outlined),
.project-checklist-panel .checklist-item.is-locked span:not(.material-symbols-outlined) {
    color: #107c10;
    text-decoration: line-through;
}

.project-body .checklist-item.is-done input[type="checkbox"],
.project-body .checklist-item.is-locked input[type="checkbox"],
.project-checklist-panel .checklist-item.is-done input[type="checkbox"],
.project-checklist-panel .checklist-item.is-locked input[type="checkbox"] {
    accent-color: #107c10;
}

.project-body .checklist-item.checklist-item-detail,
.project-checklist-panel .checklist-item.checklist-item-detail {
    min-height: 82px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    border-left: 2px solid #004277;
    background: rgba(0, 90, 158, 0.05);
}

.checklist-detail-main {
    width: 100%;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 8px;
}

.project-body .checklist-item .checklist-inline-input,
.project-checklist-panel .checklist-item .checklist-inline-input {
    width: 100%;
    min-width: 0;
    height: 22px;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 500;
}

.checklist-detail-main .material-symbols-outlined {
    color: #004277;
    font-size: 16px;
}

.checklist-meta-grid {
    margin-left: 30px;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 4px 8px;
    align-items: center;
}

.checklist-meta-grid span {
    color: #414750;
    font-size: 10px;
    line-height: 12px;
    text-transform: uppercase;
}

.checklist-meta-grid strong,
.checklist-meta-grid em {
    width: fit-content;
    max-width: 100%;
    padding: 1px 4px;
    overflow: hidden;
    border-radius: 2px;
    background: #efeeed;
    color: #004277;
    font-size: 10px;
    font-style: normal;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.checklist-meta-grid em {
    background: transparent;
    color: #ba1a1a;
}

.project-body .checklist-field-types,
.project-checklist-panel .checklist-field-types {
    margin-top: auto;
    padding: 4px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px;
    border-top: 0;
    background: #f4f3f2;
}

.project-body .checklist-field-types .checklist-text-input,
.project-checklist-panel .checklist-field-types .checklist-text-input {
    width: 100%;
    min-width: 0;
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #ffffff;
    color: #1a1c1c;
    font-size: 11px;
}

.project-body .checklist-field-types button,
.project-checklist-panel .checklist-field-types button {
    height: 24px;
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #ffffff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 400;
}

.project-body .checklist-field-types button:hover,
.project-checklist-panel .checklist-field-types button:hover {
    border-color: #004277;
    background: #ffffff;
    color: #004277;
}

.project-body .checklist-field-types .material-symbols-outlined,
.project-checklist-panel .checklist-field-types .material-symbols-outlined {
    font-size: 12px;
}

.project-body .checklist-sheet.is-collapsed .checklist-items,
.project-body .checklist-sheet.is-collapsed .checklist-field-types,
.project-checklist-panel .checklist-sheet.is-collapsed .checklist-items,
.project-checklist-panel .checklist-sheet.is-collapsed .checklist-field-types {
    display: none;
}

.project-checklist-details {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border-left: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.checklist-detail-head {
    min-height: 32px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #ffffff;
}

.checklist-detail-head .material-symbols-outlined {
    color: #004277;
    font-size: 16px;
}

.checklist-detail-head strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.checklist-detail-body {
    min-height: 0;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
}

.checklist-detail-progress {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.checklist-detail-progress div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.checklist-detail-progress strong {
    color: #004277;
}

.checklist-detail-progress i {
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #c1c7d2;
}

.checklist-detail-progress b {
    height: 100%;
    display: block;
    background: #107c10;
}

.checklist-detail-table {
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
}

.checklist-detail-table div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid #c1c7d2;
}

.checklist-detail-table div:last-child {
    border-bottom: 0;
}

.checklist-detail-table span,
.checklist-detail-table strong {
    min-height: 28px;
    padding: 8px;
    display: flex;
    align-items: center;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 400;
}

.checklist-detail-table span {
    background: #efeeed;
    color: #414750;
}

.checklist-detail-table strong.is-link {
    color: #004277;
}

.checklist-detail-table strong.is-archived {
    color: #727782;
}

.checklist-detail-activity {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.checklist-detail-activity h3 {
    margin: 0;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
    line-height: 12px;
    text-transform: uppercase;
}

.checklist-timeline {
    margin-left: 8px;
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-left: 1px solid #c1c7d2;
}

.checklist-timeline article {
    position: relative;
}

.checklist-timeline i {
    position: absolute;
    top: 5px;
    left: -21px;
    width: 8px;
    height: 8px;
    border: 1px solid #ffffff;
    border-radius: 50%;
    background: #004277;
}

.checklist-timeline i.is-success {
    background: #107c10;
}

.checklist-timeline small {
    display: block;
    color: #414750;
    font-size: 9px;
    line-height: 12px;
    text-transform: uppercase;
}

.checklist-timeline p {
    margin: 0;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
}

.checklist-form-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(24, 31, 38, 0.35);
}

.checklist-modal {
    width: min(520px, calc(100vw - 32px));
    max-height: min(88vh, 720px);
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 90;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #ffffff;
    box-shadow: 0 18px 60px rgba(20, 30, 45, 0.24);
}

.checklist-modal .modal-head {
    min-height: 40px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.checklist-modal .modal-head strong {
    color: #1a1c1c;
    font-size: 13px;
}

.checklist-modal .modal-head button {
    width: 28px;
    min-width: 28px;
    min-height: 28px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: transparent;
    color: #414750;
}

.checklist-modal .modal-body {
    padding: 16px;
    display: grid;
    gap: 12px;
    overflow-y: auto;
}

.checklist-modal .modal-body label {
    display: grid;
    gap: 5px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.checklist-modal .modal-body input,
.checklist-modal .modal-body textarea {
    width: 100%;
    min-height: 32px;
    padding: 7px 9px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #ffffff;
    color: #1a1c1c;
    font: inherit;
    font-size: 12px;
}

.checklist-modal .modal-actions {
    padding: 12px 16px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #c1c7d2;
    background: #ffffff;
}

.checklist-modal .modal-actions button {
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #ffffff;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
}

.checklist-modal .modal-actions button.primary {
    border-color: #155eef;
    background: #155eef;
    color: #ffffff;
}

@media (min-width: 1600px) {
    .project-body .checklists-panel .checklist-board,
    .project-checklist-panel .checklist-board {
        grid-template-columns: repeat(3, minmax(280px, 1fr));
    }

    .project-body .notes-checklists-checklists-pane .checklist-board {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 1180px) {
    .project-checklist-frame {
        grid-template-columns: minmax(0, 1fr);
    }

    .project-checklist-details {
        display: none;
    }

    .project-notes-checklists-panel .project-checklist-frame {
        grid-template-columns: minmax(0, 1fr);
    }
}

.project-body .project-notes-checklists-panel .notes-workbench,
.project-body .project-notes-checklists-panel .notes-board,
.project-body .project-notes-checklists-panel .project-checklist-frame,
.project-body .project-notes-checklists-panel .project-checklist-main,
.project-body .project-notes-checklists-panel .checklist-board {
    display: contents;
}

.project-body .project-notes-checklists-panel .note-command-row {
    grid-column: 1 / -1;
    position: sticky;
    top: 0;
    z-index: 5;
    background: #ffffff;
}

.project-body .project-notes-checklists-panel .notes-empty,
.project-body .project-notes-checklists-panel .error-state {
    grid-column: 1 / -1;
}

.project-body .project-notes-checklists-panel .notes-checklists-card {
    min-width: 0;
    min-height: 190px;
    align-self: stretch;
}

.project-body .project-notes-checklists-panel .note-card {
    height: 100%;
}

.project-body .project-notes-checklists-panel .checklist-sheet {
    height: 100%;
}

.project-body .project-notes-checklists-panel .checklist-sheet {
    position: relative;
    cursor: pointer;
}

.project-body .project-notes-checklists-panel .checklist-card-open-layer {
    position: absolute;
    inset: 0;
    z-index: 1;
    padding: 0;
    border: 0;
    background: transparent;
    color: transparent;
    cursor: pointer;
}

.project-body .project-notes-checklists-panel .checklist-sheet-head,
.project-body .project-notes-checklists-panel .checklist-description,
.project-body .project-notes-checklists-panel .checklist-card-preview {
    position: relative;
    z-index: 2;
    pointer-events: none;
}

.project-body .project-notes-checklists-panel .checklist-actions button {
    position: relative;
    z-index: 4;
    pointer-events: auto;
}

.checklist-progress-badge {
    min-width: 36px;
    min-height: 18px;
    padding: 2px 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b7d7b5;
    border-radius: 2px;
    background: #f1faf1;
    color: #0b5a0b;
    font-size: 10px;
    font-weight: 800;
    line-height: 12px;
}

.checklist-card-preview {
    padding: 7px 8px 9px;
    display: grid;
    gap: 5px;
}

.checklist-card-preview > span {
    min-width: 0;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    gap: 5px;
    overflow: hidden;
    color: #414750;
    font-size: 11px;
    line-height: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.checklist-card-preview > span.is-done {
    color: #107c10;
    text-decoration: line-through;
}

.checklist-card-preview .material-symbols-outlined {
    color: inherit;
    font-size: 15px;
}

.checklist-card-preview small {
    color: #727782;
    font-size: 10px;
}

.note-view-modal {
    width: min(600px, calc(100vw - 32px));
}

.note-view-modal .modal-head .material-symbols-outlined {
    font-size: 18px;
}

.note-view-body {
    display: grid;
    gap: 14px;
}

.note-view-labels {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.note-view-body h3 {
    margin: 0;
    color: #1a1c1c;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0;
}

.note-view-content {
    min-height: 120px;
    margin: 0;
    padding: 12px;
    border: 1px solid #c1c7d2;
    background: #faf9f8;
    color: #1a1c1c;
    font-size: 13px;
    line-height: 20px;
    white-space: pre-wrap;
}

.note-view-meta {
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid #c1c7d2;
}

.note-view-meta div {
    min-width: 0;
    padding: 8px 10px;
    display: grid;
    gap: 2px;
    border-right: 1px solid #c1c7d2;
}

.note-view-meta div:last-child {
    border-right: 0;
}

.note-view-meta dt,
.note-view-meta dd {
    margin: 0;
}

.note-view-meta dt {
    color: #727782;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.note-view-meta dd {
    color: #1a1c1c;
    font-size: 11px;
}

.checklist-view-modal {
    width: min(760px, calc(100vw - 32px));
    max-height: min(90vh, 820px);
}

.checklist-view-title {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.checklist-view-title strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.checklist-view-modal .modal-head .material-symbols-outlined {
    font-size: 18px;
}

.checklist-view-body {
    gap: 10px !important;
}

.checklist-view-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px 12px;
}

.checklist-view-summary > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-column: 1 / -1;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.checklist-view-summary > div strong {
    color: #0b5a0b;
    font-size: 12px;
}

.checklist-view-summary progress {
    width: 100%;
    height: 8px;
    border: 0;
    border-radius: 2px;
    overflow: hidden;
    background: #e3e2e1;
}

.checklist-view-summary progress::-webkit-progress-bar {
    background: #e3e2e1;
}

.checklist-view-summary progress::-webkit-progress-value {
    background: #107c10;
}

.checklist-view-summary progress::-moz-progress-bar {
    background: #107c10;
}

.checklist-view-summary small {
    color: #727782;
    font-size: 10px;
    white-space: nowrap;
}

.checklist-view-description {
    margin: 0;
    padding: 8px 10px;
    border-left: 3px solid #005a9e;
    background: #f4f3f2;
    color: #414750;
    font-size: 11px;
    line-height: 16px;
}

.checklist-view-items {
    display: grid;
    border: 1px solid #c1c7d2;
}

.checklist-view-item {
    min-height: 40px;
    padding: 5px 8px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #dadad9;
    background: #fff;
}

.checklist-view-item:last-child {
    border-bottom: 0;
}

.checklist-view-item:nth-child(even) {
    background: #faf9f8;
}

.checklist-view-item input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #107c10;
}

.checklist-view-item > span:not(.checklist-item-actions) {
    min-width: 0;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
}

.checklist-view-item > small {
    color: #727782;
    font-size: 10px;
    white-space: nowrap;
}

.checklist-view-item.is-done > span:not(.checklist-item-actions) {
    color: #107c10;
    text-decoration: line-through;
}

.checklist-view-item.is-editing {
    grid-template-columns: 22px minmax(0, 1fr) auto;
    background: #eef5fb;
}

.checklist-view-item .checklist-inline-input {
    width: 100%;
    min-height: 28px;
    padding: 4px 7px;
    border: 1px solid #005a9e;
    border-radius: 2px;
    font-size: 12px;
}

.checklist-view-add {
    padding-top: 4px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
}

.checklist-view-add input {
    min-height: 32px;
}

.checklist-view-add button {
    min-height: 32px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #005a9e;
    border-radius: 3px;
    background: #005a9e;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}

.checklist-view-add button:disabled {
    border-color: #c1c7d2;
    background: #efeeed;
    color: #727782;
}

.checklist-modal .modal-body select {
    width: 100%;
    min-height: 32px;
    padding: 6px 9px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
}

.checklist-create-grid,
.checklist-create-items {
    display: grid;
    gap: 10px;
}

.checklist-create-items {
    padding-top: 10px;
    border-top: 1px solid #c1c7d2;
}

.checklist-create-items-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.checklist-create-items-head > div {
    display: grid;
    gap: 2px;
}

.checklist-create-items-head small {
    color: #727782;
    font-size: 10px;
}

.checklist-create-items-head button {
    min-height: 28px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 3px;
    background: #fff;
    font-size: 11px;
    font-weight: 700;
}

.checklist-create-item {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
}

.checklist-create-item > span:first-child {
    color: #727782;
    font-size: 10px;
    text-align: center;
}

.checklist-create-item-actions {
    display: inline-flex;
    gap: 3px;
}

.checklist-create-item-actions button {
    width: 28px;
    height: 28px;
    min-height: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
}

.checklist-create-item-actions .material-symbols-outlined {
    font-size: 16px;
}

.empty-state {
    min-height: 260px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    border: 1px dashed #cfd6e1;
    border-radius: 8px;
    background: #fbfcfe;
    color: var(--muted);
    text-align: center;
}

.empty-state .material-symbols-outlined {
    color: #94a3b8;
    font-size: 42px;
}

.empty-state strong {
    color: var(--text);
    font-size: 16px;
}

.empty-state p {
    max-width: 620px;
    margin-bottom: 0;
}

.accounting-shell {
    min-height: calc(100vh - var(--dummy-topbar-height));
    padding: 0;
    background: #f3f2f1;
    border: 1px solid var(--line);
}

.accounting-shell-header {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.accounting-breadcrumb {
    margin-bottom: 2px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.accounting-breadcrumb span {
    margin: 0 5px;
    color: var(--line-strong);
}

.accounting-shell-header h1 {
    margin: 0;
    color: #1f2328;
    font-size: 18px;
    line-height: 1.1;
}

.accounting-shell-header p {
    margin: 2px 0 0;
    color: var(--muted);
    font-size: 12px;
}

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

.accounting-header-actions button,
.accounting-header-actions a,
.accounting-tabbar button,
.accounting-workflow-step a,
.accounting-workflow-step button,
.accounting-table a {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid var(--line-strong);
    border-radius: 3px;
    padding: 0 10px;
    background: #fff;
    color: #1f2328;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.accounting-header-actions a.primary {
    border-color: var(--blue);
    background: var(--blue);
    color: #fff;
}

.accounting-header-actions .material-symbols-outlined {
    font-size: 16px;
}

.accounting-tabbar {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid var(--line);
    background: #fafafa;
}

.accounting-tabbar button {
    min-width: 120px;
    min-height: 36px;
    border-width: 0 1px 0 0;
    border-color: var(--line);
    border-radius: 0;
    background: #fafafa;
}

.accounting-tabbar button.active {
    background: #fff;
    color: var(--blue);
    box-shadow: inset 0 -2px 0 var(--blue);
}

.accounting-tabbar button:not(:disabled) {
    cursor: pointer;
}

.accounting-tabbar button:not(:disabled):hover {
    background: #fff;
}

.accounting-kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 0;
    border-bottom: 1px solid var(--line);
    background: #e7e6e4;
}

.accounting-kpi {
    min-height: 78px;
    padding: 12px;
    border-right: 1px solid var(--line);
    background: #fff;
}

.accounting-kpi span,
.accounting-kpi small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.accounting-kpi strong {
    display: block;
    margin: 5px 0 2px;
    color: #0f172a;
    font-size: 20px;
    line-height: 1.1;
}

.accounting-kpi.warning strong {
    color: #a15c00;
    font-size: 16px;
}

.accounting-workspace {
    display: grid;
    grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
    gap: 8px;
    padding: 8px;
}

.accounting-workspace.list {
    grid-template-columns: minmax(0, 1fr) 300px;
    align-items: start;
}

.accounting-workspace.dunning {
    grid-template-columns: minmax(0, 1fr);
}

.accounting-panel {
    min-width: 0;
    border: 1px solid var(--line);
    background: #fff;
}

.accounting-list-panel,
.accounting-list-sidebar {
    min-height: 260px;
}

.accounting-panel-head {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--line);
    background: #fafafa;
}

.accounting-panel-head h2 {
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
}

.accounting-panel-head span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.accounting-panel-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.accounting-panel-actions button {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #c7d4e2;
    border-radius: 3px;
    background: #fff;
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.accounting-panel-actions button:disabled {
    cursor: default;
    opacity: .55;
}

.accounting-panel-actions button.active {
    border-color: var(--blue);
    background: #eaf3ff;
    color: var(--blue);
}

.accounting-panel-actions.dunning-run-filter span {
    align-self: center;
    padding-left: 2px;
}

.accounting-panel-actions .material-symbols-outlined {
    color: currentColor;
    font-size: 17px;
    font-weight: 500;
}

.accounting-workflow,
.accounting-blocked-list,
.accounting-status-list {
    display: grid;
    gap: 0;
}

.accounting-workflow-step,
.accounting-blocked-list article,
.accounting-status-list article {
    min-height: 54px;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 9px 10px;
    border-bottom: 1px solid var(--line);
}

.accounting-workflow-step:last-child,
.accounting-blocked-list article:last-child,
.accounting-status-list article:last-child {
    border-bottom: 0;
}

.accounting-workflow-step .material-symbols-outlined,
.accounting-blocked-list .material-symbols-outlined {
    color: var(--blue);
    font-size: 20px;
}

.accounting-workflow-step.is-partial .material-symbols-outlined {
    color: #a15c00;
}

.accounting-workflow-step strong,
.accounting-blocked-list strong {
    display: block;
    font-size: 13px;
}

.accounting-workflow-step p,
.accounting-blocked-list p {
    margin: 2px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.accounting-workflow-step button:disabled {
    border-color: #e1dfdd;
    background: #f3f2f1;
}

.accounting-table {
    display: grid;
    font-size: 12px;
}

.accounting-table.open-items {
    grid-template-columns: 92px minmax(120px, 1.1fr) minmax(120px, 1fr) 120px 78px;
}

.accounting-table.recent-documents {
    grid-template-columns: 86px minmax(118px, 1fr) minmax(140px, 1.2fr) 92px 120px 78px;
}

.accounting-table.dunning-candidates {
    grid-template-columns: 88px minmax(118px, .9fr) minmax(140px, 1.1fr) 150px 132px 142px;
}

.accounting-table.dunning-preview-items {
    grid-template-columns: 88px minmax(118px, .95fr) minmax(140px, 1.1fr) 150px 70px;
}

.accounting-table.dunning-runs {
    grid-template-columns: minmax(118px, 1fr) 96px 112px 110px 142px minmax(132px, .9fr);
}

.accounting-table.dunning-fee-interest-preview {
    grid-template-columns: minmax(118px, .9fr) minmax(140px, 1fr) 104px 70px 104px 104px 104px;
    margin-top: 8px;
}

.accounting-table > * {
    min-width: 0;
    min-height: 38px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    padding: 6px 8px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.accounting-table > *:nth-child(-n + 5),
.accounting-table.recent-documents > *:nth-child(-n + 6),
.accounting-table.dunning-candidates > *:nth-child(-n + 6),
.accounting-table.dunning-runs > *:nth-child(-n + 6),
.accounting-table.dunning-fee-interest-preview > *:nth-child(-n + 7) {
    min-height: 30px;
    background: #f7f7f7;
    color: var(--muted);
    font-weight: 800;
}

.accounting-table.dunning-runs button {
    align-self: stretch;
    min-height: 30px;
    border: 1px solid var(--line-strong);
    background: #fff;
    color: var(--blue);
    font-weight: 800;
}

.accounting-table.dunning-runs mark.is-archived {
    background: #f3f2f1;
    color: #5f6368;
}

.accounting-table.dunning-runs mark.is-cancelled {
    background: #fff4e5;
    color: #a15c00;
}

.accounting-table.dunning-runs mark small {
    display: block;
    margin-top: 2px;
    color: inherit;
    font-size: 10px;
    font-weight: 700;
}

.accounting-table.dunning-runs > .accounting-dunning-fee-interest-snapshot-detail {
    grid-column: 1 / -1;
    min-height: 0;
    display: grid;
    gap: 8px;
    border-left: 3px solid var(--blue);
    background: #fff;
    padding: 8px;
}

.accounting-dunning-fee-interest-snapshot-detail header {
    min-height: 26px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.accounting-dunning-fee-interest-snapshot-detail header strong {
    color: var(--text);
    font-size: 12px;
}

.accounting-dunning-fee-interest-snapshot-detail header span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.accounting-dunning-fee-interest-snapshot-detail header mark {
    margin-left: auto;
}

.accounting-dunning-fee-interest-detail-grid {
    display: grid;
    grid-template-columns: minmax(118px, 1fr) 128px 112px 120px minmax(170px, 1.2fr);
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
    font-size: 11px;
}

.accounting-dunning-fee-interest-detail-grid > * {
    min-width: 0;
    min-height: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 5px 7px;
}

.accounting-dunning-fee-interest-detail-grid > *:nth-child(-n + 5) {
    min-height: 26px;
    background: #f7f7f7;
    color: var(--muted);
    font-weight: 800;
}

.accounting-inline-form.dunning-fee-interest-form {
    display: grid;
    grid-template-columns: repeat(6, minmax(108px, 1fr));
    gap: 8px;
    padding: 8px;
    border-top: 1px solid var(--line);
    background: #fafafa;
}

.accounting-inline-form.dunning-fee-interest-form label {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.accounting-inline-form.dunning-fee-interest-form label span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.accounting-inline-form.dunning-fee-interest-form select,
.accounting-inline-form.dunning-fee-interest-form input {
    width: 100%;
    min-width: 0;
    height: 28px;
    border: 1px solid var(--line-strong);
    border-radius: 2px;
    background: #fff;
    color: #1f2328;
    font: inherit;
    padding: 0 8px;
}

.accounting-inline-form.dunning-fee-interest-form select:disabled,
.accounting-inline-form.dunning-fee-interest-form input:disabled {
    background: #f3f2f1;
    color: var(--muted);
}

.accounting-dunning-preview-summary.fee-interest {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    margin-top: 8px;
}

.accounting-dunning-document-readiness {
    margin-top: 10px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 10px;
}

.accounting-dunning-document-readiness header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.accounting-dunning-document-readiness header mark {
    border-radius: 3px;
    padding: 2px 6px;
    font-weight: 800;
}

.accounting-dunning-document-readiness header mark.is-ready {
    background: #e9f7ef;
    color: #107c41;
}

.accounting-dunning-document-readiness header mark.is-blocked {
    background: #fde7e9;
    color: #a80000;
}

.accounting-dunning-run-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.accounting-dunning-run-actions button {
    min-height: 24px;
    padding: 0 8px;
    font-size: 11px;
}

.accounting-dunning-document-readiness.is-prepared {
    border-left: 3px solid #107c41;
}

.accounting-dunning-document-readiness.is-finalized {
    border-left: 3px solid #005a9e;
}

.accounting-dunning-document-readiness.is-dispatch {
    border-left: 3px solid #6b7280;
}

.accounting-dunning-document-readiness.is-dispatch-marked {
    border-left: 3px solid #107c41;
}

.accounting-table.dunning-prepared-documents,
.accounting-table.dunning-finalized-documents {
    grid-template-columns: minmax(180px, 1.2fr) minmax(120px, .8fr) minmax(160px, 1fr) minmax(120px, .8fr) 90px;
    margin-top: 8px;
}

.accounting-table.dunning-dispatch-readiness {
    grid-template-columns: minmax(180px, 1.2fr) minmax(120px, .8fr) minmax(160px, 1fr) minmax(120px, .8fr) 90px 128px;
    margin-top: 8px;
}

.accounting-table.dunning-dispatch-history {
    grid-template-columns: minmax(130px, .8fr) minmax(130px, .8fr) minmax(150px, 1fr) minmax(130px, .8fr) minmax(180px, 1.1fr) 104px 118px;
    margin-top: 8px;
}

.accounting-table.dunning-prepared-documents mark,
.accounting-table.dunning-finalized-documents mark,
.accounting-table.dunning-dispatch-readiness mark,
.accounting-table.dunning-dispatch-history mark,
.accounting-table.dunning-fee-interest-preview mark {
    justify-self: start;
}

.accounting-check-list.compact {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 0;
}

.accounting-table strong {
    color: #1f2328;
}

.accounting-table small {
    color: var(--muted);
}

.accounting-table mark {
    width: fit-content;
    border-radius: 3px;
    padding: 2px 6px;
    background: #e1f1ff;
    color: var(--blue);
    font-weight: 800;
}

.accounting-table mark.is-ready {
    background: #dcfce7;
    color: #166534;
}

.accounting-table mark.is-blocked {
    background: #fff4ce;
    color: #7c4a00;
}

.accounting-row-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
}

.accounting-row-actions button {
    min-height: 24px;
    border: 1px solid #c7d4e2;
    border-radius: 3px;
    background: #fff;
    color: var(--blue);
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.accounting-row-actions button:disabled {
    cursor: default;
    opacity: .55;
}

.accounting-check-list {
    display: grid;
    grid-template-columns: repeat(6, minmax(120px, 1fr));
    border-top: 1px solid var(--line);
}

.accounting-check {
    min-height: 86px;
    padding: 9px 10px;
    border-right: 1px solid var(--line);
    background: #fff;
}

.accounting-check:last-child {
    border-right: 0;
}

.accounting-check span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.accounting-check strong {
    display: block;
    margin: 4px 0;
    font-size: 13px;
}

.accounting-check p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.accounting-check.is-blocked strong {
    color: #a15c00;
}

.accounting-dunning-block-modal {
    width: min(540px, calc(100vw - 48px));
}

.accounting-dunning-block-modal textarea {
    min-height: 96px;
    resize: vertical;
}

.accounting-dunning-preview-modal {
    width: min(920px, calc(100vw - 48px));
}

.accounting-dunning-preview-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    border: 1px solid var(--line);
    background: #fff;
}

.accounting-dunning-preview-summary article {
    min-height: 62px;
    padding: 8px 10px;
    border-right: 1px solid var(--line);
}

.accounting-dunning-preview-summary article:last-child {
    border-right: 0;
}

.accounting-dunning-preview-summary span,
.accounting-dunning-preview-summary small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.accounting-dunning-preview-summary strong {
    display: block;
    margin: 3px 0;
    font-size: 18px;
}

.accounting-dunning-preview-warnings {
    display: grid;
    gap: 4px;
    margin: 10px 0;
}

.accounting-dunning-preview-warnings p,
.accounting-dunning-preview-blocked p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.accounting-dunning-preview-blocked {
    display: grid;
    gap: 5px;
    margin-top: 10px;
    padding: 8px 10px;
    border: 1px solid #f1d5a7;
    background: #fffaf0;
}

.accounting-status-list article {
    grid-template-columns: minmax(90px, .7fr) minmax(110px, 1fr) 46px;
}

.accounting-status-list span {
    color: var(--muted);
    font-weight: 700;
}

.accounting-status-list strong {
    font-size: 13px;
}

.accounting-status-list em {
    justify-self: end;
    font-style: normal;
    font-weight: 800;
}

.accounting-panel.blocked {
    grid-column: 1 / -1;
}

.accounting-blocked-list article {
    grid-template-columns: 26px minmax(0, 1fr);
}

.accounting-blocked-list small {
    display: block;
    margin-top: 4px;
    color: var(--blue);
    font-size: 11px;
    font-weight: 800;
}

.empty-state.compact {
    min-height: 136px;
    border: 0;
    background: #fff;
}

.error-state {
    border-color: #fecaca;
    background: #fff7f7;
}

.error-state .material-symbols-outlined {
    color: var(--danger);
}

.material-symbols-outlined {
    font-variation-settings:
        "FILL" 0,
        "wght" 500,
        "GRAD" 0,
        "opsz" 24;
    font-size: 20px;
    line-height: 1;
}

[data-view="employees"].employee-directory-view {
    overflow: hidden;
    background: #faf9f8;
    color: #1a1c1c;
    font-family: Inter, sans-serif;
    font-size: 12px;
    line-height: 16px;
}

[data-view="employees"].employee-directory-view.is-list-mode {
    height: auto;
    align-self: start;
}

[data-view="employees"].employee-directory-view.is-list-mode > .employee-directory-panel {
    height: auto;
}

[data-view="employees"].employee-directory-view.is-list-mode > .employee-directory-panel > .employee-table-workspace {
    flex: 0 0 auto;
}

[data-view="employees"] .employee-directory-panel {
    max-width: none;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #faf9f8;
    padding: 0;
}

[data-view="employees"] .employee-directory-header {
    min-height: 72px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
    padding: 8px 12px;
}

[data-view="employees"] .employee-directory-header h1 {
    margin: 0;
    color: #1a1c1c;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: 0;
}

[data-view="employees"] .employee-directory-header h1:focus {
    outline: none;
}

[data-view="employees"] .employee-directory-header p {
    margin: 2px 0 0;
    color: #605e5c;
    font-size: 12px;
    line-height: 16px;
}

[data-view="employees"] .employee-directory-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

[data-view="employees"] .employee-directory-actions button,
[data-view="employees"] .employee-directory-filter button {
    height: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

[data-view="employees"] .employee-directory-actions button.primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

[data-view="employees"] .employee-directory-actions .material-symbols-outlined,
[data-view="employees"] .employee-directory-filter .material-symbols-outlined {
    font-size: 16px;
}

[data-view="employees"] .employee-directory-filter.project-list-toolbar {
    order: 0;
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    padding: 4px 12px;
}

[data-view="employees"] .employee-directory-search {
    position: relative;
    flex: 1 1 260px;
    max-width: 448px;
}

[data-view="employees"] .employee-directory-search .material-symbols-outlined {
    position: absolute;
    left: 8px;
    top: 50%;
    color: #605e5c;
    transform: translateY(-50%);
}

[data-view="employees"] .employee-directory-search input,
[data-view="employees"] .employee-directory-select select {
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    outline: none;
}

[data-view="employees"] .employee-directory-search input {
    width: 100%;
    padding: 0 8px 0 32px;
}

[data-view="employees"] .employee-directory-select select {
    min-width: 120px;
    padding: 0 24px 0 8px;
}

[data-view="employees"] .employee-directory-filter strong {
    margin-left: auto;
    color: #605e5c;
    font-size: 11px;
    font-weight: 500;
    line-height: 14px;
    white-space: nowrap;
}

[data-view="employees"] .employee-table-workspace {
    flex: 1 1 auto;
    overflow: auto;
    background: #fff;
}

[data-view="employees"] .employee-table-workspace::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

[data-view="employees"] .employee-table-workspace::-webkit-scrollbar-track {
    background: #f1f1f1;
}

[data-view="employees"] .employee-table-workspace::-webkit-scrollbar-thumb {
    background: #c1c7d2;
}

[data-view="employees"] .employee-data-table.employee-list-table {
    width: 100%;
    min-width: 1190px;
    table-layout: fixed;
    border: 0;
    border-collapse: collapse;
    border-radius: 0;
    background: #fff;
    text-align: left;
}

[data-view="employees"] .employee-data-table thead {
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 1px solid #c1c7d2;
    background: #f3f2f1;
}

[data-view="employees"] .employee-data-table th,
[data-view="employees"] .employee-data-table td {
    height: 32px !important;
    border-right: 1px solid #c1c7d2;
    border-bottom: 1px solid #c1c7d2;
    padding: 0 8px;
    vertical-align: middle;
    white-space: nowrap;
}

[data-view="employees"] .employee-data-table th {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

[data-view="employees"] .employee-data-table td {
    color: #1a1c1c;
    font-size: 11px;
}

[data-view="employees"] .employee-data-table th:last-child,
[data-view="employees"] .employee-data-table td:last-child {
    border-right: 0;
    text-align: center;
}

[data-view="employees"] .employee-data-table th:nth-child(1),
[data-view="employees"] .employee-data-table td:nth-child(1) {
    width: 220px;
}

[data-view="employees"] .employee-data-table th:nth-child(2),
[data-view="employees"] .employee-data-table td:nth-child(2) {
    width: 150px;
}

[data-view="employees"] .employee-data-table th:nth-child(3),
[data-view="employees"] .employee-data-table td:nth-child(3) {
    width: 130px;
}

[data-view="employees"] .employee-data-table th:nth-child(4),
[data-view="employees"] .employee-data-table td:nth-child(4) {
    width: 120px;
}

[data-view="employees"] .employee-data-table th:nth-child(5),
[data-view="employees"] .employee-data-table td:nth-child(5) {
    width: 170px;
}

[data-view="employees"] .employee-data-table th:nth-child(6),
[data-view="employees"] .employee-data-table td:nth-child(6) {
    width: 310px;
}

[data-view="employees"] .employee-data-table th:nth-child(7),
[data-view="employees"] .employee-data-table td:nth-child(7) {
    width: 90px;
}

[data-view="employees"] .employee-data-table .project-list-row {
    height: 32px !important;
    min-width: 0 !important;
    display: table-row !important;
    grid-template-columns: none !important;
    border: 0;
    background: #fff;
    cursor: pointer;
    transition: background-color 75ms ease;
}

[data-view="employees"] .employee-data-table .project-list-row[hidden] {
    display: none !important;
}

[data-view="employees"] .employee-data-table .project-list-row > * {
    min-height: 0 !important;
    display: table-cell !important;
    align-items: initial !important;
    border-right: 1px solid #c1c7d2;
    padding: 0 8px !important;
}

[data-view="employees"] .employee-data-table .project-list-row:nth-child(even) {
    background: #f8f8f8;
}

[data-view="employees"] .employee-data-table .project-list-row:hover td {
    background: #e1f1ff;
}

[data-view="employees"] .employee-data-table .project-list-row.is-selected td {
    background: #d3e4ff;
}

[data-view="employees"] .employee-data-table .project-list-row.is-selected td:first-child {
    box-shadow: inset 2px 0 0 #004277;
}

[data-view="employees"] .employee-data-table .project-list-row.is-archived td {
    color: #727782;
    background: #f4f3f2;
}

[data-view="employees"] .employee-name-cell strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 600;
}

[data-view="employees"] .employee-name-cell {
    display: table-cell !important;
}

[data-view="employees"] .employee-table-avatar {
    width: 20px;
    height: 20px;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    border-radius: 2px;
    font-size: 9px;
    font-weight: 800;
    vertical-align: middle;
}

[data-view="employees"] .employee-table-avatar.blue {
    background: #dbeafe;
    color: #1e40af;
}

[data-view="employees"] .employee-table-avatar.gray {
    background: #f3f4f6;
    color: #1f2937;
}

[data-view="employees"] .employee-table-avatar.purple {
    background: #f3e8ff;
    color: #6b21a8;
}

[data-view="employees"] .employee-table-avatar.orange {
    background: #ffedd5;
    color: #9a3412;
}

[data-view="employees"] .employee-table-avatar.yellow {
    background: #fef9c3;
    color: #854d0e;
}

[data-view="employees"] .employee-table-avatar.cyan {
    background: #cffafe;
    color: #155e75;
}

[data-view="employees"] .employee-data-table mark,
[data-view="employees"] .employee-profile-head mark {
    display: inline-flex;
    align-items: center;
    border-radius: 2px;
    background: #dcfce7;
    padding: 1px 6px;
    color: #15803d;
    font-size: 10px;
    font-weight: 700;
    line-height: 14px;
}

[data-view="employees"] .employee-data-table mark.warning,
[data-view="employees"] .employee-profile-head mark.warning {
    background: #ffdad6;
    color: #93000a;
}

[data-view="employees"] .employee-data-table mark.muted,
[data-view="employees"] .employee-profile-head mark.muted {
    background: #d3e4ff;
    color: #001c38;
}

[data-view="employees"] .employee-data-table td:nth-child(6) {
    white-space: nowrap;
}

[data-view="employees"] .employee-data-table td:nth-child(6) span {
    min-height: 18px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #efeeed;
    padding: 0 4px;
    color: #1a1c1c;
    font-size: 10px;
    line-height: 14px;
    margin-right: 4px;
}

[data-view="employees"] .employee-data-table td:last-child button {
    min-height: 0;
    height: auto;
    border: 0;
    background: transparent;
    padding: 0;
    color: #004277;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

[data-view="employees"] .employee-directory-footer {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid #c1c7d2;
    background: #faf9f8;
    padding: 0 12px;
    color: #605e5c;
    font-size: 11px;
}

[data-view="employees"] .employee-directory-footer > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

[data-view="employees"] .employee-directory-footer i {
    width: 1px;
    height: 16px;
    background: #c1c7d2;
}

[data-view="employees"] .employee-directory-footer select {
    height: 24px;
    border: 0;
    background: transparent;
    padding: 0 18px 0 0;
    color: #1a1c1c;
    font-size: 11px;
}

[data-view="employees"] .employee-directory-pages button {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
}

[data-view="employees"] .employee-directory-pages button.active {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

[data-view="employees"] .employee-directory-pages .material-symbols-outlined {
    font-size: 14px;
}

[data-view="employees"] .employee-workspace {
    flex: 0 0 auto;
    max-height: 42vh;
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    overflow: auto;
    border-top: 1px solid #c1c7d2;
    background: #faf9f8;
    padding: 12px;
}

[data-view="employees"] .overview-card {
    min-width: 0;
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid #d7e0ea;
    border-radius: 6px;
    background: #fff;
}

[data-view="employees"] .overview-card-title {
    margin: 0;
    color: #5f6973;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="employees"] .employee-profile-card {
    gap: 14px;
}

[data-view="employees"] .employee-profile-head {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}

[data-view="employees"] .employee-profile-head h2 {
    margin: 0;
    color: #24313e;
    font-size: 18px;
    letter-spacing: 0;
}

[data-view="employees"] .employee-profile-head p {
    margin: 3px 0 0;
    color: #64717f;
}

[data-view="employees"] .employee-avatar {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    background: #eaf1ff;
    color: #2f63c8;
    font-weight: 800;
}

[data-view="employees"] .employee-profile-actions,
[data-view="employees"] .employee-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

[data-view="employees"] .employee-profile-actions button,
[data-view="employees"] .employee-form-actions button,
[data-view="employees"] .employee-card-form button {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 10px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

[data-view="employees"] .employee-profile-actions span {
    color: #727782;
    font-weight: 800;
}

[data-view="employees"] .employee-form-actions button.primary,
[data-view="employees"] .employee-card-form button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

[data-view="employees"] .employee-facts,
[data-view="employees"] .employee-metric-list {
    margin: 0;
    display: grid;
    gap: 0;
    border: 1px solid #e2e7ee;
    border-radius: 6px;
    overflow: hidden;
}

[data-view="employees"] .employee-facts div,
[data-view="employees"] .employee-metric-list div {
    min-height: 42px;
    padding: 9px 11px;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 10px;
    border-bottom: 1px solid #edf1f6;
    background: #fff;
}

[data-view="employees"] .employee-facts div:last-child,
[data-view="employees"] .employee-metric-list div:last-child {
    border-bottom: 0;
}

[data-view="employees"] .employee-facts dt,
[data-view="employees"] .employee-metric-list dt {
    color: #64717f;
    font-weight: 700;
}

[data-view="employees"] .employee-facts dd,
[data-view="employees"] .employee-metric-list dd {
    margin: 0;
    color: #24313e;
}

[data-view="employees"] .employee-record-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

[data-view="employees"] .employee-wide-card {
    grid-column: 1 / -1;
}

[data-view="employees"] .employee-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

[data-view="employees"] .employee-chip-list span {
    min-height: 30px;
    padding: 6px 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #d9e3f3;
    border-radius: 6px;
    background: #f6f9fe;
    color: #2f63c8;
    font-weight: 750;
}

[data-view="employees"] .employee-chip-list small {
    color: #64717f;
    font-size: 10px;
}

[data-view="employees"] .employee-chip-list button {
    width: 18px;
    height: 18px;
    min-height: 18px;
    border: 0;
    border-radius: 999px;
    background: #dbeafe;
    padding: 0;
    color: #1e40af;
    font-size: 10px;
    font-weight: 900;
}

[data-view="employees"] .employee-document-list {
    display: grid;
    gap: 8px;
}

[data-view="employees"] .employee-document-list button {
    min-height: 36px;
    justify-content: flex-start;
    border: 1px solid #d7e0ea;
    border-radius: 6px;
    background: #fff;
    padding: 0 10px;
    color: #64717f;
    font-weight: 700;
}

[data-view="employees"] .employee-history {
    display: grid;
    gap: 0;
    border-top: 1px solid #edf1f6;
}

[data-view="employees"] .employee-history div {
    min-height: 40px;
    padding: 9px 0;
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 14px;
    border-bottom: 1px solid #edf1f6;
}

[data-view="employees"] .employee-history time {
    color: #64717f;
    font-weight: 700;
}

[data-view="employees"] .employee-history span {
    color: #24313e;
}

[data-view="employees"] .employee-event-list {
    display: grid;
    gap: 8px;
}

[data-view="employees"] .employee-event-list div {
    min-height: 46px;
    padding: 10px 12px;
    display: grid;
    gap: 3px;
    border: 1px solid #e2e7ee;
    border-radius: 6px;
    background: #fbfcfe;
}

[data-view="employees"] .employee-event-list strong {
    color: #24313e;
}

[data-view="employees"] .employee-event-list span {
    color: #64717f;
}

[data-view="employees"] .employee-event-list.compact div {
    min-height: 38px;
    grid-template-columns: 100px minmax(0, 1fr) auto;
    align-items: center;
}

[data-view="employees"] .employee-event-actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

[data-view="employees"] .employee-event-actions button {
    min-height: 24px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 8px;
    color: #004277;
    font-size: 10px;
    font-weight: 800;
}

[data-view="employees"] .employee-modal-backdrop {
    z-index: 170;
    background: rgba(24, 31, 38, 0.35);
}

[data-view="employees"] .employee-modal.project-modal {
    width: min(720px, calc(100vw - 32px));
    max-height: min(92vh, 820px);
    z-index: 180;
}

[data-view="employees"] .employee-modal .modal-head {
    min-height: 56px;
    padding: 0 16px;
}

[data-view="employees"] .employee-modal .modal-head strong {
    font-size: 14px;
    line-height: 20px;
}

[data-view="employees"] .employee-modal .modal-head button {
    width: 32px;
    height: 32px;
    min-height: 32px;
}

[data-view="employees"] .employee-modal .modal-head button .material-symbols-outlined {
    font-size: 18px;
}

[data-view="employees"] .employee-modal .modal-body {
    padding: 16px;
    gap: 14px;
    overscroll-behavior: contain;
}

[data-view="employees"] .employee-modal-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

[data-view="employees"] .employee-modal-form label,
[data-view="employees"] .employee-modal-notes {
    display: grid;
    gap: 6px;
    color: #3a424b;
    font-family: Inter, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

[data-view="employees"] .employee-modal-form input,
[data-view="employees"] .employee-modal-form select,
[data-view="employees"] .employee-modal-notes textarea {
    width: 100%;
    min-height: 38px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 8px 10px;
    color: #1a1c1c;
    font: 400 12px/16px Inter, sans-serif;
}

[data-view="employees"] .employee-modal-form input:focus,
[data-view="employees"] .employee-modal-form select:focus,
[data-view="employees"] .employee-modal-notes textarea:focus {
    border-color: #005a9e;
    outline: 2px solid rgba(0, 90, 158, 0.18);
    outline-offset: 0;
}

[data-view="employees"] .employee-modal-form input[readonly] {
    background: #efeeed;
    color: #414750;
    font-family: "JetBrains Mono", monospace;
}

[data-view="employees"] .employee-modal-form .wide {
    grid-column: 1 / -1;
}

[data-view="employees"] .employee-modal-notes textarea {
    min-height: 120px;
    resize: vertical;
}

[data-view="employees"] .employee-modal-errors {
    display: grid;
    gap: 3px;
}

[data-view="employees"] .employee-modal .modal-actions {
    min-height: 56px;
}

[data-view="employees"] .employee-export-modal.project-modal {
    width: min(620px, calc(100vw - 32px));
}

[data-view="employees"] .employee-export-body > p {
    margin: 0;
    color: #5c6773;
    font-size: 12px;
    line-height: 18px;
}

[data-view="employees"] .employee-export-format {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 0;
    border: 1px solid #d5dae1;
    padding: 10px 12px;
}

[data-view="employees"] .employee-export-format legend {
    padding: 0 4px;
    color: #3a424b;
    font-size: 11px;
    font-weight: 800;
}

[data-view="employees"] .employee-export-format label,
[data-view="employees"] .employee-export-check {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #29323b;
    font-size: 12px;
    font-weight: 600;
}

[data-view="employees"] .employee-export-format input,
[data-view="employees"] .employee-export-check input {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: #005a9e;
}

[data-view="employees"] .employee-export-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

[data-view="employees"] .employee-export-form label {
    display: grid;
    gap: 6px;
    color: #3a424b;
    font-size: 12px;
    font-weight: 700;
}

[data-view="employees"] .employee-export-form label.wide {
    grid-column: 1 / -1;
}

[data-view="employees"] .employee-export-form input {
    width: 100%;
    min-height: 38px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 8px 10px;
    color: #1a1c1c;
    font: 400 12px/16px Inter, sans-serif;
}

[data-view="employees"] .employee-export-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
    border: 1px solid #d5dae1;
    background: #f7f8fa;
}

[data-view="employees"] .employee-export-summary div {
    min-width: 0;
    padding: 9px 10px;
}

[data-view="employees"] .employee-export-summary div + div {
    border-left: 1px solid #d5dae1;
}

[data-view="employees"] .employee-export-summary dt {
    color: #6a7580;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

[data-view="employees"] .employee-export-summary dd {
    overflow: hidden;
    margin: 2px 0 0;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="employees"] .employee-detail-card {
    border: 1px solid #c1c7d2;
    background: #fff;
}

[data-view="employees"] .employee-detail-card header {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
    padding: 0 12px;
}

[data-view="employees"] .employee-detail-card h3 {
    margin: 0;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

[data-view="employees"] .employee-detail-card header button {
    min-height: 24px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 10px;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 800;
}

[data-view="employees"] .employee-detail-form,
[data-view="employees"] .employee-card-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 12px;
    row-gap: 10px;
    padding: 12px;
}

[data-view="employees"] .employee-detail-form label,
[data-view="employees"] .employee-card-form label {
    display: grid;
    gap: 4px;
    color: #727782;
    font-family: "JetBrains Mono", monospace;
    font-size: 10px;
    font-weight: 700;
}

[data-view="employees"] .employee-detail-form input,
[data-view="employees"] .employee-detail-form select,
[data-view="employees"] .employee-detail-form textarea,
[data-view="employees"] .employee-card-form input,
[data-view="employees"] .employee-card-form select {
    width: 100%;
    min-height: 32px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font: 400 11px/14px Inter, sans-serif;
}

[data-view="employees"] .employee-detail-form textarea {
    min-height: 78px;
    padding: 8px;
    resize: vertical;
}

[data-view="employees"] .employee-detail-form input[readonly] {
    background: #efeeed;
    font-family: "JetBrains Mono", monospace;
}

[data-view="employees"] .employee-detail-form .wide,
[data-view="employees"] .employee-card-form .wide,
[data-view="employees"] .employee-card-form .employee-form-actions {
    grid-column: 1 / -1;
}

[data-view="employees"] .employee-empty-inline {
    margin: 0;
    color: #64717f;
    font-weight: 700;
}

[data-view="employees"] .employee-table-state {
    margin: 12px;
}

@media (max-width: 1180px) {
    [data-view="employees"] .employee-workspace {
        grid-template-columns: 1fr;
        max-height: none;
    }

    [data-view="employees"] .employee-record-grid,
    [data-view="employees"] .employee-detail-form,
    [data-view="employees"] .employee-card-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    [data-view="employees"] .employee-modal-form {
        grid-template-columns: 1fr;
    }

    [data-view="employees"] .employee-modal-form .wide {
        grid-column: auto;
    }
}

[data-view="employees"].employee-directory-view.is-detail-mode > .employee-directory-panel > .employee-directory-header,
[data-view="employees"].employee-directory-view.is-detail-mode > .employee-directory-panel > .employee-directory-filter,
[data-view="employees"].employee-directory-view.is-detail-mode > .employee-directory-panel > .employee-table-workspace,
[data-view="employees"].employee-directory-view.is-detail-mode > .employee-directory-panel > .employee-directory-footer,
[data-view="employees"].employee-directory-view.is-detail-mode > .employee-directory-panel > .employee-workspace {
    display: none !important;
}

[data-view="employees"].employee-directory-view.is-detail-mode > .employee-directory-panel {
    min-height: calc(100vh - 44px);
}

[data-view="employee-detail"].employee-detail-view {
    width: 100%;
    min-height: calc(100vh - 44px);
    flex: 1 1 auto;
    overflow: hidden;
    background: #f1f3f4;
    color: #1a1c1c;
    font-family: Inter, sans-serif;
    font-size: 11px;
    line-height: 14px;
}

[data-view="employee-detail"] .employee-detail-modern {
    width: 100%;
    min-height: calc(100vh - 44px);
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #f1f3f4;
}

[data-view="employee-detail"] .employee-detail-appbar {
    height: 32px;
    flex: 0 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
    padding: 0 12px;
}

[data-view="employee-detail"] .employee-detail-appbar nav,
[data-view="employee-detail"] .employee-detail-appbar > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

[data-view="employee-detail"] .employee-detail-appbar button {
    min-height: 24px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    padding: 0 4px;
    color: #605e5c;
    font-size: 11px;
}

[data-view="employee-detail"] .employee-detail-appbar strong {
    color: #1a1c1c;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-user {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c1c7d2;
    border-radius: 999px;
    background: #005a9e;
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}

[data-view="employee-detail"] .employee-detail-hero {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
    padding: 16px 12px 12px;
}

[data-view="employee-detail"] .employee-detail-identity {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

[data-view="employee-detail"] .employee-detail-avatar {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #e6e2df;
    color: #666462;
    font-size: 14px;
    font-weight: 800;
}

[data-view="employee-detail"] .employee-detail-name-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

[data-view="employee-detail"] .employee-detail-name-row h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 800;
    line-height: 20px;
}

[data-view="employee-detail"] .employee-detail-name-row mark {
    border-radius: 4px;
    background: #dcfce7;
    padding: 2px 6px;
    color: #166534;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[data-view="employee-detail"] .employee-detail-name-row mark.warning {
    background: #ffdad6;
    color: #93000a;
}

[data-view="employee-detail"] .employee-detail-name-row mark.muted {
    background: #d3e4ff;
    color: #001c38;
}

[data-view="employee-detail"] .employee-detail-identity p {
    margin: 2px 0 0;
    color: #727782;
    font-size: 11px;
}

[data-view="employee-detail"] .employee-detail-hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

[data-view="employee-detail"] .employee-detail-hero-actions button,
[data-view="employee-detail"] .employee-detail-card header button,
[data-view="employee-detail"] .employee-detail-wide-card header button,
[data-view="employee-detail"] .employee-detail-action-row button {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 12px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-hero-actions button.primary,
[data-view="employee-detail"] .employee-detail-card header button[data-save-employee-profile],
[data-view="employee-detail"] .employee-detail-wide-card header button,
[data-view="employee-detail"] .employee-detail-action-row button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

[data-view="employee-detail"] .employee-detail-card header button {
    min-height: 24px;
    padding: 0 10px;
    font-size: 10px;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="employee-detail"] .employee-detail-tabs {
    flex: 0 0 37px;
    display: flex;
    align-items: flex-end;
    gap: 28px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
    padding: 0 12px;
    overflow-x: auto;
}

[data-view="employee-detail"] .employee-detail-tabs button {
    height: 36px;
    flex: 0 0 auto;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    padding: 0 4px 8px;
    color: #414750;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

[data-view="employee-detail"] .employee-detail-tabs button.is-active {
    border-bottom-color: #005a9e;
    color: #005a9e;
}

[data-view="employee-detail"] .employee-detail-content {
    flex: 1 1 auto;
    overflow: auto;
    padding: 8px;
}

[data-view="employee-detail"] .employee-detail-panel {
    display: none;
}

[data-view="employee-detail"] .employee-detail-panel.active {
    display: grid;
    grid-template-columns: minmax(170px, 2fr) minmax(420px, 7fr) minmax(260px, 3fr);
    gap: 8px;
    align-items: start;
}

[data-view="employee-detail"] .employee-detail-panel.active:not([data-employee-tab-panel="overview"]) {
    grid-template-columns: 1fr;
}

[data-view="employee-detail"] .employee-detail-left,
[data-view="employee-detail"] .employee-detail-main,
[data-view="employee-detail"] .employee-detail-right {
    display: grid;
    gap: 8px;
    align-content: start;
}

[data-view="employee-detail"] .employee-detail-photo-card,
[data-view="employee-detail"] .employee-detail-card,
[data-view="employee-detail"] .employee-detail-widget {
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

[data-view="employee-detail"] .employee-detail-photo-card {
    min-height: 190px;
    display: grid;
    place-items: center;
    gap: 8px;
    padding: 12px;
}

[data-view="employee-detail"] .employee-detail-photo-card > span {
    width: 100%;
    aspect-ratio: 1;
    max-height: 168px;
    display: grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background:
        radial-gradient(circle at 50% 32%, #dadad9 0 30px, transparent 31px),
        radial-gradient(ellipse at 50% 88%, #dadad9 0 70px, transparent 71px),
        #f4f3f2;
    color: #414750;
    font-size: 0;
}

[data-view="employee-detail"] .employee-detail-photo-card small {
    color: #727782;
    font-family: "JetBrains Mono", monospace;
    font-size: 10px;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-settings {
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
}

[data-view="employee-detail"] .employee-detail-settings button {
    width: 100%;
    height: 32px;
    display: flex;
    align-items: center;
    border: 0;
    border-left: 4px solid transparent;
    border-radius: 0;
    background: #fff;
    padding: 0 12px;
    color: #414750;
    font-size: 11px;
    text-align: left;
}

[data-view="employee-detail"] .employee-detail-settings button.is-active {
    border-left-color: #005a9e;
    background: rgba(211, 228, 255, 0.36);
    color: #005a9e;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-settings button:not(:disabled):hover {
    background: #efeeed;
}

[data-view="employee-detail"] .employee-detail-card {
    overflow: hidden;
}

[data-view="employee-detail"] .employee-detail-card header,
[data-view="employee-detail"] .employee-detail-widget h3 {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
    padding: 0 12px;
}

[data-view="employee-detail"] .employee-detail-card h3,
[data-view="employee-detail"] .employee-detail-widget h3 {
    margin: 0;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

[data-view="employee-detail"] .employee-detail-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 12px;
    padding: 16px;
}

[data-view="employee-detail"] .employee-detail-form.compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

[data-view="employee-detail"] .employee-detail-form label {
    display: grid;
    gap: 4px;
    color: #727782;
    font-family: "JetBrains Mono", monospace;
    font-size: 10px;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-form input,
[data-view="employee-detail"] .employee-detail-form select {
    width: 100%;
    min-height: 32px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font: 400 11px/14px Inter, sans-serif;
}

[data-view="employee-detail"] .employee-detail-form input[readonly] {
    background: #efeeed;
    font-family: "JetBrains Mono", monospace;
}

[data-view="employee-detail"] .employee-detail-form label.wide {
    grid-column: 1 / -1;
}

[data-view="employee-detail"] .employee-detail-form .employee-detail-checkbox {
    display: flex;
    grid-template-columns: 18px 1fr;
    align-items: center;
    align-self: end;
    min-height: 32px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    padding: 0 8px;
    color: #414750;
    font-family: Inter, sans-serif;
}

[data-view="employee-detail"] .employee-detail-form .employee-detail-checkbox input {
    width: 14px;
    min-height: 14px;
    margin: 0;
}

[data-view="employee-detail"] .employee-setting-hint {
    margin: 0;
    border-top: 1px solid #e2e5e9;
    background: #f7f8f9;
    padding: 10px 16px;
    color: #5f6670;
    font-size: 10px;
}

[data-view="employee-detail"] .employee-detail-notes {
    display: block;
    padding: 16px;
}

[data-view="employee-detail"] .employee-detail-notes textarea {
    width: 100%;
    min-height: 220px;
    resize: vertical;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    padding: 10px;
    color: #1a1c1c;
    font: 400 11px/17px Inter, sans-serif;
}

[data-view="employee-detail"] .employee-detail-card header > div:first-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

[data-view="employee-detail"] .employee-detail-card header small {
    overflow: hidden;
    color: #727782;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="employee-detail"] .employee-access-panel {
    min-height: 260px;
}

[data-view="employee-detail"] .employee-access-empty,
[data-view="employee-detail"] .employee-detail-state {
    min-height: 170px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 24px;
    color: #727782;
    text-align: left;
}

[data-view="employee-detail"] .employee-access-empty .material-symbols-outlined,
[data-view="employee-detail"] .employee-detail-state .material-symbols-outlined {
    color: #005a9e;
    font-size: 28px;
}

[data-view="employee-detail"] .employee-access-empty strong,
[data-view="employee-detail"] .employee-access-empty p {
    display: block;
    margin: 0;
}

[data-view="employee-detail"] .employee-access-empty a,
[data-view="employee-detail"] .employee-detail-link-button {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 10px;
    color: #004277;
    font-size: 10px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

[data-view="employee-detail"] .employee-access-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    border-bottom: 1px solid #c1c7d2;
}

[data-view="employee-detail"] .employee-access-summary div {
    display: grid;
    gap: 3px;
    padding: 10px 16px;
    border-right: 1px solid #e2e5e9;
}

[data-view="employee-detail"] .employee-access-summary dt,
[data-view="employee-detail"] .employee-access-summary dd {
    margin: 0;
}

[data-view="employee-detail"] .employee-access-summary dt {
    color: #727782;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

[data-view="employee-detail"] .employee-role-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 16px;
}

[data-view="employee-detail"] .employee-role-grid label {
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    padding: 8px 10px;
}

[data-view="employee-detail"] .employee-role-grid input {
    width: 15px;
    height: 15px;
    margin: 0;
}

[data-view="employee-detail"] .employee-role-grid span,
[data-view="employee-detail"] .employee-role-grid small {
    min-width: 0;
    display: block;
}

[data-view="employee-detail"] .employee-role-grid small {
    overflow: hidden;
    color: #727782;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="employee-detail"] .employee-permission-list {
    border-top: 1px solid #e2e5e9;
    padding: 12px 16px;
}

[data-view="employee-detail"] .employee-permission-list p {
    margin: 4px 0 0;
    color: #5f6670;
    font: 400 9px/14px "JetBrains Mono", monospace;
}

[data-view="employee-detail"] .employee-detail-form input:focus,
[data-view="employee-detail"] .employee-detail-form select:focus {
    border-color: #005a9e;
    outline: none;
}

[data-view="employee-detail"] .employee-profile-errors {
    margin: 12px 16px 0;
}

[data-view="employee-detail"] .employee-detail-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 16px 16px 12px;
}

[data-view="employee-detail"] .employee-detail-chip-list span {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #bfdbfe;
    border-radius: 4px;
    background: #eff6ff;
    padding: 0 10px;
    color: #1e40af;
    font-size: 11px;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-chip-list > span {
    gap: 6px;
}

[data-view="employee-detail"] .employee-detail-chip-list > span > button {
    width: 18px;
    height: 18px;
    min-height: 18px;
    border: 0;
    background: transparent;
    margin: 0 -4px 0 0;
    padding: 0;
    color: #1e40af;
}

[data-view="employee-detail"] .employee-detail-chip-list > span > button .material-symbols-outlined {
    font-size: 14px;
}

[data-view="employee-detail"] .employee-detail-empty {
    margin: 0;
    padding: 16px;
    color: #727782;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-alert {
    margin: 0 16px 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #fde68a;
    border-radius: 4px;
    background: #fffbeb;
    padding: 8px;
    color: #92400e;
}

[data-view="employee-detail"] .employee-detail-alert .material-symbols-outlined {
    color: #d97706;
}

[data-view="employee-detail"] .employee-detail-action-row {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 16px 16px;
}

[data-view="employee-detail"] .employee-detail-timeline {
    display: grid;
    gap: 12px;
    padding: 16px;
}

[data-view="employee-detail"] .employee-detail-timeline article {
    position: relative;
    padding-left: 24px;
}

[data-view="employee-detail"] .employee-detail-timeline article::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 15px;
    bottom: -15px;
    width: 2px;
    background: #c1c7d2;
}

[data-view="employee-detail"] .employee-detail-timeline article:last-child::before {
    display: none;
}

[data-view="employee-detail"] .employee-detail-timeline i {
    position: absolute;
    left: 0;
    top: 3px;
    width: 10px;
    height: 10px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #005a9e;
    box-shadow: 0 0 0 1px #c1c7d2;
}

[data-view="employee-detail"] .employee-detail-timeline p {
    margin: 0;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-timeline small {
    color: #727782;
    font-size: 10px;
}

[data-view="employee-detail"] .employee-detail-widget {
    overflow: hidden;
}

[data-view="employee-detail"] .employee-detail-widget > span,
[data-view="employee-detail"] .employee-detail-widget > div,
[data-view="employee-detail"] .employee-detail-widget > i {
    margin: 12px;
}

[data-view="employee-detail"] .employee-detail-widget > span {
    display: block;
    color: #727782;
    font-family: "JetBrains Mono", monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[data-view="employee-detail"] .employee-detail-widget > div:not(.employee-detail-documents) {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

[data-view="employee-detail"] .employee-detail-widget strong {
    color: #1a1c1c;
    font-size: 18px;
    font-style: normal;
    line-height: 24px;
}

[data-view="employee-detail"] .employee-detail-widget em {
    color: #005a9e;
    font-style: normal;
    font-weight: 700;
}

[data-view="employee-detail"] .employee-detail-widget > i {
    height: 6px;
    display: block;
    overflow: hidden;
    border-radius: 999px;
    background: #efeeed;
}

[data-view="employee-detail"] .employee-detail-widget > i b {
    height: 100%;
    display: block;
    background: #005a9e;
}

[data-view="employee-detail"] .employee-detail-vacation {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

[data-view="employee-detail"] .employee-detail-vacation p {
    min-height: 64px;
    display: grid;
    place-items: center;
    margin: 0;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #f4f3f2;
    text-align: center;
}

[data-view="employee-detail"] .employee-detail-vacation strong {
    font-size: 14px;
    line-height: 18px;
}

[data-view="employee-detail"] .employee-detail-vacation small {
    color: #727782;
    font-size: 10px;
}

[data-view="employee-detail"] .employee-detail-widget button,
[data-view="employee-detail"] .employee-detail-documents button {
    width: 100%;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border: 0;
    border-top: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    padding: 8px 12px;
    color: #1a1c1c;
    text-align: left;
}

[data-view="employee-detail"] .employee-detail-widget button b {
    display: block;
}

[data-view="employee-detail"] .employee-detail-widget button small {
    display: block;
    color: #727782;
    font-size: 10px;
}

[data-view="employee-detail"] .employee-detail-widget button:not(:disabled):hover,
[data-view="employee-detail"] .employee-detail-documents button:not(:disabled):hover {
    background: #efeeed;
}

[data-view="employee-detail"] .employee-detail-documents {
    display: grid;
    margin: 0;
}

[data-view="employee-detail"] .employee-detail-kpi-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 16px;
}

[data-view="employee-detail"] .employee-detail-kpi-row article {
    min-height: 86px;
    display: grid;
    align-content: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #f4f3f2;
    padding: 12px;
}

[data-view="employee-detail"] .employee-detail-kpi-row span,
[data-view="employee-detail"] .employee-detail-kpi-row small {
    color: #727782;
}

[data-view="employee-detail"] .employee-detail-kpi-row strong {
    color: #1a1c1c;
    font-size: 20px;
}

[data-view="employee-detail"] .employee-time-period-actions,
[data-view="employee-detail"] .employee-document-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

[data-view="employee-detail"] .employee-time-period-actions input,
[data-view="employee-detail"] .employee-document-archive-filter select {
    height: 30px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font: 600 10px/14px Inter, sans-serif;
}

[data-view="employee-detail"] .employee-document-archive-filter {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #727782;
    font-size: 9px;
    font-weight: 800;
}

[data-view="employee-detail"] .employee-time-kpis strong.is-positive,
[data-view="employee-detail"] .employee-time-table .is-positive {
    color: #166534;
}

[data-view="employee-detail"] .employee-time-kpis strong.is-negative,
[data-view="employee-detail"] .employee-time-table .is-negative {
    color: #b91c1c;
}

[data-view="employee-detail"] .employee-time-warning {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 16px 12px;
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    padding: 8px 10px;
    color: #1e3a5f;
    font-size: 9px;
}

[data-view="employee-detail"] .employee-time-entry-table > div {
    grid-template-columns: 0.9fr 1.1fr 2fr 0.8fr 0.9fr;
}

[data-view="employee-detail"] .employee-time-table span {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
}

[data-view="employee-detail"] .employee-time-table span small,
[data-view="employee-detail"] .employee-document-table span small {
    display: block;
    color: #727782;
    font-size: 9px;
}

[data-view="employee-detail"] .employee-time-status {
    border-radius: 3px;
    background: #e8eaed;
    padding: 2px 6px;
    color: #414750;
    font-size: 9px;
    font-weight: 800;
}

[data-view="employee-detail"] .employee-time-status.approved {
    background: #dcfce7;
    color: #166534;
}

[data-view="employee-detail"] .employee-time-status.submitted {
    background: #dbeafe;
    color: #1e40af;
}

[data-view="employee-detail"] .employee-document-status {
    margin: 10px 16px 0;
    border-left: 3px solid #188038;
    background: #f0f8f2;
    padding: 8px 10px;
    color: #166534;
    font-size: 10px;
}

[data-view="employee-detail"] .employee-document-table > div {
    grid-template-columns: 2.4fr 1fr 1fr 0.7fr;
}

[data-view="employee-detail"] .employee-document-table > div.is-archived {
    opacity: 0.62;
}

[data-view="employee-detail"] .employee-document-table > div > span:first-child {
    gap: 8px;
}

[data-view="employee-detail"] .employee-document-table .material-symbols-outlined {
    flex: 0 0 auto;
    color: #005a9e;
    font-size: 17px;
}

[data-view="employee-detail"] .employee-document-row-actions {
    display: flex !important;
    flex-direction: row !important;
    gap: 5px;
}

[data-view="employee-detail"] .employee-document-row-actions a,
[data-view="employee-detail"] .employee-document-row-actions button {
    width: 28px;
    height: 28px;
    min-height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    margin: 0;
    padding: 0;
}

[data-view="employee-detail"] .employee-document-row-actions .employee-document-archive-label {
    align-self: center;
    color: #6b7280;
    font-size: 10px;
    font-weight: 700;
}

.employee-document-modal.project-modal {
    width: min(520px, calc(100vw - 32px));
    z-index: 180;
}

.employee-document-upload-body {
    display: grid;
    gap: 16px;
}

.employee-document-upload-body label {
    display: grid;
    gap: 5px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.employee-document-upload-body select,
.employee-document-upload-body textarea,
.employee-document-file-input input {
    min-height: 36px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    padding: 8px;
}

.employee-document-upload-body textarea {
    min-height: 84px;
    resize: vertical;
}

.employee-document-file-input small {
    color: #727782;
    font-size: 9px;
    font-weight: 500;
}

[data-view="employee-detail"] .employee-detail-table {
    display: grid;
    padding: 0 16px 16px;
}

[data-view="employee-detail"] .employee-detail-table > div {
    min-height: 36px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid #c1c7d2;
}

[data-view="employee-detail"] .employee-detail-table span,
[data-view="employee-detail"] .employee-detail-table strong {
    min-width: 0;
    display: flex;
    align-items: center;
    padding: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="employee-detail"] .employee-detail-table button {
    min-height: 24px;
    border: 1px solid #c1c7d2;
    border-radius: 4px;
    background: #fff;
    margin-right: 6px;
    padding: 0 8px;
    color: #004277;
    font-size: 10px;
    font-weight: 800;
}

@media (max-width: 1180px) {
    [data-view="employee-detail"] .employee-detail-panel.active {
        grid-template-columns: 1fr;
    }

    [data-view="employee-detail"] .employee-detail-form,
    [data-view="employee-detail"] .employee-detail-form.compact,
    [data-view="employee-detail"] .employee-detail-kpi-row,
    [data-view="employee-detail"] .employee-role-grid,
    [data-view="employee-detail"] .employee-access-summary {
        grid-template-columns: 1fr;
    }

    [data-view="employee-detail"] .employee-time-period-actions,
    [data-view="employee-detail"] .employee-document-actions {
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}

[data-view="planning-calendar"].calendar-buildpro-view.active {
    display: flex;
    min-height: calc(100vh - var(--dummy-topbar-height, 60px) - 32px);
    height: calc(100vh - var(--dummy-topbar-height, 60px) - 32px);
    overflow: hidden;
    background: #faf9f8;
    color: #1a1c1c;
    font-family: "Inter", sans-serif;
    font-size: 11px;
    line-height: 14px;
}

[data-view="planning-calendar"] .calendar-buildpro-app {
    width: 100%;
    min-height: 0;
    display: flex;
    gap: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #fff;
}

[data-view="planning-calendar"] .calendar-sidebar {
    width: 256px;
    min-height: 0;
    padding: 0;
    display: flex;
    flex: 0 0 256px;
    flex-direction: column;
    gap: 0;
    overflow-y: auto;
    border: 0;
    border-right: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f4f3f2;
    box-shadow: none;
}

[data-view="planning-calendar"] .calendar-section-card {
    padding: 16px;
    display: grid;
    gap: 12px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

[data-view="planning-calendar"] .mini-calendar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 10px;
}

[data-view="planning-calendar"] .mini-calendar-head strong {
    color: #414750;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

[data-view="planning-calendar"] .mini-calendar-head span {
    display: inline-flex;
    gap: 4px;
}

[data-view="planning-calendar"] .mini-calendar-head button {
    width: 24px;
    height: 24px;
    min-height: 24px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-weight: 800;
}

[data-view="planning-calendar"] .mini-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px 2px;
}

[data-view="planning-calendar"] .mini-calendar-grid span,
[data-view="planning-calendar"] .mini-calendar-grid button {
    width: 26px;
    height: 22px;
    min-height: 22px;
    border-radius: 2px;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 500;
}

[data-view="planning-calendar"] .mini-calendar-grid span {
    display: inline-grid;
    place-items: center;
    color: #414750;
    font-weight: 800;
}

[data-view="planning-calendar"] .mini-calendar-grid button {
    border: 0;
    background: transparent;
}

[data-view="planning-calendar"] .mini-calendar-grid button.is-muted {
    color: rgba(65, 71, 80, 0.45);
}

[data-view="planning-calendar"] .mini-calendar-grid button.is-selected,
[data-view="planning-calendar"] .mini-calendar-grid button.is-today {
    background: rgba(0, 66, 119, 0.1);
    color: #004277;
    font-weight: 800;
}

[data-view="planning-calendar"] .calendar-list strong {
    color: #414750;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

[data-view="planning-calendar"] .calendar-list label {
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 500;
}

[data-view="planning-calendar"] .calendar-list label:hover {
    background: transparent;
    color: #004277;
}

[data-view="planning-calendar"] .calendar-list label.disabled {
    color: #8a93a1;
}

[data-view="planning-calendar"] .calendar-list label.calendar-subtype {
    margin-left: 22px;
    gap: 7px;
    color: #4d5f70;
    font-size: 10.5px;
}

[data-view="planning-calendar"] .calendar-list label.calendar-subtype.disabled {
    color: #9aa3ad;
}

[data-view="planning-calendar"] .calendar-list label.calendar-subtype .dot {
    width: 6px;
    height: 6px;
}

[data-view="planning-calendar"] .calendar-list input {
    width: 14px;
    height: 14px;
}

[data-view="planning-calendar"] .calendar-list .calendar-employee-filter {
    width: 100%;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 6px;
    margin-bottom: 4px;
}

[data-view="planning-calendar"] .calendar-employee-filter .material-symbols-outlined {
    color: #657686;
    font-size: 17px;
}

[data-view="planning-calendar"] .calendar-employee-filter select {
    width: 100%;
    min-width: 0;
    height: 30px;
    border: 1px solid #c7d0da;
    border-radius: 2px;
    background: #fff;
    color: #263645;
    font: inherit;
}

[data-view="planning-calendar"] .dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
}

[data-view="planning-calendar"] .project-dot {
    background: #005a9e;
}

[data-view="planning-calendar"] .project-planning-dot {
    background: #4f88b6;
}

[data-view="planning-calendar"] .delivery-dot {
    background: #2e7d32;
}

[data-view="planning-calendar"] .task-dot {
    background: #00838f;
}

[data-view="planning-calendar"] .holiday-dot {
    background: #f9a825;
}

[data-view="planning-calendar"] .calendar-quick-tools button {
    width: 100%;
    min-height: 28px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 500;
}

[data-view="planning-calendar"] .calendar-quick-tools button:disabled {
    opacity: 0.58;
    cursor: not-allowed;
}

[data-view="planning-calendar"] .calendar-quick-tools button:not(:disabled):hover {
    background: #e9e8e7;
}

[data-view="planning-calendar"] .calendar-quick-tools .material-symbols-outlined {
    font-size: 18px;
}

[data-view="planning-calendar"] .calendar-quick-tools span[data-calendar-conflict-summary] {
    min-height: 24px;
    padding: 6px 8px;
    border-radius: 2px;
    background: #e9e8e7;
    color: #414750;
    font-size: 11px;
}

[data-view="planning-calendar"] .calendar-quick-tools .calendar-quick-tool-status {
    min-height: 24px;
    padding: 6px 8px;
    border-left: 2px solid #2e7d32;
    border-radius: 2px;
    background: #edf7ee;
    color: #245b27;
    font-size: 10px;
    line-height: 14px;
}

[data-view="planning-calendar"] .calendar-quick-tools .calendar-quick-tool-status.is-error {
    border-left-color: #ba1a1a;
    background: #fff0f0;
    color: #8c1d18;
}

[data-view="planning-calendar"] .calendar-reminder-list {
    gap: 8px;
}

[data-view="planning-calendar"] .calendar-reminder-list button {
    align-items: flex-start;
    background: #fff;
    border: 1px solid #d8dee8;
    color: #1f2933;
    display: grid;
    gap: 2px 8px;
    grid-template-columns: 18px 1fr;
    justify-items: start;
    min-height: 44px;
    padding: 8px;
    text-align: left;
}

[data-view="planning-calendar"] .calendar-reminder-list .material-symbols-outlined {
    color: #0b5cab;
    font-size: 18px;
    grid-row: span 2;
    line-height: 1;
}

[data-view="planning-calendar"] .calendar-reminder-list small,
[data-view="planning-calendar"] .calendar-reminder-empty {
    color: #6b7280;
    font-size: 12px;
}

.calendar-event-modal.is-calendar-planning-modal {
    width: min(720px, calc(100vw - 32px));
    max-height: min(92vh, 780px);
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 90;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(20, 30, 45, 0.24);
    color: #1a1c1c;
    font-size: 11px;
}

.calendar-event-modal.is-calendar-planning-modal header {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e3e2e1;
    padding: 0 12px;
}

.calendar-event-modal.is-calendar-planning-modal header button {
    width: 28px;
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-weight: 800;
}

.calendar-event-modal.is-calendar-planning-modal .calendar-event-modal-body {
    min-height: 0;
    overflow: auto;
    padding: 14px;
    display: grid;
    gap: 12px;
}

.calendar-event-modal.is-calendar-planning-modal .calendar-event-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.calendar-event-modal.is-calendar-planning-modal label {
    display: grid;
    gap: 4px;
    min-width: 0;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.calendar-event-modal.is-calendar-planning-modal input,
.calendar-event-modal.is-calendar-planning-modal select,
.calendar-event-modal.is-calendar-planning-modal textarea {
    width: 100%;
    min-height: 30px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 500;
    text-transform: none;
}

.calendar-event-modal.is-calendar-planning-modal textarea {
    min-height: 76px;
    padding: 8px;
    resize: vertical;
}

.calendar-event-modal.is-calendar-planning-modal .planning-span-2 {
    grid-column: 1 / -1;
}

.calendar-event-link-panel {
    display: grid;
    gap: 8px;
    border: 1px solid #d8dee8;
    border-radius: 2px;
    background: #f7f8fa;
    padding: 10px;
}

.calendar-event-link-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}

.calendar-event-link-heading strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.calendar-event-link-heading small,
.calendar-event-link-empty {
    color: #727782;
    font-size: 10px;
    font-weight: 800;
}

.calendar-event-link-panel .planning-reminder-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    border: 1px solid #d8dee8;
    background: #fff;
    padding: 7px;
}

.calendar-event-link-panel .planning-reminder-row.is-archived {
    opacity: 0.65;
}

.calendar-event-link-panel .planning-reminder-row span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.calendar-event-link-panel .planning-reminder-row small {
    color: #727782;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}

.calendar-event-link-panel .planning-reminder-row strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-event-link-panel .planning-reminder-row button,
.calendar-event-link-panel .planning-document-link-actions a,
.calendar-event-link-create button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1f2933;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    padding: 0 9px;
    text-decoration: none;
    white-space: nowrap;
}

.planning-document-link-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.planning-document-link-actions button,
.planning-document-link-actions a {
    min-width: 0;
}

.planning-detail-links .planning-document-link-actions button,
.planning-detail-links .planning-document-link-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1f2933;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    padding: 0 8px;
    text-decoration: none;
    white-space: nowrap;
}

.calendar-event-link-create {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) auto;
    gap: 6px;
}

.calendar-event-link-create .form-error,
.calendar-event-link-create .calendar-event-link-empty {
    grid-column: 1 / -1;
    margin: 0;
}

.calendar-event-link-create select {
    min-width: 0;
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.planning-document-upload {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    align-items: end;
    gap: 6px;
    border: 1px solid #d8dee8;
    background: #f7f8fa;
    padding: 8px;
}

.planning-document-upload label {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.planning-document-upload label span {
    color: #727782;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.planning-document-upload input[type="text"],
.planning-document-upload input[type="file"],
.planning-document-upload select {
    width: 100%;
    min-width: 0;
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.planning-document-upload input[type="file"] {
    padding: 4px 6px;
}

.planning-document-upload .primary {
    min-height: 28px;
    padding: 0 10px;
}

.planning-document-upload-progress {
    grid-column: 1 / -1;
    display: grid;
    gap: 3px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #004277;
    background: #fff;
    padding: 7px 9px;
}

.planning-document-upload-progress strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.15;
}

.planning-document-upload-progress span {
    color: #4e5560;
    font-size: 10px;
    line-height: 1.3;
}

.planning-document-upload-progress small {
    color: #004277;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.planning-document-upload-retry {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding-top: 4px;
}

.planning-document-upload-retry span {
    flex: 1 1 180px;
    color: #5f6368;
    font-size: 10px;
    font-weight: 700;
}

.planning-document-upload-retry button {
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #323130;
    font-size: 10px;
    font-weight: 800;
}

.planning-document-upload-retry button.primary {
    border-color: #005a9e;
    background: #005a9e;
    color: #fff;
}

.planning-document-upload-progress.is-running,
.planning-document-upload-progress.is-info {
    border-left-color: #004277;
}

.planning-document-upload-progress.is-success {
    border-left-color: #1b7f3a;
    background: #f2fbf5;
}

.planning-document-upload-progress.is-warning {
    border-left-color: #9b6400;
    background: #fff8e8;
}

.planning-document-upload-progress.is-error {
    border-left-color: #ba1a1a;
    background: rgba(255, 218, 214, 0.24);
}

.calendar-event-link-create .primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.calendar-event-modal.is-calendar-planning-modal .form-error {
    display: grid;
    gap: 4px;
    margin: 12px 14px 0;
    border: 1px solid #ba1a1a;
    border-radius: 2px;
    background: rgba(255, 218, 214, 0.2);
    padding: 8px;
    color: #ba1a1a;
    font-weight: 800;
}

.calendar-event-modal.is-calendar-planning-modal .calendar-event-link-create .form-error {
    margin: 0;
}

.calendar-event-modal.is-calendar-planning-modal .modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #e3e2e1;
    padding: 10px 14px;
}

.calendar-event-modal.is-calendar-planning-modal .modal-actions button {
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 12px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

.calendar-event-modal.is-calendar-planning-modal .modal-actions .primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.calendar-event-modal.is-calendar-planning-modal .modal-actions .primary.danger {
    border-color: #ba1a1a;
    background: #ba1a1a;
}

[data-view="planning-calendar"] .calendar-stage {
    min-width: 0;
    min-height: 0;
    padding: 0;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

[data-view="planning-calendar"] .calendar-topbar {
    min-height: 48px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex: 0 0 auto;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    box-shadow: none;
}

[data-view="planning-calendar"] .calendar-topbar-left,
[data-view="planning-calendar"] .calendar-nav-buttons,
[data-view="planning-calendar"] .calendar-view-switch {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

[data-view="planning-calendar"] .calendar-topbar .primary {
    min-height: 28px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #004277;
    border-radius: 2px;
    background: #004277;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-calendar"] .calendar-topbar .primary .material-symbols-outlined {
    font-size: 18px;
}

[data-view="planning-calendar"] .calendar-topbar-left > i {
    width: 1px;
    height: 24px;
    margin: 0 2px;
    background: #c1c7d2;
}

[data-view="planning-calendar"] [data-calendar-today] {
    min-height: 28px;
    padding: 0 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 750;
}

[data-view="planning-calendar"] .calendar-nav-buttons button {
    width: 28px;
    min-height: 28px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #414750;
}

[data-view="planning-calendar"] .calendar-nav-buttons button:hover {
    background: #f4f3f2;
}

[data-view="planning-calendar"] .calendar-topbar h2 {
    margin: 0;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0;
}

[data-view="planning-calendar"] .calendar-view-switch {
    margin-left: 0;
    padding: 4px;
    gap: 2px;
    border: 1px solid #c1c7d2;
    border-radius: 8px;
    background: #f4f3f2;
}

[data-view="planning-calendar"] .calendar-view-switch button {
    min-height: 26px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 650;
}

[data-view="planning-calendar"] .calendar-view-switch button:disabled {
    color: #8a93a1;
}

[data-view="planning-calendar"] .calendar-view-switch button.active {
    background: #fff;
    color: #1a1c1c;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.1);
}

[data-view="planning-calendar"] .planning-filter-summary {
    min-height: 34px;
    margin: 0;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: rgba(255, 218, 214, 0.2);
    padding: 8px 16px;
    color: #ba1a1a;
    font-weight: 800;
}

[data-view="planning-calendar"] .calendar-week-header-month {
    min-height: 34px;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    flex: 0 0 auto;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

[data-view="planning-calendar"] .calendar-week-header-month > div {
    padding: 8px 6px;
    display: grid;
    place-items: center;
    border-right: 1px solid #c1c7d2;
    color: #414750;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-calendar"] .calendar-week-header-month > div:nth-child(6),
[data-view="planning-calendar"] .calendar-week-header-month > div:nth-child(7) {
    background: #efeeed;
}

[data-view="planning-calendar"] .calendar-week-header-month > div:last-child {
    border-right: 0;
}

[data-view="planning-calendar"] .calendar-month-raster.is-view-month.calendar-grid {
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-auto-rows: minmax(120px, 1fr);
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    border: 0;
    border-radius: 0;
    background: rgba(193, 199, 210, 0.12);
    box-shadow: none;
}

[data-view="planning-calendar"] .calendar-month-cell {
    min-width: 0;
    min-height: 120px;
    padding: 8px;
    overflow: hidden;
    border-right: 1px solid #c1c7d2;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
}

[data-view="planning-calendar"] .calendar-month-cell:nth-child(7n) {
    border-right: 0;
}

[data-view="planning-calendar"] .calendar-month-cell.is-weekend {
    background: #e9e8e7;
}

[data-view="planning-calendar"] .calendar-month-cell.is-muted {
    background: rgba(227, 226, 225, 0.42);
    color: rgba(65, 71, 80, 0.5);
}

[data-view="planning-calendar"] .calendar-month-cell.is-selected {
    box-shadow: inset 2px 0 0 #004277;
}

[data-view="planning-calendar"] .calendar-month-cell-head {
    width: 100%;
    min-height: 20px;
    margin: 0 0 4px;
    padding: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 4px;
    border: 0;
    background: transparent;
    text-align: left;
}

[data-view="planning-calendar"] .calendar-month-cell-date {
    display: flex;
    flex: 1 1 auto;
    align-items: flex-start;
    min-width: 0;
    min-height: 20px;
    gap: 4px;
    border: 0;
    background: transparent;
    padding: 0;
    color: inherit;
    text-align: left;
}

[data-view="planning-calendar"] .calendar-month-cell-add {
    display: inline-flex;
    flex: 0 0 20px;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 2px;
    background: transparent;
    padding: 0;
    color: #414750;
    opacity: 0;
    transition: background 120ms ease, color 120ms ease, opacity 120ms ease;
}

[data-view="planning-calendar"] .calendar-month-cell:hover .calendar-month-cell-add,
[data-view="planning-calendar"] .calendar-month-cell:focus-within .calendar-month-cell-add,
[data-view="planning-calendar"] .calendar-month-cell-add:focus-visible {
    opacity: 1;
}

[data-view="planning-calendar"] .calendar-month-cell-add:hover,
[data-view="planning-calendar"] .calendar-month-cell-add:focus-visible {
    background: #e3e2e1;
    color: #004277;
    outline: none;
}

[data-view="planning-calendar"] .calendar-month-cell-add:focus-visible {
    box-shadow: 0 0 0 2px rgba(0, 66, 119, 0.24);
}

[data-view="planning-calendar"] .calendar-month-cell-head strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 750;
}

[data-view="planning-calendar"] .calendar-month-cell.is-today .calendar-month-cell-head strong {
    color: #004277;
    font-weight: 900;
}

[data-view="planning-calendar"] .calendar-month-cell.is-muted .calendar-month-cell-head strong {
    color: rgba(65, 71, 80, 0.5);
}

[data-view="planning-calendar"] .calendar-month-cell-head .material-symbols-outlined {
    opacity: 0;
    color: #414750;
    font-size: 16px;
    transition: opacity 120ms ease;
}

[data-view="planning-calendar"] .calendar-month-cell-head .calendar-month-cell-add .material-symbols-outlined {
    opacity: 1;
}

[data-view="planning-calendar"] .calendar-month-cell:hover .calendar-month-cell-head .material-symbols-outlined {
    opacity: 1;
}

@media (hover: none), (pointer: coarse) {
    [data-view="planning-calendar"] .calendar-month-cell-add {
        opacity: 1;
    }
}

[data-view="planning-calendar"] .calendar-holiday-label {
    margin-left: auto;
    color: #ba1a1a;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

[data-view="planning-calendar"] .calendar-month-cell-events {
    display: grid;
    gap: 2px;
}

[data-view="planning-calendar"] .event-pill {
    width: 100%;
    min-height: 18px;
    margin: 0;
    padding: 1px 4px;
    display: block;
    overflow: hidden;
    border: 0;
    border-radius: 2px;
    color: #fff;
    font-size: 10px;
    line-height: 14px;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

[data-view="planning-calendar"] span.event-pill {
    cursor: default;
}

[data-view="planning-calendar"] .event-pill.blue {
    background: #005a9e;
}

[data-view="planning-calendar"] .event-pill.project-summary {
    font-weight: 800;
}

[data-view="planning-calendar"] .event-pill.green {
    background: #2e7d32;
}

[data-view="planning-calendar"] .event-pill.cyan {
    background: #00838f;
}

[data-view="planning-calendar"] .event-pill.yellow {
    background: #f9a825;
    color: #1a1c1c;
}

[data-view="planning-calendar"] .event-pill.status-cancelled {
    opacity: 0.58;
    text-decoration: line-through;
}

[data-view="planning-calendar"] .event-pill.has-conflict {
    outline: 2px solid rgba(186, 26, 26, 0.65);
    outline-offset: -1px;
}

[data-view="planning-calendar"] .event-pill.is-more {
    background: #efeeed;
    color: #414750;
    font-weight: 800;
}

[data-view="planning-calendar"] .calendar-week-header .calendar-week-heading {
    gap: 2px;
    display: grid;
    align-content: center;
}

[data-view="planning-calendar"] .calendar-week-header .calendar-week-heading span {
    color: #414750;
    font-size: 10px;
    font-weight: 700;
}

[data-view="planning-calendar"] .calendar-week-header .calendar-week-heading strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 850;
}

[data-view="planning-calendar"] .calendar-week-header .calendar-week-heading.is-today,
[data-view="planning-calendar"] .calendar-week-header .calendar-week-heading.is-selected {
    box-shadow: inset 0 -2px 0 #004277;
}

[data-view="planning-calendar"] .calendar-week-raster.is-view-week {
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(7, minmax(150px, 1fr));
    flex: 1 1 auto;
    overflow: auto;
    border: 0;
    background: rgba(193, 199, 210, 0.12);
}

[data-view="planning-calendar"] .calendar-week-day-column {
    min-width: 0;
    min-height: 0;
    padding: 8px;
    display: grid;
    grid-template-rows: 32px minmax(0, 1fr);
    gap: 8px;
    border-right: 1px solid #c1c7d2;
    background: #fff;
}

[data-view="planning-calendar"] .calendar-week-day-column:last-child {
    border-right: 0;
}

[data-view="planning-calendar"] .calendar-week-day-column.is-weekend {
    background: #f4f3f2;
}

[data-view="planning-calendar"] .calendar-week-day-column.is-selected {
    box-shadow: inset 2px 0 0 #004277;
}

[data-view="planning-calendar"] .calendar-week-day-column.is-today .calendar-day-column-head strong {
    color: #004277;
}

[data-view="planning-calendar"] .calendar-day-column-head {
    width: 100%;
    min-height: 32px;
    padding: 0 0 6px;
    display: grid;
    align-content: center;
    border: 0;
    border-bottom: 1px solid #d7dce3;
    background: transparent;
    color: #1a1c1c;
    text-align: left;
}

[data-view="planning-calendar"] .calendar-day-column-head strong {
    color: #1a1c1c;
    font-size: 15px;
    font-weight: 850;
    line-height: 18px;
}

[data-view="planning-calendar"] .calendar-day-column-head span {
    color: #727782;
    font-size: 10px;
    font-weight: 750;
    line-height: 12px;
}

[data-view="planning-calendar"] .calendar-day-agenda.is-view-day {
    min-height: 0;
    padding: 0;
    display: grid;
    grid-template-rows: 56px minmax(0, 1fr);
    flex: 1 1 auto;
    overflow: hidden;
    background: #fff;
}

[data-view="planning-calendar"] .calendar-day-agenda-head {
    min-height: 56px;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

[data-view="planning-calendar"] .calendar-day-agenda-head span {
    color: #727782;
    font-size: 11px;
    font-weight: 700;
}

[data-view="planning-calendar"] .calendar-day-agenda-head strong {
    display: block;
    color: #1a1c1c;
    font-size: 18px;
    font-weight: 850;
    line-height: 24px;
}

[data-view="planning-calendar"] .calendar-agenda-list {
    min-height: 0;
    display: grid;
    align-content: start;
    gap: 6px;
    overflow: auto;
}

[data-view="planning-calendar"] .calendar-day-list {
    padding: 12px 16px;
}

[data-view="planning-calendar"] .calendar-agenda-event {
    width: 100%;
    min-height: 34px;
    padding: 6px 8px;
    display: grid;
    gap: 2px;
    border: 0;
    border-left: 3px solid currentColor;
    border-radius: 2px;
    background: #f8f8f8;
    color: #1a1c1c;
    text-align: left;
}

[data-view="planning-calendar"] button.calendar-agenda-event {
    cursor: pointer;
}

[data-view="planning-calendar"] .calendar-agenda-event:hover {
    background: #efeeed;
}

[data-view="planning-calendar"] .calendar-agenda-event span {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-calendar"] .calendar-agenda-event small {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-calendar"] .calendar-agenda-event.blue {
    border-left-color: #005a9e;
}

[data-view="planning-calendar"] .calendar-agenda-event.green {
    border-left-color: #2e7d32;
}

[data-view="planning-calendar"] .calendar-agenda-event.yellow {
    border-left-color: #f9a825;
}

[data-view="planning-calendar"] .calendar-agenda-event.has-conflict {
    box-shadow: inset 0 0 0 1px rgba(186, 26, 26, 0.45);
}

[data-view="planning-calendar"] .calendar-empty-slot {
    min-height: 28px;
    padding: 6px 8px;
    display: flex;
    align-items: center;
    border: 1px dashed #c1c7d2;
    border-radius: 2px;
    color: #727782;
    font-size: 10px;
    font-weight: 700;
}

[data-view="planning-calendar"] .calendar-empty-state {
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 6px;
    border: 1px dashed #c1c7d2;
    border-radius: 2px;
    background: #faf9f8;
    color: #727782;
    text-align: center;
}

[data-view="planning-calendar"] .calendar-empty-state .material-symbols-outlined {
    color: #8a93a1;
    font-size: 28px;
}

[data-view="planning-calendar"] .calendar-empty-state strong {
    color: #1a1c1c;
    font-size: 13px;
}

[data-view="planning-calendar"] .calendar-empty-state p {
    margin: 0;
    max-width: 340px;
    font-size: 11px;
    line-height: 15px;
}

[data-view="planning-calendar"] .calendar-year-raster.is-view-year {
    min-height: 0;
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 8px;
    flex: 1 1 auto;
    overflow: auto;
    background: #faf9f8;
}

[data-view="planning-calendar"] .calendar-year-month {
    min-height: 168px;
    display: grid;
    grid-template-rows: 34px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

[data-view="planning-calendar"] .calendar-year-month.is-today,
[data-view="planning-calendar"] .calendar-year-month.is-selected {
    border-color: #004277;
    box-shadow: inset 2px 0 0 #004277;
}

[data-view="planning-calendar"] .calendar-year-month-head {
    min-height: 34px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    color: #1a1c1c;
    text-align: left;
}

[data-view="planning-calendar"] .calendar-year-month-head strong {
    font-size: 12px;
    font-weight: 850;
}

[data-view="planning-calendar"] .calendar-year-month-head span {
    color: #727782;
    font-size: 10px;
    font-weight: 700;
}

[data-view="planning-calendar"] .calendar-year-month .calendar-month-cell-events {
    padding: 8px;
    overflow: hidden;
}

@media (max-width: 1120px) {
    [data-view="planning-calendar"] .calendar-buildpro-app {
        flex-direction: column;
    }

    [data-view="planning-calendar"] .calendar-sidebar {
        width: 100%;
        min-height: 236px;
        max-height: 236px;
        display: grid;
        grid-template-columns: 256px 190px 180px 240px 280px;
        flex-basis: auto;
        flex-shrink: 0;
        overflow-x: auto;
        overflow-y: hidden;
        border-right: 0;
        border-bottom: 1px solid #c1c7d2;
    }

    [data-view="planning-calendar"] .calendar-sidebar .calendar-section-card {
        min-width: 0;
        overflow-y: auto;
        border-right: 1px solid #c1c7d2;
        border-bottom: 0;
    }

    [data-view="planning-calendar"] .calendar-sidebar .calendar-section-card:last-child {
        border-right: 0;
    }

    [data-view="planning-calendar"] .calendar-year-raster.is-view-year {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }
}

[data-view="planning-board"].plantafel-buildpro-view.active {
    position: relative;
    min-height: 720px;
    overflow: auto;
    padding: 24px;
    row-gap: 8px;
    background: #faf9f8;
    color: #1a1c1c;
    font-family: "Inter", sans-serif;
    font-size: 11px;
    line-height: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
    order: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    min-height: 0;
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-title {
    flex: 0 0 248px;
    min-width: 248px;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-title-row {
    display: flex;
    align-items: center;
    gap: 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-title-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 2px;
    background: #004277;
    color: #fff;
    font-size: 28px;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-title-row h1 {
    margin: 0;
    color: #1a1c1c;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-title-row p {
    margin: 2px 0 0;
    color: #727782;
    font-size: 11px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    flex: 1 1 auto;
    width: min(100%, 1560px);
    max-width: 1560px;
    gap: 6px;
    background: transparent;
    border: 0;
    box-shadow: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-search {
    position: relative;
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    order: 1;
    min-width: 168px;
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-search > span {
    position: absolute;
    left: 10px;
    color: #727782;
    font-size: 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-search input {
    width: 100%;
    height: 26px;
    border: 0;
    background: transparent;
    padding: 0 10px 0 30px;
    color: #1a1c1c;
    font-size: 11px;
    outline: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-select,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-icon,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-primary,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment button,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-zoom button,
[data-view="planning-board"].plantafel-buildpro-view .planning-filter-summary button {
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    font-weight: 700;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-select {
    flex: 0 0 auto;
    min-width: 118px;
    height: 28px;
    padding: 0 28px 0 12px;
}

[data-view="planning-board"].plantafel-buildpro-view [data-planning-range] {
    order: 2;
}

[data-view="planning-board"].plantafel-buildpro-view [data-planning-project-filter] {
    order: 4;
}

[data-view="planning-board"].plantafel-buildpro-view [data-planning-person-filter] {
    order: 6;
    min-width: 132px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment {
    display: inline-flex;
    flex: 0 0 auto;
    order: 3;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment button {
    height: 28px;
    min-width: 48px;
    border: 0;
    border-left: 1px solid #c1c7d2;
    border-radius: 0;
    padding: 0 8px;
    background: #fff;
    font-weight: 500;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment button:first-child {
    border-left: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment button.active,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
    font-weight: 700;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-zoom {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    order: 5;
    gap: 6px;
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 6px;
    color: #727782;
    font-size: 11px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-zoom button {
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 0;
    color: #1a1c1c;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-zoom button:not(:disabled):hover {
    color: #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-zoom button:disabled {
    color: #a4a9b1;
    cursor: not-allowed;
    opacity: .58;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-primary {
    order: 7;
    height: 28px;
    padding: 0 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    order: 8;
    width: 28px;
    height: 28px;
    padding: 0;
    color: #727782;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-icon .material-symbols-outlined {
    font-size: 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-icon.active,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-icon[aria-pressed="true"] {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-select:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-icon:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment button:hover:not(.active),
[data-view="planning-board"].plantafel-buildpro-view .planning-filter-summary button:hover {
    background: #f4f3f2;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-summary {
    order: 1;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 36px;
    margin: 0 0 8px;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #fff;
    padding: 6px 10px;
    color: #414750;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-intake {
    order: 3;
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(220px, 360px) auto;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    margin: 8px 0 0;
    padding: 8px 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-intake > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-intake strong {
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-intake span {
    min-width: 0;
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-intake [data-planning-project-add-select] {
    min-width: 0;
    width: 100%;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-strip {
    order: 4;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 8px;
    margin: 8px 0 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card {
    min-height: 58px;
    padding: 8px 10px;
    display: grid;
    align-content: center;
    gap: 2px;
    border: 1px solid #c1c7d2;
    border-left: 3px solid #005a9e;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    text-align: left;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card.green {
    border-left-color: #107c10;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card.orange {
    border-left-color: #d83b01;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card.red {
    border-left-color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card.gray {
    border-left-color: #727782;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card small,
[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card span,
[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card i {
    min-width: 0;
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    font-style: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-card strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-summary.error-state {
    border-color: #ba1a1a;
    background: rgba(255, 218, 214, 0.2);
    color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-summary.success-state {
    border-color: #b7d7c4;
    background: #f0fdf4;
    color: #166534;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-inline {
    margin: 0 0 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(26, 28, 28, 0.12);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-inline header {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e3e2e1;
    padding: 0 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-inline header button,
[data-view="planning-board"].plantafel-buildpro-view .planning-detail-head button {
    width: 28px;
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-form-grid label {
    display: grid;
    gap: 4px;
    min-width: 0;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-form-grid input,
[data-view="planning-board"].plantafel-buildpro-view .planning-form-grid select,
[data-view="planning-board"].plantafel-buildpro-view .planning-form-grid textarea {
    width: 100%;
    min-height: 30px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 11px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-form-grid textarea {
    min-height: 76px;
    padding: 8px;
    resize: vertical;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-field {
    min-width: 0;
    margin: 0;
    border: 0;
    padding: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-field legend {
    margin-bottom: 4px;
    padding: 0;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-options {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 32px;
    overflow-x: auto;
    scrollbar-width: thin;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-option,
[data-view="planning-board"].plantafel-buildpro-view .planning-color-custom {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 5px;
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 7px;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
    cursor: pointer;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-option:hover,
[data-view="planning-board"].plantafel-buildpro-view .planning-color-option:focus-visible,
[data-view="planning-board"].plantafel-buildpro-view .planning-color-custom:hover,
[data-view="planning-board"].plantafel-buildpro-view .planning-color-custom:focus-within {
    border-color: #78aeda;
    outline: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-option.is-selected {
    border-color: #005a9e;
    box-shadow: inset 0 0 0 1px #005a9e;
    color: #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-swatch {
    position: relative;
    display: inline-block;
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    border: 1px solid rgba(26, 28, 28, 0.28);
    border-radius: 2px;
    background: var(--planning-color-option);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-swatch.is-default {
    background: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-swatch.is-default::after {
    position: absolute;
    top: 6px;
    left: 1px;
    width: 11px;
    height: 1px;
    background: #727782;
    content: "";
    transform: rotate(-45deg);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-custom {
    position: relative;
    margin: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-custom .material-symbols-outlined {
    font-size: 15px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-color-custom input[type="color"] {
    width: 18px;
    height: 18px;
    min-height: 18px;
    border: 0;
    border-radius: 2px;
    padding: 0;
    background: transparent;
    cursor: pointer;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-span-2 {
    grid-column: span 2;
}

[data-view="planning-board"].plantafel-buildpro-view .form-error {
    display: grid;
    gap: 4px;
    margin: 12px 14px 0;
    border: 1px solid #ba1a1a;
    border-radius: 2px;
    background: rgba(255, 218, 214, 0.2);
    padding: 8px;
    color: #ba1a1a;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .modal-actions,
[data-view="planning-board"].plantafel-buildpro-view .planning-detail-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #e3e2e1;
    padding: 10px 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .modal-actions button,
[data-view="planning-board"].plantafel-buildpro-view .planning-detail-actions button {
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 12px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .modal-actions .primary,
[data-view="planning-board"].plantafel-buildpro-view .planning-detail-actions .primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .modal-actions .primary.danger {
    border-color: #ba1a1a;
    background: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-actions .danger {
    border-color: #ba1a1a;
    color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board {
    order: 2;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: transparent;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card {
    order: 1;
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 44px;
    border: 1px solid #e3e2e1;
    border-bottom: 0;
    border-radius: 2px 2px 0 0;
    background: rgba(244, 243, 242, 0.3);
    padding: 0 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-head::after {
    display: none;
    content: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-controls {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card-head h2,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-card > h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card > h2 {
    display: flex;
    align-items: center;
    min-height: 44px;
    margin-top: 12px;
    border: 1px solid #e3e2e1;
    border-bottom: 0;
    border-radius: 2px 2px 0 0;
    background: rgba(244, 243, 242, 0.3);
    padding: 0 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
    display: grid;
    grid-template-columns: 380px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #e3e2e1;
    border-top: 0;
    border-radius: 0 0 2px 2px;
    background: #fff;
    font-size: 11px;
    line-height: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-left {
    position: sticky;
    left: 0;
    z-index: 20;
    overflow: hidden;
    border-right: 1px solid #e3e2e1;
    background: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-head {
    display: grid;
    height: 56px;
    min-height: 56px;
    border-bottom: 1px solid #e3e2e1;
    background: #f4f3f2;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-project-head {
    grid-template-columns: minmax(0, 1fr) 96px 56px 56px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-head {
    grid-template-columns: minmax(0, 1fr) 80px 64px 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-head span,
[data-view="planning-board"].plantafel-buildpro-view .erp-left-row > span {
    display: flex;
    align-items: center;
    min-width: 0;
    overflow: hidden;
    border-left: 1px solid #e3e2e1;
    padding: 0 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-head span:first-child,
[data-view="planning-board"].plantafel-buildpro-view .erp-left-row > span:first-child {
    border-left: 0;
    padding-left: 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row {
    display: grid;
    width: 100%;
    height: 32px;
    min-height: 32px;
    border: 0;
    border-bottom: 1px solid #efeeed;
    background: #fff;
    color: #414750;
    font-size: 11px;
    text-align: left;
    transition: background 0.15s ease;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-project-board .erp-left-row {
    grid-template-columns: minmax(0, 1fr) 96px 56px 56px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row {
    grid-template-columns: minmax(0, 1fr) 80px 64px 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.item > span:first-child {
    padding-left: 40px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row > span:first-child {
    gap: 7px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row:hover {
    background: #f4f3f2;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.is-archived {
    color: #727782;
    background: #faf9f8;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.empty {
    display: flex;
    align-items: center;
    min-height: 48px;
    color: #727782;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-progress {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    font-size: 9px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-progress i {
    position: relative;
    display: block;
    width: 64px;
    height: 4px;
    overflow: hidden;
    border-radius: 999px;
    background: #e3e2e1;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-progress i::before {
    content: "";
    display: block;
    width: var(--p, 0%);
    height: 100%;
    background: #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-gantt {
    position: relative;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    background: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days {
    display: grid;
    min-width: max(760px, calc(var(--planning-day-units, 7) * 92px));
    grid-template-columns: repeat(var(--planning-day-units, 7), minmax(92px, 1fr));
    height: 32px;
    min-height: 32px;
    border-bottom: 1px solid #e3e2e1;
    background: #fff;
    color: #1a1c1c;
    font-size: 9px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    border-right: 1px solid #e3e2e1;
    color: #1a1c1c;
    font-size: inherit;
    font-weight: 800;
    line-height: inherit;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-timeline {
    position: relative;
    display: grid;
    min-width: max(760px, calc(var(--planning-day-units, 7) * 92px));
    min-height: 192px;
    grid-template-columns: repeat(var(--planning-day-units, 7), minmax(92px, 1fr));
    grid-auto-rows: 32px;
    background:
        repeating-linear-gradient(to right, transparent 0, transparent calc(100% / var(--planning-day-units, 7) - 1px), #efeeed calc(100% / var(--planning-day-units, 7) - 1px), #efeeed calc(100% / var(--planning-day-units, 7))),
        repeating-linear-gradient(to bottom, transparent 0, transparent 31px, #efeeed 31px, #efeeed 32px);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-gantt {
    padding-top: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-days {
    display: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar {
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
    height: 20px;
    grid-column: var(--start) / span var(--span);
    grid-row: var(--row);
    align-self: center;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 2px;
    padding: 0 8px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    user-select: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card.is-drag-mode .erp-bar {
    cursor: grab;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-bar-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-bar-resize-handle {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 4;
    width: 10px;
    border-inline: 1px solid rgba(255, 255, 255, 0.72);
    background: rgba(255, 255, 255, 0.3);
    cursor: ew-resize;
    opacity: 0;
    pointer-events: none;
    transition: opacity 120ms ease, background-color 120ms ease;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-bar-resize-handle.is-start {
    left: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-bar-resize-handle.is-end {
    right: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card.is-drag-mode .erp-bar:hover .planning-bar-resize-handle,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-card.is-drag-mode .erp-bar:focus-visible .planning-bar-resize-handle,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar.is-dragging .planning-bar-resize-handle {
    opacity: 1;
    pointer-events: auto;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card.is-drag-mode .erp-bar:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-card.is-drag-mode .erp-bar:focus-visible {
    outline: 2px solid rgba(0, 66, 119, 0.28);
    outline-offset: 1px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar[data-planning-readonly="true"] {
    cursor: default;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar[data-planning-readonly="true"] .planning-bar-resize-handle,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar.erp-milestone .planning-bar-resize-handle {
    display: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.is-dragging {
    z-index: 18;
    cursor: grabbing;
    filter: saturate(1.08) drop-shadow(0 8px 12px rgba(31, 42, 55, 0.18));
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.is-resizing {
    cursor: ew-resize;
    outline: 2px solid rgba(13, 103, 214, 0.28);
    outline-offset: 2px;
}

@media (pointer: coarse) {
    [data-view="planning-board"].plantafel-buildpro-view .erp-board-card.is-drag-mode .erp-bar:not([data-planning-readonly="true"]):not(.erp-milestone) .planning-bar-resize-handle {
        opacity: 1;
        pointer-events: auto;
    }
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.has-conflict {
    border-color: rgba(186, 26, 26, 0.55);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.erp-milestone {
    justify-content: flex-start;
    width: auto;
    min-width: 0;
    max-width: none;
    padding: 0 8px;
    clip-path: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.mini {
    height: 16px;
    font-size: 9px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.blue {
    background: #005a9e;
    color: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.green {
    border-color: rgba(21, 128, 61, 0.3);
    background: rgba(22, 163, 74, 0.3);
    color: #166534;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.orange {
    border-color: rgba(249, 168, 37, 0.35);
    background: rgba(249, 168, 37, 0.24);
    color: #92400e;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.red {
    background: rgba(186, 26, 26, 0.9);
    color: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.has-custom-color,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar.total.has-custom-color {
    border-color: var(--planning-bar-color) !important;
    background: var(--planning-bar-color) !important;
    color: var(--planning-bar-text-color) !important;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.total.has-custom-color:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar.total.has-custom-color:focus-visible {
    border-color: var(--planning-bar-color) !important;
    background: var(--planning-bar-color) !important;
    filter: brightness(0.92);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.gray,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar.absence {
    border-color: rgba(193, 199, 210, 0.3);
    background: #e3e2e1;
    color: #727782;
    justify-content: center;
    font-size: 9px;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 999px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.blue {
    background: #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.green {
    background: #16a34a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.orange {
    background: #f9a825;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.red {
    background: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dot.gray,
[data-view="planning-board"].plantafel-buildpro-view .erp-dot.absence {
    background: #e3e2e1;
    border: 1px solid #c1c7d2;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-diamond {
    display: inline-block;
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    background: #004277;
    transform: rotate(45deg);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-flag {
    display: block;
    width: 12px;
    height: 12px;
    color: #16a34a;
    background: currentColor;
    clip-path: polygon(15% 0, 85% 20%, 15% 40%);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-flag.red {
    color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-flag.orange {
    color: #f9a825;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-footer {
    position: sticky;
    bottom: 0;
    z-index: 40;
    min-height: 40px;
    border-top: 1px solid #e3e2e1;
    background: #fff;
    padding: 0 24px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-legend {
    display: flex;
    align-items: center;
    gap: 32px;
    height: 40px;
    overflow-x: auto;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-legend span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #414750;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-panel {
    position: absolute;
    right: 18px;
    bottom: 58px;
    z-index: 50;
    width: min(360px, calc(100% - 36px));
    overflow: hidden;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(26, 28, 28, 0.16);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-head {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e3e2e1;
    padding: 8px 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-head strong,
[data-view="planning-board"].plantafel-buildpro-view .planning-detail-panel dd {
    color: #1a1c1c;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-head small,
[data-view="planning-board"].plantafel-buildpro-view .planning-detail-panel dt {
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-badges {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    border-bottom: 1px solid #e3e2e1;
    padding: 8px 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-badges span {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 999px;
    background: #f8fafc;
    color: #414750;
    padding: 0 8px;
    font-size: 10px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-badges .is-green {
    border-color: #b7d7c4;
    background: #f0fdf4;
    color: #166534;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-badges .is-red {
    border-color: rgba(186, 26, 26, 0.35);
    background: #fef2f2;
    color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-badges .is-orange {
    border-color: rgba(249, 168, 37, 0.35);
    background: #fff7ed;
    color: #92400e;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-panel dl {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-panel dl div {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr);
    gap: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-panel dd {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    border-top: 1px solid #e3e2e1;
    border-bottom: 1px solid #e3e2e1;
    padding: 10px 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-kpis span {
    min-width: 0;
    display: grid;
    gap: 2px;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #fff;
    padding: 6px 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-kpis small {
    color: #727782;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-kpis strong {
    color: #1a1c1c;
    font-size: 13px;
    font-weight: 900;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-cancel-summary {
    display: grid;
    gap: 4px;
    border-top: 1px solid #e3e2e1;
    padding: 10px 12px;
    background: #fff8f7;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-cancel-summary.planning-reopen-summary {
    background: #f0fdf4;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-cancel-summary strong {
    color: #ba1a1a;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-cancel-summary.planning-reopen-summary strong {
    color: #166534;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-cancel-summary span,
[data-view="planning-board"].plantafel-buildpro-view .planning-cancel-summary p {
    margin: 0;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-reminders {
    display: grid;
    gap: 6px;
    border-top: 1px solid #e3e2e1;
    padding: 10px 12px;
    background: #f8fafc;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-reminders > strong {
    color: #4b5563;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-empty {
    color: #727782;
    font-size: 11px;
    font-weight: 700;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-row {
    align-items: center;
    background: #fff;
    border: 1px solid #d8dee8;
    display: grid;
    gap: 6px;
    grid-template-columns: minmax(0, 1fr) auto auto;
    padding: 7px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-row.is-due {
    border-left: 3px solid #0b5cab;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-row.is-archived {
    opacity: 0.65;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-row span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-row small {
    color: #727782;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-row strong {
    color: #1a1c1c;
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-reminder-row button,
[data-view="planning-board"].plantafel-buildpro-view .planning-document-link-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #1f2933;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    padding: 0 8px;
    text-decoration: none;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-link-create {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-link-create .form-error {
    grid-column: 1 / -1;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-link-create select {
    min-width: 0;
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-link-create button {
    min-height: 28px;
    border-radius: 2px;
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-blocked-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid #e3e2e1;
    padding: 10px 12px 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-blocked-actions button {
    min-width: 0;
    min-height: 26px;
    overflow: hidden;
    border: 1px dashed #c1c7d2;
    border-radius: 2px;
    background: #f7f8fa;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .dependency-form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

[data-view="planning-board"].plantafel-buildpro-view .dependency-preview {
    margin: 0 14px 14px;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #f8fafc;
    padding: 10px 12px;
    color: #414750;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-body {
    display: grid;
    gap: 12px;
    padding: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-export-body {
    display: grid;
    gap: 12px;
    padding: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-body > label,
[data-view="planning-board"].plantafel-buildpro-view .planning-export-body > label,
[data-view="planning-board"].plantafel-buildpro-view .planning-settings-toggle {
    display: grid;
    gap: 4px;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-body select,
[data-view="planning-board"].plantafel-buildpro-view .planning-export-body select,
[data-view="planning-board"].plantafel-buildpro-view .planning-export-body input[type="text"] {
    min-height: 30px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 11px;
}

[data-view="planning-board"].plantafel-buildpro-view .modal-helper-text,
[data-view="planning-board"].plantafel-buildpro-view .planning-settings-section > small,
[data-view="planning-board"].plantafel-buildpro-view .planning-holiday-preview {
    margin: 0;
    color: #727782;
    font-size: 11px;
    line-height: 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-section {
    display: grid;
    gap: 8px;
    border-top: 1px solid #e3e2e1;
    padding-top: 10px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-section > strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 900;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-options.compact {
    grid-template-columns: 1fr;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-export-options {
    display: grid;
    gap: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-export-options label {
    min-height: 38px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-export-options label.disabled {
    color: #8a93a1;
    background: #f7f8fa;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-toggle {
    display: flex;
    align-items: center;
    min-height: 30px;
    gap: 8px;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    text-transform: none;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-toggle input {
    width: 14px;
    height: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-holiday-preview {
    max-height: 250px;
    overflow-y: auto;
    display: grid;
    gap: 8px;
    border: 1px solid #f0d6d3;
    border-radius: 6px;
    background: #fff8f7;
    padding: 12px;
    color: #334155;
    font-weight: 400;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-holiday-preview strong {
    color: #a9312b;
    font-size: 13px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-holiday-preview .planning-preview-subhead {
    margin-top: 2px;
    color: #475569;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-holiday-preview span {
    color: #64748b;
    font-weight: 400;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    height: 18px;
    grid-column: var(--start) / span var(--span);
    grid-row: var(--row);
    align-self: end;
    margin-bottom: 1px;
    border: 0;
    border-top: 2px solid rgba(96, 112, 128, 0.82);
    border-radius: 0;
    background: transparent;
    padding: 0;
    color: #414750;
    cursor: pointer;
    pointer-events: auto;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency::after {
    content: "";
    width: 0;
    height: 0;
    margin-left: auto;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 7px solid currentColor;
    transform: translateY(-5px);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency span {
    min-width: 26px;
    border: 1px solid #c1c7d2;
    border-radius: 999px;
    background: #fff;
    padding: 1px 5px;
    color: #414750;
    font-size: 8px;
    font-weight: 900;
    line-height: 12px;
    transform: translateY(-7px);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency.has-lag {
    border-top-style: dashed;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency.conflict {
    border-top-color: #ba1a1a;
    color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-dependency:focus-visible {
    border-top-color: #004277;
    outline: none;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency:hover span,
[data-view="planning-board"].plantafel-buildpro-view .erp-dependency:focus-visible span {
    border-color: #004277;
    color: #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-dependency-legend {
    display: inline-block;
    width: 22px;
    height: 0;
    border-top: 2px solid rgba(96, 112, 128, 0.82);
}

[data-view="planning-board"].plantafel-buildpro-view.hide-planning-progress .erp-progress,
[data-view="planning-board"].plantafel-buildpro-view.hide-planning-status .erp-dot,
[data-view="planning-board"].plantafel-buildpro-view.hide-planning-priority .erp-flag {
    visibility: hidden;
}

[data-view="planning-board"].plantafel-buildpro-view.hide-planning-weekends .erp-days span.weekend {
    background: #fff;
    color: #1a1c1c;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.weekend {
    background: #f8fafc;
    color: #727782;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-dependencies {
    display: grid;
    gap: 6px;
    border-top: 1px solid #e3e2e1;
    padding: 10px 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-dependencies strong {
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-dependencies button {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    min-height: 30px;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 10px;
    text-align: left;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-dependencies button.has-conflict {
    border-color: rgba(186, 26, 26, 0.45);
    color: #ba1a1a;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-dependencies span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-detail-dependencies small {
    color: #727782;
    font-size: 9px;
    font-weight: 800;
}

@media (max-width: 1180px) {
    [data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
        flex-direction: column;
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
        justify-content: flex-start;
        width: 100%;
    }

    [data-view="planning-board"].plantafel-buildpro-view .planning-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
        grid-template-columns: 1fr;
    }
}

[data-view="employees-time"] {
    overflow: hidden;
    background: #faf9f8;
    color: #1a1c1c;
    font-family: Inter, sans-serif;
    font-size: 12px;
    line-height: 16px;
}

.time-density-view {
    min-height: 720px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow: auto;
    background: #faf9f8;
    padding: 8px;
}

.time-density-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 4px;
}

.time-density-header h1 {
    margin: 0;
    color: #1a1c1c;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: 0;
}

.time-density-header p {
    margin: 0;
    color: #414750;
    font-size: 12px;
    line-height: 16px;
}

.time-density-header > div:last-child,
.time-density-filter > div,
.time-density-filter footer,
.time-density-card header,
.time-density-footer,
.time-density-footer > div,
.time-density-footer label {
    display: flex;
    align-items: center;
}

.time-density-header > div:last-child {
    gap: 8px;
}

.time-density-header button,
.time-density-filter button,
.time-density-footer button {
    height: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 12px;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.time-density-header button:disabled,
.time-density-filter button:disabled,
.time-density-filter select:disabled,
.time-density-footer button:disabled,
.time-density-footer select:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.time-density-header button .material-symbols-outlined {
    font-size: 16px;
}

.time-density-filter button.primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.time-density-filter {
    display: grid;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 8px;
}

.time-density-filter > div {
    gap: 8px;
}

.time-density-filter > div:first-child select:nth-child(1) {
    width: 128px;
}

.time-density-filter > div:first-child select:nth-child(2) {
    width: 160px;
}

.time-density-filter > div:first-child select:nth-child(3),
.time-density-filter > div:nth-child(2) select {
    width: 128px;
}

.time-density-filter > div:first-child select:nth-child(4) {
    flex: 1 1 auto;
    min-width: 220px;
}

.time-density-filter select,
.time-density-filter input,
.time-density-footer select {
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
}

.time-density-search {
    position: relative;
    flex: 1 1 auto;
}

.time-density-search .material-symbols-outlined {
    position: absolute;
    left: 8px;
    top: 50%;
    color: #727782;
    font-size: 14px;
    transform: translateY(-50%);
}

.time-density-search input {
    width: 100%;
    padding-left: 28px;
    padding-right: 30px;
}

.time-density-search .time-search-clear {
    position: absolute;
    top: 50%;
    right: 3px;
    width: 22px;
    height: 22px;
    min-height: 22px;
    border: 0;
    background: transparent;
    padding: 0;
    color: #65707f;
    transform: translateY(-50%);
}

.time-density-search .time-search-clear:hover {
    background: #eef2f6;
    color: #1a1c1c;
}

.time-density-search .time-search-clear .material-symbols-outlined {
    position: static;
    font-size: 15px;
    transform: none;
}

.time-density-filter .time-filter-reset {
    color: #415061;
}

.time-active-filters {
    min-height: 26px;
    flex-wrap: wrap;
    gap: 6px !important;
    border-top: 1px solid #e3e7ec;
    padding-top: 6px;
}

.time-active-filters strong {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-right: 2px;
    color: #415061;
    font-size: 11px;
}

.time-active-filters strong .material-symbols-outlined {
    font-size: 15px;
}

.time-density-filter .time-active-filters button {
    height: 22px;
    min-height: 22px;
    gap: 3px;
    border-color: #9fc3df;
    background: #edf6fc;
    padding: 0 7px;
    color: #004277;
    font-size: 10px;
    font-weight: 700;
}

.time-density-filter .time-active-filters button:hover {
    border-color: #0067a8;
    background: #dceefa;
}

.time-active-filters button .material-symbols-outlined {
    font-size: 13px;
}

.time-density-filter footer {
    flex-wrap: wrap;
    gap: 24px;
    border-top: 1px solid #c1c7d2;
    padding-top: 6px;
    color: #414750;
    font-size: 11px;
    font-weight: 600;
}

.time-density-filter footer strong {
    color: #004277;
}

.time-inline-error {
    border: 1px solid #ba1a1a;
    border-radius: 2px;
    background: rgba(255, 218, 214, 0.2);
    padding: 8px;
    color: #ba1a1a;
    font-weight: 800;
}

.time-inline-success {
    border: 1px solid #16a34a;
    border-radius: 2px;
    background: #f0fdf4;
    padding: 8px;
    color: #166534;
    font-weight: 800;
}

.time-density-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

.time-density-kpis article {
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 8px;
}

.time-density-kpis article > div {
    min-width: 0;
}

.time-density-kpis .material-symbols-outlined {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-size: 18px;
}

.time-density-kpis .blue { background: #eff6ff; color: #2563eb; }
.time-density-kpis .gray { background: #f8fafc; color: #4b5563; }
.time-density-kpis .green { background: #f0fdf4; color: #16a34a; }
.time-density-kpis .purple { background: #faf5ff; color: #7e22ce; }
.time-density-kpis .orange { background: #fff7ed; color: #ea580c; }
.time-density-kpis .cyan { background: #ecfeff; color: #0891b2; }

.time-density-kpis small {
    display: block;
    color: #414750;
    font-size: 10px;
    line-height: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.time-density-kpis strong {
    display: block;
    color: #1a1c1c;
    font-size: 14px;
    line-height: 18px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.time-density-card,
.time-entry-inline-modal {
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    overflow: hidden;
}

.time-modal-backdrop {
    z-index: 170;
}

.catalog-export-modal.project-modal.employee-time-modal {
    width: min(860px, calc(100vw - 32px));
    max-height: min(92vh, 860px);
    z-index: 180;
}

.catalog-export-modal.project-modal.time-column-settings-modal,
.catalog-export-modal.project-modal.time-correction-modal {
    width: min(620px, calc(100vw - 32px));
}

.time-density-card.project-rapport-panel {
    flex: 0 0 auto;
    display: grid;
    gap: 8px;
    overflow: visible;
}

.time-density-card header {
    min-height: 34px;
    justify-content: space-between;
    border-bottom: 1px solid #c1c7d2;
    padding: 0 8px;
}

.time-density-card header > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.time-density-card h2 {
    margin: 0;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
}

.time-density-card .approve-all {
    min-height: 22px;
    border: 0;
    border-radius: 2px;
    background: #16a34a;
    padding: 0 8px;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.time-density-view .status-badge {
    border-radius: 2px;
    padding: 1px 4px;
    font-size: 10px;
    font-weight: 800;
    line-height: 14px;
    letter-spacing: 0;
    text-transform: uppercase;
}

.time-density-view .status-badge.orange {
    background: #ffedd5;
    color: #9a3412;
}

.time-density-view .status-badge.green {
    background: #dcfce7;
    color: #166534;
}

.time-density-view .status-badge.red {
    background: rgba(255, 218, 214, 0.35);
    color: #ba1a1a;
}

.time-density-view .status-badge.gray {
    background: #eef2f6;
    color: #65707f;
}

.time-density-table-wrap {
    overflow-x: auto;
}

.time-density-view table.high-density-table {
    width: 100%;
    min-width: 1180px;
    border-collapse: collapse;
    table-layout: auto;
    color: #1a1c1c;
    font-size: 11px;
}

.time-density-view table.high-density-table th,
.time-density-view table.high-density-table td {
    height: 28px;
    border-right: 1px solid #efeeed;
    border-bottom: 1px solid #efeeed;
    padding: 4px 8px;
    vertical-align: middle;
    white-space: nowrap;
}

.time-density-view table.high-density-table th {
    background: #faf9f8;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
    text-align: left;
}

.time-density-view .time-sort-button {
    width: 100%;
    min-height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 3px;
    border: 0;
    background: transparent;
    padding: 0;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    text-align: inherit;
}

.time-density-view .time-sort-button:hover,
.time-density-view .time-sort-button.active {
    color: #004277;
}

.time-density-view .time-sort-button .material-symbols-outlined {
    color: #727782;
    font-size: 14px;
}

.time-density-view .time-sort-button.active .material-symbols-outlined {
    color: #004277;
}

.time-density-view table.high-density-table tbody tr:nth-child(even) {
    background: #f8f8f8;
}

.time-density-view table.high-density-table tbody tr:hover {
    background: #e1f1ff;
}

.time-density-view table.high-density-table td:nth-child(4),
.time-density-view table.high-density-table td:nth-child(5),
.time-density-view table.high-density-table td:nth-child(6),
.time-density-view table.high-density-table td:nth-child(8),
.time-density-view table.high-density-table td:nth-child(9),
.time-density-view table.high-density-table th:nth-child(4),
.time-density-view table.high-density-table th:nth-child(5),
.time-density-view table.high-density-table th:nth-child(6),
.time-density-view table.high-density-table th:nth-child(8),
.time-density-view table.high-density-table th:nth-child(9) {
    text-align: center;
}

.time-density-view table.high-density-table td:nth-child(8) {
    font-weight: 800;
}

.time-density-view .action-group {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.time-density-view .small-btn {
    width: 18px;
    height: 18px;
    min-height: 18px;
    overflow: hidden;
    border: 0;
    background: transparent;
    padding: 0;
    color: #004277;
    font-size: 0;
}

.time-density-view .small-btn::before {
    font-family: "Material Symbols Outlined";
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
}

.time-density-view .small-btn.approve::before {
    content: "check_circle";
    color: #004277;
}

.time-density-view .small-btn.reject::before {
    content: "cancel";
    color: #ba1a1a;
}

.time-density-view .small-btn.review::before {
    content: "edit";
    color: #727782;
}

.time-density-view .small-btn.archive::before {
    content: "archive";
    color: #727782;
}

.time-density-footer {
    min-height: 32px;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid #c1c7d2;
    background: #faf9f8;
    padding: 4px 8px;
    color: #414750;
    font-size: 11px;
}

.time-density-footer > div {
    gap: 4px;
}

.time-density-footer button {
    width: 24px;
    padding: 0;
}

.time-density-footer button.active {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.time-density-footer label {
    gap: 8px;
}

.time-density-footer select {
    height: 24px;
    min-height: 24px;
}

.time-entry-inline-modal .modal-head,
.time-entry-inline-modal .modal-actions {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #c1c7d2;
    padding: 0 10px;
}

.time-entry-inline-modal .modal-head > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.time-entry-inline-modal .modal-head strong {
    color: #1a1c1c;
    font-size: 13px;
    line-height: 18px;
}

.time-entry-inline-modal .modal-head small {
    overflow: hidden;
    color: #727782;
    font-size: 10px;
    font-weight: 600;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.time-entry-inline-modal .modal-head button {
    width: 28px;
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-weight: 800;
}

.time-entry-inline-modal .modal-head button .material-symbols-outlined {
    font-size: 18px;
}

.time-entry-inline-modal .modal-body {
    display: grid;
    gap: 12px;
    max-height: min(72vh, 680px);
    overflow: auto;
    padding: 12px;
}

.time-entry-inline-modal .time-summary-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #e3e2e1;
    border-radius: 2px;
    background: #faf9f8;
    padding: 8px 10px;
}

.time-entry-inline-modal .time-summary-box span {
    color: #727782;
    font-weight: 800;
}

.time-entry-inline-modal .time-summary-box strong {
    color: #004277;
    font-size: 18px;
}

.time-export-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.time-export-options label {
    min-height: 34px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #faf9f8;
    padding: 0 10px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

.time-export-options label.disabled {
    color: #727782;
    opacity: 0.65;
}

.time-column-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.time-column-options label {
    min-height: 36px;
    display: flex;
    grid-template-columns: none;
    align-items: center;
    gap: 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #faf9f8;
    padding: 0 10px;
    color: #1a1c1c;
    font-size: 11px;
    text-transform: none;
}

.time-column-options input {
    width: 16px;
    min-height: 16px;
    margin: 0;
    accent-color: #004277;
}

.time-table-loading {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #414750;
    font-weight: 700;
}

.time-table-loading .material-symbols-outlined,
.time-vacation-loading .material-symbols-outlined {
    font-size: 16px;
    animation: time-loading-spin 1s linear infinite;
}

@keyframes time-loading-spin {
    to { transform: rotate(360deg); }
}

.time-month-close-scope {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #f8fafc;
    padding: 8px 10px;
}

.time-month-close-scope span,
.time-month-close-kpis small,
.time-month-close-list strong {
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.time-month-close-scope strong {
    color: #004277;
    font-size: 13px;
}

.time-month-close-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.time-month-close-kpis article {
    display: grid;
    gap: 2px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 8px;
}

.time-month-close-kpis strong {
    color: #1a1c1c;
    font-size: 14px;
}

.time-month-close-list {
    display: grid;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 8px;
}

.time-month-close-list span {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 700;
}

.time-month-close-list.blockers {
    border-color: #ba1a1a;
    background: rgba(255, 218, 214, 0.2);
}

.time-month-close-list.blockers strong,
.time-month-close-list.blockers span {
    color: #ba1a1a;
}

.time-month-close-list.warnings {
    border-color: #f59e0b;
    background: #fffbeb;
}

.time-month-close-list.warnings strong,
.time-month-close-list.warnings span {
    color: #92400e;
}

.time-entry-inline-modal .form-grid.two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.time-entry-inline-modal label {
    display: grid;
    gap: 4px;
    color: #727782;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.time-entry-inline-modal input,
.time-entry-inline-modal select,
.time-entry-inline-modal textarea {
    min-height: 30px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 8px;
    color: #1a1c1c;
    font-size: 12px;
    text-transform: none;
}

.time-entry-inline-modal textarea {
    min-height: 76px;
    padding: 8px;
    resize: vertical;
}

.time-entry-inline-modal .article-field-wide {
    grid-column: 1 / -1;
}

.time-entry-inline-modal .form-error {
    display: grid;
    gap: 4px;
    border: 1px solid #ba1a1a;
    border-radius: 2px;
    background: rgba(255, 218, 214, 0.2);
    padding: 8px;
    color: #ba1a1a;
    font-weight: 800;
}

.time-entry-inline-modal .modal-actions {
    justify-content: flex-end;
    border-top: 1px solid #c1c7d2;
    border-bottom: 0;
    padding: 6px 10px;
}

.time-entry-inline-modal .modal-actions button {
    min-height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    padding: 0 12px;
    color: #1a1c1c;
    font-weight: 800;
}

.time-entry-inline-modal .modal-actions .primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.time-evaluation-note {
    display: flex;
    align-items: baseline;
    gap: 10px;
    border-bottom: 1px solid #d7dde5;
    background: #f6f8fa;
    padding: 7px 10px;
    color: #5b6876;
    font-size: 12px;
}

.time-evaluation-note strong {
    flex: 0 0 auto;
    color: #2d3a47;
}

.time-archive-panel .high-density-table tbody tr {
    color: #596675;
    background: #fafbfc;
}

.time-vacation-modal {
    position: fixed;
    inset: 0;
    z-index: 190;
    display: grid;
    place-items: center;
    background: rgba(24, 34, 45, 0.38);
    padding: 24px;
}

.time-vacation-dialog {
    width: min(1240px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(30, 41, 59, 0.22);
}

.time-vacation-header {
    min-height: 68px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #dde4ed;
    background: #f7f9fc;
    padding: 16px 18px;
}

.time-vacation-header h2 {
    margin: 0;
    color: #22303c;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0;
}

.time-vacation-header p {
    margin: 5px 0 0;
    color: #667484;
    font-size: 13px;
}

.time-vacation-header button {
    width: 34px;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cbd6e2;
    border-radius: 6px;
    background: #fff;
    color: #415061;
}

.time-vacation-header button .material-symbols-outlined {
    font-size: 20px;
}

.time-vacation-body {
    display: grid;
    gap: 14px;
    overflow: auto;
    padding: 16px;
}

.time-vacation-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 160px;
    gap: 12px;
}

.time-vacation-toolbar label {
    display: grid;
    gap: 6px;
    color: #667484;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.time-vacation-toolbar select {
    min-height: 38px;
    border: 1px solid #cfd9e4;
    border-radius: 6px;
    background: #fff;
    padding: 7px 10px;
    color: #24313e;
    font-size: 14px;
}

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

.time-vacation-summary article {
    display: grid;
    gap: 4px;
    border: 1px solid #dde4ed;
    border-radius: 8px;
    background: #fbfcfe;
    padding: 12px;
}

.time-vacation-summary span {
    color: #667484;
    font-size: 12px;
    font-weight: 760;
    text-transform: uppercase;
}

.time-vacation-summary strong {
    color: #22303c;
    font-size: 20px;
    line-height: 23px;
}

.time-vacation-calendar {
    overflow: hidden;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    background: #fff;
}

.time-vacation-year-view {
    display: grid;
    gap: 12px;
}

.time-vacation-year-navigation {
    min-height: 44px;
    display: grid;
    grid-template-columns: 36px 1fr 36px;
    align-items: center;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    background: #f2f5f9;
    padding: 0 14px;
}

.time-vacation-year-navigation strong {
    justify-self: center;
    color: #22303c;
    font-size: 16px;
}

.time-vacation-year-navigation button {
    width: 30px;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #4b5b6b;
}

.time-vacation-year-navigation button:hover {
    border-color: #cbd6e2;
    background: #fff;
}

.time-vacation-year-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.time-vacation-calendar.compact h3 {
    margin: 0;
    border-bottom: 1px solid #d7e0ea;
    background: #f7f9fc;
    padding: 9px 11px;
    color: #22303c;
    font-size: 14px;
    line-height: 18px;
    text-transform: capitalize;
}

.time-vacation-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.time-vacation-grid > * {
    min-height: 36px;
    border: 0;
    border-right: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    background: #fff;
    padding: 4px 5px;
    text-align: left;
}

.time-vacation-grid > *:nth-child(7n) {
    border-right: 0;
}

.time-vacation-grid .head {
    min-height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f7f9fc;
    color: #667484;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.time-vacation-grid .time-vacation-day {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 3px;
    color: #24313e;
}

.time-vacation-grid .time-vacation-day strong {
    font-size: 11px;
    line-height: 16px;
}

.time-vacation-grid .time-vacation-day span {
    min-width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #eaf2ff;
    padding: 0 4px;
    color: #2d5fb7;
    font-size: 9px;
    font-weight: 780;
}

.time-vacation-grid .weekend,
.time-vacation-grid .empty {
    background: #fafbfc;
}

.time-vacation-grid .planned span {
    background: #fff1d6;
    color: #9a5a00;
}

.time-vacation-grid .approved span {
    background: #e5f6ec;
    color: #16814b;
}

.time-vacation-grid .sick span {
    background: #f3e8ff;
    color: #7e22ce;
}

.time-vacation-list {
    display: grid;
    gap: 8px;
    overflow-x: auto;
    border-top: 1px solid #dde4ed;
    padding-top: 12px;
}

.time-vacation-list > strong {
    color: #415061;
    font-size: 12px;
    text-transform: uppercase;
}

.time-vacation-loading {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #667484;
    font-weight: 700;
}

.time-vacation-body .form-error {
    display: grid;
    gap: 4px;
    border: 1px solid #ba1a1a;
    border-radius: 2px;
    background: rgba(255, 218, 214, 0.2);
    padding: 8px;
    color: #ba1a1a;
    font-weight: 800;
}

@media (max-width: 1180px) {
    .time-density-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .time-density-filter > div {
        flex-wrap: wrap;
    }

    .time-entry-inline-modal .form-grid.two {
        grid-template-columns: 1fr;
    }

    .time-month-close-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .time-vacation-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .time-vacation-year-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .time-vacation-year-grid,
    .time-vacation-toolbar {
        grid-template-columns: 1fr;
    }
}

.master-catalog-panel {
    max-width: 1560px;
}

.master-catalog-tabs button,
.article-head-action {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 0 12px;
    background: #fff;
    color: var(--text);
    font-weight: 800;
    text-decoration: none;
}

.master-catalog-tabs button.is-active {
    border-color: var(--primary);
    background: #edf3ff;
    color: var(--primary);
}

.article-head-action:disabled {
    cursor: not-allowed;
    opacity: .55;
}

.master-catalog-subheader {
    margin-bottom: 12px;
}

.master-catalog-browser {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 14px;
}

.master-structure-browser {
    grid-template-columns: minmax(520px, .95fr) minmax(460px, 1.05fr);
    align-items: start;
    margin-top: 12px;
}

.master-catalog-tree {
    min-height: 460px;
    padding: 10px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: #fbfcfe;
}

.article-tree-title {
    margin-bottom: 8px;
    padding: 0 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.article-tree-row {
    width: 100%;
    min-height: 34px;
    display: grid;
    grid-template-columns: 14px 18px minmax(0, 1fr);
    align-items: center;
    gap: 6px;
    border: 0;
    border-radius: 6px;
    padding: 0 8px;
    background: transparent;
    color: #354052;
    text-align: left;
    font-weight: 700;
}

.article-tree-row.active,
.article-tree-row:hover {
    background: #edf3ff;
    color: var(--primary);
}

.article-tree-label {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.article-tree-label > span,
.article-tree-label > small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.article-tree-label > small,
.catalog-list-name-cell small,
.article-filter-source {
    color: #605e5c;
    font-size: 9px;
    line-height: 11px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.article-catalog-source-supplier,
.article-filter-source-supplier {
    color: #005a9e;
}

.article-catalog-source-manufacturer,
.article-filter-source-manufacturer {
    color: #6c5100;
}

.catalog-list-name-cell {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.catalog-list-name-cell .catalog-row-select {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tree-folder::before {
    content: "folder";
    font-family: "Material Symbols Outlined";
    font-size: 18px;
}

.article-master-content {
    min-width: 0;
}

.master-catalog-toolbar {
    padding: 10px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: #fbfcfe;
}

.master-catalog-form {
    margin-top: 12px;
}

.master-catalog-form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.article-list-table {
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.master-catalog-table {
    margin-top: 12px;
}

.article-list-head,
.article-list-filter,
.article-list-row {
    display: grid;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 12px;
}

.classic-article-table .article-list-head,
.classic-article-table .article-list-filter,
.classic-article-table .article-list-row,
.service-list-table .article-list-head,
.service-list-table .article-list-filter,
.service-list-table .article-list-row,
.master-price-table .article-list-head,
.master-price-table .article-list-filter,
.master-price-table .article-list-row {
    grid-template-columns: 128px minmax(170px, 1fr) minmax(190px, 1.1fr) 70px 120px 105px 105px 110px minmax(130px, .8fr) 220px;
}

.master-import-table .article-list-head,
.master-import-table .article-list-row {
    grid-template-columns: 64px 96px 128px 110px 128px minmax(180px, 1fr) 70px 120px minmax(260px, 1.4fr);
}

.master-price-import-table .article-list-head,
.master-price-import-table .article-list-row {
    grid-template-columns: 64px 96px 128px minmax(210px, 1.2fr) 140px 70px 120px 110px minmax(260px, 1.4fr);
}

.master-list-table .article-list-head,
.master-list-table .article-list-row {
    grid-template-columns: minmax(160px, 1.4fr) 110px 100px 92px 104px 220px;
}

.master-category-table .article-list-head,
.master-category-table .article-list-row {
    grid-template-columns: minmax(180px, 1.3fr) 100px 92px 64px 220px;
}

.article-list-head {
    background: #f3f5f8;
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.master-catalog-panel {
    max-width: none;
    min-height: calc(100vh - 64px);
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    font-size: 12px;
    line-height: 16px;
}

.master-catalog-panel > .module-header,
.master-catalog-panel .master-catalog-subheader {
    min-height: 40px;
    margin: 0;
    padding: 4px 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.master-catalog-panel > .module-header {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    align-items: center;
    gap: 12px;
}

.master-catalog-panel > .module-header h1,
.master-catalog-panel .master-catalog-subheader h1 {
    margin: 0;
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.master-catalog-panel > .module-header p,
.master-catalog-panel .master-catalog-subheader p {
    margin: 0;
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

.master-catalog-panel .master-catalog-tabs {
    height: 28px;
    gap: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.master-catalog-panel .master-catalog-tabs button,
.master-catalog-panel .article-head-action,
.master-catalog-panel .article-create-menu summary.primary,
.master-catalog-panel .toolbar .primary,
.master-catalog-panel .toolbar .project-tool-button {
    min-height: 26px;
    height: 26px;
    padding: 0 10px;
    gap: 5px;
    border: 0;
    border-right: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    color: #414750;
    font-size: 11px;
    font-weight: 600;
    line-height: 14px;
}

.master-catalog-panel .article-create-menu,
.master-catalog-panel .article-group-menu,
.master-catalog-panel .article-export-menu,
.master-catalog-panel .article-column-menu {
    position: relative;
}

.master-catalog-panel .article-create-menu summary,
.master-catalog-panel .article-group-menu summary,
.master-catalog-panel .article-export-menu summary,
.master-catalog-panel .article-column-menu summary {
    list-style: none;
    cursor: pointer;
}

.master-catalog-panel .article-create-menu summary::-webkit-details-marker,
.master-catalog-panel .article-group-menu summary::-webkit-details-marker,
.master-catalog-panel .article-export-menu summary::-webkit-details-marker,
.master-catalog-panel .article-column-menu summary::-webkit-details-marker {
    display: none;
}

.master-catalog-panel .article-create-menu summary.primary {
    display: inline-flex;
    align-items: center;
    border: 1px solid #005a9e;
    background: #005a9e;
    color: #fff;
}

.master-catalog-panel .article-create-menu > div,
.master-catalog-panel .article-group-menu > div,
.master-catalog-panel .article-export-menu > div,
.master-catalog-panel .article-column-menu > div {
    min-width: 180px;
    margin-top: 4px;
    padding: 4px;
    position: absolute;
    right: 0;
    z-index: 40;
    display: grid;
    gap: 2px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(26, 28, 28, .16);
}

.master-catalog-panel .article-create-menu:not([open]) > div,
.master-catalog-panel .article-group-menu:not([open]) > div,
.master-catalog-panel .article-export-menu:not([open]) > div,
.master-catalog-panel .article-column-menu:not([open]) > div {
    display: none;
}

.master-catalog-panel .article-create-menu[open] > div,
.master-catalog-panel .article-group-menu[open] > div,
.master-catalog-panel .article-export-menu[open] > div,
.master-catalog-panel .article-column-menu[open] > div {
    display: grid;
}

.master-catalog-panel .article-create-menu > div button,
.master-catalog-panel .article-group-menu > div button,
.master-catalog-panel .article-export-menu > div button,
.master-catalog-panel .article-export-link {
    width: 100%;
    min-height: 26px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 600;
    line-height: 14px;
    text-align: left;
    text-decoration: none;
}

.master-catalog-panel .article-create-menu > div button:hover,
.master-catalog-panel .article-group-menu > div button:hover,
.master-catalog-panel .article-export-menu > div button:hover,
.master-catalog-panel .article-export-link:hover {
    background: #e1f1ff;
}

.master-catalog-panel .article-create-menu > div button:disabled,
.master-catalog-panel .article-group-menu > div button:disabled,
.master-catalog-panel .article-export-menu > div button:disabled {
    cursor: not-allowed;
    color: #727782;
    background: transparent;
}

.master-catalog-panel .master-catalog-tabs button:last-child {
    border-right: 0;
}

.master-catalog-panel .master-catalog-tabs button.is-active,
.master-catalog-panel .master-catalog-tabs button:hover {
    background: #e1f1ff;
    color: #005a9e;
}

.master-catalog-panel .master-catalog-tabs .material-symbols-outlined,
.master-catalog-panel .article-head-action .material-symbols-outlined,
.master-catalog-panel .toolbar .primary .material-symbols-outlined,
.master-catalog-panel .toolbar .project-tool-button .material-symbols-outlined {
    font-size: 16px;
}

.master-catalog-panel .toolbar .primary {
    border: 1px solid #005a9e;
    background: #005a9e;
    color: #fff;
}

.master-catalog-panel .article-head-action {
    border: 1px solid #c1c7d2;
}

.master-catalog-panel .article-result-count {
    color: #605e5c;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.master-catalog-panel .article-master-filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.master-catalog-panel .article-master-filter label {
    height: 26px;
    min-height: 26px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 11px;
    font-weight: 600;
}

.master-catalog-panel .article-master-filter .article-filter-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-catalog-panel .article-master-filter .article-filter-source {
    min-height: 16px;
    padding: 1px 4px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d7dce4;
    border-radius: 2px;
    background: #faf9f8;
}

.master-catalog-panel .article-master-filter input,
.master-catalog-panel .article-column-menu input {
    width: 13px;
    height: 13px;
    margin: 0;
    accent-color: #005a9e;
}

.master-catalog-panel .article-column-menu summary {
    width: 28px;
    height: 26px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}

.master-catalog-panel .article-column-menu label {
    min-height: 22px;
    padding: 0 6px;
    display: flex;
    align-items: center;
    gap: 6px;
    color: #414750;
    font-size: 11px;
    white-space: nowrap;
}

.master-catalog-panel .master-catalog-section {
    padding: 0;
}

.master-catalog-panel .master-catalog-browser {
    gap: 0;
    min-height: calc(100vh - 190px);
    padding: 0;
    border-top: 0;
}

.master-catalog-panel .article-master-content {
    min-height: 0;
    overflow: auto;
}

.master-catalog-panel .master-catalog-toolbar {
    min-height: 40px;
    margin: 0;
    padding: 4px 8px;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f4f3f2;
}

.master-catalog-panel .master-catalog-toolbar .article-search {
    width: min(420px, 32vw);
    min-width: 240px;
    height: 28px;
    min-height: 28px;
    flex: 0 1 420px;
    padding: 0 8px;
    gap: 6px;
    border-color: #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

.master-catalog-panel .master-catalog-toolbar .article-search .material-symbols-outlined {
    color: #68717d;
    font-size: 16px;
}

.master-catalog-panel .master-catalog-toolbar .article-search input {
    color: #414750;
    font-size: 11px;
}

.master-catalog-panel .master-catalog-toolbar .compact-select {
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    gap: 6px;
    border-color: #c1c7d2;
    border-radius: 2px;
    color: #605e5c;
    font-size: 11px;
    font-weight: 500;
}

.master-catalog-panel .master-catalog-toolbar .compact-select span {
    color: #727782;
    font-size: 10px;
    font-weight: 500;
}

.master-catalog-panel .master-catalog-toolbar .compact-select select {
    min-width: 118px;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 500;
}

.master-catalog-panel .article-list-table {
    margin-top: 0;
    overflow: auto;
    border: 0;
    border-radius: 0;
    background: #fff;
}

.master-catalog-panel .article-list-head,
.master-catalog-panel .article-list-filter,
.master-catalog-panel .article-list-row {
    gap: 0;
    min-height: 32px;
    padding: 0;
}

.master-catalog-panel .article-list-head {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #f3f2f1;
    color: #414750;
    font-size: 10px;
    font-weight: 600;
    line-height: 12px;
    text-transform: none;
}

.master-catalog-panel .article-list-filter {
    position: sticky;
    top: 32px;
    z-index: 4;
    min-height: 30px;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

.master-catalog-panel .article-list-head > *,
.master-catalog-panel .article-list-filter > *,
.master-catalog-panel .article-list-row > * {
    min-width: 0;
    min-height: 30px;
    display: flex;
    align-items: center;
    padding: 4px 6px;
    border-right: 1px solid rgba(193, 199, 210, 0.45);
}

.master-catalog-panel .article-list-row {
    min-height: 30px;
    border-top: 0;
    border-bottom: 1px solid #e3e2e1;
}

.master-catalog-panel .article-list-row:hover,
.master-catalog-panel .article-list-row.selected {
    background: #e1f1ff;
}

.master-catalog-panel .article-list-filter input,
.master-catalog-panel .article-list-filter select {
    width: 100%;
    height: 22px;
    min-width: 0;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 10px;
    line-height: 12px;
}

.master-catalog-panel .article-list-filter input:disabled,
.master-catalog-panel .article-list-filter select:disabled {
    cursor: not-allowed;
    opacity: 1;
}

.master-catalog-panel .master-catalog-tree {
    min-height: 0;
    border: 0;
    border-right: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f4f3f2;
}

.master-catalog-panel .article-tree-title {
    margin: 0;
    padding: 6px 8px;
    color: #727782;
    font-size: 10px;
    font-weight: 600;
    line-height: 12px;
    text-transform: none;
}

.master-catalog-panel .article-tree-row {
    min-height: 28px;
    padding: 0 8px;
    border-left: 2px solid transparent;
    border-radius: 0;
    color: #414750;
    font-size: 11px;
    font-weight: 500;
}

.master-catalog-panel .article-tree-row:disabled {
    cursor: default;
    opacity: 1;
}

.master-catalog-panel .article-tree-row.level-1 {
    padding-left: 26px;
}

.master-catalog-panel .tree-caret,
.master-catalog-panel .tree-spacer {
    width: 12px;
    height: 12px;
}

.master-catalog-panel .tree-caret::before {
    content: "chevron_right";
    display: block;
    color: #727782;
    font-family: "Material Symbols Outlined";
    font-size: 14px;
    line-height: 12px;
    transform: rotate(90deg);
}

.master-catalog-panel .article-tree-row.active,
.master-catalog-panel .article-tree-row:hover {
    border-left-color: #005a9e;
    background: #e3e2e1;
    color: #005a9e;
}

.master-catalog-panel .article-row-actions {
    justify-content: center;
    gap: 4px;
}

.master-catalog-panel .article-row-actions button {
    width: 26px;
    min-width: 26px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border-color: transparent;
    background: transparent;
    color: #005a9e;
}

.master-catalog-panel .article-row-actions button.danger-soft {
    color: #727782;
}

.master-catalog-panel .article-row-actions button:hover {
    background: #e1f1ff;
}

.master-catalog-panel .article-row-actions .material-symbols-outlined {
    font-size: 16px;
}

#articles.master-catalog-panel {
    --article-master-header-height: 120px;
    --article-master-frame-gap: 24px;
    --article-master-frame-height: calc(100vh - var(--dummy-topbar-height) - 24px - var(--article-master-header-height) - var(--article-master-frame-gap));
    height: calc(100vh - var(--dummy-topbar-height) - 24px);
    min-height: 0;
    max-height: calc(100vh - var(--dummy-topbar-height) - 24px);
    display: grid;
    grid-template-rows: var(--article-master-header-height) minmax(0, 1fr);
    gap: var(--article-master-frame-gap);
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    color: #1a1c1c;
}

#articles.master-catalog-panel > .module-header {
    margin: 0;
    min-height: var(--article-master-header-height);
    padding: 0 24px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

#articles.master-catalog-panel > .module-header h1 {
    margin: 0;
    color: #1a1c1c;
    font-size: 24px;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: 0;
}

#articles.master-catalog-panel > .module-header p {
    margin: 0;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    color: #727782;
    font-size: 16px;
    line-height: 22px;
}

#articles .mdm-article-section,
#articles .mdm-service-section {
    height: var(--article-master-frame-height);
    min-height: 0;
    margin: 0;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
}

#articles .mdm-article-section > .module-header,
#articles .mdm-service-section > .module-header {
    min-height: 40px;
    margin: 0;
    padding: 0 12px;
    display: flex;
    box-sizing: border-box;
    align-items: center;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    box-shadow: none;
}

#articles .mdm-article-section > .module-header > div:first-child,
#articles .mdm-service-section > .module-header > div:first-child {
    display: none;
}

#articles .mdm-article-section > .module-header h1,
#articles .mdm-service-section > .module-header h1 {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
}

#articles .mdm-article-section > .module-header p,
#articles .mdm-service-section > .module-header p {
    margin: 0;
    font-size: 10px;
    line-height: 12px;
}

#articles .mdm-article-section .article-list-actions,
#articles .mdm-service-section .article-list-actions {
    width: 100%;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
}

#articles .mdm-article-section .article-list-actions .primary,
#articles .mdm-article-section .article-head-action,
#articles .mdm-service-section .article-list-actions .primary,
#articles .mdm-service-section .article-head-action {
    height: 28px;
    min-height: 28px;
    border-radius: 2px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 650;
    line-height: 16px;
}

#articles .mdm-article-section .article-create-menu,
#articles .mdm-article-section .article-group-menu,
#articles .mdm-article-section .article-export-menu,
#articles .mdm-service-section .article-create-menu,
#articles .mdm-service-section .article-group-menu,
#articles .mdm-service-section .article-export-menu {
    position: relative;
}

#articles .mdm-article-section .article-create-menu summary.primary::before,
#articles .mdm-service-section .article-create-menu summary.primary::before {
    content: "add";
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: 300;
}

#articles .mdm-article-section .article-head-action[data-open-article-master-modal]::before,
#articles .mdm-service-section .article-head-action[data-open-service-master-modal]::before {
    content: "layers";
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: 300;
}

#articles .mdm-article-section .article-group-menu summary.article-head-action::before,
#articles .mdm-service-section .article-group-menu summary.article-head-action::before {
    content: "rule";
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: 300;
}

#articles .mdm-article-section .article-export-menu summary.article-head-action::before,
#articles .mdm-service-section .article-export-menu summary.article-head-action::before {
    content: "file_download";
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: 300;
}

#articles .mdm-article-section summary span,
#articles .mdm-service-section summary span,
#articles .mdm-article-section .article-head-action span,
#articles .mdm-service-section .article-head-action span {
    margin-left: 2px;
    font-size: 10px;
}

#articles .mdm-article-section .article-create-menu > div,
#articles .mdm-article-section .article-group-menu > div,
#articles .mdm-article-section .article-export-menu > div,
#articles .mdm-service-section .article-create-menu > div,
#articles .mdm-service-section .article-group-menu > div,
#articles .mdm-service-section .article-export-menu > div {
    top: calc(100% + 4px);
    border-radius: 2px;
}

#articles .mdm-article-section .article-master-browser,
#articles .mdm-service-section .article-master-browser {
    min-height: 0;
    flex: 1 1 auto;
    display: grid;
    overflow: hidden;
    border: 0;
    background: #fff;
}

#articles .mdm-article-section .article-master-browser {
    grid-template-columns: 256px minmax(0, 1fr);
}

#articles .mdm-service-section .article-master-browser {
    grid-template-columns: 256px minmax(0, 1fr);
}

#articles .mdm-article-section .article-category-tree,
#articles .mdm-service-section .article-category-tree {
    min-height: 0;
    height: 100%;
    padding: 0;
    overflow-y: auto;
    border-right: 1px solid #c1c7d2;
    background: #faf9f8;
}

#articles .mdm-article-section .article-tree-title,
#articles .mdm-service-section .article-tree-title {
    min-height: 32px;
    margin: 0;
    padding: 0 8px 0 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    color: #414750;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 14px;
    text-transform: uppercase;
}

#articles .mdm-article-section .article-tree-title::after,
#articles .mdm-service-section .article-tree-title::after {
    content: "filter_alt";
    color: #414750;
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0;
}

#articles .mdm-article-section .article-tree-row,
#articles .mdm-service-section .article-tree-row {
    min-height: 28px;
    padding: 0 8px;
    gap: 6px;
    border-left: 2px solid transparent;
    border-radius: 2px;
    color: #414750;
    font-size: 12px;
    font-weight: 550;
    line-height: 16px;
}

#articles .mdm-article-section .article-tree-row.active,
#articles .mdm-service-section .article-tree-row.active {
    border-left-color: #004277;
    background: #d3e4ff;
    color: #001c38;
    font-weight: 800;
}

#articles .mdm-article-section .article-tree-row:hover,
#articles .mdm-service-section .article-tree-row:hover {
    background: #e9e8e7;
    color: #004277;
}

#articles .mdm-article-section .tree-folder::before,
#articles .mdm-service-section .tree-folder::before {
    content: "inventory_2";
    color: #8c99a7;
}

#articles .mdm-article-section .article-master-content,
#articles .mdm-service-section .article-master-content {
    min-width: 0;
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#articles .mdm-article-section .article-list-toolbar,
#articles .mdm-service-section .article-list-toolbar {
    height: 40px;
    min-height: 40px;
    margin: 0;
    padding: 6px 12px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    flex: 0 0 auto;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
}

#articles .mdm-article-section .article-list-toolbar > strong,
#articles .mdm-service-section .article-list-toolbar > strong {
    color: #414750;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

#articles .mdm-article-section .article-search,
#articles .mdm-service-section .article-search {
    width: min(420px, 100%);
    height: 28px;
    min-height: 28px;
    margin-left: auto;
    padding: 0 8px;
    gap: 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

#articles .mdm-article-section .article-search .material-symbols-outlined,
#articles .mdm-service-section .article-search .material-symbols-outlined {
    color: #414750;
    font-size: 14px;
}

#articles .mdm-article-section .article-search input,
#articles .mdm-service-section .article-search input {
    height: 22px;
    color: #1a1c1c;
    font-size: 11px;
}

#articles .mdm-article-section .compact-select,
#articles .mdm-service-section .compact-select {
    height: 24px;
    min-height: 24px;
    padding: 0 6px;
    gap: 4px;
    border-color: #c1c7d2;
    border-radius: 2px;
    background: #fff;
    font-size: 10px;
}

#articles .mdm-article-section .project-tool-button,
#articles .mdm-service-section .project-tool-button {
    height: 24px;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 2px;
    font-size: 10px;
}

#articles .mdm-article-section .article-items-table,
#articles .mdm-service-section .service-list-table {
    flex: 1 1 auto;
    overflow: auto;
    border: 0;
    border-radius: 0;
    background: #fff;
}

#articles .mdm-service-section .master-catalog-gaeb-target-grid select,
#articles .mdm-service-section .master-catalog-gaeb-target-grid input {
    min-width: 0;
}

#articles .mdm-service-section .master-catalog-gaeb-history-panel {
    flex: 0 0 auto;
    margin: 0;
    padding: 10px 12px;
    display: grid;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #f8fafc;
}

#articles .mdm-service-section .master-catalog-gaeb-history-panel .section-label {
    display: block;
    margin-bottom: 2px;
    color: #5c6875;
    font-size: 10px;
    font-weight: 800;
    line-height: 12px;
    text-transform: uppercase;
}

#articles .mdm-service-section .gaeb-history-head {
    min-height: 36px;
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
}

#articles .mdm-service-section .gaeb-history-head h3 {
    margin: 0;
    color: #1a1c1c;
    font-size: 14px;
    font-weight: 800;
}

#articles .mdm-service-section .gaeb-history-head p {
    margin: 2px 0 0;
    color: #667482;
    font-size: 11px;
}

#articles .mdm-service-section .gaeb-history-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

#articles .mdm-service-section .gaeb-history-actions > span {
    max-width: 220px;
    overflow: hidden;
    color: #414750;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
}

#articles .mdm-service-section .gaeb-history-actions button {
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 800;
}

#articles .mdm-service-section .gaeb-history-actions button:disabled {
    color: #8c99a7;
    cursor: not-allowed;
}

#articles .mdm-service-section .master-gaeb-history-table {
    max-height: 184px;
    overflow: auto;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

#articles .mdm-service-section .master-gaeb-history-table .article-list-head,
#articles .mdm-service-section .master-gaeb-history-table .article-list-row {
    min-height: 32px;
    padding: 0 8px;
    grid-template-columns: 92px minmax(150px, 1fr) 112px 58px 58px 58px 68px 122px 52px;
    gap: 8px;
    font-size: 11px;
}

#articles .mdm-service-section .master-gaeb-history-table time,
#articles .mdm-service-section .master-gaeb-history-table strong,
#articles .mdm-service-section .master-gaeb-history-table span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#articles .mdm-service-section .master-gaeb-history-table .article-row-actions button {
    width: 24px;
    min-height: 24px;
    padding: 0;
}

#articles .mdm-service-section .master-catalog-gaeb-history-panel .empty-state {
    min-height: 76px;
    padding: 12px;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-article-section .article-items-table .article-list-row {
    min-width: 1100px;
    min-height: 36px;
    display: grid;
    grid-template-columns: 128px 172px minmax(240px, 1fr) 56px 102px 86px 102px 78px 160px 74px;
}

#articles .mdm-service-section .service-list-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-row {
    min-width: 1040px;
    min-height: 36px;
    display: grid;
    grid-template-columns: 124px 172px minmax(230px, 1fr) 56px 126px 86px 86px 78px 138px 74px;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-head {
    position: sticky;
    top: 0;
    z-index: 5;
    min-height: 36px;
    background: #f4f3f2;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.08);
}

#articles .mdm-article-section .article-items-table .article-list-filter,
#articles .mdm-service-section .service-list-table .article-list-filter {
    min-width: inherit;
    display: none;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

#articles .mdm-article-section .article-items-table .article-list-filter {
    grid-template-columns: 128px 172px minmax(240px, 1fr) 56px 102px 86px 102px 78px 160px 74px;
}

#articles .mdm-service-section .service-list-table .article-list-filter {
    grid-template-columns: 124px 172px minmax(230px, 1fr) 56px 126px 86px 86px 78px 138px 74px;
}

#articles .mdm-article-section .article-items-table .article-list-filter span,
#articles .mdm-service-section .service-list-table .article-list-filter span {
    min-width: 0;
    min-height: 24px;
    padding: 3px 4px;
    border-right: 1px solid rgba(193, 199, 210, 0.35);
}

#articles .mdm-article-section .article-items-table .article-list-filter input,
#articles .mdm-service-section .service-list-table .article-list-filter input {
    width: 100%;
    height: 22px;
    border: 1px solid #d7dce3;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 10px;
}

#articles .mdm-article-section .article-column-menu,
#articles .mdm-service-section .article-column-menu {
    margin-left: auto;
}

#articles .mdm-article-section .article-column-menu summary::before,
#articles .mdm-service-section .article-column-menu summary::before {
    content: "view_column";
    color: #414750;
    font-family: "Material Symbols Outlined";
    font-size: 16px;
    font-weight: 300;
}

#articles .mdm-article-section .article-column-menu summary,
#articles .mdm-service-section .article-column-menu summary {
    color: transparent;
    font-size: 0;
    letter-spacing: 0;
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-article-section .article-items-table .article-list-row > *,
#articles .mdm-service-section .service-list-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-row > * {
    min-height: 36px;
    padding: 4px 12px;
    display: flex;
    align-items: center;
    min-width: 0;
    overflow: hidden;
    border-right: 1px solid rgba(193, 199, 210, 0.55);
    border-bottom: 1px solid rgba(193, 199, 210, 0.55);
    color: #1a1c1c;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-head span {
    color: #414750;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

#articles .mdm-article-section .article-items-table .article-list-row:nth-child(even),
#articles .mdm-service-section .service-list-table .article-list-row:nth-child(even) {
    background: #f8f8f8;
}

#articles .mdm-article-section .article-items-table .article-list-row:hover,
#articles .mdm-service-section .service-list-table .article-list-row:hover {
    background: #efeeed;
}

#articles .mdm-article-section .article-items-table .article-list-row strong,
#articles .mdm-service-section .service-list-table .article-list-row strong {
    color: #1a1c1c;
    font-weight: 500;
}

#articles .mdm-article-section .article-items-table .article-list-row > .article-row-link,
#articles .mdm-service-section .service-list-table .article-list-row > .article-row-link {
    justify-content: flex-start;
    border: 0;
    border-right: 1px solid rgba(193, 199, 210, 0.35);
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: transparent;
    color: #1a1c1c;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 12px;
    font-weight: 600;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

#articles .mdm-article-section .article-items-table .article-list-row > .article-row-link:hover,
#articles .mdm-service-section .service-list-table .article-list-row > .article-row-link:hover {
    color: #004277;
    text-decoration: underline;
}

#articles .mdm-article-section .article-items-table .article-list-row > span:nth-child(4),
#articles .mdm-article-section .article-items-table .article-list-head span:nth-child(4),
#articles .mdm-service-section .service-list-table .article-list-row > span:nth-child(4),
#articles .mdm-service-section .service-list-table .article-list-head span:nth-child(4) {
    justify-content: center;
    text-align: center;
}

#articles .mdm-article-section .article-items-table .article-list-row > span:nth-child(5),
#articles .mdm-article-section .article-items-table .article-list-row > span:nth-child(6),
#articles .mdm-article-section .article-items-table .article-list-row > span:nth-child(7),
#articles .mdm-article-section .article-items-table .article-list-head span:nth-child(5),
#articles .mdm-article-section .article-items-table .article-list-head span:nth-child(6),
#articles .mdm-article-section .article-items-table .article-list-head span:nth-child(7),
#articles .mdm-service-section .service-list-table .article-list-row > span:nth-child(6),
#articles .mdm-service-section .service-list-table .article-list-row > span:nth-child(7),
#articles .mdm-service-section .service-list-table .article-list-head span:nth-child(6),
#articles .mdm-service-section .service-list-table .article-list-head span:nth-child(7) {
    justify-content: flex-end;
    font-family: "JetBrains Mono", Consolas, monospace;
    text-align: right;
}

#articles .mdm-article-section > .module-header,
#articles .mdm-service-section > .module-header {
    min-height: 32px;
    border-radius: 0;
    box-shadow: none;
}

#articles .mdm-article-section .article-list-actions .primary,
#articles .mdm-article-section .article-head-action,
#articles .mdm-service-section .article-list-actions .primary,
#articles .mdm-service-section .article-head-action {
    height: 24px;
    min-height: 24px;
    padding: 0 8px;
    font-size: 12px;
    line-height: 16px;
}

#articles .mdm-article-section .article-head-action[data-open-article-master-modal]::before,
#articles .mdm-service-section .article-head-action[data-open-service-master-modal]::before {
    content: "inventory_2";
}

#articles .mdm-article-section .article-group-menu summary.article-head-action::before,
#articles .mdm-service-section .article-group-menu summary.article-head-action::before {
    content: "layers";
}

#articles .mdm-article-section .article-export-menu summary.article-head-action::before,
#articles .mdm-service-section .article-export-menu summary.article-head-action::before {
    content: "download";
}

#articles .mdm-article-section .article-master-browser,
#articles .mdm-service-section .article-master-browser {
    grid-template-columns: 240px minmax(0, 1fr);
}

#articles .mdm-article-section .article-category-tree,
#articles .mdm-service-section .article-category-tree {
    padding: 4px 0;
    background: #f7f9fc;
}

#articles .mdm-article-section .article-tree-title,
#articles .mdm-service-section .article-tree-title {
    min-height: 48px;
    padding: 0 18px;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.04em;
    line-height: 16px;
    text-transform: uppercase;
}

#articles .mdm-article-section .article-tree-title::after,
#articles .mdm-service-section .article-tree-title::after {
    content: "";
    display: none;
}

#articles .mdm-article-section .article-tree-row,
#articles .mdm-service-section .article-tree-row {
    min-height: 28px;
    padding: 0 10px;
    gap: 6px;
    border-radius: 0;
    color: #34404c;
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
}

#articles .mdm-article-section .article-tree-row.active,
#articles .mdm-service-section .article-tree-row.active {
    background: #e9edf3;
    color: #17212b;
    font-weight: 800;
}

#articles .mdm-article-section .article-tree-row:hover,
#articles .mdm-service-section .article-tree-row:hover {
    background: #e9edf3;
    color: #17212b;
}

#articles .mdm-article-section .article-tree-row.level-1,
#articles .mdm-service-section .article-tree-row.level-1 {
    padding-left: 26px;
}

#articles .mdm-article-section .article-tree-row.level-2,
#articles .mdm-service-section .article-tree-row.level-2 {
    padding-left: 48px;
}

#articles .mdm-article-section .tree-caret::before,
#articles .mdm-service-section .tree-caret::before {
    content: "";
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 5px solid #697685;
    transform-origin: 50% 50%;
}

#articles .mdm-article-section .article-tree-node.is-open > .article-tree-row > .tree-caret::before,
#articles .mdm-service-section .article-tree-node.is-open > .article-tree-row > .tree-caret::before {
    content: "";
    transform: rotate(90deg);
}

#articles .mdm-article-section .article-tree-node.is-collapsed > .article-tree-children,
#articles .mdm-service-section .article-tree-node.is-collapsed > .article-tree-children,
#articles .mdm-article-section .article-tree-node > .article-tree-children[hidden],
#articles .mdm-service-section .article-tree-node > .article-tree-children[hidden] {
    display: none;
}

#articles .mdm-article-section .article-tree-node.is-collapsed > .article-tree-row > .tree-caret::before,
#articles .mdm-service-section .article-tree-node.is-collapsed > .article-tree-row > .tree-caret::before {
    content: "";
    transform: rotate(0deg);
}

#articles .mdm-article-section .tree-folder::before,
#articles .mdm-service-section .tree-folder::before {
    content: "";
    position: absolute;
    left: 1px;
    top: 4px;
    width: 13px;
    height: 8px;
    box-sizing: border-box;
    border: 1px solid #8995a3;
    border-radius: 1px;
    background: #eef2f7;
}

#articles .mdm-article-section .tree-folder::after,
#articles .mdm-service-section .tree-folder::after {
    content: "";
    position: absolute;
    left: 2px;
    top: 2px;
    width: 7px;
    height: 4px;
    box-sizing: border-box;
    border: 1px solid #8995a3;
    border-bottom: 0;
    border-radius: 1px 1px 0 0;
    background: #eef2f7;
}

#articles .mdm-article-section .tree-caret,
#articles .mdm-article-section .tree-spacer,
#articles .mdm-service-section .tree-caret,
#articles .mdm-service-section .tree-spacer {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
}

#articles .mdm-article-section .tree-folder,
#articles .mdm-service-section .tree-folder {
    position: relative;
    width: 15px;
    height: 12px;
    flex: 0 0 15px;
}

#articles .mdm-article-section .article-list-toolbar,
#articles .mdm-service-section .article-list-toolbar {
    height: auto;
    min-height: 40px;
    margin: 0 0 14px;
    padding: 0;
    min-width: 0;
    justify-content: space-between;
    flex-wrap: wrap;
    overflow: visible;
    border-bottom: 0;
    background: #fff;
}

#articles .mdm-article-section .article-list-toolbar > .compact-select,
#articles .mdm-service-section .article-list-toolbar > .compact-select,
#articles .mdm-article-section .article-list-toolbar > .project-tool-button,
#articles .mdm-service-section .article-list-toolbar > .project-tool-button,
#articles .mdm-article-section .article-list-toolbar > strong,
#articles .mdm-service-section .article-list-toolbar > strong {
    display: none;
}

#articles .mdm-article-section .article-search,
#articles .mdm-service-section .article-search {
    flex: 0 1 520px;
    width: min(520px, 100%);
    max-width: 100%;
    height: auto;
    min-height: 40px;
    margin-left: 0;
    padding: 0 12px;
    gap: 10px;
    background: #fff;
}

#articles .mdm-article-section .article-master-filter,
#articles .mdm-service-section .article-master-filter {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

#articles .mdm-article-section .article-master-filter::-webkit-scrollbar,
#articles .mdm-service-section .article-master-filter::-webkit-scrollbar {
    display: none;
}

#articles .mdm-article-section .article-master-filter label,
#articles .mdm-service-section .article-master-filter label {
    min-width: 0;
    max-width: 168px;
    min-height: 40px;
    padding: 0 12px;
    flex: 0 1 auto;
    border-color: #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 12px;
    font-weight: 700;
}

#articles .mdm-article-section .article-master-filter .article-filter-label,
#articles .mdm-service-section .article-master-filter .article-filter-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#articles .mdm-article-section .article-column-menu summary,
#articles .mdm-service-section .article-column-menu summary {
    width: 40px;
    min-height: 40px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity],
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] {
    height: 48px;
    min-height: 48px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: 0;
    padding: 0 12px;
    position: relative;
    z-index: 20;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 14px;
    overflow: visible;
    border-bottom: 1px solid #c1c7d2;
    background: #fff;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search {
    flex: 0 0 450px;
    width: 450px;
    max-width: 450px;
    height: 36px;
    min-height: 36px;
    margin-left: auto;
    padding: 0 12px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter {
    flex: 0 0 auto;
    min-width: 0;
    max-width: 320px;
    max-height: 36px;
    align-items: center;
    flex-wrap: nowrap;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter label,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter label {
    height: 36px;
    min-height: 36px;
    max-width: 196px;
    padding: 0 12px;
    flex: 0 0 auto;
    font-size: 11px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu {
    display: none;
    flex: 0 0 auto;
    margin-left: 0;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu summary,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu summary {
    width: 36px;
    height: 36px;
    min-height: 36px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu[data-article-column-menu] summary::before,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu[data-article-column-menu] summary::before {
    content: none;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu[data-article-column-menu] summary .material-symbols-outlined,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-menu[data-article-column-menu] summary .material-symbols-outlined {
    color: #414750;
    font-size: 16px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover {
    width: 230px;
    padding: 8px;
    gap: 4px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover-head,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover-head {
    min-height: 24px;
    padding-bottom: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #d6dbe3;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover-head strong,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover-head strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover-head button,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover-head button {
    width: auto;
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #faf9f8;
    color: #004277;
    font-size: 11px;
    font-weight: 750;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover label,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover label {
    min-height: 24px;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover label.is-required,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover label.is-required {
    color: #666462;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover small,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-column-popover small {
    color: #8a93a1;
    font-size: 10px;
    font-weight: 700;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-article-section .article-items-table .article-list-row {
    min-width: 1100px;
    grid-template-columns: 128px 172px 280px 56px 102px 86px 102px 78px 160px 74px;
}

#articles .mdm-service-section .service-list-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-row {
    min-width: 1040px;
    grid-template-columns: 124px 172px 260px 56px 126px 86px 86px 78px 138px 74px;
}

#articles .mdm-article-section .article-items-table .article-list-row,
#articles .mdm-service-section .service-list-table .article-list-row {
    min-height: 36px;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-head {
    background: #eeeeef;
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-article-section .article-items-table .article-list-row > *,
#articles .mdm-service-section .service-list-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-row > * {
    min-height: 28px;
    padding: 3px 6px;
    border-right: 1px solid rgba(193, 199, 210, 0.35);
    border-bottom: 1px solid #c1c7d2;
    font-size: 11px;
    line-height: 14px;
}

#articles .mdm-article-section .article-items-table .article-list-row .article-row-actions,
#articles .mdm-service-section .service-list-table .article-list-row .article-row-actions {
    padding: 2px 6px;
    flex-wrap: nowrap;
    justify-content: center;
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-head span {
    color: #303943;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}

#articles .mdm-article-section .article-items-table .article-list-row:nth-child(odd),
#articles .mdm-service-section .service-list-table .article-list-row:nth-child(odd) {
    background: #f3f3f3;
}

#articles .mdm-article-section .article-items-table .article-list-row:nth-child(even),
#articles .mdm-service-section .service-list-table .article-list-row:nth-child(even) {
    background: #fff;
}

#articles .mdm-article-section .article-items-table .article-list-row:hover,
#articles .mdm-service-section .service-list-table .article-list-row:hover {
    background: #e9eef6;
}

#articles .mdm-article-section .article-items-table .article-list-row.is-review,
#articles .mdm-service-section .service-list-table .article-list-row.is-review {
    box-shadow: inset 3px 0 0 #d97706;
}

#articles .mdm-article-section .article-items-table .article-list-head span.is-text,
#articles .mdm-article-section .article-items-table .article-list-row > .is-text,
#articles .mdm-service-section .service-list-table .article-list-head span.is-text,
#articles .mdm-service-section .service-list-table .article-list-row > .is-text {
    justify-content: flex-start;
    font-family: inherit;
    text-align: left;
}

#articles .mdm-article-section .article-items-table .article-list-row > .article-item-name-cell,
#articles .mdm-service-section .service-list-table .article-list-row > .article-item-name-cell {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

#articles .mdm-article-section .article-items-table .article-list-row > .article-item-name-cell mark,
#articles .mdm-service-section .service-list-table .article-list-row > .article-item-name-cell mark {
    font-size: 10px;
    line-height: 1;
}

#articles .mdm-article-section .article-items-table .article-list-head span.is-center,
#articles .mdm-article-section .article-items-table .article-list-row > .is-center,
#articles .mdm-service-section .service-list-table .article-list-head span.is-center,
#articles .mdm-service-section .service-list-table .article-list-row > .is-center {
    justify-content: center;
    text-align: center;
}

#articles .mdm-article-section .article-items-table .article-list-head span.is-number,
#articles .mdm-article-section .article-items-table .article-list-row > .is-number,
#articles .mdm-service-section .service-list-table .article-list-head span.is-number,
#articles .mdm-service-section .service-list-table .article-list-row > .is-number {
    justify-content: flex-end;
    font-family: "JetBrains Mono", Consolas, monospace;
    text-align: right;
}

#articles .article-status-readiness-meta {
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

#articles .mdm-article-section .article-items-table,
#articles .mdm-service-section .service-list-table {
    width: 100%;
    min-width: 0;
    border-top: 1px solid #c8d0da;
    border-left: 1px solid #c8d0da;
    background: #fff;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-article-section .article-items-table .article-list-row,
#articles .mdm-service-section .service-list-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-row {
    width: 100%;
    min-width: 100%;
    min-height: 46px;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-article-section .article-items-table .article-list-row {
    width: 100%;
    min-width: 100%;
    min-height: 46px;
}

#articles .mdm-service-section .service-list-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-row {
    width: 100%;
    min-width: 100%;
    min-height: 46px;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-head {
    min-height: 46px;
    background: #eeeeef;
    box-shadow: none;
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-article-section .article-items-table .article-list-row > *,
#articles .mdm-service-section .service-list-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-row > * {
    min-height: 46px;
    padding: 0 12px;
    border-right: 1px solid #d5dbe3;
    border-bottom: 1px solid #c8d0da;
    color: #1f2933;
    font-size: 16px;
    line-height: 20px;
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-head span {
    color: #5c6570;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}

#articles .mdm-article-section .article-items-table .article-select-cell,
#articles .mdm-service-section .service-list-table .article-select-cell {
    justify-content: center;
    padding: 0;
}

#articles .mdm-article-section .article-items-table .article-select-cell input,
#articles .mdm-service-section .service-list-table .article-select-cell input {
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: #0b67a3;
}

#articles .mdm-article-section .article-items-table .article-list-row:nth-child(odd),
#articles .mdm-service-section .service-list-table .article-list-row:nth-child(odd) {
    background: #fff;
}

#articles .mdm-article-section .article-items-table .article-list-row:nth-child(even),
#articles .mdm-service-section .service-list-table .article-list-row:nth-child(even) {
    background: #eef3f8;
}

#articles .mdm-article-section .article-items-table .article-list-row:hover,
#articles .mdm-service-section .service-list-table .article-list-row:hover {
    background: #e5edf6;
}

#articles .mdm-article-section .article-items-table .article-list-row.selected,
#articles .mdm-service-section .service-list-table .article-list-row.selected {
    background: #dcecff;
}

#articles .mdm-article-section .article-items-table .article-list-row > .article-row-link,
#articles .mdm-service-section .service-list-table .article-list-row > .article-row-link {
    padding: 0 12px;
    color: #1f2933;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 16px;
    font-weight: 800;
}

#articles .mdm-article-section .article-items-table .article-list-row > .is-number,
#articles .mdm-service-section .service-list-table .article-list-row > .is-number {
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 16px;
    font-weight: 700;
}

#articles .mdm-article-section .article-items-table .article-list-row > .is-text,
#articles .mdm-service-section .service-list-table .article-list-row > .is-text {
    gap: 6px;
}

#articles .mdm-article-section .article-items-table .article-list-head span.is-text,
#articles .mdm-article-section .article-items-table .article-list-row > .is-text,
#articles .mdm-article-section .article-items-table .article-list-row > .article-item-name-cell,
#articles .mdm-service-section .service-list-table .article-list-head span.is-text,
#articles .mdm-service-section .service-list-table .article-list-row > .is-text,
#articles .mdm-service-section .service-list-table .article-list-row > .article-item-name-cell {
    justify-content: flex-start;
    text-align: left;
}

#articles .mdm-article-section .article-items-table .article-list-row .document-status-chip,
#articles .mdm-service-section .service-list-table .article-list-row .document-status-chip {
    min-height: 24px;
    padding: 0 10px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 900;
    text-transform: uppercase;
}

#articles .mdm-article-section .article-items-table .article-list-row .master-price-readiness-badge,
#articles .mdm-service-section .service-list-table .article-list-row .master-price-readiness-badge {
    display: none;
}

#articles .mdm-article-section .article-items-table .article-list-head span.is-text,
#articles .mdm-article-section .article-items-table .article-list-row > span.is-text,
#articles .mdm-service-section .service-list-table .article-list-head span.is-text,
#articles .mdm-service-section .service-list-table .article-list-row > span.is-text {
    justify-content: flex-start !important;
    text-align: left !important;
}

#articles .mdm-article-section .article-items-table .article-list-row .article-row-actions,
#articles .mdm-service-section .service-list-table .article-list-row .article-row-actions {
    gap: 8px;
    padding: 0 8px;
    justify-content: center;
}

#articles .mdm-article-section .article-items-table .article-list-row,
#articles .mdm-service-section .service-list-table .article-list-row {
    min-height: 46px;
}

#articles .mdm-article-section .article-items-table .article-row-actions button,
#articles .mdm-service-section .service-list-table .article-row-actions button {
    width: 24px;
    min-height: 24px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #1f2933;
}

#articles .mdm-article-section .article-items-table .article-row-actions .material-symbols-outlined,
#articles .mdm-service-section .service-list-table .article-row-actions .material-symbols-outlined {
    font-size: 20px;
    font-variation-settings: "FILL" 0, "wght" 600, "GRAD" 0, "opsz" 20;
}

#articles .mdm-master-section {
    height: var(--article-master-frame-height);
    min-height: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
}

#articles .master-catalog-structure-management-modal.master-catalog-item-modal {
    height: min(88vh, 820px);
    max-height: min(88vh, 820px);
    margin: 0;
}

#articles .mdm-master-section > .module-header {
    min-height: 32px;
    margin: 0;
    padding: 0 12px;
    display: flex;
    box-sizing: border-box;
    align-items: center;
    border: 1px solid #dadada;
    border-bottom: 0;
    border-radius: 0;
    background: #faf9f8;
    box-shadow: none;
}

#articles .mdm-master-section > .module-header h1 {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
}

#articles .mdm-master-section > .module-header p {
    margin: 0;
    color: #727782;
    font-size: 10px;
    line-height: 12px;
}

#articles .mdm-master-section .toolbar {
    gap: 6px;
}

#articles .mdm-master-section .toolbar .primary,
#articles .mdm-master-section .article-head-action {
    height: 24px;
    min-height: 24px;
    border-radius: 2px;
    padding: 0 8px;
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
}

#articles .mdm-master-section .master-catalog-toolbar {
    height: 33px;
    min-height: 33px;
    flex: 0 0 auto;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

#articles .mdm-master-section .master-structure-browser {
    min-height: 0;
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr);
    overflow: hidden;
    border: 0;
    background: #fff;
}

#articles .mdm-master-section .article-master-content {
    min-width: 0;
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#articles .mdm-master-section .article-master-content + .article-master-content {
    border-left: 1px solid #c1c7d2;
}

/* Exact table density from ERP-Hauptdummy#index.html#articles-leistungen. */
#articles.master-catalog-panel {
    --article-master-header-height: 80px;
    --article-master-frame-gap: 16px;
}

#articles.master-catalog-panel > .module-header {
    min-height: var(--article-master-header-height);
    padding: 0 16px;
}

#articles.master-catalog-panel > .module-header h1 {
    outline: none;
    font-size: 16px;
    line-height: 20px;
}

#articles.master-catalog-panel > .module-header p {
    font-size: 12px;
    line-height: 16px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity],
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] {
    height: 33px;
    min-height: 33px;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 4px 12px;
    position: relative;
    z-index: 20;
    flex-wrap: nowrap;
    gap: 8px;
    overflow: visible;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-result-count,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-result-count {
    color: #414750;
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search {
    flex: 0 0 300px;
    width: 300px;
    max-width: 300px;
    height: 24px;
    min-height: 24px;
    margin-left: auto;
    padding: 0 6px;
    gap: 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    background: #faf9f8;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search .material-symbols-outlined,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search .material-symbols-outlined {
    color: #414750;
    font-size: 14px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search input,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-search input {
    height: 22px;
    color: #1a1c1c;
    font-size: 11px;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter {
    gap: 4px;
    max-height: 24px;
    overflow: visible;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter label,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter label {
    height: 24px;
    min-height: 24px;
    max-width: 184px;
    padding: 0 6px;
    border-color: #c1c7d2;
    border-radius: 2px;
    background: #fff;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
}

#articles .mdm-article-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter small,
#articles .mdm-service-section .article-list-toolbar[data-article-toolbar-dummy-parity] .article-master-filter small {
    display: none;
}

#articles .mdm-article-section .article-list-table[data-article-column-table],
#articles .mdm-service-section .article-list-table[data-article-column-table] {
    order: 10;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    overflow: auto;
    border: 0;
    border-top: 1px solid #c1c7d2;
    border-left: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
}

#articles .mdm-service-section .master-catalog-gaeb-history-panel {
    order: 30;
    display: none;
    border-top: 1px solid #c1c7d2;
}

#articles .mdm-article-section .article-items-table .article-list-filter,
#articles .mdm-service-section .service-list-table .article-list-filter {
    display: none !important;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-article-section .article-items-table .article-list-row,
#articles .mdm-service-section .service-list-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-row {
    width: 100%;
    min-width: 100%;
    min-height: 28px;
}

#articles .mdm-article-section .article-items-table .article-list-head,
#articles .mdm-service-section .service-list-table .article-list-head {
    min-height: 32px;
    background: #efeeed;
    box-shadow: 0 1px 2px rgba(26, 28, 28, 0.08);
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-article-section .article-items-table .article-list-row > *,
#articles .mdm-service-section .service-list-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-row > * {
    min-height: 28px;
    padding: 4px 8px;
    border-right: 1px solid rgba(193, 199, 210, 0.55);
    border-bottom: 1px solid #c1c7d2;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
}

#articles .mdm-article-section .article-items-table .article-list-head span,
#articles .mdm-service-section .service-list-table .article-list-head span {
    min-height: 32px;
    color: #666462;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}

#articles .mdm-article-section .article-items-table .article-select-cell,
#articles .mdm-service-section .service-list-table .article-select-cell {
    justify-content: center;
    padding: 0;
}

#articles .mdm-article-section .article-items-table .article-select-cell input,
#articles .mdm-service-section .service-list-table .article-select-cell input {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: #0b67a3;
}

#articles .mdm-article-section .article-items-table .article-list-row:nth-child(odd),
#articles .mdm-service-section .service-list-table .article-list-row:nth-child(odd) {
    background: #fff;
}

#articles .mdm-article-section .article-items-table .article-list-row:nth-child(even),
#articles .mdm-service-section .service-list-table .article-list-row:nth-child(even) {
    background: #f8f8f8;
}

#articles .mdm-article-section .article-items-table .article-list-row:hover,
#articles .mdm-service-section .service-list-table .article-list-row:hover {
    background: rgba(0, 90, 158, 0.06);
}

#articles .mdm-article-section .article-items-table .article-list-row.selected,
#articles .mdm-service-section .service-list-table .article-list-row.selected {
    background: #e1f1ff;
}

#articles .mdm-article-section .article-items-table .article-list-row > .article-row-link,
#articles .mdm-service-section .service-list-table .article-list-row > .article-row-link {
    justify-content: flex-start;
    padding: 4px 8px;
    border: 0;
    border-right: 1px solid rgba(193, 199, 210, 0.55);
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: transparent;
    color: #1a1c1c;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
    font-weight: 600;
    text-align: left;
    text-decoration: none;
}

#articles .mdm-article-section .article-items-table .article-list-row > .is-number,
#articles .mdm-service-section .service-list-table .article-list-row > .is-number {
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
    font-weight: 600;
}

#articles .mdm-article-section .article-items-table .article-list-head span.is-text,
#articles .mdm-article-section .article-items-table .article-list-row > span.is-text,
#articles .mdm-service-section .service-list-table .article-list-head span.is-text,
#articles .mdm-service-section .service-list-table .article-list-row > span.is-text {
    justify-content: flex-start !important;
    text-align: left !important;
}

#articles .mdm-article-section .article-items-table .article-list-row .article-row-actions,
#articles .mdm-service-section .service-list-table .article-list-row .article-row-actions {
    gap: 2px;
    padding: 2px 6px;
    flex-wrap: nowrap;
    justify-content: center;
}

#articles .mdm-article-section .article-items-table .article-row-actions button,
#articles .mdm-service-section .service-list-table .article-row-actions button {
    width: 22px;
    min-width: 22px;
    height: 22px;
    min-height: 22px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #414750;
}

#articles .mdm-article-section .article-items-table .article-row-actions button:hover,
#articles .mdm-service-section .service-list-table .article-row-actions button:hover {
    background: #e9e8e7;
    color: #004277;
}

#articles .mdm-article-section .article-items-table .article-row-actions .material-symbols-outlined,
#articles .mdm-service-section .service-list-table .article-row-actions .material-symbols-outlined {
    font-size: 16px;
    font-variation-settings: "FILL" 0, "wght" 600, "GRAD" 0, "opsz" 20;
}

#articles .mdm-status {
    min-height: 0;
    padding: 2px 6px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    line-height: 12px;
    text-transform: uppercase;
}

#articles .mdm-status.is-active {
    background: #dcfce7;
    color: #15803d;
}

#articles .mdm-status.is-review {
    background: #fef3c7;
    color: #a16207;
}

#articles .mdm-status.is-inactive,
#articles .mdm-status.is-archived {
    background: #e5e7eb;
    color: #4b5563;
}

#articles .mdm-master-section .master-list-table,
#articles .mdm-master-section .master-category-table {
    flex: 1 1 auto;
    overflow: auto;
    border: 0;
    border-radius: 0;
    background: #fff;
}

#articles .mdm-master-section .master-list-table .article-list-head,
#articles .mdm-master-section .master-list-table .article-list-row,
#articles .mdm-master-section .master-category-table .article-list-head,
#articles .mdm-master-section .master-category-table .article-list-row {
    min-width: 760px;
    display: grid;
}

#articles .mdm-master-section .master-list-table .article-list-head,
#articles .mdm-master-section .master-list-table .article-list-row {
    grid-template-columns: minmax(180px, 1fr) 90px 90px 90px 90px 156px;
}

#articles .mdm-master-section .master-category-table .article-list-head,
#articles .mdm-master-section .master-category-table .article-list-row {
    grid-template-columns: minmax(220px, 1fr) minmax(160px, 0.8fr) 88px 90px 140px;
}

#articles .mdm-master-section .master-list-table .article-list-head,
#articles .mdm-master-section .master-category-table .article-list-head {
    position: sticky;
    top: 0;
    z-index: 5;
    min-height: 32px;
    background: #efeeed;
}

#articles .mdm-master-section .master-list-table .article-list-head span,
#articles .mdm-master-section .master-list-table .article-list-row > *,
#articles .mdm-master-section .master-category-table .article-list-head span,
#articles .mdm-master-section .master-category-table .article-list-row > * {
    min-height: 28px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    min-width: 0;
    overflow: hidden;
    border-right: 1px solid rgba(193, 199, 210, 0.35);
    border-bottom: 1px solid #c1c7d2;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#articles .mdm-master-section .master-list-table .article-list-head span,
#articles .mdm-master-section .master-category-table .article-list-head span {
    color: #666462;
    font-weight: 700;
}

#articles .mdm-sales-section.active {
    height: var(--article-master-frame-height);
    min-height: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    color: #1a1c1c;
}

#articles .mdm-sales-section .sales-price-page-head {
    height: 32px;
    min-height: 32px;
    margin: 0;
    padding: 4px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex: 0 0 auto;
    overflow: hidden;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    box-shadow: none;
}

#articles .mdm-sales-section .sales-price-page-head > div:first-child {
    display: none;
}

#articles .mdm-sales-section .sales-price-page-head h1 {
    margin: 0;
    color: #1a1c1c;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 28px;
}

#articles .mdm-sales-section .sales-price-page-head p {
    margin: 2px 0 0;
    color: #414750;
    font-size: 12px;
    line-height: 16px;
}

#articles .mdm-sales-section .article-list-actions {
    gap: 8px;
}

#articles .mdm-sales-section .article-list-actions .primary,
#articles .mdm-sales-section .article-head-action {
    min-height: 28px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 750;
    line-height: 16px;
}

#articles .mdm-sales-section .article-list-actions .primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

#articles .mdm-sales-section .article-head-action {
    border-color: #c1c7d2;
    background: #fff;
    color: #1a1c1c;
}

#articles .mdm-sales-section .article-list-actions .material-symbols-outlined {
    margin: 0;
    font-size: 16px;
}

#articles .mdm-sales-section .sales-price-toolbar {
    position: relative;
    z-index: 20;
    height: 33px;
    min-height: 33px;
    margin: 0;
    padding: 4px 12px;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex: 0 0 auto;
    overflow: visible;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

#articles .mdm-sales-section .sales-price-toolbar-left,
#articles .mdm-sales-section .sales-price-column-state,
#articles .mdm-sales-section .sales-price-footer > div {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

#articles .mdm-sales-section [data-sales-price-count] {
    padding: 2px 8px;
    border-radius: 2px;
    background: rgba(0, 90, 158, 0.1);
    color: #004277;
    font-size: 11px;
    font-weight: 800;
    line-height: 14px;
    white-space: nowrap;
}

#articles .mdm-sales-section .sales-price-toolbar-left i,
#articles .mdm-sales-section .sales-price-footer i {
    width: 1px;
    height: 16px;
    background: #c1c7d2;
}

#articles .mdm-sales-section .sales-price-toolbar button,
#articles .mdm-sales-section .sales-price-column-state button,
#articles .mdm-sales-section .sales-price-footer button {
    width: 24px;
    min-height: 24px;
    padding: 0;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: #414750;
}

#articles .mdm-sales-section .sales-price-toolbar button:hover:not(:disabled),
#articles .mdm-sales-section .sales-price-column-state button:hover:not(:disabled) {
    background: #e9e8e7;
}

#articles .mdm-sales-section .sales-price-toolbar .material-symbols-outlined,
#articles .mdm-sales-section .sales-price-footer .material-symbols-outlined {
    font-size: 16px;
}

#articles .mdm-sales-section .sales-price-search {
    width: min(360px, 100%);
    min-height: 28px;
    margin-left: auto;
    padding: 0 8px;
    min-width: 0;
    flex: 0 1 300px;
    border-color: #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

#articles .mdm-sales-section .sales-price-search input {
    height: 26px;
    color: #1a1c1c;
    font-size: 12px;
}

#articles .mdm-sales-section .sales-price-search .material-symbols-outlined {
    color: #414750;
    font-size: 16px;
}

#articles .mdm-sales-section .compact-select {
    height: 28px;
    min-height: 28px;
    padding: 0 6px;
    flex: 0 0 auto;
    border-color: #c1c7d2;
    border-radius: 2px;
    background: #fff;
}

#articles .mdm-sales-section .compact-select select {
    min-width: 76px;
    color: #1a1c1c;
    font-size: 11px;
}

#articles .mdm-sales-section .project-tool-button {
    width: auto;
    min-width: 70px;
    border: 1px solid #c1c7d2;
    background: #fff;
}

#articles .mdm-sales-section .sales-price-column-state {
    position: relative;
    display: inline-flex;
    color: #414750;
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

#articles .mdm-sales-section .sales-price-column-menu {
    position: relative;
}

#articles .mdm-sales-section .sales-price-column-menu summary {
    width: 24px;
    min-height: 24px;
    display: inline-grid;
    place-items: center;
    border-radius: 2px;
    color: #414750;
    cursor: pointer;
    list-style: none;
}

#articles .mdm-sales-section .sales-price-column-menu summary::-webkit-details-marker {
    display: none;
}

#articles .mdm-sales-section .sales-price-column-menu summary:hover {
    background: #e9e8e7;
}

#articles .mdm-sales-section .sales-price-column-popover {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 30;
    width: 244px;
    padding: 8px;
    display: grid;
    gap: 4px;
    border: 1px solid #9aa4b2;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 8px 18px rgba(22, 31, 43, 0.16);
}

#articles .mdm-sales-section .sales-price-column-popover-head {
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid #d6dbe3;
    padding-bottom: 4px;
}

#articles .mdm-sales-section .sales-price-column-popover-head strong {
    color: #1a1c1c;
    font-size: 12px;
    font-weight: 800;
}

#articles .mdm-sales-section .sales-price-column-popover-head button {
    width: auto;
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid #c1c7d2;
    background: #faf9f8;
    color: #004277;
    font-size: 11px;
    font-weight: 750;
}

#articles .mdm-sales-section .sales-price-column-popover label {
    min-height: 24px;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    color: #1a1c1c;
    font-size: 11px;
}

#articles .mdm-sales-section .sales-price-column-popover label.is-required {
    color: #666462;
}

#articles .mdm-sales-section .sales-price-column-popover input {
    width: 14px;
    height: 14px;
    margin: 0;
}

#articles .mdm-sales-section .sales-price-column-popover small {
    color: #8a93a1;
    font-size: 10px;
    font-weight: 700;
}

#articles .mdm-sales-section .sales-price-filter-popover {
    margin-top: 6px;
    padding-top: 6px;
    display: grid;
    gap: 6px;
    border-top: 1px solid #d6dbe3;
}

#articles .mdm-sales-section .sales-price-filter-popover label {
    min-height: 28px;
    grid-template-columns: 72px minmax(0, 1fr);
}

#articles .mdm-sales-section .sales-price-filter-popover label span {
    color: #666462;
    font-weight: 750;
}

#articles .mdm-sales-section .sales-price-filter-popover select {
    width: 100%;
    min-height: 26px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 0 6px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

#articles .mdm-sales-section .sales-price-table {
    min-height: 0;
    margin: 0 12px;
    flex: 1 1 auto;
    overflow: auto;
    border: 1px solid #c1c7d2;
    border-radius: 2px 2px 0 0;
    background: #fff;
}

#articles .mdm-sales-section .sales-price-table .article-list-head,
#articles .mdm-sales-section .sales-price-table .article-list-filter,
#articles .mdm-sales-section .sales-price-table .article-list-row {
    min-width: 1000px;
    display: grid;
    grid-template-columns: 122px minmax(250px, 1fr) 112px 136px 64px 120px 104px 120px 116px 88px;
}

#articles .mdm-sales-section .sales-price-table .article-list-head {
    position: sticky;
    top: 0;
    z-index: 6;
    min-height: 32px;
    background: #f4f3f2;
}

#articles .mdm-sales-section .sales-price-table .article-list-filter {
    position: sticky;
    top: 32px;
    z-index: 5;
    min-height: 24px;
    background: #faf9f8;
}

#articles .mdm-sales-section .sales-price-table .article-list-head span,
#articles .mdm-sales-section .sales-price-table .article-list-filter > *,
#articles .mdm-sales-section .sales-price-table .article-list-row > * {
    min-height: 24px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    min-width: 0;
    overflow: hidden;
    border-right: 1px solid #c1c7d2;
    border-bottom: 1px solid #c1c7d2;
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#articles .mdm-sales-section .sales-price-table .article-list-head span {
    min-height: 32px;
    color: #414750;
    font-size: 13px;
    font-weight: 800;
}

#articles .mdm-sales-section .sales-price-table .article-list-filter input,
#articles .mdm-sales-section .sales-price-table .article-list-filter select {
    width: 100%;
    min-height: 20px;
    padding: 0 4px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #414750;
    font-size: 11px;
}

#articles .mdm-sales-section .sales-price-table .article-list-row:nth-child(even) {
    background: #f8f8f8;
}

#articles .mdm-sales-section .sales-price-table .article-list-row:hover {
    background: rgba(0, 90, 158, 0.06);
}

#articles .mdm-sales-section .sales-price-table .article-list-row a {
    color: #004277;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-weight: 650;
    text-decoration: none;
}

#articles .mdm-sales-section .sales-price-table .article-list-row > span:nth-child(5),
#articles .mdm-sales-section .sales-price-table .article-list-head span:nth-child(5) {
    justify-content: center;
    text-align: center;
}

#articles .mdm-sales-section .sales-price-table .article-list-row > span:nth-child(6),
#articles .mdm-sales-section .sales-price-table .article-list-row > span:nth-child(7),
#articles .mdm-sales-section .sales-price-table .article-list-row > span:nth-child(8),
#articles .mdm-sales-section .sales-price-table .article-list-head span:nth-child(6),
#articles .mdm-sales-section .sales-price-table .article-list-head span:nth-child(7),
#articles .mdm-sales-section .sales-price-table .article-list-head span:nth-child(8) {
    justify-content: flex-end;
    font-family: "JetBrains Mono", Consolas, monospace;
    text-align: right;
}

#articles .mdm-sales-section .sales-price-table .article-list-head .is-center,
#articles .mdm-sales-section .sales-price-table .article-list-row > .is-center {
    justify-content: center;
    text-align: center;
}

#articles .mdm-sales-section .sales-price-table .article-list-head .is-number,
#articles .mdm-sales-section .sales-price-table .article-list-row > .is-number {
    justify-content: flex-end;
    font-family: "JetBrains Mono", Consolas, monospace;
    text-align: right;
}

#articles .mdm-sales-section .sales-price-type {
    padding: 1px 5px;
    border-radius: 2px;
    font-size: 10px;
    font-weight: 800;
    line-height: 12px;
    text-transform: uppercase;
}

#articles .mdm-sales-section .sales-price-type.is-article {
    background: #e6e2df;
    color: #666462;
}

#articles .mdm-sales-section .sales-price-type.is-service {
    background: #005aa1;
    color: #b3d1ff;
}

#articles .mdm-sales-section .article-row-actions {
    justify-content: center;
    gap: 4px;
}

#articles .mdm-sales-section .article-row-actions button {
    width: 22px;
    height: 22px;
    min-height: 22px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #727782;
}

#articles .mdm-sales-section .article-row-actions .material-symbols-outlined {
    font-size: 16px;
}

#articles .mdm-sales-section .article-row-actions button:hover {
    background: #e9e8e7;
    color: #004277;
}

#articles .mdm-sales-section .sales-price-footer {
    min-height: 32px;
    margin: 0 12px 12px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 0 0 auto;
    border: 1px solid #c1c7d2;
    border-top: 0;
    border-radius: 0 0 2px 2px;
    background: #f4f3f2;
    color: #414750;
    font-size: 11px;
}

#articles .mdm-sales-section .sales-price-footer strong {
    padding: 1px 8px;
    border-radius: 2px;
    background: #004277;
    color: #fff;
    font-size: 10px;
}

#articles .mdm-sales-section .sales-price-footer button:disabled {
    opacity: 0.45;
}

#articles .mdm-sales-section .sales-price-footer label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

#articles .mdm-sales-section .sales-price-footer select {
    min-height: 24px;
    padding: 0 22px 0 4px;
    border: 0;
    background: transparent;
    color: #1a1c1c;
    font-size: 11px;
}

@media (max-width: 1120px) {
    #articles .mdm-sales-section .sales-price-page-head,
    #articles .mdm-sales-section .sales-price-toolbar,
    #articles .mdm-sales-section .sales-price-footer {
        align-items: stretch;
        flex-direction: column;
    }

    #articles .mdm-sales-section .sales-price-search {
        width: 100%;
        margin-left: 0;
    }
}

.article-list-row {
    border-top: 1px solid var(--border-soft);
}

.article-list-row.selected {
    background: #edf3ff;
}

.catalog-row-select {
    display: inline-flex;
    max-width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--primary);
    font: inherit;
    font-weight: 900;
    text-align: left;
}

.article-list-row > span,
.article-list-row > strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.article-list-row mark,
.sales-price-type {
    width: fit-content;
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0 8px;
    font-size: 11px;
    font-weight: 900;
}

.sales-price-type.is-article {
    background: #eef4ff;
    color: #155eef;
}

.sales-price-type.is-service {
    background: #e9f9ee;
    color: #087443;
}

.master-price-readiness-badge {
    max-width: 100%;
}

.master-catalog-price-readiness-error {
    margin-bottom: 8px;
}

.master-price-preview {
    margin-top: 12px;
}

.catalog-price-confirm-action {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto;
    gap: 10px;
    align-items: end;
    margin-top: 12px;
}

.catalog-price-confirm-action label {
    display: grid;
    gap: 4px;
    margin: 0;
}

.catalog-price-confirm-action label span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.catalog-price-confirm-action input {
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 3px;
    padding: 6px 9px;
}

.catalog-price-confirm-action button {
    min-height: 34px;
    border: 1px solid var(--primary);
    border-radius: 3px;
    padding: 0 14px;
    background: var(--primary);
    color: #fff;
    font-weight: 800;
}

.catalog-price-confirm-action button:disabled {
    border-color: var(--border);
    background: #eef1f4;
    color: var(--muted);
}

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

.catalog-import-checks span {
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
}

.catalog-import-checks strong,
.catalog-import-checks small {
    display: block;
}

.catalog-import-checks strong {
    font-size: 20px;
}

.catalog-import-checks small {
    margin-top: 2px;
    color: var(--muted);
    font-weight: 800;
}

@media (max-width: 1120px) {
    .master-catalog-browser {
        grid-template-columns: 1fr;
    }

    .master-catalog-tree {
        min-height: 0;
    }

    .master-catalog-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.settings-modern {
    --settings-bg: #faf9f8;
    --settings-surface: #ffffff;
    --settings-low: #f4f3f2;
    --settings-line: #c1c7d2;
    --settings-soft-line: #e3e2e1;
    --settings-text: #1a1c1c;
    --settings-muted: #605e5c;
    --settings-primary: #004277;
    --settings-primary-strong: #005a9e;
    min-height: calc(100vh - 116px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--settings-soft-line);
    background: var(--settings-bg);
    color: var(--settings-text);
    font-family: Inter, sans-serif;
    font-size: 12px;
}

.settings-modern button,
.settings-modern input,
.settings-modern select,
.settings-modern textarea {
    font: inherit;
}

.settings-modern-head {
    padding: 12px 16px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid var(--settings-line);
    background: var(--settings-surface);
    flex-shrink: 0;
}

.settings-modern-head h1 {
    margin: 0;
    color: var(--settings-text);
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0;
}

.settings-modern-head p {
    margin: 3px 0 0;
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-modern-meta {
    margin-top: 7px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: var(--settings-muted);
    font-size: 10px;
}

.settings-modern-actions,
.settings-inline-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.settings-modern-actions button,
.settings-inline-actions button,
.settings-modern-card-head button,
.settings-logo-drop button,
.settings-modern-table button {
    min-height: 28px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: var(--settings-surface);
    color: var(--settings-text);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.settings-modern-actions .primary,
.settings-inline-actions .primary {
    border-color: var(--settings-primary);
    background: var(--settings-primary);
    color: #fff;
}

.settings-modern button:disabled,
.settings-modern a[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.45;
}

.settings-modern-workspace {
    min-height: 0;
    display: grid;
    grid-template-columns: 238px minmax(0, 1fr);
    flex: 1;
    overflow: hidden;
}

.settings-modern-nav {
    padding: 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow-y: auto;
    border-right: 1px solid var(--settings-line);
    background: var(--settings-surface);
}

.settings-modern-nav-search {
    min-height: 34px;
    margin-bottom: 7px;
    padding: 0 8px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: var(--settings-low);
    color: var(--settings-muted);
}

.settings-modern-nav-search > .material-symbols-outlined {
    font-size: 17px;
}

.settings-modern-nav-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--settings-text);
    font-size: 11px;
}

.settings-modern-nav-search button {
    width: 24px;
    height: 24px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: var(--settings-muted);
    cursor: pointer;
}

.settings-modern-nav-search button .material-symbols-outlined {
    font-size: 16px;
}

.settings-modern-nav-label {
    margin: 8px 8px 2px;
    color: #73777f;
    font: 700 10px/14px JetBrains Mono, monospace;
    text-transform: uppercase;
}

.settings-modern-nav-label.administration {
    margin-top: 14px;
}

.settings-modern-nav > button {
    width: 100%;
    min-height: 48px;
    padding: 7px 8px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border: 1px solid transparent;
    border-left: 3px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: var(--settings-muted);
    text-align: left;
    cursor: pointer;
}

.settings-modern-nav > button:hover {
    border-color: #d7dce5;
    background: #f5f7fa;
    color: var(--settings-text);
}

.settings-modern-nav > button.active {
    border-color: #ccd7e4;
    border-left-color: var(--settings-primary);
    background: #eaf2f8;
    color: var(--settings-primary);
}

.settings-modern-nav > button > .material-symbols-outlined {
    font-size: 19px;
}

.settings-modern-nav > button > span:last-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-modern-nav > button strong,
.settings-modern-nav > button small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-modern-nav > button strong {
    color: inherit;
    font-size: 11px;
    line-height: 14px;
}

.settings-modern-nav > button small {
    color: #717985;
    font-size: 9px;
    line-height: 12px;
}

.settings-modern-nav-empty {
    margin: 10px 4px;
    padding: 12px 8px;
    display: grid;
    justify-items: center;
    gap: 5px;
    border: 1px dashed var(--settings-line);
    color: var(--settings-muted);
    text-align: center;
    font-size: 10px;
}

.settings-modern-nav-empty .material-symbols-outlined {
    font-size: 20px;
}

.settings-modern-canvas {
    padding: 16px;
    display: grid;
    gap: 16px;
    align-content: start;
    overflow-y: auto;
    background: var(--settings-bg);
}

.settings-group-intro {
    min-height: 66px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--settings-line);
    border-left: 3px solid var(--settings-primary);
    border-radius: 2px;
    background: #f7fafc;
}

.settings-group-intro-icon {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 1px solid #c8d8e6;
    border-radius: 2px;
    background: #e6f0f7;
    color: var(--settings-primary);
    font-size: 20px;
}

.settings-group-intro h2 {
    margin: 0;
    color: var(--settings-text);
    font-size: 16px;
    line-height: 22px;
}

.settings-group-intro p {
    margin: 2px 0 0;
    color: var(--settings-muted);
    font-size: 11px;
    line-height: 15px;
}

.settings-search-empty {
    min-height: 220px;
}

.settings-search-empty button {
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font-weight: 700;
    cursor: pointer;
}

.settings-modern-card {
    display: grid;
    gap: 12px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: var(--settings-surface);
    scroll-margin-top: 12px;
}

.settings-modern-card-head {
    min-height: 40px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--settings-line);
    background: #fff;
}

.settings-modern-card-head h2 {
    margin: 0;
    color: var(--settings-text);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
}

.settings-modern-card-head p {
    margin: 1px 0 0;
    color: var(--settings-muted);
    font-size: 11px;
    line-height: 14px;
}

.settings-state {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 2px 7px;
    border-radius: 2px;
    background: #d3e3ff;
    color: #001c39;
    font-size: 11px;
    font-weight: 700;
}

.settings-state span {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: var(--settings-primary);
}

.settings-state.warning {
    background: #fff4ce;
    color: #5c3b00;
}

.settings-state.blocked {
    background: #fde2e1;
    color: #601410;
}

.settings-state.neutral {
    background: var(--settings-low);
    color: var(--settings-muted);
}

.settings-company-modern,
.settings-split-grid,
.settings-modern-form.two,
.settings-modern-form.four,
.settings-location-grid,
.settings-chip-matrix,
.settings-inline-form {
    padding: 12px;
}

.settings-company-modern {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    align-items: start;
    gap: 16px;
}

.settings-company-form {
    min-width: 0;
    display: grid;
    gap: 14px;
}

.settings-company-group {
    min-width: 0;
    margin: 0;
    padding: 12px;
    border: 1px solid var(--settings-soft-line);
    background: #fff;
}

.settings-company-group legend {
    padding: 0 6px;
    color: var(--settings-text);
    font-size: 12px;
    font-weight: 700;
}

.settings-company-group .settings-modern-form {
    padding: 0;
}

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

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

.settings-modern-form.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.settings-modern-form label {
    display: grid;
    gap: 4px;
    color: var(--settings-muted);
    font: 500 11px/14px JetBrains Mono, monospace;
}

.settings-modern-form label.wide,
.settings-inline-actions.wide {
    grid-column: 1 / -1;
}

.settings-modern-form input:not([type="checkbox"]),
.settings-modern-form select,
.settings-modern-form textarea {
    width: 100%;
    min-height: 28px;
    padding: 6px 8px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font: 400 12px/16px Inter, sans-serif;
    outline: 0;
}

.settings-modern-form textarea {
    min-height: 72px;
    resize: vertical;
}

.settings-modern-check {
    min-height: 28px;
    display: flex !important;
    grid-template-columns: none;
    align-items: center;
    gap: 7px;
    color: var(--settings-text) !important;
    font-family: Inter, sans-serif !important;
}

.settings-modern-check input {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: var(--settings-primary);
}

.settings-logo-drop {
    min-height: 0;
    padding: 12px;
    display: grid;
    align-content: start;
    gap: 10px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: var(--settings-low);
    text-align: left;
}

.settings-logo-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.settings-logo-state {
    padding: 2px 6px;
    border: 1px solid var(--settings-line);
    background: #fff;
    color: var(--settings-muted);
    font-size: 10px;
    font-weight: 700;
}

.settings-logo-state.active {
    border-color: #9bd1aa;
    background: #edf8f0;
    color: #176a32;
}

.settings-logo-state.pending {
    border-color: #e0b569;
    background: #fff8e8;
    color: #775310;
}

.settings-logo-state.missing {
    border-color: #e1a09d;
    background: #fdf0ef;
    color: #8b2722;
}

.settings-logo-preview {
    width: 100%;
    aspect-ratio: 3 / 1;
    min-height: 96px;
    padding: 10px;
    display: grid;
    place-items: center;
    gap: 4px;
    border: 1px solid var(--settings-line);
    background: #fff;
}

.settings-logo-preview img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.settings-logo-preview > .material-symbols-outlined {
    color: var(--settings-muted);
    font-size: 28px;
}

.settings-logo-drop.has-logo {
    border-style: solid;
}

.settings-logo-drop.has-selection {
    border-color: #c4943c;
}

.settings-logo-drop strong {
    color: var(--settings-text);
    font-size: 12px;
}

.settings-logo-input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.settings-logo-file {
    max-width: 100%;
    overflow: hidden;
    color: var(--settings-text);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-logo-actions {
    display: flex;
    justify-content: stretch;
    gap: 6px;
}

.settings-logo-actions > label,
.settings-logo-actions > button {
    flex: 1 1 0;
    min-height: 30px;
    padding: 6px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font: inherit;
    cursor: pointer;
}

.settings-logo-actions > button.primary {
    border-color: var(--settings-primary);
    background: var(--settings-primary);
    color: #fff;
}

.settings-logo-actions > button:disabled {
    cursor: default;
    opacity: .55;
}

.settings-logo-drop small,
.settings-location-grid span {
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-logo-targets {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
}

.settings-logo-targets > span {
    min-width: 0;
    padding: 6px 3px;
    display: grid;
    place-items: center;
    gap: 2px;
    border: 1px solid var(--settings-soft-line);
    background: #fff;
    color: var(--settings-text);
    font-size: 9px;
    text-align: center;
}

.settings-logo-targets .material-symbols-outlined {
    color: var(--settings-primary);
    font-size: 16px;
}

.settings-logo-version-note {
    padding-top: 8px;
    border-top: 1px solid var(--settings-soft-line);
    line-height: 15px;
}

.settings-location-grid,
.settings-chip-matrix {
    display: grid;
    gap: 8px;
}

.settings-location-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-location-grid > div {
    padding: 10px;
    display: grid;
    gap: 4px;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: var(--settings-low);
}

.settings-location-grid strong {
    color: var(--settings-text);
    font-size: 12px;
}

.settings-modern-table {
    display: grid;
    margin: 12px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    overflow: hidden;
}

.settings-modern-table.bank {
    grid-template-columns: 1fr 1.1fr 0.7fr 0.7fr 1.15fr;
}

.settings-modern-table.readiness {
    grid-template-columns: 0.9fr 0.7fr minmax(0, 1.8fr);
}

.settings-modern-table.project-customer-link-readiness-checks {
    grid-template-columns: 0.8fr 0.52fr minmax(0, 2fr);
}

.settings-modern-table.project-customer-link-readiness-candidates {
    grid-template-columns: minmax(180px, 1.25fr) minmax(130px, 0.9fr) minmax(150px, 0.9fr) 0.42fr minmax(160px, 1.1fr) 0.42fr;
}

.settings-modern-table.number-sequences {
    grid-template-columns: 0.78fr 0.42fr minmax(130px, 1.1fr) 0.66fr minmax(130px, 1fr) 0.55fr minmax(120px, 0.8fr);
}

.settings-modern-table.tax-codes {
    grid-template-columns: 0.56fr minmax(140px, 1.1fr) 0.48fr 0.72fr minmax(150px, 1.05fr) 0.56fr minmax(150px, 1.05fr);
}

.settings-modern-table.payment-terms {
    grid-template-columns: 0.56fr minmax(130px, 1fr) 0.42fr minmax(160px, 1.35fr) 0.56fr minmax(150px, 1.05fr);
}

.settings-modern-table.filestore-scans {
    grid-template-columns: 0.78fr 0.85fr 0.58fr 0.62fr minmax(140px, 1.15fr) 0.58fr 0.74fr 0.48fr;
}

.settings-modern-table.folder-templates {
    grid-template-columns: 0.68fr minmax(180px, 1.55fr) 0.46fr 0.52fr 0.72fr minmax(160px, 1.2fr);
}

.settings-modern-table.folder-removal-dependencies {
    grid-template-columns: minmax(150px, 1.05fr) 0.62fr 0.62fr minmax(220px, 1.75fr) minmax(170px, 1.2fr);
}

.settings-modern-table.folder-removal-operations {
    grid-template-columns: minmax(150px, 1.2fr) 0.72fr 0.58fr 0.58fr minmax(210px, 1.55fr);
}

.settings-modern-table.orphan-review-readiness {
    grid-template-columns: minmax(185px, 1.28fr) minmax(116px, 0.72fr) minmax(118px, 0.68fr) 0.34fr minmax(105px, 0.62fr) minmax(160px, 0.94fr) minmax(134px, 0.74fr) minmax(118px, 0.64fr);
}

.settings-modern-table.orphan-review-decision-history {
    grid-template-columns: minmax(190px, 1.28fr) minmax(132px, 0.7fr) minmax(180px, 1.02fr) minmax(170px, 0.92fr) minmax(132px, 0.7fr) minmax(145px, 0.78fr) minmax(134px, 0.72fr) minmax(80px, 0.38fr);
}

.settings-modern-table.quote-email-provider-configurations {
    grid-template-columns: 0.62fr minmax(120px, 0.9fr) 0.62fr 0.52fr minmax(135px, 0.9fr) 0.62fr minmax(310px, 1.45fr);
}

.settings-modern-table.quote-email-sender-profiles {
    grid-template-columns: minmax(150px, 1.05fr) minmax(120px, 0.86fr) 0.42fr 0.52fr 0.62fr minmax(270px, 1.45fr);
}

.settings-modern-table.security-permissions {
    grid-template-columns: minmax(120px, 0.72fr) minmax(190px, 1.1fr) minmax(74px, 0.42fr) minmax(220px, 1.55fr);
}

.settings-modern-table.identity-roles {
    grid-template-columns: minmax(150px, 1.1fr) minmax(86px, 0.54fr) minmax(120px, 0.84fr) minmax(140px, 0.94fr) minmax(116px, 0.72fr) minmax(260px, 1.45fr);
}

.settings-modern-table.identity-users {
    grid-template-columns: minmax(180px, 1.25fr) minmax(88px, 0.5fr) minmax(170px, 1fr) minmax(120px, 0.7fr) minmax(250px, 1.4fr);
}

.settings-modern-table > * {
    min-height: 31px;
    padding: 7px 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    border-right: 1px solid var(--settings-soft-line);
    border-bottom: 1px solid var(--settings-soft-line);
    background: #fff;
    color: var(--settings-text);
    font-size: 11px;
}

.settings-modern-table.bank > *:nth-child(5n),
.settings-modern-table.readiness > *:nth-child(3n),
.settings-modern-table.project-customer-link-readiness-checks > *:nth-child(3n),
.settings-modern-table.project-customer-link-readiness-candidates > *:nth-child(6n),
.settings-modern-table.number-sequences > *:nth-child(7n),
.settings-modern-table.tax-codes > *:nth-child(7n),
.settings-modern-table.payment-terms > *:nth-child(6n),
.settings-modern-table.filestore-scans > *:nth-child(8n),
.settings-modern-table.folder-templates > *:nth-child(6n),
.settings-modern-table.folder-removal-dependencies > *:nth-child(5n),
.settings-modern-table.folder-removal-operations > *:nth-child(5n),
.settings-modern-table.orphan-review-readiness > *:nth-child(8n),
.settings-modern-table.orphan-review-decision-history > *:nth-child(8n),
.settings-modern-table.quote-email-provider-configurations > *:nth-child(7n),
.settings-modern-table.quote-email-sender-profiles > *:nth-child(6n) {
    border-right: 0;
}

.settings-modern-table.identity-users > *:nth-child(5n),
.settings-modern-table.identity-roles > *:nth-child(6n) {
    border-right: 0;
}

.settings-modern-table.security-permissions > *:nth-child(4n) {
    border-right: 0;
}

.settings-modern-table.bank > *:nth-child(-n + 5),
.settings-modern-table.readiness > *:nth-child(-n + 3),
.settings-modern-table.project-customer-link-readiness-checks > *:nth-child(-n + 3),
.settings-modern-table.project-customer-link-readiness-candidates > *:nth-child(-n + 6),
.settings-modern-table.number-sequences > *:nth-child(-n + 7),
.settings-modern-table.tax-codes > *:nth-child(-n + 7),
.settings-modern-table.payment-terms > *:nth-child(-n + 6),
.settings-modern-table.filestore-scans > *:nth-child(-n + 8),
.settings-modern-table.folder-templates > *:nth-child(-n + 6),
.settings-modern-table.folder-removal-dependencies > *:nth-child(-n + 5),
.settings-modern-table.folder-removal-operations > *:nth-child(-n + 5),
.settings-modern-table.orphan-review-readiness > *:nth-child(-n + 8),
.settings-modern-table.orphan-review-decision-history > *:nth-child(-n + 8),
.settings-modern-table.quote-email-provider-configurations > *:nth-child(-n + 7),
.settings-modern-table.quote-email-sender-profiles > *:nth-child(-n + 6) {
    background: var(--settings-low);
    color: var(--settings-muted);
    font-family: JetBrains Mono, monospace;
    font-weight: 700;
}

.settings-modern-table.identity-users > *:nth-child(-n + 5),
.settings-modern-table.identity-roles > *:nth-child(-n + 6) {
    background: var(--settings-low);
    color: var(--settings-muted);
    font-family: JetBrains Mono, monospace;
    font-weight: 700;
}

.settings-modern-table.security-permissions > *:nth-child(-n + 4) {
    background: var(--settings-low);
    color: var(--settings-muted);
    font-family: JetBrains Mono, monospace;
    font-weight: 700;
}

.settings-modern-table strong {
    font-weight: 700;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-modern-table.identity-users strong {
    display: grid;
    gap: 2px;
}

.settings-modern-table.identity-users strong small {
    overflow: hidden;
    color: var(--settings-muted);
    font-size: 10px;
    font-weight: 500;
    line-height: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-modern-table.folder-removal-dependencies > span,
.settings-modern-table.folder-removal-operations > span,
.settings-modern-table.project-customer-link-readiness-checks > span,
.settings-modern-table.project-customer-link-readiness-candidates > span,
.settings-modern-table.orphan-review-readiness > span,
.settings-modern-table.orphan-review-decision-history > span,
.settings-modern-table.quote-email-provider-configurations > span,
.settings-modern-table.quote-email-sender-profiles > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.settings-modern-table.quote-email-provider-configurations button,
.settings-modern-table.quote-email-sender-profiles button,
.settings-modern-table.identity-users button,
.settings-modern-table.identity-roles button {
    padding: 0 8px;
    white-space: nowrap;
}

.settings-identity-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    justify-content: flex-end;
}

.settings-identity-principal {
    min-height: 50px;
    margin: 0 12px 12px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: auto minmax(180px, 1fr) minmax(110px, auto) minmax(180px, auto) auto;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--settings-line);
    background: var(--settings-low);
}

.settings-identity-principal > .material-symbols-outlined {
    color: var(--settings-primary);
    font-size: 22px;
}

.settings-identity-principal > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-identity-principal strong {
    overflow: hidden;
    color: var(--settings-text);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-identity-principal span:not(.material-symbols-outlined):not(.settings-state) {
    overflow: hidden;
    color: var(--settings-muted);
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-identity-commandbar {
    min-height: 42px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid var(--settings-soft-line);
    border-bottom: 1px solid var(--settings-line);
    background: #fff;
}

.settings-identity-commandbar nav,
.settings-identity-commandbar > div {
    display: flex;
    align-items: center;
    gap: 4px;
}

.settings-identity-commandbar nav button {
    min-height: 41px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--settings-muted);
    font-size: 11px;
    font-weight: 700;
}

.settings-identity-commandbar nav button:hover {
    background: var(--settings-low);
    color: var(--settings-text);
}

.settings-identity-commandbar nav button.is-active {
    border-bottom-color: var(--settings-primary);
    color: var(--settings-primary);
}

.settings-identity-commandbar nav .material-symbols-outlined {
    font-size: 17px;
}

.settings-identity-commandbar nav mark {
    min-width: 19px;
    padding: 2px 5px;
    border-radius: 10px;
    background: #eaf2f7;
    color: var(--settings-primary);
    font-size: 9px;
    text-align: center;
}

.settings-identity-commandbar > div > .primary {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.settings-identity-commandbar > div > .primary .material-symbols-outlined {
    font-size: 16px;
}

.settings-icon-button {
    width: 30px;
    min-width: 30px;
    min-height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
}

.settings-icon-button:hover:not(:disabled) {
    border-color: #9db2c1;
    background: var(--settings-low);
    color: var(--settings-primary);
}

.settings-icon-button.danger:hover:not(:disabled) {
    border-color: #d6a7a7;
    background: #fff7f7;
    color: #a12a2a;
}

.settings-icon-button .material-symbols-outlined {
    font-size: 17px;
}

.settings-identity-health {
    margin: 12px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border: 1px solid var(--settings-line);
    background: #fff;
}

.settings-identity-health > div {
    min-height: 54px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-right: 1px solid var(--settings-soft-line);
}

.settings-identity-health > div:last-child {
    border-right: 0;
}

.settings-identity-health .material-symbols-outlined {
    color: var(--settings-muted);
    font-size: 19px;
}

.settings-identity-health > div > span:last-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-identity-health strong {
    color: var(--settings-text);
    font-size: 12px;
}

.settings-identity-health small {
    color: var(--settings-muted);
    font-size: 9px;
}

.settings-identity-health .is-ok {
    background: #f4faf6;
}

.settings-identity-health .is-ok .material-symbols-outlined {
    color: #168445;
}

.settings-identity-health .is-critical {
    background: #fff7f7;
}

.settings-identity-health .is-critical .material-symbols-outlined,
.settings-identity-health .is-critical strong {
    color: #a12a2a;
}

.settings-identity-filter {
    min-height: 46px;
    margin: 0 12px;
    padding: 6px;
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(135px, 0.35fr) 98px auto 30px;
    align-items: end;
    gap: 6px;
    border: 1px solid var(--settings-line);
    background: var(--settings-low);
}

.settings-identity-filter.roles {
    grid-template-columns: minmax(240px, 1fr) minmax(135px, 0.35fr) 98px;
}

.settings-identity-filter label {
    min-width: 0;
    display: grid;
    gap: 2px;
    color: var(--settings-muted);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.settings-identity-filter label.is-search {
    min-height: 31px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--settings-line);
    background: #fff;
}

.settings-identity-filter label.is-search .material-symbols-outlined {
    color: var(--settings-muted);
    font-size: 17px;
}

.settings-identity-filter input,
.settings-identity-filter select {
    width: 100%;
    min-width: 0;
    min-height: 31px;
    padding: 5px 7px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font-size: 11px;
    text-transform: none;
}

.settings-identity-filter label.is-search input {
    min-height: 29px;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
}

.settings-identity-filter > button.primary {
    min-height: 31px;
}

.settings-identity-role-summary {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-identity-role-summary small {
    color: var(--settings-muted);
    font-size: 9px;
}

.settings-identity-pagination {
    min-height: 38px;
    margin: 0 12px 12px;
    padding: 5px 7px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid var(--settings-line);
    background: var(--settings-low);
    color: var(--settings-muted);
    font-size: 10px;
}

.settings-identity-pagination > div {
    display: flex;
    align-items: center;
    gap: 3px;
}

.settings-identity-pagination button {
    width: 28px;
    min-width: 28px;
    min-height: 27px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--settings-line);
    background: #fff;
}

.settings-identity-pagination button .material-symbols-outlined {
    font-size: 16px;
}

.settings-identity-pagination strong {
    padding: 0 7px;
    color: var(--settings-text);
    font-size: 10px;
}

.settings-identity-role-matrix-wrap {
    margin: 12px;
    overflow-x: auto;
    border: 1px solid var(--settings-line);
    background: #fff;
}

.settings-identity-role-matrix {
    min-width: 980px;
}

.settings-identity-role-matrix > .is-header,
.settings-identity-role-row {
    display: grid;
    grid-template-columns: minmax(180px, 1.25fr) repeat(7, minmax(78px, 0.55fr)) minmax(108px, 0.7fr);
}

.settings-identity-role-matrix > .is-header > span {
    min-height: 34px;
    padding: 7px 8px;
    display: flex;
    align-items: center;
    border-right: 1px solid var(--settings-soft-line);
    border-bottom: 1px solid var(--settings-line);
    background: var(--settings-low);
    color: var(--settings-muted);
    font: 700 9px/12px "JetBrains Mono", monospace;
    text-transform: uppercase;
}

.settings-identity-role-row > * {
    min-height: 52px;
    padding: 6px;
    border-right: 1px solid var(--settings-soft-line);
    border-bottom: 1px solid var(--settings-soft-line);
}

.settings-identity-role-row:last-child > * {
    border-bottom: 0;
}

.settings-identity-role-name {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 2px;
}

.settings-identity-role-name strong,
.settings-identity-role-name small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-identity-role-name strong {
    color: var(--settings-text);
    font-size: 11px;
}

.settings-identity-role-name small {
    color: var(--settings-muted);
    font-size: 9px;
}

.settings-identity-role-row > button {
    margin: 6px;
    min-height: 40px;
    padding: 4px;
    display: grid;
    place-content: center;
    gap: 1px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-muted);
}

.settings-identity-role-row > button strong {
    font-size: 11px;
}

.settings-identity-role-row > button small {
    font-size: 8px;
}

.settings-identity-role-row > button.is-complete {
    border-color: #a6d2b8;
    background: #f2faf5;
    color: #176b38;
}

.settings-identity-role-row > button.is-partial {
    border-color: #e6c98d;
    background: #fffaf0;
    color: #895d00;
}

.settings-identity-role-row > button.is-none {
    color: #8b97a0;
}

.settings-identity-role-row > .settings-identity-actions {
    align-items: center;
    justify-content: center;
}

.settings-identity-current-access > header {
    min-height: 48px;
    margin: 12px 12px 0;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--settings-line);
    background: var(--settings-low);
}

.settings-identity-current-access > header > div {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.settings-identity-current-access > header .material-symbols-outlined {
    color: var(--settings-primary);
    font-size: 20px;
}

.settings-identity-current-access > header span:not(.material-symbols-outlined) {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-identity-current-access > header strong {
    color: var(--settings-text);
    font-size: 11px;
}

.settings-identity-current-access > header small {
    color: var(--settings-muted);
    font-size: 9px;
}

.settings-identity-current-access > header mark {
    padding: 4px 7px;
    background: #eaf2f7;
    color: var(--settings-primary);
    font-size: 10px;
    font-weight: 700;
}

.settings-identity-modal {
    width: min(760px, calc(100vw - 40px));
}

.settings-identity-modal.permissions {
    width: min(980px, calc(100vw - 40px));
}

.settings-identity-modal .form-error {
    margin: 0 12px 12px;
}

.settings-identity-form-grid {
    margin: 0 12px 12px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.settings-identity-form-grid.single {
    grid-template-columns: minmax(0, 1fr);
}

.settings-identity-form-grid .is-wide {
    grid-column: 1 / -1;
}

.settings-identity-form-grid label {
    display: grid;
    gap: 4px;
    color: var(--settings-muted);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.settings-identity-form-grid input,
.settings-identity-form-grid select {
    min-height: 31px;
    padding: 5px 8px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font-size: 12px;
    text-transform: none;
}

.settings-identity-summary {
    margin: 0 12px 12px;
    padding: 9px 10px;
    display: grid;
    gap: 3px;
    border: 1px solid var(--settings-line);
    background: var(--settings-low);
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-identity-summary strong {
    color: var(--settings-text);
    font-size: 13px;
}

.settings-identity-assignment-list {
    max-height: 380px;
    margin: 0 12px 12px;
    display: grid;
    overflow: auto;
    border: 1px solid var(--settings-line);
    background: #fff;
}

.settings-identity-assignment-summary {
    margin: 0 12px 8px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid var(--settings-line);
    background: var(--settings-low);
}

.settings-identity-assignment-summary > span {
    min-height: 45px;
    padding: 7px 9px;
    display: grid;
    align-content: center;
    gap: 1px;
    border-right: 1px solid var(--settings-soft-line);
}

.settings-identity-assignment-summary > span:last-child {
    border-right: 0;
}

.settings-identity-assignment-summary strong {
    color: var(--settings-text);
    font-size: 12px;
}

.settings-identity-assignment-summary small {
    color: var(--settings-muted);
    font-size: 9px;
}

@media (max-width: 900px) {
    .settings-identity-principal {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .settings-identity-principal > div:nth-of-type(2),
    .settings-identity-principal > div:nth-of-type(3) {
        display: none;
    }

    .settings-identity-health {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .settings-identity-health > div:nth-child(2) {
        border-right: 0;
    }

    .settings-identity-health > div:nth-child(-n + 2) {
        border-bottom: 1px solid var(--settings-soft-line);
    }

    .settings-identity-filter,
    .settings-identity-filter.roles {
        grid-template-columns: minmax(0, 1fr) minmax(120px, 0.42fr) 88px;
    }

    .settings-identity-filter > button {
        grid-row: 2;
    }

    .settings-modern-table.identity-users {
        min-width: 900px;
    }
}

.settings-identity-assignment-list label {
    min-height: 34px;
    padding: 7px 9px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    border-bottom: 1px solid var(--settings-soft-line);
    color: var(--settings-text);
    font-size: 11px;
}

.settings-identity-assignment-list label:last-child {
    border-bottom: 0;
}

.settings-identity-assignment-list input {
    width: 14px;
    min-height: 14px;
    margin-top: 2px;
}

.settings-identity-assignment-list span {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-identity-assignment-list strong {
    overflow: hidden;
    color: var(--settings-text);
    font-size: 11px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-identity-assignment-list small {
    overflow: hidden;
    color: var(--settings-muted);
    font-size: 10px;
    line-height: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-provider-layout {
    display: grid;
    gap: 0;
}

.settings-provider-detail {
    margin: 0 12px 12px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
}

.settings-provider-detail > header {
    min-height: 42px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--settings-soft-line);
    background: var(--settings-low);
}

.settings-provider-detail > header > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-provider-detail > header strong {
    overflow: hidden;
    color: var(--settings-text);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-provider-detail > header span,
.settings-provider-modal-hint {
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-provider-modal .settings-modern-form {
    margin: 0;
}

.settings-filestore-status-grid,
.settings-folder-removal-status-grid,
.settings-project-customer-link-status-grid,
.settings-orphan-review-summary-grid {
    padding: 12px;
    display: grid;
    gap: 8px;
}

.settings-filestore-status-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.settings-folder-removal-status-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.settings-project-customer-link-status-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.settings-orphan-review-summary-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.settings-filestore-status-grid > div,
.settings-folder-removal-status-grid > div,
.settings-project-customer-link-status-grid > div,
.settings-orphan-review-summary-grid > div {
    min-height: 48px;
    padding: 8px 9px;
    display: grid;
    gap: 4px;
    align-content: center;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: var(--settings-low);
}

.settings-filestore-status-grid span,
.settings-folder-removal-status-grid span,
.settings-project-customer-link-status-grid span,
.settings-orphan-review-summary-grid span,
.settings-filestore-detail-grid span {
    color: var(--settings-muted);
    font: 500 10px/13px JetBrains Mono, monospace;
}

.settings-filestore-status-grid strong,
.settings-folder-removal-status-grid strong,
.settings-project-customer-link-status-grid strong,
.settings-orphan-review-summary-grid strong,
.settings-filestore-detail-grid strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--settings-text);
    font-size: 12px;
}

.settings-filestore-message-list {
    padding: 0 12px 12px;
    display: grid;
    gap: 6px;
}

.settings-filestore-message-list span {
    min-height: 26px;
    padding: 6px 8px;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-folder-removal-actions {
    margin: -4px 12px 12px;
    display: grid;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: #fff;
}

.settings-folder-removal-actions header {
    min-height: 34px;
    padding: 7px 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid var(--settings-soft-line);
    background: var(--settings-low);
}

.settings-folder-removal-actions header strong {
    color: var(--settings-text);
    font-size: 12px;
}

.settings-folder-removal-actions header button {
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font-size: 11px;
    font-weight: 700;
}

.settings-folder-removal-actions > span {
    min-height: 28px;
    padding: 7px 9px;
    border-bottom: 1px solid var(--settings-soft-line);
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-folder-removal-actions > span:last-child {
    border-bottom: 0;
}

.settings-filestore-filter,
.settings-orphan-review-filter {
    border-top: 1px solid var(--settings-soft-line);
    border-bottom: 1px solid var(--settings-soft-line);
    background: #fff;
}

.settings-filestore-filter .settings-inline-actions,
.settings-orphan-review-filter .settings-inline-actions {
    align-items: end;
    justify-content: flex-start;
}

.settings-orphan-review-blockers {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.settings-orphan-review-blockers mark {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-orphan-review-navigation {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.settings-orphan-review-navigation a {
    min-height: 26px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-primary);
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}

.settings-orphan-review-decision-cell {
    justify-content: flex-start;
}

.settings-orphan-review-decision-cell button {
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-primary);
    font-size: 11px;
    font-weight: 700;
}

.settings-orphan-review-decision-cell button:disabled {
    background: var(--settings-low);
    color: var(--settings-muted);
}

.settings-orphan-review-decision-modal {
    width: min(680px, calc(100vw - 32px));
}

.settings-orphan-review-decision-context {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.settings-orphan-review-decision-context > div {
    min-height: 44px;
    padding: 7px 9px;
    display: grid;
    align-content: center;
    gap: 3px;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: var(--settings-low);
}

.settings-orphan-review-decision-context span {
    color: var(--settings-muted);
    font: 500 10px/13px JetBrains Mono, monospace;
}

.settings-orphan-review-decision-context strong {
    min-width: 0;
    overflow: hidden;
    color: var(--settings-text);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-orphan-review-decision-form {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

.settings-orphan-review-decision-form .wide {
    grid-column: 1 / -1;
}

.settings-orphan-review-history {
    margin: 12px;
    display: grid;
    gap: 8px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
}

.settings-orphan-review-history > header {
    min-height: 40px;
    padding: 7px 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--settings-soft-line);
    background: var(--settings-low);
}

.settings-orphan-review-history > header > div {
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.settings-orphan-review-history > header > div:first-child {
    display: grid;
    gap: 2px;
}

.settings-orphan-review-history strong {
    color: var(--settings-text);
    font-size: 12px;
}

.settings-orphan-review-history header span {
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-orphan-review-history select,
.settings-orphan-review-history button {
    min-height: 26px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font-size: 11px;
}

.settings-orphan-review-history button {
    padding: 0 8px;
    font-weight: 700;
}

.settings-filestore-footer,
.settings-orphan-review-footer {
    min-height: 34px;
    margin: -4px 12px 12px;
    padding: 6px 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: var(--settings-low);
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-filestore-footer > div,
.settings-orphan-review-footer > div {
    display: flex;
    align-items: center;
    gap: 6px;
}

.settings-filestore-footer button,
.settings-orphan-review-footer button,
.settings-filestore-detail header button {
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    font-size: 11px;
    font-weight: 700;
}

.settings-filestore-detail {
    margin: 0 12px 12px;
    display: grid;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
}

.settings-filestore-detail header {
    min-height: 36px;
    padding: 7px 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid var(--settings-soft-line);
    background: var(--settings-low);
}

.settings-filestore-detail header > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-filestore-detail header strong,
.settings-filestore-detail header span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-filestore-detail header span {
    color: var(--settings-muted);
    font-size: 11px;
}

.settings-filestore-detail-grid {
    padding: 10px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.settings-filestore-detail-grid > div {
    min-height: 48px;
    padding: 7px 8px;
    display: grid;
    gap: 4px;
    align-content: start;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: #fff;
}

.settings-filestore-detail-grid > div.wide {
    grid-column: span 2;
}

.settings-chip-matrix {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.settings-chip-matrix span {
    min-height: 30px;
    padding: 7px 9px;
    border: 1px solid var(--settings-soft-line);
    border-radius: 2px;
    background: var(--settings-low);
    color: var(--settings-text);
    font-size: 11px;
    font-weight: 700;
}

.settings-module-grid {
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.settings-module-grid a {
    min-height: 62px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) 20px;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--settings-line);
    border-radius: 2px;
    background: #fff;
    color: var(--settings-text);
    text-decoration: none;
}

.settings-module-grid a:hover {
    border-color: #7aa7c7;
    background: #f5f9fc;
}

.settings-module-grid a > .material-symbols-outlined:first-child {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 2px;
    background: #e6f0f7;
    color: var(--settings-primary);
    font-size: 19px;
}

.settings-module-grid a > .material-symbols-outlined:last-child {
    color: #697784;
    font-size: 18px;
}

.settings-module-grid a > span:nth-child(2) {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.settings-module-grid strong,
.settings-module-grid small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-module-grid strong {
    font-size: 12px;
}

.settings-module-grid small {
    color: var(--settings-muted);
    font-size: 10px;
}

@media (max-width: 1100px) {
    .settings-company-modern {
        grid-template-columns: 1fr;
    }

    .settings-modern-form.four,
    .settings-location-grid,
    .settings-folder-removal-status-grid,
    .settings-project-customer-link-status-grid,
    .settings-orphan-review-summary-grid,
    .settings-chip-matrix {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .settings-modern-workspace {
        grid-template-columns: 1fr;
        grid-template-rows: auto minmax(0, 1fr);
    }

    .settings-modern-nav {
        display: grid;
        grid-template-columns: minmax(190px, 1fr) repeat(4, minmax(44px, 1fr));
        grid-auto-flow: column;
        overflow-x: auto;
        overflow-y: hidden;
        border-right: 0;
        border-bottom: 1px solid var(--settings-line);
    }

    .settings-modern-nav-search {
        margin: 0;
    }

    .settings-modern-nav-label,
    .settings-modern-nav-empty,
    .settings-modern-nav > button small {
        display: none;
    }

    .settings-modern-nav > button {
        min-height: 36px;
        grid-template-columns: 20px minmax(0, 1fr);
    }

    .settings-module-grid {
        grid-template-columns: 1fr;
    }
}

.document-template-designer {
    min-width: 1180px;
    min-height: calc(100vh - 100px);
    display: grid;
    grid-template-rows: auto auto minmax(560px, 1fr) 186px;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #eef1f5;
    color: #1f2328;
}

.document-template-designer button,
.document-template-designer input,
.document-template-designer select,
.document-template-designer textarea {
    font: inherit;
}

.template-designer-topbar {
    min-height: 96px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 10px 14px 10px 18px;
    border-bottom: 1px solid #c9cfd9;
    background: #fff;
}

.template-designer-topbar-main {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.template-designer-breadcrumb {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #667085;
    font-size: 12px;
}

.template-designer-breadcrumb b {
    color: #1f2937;
}

.template-designer-title-row {
    display: flex;
    align-items: center;
    gap: 9px;
}

.template-designer-title-row h1 {
    max-width: 520px;
    margin: 0;
    overflow: hidden;
    color: #101828;
    font-size: 22px;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-pill,
.number-range-pill {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 0 9px;
    background: #f9fafb;
    color: #344054;
    font-size: 12px;
    font-weight: 700;
}

.template-pill.blue {
    border-color: #b2ccff;
    background: #eff4ff;
    color: #155eef;
}

.template-save-state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #667085;
    font-size: 12px;
}

.template-save-state span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #12b76a;
}

.template-document-control {
    display: flex;
    align-items: end;
    gap: 10px;
}

.template-document-control label {
    display: grid;
    gap: 3px;
    color: #667085;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.template-document-control select,
.template-tool-group select,
.template-search input {
    border: 1px solid #cfd6e3;
    border-radius: 6px;
    background: #fff;
    color: #1f2937;
}

.template-document-control select {
    min-width: 210px;
    min-height: 34px;
    padding: 0 9px;
}

.template-designer-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.template-btn {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid #cfd6e3;
    border-radius: 6px;
    padding: 0 10px;
    background: #fff;
    color: #1f2937;
    font-weight: 700;
}

.template-btn.icon {
    width: 36px;
    padding: 0;
}

.template-btn.primary {
    border-color: #155eef;
    background: #155eef;
    color: #fff;
}

.template-btn.danger,
.template-action-menu-panel button.danger {
    border-color: #fecdca;
    background: #fffbfa;
    color: #b42318;
}

.template-action-menu {
    position: relative;
}

.template-action-menu-toggle {
    cursor: pointer;
}

.template-action-menu-panel {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 8;
    min-width: 168px;
    display: grid;
    gap: 4px;
    border: 1px solid #cfd6e3;
    border-radius: 7px;
    padding: 6px;
    background: #fff;
    box-shadow: 0 12px 28px rgb(16 24 40 / 18%);
}

.template-action-menu-panel button {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: start;
    gap: 7px;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 0 8px;
    background: transparent;
    color: #344054;
    font-weight: 800;
}

.template-action-menu-panel .material-symbols-outlined {
    font-size: 18px;
}

.template-designer-toolbar {
    min-height: 48px;
    display: grid;
    grid-template-columns: minmax(270px, 340px) minmax(420px, 1fr) minmax(300px, 360px);
    align-items: center;
    border-bottom: 1px solid #c9cfd9;
    background: #f8fafc;
}

.template-tabs-left,
.template-tabs-right,
.template-bottom-tabs {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 10px;
}

.template-tabs-left button,
.template-tabs-right button,
.template-bottom-tabs button {
    min-height: 32px;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 0 10px;
    background: transparent;
    color: #344054;
    font-weight: 700;
}

.template-tabs-left button.active,
.template-tabs-right button.active,
.template-bottom-tabs button.active {
    border-color: #cfd6e3;
    background: #fff;
    color: #155eef;
}

.template-toolbar-center {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.template-tool-group {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #d7dde8;
    border-radius: 7px;
    padding: 3px;
    background: #fff;
}

.template-tool-group button,
.template-tool-group select {
    min-height: 28px;
    border: 0;
    border-radius: 5px;
    padding: 0 8px;
    background: transparent;
    color: #344054;
    font-weight: 700;
}

.template-tool-group button.active {
    background: #eff4ff;
    color: #155eef;
}

.template-toggle {
    width: 38px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #d0d5dd;
    padding: 2px;
}

.template-toggle::after {
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgb(16 24 40 / 20%);
}

.template-toggle.on {
    justify-content: flex-end;
    background: #155eef;
}

.template-designer-workspace {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(270px, 340px) minmax(520px, 1fr) minmax(300px, 360px);
    overflow: hidden;
}

.template-left-panel,
.template-right-panel {
    min-width: 0;
    overflow: auto;
    border-color: #c9cfd9;
    background: #f7f8fa;
}

.template-left-panel {
    border-right: 1px solid #c9cfd9;
    padding: 12px;
}

.template-right-panel {
    border-left: 1px solid #c9cfd9;
    padding: 12px;
}

.template-panel-title,
.template-inspector-title {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #101828;
    font-weight: 800;
}

.template-inspector-title button {
    width: 28px;
    height: 28px;
    border: 1px solid #d0d5dd;
    border-radius: 6px;
    background: #fff;
}

.template-search {
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 8px 0 10px;
    border: 1px solid #cfd6e3;
    border-radius: 6px;
    padding: 0 9px;
    background: #fff;
    color: #667085;
}

.template-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
}

.template-archive-toggle {
    min-height: 30px;
    display: flex;
    align-items: center;
    gap: 7px;
    margin: -4px 0 10px;
    color: #475467;
    font-size: 12px;
    font-weight: 800;
}

.template-archive-toggle input {
    width: 15px;
    height: 15px;
    accent-color: #155eef;
}

.template-list {
    display: grid;
    gap: 6px;
    margin-bottom: 12px;
}

.template-row {
    min-height: 72px;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 3px 8px;
    border: 1px solid #d0d5dd;
    border-radius: 7px;
    padding: 8px;
    background: #fff;
    text-align: left;
}

.template-row strong {
    min-width: 0;
    overflow: hidden;
    color: #101828;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-row span {
    color: #667085;
    font-size: 12px;
}

.template-row mark {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    border-radius: 999px;
    padding: 3px 7px;
    background: #ecfdf3;
    color: #027a48;
    font-size: 11px;
    font-weight: 800;
}

.template-row mark.archived {
    background: #f2f4f7;
    color: #667085;
}

.template-row mark.published {
    background: #eff4ff;
    color: #155eef;
}

.template-row.active {
    border-color: #155eef;
    box-shadow: 0 0 0 2px rgb(21 94 239 / 12%);
}

.template-category {
    margin-top: 10px;
    border: 1px solid #d0d5dd;
    border-radius: 7px;
    background: #fff;
}

.template-category-head {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px;
    border-bottom: 1px solid #eaecf0;
    color: #344054;
    font-weight: 800;
}

.template-element-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 8px;
}

.template-element-grid button {
    min-height: 58px;
    display: grid;
    place-items: center;
    gap: 3px;
    border: 1px dashed #cfd6e3;
    border-radius: 6px;
    background: #fbfcfe;
    color: #344054;
    font-weight: 700;
}

.template-element-grid button:not(:disabled) {
    border-style: solid;
    border-color: #84adff;
    background: #eff4ff;
    color: #1849a9;
    cursor: pointer;
}

.template-element-grid button:not(:disabled):hover {
    background: #d1e0ff;
}

.template-element-grid button span:last-child {
    font-size: 12px;
}

.template-asset-panel {
    background: #f9fafb;
}

.template-asset-upload {
    display: grid;
    gap: 7px;
    padding: 8px;
}

.template-asset-upload label,
.template-asset-archive-reason,
.template-canvas-asset-select {
    display: grid;
    gap: 4px;
    color: #475467;
    font-size: 11px;
    font-weight: 800;
}

.template-asset-upload input[type="text"],
.template-asset-archive-reason input,
.template-canvas-asset-select select {
    min-height: 30px;
    width: 100%;
    min-width: 0;
    border: 1px solid #cfd6e3;
    border-radius: 6px;
    background: #fff;
    padding: 5px 8px;
    color: #1f2937;
    font-size: 12px;
}

.template-asset-upload input[type="file"] {
    width: 100%;
    min-width: 0;
    color: #344054;
    font-size: 11px;
    font-weight: 700;
}

.template-asset-list {
    display: grid;
    gap: 6px;
    padding: 0 8px 8px;
}

.template-asset-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    border: 1px solid #d0d5dd;
    border-radius: 6px;
    background: #fff;
    padding: 7px;
}

.template-asset-row > .material-symbols-outlined {
    color: #155eef;
}

.template-asset-row div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.template-asset-row strong,
.template-asset-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-asset-row strong {
    color: #101828;
    font-size: 12px;
    font-weight: 900;
}

.template-asset-row small,
.template-canvas-asset-select small {
    color: #667085;
    font-size: 10px;
    font-weight: 800;
}

.template-asset-empty {
    margin: 0 8px 8px;
    border: 1px dashed #d0d5dd;
    border-radius: 6px;
    padding: 9px;
    background: #fff;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
    text-align: center;
}

.template-asset-archive-reason {
    padding: 0 8px 8px;
}

.template-tip {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 7px;
    margin-top: 10px;
    border: 1px solid #fedf89;
    border-radius: 7px;
    padding: 9px;
    background: #fffaeb;
    color: #7a2e0e;
    font-size: 12px;
}

.template-canvas-shell {
    min-width: 0;
    min-height: 0;
    position: relative;
    overflow: auto;
    background: #d9dee7;
}

.pdf-preview-status {
    position: sticky;
    top: 10px;
    left: 12px;
    z-index: 2;
    width: fit-content;
    margin: 10px;
    border: 1px solid #b7c3d8;
    border-radius: 999px;
    padding: 5px 10px;
    background: rgb(255 255 255 / 92%);
    color: #344054;
    font-size: 12px;
    font-weight: 800;
}

.template-canvas-stage {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 18px 24px 34px;
}

.template-page-wrap {
    position: relative;
    padding: 34px 0 0 34px;
    width: var(--template-canvas-wrap-width, 454px);
    height: var(--template-canvas-wrap-height, 628px);
}

.template-page-control-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    margin-top: 8px;
    padding: 3px 6px;
    border: 1px solid #b7c3d8;
    border-radius: 4px;
    background: rgb(255 255 255 / 92%);
    box-shadow: 0 6px 16px rgb(16 24 40 / 12%);
    color: #344054;
    font-size: 11px;
    font-weight: 800;
}

.template-page-control-bar button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 26px;
    height: 24px;
    border: 1px solid #b7c3d8;
    border-radius: 4px;
    background: #f8fafc;
    color: #344054;
    font: inherit;
    cursor: pointer;
}

.template-page-control-bar button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.template-page-control-bar .material-symbols-outlined {
    font-size: 16px;
}

.template-page-scale {
    position: relative;
    transform-origin: top left;
}

.template-ruler-x,
.template-ruler-y {
    position: absolute;
    display: flex;
    color: #667085;
    font-size: 10px;
    font-weight: 700;
}

.template-ruler-x {
    top: -26px;
    left: 0;
    width: 420px;
    justify-content: space-between;
    border-bottom: 1px solid #98a2b3;
    padding-bottom: 4px;
}

.template-ruler-y {
    top: 0;
    left: -30px;
    height: 594px;
    flex-direction: column;
    justify-content: space-between;
    border-right: 1px solid #98a2b3;
    padding-right: 5px;
}

.template-page {
    width: 420px;
    height: 594px;
    position: relative;
    overflow: hidden;
    border: 1px solid #c7ccd7;
    background: #fff;
    box-shadow: 0 10px 30px rgb(16 24 40 / 22%);
}

.template-page.show-grid {
    background-image:
        linear-gradient(rgb(21 94 239 / 7%) 1px, transparent 1px),
        linear-gradient(90deg, rgb(21 94 239 / 7%) 1px, transparent 1px);
    background-size: 10px 10px;
}

.template-margin-guide {
    position: absolute;
    inset: 30px;
    border: 1px dashed #98a2b3;
    pointer-events: none;
}

.template-margin-label {
    position: absolute;
    border-radius: 999px;
    padding: 3px 7px;
    background: #f2f4f7;
    color: #667085;
    font-size: 10px;
    font-weight: 700;
}

.template-margin-label.top {
    top: 8px;
    left: 132px;
}

.template-margin-label.left {
    top: 270px;
    left: -48px;
    transform: rotate(-90deg);
}

.template-margin-label.right {
    top: 270px;
    right: -52px;
    transform: rotate(90deg);
}

.template-margin-label.bottom {
    left: 126px;
    bottom: 8px;
}

.template-page-content {
    position: absolute;
    inset: 54px 44px;
    display: grid;
    grid-template-rows: auto 22px 14px 1fr auto;
    gap: 14px;
    color: #111827;
}

.template-canvas-elements {
    position: absolute;
    inset: 0;
}

.template-canvas-element {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    border: 1px solid #84adff;
    border-radius: 4px;
    padding: 3px 6px;
    background: rgb(219 234 254 / 70%);
    color: #111827;
    font-size: 11px;
    font-weight: 800;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-shadow: 0 0 0 1px rgb(21 94 239 / 8%);
    cursor: pointer;
    touch-action: none;
    user-select: none;
}

.template-canvas-element:disabled {
    opacity: 1;
}

.template-canvas-element.selected {
    border-color: #155eef;
    background: #eff4ff;
    box-shadow: 0 0 0 2px rgb(21 94 239 / 18%), 0 8px 18px rgb(16 24 40 / 12%);
}

.template-canvas-element.multi-selected:not(.selected) {
    border-color: #12b76a;
    background: #ecfdf3;
    box-shadow: 0 0 0 2px rgb(18 183 106 / 14%);
}

.template-canvas-element.selected.multi-selected {
    outline: 2px solid rgb(18 183 106 / 32%);
    outline-offset: 2px;
}

.template-canvas-element.dragging {
    cursor: grabbing;
    box-shadow: 0 0 0 2px rgb(21 94 239 / 24%), 0 12px 24px rgb(16 24 40 / 16%);
}

.template-canvas-element.locked {
    border-style: dashed;
    background: rgb(248 250 252 / 82%);
}

.template-canvas-element.not-visible {
    opacity: .56;
}

.template-canvas-element-label {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.template-canvas-element.table {
    align-items: stretch;
    padding: 0;
    border-color: #98a2b3;
    background: #fff;
    color: #344054;
}

.template-canvas-table-grid {
    width: 100%;
    height: 100%;
    display: grid;
    align-content: start;
    overflow: hidden;
    font-size: 9px;
    font-weight: 700;
    line-height: 1.15;
}

.template-canvas-table-head,
.template-canvas-table-cell {
    min-height: 13px;
    overflow: hidden;
    border-right: 1px solid #d0d5dd;
    border-bottom: 1px solid #d0d5dd;
    padding: 2px 3px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-canvas-table-head {
    background: #f2f4f7;
    color: #344054;
    font-weight: 900;
}

.template-canvas-table-cell {
    background: #fff;
    color: #475467;
}

.template-canvas-table-editor {
    display: grid;
    gap: 8px;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    padding: 8px;
    background: #fcfcfd;
}

.template-canvas-table-editor-head,
.template-canvas-table-editor-toolbar,
.template-canvas-table-checks {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.template-canvas-table-editor-head div {
    display: grid;
    gap: 2px;
}

.template-canvas-table-editor-head span,
.template-canvas-table-editor-head small {
    color: #667085;
    font-size: 11px;
    font-weight: 700;
}

.template-canvas-table-editor-toolbar {
    justify-content: flex-start;
}

.template-canvas-table-editor-grid {
    display: grid;
    gap: 4px;
    align-items: stretch;
    overflow-x: auto;
}

.template-canvas-table-editor-column,
.template-canvas-table-editor-cell {
    display: grid;
    min-width: 94px;
    gap: 3px;
    border: 1px solid #e4e7ec;
    border-radius: 3px;
    padding: 4px;
    background: #fff;
}

.template-canvas-table-editor-column {
    background: #f2f4f7;
}

.template-canvas-table-editor-column span,
.template-canvas-table-editor-cell span {
    color: #667085;
    font-size: 10px;
    font-weight: 800;
}

.template-canvas-table-editor-column input,
.template-canvas-table-editor-cell input {
    min-width: 0;
    height: 24px;
    border: 1px solid #d0d5dd;
    border-radius: 3px;
    padding: 2px 5px;
    color: #101828;
    font-size: 11px;
    font-weight: 700;
}

.template-canvas-table-row-remove {
    align-self: center;
}

.template-canvas-table-checks span {
    border-radius: 999px;
    padding: 3px 7px;
    background: #f2f4f7;
    color: #667085;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.template-canvas-table-checks .ready {
    background: #ecfdf3;
    color: #027a48;
}

.template-canvas-table-checks .blocked {
    background: #fff6ed;
    color: #b54708;
}

.template-canvas-table-binding-readiness {
    display: grid;
    gap: 7px;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    padding: 8px;
    background: #f9fafb;
}

.template-canvas-table-binding-head,
.template-canvas-table-binding-sources,
.template-canvas-table-binding-checks,
.template-canvas-table-binding-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.template-canvas-table-binding-head {
    justify-content: space-between;
}

.template-canvas-table-binding-head div {
    display: grid;
    gap: 2px;
}

.template-canvas-table-binding-head span,
.template-canvas-table-binding-blocker,
.template-canvas-table-binding-actions {
    color: #667085;
    font-size: 11px;
    font-weight: 700;
}

.template-canvas-table-binding-sources span,
.template-canvas-table-binding-checks span {
    border-radius: 999px;
    padding: 3px 7px;
    background: #f2f4f7;
    color: #667085;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.template-canvas-table-binding-sources .ready,
.template-canvas-table-binding-checks .ready {
    background: #ecfdf3;
    color: #027a48;
}

.template-canvas-table-binding-sources .warning,
.template-canvas-table-binding-checks .warning {
    background: #fffaeb;
    color: #b54708;
}

.template-canvas-table-binding-sources .blocked,
.template-canvas-table-binding-checks .blocked {
    background: #fff6ed;
    color: #b54708;
}

.template-canvas-table-binding-actions {
    padding-top: 2px;
}

.template-canvas-table-binding-actions .material-symbols-outlined {
    font-size: 16px;
}

.template-canvas-table-binding-action-chip {
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 2px 6px;
    background: #fff;
    color: #344054;
    font-size: 10px;
    font-weight: 900;
}

.template-canvas-table-binding-mapping {
    display: grid;
    gap: 7px;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    padding: 8px;
    background: #fff;
}

.template-canvas-table-binding-project-preview {
    display: grid;
    gap: 7px;
    border: 1px solid #b7c4d6;
    border-radius: 4px;
    padding: 8px;
    background: #f8fbff;
}

.template-canvas-table-binding-project-preview .template-canvas-table-binding-actions {
    align-items: center;
    justify-content: space-between;
}

.template-canvas-table-binding-project-preview .template-canvas-table-binding-actions > span:not(.material-symbols-outlined) {
    max-width: 180px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-align: right;
}

.template-canvas-table-binding-render-readiness {
    display: grid;
    gap: 7px;
    border: 1px solid #afd4cf;
    border-radius: 4px;
    padding: 8px;
    background: #f6fbfa;
}

.template-canvas-table-binding-render-readiness .template-canvas-table-binding-actions {
    align-items: center;
    justify-content: space-between;
}

.template-canvas-table-binding-render-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined) {
    max-width: 180px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-align: right;
}

.template-canvas-table-binding-artifact-preflight {
    display: grid;
    gap: 7px;
    border: 1px solid #c7b5d8;
    border-radius: 4px;
    padding: 8px;
    background: #fbf8ff;
}

.template-canvas-table-binding-artifact-preflight .template-canvas-table-binding-actions {
    align-items: center;
    justify-content: space-between;
}

.template-canvas-table-binding-artifact-preflight .template-canvas-table-binding-actions > span:not(.material-symbols-outlined) {
    max-width: 180px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-align: right;
}

.template-canvas-table-binding-artifact-staging-readiness {
    display: grid;
    gap: 7px;
    border: 1px solid #b8c7ad;
    border-radius: 4px;
    padding: 8px;
    background: #f8fbf5;
}

.template-canvas-table-binding-artifact-staging-readiness .template-canvas-table-binding-actions {
    align-items: center;
    justify-content: space-between;
}

.template-canvas-table-binding-artifact-staging-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined) {
    max-width: 180px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-align: right;
}

.template-canvas-table-binding-artifact-renderer-adapter-readiness {
    display: grid;
    gap: 7px;
    border: 1px solid #b6c3d1;
    border-radius: 4px;
    padding: 8px;
    background: #f7faff;
}

.template-canvas-table-binding-artifact-renderer-adapter-readiness .template-canvas-table-binding-actions {
    align-items: center;
    justify-content: space-between;
}

.template-canvas-table-binding-artifact-renderer-adapter-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined) {
    max-width: 180px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-align: right;
}

.template-canvas-table-binding-artifact-render-bytes-readiness,
.template-canvas-table-binding-artifact-render-bytes-transient,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging-security-status,
.template-canvas-table-binding-artifact-render-bytes-filestore-operations-health-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-scheduler-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-source-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-rescan-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-quarantine-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize {
    display: grid;
    gap: 7px;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    padding: 8px;
    background: #f9fafb;
}

.template-canvas-table-binding-artifact-render-bytes-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-transient .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging-security-status .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-operations-health-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-scheduler-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-source-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-rescan-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-quarantine-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize-readiness .template-canvas-table-binding-actions,
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize .template-canvas-table-binding-actions {
    align-items: center;
    justify-content: space-between;
}

.template-canvas-table-binding-artifact-render-bytes-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-transient .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-staging-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-staging .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-staging-security-status .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-operations-health-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-scheduler-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-source-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-rescan-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-quarantine-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize-readiness .template-canvas-table-binding-actions > span:not(.material-symbols-outlined),
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize .template-canvas-table-binding-actions > span:not(.material-symbols-outlined) {
    max-width: 180px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-align: right;
}

.template-canvas-table-binding-source-select {
    display: grid;
    gap: 3px;
    color: #667085;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.template-canvas-table-binding-source-select select {
    height: 28px;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    background: #fff;
    color: #101828;
    font-size: 12px;
    font-weight: 800;
    text-transform: none;
}

.template-canvas-table-binding-mapping-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
    gap: 5px;
}

.template-canvas-table-binding-mapping-columns > span {
    display: grid;
    gap: 2px;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    padding: 5px 6px;
    background: #f9fafb;
}

.template-canvas-table-binding-mapping-columns b {
    color: #101828;
    font-size: 11px;
    font-weight: 900;
}

.template-canvas-table-binding-mapping-columns span span {
    color: #667085;
    font-size: 10px;
    font-weight: 800;
}

.template-canvas-table-binding-preview-table {
    display: grid;
    gap: 2px;
    overflow-x: auto;
}

.template-canvas-table-binding-preview-row {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(76px, 1fr);
    min-width: max-content;
    border-bottom: 1px solid #eaecf0;
}

button.template-canvas-table-binding-preview-row {
    width: 100%;
    padding: 0;
    border-top: 0;
    border-right: 0;
    border-left: 0;
    background: #ffffff;
    text-align: left;
    cursor: pointer;
}

button.template-canvas-table-binding-preview-row:hover,
button.template-canvas-table-binding-preview-row:focus-visible,
.template-canvas-table-binding-preview-row.selected {
    background: #f2f7fd;
}

button.template-canvas-table-binding-preview-row:disabled {
    cursor: default;
    opacity: 0.72;
}

.template-canvas-table-binding-preview-row.header {
    border-bottom-color: #d0d5dd;
    background: #f9fafb;
}

.template-canvas-table-binding-preview-row span {
    min-height: 24px;
    padding: 4px 6px;
    color: #344054;
    font-size: 11px;
    font-weight: 700;
}

.template-canvas-table-binding-preview-row.header span {
    color: #667085;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.template-canvas-resize {
    width: 10px;
    height: 10px;
    display: none;
    position: absolute;
    right: 2px;
    bottom: 2px;
    border: 1px solid #155eef;
    border-radius: 2px;
    background: #fff;
    cursor: nwse-resize;
}

.template-canvas-element.selected:not(.locked) .template-canvas-resize {
    display: block;
}

.template-canvas-drag-status {
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 4;
    border: 1px solid #b2ccff;
    border-radius: 999px;
    padding: 5px 9px;
    background: rgb(239 244 255 / 94%);
    color: #344054;
    font-size: 11px;
    font-weight: 800;
}

.template-canvas-inspector {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    border: 1px solid #b2ccff;
    border-radius: 7px;
    padding: 9px;
    background: #eff4ff;
    color: #344054;
    font-size: 12px;
}

.template-canvas-multi-select-summary {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    border: 1px solid #abefc6;
    border-radius: 7px;
    padding: 9px;
    background: #ecfdf3;
    color: #027a48;
    font-size: 12px;
}

.template-canvas-multi-select-summary > div:first-child {
    display: grid;
    gap: 3px;
}

.template-canvas-multi-select-summary strong {
    color: #074d31;
}

.template-canvas-multi-select-summary .template-btn {
    justify-content: center;
    border-color: #75e0a7;
    background: #fff;
    color: #075e45;
}

.template-canvas-multi-select-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.template-canvas-multi-select-list span {
    max-width: 100%;
    overflow: hidden;
    border: 1px solid #75e0a7;
    border-radius: 999px;
    padding: 2px 7px;
    background: #fff;
    color: #075e45;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-canvas-inspector > div:first-child {
    display: grid;
    gap: 3px;
}

.template-canvas-inspector strong {
    color: #101828;
}

.template-canvas-inspector label {
    display: grid;
    gap: 4px;
    color: #475467;
    font-weight: 800;
}

.template-canvas-inspector input[type="text"],
.template-canvas-inspector input[type="number"],
.template-canvas-inspector textarea {
    min-height: 30px;
    width: 100%;
    min-width: 0;
    border: 1px solid #cfd6e3;
    border-radius: 6px;
    background: #fff;
    padding: 5px 8px;
    color: #1f2937;
    font-size: 12px;
}

.template-canvas-inspector textarea {
    min-height: 66px;
    resize: vertical;
}

.template-canvas-element.image-placeholder {
    border-style: dashed;
    background: repeating-linear-gradient(
        -45deg,
        #f8fbff,
        #f8fbff 8px,
        #edf4ff 8px,
        #edf4ff 16px
    );
}

.template-canvas-asset-select {
    border: 1px solid #b2ccff;
    border-radius: 6px;
    padding: 7px;
    background: #f8fbff;
}

.template-canvas-geometry {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.template-canvas-flags {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.template-canvas-flags label {
    min-height: 30px;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #d0d5dd;
    border-radius: 6px;
    padding: 0 7px;
    background: #fff;
}

.template-canvas-flags input {
    width: 14px;
    height: 14px;
    accent-color: #155eef;
}

.template-canvas-update-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.template-canvas-update-checks span {
    width: fit-content;
    max-width: 100%;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 4px 7px;
    background: #fff;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.template-canvas-update-checks span.ready {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #027a48;
}

.template-canvas-update-checks span.blocked {
    border-color: #fedf89;
    background: #fffaeb;
    color: #93370d;
}

.template-canvas-element-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.template-canvas-element-actions .template-btn {
    min-height: 32px;
    padding-inline: 8px;
}

.template-canvas-state {
    display: grid;
    place-items: center;
    min-height: 120px;
    border: 1px dashed #b2ccff;
    border-radius: 7px;
    background: #f5f8ff;
    color: #1849a9;
    text-align: center;
    font-size: 12px;
}

.template-canvas-state.error {
    border-color: #fecdca;
    background: #fffbfa;
    color: #b42318;
}

.template-page-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
}

.template-page-header span {
    color: #155eef;
    font-size: 12px;
    font-weight: 900;
}

.template-page-header strong {
    max-width: 190px;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-page-placeholder {
    width: 72%;
    border-radius: 5px;
    background: #e4e7ec;
}

.template-page-placeholder.wide {
    width: 100%;
}

.template-position-zone {
    display: grid;
    place-items: center;
    border: 1px dashed #98a2b3;
    border-radius: 7px;
    background: #f8fafc;
    text-align: center;
}

.template-position-zone span {
    color: #344054;
    font-weight: 800;
}

.template-position-zone p {
    max-width: 240px;
    margin: 4px 0 0;
    color: #667085;
    font-size: 12px;
}

.template-page-footer {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #e4e7ec;
    padding-top: 8px;
    color: #667085;
    font-size: 11px;
}

.template-preview-loading {
    position: absolute;
    inset: 70px 40px;
    z-index: 3;
    min-height: 220px;
    border: 1px solid #b2ccff;
    border-radius: 8px;
    background: rgb(255 255 255 / 92%);
}

.template-preview-html {
    position: absolute;
    inset: 44px 36px;
    display: grid;
    align-content: start;
    gap: 12px;
    overflow: auto;
    padding-right: 4px;
}

.document-template-preview-fragment {
    min-height: 100%;
    display: grid;
    grid-template-rows: auto auto auto auto auto;
    gap: 14px;
    color: #111827;
}

.document-template-preview-page-fragment {
    min-height: 250px;
    padding: 10px;
    border: 1px solid #d0d5dd;
    border-radius: 6px;
    background: #fff;
}

.document-template-preview-fragment header {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #e4e7ec;
    padding-bottom: 10px;
}

.document-template-preview-fragment header span {
    color: #155eef;
    font-size: 12px;
    font-weight: 900;
}

.document-template-preview-fragment header strong {
    max-width: 210px;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-preview-fragment header em {
    color: #667085;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.document-template-preview-fragment dl {
    display: grid;
    align-content: start;
    gap: 8px;
    margin: 0;
}

.document-template-preview-fragment dl div {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 10px;
    border-bottom: 1px solid #eef2f6;
    padding-bottom: 6px;
}

.document-template-preview-fragment dt {
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.document-template-preview-fragment dd {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: #1f2937;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-preview-page-elements {
    display: grid;
    gap: 6px;
    min-height: 42px;
    border: 1px solid #e4e7ec;
    border-radius: 6px;
    padding: 8px;
    background: #f9fafb;
}

.document-template-preview-page-elements > strong {
    color: #344054;
    font-size: 11px;
    font-weight: 900;
}

.document-template-preview-page-elements > span {
    color: #667085;
    font-size: 11px;
}

.document-template-preview-page-elements ul {
    display: grid;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.document-template-preview-page-elements li {
    display: grid;
    grid-template-columns: 72px minmax(0, .9fr) minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    min-height: 22px;
    border-top: 1px solid #eef2f6;
    padding-top: 4px;
    font-size: 11px;
}

.document-template-preview-page-elements li span,
.document-template-preview-page-elements li small {
    overflow: hidden;
    color: #667085;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-preview-page-elements li strong {
    overflow: hidden;
    color: #1f2937;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-preview-page-elements .document-template-preview-table-item {
    grid-template-columns: 72px minmax(0, .7fr) minmax(220px, 1.4fr);
    align-items: start;
}

.document-template-preview-canvas-table {
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    background: #fff;
    color: #344054;
    font-size: 10px;
}

.document-template-preview-canvas-table th,
.document-template-preview-canvas-table td {
    border-right: 1px solid #e4e7ec;
    border-bottom: 1px solid #e4e7ec;
    padding: 4px 5px;
    text-align: left;
    vertical-align: top;
}

.document-template-preview-canvas-table th {
    background: #f2f4f7;
    color: #344054;
    font-weight: 900;
}

.document-template-preview-canvas-table td {
    color: #475467;
}

.document-template-preview-position-zone {
    display: grid;
    place-items: center;
    gap: 4px;
    min-height: 92px;
    border: 1px solid #98a2b3;
    border-radius: 7px;
    background: #f8fafc;
}

.document-template-preview-position-zone strong {
    color: #344054;
}

.document-template-preview-position-zone span {
    color: #667085;
    font-size: 12px;
}

.document-template-preview-fragment footer {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #e4e7ec;
    padding-top: 8px;
    color: #667085;
    font-size: 11px;
}

.template-state {
    min-height: 240px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    padding: 24px;
    color: #667085;
    text-align: center;
}

.template-state.compact {
    min-height: auto;
    border: 1px solid #d0d5dd;
    border-radius: 7px;
    padding: 14px;
    background: #fff;
}

.template-state.error {
    border-color: #fecdca;
    background: #fffbfa;
    color: #b42318;
}

.template-state .material-symbols-outlined {
    color: #155eef;
    font-size: 28px;
}

.template-state strong {
    color: #101828;
}

.template-state p {
    max-width: 360px;
    margin: 0;
}

.template-state button {
    min-height: 34px;
    border: 1px solid #cfd6e3;
    border-radius: 6px;
    padding: 0 10px;
    background: #fff;
    color: #1f2937;
    font-weight: 800;
}

.template-state button.primary {
    border-color: #155eef;
    background: #155eef;
    color: #fff;
}

.template-preview-summary {
    display: grid;
    gap: 5px;
    margin-top: 10px;
    border: 1px solid #b2ccff;
    border-radius: 7px;
    padding: 9px;
    background: #eff4ff;
    color: #344054;
    font-size: 12px;
}

.template-preview-summary strong {
    color: #155eef;
}

.template-preview-summary small {
    color: #667085;
}

.template-preview-summary .template-preview-error {
    color: #b91c1c;
}

.template-publish-panel {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    border: 1px solid #fedf89;
    border-radius: 7px;
    padding: 9px;
    background: #fffaeb;
    color: #7a2e0e;
    font-size: 12px;
}

.template-publish-panel.published {
    border-color: #b2ccff;
    background: #eff4ff;
    color: #155eef;
}

.template-publish-panel > div:first-child {
    display: grid;
    gap: 3px;
}

.template-publish-panel strong {
    color: #101828;
}

.template-publish-panel label {
    display: grid;
    gap: 4px;
    color: #475467;
    font-weight: 800;
}

.template-publish-panel textarea {
    min-height: 68px;
    resize: vertical;
    border: 1px solid #cfd6e3;
    border-radius: 6px;
    background: #fff;
    padding: 8px;
    color: #1f2937;
}

.template-publish-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.template-publish-checks span,
.template-publish-panel small {
    width: fit-content;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 4px 7px;
    background: #fff;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.template-publish-checks span.ready {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #027a48;
}

.template-publish-checks span.blocked {
    border-color: #fedf89;
    background: #fffaeb;
    color: #93370d;
}

.template-publish-readiness {
    display: grid;
    gap: 6px;
    border-top: 1px solid rgba(122, 46, 14, 0.16);
    padding-top: 7px;
}

.template-publish-readiness > div:first-child {
    display: grid;
    gap: 2px;
}

.template-publish-readiness-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.template-publish-readiness-checks span {
    width: fit-content;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 4px 7px;
    background: #fff;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.template-publish-readiness-checks span.ready {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #027a48;
}

.template-publish-readiness-checks span.warning {
    border-color: #fedf89;
    background: #fffaeb;
    color: #93370d;
}

.template-publish-readiness-checks span.blocked {
    border-color: #fecdca;
    background: #fef3f2;
    color: #b42318;
}

.template-archive-readonly {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    border: 1px solid #d0d5dd;
    border-radius: 7px;
    padding: 9px;
    background: #f2f4f7;
    color: #475467;
    font-size: 12px;
}

.template-archive-readonly strong {
    color: #101828;
}

.template-archive-readonly small {
    width: fit-content;
    max-width: 100%;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 4px 7px;
    background: #fff;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.template-preview-table span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-designer-bottom {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(270px, 340px) minmax(520px, 1fr) minmax(300px, 360px);
    border-top: 1px solid #c9cfd9;
    background: #fff;
}

.template-bottom-left,
.template-bottom-right {
    min-width: 0;
    overflow: auto;
    background: #f7f8fa;
}

.template-bottom-left {
    border-right: 1px solid #c9cfd9;
}

.template-bottom-right {
    display: grid;
    align-content: start;
    gap: 8px;
    border-left: 1px solid #c9cfd9;
    padding: 12px;
    color: #475467;
}

.template-bottom-right strong {
    color: #101828;
}

.template-bottom-right span {
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 5px 8px;
    background: #fff;
    font-size: 12px;
    font-weight: 800;
}

.template-bottom-content {
    display: grid;
    gap: 6px;
    padding: 12px;
}

.template-bottom-content span {
    color: #667085;
    font-size: 12px;
}

.template-layer-tree,
.template-layer-empty {
    display: grid;
    gap: 6px;
}

.template-layer-root,
.template-layer-empty {
    min-width: 0;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    border: 1px solid #d0d5dd;
    border-radius: 6px;
    padding: 7px 8px;
    background: #fff;
    color: #344054;
    font-size: 12px;
}

.template-layer-root strong,
.template-layer-empty strong {
    min-width: 0;
    overflow: hidden;
    color: #101828;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-layer-root .material-symbols-outlined {
    color: #155eef;
    font-size: 18px;
}

.template-layer-empty {
    grid-template-columns: minmax(0, 1fr);
}

.template-layer-empty small {
    color: #667085;
    font-size: 11px;
    font-weight: 800;
}

.template-layer-row {
    min-width: 0;
    min-height: 30px;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr) repeat(3, auto);
    align-items: center;
    gap: 7px;
    border: 1px solid #e4e7ec;
    border-radius: 5px;
    padding: 3px 6px;
    background: #fff;
    color: #344054;
    text-align: left;
}

.template-layer-row:hover,
.template-layer-row.active {
    border-color: #84adff;
    background: #eff4ff;
}

.template-layer-row.multi-selected:not(.active) {
    border-color: #abefc6;
    background: #ecfdf3;
}

.template-layer-row.dragging {
    border-color: #155eef;
    background: #dbeafe;
}

.template-layer-row.drop-target {
    border-color: #12b76a;
    background: #ecfdf3;
}

.template-layer-row.muted {
    color: #667085;
    opacity: .72;
}

.template-layer-drag-handle {
    width: 24px;
    min-width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d0d5dd;
    border-radius: 5px;
    padding: 0;
    background: #f8fafc;
    color: #667085;
    cursor: grab;
}

.template-layer-drag-handle:active {
    cursor: grabbing;
}

.template-layer-drag-handle:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.template-layer-drag-handle .material-symbols-outlined {
    font-size: 17px;
}

.template-layer-row-select {
    min-width: 0;
    min-height: 24px;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) 34px;
    align-items: center;
    gap: 7px;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.template-layer-row-select:disabled {
    cursor: not-allowed;
    opacity: .62;
}

.template-layer-row-select .material-symbols-outlined {
    color: #475467;
    font-size: 17px;
}

.template-layer-row-select span:nth-child(2) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-layer-row-select span:last-child {
    justify-self: end;
    color: #667085;
    font-size: 11px;
    font-weight: 900;
}

.template-layer-visibility-toggle,
.template-layer-lock-toggle,
.template-layer-printable-toggle {
    min-width: 86px;
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 0 7px;
    background: #fff;
    color: #344054;
    font: inherit;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
    cursor: pointer;
}

.template-layer-visibility-toggle .material-symbols-outlined,
.template-layer-lock-toggle .material-symbols-outlined,
.template-layer-printable-toggle .material-symbols-outlined {
    font-size: 16px;
}

.template-layer-visibility-toggle.on {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #027a48;
}

.template-layer-visibility-toggle.off {
    border-color: #fedf89;
    background: #fffaeb;
    color: #93370d;
}

.template-layer-lock-toggle.on {
    border-color: #fecdca;
    background: #fef3f2;
    color: #b42318;
}

.template-layer-lock-toggle.off {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #027a48;
}

.template-layer-printable-toggle.on {
    border-color: #b2ddff;
    background: #eff8ff;
    color: #175cd3;
}

.template-layer-printable-toggle.off {
    border-color: #d0d5dd;
    background: #f8fafc;
    color: #667085;
}

.template-layer-visibility-toggle.busy,
.template-layer-lock-toggle.busy,
.template-layer-printable-toggle.busy,
.template-layer-visibility-toggle:disabled,
.template-layer-lock-toggle:disabled,
.template-layer-printable-toggle:disabled {
    cursor: not-allowed;
    opacity: .62;
}

.template-bottom-main {
    min-width: 0;
    overflow: auto;
}

.template-schema-table {
    min-width: 760px;
    display: grid;
    grid-template-columns: 52px 160px 190px 1fr 150px;
    border-top: 1px solid #eaecf0;
    color: #344054;
    font-size: 12px;
}

.template-schema-table > * {
    min-height: 34px;
    display: flex;
    align-items: center;
    border-right: 1px solid #eaecf0;
    border-bottom: 1px solid #eaecf0;
    padding: 0 9px;
}

.template-schema-table > :nth-child(-n + 5) {
    background: #f8fafc;
    color: #667085;
    font-weight: 800;
}

.template-layer-table {
    min-width: 780px;
    display: grid;
    grid-template-columns: minmax(180px, 1.5fr) 110px 110px 82px 110px 110px;
    border-top: 1px solid #eaecf0;
    color: #344054;
    font-size: 12px;
}

.template-layer-table > span {
    min-height: 30px;
    display: flex;
    align-items: center;
    border-right: 1px solid #eaecf0;
    border-bottom: 1px solid #eaecf0;
    padding: 0 9px;
    background: #f8fafc;
    color: #667085;
    font-weight: 800;
}

.template-layer-table-row {
    display: contents;
    color: inherit;
    cursor: pointer;
}

.template-layer-table-row > span,
.template-layer-table-row > button {
    min-height: 32px;
    display: flex;
    align-items: center;
    min-width: 0;
    overflow: hidden;
    border-right: 1px solid #eaecf0;
    border-bottom: 1px solid #eaecf0;
    padding: 0 9px;
    background: #fff;
    color: inherit;
    font: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-layer-table-row > button {
    border-top: 0;
    border-left: 0;
    border-radius: 0;
    text-align: left;
}

.template-layer-table-row > button:disabled {
    cursor: not-allowed;
    opacity: .62;
}

.template-layer-table-select {
    cursor: pointer;
}

.template-layer-table-row > .template-layer-visibility-toggle,
.template-layer-table-row > .template-layer-lock-toggle,
.template-layer-table-row > .template-layer-printable-toggle {
    justify-content: flex-start;
    border-right: 1px solid #eaecf0;
    border-bottom: 1px solid #eaecf0;
    border-radius: 0;
    padding: 0 9px;
}

.template-layer-table-row:hover > span,
.template-layer-table-row:hover > button,
.template-layer-table-row.active > span,
.template-layer-table-row.active > button {
    background: #eff4ff;
}

.template-layer-table-row.multi-selected:not(.active) > span,
.template-layer-table-row.multi-selected:not(.active) > button {
    background: #ecfdf3;
}

.template-layer-table-row > .template-layer-visibility-toggle.on {
    background: #ecfdf3;
    color: #027a48;
}

.template-layer-table-row > .template-layer-visibility-toggle.off {
    background: #fffaeb;
    color: #93370d;
}

.template-layer-table-row > .template-layer-lock-toggle.on {
    background: #fef3f2;
    color: #b42318;
}

.template-layer-table-row > .template-layer-lock-toggle.off {
    background: #ecfdf3;
    color: #027a48;
}

.template-layer-table-row > .template-layer-printable-toggle.on {
    background: #eff8ff;
    color: #175cd3;
}

.template-layer-table-row > .template-layer-printable-toggle.off {
    background: #f8fafc;
    color: #667085;
}

.template-layer-status {
    width: fit-content;
    max-width: 100%;
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 0 7px;
    background: #fff;
    font-size: 11px;
    font-weight: 900;
}

.template-layer-status.on {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #027a48;
}

.template-layer-status.off {
    border-color: #fedf89;
    background: #fffaeb;
    color: #93370d;
}

.template-layer-table-empty {
    grid-column: 1 / -1;
    min-height: 44px;
    display: grid;
    place-items: center;
    border-bottom: 1px solid #eaecf0;
    color: #667085;
    font-size: 12px;
    font-weight: 800;
}

@media (max-width: 1360px) {
    .document-template-designer {
        min-width: 1060px;
    }

    .template-designer-toolbar,
    .template-designer-workspace,
    .template-designer-bottom {
        grid-template-columns: 280px minmax(470px, 1fr) 310px;
    }

    .template-btn {
        padding: 0 8px;
    }
}

/* Document template designer: visual parity with ERP-Hauptdummy/document-template-designer.html. */
.document-template-designer {
    --template-designer-left-w: 292px;
    --template-designer-right-w: 335px;
    --template-designer-topbar-h: 112px;
    --template-designer-toolbar-h: 44px;
    --template-designer-bottom-h: 168px;
    --template-designer-border: #d8dee9;
    --template-designer-surface: #ffffff;
    --template-designer-panel: #ffffff;
    --template-designer-grid-bg: #f5f7fb;
    --template-designer-primary: #0f63ff;
    --template-designer-muted: #64748b;
    width: 100%;
    height: calc(100vh - var(--dummy-topbar-height) - 24px);
    min-width: 1060px;
    min-height: 680px;
    display: grid;
    grid-template-rows: var(--template-designer-topbar-h) var(--template-designer-toolbar-h) minmax(0, 1fr) var(--template-designer-bottom-h);
    overflow: hidden;
    border: 1px solid var(--template-designer-border);
    background: var(--template-designer-grid-bg);
    color: #111827;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 13px;
}

.document-template-designer .material-symbols-outlined {
    font-size: 16px;
    line-height: 1;
}

.template-designer-topbar {
    height: var(--template-designer-topbar-h);
    min-height: var(--template-designer-topbar-h);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 18px;
    padding: 10px 22px 9px;
    border-bottom: 1px solid #e7ebf2;
    background: var(--template-designer-panel);
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
}

.template-designer-topbar-main {
    min-width: 0;
    display: grid;
    grid-template-rows: 17px 28px 34px;
    align-content: start;
    row-gap: 5px;
}

.template-designer-title-row {
    height: 28px;
    display: flex !important;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.template-document-control {
    min-height: 32px;
    display: inline-flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.template-designer-breadcrumb {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    color: var(--template-designer-muted);
    font-size: 12px;
    font-weight: 400;
    line-height: 17px;
    white-space: nowrap;
}

.template-designer-breadcrumb b {
    overflow: hidden;
    color: #111827;
    font-weight: 700;
    text-overflow: ellipsis;
}

.template-designer-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 8px;
    overflow: hidden;
    align-self: start;
    padding-top: 25px;
}

.template-btn,
.template-action-menu-panel button {
    min-height: 34px;
    height: 34px;
    gap: 7px;
    border: 1px solid var(--template-designer-border);
    border-radius: 8px;
    padding: 0 12px;
    background: var(--template-designer-surface);
    box-shadow: none;
    color: #1f2937;
    font-family: inherit;
    font-size: 13px;
    font-weight: 750;
    line-height: 17px;
}

.template-btn:hover:not(:disabled),
.template-action-menu-panel button:hover:not(:disabled) {
    background: #e9e8e7;
    box-shadow: none;
}

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

.template-btn.icon,
.template-icon-btn {
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    border-color: var(--template-designer-border);
    border-radius: 8px;
    padding: 0;
    background: transparent;
    color: var(--template-designer-muted);
}

.template-action-menu-panel {
    top: calc(100% + 3px);
    min-width: 150px;
    gap: 2px;
    border-color: var(--template-designer-border);
    border-radius: 2px;
    padding: 4px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .16);
}

.template-designer-toolbar,
.template-designer-workspace,
.template-designer-bottom {
    grid-template-columns: var(--template-designer-left-w) minmax(0, 1fr) var(--template-designer-right-w);
}

.template-designer-toolbar {
    height: var(--template-designer-toolbar-h);
    min-height: var(--template-designer-toolbar-h);
    border-bottom: 1px solid var(--template-designer-border);
    background: var(--template-designer-surface);
}

.template-tabs-left,
.template-tabs-right,
.template-bottom-tabs {
    height: 100%;
    gap: 0;
    padding: 0 14px;
    border-color: var(--template-designer-border);
}

.template-tabs-left {
    border-right: 1px solid var(--template-designer-border);
}

.template-tabs-right {
    border-left: 1px solid var(--template-designer-border);
}

.template-tabs-left button,
.template-tabs-right button,
.template-bottom-tabs button {
    height: 100%;
    min-height: 0;
    flex: 0 0 auto;
    border: 0;
    border-right: 1px solid var(--template-designer-border);
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 0 12px;
    background: transparent;
    color: #475569;
    font-family: inherit;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 17px;
    text-transform: none;
}

.template-tabs-left button.active,
.template-tabs-right button.active,
.template-bottom-tabs button.active {
    border-color: var(--template-designer-border);
    border-bottom-color: var(--template-designer-primary);
    background: var(--template-designer-surface);
    color: var(--template-designer-primary);
}

.template-toolbar-center {
    height: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    overflow: hidden;
    padding: 6px 14px;
}

.template-tool-group {
    min-height: 30px;
    height: 30px;
    gap: 7px;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
}

.template-tool-group button,
.template-tool-group select {
    min-height: 30px;
    height: 30px;
    border: 1px solid var(--template-designer-border);
    border-radius: 7px;
    padding: 0 9px;
    background: var(--template-designer-surface);
    color: #334155;
    font-size: 12px;
    font-weight: 750;
}

.template-tool-group select {
    max-width: none;
    min-width: 130px;
}

.template-tool-group button:hover:not(:disabled),
.template-tool-group button.active {
    background: #e9e8e7;
    color: #1a1c1c;
}

.template-toggle {
    width: 36px;
    height: 20px;
    border-radius: 999px;
    background: #c1c7d2;
}

.template-toggle.on {
    background: var(--template-designer-primary);
}

.template-designer-workspace {
    min-height: 0;
    overflow: hidden;
    background: var(--template-designer-grid-bg);
}

.template-left-panel,
.template-right-panel {
    min-height: 0;
    background: var(--template-designer-surface);
    border-color: var(--template-designer-border);
}

.template-left-panel {
    overflow-y: auto;
    border-right: 1px solid var(--template-designer-border);
    padding: 12px;
}

.template-right-panel {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    border-left: 1px solid var(--template-designer-border);
    padding: 0;
}

.template-panel-title {
    min-height: 24px;
    color: var(--template-designer-muted);
    font-family: inherit;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .04em;
    line-height: 16px;
    text-transform: uppercase;
}

.template-search {
    min-height: 24px;
    margin: 4px 0 8px;
    gap: 4px;
    border-color: var(--template-designer-border);
    border-radius: 0;
    padding: 0 6px;
    background: var(--template-designer-surface);
}

.template-search input {
    min-height: 22px;
    font-size: 11px;
}

.template-archive-toggle {
    min-height: 22px;
    margin: 0 0 8px;
    gap: 6px;
    color: var(--template-designer-muted);
    font-size: 11px;
    font-weight: 500;
}

.template-list {
    gap: 4px;
    margin-bottom: 12px;
}

.template-row {
    min-height: 36px;
    border-color: var(--template-designer-border);
    border-radius: 2px;
    padding: 5px 7px;
    background: var(--template-designer-surface);
}

.template-row strong,
.template-row span {
    font-size: 11px;
    font-weight: 500;
    line-height: 14px;
}

.template-row.active {
    border-color: var(--template-designer-primary);
    background: rgba(211, 228, 255, .22);
    box-shadow: none;
}

.template-category {
    margin: 0 0 12px;
    border-color: var(--template-designer-border);
    border-radius: 2px;
    background: var(--template-designer-surface);
}

.template-category-head {
    min-height: 28px;
    padding: 0 8px;
    border-bottom: 1px solid rgba(193, 199, 210, .72);
    color: var(--template-designer-muted);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .05em;
    line-height: 14px;
    text-transform: uppercase;
}

.template-element-grid {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px;
}

.template-element-grid button {
    min-height: 26px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    place-items: initial;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--template-designer-border);
    border-radius: 2px;
    padding: 4px 8px;
    background: var(--template-designer-surface);
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 400;
    text-align: left;
}

.template-element-grid button:not(:disabled) {
    border-color: var(--template-designer-border);
    background: var(--template-designer-surface);
    color: #1a1c1c;
}

.template-element-grid button:not(:disabled):hover {
    border-color: var(--template-designer-primary);
    background: rgba(211, 228, 255, .18);
}

.template-asset-panel {
    background: var(--template-designer-surface);
}

.template-asset-upload {
    gap: 4px;
    padding: 8px;
}

.template-asset-upload label,
.template-asset-archive-reason,
.template-canvas-asset-select {
    gap: 2px;
    color: var(--template-designer-muted);
    font-size: 10px;
    font-weight: 500;
}

.template-asset-upload input[type="text"],
.template-asset-archive-reason input,
.template-canvas-asset-select select,
.template-canvas-inspector input[type="text"],
.template-canvas-inspector input[type="number"],
.template-canvas-inspector textarea {
    min-height: 22px;
    border: 1px solid var(--template-designer-border);
    border-radius: 0;
    padding: 0 4px;
    background: var(--template-designer-surface);
    color: #1a1c1c;
    font-size: 11px;
    line-height: 14px;
    box-shadow: none;
}

.template-asset-upload input[type="file"] {
    font-size: 11px;
    font-weight: 400;
}

.template-asset-list {
    gap: 4px;
    padding: 0 8px 8px;
}

.template-asset-row {
    min-height: 26px;
    grid-template-columns: 18px minmax(0, 1fr) 24px;
    gap: 8px;
    border-color: var(--template-designer-border);
    border-radius: 2px;
    padding: 4px 6px;
    background: var(--template-designer-surface);
}

.template-asset-row > .material-symbols-outlined {
    color: var(--template-designer-primary);
}

.template-asset-row strong,
.template-asset-row small,
.template-canvas-asset-select small {
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
}

.template-asset-empty {
    margin: 0 8px 8px;
    border-color: var(--template-designer-border);
    border-radius: 2px;
    padding: 8px;
    background: #fff;
    color: #727782;
    font-size: 11px;
    font-weight: 500;
}

.template-canvas-shell {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--template-designer-grid-bg);
    background-size: 18.9px 18.9px;
    background-image:
        linear-gradient(to right, rgba(227, 226, 225, .72) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(227, 226, 225, .72) 1px, transparent 1px);
}

.template-canvas-stage {
    flex: 1 1 auto;
    min-height: 0;
    align-items: center;
    justify-content: flex-start;
    overflow: auto;
    padding: 32px 48px 56px;
    background: transparent;
}

.template-page-wrap {
    width: var(--template-canvas-wrap-width, 454px);
    height: var(--template-canvas-wrap-height, 628px);
    padding: 34px 0 0 34px;
}

.template-ruler-x,
.template-ruler-y {
    border-color: var(--template-designer-border);
    background-color: var(--template-designer-surface);
    color: transparent;
    opacity: .55;
}

.template-ruler-x {
    top: -16px;
    height: 16px;
    background-image: repeating-linear-gradient(to right, #727782 0, #727782 1px, transparent 1px, transparent 18.9px);
}

.template-ruler-y {
    left: -16px;
    width: 16px;
    background-image: repeating-linear-gradient(to bottom, #727782 0, #727782 1px, transparent 1px, transparent 18.9px);
}

.template-page {
    border-color: var(--template-designer-border);
    border-radius: 0;
    background-color: #fff;
    background-size: 18.9px 18.9px;
    background-image:
        linear-gradient(to right, #e3e2e1 1px, transparent 1px),
        linear-gradient(to bottom, #e3e2e1 1px, transparent 1px);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}

.template-page.show-grid {
    background-size: 18.9px 18.9px;
    background-image:
        linear-gradient(to right, #e3e2e1 1px, transparent 1px),
        linear-gradient(to bottom, #e3e2e1 1px, transparent 1px);
}

.template-margin-guide {
    border: 0;
}

.template-margin-label {
    display: none;
}

.template-canvas-element {
    overflow: visible;
    border: 1px solid var(--template-designer-border);
    border-radius: 0 !important;
    padding: 4px 6px;
    background: #fff;
    box-shadow: none;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 500;
}

.template-canvas-element:hover {
    border-color: rgba(0, 66, 119, .45);
    background: rgba(211, 228, 255, .12);
}

.template-canvas-element.selected {
    border: 2px solid var(--template-designer-primary) !important;
    background: rgba(211, 228, 255, .2) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
    z-index: 40 !important;
}

.template-canvas-element.selected::before {
    content: attr(data-element-id);
    position: absolute;
    right: -2px;
    top: -24px;
    max-width: 180px;
    height: 24px;
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 0 8px;
    border-radius: 2px 2px 0 0;
    background: var(--template-designer-primary);
    color: #fff;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-canvas-element.image-placeholder {
    justify-content: center;
    border: 1px solid var(--template-designer-primary);
    background: #fff;
    color: var(--template-designer-primary);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.template-canvas-element.asset-preview {
    padding: 0;
    background: #fff;
}

.template-canvas-element.qr-code,
.template-canvas-element.barcode {
    padding: 0;
    background: #fff;
}

.template-canvas-code-preview {
    position: absolute;
    inset: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #fff;
    pointer-events: none;
}

.template-canvas-code-preview > svg {
    width: 100%;
    height: 100%;
    display: block;
}

.template-canvas-code-preview.missing {
    border: 1px dashed var(--template-designer-border);
    color: var(--template-designer-muted);
}

.template-canvas-asset-preview {
    position: absolute;
    inset: 3px;
    display: block;
    border: 1px solid rgba(0, 90, 158, .18);
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    pointer-events: none;
}

.template-canvas-element.asset-preview:hover .template-canvas-asset-preview {
    border-color: rgba(0, 66, 119, .32);
}

.template-canvas-element.asset-preview.selected .template-canvas-asset-preview {
    inset: 2px;
    border-color: rgba(0, 66, 119, .24);
}

.template-canvas-element.asset-preview .template-canvas-resize {
    z-index: 3;
}

.template-canvas-element.asset-missing {
    border-style: dashed;
    border-color: #b94a48;
    color: #b94a48;
}

.template-canvas-element.asset-missing .template-canvas-element-label {
    color: #b94a48;
}

.template-canvas-asset-warning {
    position: absolute;
    left: 4px;
    right: 4px;
    bottom: 4px;
    min-height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 1px 4px;
    background: rgba(255, 255, 255, .92);
    color: #b94a48;
    font-size: 9px;
    font-weight: 700;
    line-height: 12px;
    text-transform: none;
    white-space: nowrap;
}

.template-page-control-bar {
    min-height: 24px;
    margin-top: 0;
    border-color: var(--template-designer-border);
    border-radius: 2px;
    padding: 0 4px;
    background: rgb(250 249 248 / 94%);
    box-shadow: none;
    color: var(--template-designer-muted);
    font-size: 10px;
}

.template-page-control-bar button {
    min-width: 22px;
    height: 22px;
    border-color: transparent;
    border-radius: 2px;
    background: transparent;
}

.template-inspector-title {
    position: sticky;
    top: 0;
    z-index: 6;
    flex: 0 0 auto;
    height: 32px;
    min-height: 32px;
    margin: 0;
    padding: 0 8px;
    border-bottom: 1px solid var(--template-designer-border);
    background: var(--template-designer-panel);
    color: #1a1c1c;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 14px;
    text-transform: uppercase;
}

.template-inspector-title button {
    width: 24px;
    height: 24px;
    border-color: transparent;
    border-radius: 2px;
    background: transparent;
}

.template-canvas-inspector,
.template-canvas-multi-select-summary {
    gap: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: var(--template-designer-surface);
    color: var(--template-designer-muted);
    font-size: 11px;
}

.template-canvas-inspector > div:first-child,
.template-canvas-multi-select-summary > div:first-child {
    min-height: 28px;
    padding: 6px 8px;
    border-bottom: 1px solid rgba(193, 199, 210, .55);
    background: #fff;
    color: var(--template-designer-primary);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .05em;
    line-height: 14px;
    text-transform: uppercase;
}

.template-canvas-inspector > label,
.template-canvas-geometry,
.template-canvas-asset-select,
.template-canvas-flags,
.template-canvas-update-checks,
.template-canvas-element-actions,
.template-canvas-table-editor,
.template-canvas-table-binding-readiness,
.template-canvas-table-binding-mapping,
.template-canvas-table-binding-project-preview,
.template-canvas-table-binding-render-readiness,
.template-canvas-table-binding-artifact-preflight,
.template-canvas-table-binding-artifact-staging-readiness,
.template-canvas-table-binding-artifact-renderer-adapter-readiness,
.template-canvas-table-binding-artifact-render-bytes-readiness,
.template-canvas-table-binding-artifact-render-bytes-transient,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-staging,
    .template-canvas-table-binding-artifact-render-bytes-filestore-staging-security-status,
    .template-canvas-table-binding-artifact-render-bytes-filestore-operations-health-readiness,
    .template-canvas-table-binding-artifact-render-bytes-filestore-scheduler-readiness,
    .template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-readiness,
    .template-canvas-table-binding-artifact-render-bytes-filestore-signature-update-source-readiness,
    .template-canvas-table-binding-artifact-render-bytes-filestore-rescan-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-quarantine-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize-readiness,
.template-canvas-table-binding-artifact-render-bytes-filestore-finalize {
    margin: 0;
    border: 0;
    border-bottom: 1px solid var(--template-designer-border);
    border-radius: 0;
    padding: 8px;
    background: var(--template-designer-surface);
}

.template-canvas-inspector label {
    color: var(--template-designer-muted);
    font-size: 10px;
    font-weight: 500;
}

.template-canvas-inspector textarea {
    min-height: 40px;
    padding: 4px;
    resize: none;
}

.template-canvas-geometry {
    gap: 6px;
}

.template-canvas-flags {
    grid-template-columns: 1fr;
    gap: 0;
}

.template-canvas-flags label {
    min-height: 22px;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
}

.template-canvas-update-checks span,
.template-canvas-table-checks span,
.template-canvas-table-binding-sources span,
.template-canvas-table-binding-checks span {
    border-radius: 2px;
    padding: 2px 5px;
    font-size: 10px;
}

.template-designer-bottom {
    min-height: 0;
    grid-template-columns: minmax(0, 1fr) !important;
    border-top: 1px solid var(--template-designer-border);
    background: var(--template-designer-surface);
}

.template-bottom-left,
.template-bottom-right {
    display: none !important;
}

.template-bottom-main {
    grid-column: 1;
    min-width: 0;
}

.document-template-designer.preview-active {
    grid-template-rows: var(--template-designer-topbar-h) var(--template-designer-toolbar-h) minmax(0, 1fr) 0;
}

.document-template-designer.preview-active .template-left-panel,
.document-template-designer.preview-active .template-right-panel,
.document-template-designer.preview-active .template-designer-bottom,
.document-template-designer.preview-active .template-tabs-left,
.document-template-designer.preview-active .template-tabs-right {
    display: none !important;
}

.document-template-designer.preview-active .template-designer-workspace {
    grid-template-columns: minmax(0, 1fr);
}

.document-template-designer.preview-active .template-toolbar-center {
    grid-column: 1 / -1;
}

.template-bottom-left,
.template-bottom-right,
.template-bottom-main {
    background: var(--template-designer-surface);
}

.template-bottom-left {
    border-right: 1px solid var(--template-designer-border);
}

.template-bottom-right {
    border-left: 1px solid var(--template-designer-border);
    padding: 8px;
}

.template-bottom-right span,
.template-layer-status {
    border-color: var(--template-designer-border);
    border-radius: 2px;
    padding: 3px 6px;
    background: #fff;
    font-size: 10px;
}

.template-bottom-content {
    gap: 4px;
    padding: 8px;
}

.template-layer-root,
.template-layer-empty,
.template-layer-row,
.template-layer-table-row > span,
.template-layer-table-row > button,
.template-schema-table > *,
.template-layer-table > span {
    border-color: var(--template-designer-border);
    border-radius: 0;
    background: var(--template-designer-surface);
    color: var(--template-designer-muted);
    font-size: 11px;
    line-height: 14px;
}

.template-layer-row {
    min-height: 26px;
    gap: 4px;
    padding: 2px 4px;
}

.template-layer-drag-handle,
.template-layer-visibility-toggle,
.template-layer-lock-toggle,
.template-layer-printable-toggle {
    border-radius: 2px;
}

.template-position-element-grid button {
    grid-template-columns: 18px minmax(0, 1fr);
}

.template-structure-tree {
    display: grid;
    gap: 4px;
}

.template-structure-page {
    min-height: 32px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 0 6px;
    align-items: center;
    padding: 4px 6px;
    border: 1px solid var(--template-designer-border);
    background: var(--template-designer-surface);
}

.template-structure-page .material-symbols-outlined {
    grid-row: 1 / 3;
    color: var(--template-designer-primary);
}

.template-structure-page strong,
.template-structure-page small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-structure-page strong {
    font-size: 11px;
    line-height: 14px;
}

.template-structure-page small {
    color: var(--template-designer-muted);
    font-size: 10px;
    line-height: 12px;
}

.template-engine-grid {
    height: calc(100% - 32px);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    overflow: auto;
    background: var(--template-designer-border);
}

.template-engine-grid > span {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 2px;
    padding: 8px 10px;
    background: var(--template-designer-surface);
    color: var(--template-designer-muted);
    font-size: 10px;
    line-height: 12px;
}

.template-engine-grid strong {
    overflow: hidden;
    color: #1a1c1c;
    font-size: 12px;
    line-height: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-rules-grid {
    height: calc(100% - 32px);
    display: flex;
    align-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 6px;
    overflow: auto;
    padding: 10px;
}

.template-rules-grid > span {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--template-designer-border);
    border-radius: 2px;
    padding: 2px 7px;
    background: #fff;
    color: var(--template-designer-muted);
    font-size: 10px;
    line-height: 14px;
}

.template-rules-grid > span.ready {
    border-color: #9bd8b6;
    background: #e5f7ed;
    color: #155f3a;
}

.template-rules-grid > span.blocked {
    border-color: #edb7b2;
    background: #fff1f0;
    color: #8f221d;
}

.template-bottom-empty {
    height: calc(100% - 32px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px;
    color: var(--template-designer-muted);
}

.template-bottom-empty > span {
    font-size: 11px;
    line-height: 14px;
}

.template-new-modal {
    width: min(700px, calc(100vw - 32px));
}

.template-new-modal .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.template-new-modal-notice {
    min-height: 40px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border: 1px solid #a9c7e8;
    border-radius: 2px;
    padding: 8px 10px;
    background: #eef6ff;
    color: #244b73;
    font-size: 11px;
    line-height: 15px;
}

.template-new-modal-notice .material-symbols-outlined {
    color: var(--template-designer-primary);
    font-size: 18px;
}

.template-canvas-style-editor {
    display: grid;
    gap: 8px;
    margin: 0;
    border: 0;
    border-bottom: 1px solid var(--template-designer-border);
    padding: 8px;
    background: var(--template-designer-surface);
}

.template-canvas-style-head {
    color: var(--template-designer-primary);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    line-height: 14px;
    text-transform: uppercase;
}

.template-canvas-style-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.template-canvas-style-grid label {
    min-width: 0;
    display: grid;
    gap: 2px;
    color: var(--template-designer-muted);
    font-size: 10px;
    font-weight: 500;
    line-height: 13px;
}

.template-canvas-style-grid input,
.template-canvas-style-grid select {
    width: 100%;
    min-width: 0;
    min-height: 24px;
    border: 1px solid var(--template-designer-border);
    border-radius: 0;
    padding: 0 5px;
    background: #fff;
    color: #1a1c1c;
    font-size: 11px;
}

.template-canvas-style-grid input[type="color"] {
    padding: 2px;
}

.template-canvas-style-toolbar {
    min-height: 28px;
    display: flex;
    align-items: center;
    gap: 3px;
}

.template-canvas-style-toolbar button {
    width: 28px;
    min-width: 28px;
    height: 26px;
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--template-designer-border);
    border-radius: 2px;
    padding: 0;
    background: #fff;
    color: var(--template-designer-muted);
}

.template-canvas-style-toolbar button.active {
    border-color: var(--template-designer-primary);
    background: #e8f2fc;
    color: var(--template-designer-primary);
}

.template-canvas-style-toolbar .material-symbols-outlined {
    font-size: 17px;
}

.template-canvas-style-separator {
    width: 1px;
    height: 20px;
    margin: 0 2px;
    background: var(--template-designer-border);
}

.template-underline-symbol {
    font-weight: 600;
    text-decoration: underline;
}

.template-canvas-element-label {
    width: 100%;
    text-align: inherit;
}

.template-field-browser {
    display: grid;
    align-content: start;
    min-height: 0;
    overflow: auto;
    background: var(--template-designer-surface);
}

.template-field-lead {
    display: grid;
    gap: 3px;
    border-bottom: 1px solid var(--template-designer-border);
    padding: 8px 10px;
    color: var(--template-designer-muted);
    font-size: 10px;
    line-height: 14px;
}

.template-field-lead strong {
    color: #1a1c1c;
    font-size: 11px;
}

.template-field-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
    padding: 7px;
}

.template-field-card-grid button {
    min-width: 0;
    min-height: 42px;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: center;
    gap: 5px;
    border: 1px solid var(--template-designer-border);
    border-radius: 2px;
    padding: 4px;
    background: #fff;
    color: #2f3337;
    text-align: left;
}

.template-field-card-grid button:hover:not(:disabled) {
    border-color: var(--template-designer-primary);
    background: #f5f9fd;
}

.template-field-card-grid button:disabled {
    opacity: .5;
}

.template-field-card-icon {
    min-width: 30px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c7d4df;
    background: #f6f8fa;
    color: var(--template-designer-primary);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
}

.template-field-search {
    min-height: 32px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    margin: 7px;
    border: 1px solid var(--template-designer-border);
    background: #fff;
}

.template-field-search .material-symbols-outlined {
    justify-self: center;
    color: var(--template-designer-muted);
    font-size: 16px;
}

.template-field-search input {
    min-width: 0;
    height: 30px;
    border: 0;
    padding: 0 6px 0 0;
    background: transparent;
    font-size: 11px;
    outline: 0;
}

.template-field-groups {
    display: grid;
    border-top: 1px solid var(--template-designer-border);
}

.template-field-group {
    display: grid;
    border-bottom: 1px solid var(--template-designer-border);
}

.template-field-group-head {
    min-height: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
    background: #f5f6f7;
    color: var(--template-designer-muted);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.template-field-row {
    min-width: 0;
    min-height: 42px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    border: 0;
    border-top: 1px solid #edf0f2;
    border-radius: 0;
    padding: 4px 8px;
    background: #fff;
    color: #2f3337;
    text-align: left;
}

.template-field-row:hover:not(:disabled) {
    background: #f8fafc;
    color: var(--template-designer-primary);
}

.template-field-row > span:first-child {
    color: var(--template-designer-primary);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
}

.template-field-row > span:nth-child(2) {
    min-width: 0;
    display: grid;
}

.template-field-row strong,
.template-field-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-field-row strong {
    font-size: 10px;
}

.template-field-row small {
    color: var(--template-designer-muted);
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 8px;
}

.template-field-row mark {
    border: 1px solid #c7d4df;
    border-radius: 2px;
    padding: 1px 3px;
    background: #f6f8fa;
    color: var(--template-designer-muted);
    font-size: 8px;
}

.template-field-row.used {
    background: #f1f4f6;
}

.template-field-row.used mark {
    border-color: #a7d8bd;
    background: #edf8f1;
    color: #176b3a;
}

.template-field-state {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px;
    color: var(--template-designer-muted);
    font-size: 10px;
    text-align: center;
}

.template-field-state.error {
    display: grid;
    color: #b42318;
}

.template-document-settings {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--template-designer-border, #c1c7d2);
    background: #fff;
}

.template-document-settings-section {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 10px 12px;
    border-bottom: 1px solid #d9d9d9;
}

.template-document-settings-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #3f4854;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.template-document-settings-head .material-symbols-outlined {
    font-size: 15px;
}

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

.template-document-settings-grid.cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
}

.template-document-settings label {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    color: #59636f;
    font-size: 10px;
    font-weight: 700;
}

.template-document-settings input,
.template-document-settings select {
    width: 100%;
    min-width: 0;
    height: 28px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 0 7px;
    background: #fff;
    color: #1a1c1c;
    font: inherit;
    font-size: 11px;
}

.template-document-settings input:focus,
.template-document-settings select:focus {
    outline: 2px solid rgb(0 66 119 / 18%);
    outline-offset: 0;
    border-color: #004277;
}

.template-document-settings input:disabled,
.template-document-settings select:disabled {
    background: #f4f4f4;
    color: #7b8188;
}

.template-document-settings-grid.cols-4 input {
    padding-inline: 4px;
    text-align: center;
}

.template-document-settings-check {
    min-height: 22px;
    flex-direction: row !important;
    align-items: center;
    gap: 7px !important;
    color: #303841 !important;
}

.template-document-settings-check input {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: #005a9e;
}

.template-document-settings-size {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 82px;
    align-items: center;
    gap: 8px !important;
}

.template-document-settings-color input {
    padding: 3px;
}

.template-document-settings-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 9px 12px 4px;
}

.template-document-settings-checks span {
    min-height: 20px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 2px 6px;
    background: #f6f6f6;
    color: #59636f;
    font-size: 9px;
    font-weight: 800;
}

.template-document-settings-checks .ready {
    border-color: #90c2a1;
    background: #e9f6ed;
    color: #147a3d;
}

.template-document-settings-checks .blocked {
    border-color: #dfb67b;
    background: #fff5e6;
    color: #8a5400;
}

.template-document-settings-save {
    align-self: flex-end;
    margin: 5px 12px 12px;
}

.template-document-settings-summary {
    margin: 0;
    color: #727782;
    font-size: 11px;
    line-height: 1.4;
}

.template-page {
    width: var(--template-page-width, 420px);
    height: var(--template-page-height, 594px);
    color: var(--template-document-text, #111827);
}

.template-page.show-grid {
    background-size: var(--template-grid-size, 10px) var(--template-grid-size, 10px);
}

.template-margin-guide {
    z-index: 1;
    border: 1px dashed rgb(0 66 119 / 38%);
    opacity: 1;
}

.template-page-zone {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
    overflow: hidden;
    border-block: 1px dashed rgb(0 66 119 / 26%);
    background: color-mix(in srgb, var(--template-document-accent, #d3e4ff) 26%, transparent);
    color: #59636f;
    pointer-events: none;
}

.template-page-zone.content {
    border-color: rgb(89 99 111 / 18%);
    background: transparent;
}

.template-page-zone span {
    position: absolute;
    top: 2px;
    right: 4px;
    font-size: 8px;
    font-weight: 700;
    text-transform: uppercase;
}

.template-page-number-preview {
    position: absolute;
    left: 50%;
    z-index: 3;
    transform: translateX(-50%);
    color: #59636f;
    font-size: 9px;
    pointer-events: none;
}

.template-page-content {
    z-index: 2;
}

.template-page-header span {
    color: var(--template-document-primary, #004277);
}

.template-page-footer {
    border-color: color-mix(in srgb, var(--template-document-primary, #004277) 24%, #e4e7ec);
}

.template-ruler-x {
    width: var(--template-page-width, 420px);
}

.template-ruler-y {
    height: var(--template-page-height, 594px);
}

.document-template-layout-page {
    display: block;
    flex: 0 0 auto;
    min-height: 0;
    padding: 0;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: 0 2px 8px rgb(15 23 42 / 10%);
}

.document-template-layout-page > header,
.document-template-layout-page > footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0;
    padding: 0;
}

.document-template-layout-page > main {
    display: block;
}

.document-template-layout-element {
    white-space: pre-wrap;
}

.document-template-layout-runtime-table {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3mm;
    color: inherit;
    background: #fff;
    font: inherit;
}

.document-template-layout-runtime-table h2 {
    margin: 0;
    color: inherit;
    font-size: 14pt;
    font-weight: 700;
    line-height: 1.2;
}

.document-template-layout-runtime-table table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font: inherit;
}

.document-template-layout-runtime-table th,
.document-template-layout-runtime-table td {
    overflow: hidden;
    border-bottom: 0.2mm solid #c7cdd5;
    padding: 1.8mm 1.4mm;
    text-overflow: ellipsis;
    vertical-align: top;
}

.document-template-layout-runtime-table th {
    border-top: 0.35mm solid currentcolor;
    border-bottom-color: currentcolor;
    font-weight: 700;
}

.document-template-layout-runtime-table .empty-row td {
    color: #667085;
    text-align: center;
}

.document-template-layout-runtime-summary {
    width: min(78mm, 52%);
    display: grid;
    align-self: flex-end;
    gap: 1mm;
}

.document-template-layout-runtime-summary > span,
.document-template-layout-runtime-summary > strong {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 5mm;
    padding: 1mm 0;
}

.document-template-layout-runtime-summary > strong {
    border-top: 0.35mm solid currentcolor;
    font-size: 11pt;
}

.document-template-layout-runtime-summary b,
.document-template-layout-runtime-summary em {
    font: inherit;
    font-style: normal;
}

.document-template-layout-runtime-footer {
    margin: auto 0 0;
    color: #475569;
    white-space: pre-wrap;
}

.document-template-layout-element .document-template-preview-canvas-table {
    width: 100%;
    height: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font: inherit;
}

.document-template-layout-element .document-template-preview-canvas-table th,
.document-template-layout-element .document-template-preview-canvas-table td {
    overflow: hidden;
    border: 1px solid currentcolor;
    padding: 2px 3px;
    text-overflow: ellipsis;
}

.document-template-instance-preview-sheet[data-document-template-preview-layout-projection="canonical"] {
    width: 100%;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.document-template-instance-preview-layout {
    display: flex;
    min-width: 0;
    max-width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    overflow: auto;
    padding: 12px;
    background: #f4f3f2;
}

/* Unified document editor: read-only invoice source adapter. */
.project-invoices-panel .invoice-detail-panel.has-unified-invoice-session {
    min-height: 0;
    height: calc(100vh - var(--dummy-topbar-height) - 190px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    padding: 0;
}

.project-invoices-panel .invoice-detail-panel.has-unified-invoice-session > :not(.notes-head):not([data-unified-invoice-session-host]):not([data-unified-invoice-item-editor-host]) {
    display: none !important;
}

.project-invoices-panel.has-unified-invoice-workspace {
    height: 100%;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.project-invoices-panel.has-unified-invoice-workspace > :not(.invoice-detail-panel) {
    display: none !important;
}

.project-invoices-panel.has-unified-invoice-workspace > .invoice-detail-panel.has-unified-invoice-session {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: block;
    overflow: hidden;
    border: 0;
}

.project-invoices-panel.has-unified-invoice-workspace > .invoice-detail-panel.has-unified-invoice-session > .notes-head {
    display: none !important;
}

.project-invoices-panel .invoice-detail-panel.has-unified-invoice-session > .notes-head {
    min-height: 42px;
    margin: 0;
    padding: 5px 10px;
    border-bottom: 1px solid #d8dee9;
}

.unified-invoice-editor-session {
    height: 100%;
    min-height: 0;
    border: 0;
    background: #eef1f4;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #111827;
}

.unified-invoice-editor-shell {
    height: 100%;
    min-width: 0;
    display: grid;
    grid-template-rows: 42px minmax(38px, auto) minmax(0, 1fr) 210px auto;
    overflow: hidden;
    border-top: 1px solid #d8dee9;
    background: #fff;
}

.unified-invoice-editor-toolbar {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 5px 10px;
    border-bottom: 1px solid #d8dee9;
    background: #fff;
}

.unified-invoice-editor-toolbar .quote-breadcrumb,
.unified-invoice-editor-toolbar .quote-toolbar-right {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.unified-invoice-editor-toolbar .quote-breadcrumb {
    overflow: hidden;
    color: #64748b;
    font-size: 12px;
    white-space: nowrap;
}

.unified-invoice-editor-toolbar .quote-breadcrumb strong {
    overflow: hidden;
    color: #111827;
    text-overflow: ellipsis;
}

.unified-invoice-editor-toolbar .quote-breadcrumb .material-symbols-outlined {
    font-size: 15px;
}

.unified-invoice-editor-toolbar .quote-toolbar-right {
    justify-content: flex-end;
    overflow-x: auto;
    scrollbar-width: thin;
}

.unified-invoice-editor-toolbar .btn {
    min-height: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid #c9d1dc;
    border-radius: 2px;
    padding: 0 9px;
    background: #fff;
    color: #1f2937;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    text-decoration: none;
}

.unified-invoice-editor-toolbar .btn:hover {
    border-color: #0f63ff;
    color: #0b57d0;
}

.unified-invoice-editor-toolbar .btn .material-symbols-outlined {
    font-size: 16px;
}

.unified-invoice-editor-toolbar .quote-status-tag {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border: 1px solid #d8dee9;
    border-radius: 2px;
    background: #f8fafc;
    color: #334155;
    font-size: 11px;
    font-weight: 800;
}

.unified-invoice-editor-toolbar .quote-status-tag.is-readonly {
    border-color: #cbd5e1;
    background: #eef2f6;
}

.unified-invoice-editor-toolbar .quote-status-tag.is-editable {
    border-color: #9dd8b0;
    background: #edf9f1;
    color: #166534;
}

.unified-invoice-editor-readiness {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, auto);
    align-items: center;
    gap: 10px;
    padding: 5px 12px;
    border-bottom: 1px solid #d8dee9;
    background: #f8fafc;
    color: #475569;
    font-size: 11px;
}

.unified-invoice-editor-readiness > div:first-child {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.unified-invoice-editor-readiness > div:first-child small {
    grid-column: 1 / -1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.unified-invoice-editor-readiness strong {
    overflow: hidden;
    color: #1f2937;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.unified-invoice-template-binding {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(130px, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding-left: 10px;
    border-left: 1px solid #d8dee9;
}

.unified-invoice-template-binding > .material-symbols-outlined {
    flex: 0 0 auto;
    color: #075985;
    font-size: 17px;
}

.unified-invoice-template-binding-copy {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.unified-invoice-template-binding small {
    overflow: hidden;
    color: #64748b;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.unified-invoice-template-binding-controls {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.unified-invoice-template-binding-controls select {
    width: min(210px, 22vw);
    min-width: 130px;
    height: 26px;
    border: 1px solid #cbd5e1;
    border-radius: 2px;
    padding: 0 24px 0 7px;
    background: #fff;
    color: #1f2937;
    font: inherit;
}

.unified-invoice-template-binding-controls .btn {
    min-height: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #0b5fa5;
    border-radius: 2px;
    padding: 0 8px;
    background: #0b5fa5;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.unified-invoice-template-binding-controls .btn:disabled,
.unified-invoice-template-binding-controls select:disabled {
    cursor: wait;
    opacity: 0.62;
}

.unified-invoice-template-binding-controls .material-symbols-outlined {
    font-size: 15px;
}

.unified-invoice-editor-shell.has-cumulative-settlement {
    grid-template-rows: 42px minmax(38px, auto) auto minmax(0, 1fr) 210px auto;
}

.invoice-cumulative-settlement {
    position: relative;
    z-index: 4;
    min-width: 0;
    border-bottom: 1px solid #cbd5e1;
    background: #fff;
    color: #1f2937;
}

.invoice-cumulative-settlement-head {
    min-height: 38px;
    display: grid;
    grid-template-columns: minmax(210px, 1fr) auto 30px;
    align-items: center;
    gap: 10px;
    padding: 4px 10px;
}

.invoice-cumulative-settlement-toggle {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 0;
    padding: 0;
    background: transparent;
    color: #1f2937;
    text-align: left;
    cursor: pointer;
}

.invoice-cumulative-settlement-toggle .material-symbols-outlined {
    color: #0b5fa5;
    font-size: 18px;
}

.invoice-cumulative-settlement-toggle > span:last-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.invoice-cumulative-settlement-toggle strong,
.invoice-cumulative-settlement-toggle small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-cumulative-settlement-toggle strong {
    font-size: 12px;
}

.invoice-cumulative-settlement-toggle small {
    color: #64748b;
    font-size: 10px;
}

.invoice-cumulative-settlement-totals {
    display: flex;
    align-items: center;
    gap: 12px;
}

.invoice-cumulative-settlement-totals > span:not(.invoice-cumulative-settlement-status) {
    display: grid;
    gap: 1px;
    padding-left: 10px;
    border-left: 1px solid #d8dee9;
}

.invoice-cumulative-settlement-totals small {
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.invoice-cumulative-settlement-totals strong {
    font-size: 11px;
    white-space: nowrap;
}

.invoice-cumulative-settlement-totals .is-remaining strong {
    color: #075985;
}

.invoice-cumulative-settlement-status {
    min-height: 23px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #b8c5d3;
    border-radius: 2px;
    padding: 0 7px;
    background: #f1f5f9;
    color: #334155;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.invoice-cumulative-settlement-body {
    max-height: min(330px, 42vh);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 320px);
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
}

.invoice-cumulative-settlement-state {
    grid-column: 1 / -1;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: #64748b;
    font-size: 12px;
}

.invoice-cumulative-settlement-state.is-error {
    color: #991b1b;
}

.invoice-cumulative-settlement-source-list {
    min-width: 0;
    overflow: auto;
    border-right: 1px solid #d8dee9;
    background: #fff;
}

.invoice-cumulative-settlement-source-list .head,
.invoice-cumulative-settlement-source-list .source-row {
    min-width: 760px;
    display: grid;
    grid-template-columns: 50px minmax(150px, 1fr) 90px 125px 125px 135px;
    align-items: center;
}

.invoice-cumulative-settlement-source-list .head {
    position: sticky;
    top: 0;
    z-index: 1;
    min-height: 29px;
    border-bottom: 1px solid #cbd5e1;
    background: #eef2f6;
    color: #475569;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.invoice-cumulative-settlement-source-list .head span,
.invoice-cumulative-settlement-source-list .source-row > span {
    min-width: 0;
    padding: 5px 8px;
}

.invoice-cumulative-settlement-source-list .source-row {
    min-height: 37px;
    border-bottom: 1px solid #e2e8f0;
    color: #334155;
    font-size: 11px;
    cursor: pointer;
}

.invoice-cumulative-settlement-source-list .source-row:hover {
    background: #f0f7ff;
}

.invoice-cumulative-settlement-source-list .source-row > span:nth-child(n + 4) {
    text-align: right;
    white-space: nowrap;
}

.invoice-cumulative-settlement-source-list .source-row > span:nth-child(2) {
    display: grid;
    gap: 1px;
}

.invoice-cumulative-settlement-source-list .source-row small {
    color: #64748b;
    font-size: 9px;
}

.invoice-cumulative-settlement-source-list .source-row .has-correction {
    color: #9a3412;
}

.invoice-cumulative-settlement-source-list input[type="checkbox"] {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: #0b5fa5;
}

.invoice-cumulative-settlement-source-list .empty {
    min-height: 72px;
    display: flex;
    align-items: center;
    padding: 12px;
    color: #64748b;
    font-size: 11px;
}

.invoice-cumulative-settlement-summary {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 0;
    background: #f8fafc;
}

.invoice-cumulative-settlement-summary > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 8px;
    padding: 8px 10px;
    border-bottom: 1px solid #d8dee9;
}

.invoice-cumulative-settlement-summary span {
    color: #475569;
    font-size: 10px;
    font-weight: 700;
}

.invoice-cumulative-settlement-summary strong {
    font-size: 11px;
    text-align: right;
}

.invoice-cumulative-settlement-summary small {
    grid-column: 1 / -1;
    color: #64748b;
    font-size: 10px;
    text-align: right;
}

.invoice-cumulative-settlement-summary .is-remaining {
    border-left: 3px solid #0b5fa5;
    background: #eef7ff;
}

.invoice-cumulative-settlement-summary .is-remaining strong {
    color: #075985;
}

.invoice-cumulative-settlement-actions {
    grid-column: 1 / -1;
    min-height: 39px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    padding: 5px 10px;
    border-top: 1px solid #cbd5e1;
    background: #fff;
}

.invoice-cumulative-settlement-actions > span {
    margin-right: auto;
    color: #64748b;
    font-size: 10px;
}

.invoice-cumulative-settlement-actions > strong {
    color: #166534;
    font-size: 10px;
}

.invoice-cumulative-settlement-actions .btn {
    min-height: 28px;
    border: 1px solid #b8c5d3;
    border-radius: 2px;
    padding: 0 9px;
    background: #fff;
    color: #1f2937;
    font-size: 11px;
    font-weight: 800;
}

.invoice-cumulative-settlement-actions .btn.primary {
    border-color: #0b5fa5;
    background: #0b5fa5;
    color: #fff;
}

.invoice-cumulative-settlement-actions .btn:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

@media (max-width: 1180px) {
    .unified-invoice-editor-shell {
        grid-template-rows: auto auto minmax(0, 1fr) 210px auto;
    }

    .unified-invoice-editor-shell.has-cumulative-settlement {
        grid-template-rows: auto auto auto minmax(0, 1fr) 210px auto;
    }

    .unified-invoice-editor-toolbar {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }

    .unified-invoice-editor-toolbar .quote-toolbar-right {
        justify-content: flex-start;
        padding-bottom: 2px;
    }

    .unified-invoice-editor-readiness {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: 5px;
    }

    .unified-invoice-template-binding {
        grid-template-columns: auto minmax(130px, 1fr) auto;
        padding-top: 5px;
        padding-left: 0;
        border-top: 1px solid #d8dee9;
        border-left: 0;
    }

    .invoice-cumulative-settlement-head {
        grid-template-columns: minmax(190px, 1fr) auto 30px;
    }

    .invoice-cumulative-settlement-totals > span:not(.is-remaining, .invoice-cumulative-settlement-status) {
        display: none;
    }
}

.unified-invoice-editor-canvas {
    min-height: 0;
    overflow: hidden;
    background: #dfe3e8;
}

.unified-invoice-editor-stage {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
    padding: 18px 24px 28px;
}

.unified-invoice-catalog-insert-line {
    position: sticky;
    right: 28px;
    bottom: 10px;
    left: 28px;
    z-index: 8;
    height: 16px;
    display: flex;
    align-items: center;
    pointer-events: none;
}

.unified-invoice-catalog-insert-line span {
    width: 100%;
    height: 2px;
    background: #0b63a8;
    box-shadow: 0 0 0 3px rgb(11 99 168 / 12%);
}

.unified-invoice-template-runtime {
    width: 100%;
    min-width: 794px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.unified-invoice-template-runtime .document-template-layout-page {
    flex: 0 0 auto;
}

.unified-invoice-pdf-preview-frame {
    width: min(980px, 100%);
    height: 100%;
    min-height: 620px;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid #bcc5d1;
    border-radius: 0;
    background: #fff;
    box-shadow: 0 2px 8px rgb(15 23 42 / 12%);
}

.unified-invoice-pdf-preview-frame iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
    background: #fff;
}

.unified-invoice-pdf-preview-state {
    width: min(794px, calc(100% - 12px));
    min-height: 260px;
    margin: 0 auto;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 8px;
    border: 1px solid #cbd2dc;
    background: #fff;
    color: #475569;
    text-align: center;
}

.unified-invoice-pdf-preview-state.is-error {
    border-color: #e0a3a3;
    color: #9b1c1c;
}

.unified-invoice-pdf-preview-state .material-symbols-outlined {
    font-size: 28px;
}

.unified-invoice-sheet {
    width: min(794px, calc(100% - 12px));
    min-width: 720px;
    min-height: 1000px;
    margin: 0 auto;
    padding: 54px 58px 44px;
    border: 1px solid #cbd2dc;
    border-radius: 0;
    background: #fff;
    box-shadow: 0 2px 8px rgb(15 23 42 / 12%);
    color: #111827;
    font-size: 12px;
}

.unified-invoice-sheet-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    align-items: start;
    gap: 28px;
    margin-bottom: 42px;
}

.unified-invoice-brand {
    display: grid;
    gap: 4px;
    color: #64748b;
}

.unified-invoice-brand strong {
    color: #075985;
    font-size: 22px;
    line-height: 26px;
}

.unified-invoice-meta {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 5px 10px;
    font-size: 11px;
}

.unified-invoice-meta > b {
    grid-column: 1 / -1;
    justify-self: end;
    margin-bottom: 5px;
    padding: 4px 12px;
    background: #e5e7eb;
    font-size: 12px;
}

.unified-invoice-meta > span {
    color: #64748b;
}

.unified-invoice-address {
    display: grid;
    gap: 3px;
    margin-bottom: 30px;
    line-height: 17px;
}

.unified-invoice-address > span {
    margin-bottom: 14px;
    border-bottom: 1px solid #d8dee9;
    color: #64748b;
    font-size: 9px;
}

.unified-invoice-address p,
.unified-invoice-title p,
.unified-invoice-footer p {
    margin: 0;
}

.unified-invoice-title {
    margin-bottom: 22px;
}

.unified-invoice-title h1 {
    margin: 0 0 4px;
    font-size: 20px;
    line-height: 25px;
}

.unified-invoice-title p {
    color: #475569;
    font-weight: 600;
}

.unified-invoice-document-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.unified-invoice-document-table .unified-invoice-col-position {
    width: 12%;
}

.unified-invoice-document-table .unified-invoice-col-quantity {
    width: 8%;
}

.unified-invoice-document-table .unified-invoice-col-unit {
    width: 7%;
}

.unified-invoice-document-table .unified-invoice-col-description {
    width: 52%;
}

.unified-invoice-document-table .unified-invoice-col-unit-price {
    width: 10%;
}

.unified-invoice-document-table .unified-invoice-col-total {
    width: 11%;
}

.unified-invoice-document-table th,
.unified-invoice-document-table td {
    border-bottom: 1px solid #cbd2dc;
    padding: 7px 5px;
    text-align: right;
    vertical-align: top;
}

.unified-invoice-document-table th {
    border-top: 2px solid #64748b;
    border-bottom-color: #64748b;
    color: #334155;
    font-size: 10px;
    font-weight: 800;
}

.unified-invoice-document-table th:first-child,
.unified-invoice-document-table td:first-child {
    text-align: left;
}

.unified-invoice-document-table th:nth-child(4),
.unified-invoice-document-table td:nth-child(4) {
    text-align: left;
}

.unified-invoice-document-table .empty-row td {
    height: 70px;
    color: #64748b;
    text-align: center;
    vertical-align: middle;
}

.unified-invoice-summary {
    width: 310px;
    display: grid;
    gap: 0;
    margin: 22px 0 0 auto;
}

.unified-invoice-summary div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 6px 8px;
    border-bottom: 1px solid #d8dee9;
}

.unified-invoice-summary .total {
    border-top: 2px solid #334155;
    border-bottom: 2px solid #334155;
    font-size: 14px;
}

.unified-invoice-footer {
    display: grid;
    gap: 8px;
    margin-top: 42px;
    padding-top: 12px;
    border-top: 1px solid #d8dee9;
    color: #475569;
}

.unified-invoice-position-list {
    min-height: 0;
    overflow: auto;
    border-top: 1px solid #cbd2dc;
    background: #fff;
}

.unified-invoice-position-list > header {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 12px;
    border-bottom: 1px solid #d8dee9;
    color: #334155;
    font-size: 11px;
}

.unified-invoice-position-list-head {
    padding: 0 8px !important;
}

.unified-invoice-position-tabs,
.unified-invoice-catalog-type-tabs,
.unified-invoice-catalog-controls {
    min-width: 0;
    display: flex;
    align-items: center;
}

.unified-invoice-position-tabs {
    align-self: stretch;
}

.unified-invoice-position-tabs button,
.unified-invoice-catalog-type-tabs button {
    min-height: 30px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 0 10px;
    background: transparent;
    color: #52606d;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.unified-invoice-position-tabs button.is-active,
.unified-invoice-catalog-type-tabs button.is-active {
    border-bottom-color: #0b63a8;
    color: #075985;
}

.unified-invoice-catalog-controls {
    flex: 1 1 auto;
    justify-content: flex-end;
    gap: 8px;
}

.unified-invoice-catalog-type-tabs {
    align-self: stretch;
}

.unified-invoice-catalog-search {
    width: min(420px, 34vw);
    min-width: 220px;
    height: 26px;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    border: 1px solid #cbd5e1;
    background: #fff;
}

.unified-invoice-catalog-search .material-symbols-outlined {
    color: #64748b;
    font-size: 16px;
    text-align: center;
}

.unified-invoice-catalog-search input {
    min-width: 0;
    height: 24px;
    border: 0;
    outline: 0;
    padding: 0 7px 0 0;
    background: transparent;
    color: #1f2937;
    font: inherit;
}

.unified-invoice-catalog-controls .quote-icon-button {
    width: 27px;
    height: 27px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #cbd5e1;
    border-radius: 2px;
    background: #fff;
    color: #334155;
}

.unified-invoice-catalog-controls .quote-icon-button .material-symbols-outlined {
    font-size: 17px;
}

.unified-invoice-catalog-grid {
    min-width: 940px;
}

.unified-invoice-catalog-grid > div {
    min-height: 29px;
    display: grid;
    grid-template-columns: 92px 132px minmax(280px, 1fr) 70px 180px 120px;
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    background: #fff;
    color: #1f2937;
    font-size: 11px;
}

.unified-invoice-catalog-grid > div:not(.head)[draggable="true"] {
    cursor: grab;
}

.unified-invoice-catalog-grid > div:not(.head):hover,
.unified-invoice-position-grid > div.is-editable:hover,
.unified-invoice-document-table tr.is-editable:hover {
    background: #edf5fb;
}

.unified-invoice-catalog-grid > div.is-saving {
    opacity: 0.52;
}

.unified-invoice-catalog-grid > div > * {
    min-width: 0;
    overflow: hidden;
    padding: 5px 8px;
    border-right: 1px solid #e2e8f0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.unified-invoice-catalog-grid > .head {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f1f5f9;
    color: #475569;
    font-size: 10px;
    font-weight: 800;
}

.unified-invoice-position-grid > div.is-editable,
.unified-invoice-document-table tr.is-editable {
    cursor: pointer;
}

.unified-invoice-position-state {
    min-height: 130px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 7px;
    color: #64748b;
    font-size: 11px;
}

.unified-invoice-position-state.is-error {
    color: #991b1b;
}

.unified-invoice-position-state button {
    min-height: 27px;
    border: 1px solid #cbd5e1;
    border-radius: 2px;
    padding: 0 9px;
    background: #fff;
    color: #334155;
    font: inherit;
    font-weight: 700;
}

.unified-invoice-catalog-feedback {
    position: absolute;
    right: 10px;
    bottom: 8px;
    z-index: 4;
    max-width: min(620px, calc(100% - 20px));
    padding: 5px 9px;
    border: 1px solid #b7dfc0;
    background: #f0f9f2;
    color: #166534;
    font-size: 10px;
    box-shadow: 0 2px 5px rgb(15 23 42 / 12%);
}

.unified-invoice-catalog-feedback.is-error {
    border-color: #e6b8b8;
    background: #fff3f3;
    color: #991b1b;
}

.unified-invoice-position-list {
    position: relative;
}

.unified-invoice-item-editor-backdrop {
    z-index: 1250;
}

.unified-invoice-item-editor-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1260;
    width: min(760px, calc(100vw - 36px));
    max-height: min(82vh, 760px);
    overflow: auto;
    transform: translate(-50%, -50%);
    border: 1px solid #cbd5e1;
    background: #fff;
    box-shadow: 0 18px 55px rgb(15 23 42 / 28%);
}

.unified-invoice-position-grid {
    min-width: 820px;
}

.unified-invoice-position-grid > div {
    min-height: 28px;
    display: grid;
    grid-template-columns: 70px minmax(300px, 1fr) 90px 80px 120px 120px;
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
}

.unified-invoice-position-grid > div > * {
    min-width: 0;
    overflow: hidden;
    padding: 5px 8px;
    border-right: 1px solid #e2e8f0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.unified-invoice-position-grid > .head {
    position: sticky;
    top: 0;
    background: #f1f5f9;
    color: #475569;
    font-size: 10px;
    font-weight: 800;
}

.unified-invoice-editor-warnings {
    min-height: 28px;
    display: flex;
    align-items: center;
    gap: 12px;
    overflow-x: auto;
    padding: 5px 12px;
    border-top: 1px solid #f6d98f;
    background: #fff7df;
    color: #7a4b00;
    font-size: 10px;
    white-space: nowrap;
}

.unified-invoice-editor-warnings .is-blocker {
    color: #9f1239;
    font-weight: 800;
}

.unified-invoice-editor-warnings .is-success {
    color: #166534;
    font-weight: 800;
}

.unified-invoice-draft-fields-modal {
    width: min(760px, calc(100vw - 32px));
    max-height: min(82vh, 720px);
}

.unified-invoice-draft-fields-modal .modal-head button .material-symbols-outlined {
    font-size: 18px;
}

.unified-invoice-draft-fields-grid {
    grid-template-columns: minmax(0, 1fr);
}

.unified-invoice-draft-fields-grid label {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.project-document-create-modal .unified-invoice-draft-fields-grid textarea {
    min-height: 132px;
    padding: 8px;
    resize: vertical;
    font: inherit;
    line-height: 18px;
}

.project-document-create-modal .unified-invoice-draft-fields-grid input:focus,
.project-document-create-modal .unified-invoice-draft-fields-grid textarea:focus {
    border-color: #0b5fa5;
    outline: 1px solid #0b5fa5;
    outline-offset: 0;
}

/* Document template management follows the compact settings/document UX of the UI dummy. */
.document-template-management {
    min-width: 900px;
    display: grid;
    gap: 12px;
    color: #1a1c1c;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 12px;
}

.document-template-management button,
.document-template-management input,
.document-template-management select,
.document-template-management textarea {
    font: inherit;
}

.document-template-management-header {
    min-height: 72px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 16px;
    border: 1px solid #c1c7d2;
    background: #faf9f8;
}

.document-template-management-header h1,
.document-template-management-panel-head h2 {
    margin: 0;
    letter-spacing: 0;
    color: #1a1c1c;
}

.document-template-management-header h1 {
    margin-top: 4px;
    font-size: 20px;
    line-height: 26px;
}

.document-template-management-header p,
.document-template-management-panel-head p {
    margin: 3px 0 0;
    color: #5f6670;
    font-size: 11px;
    line-height: 16px;
}

.document-template-management-breadcrumb {
    display: flex;
    align-items: center;
    gap: 3px;
    color: #5f6670;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    line-height: 14px;
}

.document-template-management-breadcrumb .material-symbols-outlined {
    color: #c1c7d2;
    font-size: 14px;
}

.document-template-management-primary,
.document-template-management-panel-head > button,
.document-template-management-subhead button,
.document-template-management-actions button,
.document-template-management-state button,
.document-template-management-modal button {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 0 10px;
    background: #faf9f8;
    color: #1a1c1c;
    font-weight: 650;
}

.document-template-management-primary,
.document-template-management-modal button.primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.document-template-management button.danger,
.document-template-management-modal button.danger {
    border-color: #b42318;
    color: #b42318;
}

.document-template-management button:hover:not(:disabled),
.document-template-management-modal button:hover:not(:disabled) {
    background: #e9e8e7;
}

.document-template-management-primary:hover:not(:disabled),
.document-template-management-modal button.primary:hover:not(:disabled) {
    background: #00345d;
}

.document-template-management button:disabled,
.document-template-management-modal button:disabled {
    cursor: not-allowed;
    opacity: .55;
}

.document-template-management-toolbar {
    min-height: 52px;
    display: grid;
    grid-template-columns: minmax(320px, 1fr) 210px auto auto;
    align-items: end;
    gap: 12px;
    padding: 9px 12px;
    border: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.document-template-management-toolbar > label:not(.document-template-management-archive-toggle) {
    display: grid;
    gap: 3px;
    color: #414750;
    font-size: 10px;
}

.document-template-management-search {
    position: relative;
}

.document-template-management-search .material-symbols-outlined {
    position: absolute;
    left: 8px;
    bottom: 7px;
    z-index: 1;
    color: #727782;
    font-size: 16px;
}

.document-template-management-toolbar input[type="search"],
.document-template-management-toolbar select {
    width: 100%;
    height: 30px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 0 8px;
    background: #fff;
    color: #1a1c1c;
}

.document-template-management-toolbar input[type="search"] {
    padding-left: 30px;
}

.document-template-management-archive-toggle {
    min-height: 30px;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.document-template-management-archive-toggle input {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: #004277;
}

.document-template-management-count {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    color: #414750;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    white-space: nowrap;
}

.document-template-management-message {
    min-height: 38px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid #c1c7d2;
    background: #fff;
}

.document-template-management-message > div {
    display: grid;
    gap: 2px;
}

.document-template-management-message.error {
    border-color: #f0b4ae;
    background: #fff6f5;
    color: #8a1c13;
}

.document-template-management-message.success {
    border-color: #9fd6b4;
    background: #f1fbf5;
    color: #146c3a;
}

.document-template-management-panel {
    min-height: 540px;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    border: 1px solid #c1c7d2;
    background: #faf9f8;
}

.document-template-management-panel-head {
    min-height: 58px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 13px;
    border-bottom: 1px solid #c1c7d2;
}

.document-template-management-panel-head h2 {
    font-size: 16px;
    line-height: 22px;
}

.document-template-management-designer {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(260px, 31%) minmax(360px, 1fr) minmax(230px, 28%);
    align-items: stretch;
}

.document-template-management-list {
    min-height: 0;
    max-height: calc(100vh - 245px);
    display: grid;
    align-content: start;
    gap: 0;
    overflow-y: auto;
    border-right: 1px solid #c1c7d2;
    background: #fff;
}

.document-template-management-row {
    min-height: 66px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 28px;
    align-items: center;
    gap: 7px;
    border-bottom: 1px solid #e3e2e1;
    border-left: 2px solid transparent;
    background: #fff;
}

.document-template-management-row.active {
    border-left-color: #004277;
    background: #eef4ff;
}

.document-template-management-row.archived {
    opacity: .7;
}

.document-template-management-select {
    min-width: 0;
    min-height: 64px;
    display: grid;
    align-content: center;
    gap: 2px;
    border: 0;
    padding: 7px 4px 7px 12px;
    background: transparent;
    color: #1a1c1c;
    text-align: left;
}

.document-template-management-select strong,
.document-template-management-select span,
.document-template-management-select small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-management-select strong {
    font-size: 12px;
}

.document-template-management-select span,
.document-template-management-select small {
    color: #5f6670;
    font-size: 10px;
}

.document-template-management-status {
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 9px;
    font-weight: 800;
    text-decoration: none;
    text-transform: uppercase;
}

.document-template-management-status.draft {
    background: #e8f7ef;
    color: #0a7d43;
}

.document-template-management-status.published {
    background: #eaf2ff;
    color: #0b5fa5;
}

.document-template-management-status.archived {
    background: #ecebea;
    color: #5f6670;
}

.document-template-management-edit {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 2px;
    padding: 0;
    background: transparent;
    color: #004277;
}

.document-template-management-edit .material-symbols-outlined {
    font-size: 16px;
}

.document-template-management-details {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 14px;
    border-right: 1px solid #c1c7d2;
    background: #faf9f8;
}

.document-template-management-subhead {
    min-height: 38px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #d8dee9;
}

.document-template-management-subhead > div {
    display: grid;
    gap: 2px;
}

.document-template-management-subhead span {
    color: #5f6670;
    font-size: 10px;
}

.document-template-management-metadata {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 0;
}

.document-template-management-metadata > div {
    min-width: 0;
    display: grid;
    gap: 3px;
    padding: 8px;
    border: 1px solid #d8dee9;
    background: #fff;
}

.document-template-management-metadata dt {
    color: #5f6670;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    text-transform: uppercase;
}

.document-template-management-metadata dd {
    margin: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-management-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid #d8dee9;
}

.document-template-management-archive-note {
    display: grid;
    gap: 3px;
    padding: 8px;
    border: 1px solid #d8dee9;
    background: #f4f3f2;
    color: #5f6670;
}

.document-template-management-preview {
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 10px;
    padding: 12px;
    background: #f4f3f2;
}

.document-template-management-preview > strong {
    font-size: 11px;
}

.document-template-management-sheet {
    min-height: 390px;
    display: grid;
    align-content: start;
    gap: 14px;
    overflow: auto;
    padding: 18px;
    border: 1px solid #c1c7d2;
    background: #fff;
    box-shadow: 0 4px 12px rgba(20, 30, 45, .08);
}

.document-template-management-sheet .document-template-preview-fragment {
    min-height: 0;
    gap: 10px;
    font-size: 10px;
}

.document-template-management-preview-canvas {
    position: relative;
    min-height: 350px;
    overflow: hidden;
}

.document-template-management-preview-canvas > .document-template-preview-page-fragment {
    position: absolute !important;
    top: 8px;
    left: 50%;
    min-height: 0;
    margin: 0;
    padding: 0;
    transform: translateX(-50%) scale(.3);
    transform-origin: top center;
}

.document-template-management-preview-canvas > [data-document-template-layout-orientation="landscape"] {
    transform: translateX(-50%) scale(.23);
}

.document-template-management-sheet .document-template-preview-fragment dl div {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 6px;
}

.document-template-management-sheet .document-template-preview-page-elements li,
.document-template-management-sheet .document-template-preview-page-elements .document-template-preview-table-item {
    grid-template-columns: minmax(0, 1fr);
}

.document-template-management-preview-state {
    min-height: 390px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    padding: 18px;
    border: 1px solid #c1c7d2;
    background: #fff;
    color: #5f6670;
    font-size: 11px;
    text-align: center;
}

.document-template-management-preview-state.error {
    color: #9f2d20;
}

.document-template-management-logo {
    width: 44px;
    height: 28px;
    display: grid;
    place-items: center;
    background: #004277;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.document-template-management-sheet h3 {
    margin: 0;
    font-size: 16px;
}

.document-template-management-sheet p,
.document-template-management-sheet small {
    margin: 0;
    color: #5f6670;
    font-size: 10px;
    line-height: 15px;
}

.document-template-management-sheet small {
    margin-top: auto;
}

.document-template-management-state {
    min-height: 360px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    color: #5f6670;
    text-align: center;
}

.document-template-management-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1500;
    background: rgba(26, 28, 28, .42);
}

.document-template-management-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1501;
    width: min(520px, calc(100vw - 32px));
    transform: translate(-50%, -50%);
    border: 1px solid #aeb5bf;
    background: #faf9f8;
    box-shadow: 0 18px 48px rgba(0, 0, 0, .24);
}

.document-template-management-modal header,
.document-template-management-modal footer {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid #c1c7d2;
}

.document-template-management-modal header > div {
    display: grid;
    gap: 3px;
}

.document-template-management-modal header span,
.document-template-management-modal label {
    color: #5f6670;
    font-size: 11px;
}

.document-template-management-modal header > button {
    width: 28px;
    min-width: 28px;
    padding: 0;
    border-color: transparent;
}

.document-template-management-modal > label {
    display: grid;
    gap: 6px;
    padding: 18px 14px;
}

.document-template-management-modal input,
.document-template-management-modal textarea {
    width: 100%;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    padding: 7px 8px;
    background: #fff;
    color: #1a1c1c;
}

.document-template-management-modal textarea {
    min-height: 86px;
    resize: vertical;
}

.document-template-management-modal footer {
    justify-content: flex-end;
    border-top: 1px solid #c1c7d2;
    border-bottom: 0;
    background: #f4f3f2;
}

@media (max-width: 1100px) {
    .document-template-management-toolbar {
        grid-template-columns: minmax(280px, 1fr) 190px auto;
    }

    .document-template-management-count {
        display: none;
    }

    .document-template-management-designer {
        grid-template-columns: 270px minmax(340px, 1fr);
    }

    .document-template-management-preview {
        display: none;
    }
}

/* Current UI-dummy parity for the embedded ERP Document Engine. */
.dummy-main > .dummy-workspace.is-document-template-editor {
    min-height: 0;
    overflow: hidden;
    padding: 0;
    background: #faf9f8;
}

.document-template-designer {
    --template-designer-left-w: 240px;
    --template-designer-right-w: 280px;
    --template-designer-topbar-h: 32px;
    --template-designer-toolbar-h: 32px;
    --template-designer-bottom-h: 0px;
    --template-designer-border: #c1c7d2;
    --template-designer-surface: #faf9f8;
    --template-designer-panel: #faf9f8;
    --template-designer-grid-bg: #efeeed;
    --template-designer-primary: #004277;
    --template-designer-muted: #414750;
    width: 100%;
    height: calc(100vh - var(--dummy-topbar-height));
    min-width: 1120px;
    min-height: 0;
    grid-template-rows: var(--template-designer-topbar-h) var(--template-designer-toolbar-h) minmax(0, 1fr);
    border: 0;
    background: #faf9f8;
    color: #1a1c1c;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 11px;
}

.document-template-designer .material-symbols-outlined {
    font-size: 16px;
}

.document-template-designer button,
.document-template-designer input,
.document-template-designer select,
.document-template-designer textarea {
    letter-spacing: 0;
}

.document-template-designer .template-designer-topbar {
    position: relative;
    z-index: 50;
    height: var(--template-designer-topbar-h);
    min-height: var(--template-designer-topbar-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    overflow: visible;
    padding: 0 12px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    box-shadow: none;
}

.document-template-designer .template-designer-topbar-main {
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
}

.template-engine-brand {
    flex: 0 0 auto;
    color: #004277;
    font-size: 15px;
    font-weight: 800;
    line-height: 24px;
    white-space: nowrap;
}

.document-template-designer .template-designer-breadcrumb {
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 4px;
    color: #414750;
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
}

.document-template-designer .template-designer-breadcrumb a {
    color: inherit;
    text-decoration: none;
}

.document-template-designer .template-designer-breadcrumb .material-symbols-outlined {
    color: #c1c7d2;
    font-size: 14px;
}

.document-template-designer .template-designer-breadcrumb b {
    max-width: 190px;
    overflow: hidden;
    color: #1a1c1c;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-designer .template-designer-actions {
    align-self: center;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 7px;
    overflow: visible;
    padding: 0;
}

.document-template-designer .template-preview-switch {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 0;
    padding: 0;
    background: transparent;
    color: #414750;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    font-weight: 500;
    white-space: nowrap;
}

.template-live-toggle {
    position: relative;
    width: 36px;
    height: 20px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #c1c7d2;
}

.template-live-toggle::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

.template-live-toggle.on {
    background: #004277;
}

.template-live-toggle.on::after {
    left: 18px;
}

.document-template-designer .template-btn,
.document-template-designer .template-action-menu-panel button {
    min-width: auto;
    min-height: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 0 8px;
    background: #faf9f8;
    box-shadow: none;
    color: #1a1c1c;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
}

.document-template-designer .template-btn:hover:not(:disabled),
.document-template-designer .template-action-menu-panel button:hover:not(:disabled) {
    background: #e9e8e7;
}

.document-template-designer .template-btn.primary {
    border-color: #004277;
    background: #004277;
    color: #fff;
}

.document-template-designer .template-btn.icon,
.document-template-designer .template-icon-btn {
    width: 24px;
    min-width: 24px;
    height: 24px;
    min-height: 24px;
    border-color: transparent;
    border-radius: 2px;
    padding: 0;
    background: transparent;
    color: #414750;
}

.document-template-designer .template-action-menu-panel {
    top: calc(100% + 2px);
    right: 0;
    min-width: 154px;
    gap: 2px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 4px;
    background: #faf9f8;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .16);
}

.document-template-designer .template-action-menu-toggle[aria-expanded="true"] {
    position: relative;
    z-index: 9;
    border-color: #9ca6b6;
    background: #e9e8e7;
    color: #1a1c1c;
}

.document-template-designer .template-action-menu-scrim {
    position: fixed;
    inset: 0;
    z-index: 7;
    width: auto;
    min-width: 0;
    height: auto;
    min-height: 0;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
    cursor: default;
}

.document-template-designer .template-designer-toolbar,
.document-template-designer .template-designer-workspace {
    grid-template-columns: var(--template-designer-left-w) minmax(0, 1fr) var(--template-designer-right-w);
}

.document-template-designer .template-designer-toolbar {
    height: var(--template-designer-toolbar-h);
    min-height: var(--template-designer-toolbar-h);
    border-bottom: 1px solid #c1c7d2;
    background: #faf9f8;
}

.document-template-designer .template-tabs-left,
.document-template-designer .template-tabs-right {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 0;
    border: 0;
    padding: 0;
    background: #f4f3f2;
}

.document-template-designer .template-tabs-left {
    border-right: 1px solid #c1c7d2;
}

.document-template-designer .template-tabs-right {
    border-left: 1px solid #c1c7d2;
}

.document-template-designer .template-tabs-left button {
    flex: 1 1 0;
}

.document-template-designer .template-tabs-left button,
.document-template-designer .template-tabs-right button {
    height: 32px;
    min-height: 32px;
    border: 0;
    border-right: 1px solid #c1c7d2;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 0 9px;
    background: transparent;
    color: #414750;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    font-weight: 500;
    line-height: 14px;
    text-transform: uppercase;
}

.document-template-designer .template-tabs-left button.active,
.document-template-designer .template-tabs-right button.active {
    border-bottom-color: #004277;
    background: #faf9f8;
    color: #004277;
}

.document-template-designer .template-toolbar-center {
    min-width: 0;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    overflow: hidden;
    padding: 0 8px;
}

.document-template-designer .template-tool-group {
    min-height: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    gap: 4px;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
}

.template-toolbar-separator {
    width: 1px;
    height: 16px;
    flex: 0 0 auto;
    margin: 0 2px;
    background: #c1c7d2;
}

.document-template-designer .template-tool-group button,
.document-template-designer .template-tool-group select {
    min-width: 24px;
    min-height: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 0;
    border-radius: 2px;
    padding: 0 6px;
    background: transparent;
    color: #414750;
    font-family: inherit;
    font-size: 10px;
    font-weight: 400;
}

.document-template-designer .template-tool-group button:hover:not(:disabled),
.document-template-designer .template-tool-group button.active {
    background: #e9e8e7;
    color: #1a1c1c;
}

.document-template-designer .template-tool-group button input {
    width: 12px;
    height: 12px;
    margin: 0;
    accent-color: #004277;
    pointer-events: none;
}

.document-template-designer .template-tool-group select {
    min-width: 48px;
    max-width: 48px;
    padding: 0 2px;
}

.document-template-designer .template-designer-workspace {
    min-height: 0;
    overflow: hidden;
    background: #efeeed;
}

.document-template-designer .template-left-panel,
.document-template-designer .template-right-panel {
    min-height: 0;
    background: #faf9f8;
}

.document-template-designer .template-left-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-right: 1px solid #c1c7d2;
    padding: 0;
}

.document-template-designer .template-right-panel[data-document-template-right-mode="document"] {
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.document-template-designer .template-right-panel[data-document-template-right-mode="document"] > .template-inspector-title {
    position: sticky;
    top: 0;
    z-index: 5;
}

.document-template-designer .template-right-panel[data-document-template-right-mode="document"] > .template-document-settings {
    flex: 0 0 auto !important;
    min-height: auto;
    overflow: visible;
}

.template-left-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 8px;
}

.document-template-designer .template-panel-title,
.document-template-designer .template-category-head,
.template-layer-explorer-head {
    color: #414750;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .05em;
    line-height: 14px;
    text-transform: uppercase;
}

.document-template-designer .template-panel-title {
    min-height: 18px;
}

.document-template-designer .template-search,
.document-template-designer .template-field-search {
    min-height: 24px;
    margin: 3px 0 7px;
    gap: 4px;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    padding: 0 6px;
    background: #faf9f8;
}

.document-template-designer .template-search input,
.document-template-designer .template-field-search input {
    min-height: 22px;
    font-size: 10px;
}

.document-template-designer .template-archive-toggle {
    min-height: 22px;
    margin: 0 0 8px;
    gap: 6px;
    color: #414750;
    font-size: 10px;
    font-weight: 400;
}

.document-template-designer .template-list {
    gap: 3px;
    margin-bottom: 12px;
}

.document-template-designer .template-row {
    min-height: 34px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 4px 6px;
    background: #faf9f8;
}

.document-template-designer .template-row.active {
    border-color: #004277;
    background: rgba(211, 228, 255, .22);
}

.document-template-designer .template-row strong,
.document-template-designer .template-row span {
    font-size: 10px;
    line-height: 13px;
}

.document-template-designer .template-category {
    margin: 0 0 11px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.document-template-designer .template-category-head {
    min-height: 20px;
    margin: 0 0 4px;
    padding: 0;
    border: 0;
}

.document-template-designer .template-field-lead {
    display: none;
}

.document-template-designer .template-element-grid,
.document-template-designer .template-field-card-grid {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 0;
}

.document-template-designer .template-element-grid button,
.document-template-designer .template-field-card-grid button,
.document-template-designer .template-field-row {
    min-height: 26px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 4px 7px;
    background: #faf9f8;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 400;
    text-align: left;
}

.document-template-designer .template-field-card-grid button {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 5px;
}

.document-template-designer .template-field-card-grid button > span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-designer .template-element-grid button:hover:not(:disabled),
.document-template-designer .template-field-card-grid button:hover:not(:disabled),
.document-template-designer .template-field-row:hover:not(:disabled) {
    border-color: #004277;
    background: rgba(211, 228, 255, .18);
}

.document-template-designer .template-field-card-icon {
    width: 24px;
    min-width: 24px;
    height: 16px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #004277;
    font-size: 13px;
}

.document-template-designer .template-erp-field-section {
    margin-top: 12px;
    padding-top: 8px;
    border-top: 1px solid #c1c7d2;
}

.document-template-designer .template-field-groups {
    gap: 5px;
}

.document-template-designer .template-field-group {
    border: 0;
    border-radius: 0;
}

.document-template-designer .template-field-group-head {
    min-height: 22px;
    padding: 0 3px;
    border: 0;
    background: transparent;
    color: #414750;
    font-size: 10px;
}

.document-template-designer .template-field-row small,
.document-template-designer .template-field-row mark {
    font-size: 8px;
}

.template-layer-explorer {
    height: 31%;
    min-height: 180px;
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-top: 1px solid #c1c7d2;
    background: #fff;
}

.template-layer-explorer-head {
    min-height: 28px;
    display: flex;
    align-items: center;
    padding: 0 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    color: #1a1c1c;
}

.template-layer-explorer-tree {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 6px;
}

.template-layer-explorer-root {
    min-height: 24px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 5px;
    padding: 2px 4px;
    font-size: 10px;
}

.template-layer-explorer .template-layer-row {
    min-height: 23px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 22px 22px;
    align-items: center;
    gap: 1px;
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0 2px 0 18px;
}

.template-layer-explorer .template-layer-row.active,
.template-layer-explorer .template-layer-row.multi-selected {
    background: rgba(211, 228, 255, .45);
    color: #004277;
}

.template-layer-explorer .template-layer-row-select {
    min-width: 0;
    min-height: 22px;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    font-size: 10px;
    text-align: left;
}

.template-layer-explorer .template-layer-row-select span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-layer-explorer .template-layer-visibility-toggle,
.template-layer-explorer .template-layer-lock-toggle {
    width: 22px;
    min-width: 22px;
    height: 22px;
    min-height: 22px;
    border: 0;
    padding: 0;
    background: transparent;
    color: #414750;
}

.template-layer-explorer-empty {
    flex: 1 1 auto;
    display: grid;
    place-items: center;
    color: #727782;
    font-size: 10px;
}

.document-template-designer .template-canvas-shell {
    position: relative;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: #efeeed;
    background-image:
        linear-gradient(to right, rgba(227, 226, 225, .72) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(227, 226, 225, .72) 1px, transparent 1px);
    background-size: 18.9px 18.9px;
}

.document-template-designer .pdf-preview-status {
    display: none;
}

.document-template-designer .template-canvas-stage {
    flex: 1 1 auto;
    min-height: 0;
    display: block;
    overflow: auto;
    padding: 48px 32px 72px;
    background: transparent;
}

.document-template-designer .template-page-wrap {
    width: var(--template-canvas-wrap-width, 454px);
    height: var(--template-canvas-wrap-height, 628px);
    display: block;
    margin: 0 auto;
    padding: 0;
}

.document-template-designer .template-page-scale {
    width: var(--template-canvas-page-width, 767px);
    height: var(--template-canvas-page-height, 1085px);
    transform-origin: top left;
}

.document-template-designer .template-ruler-x {
    top: -16px;
    height: 16px;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    background-color: #faf9f8;
    opacity: .5;
}

.document-template-designer .template-ruler-y {
    left: -16px;
    width: 16px;
    border: 0;
    border-right: 1px solid #c1c7d2;
    background-color: #faf9f8;
    opacity: .5;
}

.document-template-designer .template-ruler-x span,
.document-template-designer .template-ruler-y span {
    display: none;
}

.document-template-designer .template-page {
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background-color: #fff;
    background-image:
        linear-gradient(to right, #e3e2e1 1px, transparent 1px),
        linear-gradient(to bottom, #e3e2e1 1px, transparent 1px);
    background-size: 18.9px 18.9px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}

.document-template-designer .template-margin-guide {
    border: 0;
    border-radius: 0;
}

.document-template-designer .template-margin-label,
.document-template-designer .template-page-zone {
    display: none;
}

.document-template-designer .template-canvas-element {
    overflow: visible;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.document-template-designer .template-canvas-element:hover {
    border-color: rgba(0, 66, 119, .45);
    background: rgba(211, 228, 255, .12);
}

.document-template-designer .template-canvas-element.selected {
    z-index: 40 !important;
    border: 2px solid #004277;
    background: rgba(211, 228, 255, .2);
}

.document-template-designer .template-canvas-element.selected::before {
    content: attr(data-editor-label);
    position: absolute;
    top: -22px;
    right: -2px;
    min-height: 22px;
    display: flex;
    align-items: center;
    padding: 0 7px;
    border-radius: 2px 2px 0 0;
    background: #004277;
    color: #fff;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    white-space: nowrap;
}

.document-template-designer .template-canvas-element-label {
    display: block;
    overflow: hidden;
    padding: 8px;
    color: #1a1c1c;
    font-size: 10px;
    line-height: 14px;
    text-align: left;
    white-space: pre-wrap;
}

.document-template-designer .template-canvas-resize {
    right: -5px;
    bottom: -5px;
    width: 8px;
    height: 8px;
    border: 1px solid #004277;
    border-radius: 0;
    background: #fff;
}

.document-template-designer .template-page-control-bar {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 20;
    height: 32px;
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border-top: 1px solid #c1c7d2;
    background: #faf9f8;
    color: #414750;
    font-size: 10px;
}

.document-template-designer .template-page-control-bar button {
    min-width: 24px;
    min-height: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 0;
    border-radius: 2px;
    padding: 0 5px;
    background: transparent;
    color: #414750;
}

.document-template-designer .template-page-control-bar button:last-child {
    color: #004277;
    font-weight: 700;
}

.document-template-designer .template-right-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid #c1c7d2;
    padding: 0;
}

.document-template-designer .template-inspector-title {
    min-height: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: flex;
    align-items: center;
    padding: 0 8px;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
    color: #1a1c1c;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.document-template-designer .template-right-panel > :not(.template-inspector-title) {
    flex: 0 0 auto;
}

.document-template-designer .template-canvas-inspector {
    flex: 1 1 auto !important;
    min-height: 0;
    overflow-y: auto;
    padding: 0;
}

.document-template-designer .template-document-settings {
    flex: 1 1 auto !important;
    min-height: 0;
    overflow-y: auto;
    padding: 0;
}

.document-template-designer .template-inspector-section-head,
.document-template-designer .template-document-settings > div:first-child,
.document-template-designer .template-document-settings-section > strong,
.document-template-designer .template-canvas-style-head {
    min-height: 28px;
    display: flex;
    align-items: center;
    padding: 6px 8px;
    border-bottom: 1px solid rgba(193, 199, 210, .55);
    background: #fff;
    color: #004277;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .05em;
    line-height: 14px;
    text-transform: uppercase;
}

.document-template-designer .template-inspector-section-head {
    justify-content: space-between;
    border-top: 1px solid #c1c7d2;
}

.document-template-designer .template-inspector-section-head:first-child {
    border-top: 0;
}

.document-template-designer .template-inspector-section-head .material-symbols-outlined {
    color: #004277;
    font-size: 13px;
}

.document-template-designer .template-inspector-subhead {
    min-height: 20px;
    display: flex;
    align-items: center;
    padding: 5px 8px 2px;
    color: #414750;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.document-template-designer .template-inspector-inline-actions {
    display: flex;
    align-items: center;
    padding: 0 8px 8px;
}

.document-template-designer .template-canvas-inspector > label,
.document-template-designer .template-document-settings label {
    display: grid;
    gap: 2px;
    padding: 5px 8px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-inspector input,
.document-template-designer .template-canvas-inspector select,
.document-template-designer .template-canvas-inspector textarea,
.document-template-designer .template-document-settings input,
.document-template-designer .template-document-settings select {
    width: 100%;
    min-height: 22px;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    padding: 0 4px;
    background: #faf9f8;
    color: #1a1c1c;
    font-size: 10px;
}

.document-template-designer .template-canvas-inspector textarea {
    min-height: 46px;
    padding: 4px;
    resize: vertical;
}

.document-template-designer .template-canvas-style-editor,
.document-template-designer .template-canvas-code-editor,
.document-template-designer .template-canvas-photo-gallery-editor,
.document-template-designer .template-canvas-form-field-editor,
.document-template-designer .template-document-settings-section {
    margin: 0;
    border: 0;
    border-bottom: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
}

.document-template-designer .template-document-settings-section {
    gap: 0;
    padding: 0;
}

.document-template-designer .template-document-settings-head {
    min-height: 34px;
    padding: 7px 8px;
    background: #fff;
    color: #004277;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .05em;
    line-height: 14px;
}

.document-template-designer .template-document-settings-head .material-symbols-outlined {
    color: #004277;
    font-size: 13px;
}

.document-template-designer .template-document-settings-section > .template-document-settings-check,
.document-template-designer .template-document-settings-section > .template-document-settings-size {
    margin: 0 8px 6px;
}

.document-template-designer .template-document-settings-grid.cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
}

.document-template-designer .template-document-settings-toggle-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    align-items: center;
    gap: 6px;
    padding: 0 8px 6px;
}

.document-template-designer .template-document-settings-toggle-row .template-document-settings-check,
.document-template-designer .template-document-settings-toggle-row .template-document-settings-size {
    margin: 0;
}

.document-template-designer .template-document-settings-check {
    min-height: 22px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 7px;
}

.document-template-designer .template-document-settings-check input[type="checkbox"] {
    width: 15px;
    min-width: 15px;
    height: 15px;
    min-height: 15px;
    margin: 0;
    padding: 0;
}

.document-template-designer .template-document-settings-toggle-row .template-document-settings-size {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 2px !important;
}

.document-template-designer .template-document-settings-toggle-row .template-document-settings-size input {
    height: 22px;
}

.document-template-designer .template-document-settings-summary {
    margin: 0;
    padding: 8px;
    color: #414750;
    font-size: 9px;
    line-height: 1.4;
}

.document-template-designer .template-font-alias-panel {
    display: grid;
    gap: 5px;
    min-width: 0;
    border-top: 1px solid rgba(193, 199, 210, .55);
    padding: 7px 8px 8px;
    background: #fff;
    color: #414750;
    font-size: 9px;
    line-height: 1.35;
}

.document-template-designer .template-font-alias-head,
.document-template-designer .template-font-alias-status,
.document-template-designer .template-font-alias-route,
.document-template-designer .template-font-alias-output-boundary {
    display: flex;
    align-items: center;
}

.document-template-designer .template-font-alias-head {
    justify-content: space-between;
    gap: 6px;
}

.document-template-designer .template-font-alias-status {
    gap: 4px;
    min-width: 0;
    color: #7a4b00;
    font-weight: 700;
}

.document-template-designer .template-font-alias-status .material-symbols-outlined {
    font-size: 14px;
}

.document-template-designer .template-font-alias-scope {
    overflow: hidden;
    color: #69717d;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 8px;
    font-weight: 700;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.document-template-designer .template-font-alias-panel.state-confirmed .template-font-alias-status,
.document-template-designer .template-font-alias-panel.state-direct .template-font-alias-status,
.document-template-designer .template-font-alias-panel.state-inherited .template-font-alias-status {
    color: #027a48;
}

.document-template-designer .template-font-alias-panel.state-invalid .template-font-alias-status,
.document-template-designer .template-font-alias-panel.state-blocked .template-font-alias-status {
    color: #b42318;
}

.document-template-designer .template-font-alias-route {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1fr);
    gap: 4px;
    min-height: 25px;
    border: 1px solid #d8dde6;
    padding: 4px 6px;
    background: #faf9f8;
}

.document-template-designer .template-font-alias-route strong {
    min-width: 0;
    overflow: hidden;
    color: #1a1c1c;
    font-size: 10px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-designer .template-font-alias-route .material-symbols-outlined {
    color: #69717d;
    font-size: 13px;
}

.document-template-designer .template-font-alias-detail,
.document-template-designer .template-font-alias-meta {
    margin: 0;
}

.document-template-designer .template-font-alias-meta {
    color: #69717d;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 8px;
}

.document-template-designer .template-font-alias-confirm {
    width: 100%;
    min-height: 24px;
    justify-content: center;
    border-radius: 0;
}

.document-template-designer .template-font-alias-confirm .material-symbols-outlined {
    font-size: 14px;
}

.document-template-designer .template-font-alias-output-boundary {
    gap: 4px;
    min-height: 22px;
    padding: 3px 5px;
    background: #f4f3f2;
    color: #69717d;
    font-size: 8px;
}

.document-template-designer .template-font-alias-output-boundary .material-symbols-outlined {
    font-size: 12px;
}

.document-template-designer .template-font-alias-errors {
    display: grid;
    gap: 2px;
    border-left: 2px solid #b42318;
    padding: 4px 6px;
    background: #fff4f2;
    color: #b42318;
}

.document-template-designer .template-font-alias-confirm .is-spinning {
    animation: template-font-alias-spin .8s linear infinite;
}

@keyframes template-font-alias-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .document-template-designer .template-font-alias-confirm .is-spinning {
        animation: none;
    }
}

.document-template-designer .template-document-metadata-grid .wide {
    grid-column: 1 / -1;
}

.document-template-designer .template-document-metadata-value {
    min-width: 0;
    display: grid;
    gap: 2px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-document-metadata-value strong {
    min-height: 22px;
    display: flex;
    align-items: center;
    border: 1px solid #d8dde6;
    padding: 0 5px;
    background: #f4f3f2;
    color: #5f6670;
    font-size: 11px;
}

.document-template-designer .template-metadata-state {
    margin-left: auto;
    color: #7a4b00;
    font-family: "Inter", Arial, sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.document-template-designer .template-metadata-state.ready {
    color: #027a48;
}

.document-template-designer .template-designer-toast {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 260;
    width: max-content;
    max-width: min(420px, calc(100vw - 40px));
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 8px;
    background: #111827;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
    color: #fff;
    font-family: "Inter", Arial, sans-serif;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: 0;
    line-height: 1.35;
    overflow-wrap: anywhere;
    pointer-events: none;
    animation: template-designer-toast-in 140ms ease-out;
}

@keyframes template-designer-toast-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .document-template-designer .template-designer-toast {
        animation: none;
    }
}

.template-publish-modal.project-document-create-modal {
    width: min(640px, calc(100vw - 32px));
    max-height: min(88vh, 760px);
}

.template-import-modal.project-document-create-modal {
    width: min(640px, calc(100vw - 32px));
    max-height: min(88vh, 760px);
}

.template-import-modal .template-import-modal-body {
    gap: 14px;
}

.template-import-file,
.template-import-preview {
    display: grid;
    gap: 10px;
}

.template-import-file {
    padding-bottom: 14px;
    border-bottom: 1px solid #d8dde6;
}

.template-import-file label,
.template-import-preview label {
    display: grid;
    gap: 5px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.template-import-file input[type="file"],
.template-import-preview input[type="text"] {
    min-height: 32px;
    width: 100%;
    min-width: 0;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 5px 8px;
    background: #fff;
    color: #1f2937;
    font-size: 12px;
}

.template-import-file small {
    color: #727782;
    font-size: 11px;
}

.template-import-preview h3 {
    margin: 0;
    color: #282d33;
    font-size: 13px;
}

.template-import-preview dl {
    margin: 0;
    border: 1px solid #c1c7d2;
}

.template-import-preview dl > div {
    min-height: 34px;
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    align-items: center;
    border-bottom: 1px solid #e3e6eb;
}

.template-import-preview dl > div:last-child {
    border-bottom: 0;
}

.template-import-preview dt,
.template-import-preview dd {
    margin: 0;
    padding: 7px 10px;
    overflow-wrap: anywhere;
    font-size: 11px;
}

.template-import-preview dt {
    color: #5f6670;
    font-weight: 700;
}

.template-import-preview dd {
    color: #1f2328;
    font-weight: 600;
}

.template-import-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.template-import-checks span {
    border: 1px solid #abefc6;
    padding: 3px 7px;
    background: #f6fef9;
    color: #027a48;
    font-size: 10px;
    font-weight: 700;
}

.template-import-warnings {
    display: grid;
    gap: 5px;
}

.template-import-warnings small {
    border-left: 3px solid #d97706;
    padding: 5px 8px;
    background: #fff8e6;
    color: #7a4b00;
    font-size: 10px;
}

.template-version-action-modal.project-document-create-modal {
    width: min(540px, calc(100vw - 32px));
    max-height: min(88vh, 700px);
}

.template-version-action-modal .template-version-action-modal-body {
    gap: 14px;
}

.template-version-action-summary h3 {
    margin: 0 0 8px;
    color: #282d33;
    font-size: 13px;
}

.template-version-action-summary dl {
    margin: 0;
    border: 1px solid #c1c7d2;
}

.template-version-action-summary dl > div {
    min-height: 34px;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    align-items: center;
    border-bottom: 1px solid #e3e6eb;
}

.template-version-action-summary dl > div:last-child {
    border-bottom: 0;
}

.template-version-action-summary dt,
.template-version-action-summary dd {
    margin: 0;
    padding: 7px 10px;
    overflow-wrap: anywhere;
    font-size: 11px;
}

.template-version-action-summary dt {
    color: #5f6670;
    font-weight: 700;
}

.template-version-action-summary dd {
    color: #1f2328;
    font-weight: 600;
}

.template-version-action-field {
    display: grid;
    gap: 5px;
    color: #414750;
    font-size: 11px;
    font-weight: 700;
}

.template-version-action-field input,
.template-version-action-field textarea {
    width: 100%;
    min-width: 0;
    border: 1px solid #c1c7d2;
    border-radius: 2px;
    padding: 7px 8px;
    background: #fff;
    color: #1f2937;
    font-size: 12px;
}

.template-version-action-field input {
    min-height: 32px;
}

.template-version-action-field textarea {
    min-height: 82px;
    resize: vertical;
}

.template-version-action-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.template-version-action-checks span {
    border: 1px solid #d0d5dd;
    padding: 3px 7px;
    background: #fff;
    color: #667085;
    font-size: 10px;
    font-weight: 700;
}

.template-version-action-checks span.ready {
    border-color: #abefc6;
    background: #f6fef9;
    color: #027a48;
}

.template-version-action-checks span.blocked {
    border-color: #fedf89;
    background: #fffaeb;
    color: #93370d;
}

.template-archive-modal-warning {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    border-left: 3px solid #b42318;
    padding: 8px 10px;
    background: #fff4f2;
    color: #7a271a;
    font-size: 11px;
}

.template-archive-modal-warning .material-symbols-outlined {
    font-size: 17px;
}

.template-publish-modal .template-publish-modal-body {
    gap: 16px;
}

.template-publish-summary h3 {
    margin: 0 0 8px;
    color: #1a1c1c;
    font-size: 13px;
}

.template-publish-summary dl {
    margin: 0;
    border: 1px solid #c1c7d2;
}

.template-publish-summary dl > div {
    min-height: 34px;
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    align-items: center;
    border-bottom: 1px solid #d9d9d9;
}

.template-publish-summary dl > div:last-child {
    border-bottom: 0;
}

.template-publish-summary dt,
.template-publish-summary dd {
    margin: 0;
    padding: 7px 10px;
}

.template-publish-summary dt {
    color: #414750;
    font-size: 10px;
    font-weight: 700;
}

.template-publish-summary dd {
    min-width: 0;
    color: #1a1c1c;
    font-size: 11px;
    font-weight: 700;
}

.template-publish-modal .template-publish-panel {
    gap: 10px;
    margin: 0;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
    color: #414750;
}

.template-publish-modal .template-publish-panel textarea {
    min-height: 78px;
    border-radius: 2px;
}

.template-publish-modal .template-publish-readiness {
    border: 1px solid #c1c7d2;
    padding: 10px;
    background: #faf9f8;
}

.document-template-designer .template-canvas-geometry {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 5px 8px 8px;
}

.document-template-designer .template-canvas-geometry label {
    min-width: 0;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-code-editor > label {
    display: grid;
    gap: 2px;
    padding: 5px 8px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-photo-gallery-editor > label {
    display: grid;
    gap: 2px;
    padding: 5px 8px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-photo-gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 5px 8px;
}

.document-template-designer .template-canvas-photo-gallery-grid label {
    min-width: 0;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-code-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 5px 8px;
}

.document-template-designer .template-canvas-code-grid label {
    min-width: 0;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-code-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 8px;
    border-top: 1px solid #c1c7d2;
}

.document-template-designer .template-canvas-code-actions .template-btn {
    min-width: 0;
    min-height: 26px;
    padding: 0 8px;
}

.document-template-designer .template-canvas-form-field-editor > label,
.document-template-designer .template-canvas-form-field-rule-grid > label {
    display: grid;
    gap: 2px;
    padding: 5px 8px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-form-field-binding-help {
    margin: 0;
    padding: 8px;
    color: #414750;
    font-size: 10px;
    line-height: 1.35;
}

.document-template-designer .template-canvas-form-field-editor > .template-canvas-form-field-check {
    min-height: 28px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 7px;
}

.document-template-designer .template-canvas-form-field-check input[type="checkbox"] {
    width: 15px;
    min-width: 15px;
    height: 15px;
    min-height: 15px;
    margin: 0;
    padding: 0;
}

.document-template-designer .template-canvas-form-field-options {
    display: grid;
    gap: 5px;
    margin: 5px 8px;
    border: 1px solid #c1c7d2;
    padding: 6px;
    background: #fff;
}

.document-template-designer .template-canvas-form-field-options-head {
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-form-field-option {
    display: grid;
    grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr) 24px;
    align-items: end;
    gap: 4px;
}

.document-template-designer .template-canvas-form-field-option label {
    min-width: 0;
    display: grid;
    gap: 2px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-form-field-option .template-icon-btn,
.document-template-designer .template-canvas-form-field-options-head .template-icon-btn {
    width: 24px;
    min-width: 24px;
    height: 24px;
    min-height: 24px;
}

.document-template-designer .template-canvas-form-field-option .material-symbols-outlined,
.document-template-designer .template-canvas-form-field-options-head .material-symbols-outlined {
    font-size: 15px;
}

.document-template-designer .template-canvas-form-field-rule-grid {
    display: grid;
    grid-template-columns: 1fr;
    border-top: 1px solid rgba(193, 199, 210, .55);
}

.document-template-designer .template-canvas-form-field-rounding {
    display: grid;
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
    gap: 6px;
    padding: 5px 8px;
    border-top: 1px solid rgba(193, 199, 210, .55);
}

.document-template-designer .template-canvas-form-field-rounding label {
    min-width: 0;
    display: grid;
    gap: 2px;
    color: #414750;
    font-size: 9px;
}

.document-template-designer .template-canvas-form-field-expression-preview {
    display: grid;
    gap: 2px;
    padding: 6px 8px;
    border-top: 1px solid rgba(193, 199, 210, .55);
    border-left: 3px solid #8b929c;
    background: #f4f3f2;
    color: #414750;
    font-size: 9px;
    line-height: 1.35;
}

.document-template-designer .template-canvas-form-field-expression-preview.valid {
    border-left-color: #238636;
    background: #f0f8f2;
}

.document-template-designer .template-canvas-form-field-expression-preview.error {
    border-left-color: #c62828;
    background: #fff3f2;
    color: #8f1d1d;
}

.document-template-designer .template-canvas-form-field-expression-preview small {
    overflow-wrap: anywhere;
    color: inherit;
}

.document-template-designer .template-canvas-element.photo-gallery {
    min-width: 0;
    padding: 0;
    background: #fff;
}

.document-template-designer .template-canvas-photo-gallery {
    position: absolute;
    inset: 0;
    display: block;
    overflow: hidden;
    background: #fff;
    pointer-events: none;
}

.document-template-designer .template-canvas-photo-gallery-cell {
    position: absolute;
    display: block;
    overflow: hidden;
    border: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.document-template-designer .template-canvas-photo-gallery-cell img {
    width: 100%;
    display: block;
    background: #ecebea;
}

.document-template-designer .template-canvas-photo-gallery-caption {
    position: absolute;
    right: 0;
    left: 0;
    display: block;
    overflow: hidden;
    padding: 2px 3px;
    border-top: 1px solid #c1c7d2;
    background: #fff;
    color: #1a1c1c;
    font-size: 7px;
    line-height: 1.25;
    text-align: left;
}

.document-template-designer .template-canvas-photo-gallery.missing {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px dashed #8f98a6;
    color: #596273;
    font-size: 9px;
}

.document-template-designer .template-canvas-style-grid,
.document-template-designer .template-canvas-geometry-grid,
.document-template-designer .template-document-settings-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    padding: 8px;
}

.document-template-designer .template-canvas-style-grid label,
.document-template-designer .template-canvas-geometry-grid label,
.document-template-designer .template-document-settings-grid label {
    min-width: 0;
    padding: 0;
}

.document-template-designer .template-canvas-style-toolbar {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 5px 8px;
}

.document-template-designer .template-canvas-style-toolbar button {
    width: 24px;
    min-width: 24px;
    height: 22px;
    min-height: 22px;
    border: 1px solid #c1c7d2;
    border-radius: 0;
    background: #faf9f8;
    color: #414750;
}

.document-template-designer .template-canvas-inspector-actions,
.document-template-designer .template-document-settings-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px;
    border-top: 1px solid #c1c7d2;
}

.document-template-designer [class*="template-canvas-table-binding-artifact"],
.document-template-designer [class*="template-cleanup-"] {
    display: none;
}

.document-template-designer .template-designer-bottom {
    display: none !important;
}

.document-template-designer.preview-active {
    grid-template-rows: var(--template-designer-topbar-h) var(--template-designer-toolbar-h) minmax(0, 1fr);
}

.document-template-designer.preview-active .template-left-panel,
.document-template-designer.preview-active .template-right-panel,
.document-template-designer.preview-active .template-tabs-left,
.document-template-designer.preview-active .template-tabs-right {
    display: initial;
}

.document-template-designer.preview-active .template-designer-workspace {
    grid-template-columns: var(--template-designer-left-w) minmax(0, 1fr) var(--template-designer-right-w);
}

@media (max-width: 1220px) {
    .document-template-designer {
        min-width: 1080px;
    }

    .document-template-designer .template-preview-switch span:first-child {
        display: none;
    }

    .document-template-designer .template-designer-actions {
        gap: 4px;
    }

    .document-template-designer .template-btn {
        padding: 0 6px;
    }
}

/* WYSIWYG sample projection and palette drop behavior use the same millimeter canvas. */
.document-template-designer .template-page-content {
    position: absolute;
    inset: 0;
    display: block;
    color: var(--template-document-text, #111827);
}

.document-template-designer .template-page-header,
.document-template-designer .template-page-footer,
.document-template-designer .template-page-placeholder,
.document-template-designer .template-position-zone {
    display: none;
}

.document-template-designer [data-document-template-palette-drag]:not(:disabled) {
    cursor: grab;
}

.document-template-designer [data-document-template-palette-drag]:not(:disabled):active {
    cursor: grabbing;
}

.template-canvas-drop-overlay {
    position: absolute;
    inset: 0;
    z-index: 120;
    overflow: hidden;
    outline: 2px solid #0f63ff;
    outline-offset: -2px;
    background: rgb(219 234 254 / 16%);
}

.template-canvas-drop-instruction {
    position: absolute;
    top: 10px;
    left: 50%;
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    transform: translateX(-50%);
    border: 1px solid #0f63ff;
    padding: 0 8px;
    background: #fff;
    color: #0b57d0;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
    pointer-events: none;
}

.template-canvas-drop-preview {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    overflow: hidden;
    border: 2px solid #0f63ff;
    background: rgb(219 234 254 / 72%);
    color: #0b3b70;
    font-size: 10px;
    font-weight: 800;
    text-align: center;
    pointer-events: none;
}

.template-canvas-drop-preview .material-symbols-outlined {
    font-size: 15px;
}

.document-template-designer .template-canvas-element.sample-table {
    align-items: stretch;
    padding: 0;
    background: #fff;
    white-space: normal;
}

.template-canvas-sample-table {
    height: 100%;
    min-height: 0;
    background: #fff;
    pointer-events: none;
}

.template-canvas-sample-table .template-canvas-table-head,
.template-canvas-sample-table .template-canvas-table-cell {
    min-height: 15px;
    padding: 2px 4px;
    font-size: 8px;
    font-weight: 500;
}

.template-canvas-sample-table .template-canvas-table-head {
    border-top: 1px solid #1f2937;
    border-bottom-color: #1f2937;
    background: #f4f3f2;
    font-weight: 800;
}

.document-template-designer .template-canvas-element.summary .template-canvas-element-label {
    white-space: pre-wrap;
    line-height: 1.45;
}

/* Document template editor hardening: precise controls without changing document data. */
.document-template-designer .template-toolbar-center {
    justify-content: center;
    gap: 10px;
}

.document-template-designer .template-tool-group select[data-document-template-canvas-grid-size-toolbar] {
    width: 58px;
    min-width: 58px;
    max-width: 58px;
}

.document-template-designer .template-tool-group select[data-document-template-canvas-zoom-select] {
    width: 106px;
    min-width: 106px;
    max-width: 106px;
    border: 1px solid transparent;
    padding-inline: 5px;
}

.document-template-designer .template-tool-group select[data-document-template-canvas-zoom-select]:hover,
.document-template-designer .template-tool-group select[data-document-template-canvas-grid-size-toolbar]:hover {
    border-color: #c1c7d2;
    background: #fff;
}

.document-template-designer .template-page {
    background-image: none;
}

.document-template-designer .template-page.show-grid {
    background-image:
        linear-gradient(to right, rgba(0, 66, 119, .10) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(0, 66, 119, .10) 1px, transparent 1px);
    background-size: var(--template-grid-size, 14.61px) var(--template-grid-size, 14.61px);
}

.document-template-designer .template-canvas-snap-guide {
    position: absolute;
    z-index: 80;
    display: block;
    pointer-events: none;
}

.document-template-designer .template-canvas-snap-guide.vertical {
    top: 0;
    bottom: 0;
    width: 0;
    border-left: 1px solid #d92d20;
}

.document-template-designer .template-canvas-snap-guide.horizontal {
    right: 0;
    left: 0;
    height: 0;
    border-top: 1px solid #d92d20;
}

.document-template-designer .template-canvas-snap-guide small {
    position: absolute;
    display: block;
    width: max-content;
    max-width: 150px;
    overflow: hidden;
    border-radius: 2px;
    padding: 2px 4px;
    background: #d92d20;
    color: #fff;
    font: 600 8px/11px "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-template-designer .template-canvas-snap-guide.vertical small {
    top: 4px;
    left: 3px;
}

.document-template-designer .template-canvas-snap-guide.horizontal small {
    top: 3px;
    left: 4px;
}

.document-template-designer .template-canvas-element.dragging,
.document-template-designer .template-canvas-element:focus-visible {
    outline: 2px solid rgba(0, 66, 119, .32);
    outline-offset: 2px;
}

.document-template-designer .template-canvas-resize {
    right: -6px;
    bottom: -6px;
    width: 11px;
    height: 11px;
    border: 2px solid #004277;
    box-shadow: 0 0 0 1px #fff;
}

.document-template-designer .template-inspector-tabs {
    position: sticky;
    top: 0;
    z-index: 8;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    flex: 0 0 auto;
    border-bottom: 1px solid #c1c7d2;
    background: #f4f3f2;
}

.document-template-designer .template-inspector-tabs button {
    min-width: 0;
    min-height: 31px;
    border: 0;
    border-right: 1px solid #d8dde6;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 0 3px;
    background: transparent;
    color: #414750;
    font: 600 8px/12px "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
    text-transform: uppercase;
}

.document-template-designer .template-inspector-tabs button:last-child {
    border-right: 0;
}

.document-template-designer .template-inspector-tabs button:hover,
.document-template-designer .template-inspector-tabs button.active {
    border-bottom-color: #004277;
    background: #fff;
    color: #004277;
}

.document-template-designer .template-canvas-inspector[data-inspector-tab="content"] [data-document-template-inspector-panel]:not([data-document-template-inspector-panel="content"]),
.document-template-designer .template-canvas-inspector[data-inspector-tab="layout"] [data-document-template-inspector-panel]:not([data-document-template-inspector-panel="layout"]),
.document-template-designer .template-canvas-inspector[data-inspector-tab="appearance"] [data-document-template-inspector-panel]:not([data-document-template-inspector-panel="appearance"]),
.document-template-designer .template-canvas-inspector[data-inspector-tab="advanced"] [data-document-template-inspector-panel]:not([data-document-template-inspector-panel="advanced"]) {
    display: none;
}

.document-template-designer .template-canvas-element-actions {
    position: sticky;
    bottom: 0;
    z-index: 7;
    border-top: 1px solid #c1c7d2;
    padding: 7px 8px;
    background: #faf9f8;
}

.template-empty-layout-state {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 9px;
    padding: 36px;
    color: #536273;
    text-align: center;
}

.template-empty-layout-state > .material-symbols-outlined {
    color: #8a98a8;
    font-size: 34px;
}

.template-empty-layout-state > strong {
    color: #243242;
    font-size: 14px;
}

.template-empty-layout-state > p {
    max-width: 390px;
    margin: 0;
    font-size: 11px;
    line-height: 1.45;
}

.template-empty-layout-state > .template-btn {
    margin-top: 5px;
}

.document-template-designer.preview-active .template-left-panel {
    display: flex !important;
}

.document-template-designer.preview-active .template-right-panel {
    display: flex !important;
}

.document-template-designer.preview-active .template-tabs-left,
.document-template-designer.preview-active .template-tabs-right {
    display: flex !important;
}

.document-template-designer.preview-active .template-designer-workspace {
    grid-template-columns: var(--template-designer-left-w) minmax(0, 1fr) var(--template-designer-right-w) !important;
}

.document-template-designer .template-preview-html {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.document-template-designer .template-preview-html > .document-template-layout-page {
    transform: scale(.96625);
    transform-origin: top left;
}

/* Plantafel parity: final overrides follow the ERP-Hauptdummy Gantt surface. */
[data-view="planning-board"].plantafel-buildpro-view.active {
    display: flex;
    flex-direction: column;
    min-height: 720px;
    overflow: auto;
    row-gap: 0;
    padding: 24px;
    background: #faf9f8;
    color: #1a1c1c;
    font-family: "Inter", sans-serif;
    font-size: 11px;
    line-height: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
    order: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    min-height: 0;
    margin: 0 0 24px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-title {
    flex: 0 0 280px;
    min-width: 280px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
    display: flex;
    flex: 1 1 auto;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    width: min(100%, 760px);
    max-width: 760px;
    gap: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-search {
    order: 1;
    min-width: 192px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-select {
    min-width: 128px;
}

[data-view="planning-board"].plantafel-buildpro-view [data-planning-range] {
    order: 2;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment {
    order: 3;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-segment button {
    min-width: 54px;
}

[data-view="planning-board"].plantafel-buildpro-view [data-planning-project-filter] {
    order: 4;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-zoom {
    order: 5;
    gap: 8px;
    padding: 0 8px;
}

[data-view="planning-board"].plantafel-buildpro-view [data-planning-person-filter] {
    order: 6;
    min-width: 140px;
}

[data-view="planning-board"].plantafel-buildpro-view [data-planning-archive-filter] {
    order: 7;
    width: 82px;
    min-width: 82px;
    padding-left: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-primary {
    order: 8;
    padding: 0 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-icon {
    order: 9;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-chips {
    order: 1;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 0;
    margin: 0 0 24px;
    border: 0;
    background: transparent;
    padding: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-chips > span,
[data-view="planning-board"].plantafel-buildpro-view .planning-filter-chips > button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 24px;
    border: 1px solid #c1c7d2;
    border-radius: 999px;
    background: #fff;
    padding: 0 12px;
    color: #414750;
    font-size: 10px;
    font-weight: 700;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-chips .material-symbols-outlined {
    font-size: 14px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-intake,
[data-view="planning-board"].plantafel-buildpro-view .planning-portfolio-strip {
    display: none !important;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board {
    order: 2;
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: transparent;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card > h2 {
    margin-top: 24px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
    grid-template-columns: 380px minmax(0, 1fr);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-head {
    height: 72px;
    min-height: 72px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.group {
    background: rgba(0, 66, 119, 0.05);
    color: #1a1c1c;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.group .material-symbols-outlined,
[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.person .material-symbols-outlined {
    flex: 0 0 auto;
    margin: 0;
    color: #727782;
    font-size: 16px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.group > span:first-child,
[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.person > span:first-child {
    gap: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-group-cell {
    justify-content: space-between;
    gap: 4px !important;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-group-toggle {
    display: flex;
    align-items: center;
    min-width: 0;
    flex: 1 1 auto;
    gap: 8px;
    height: 100%;
    border: 0;
    background: transparent;
    padding: 0;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-group-toggle strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-group-label {
    min-width: 0;
    display: grid;
    gap: 1px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-group-label small {
    overflow: hidden;
    color: #605e5c;
    font-size: 8px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-inline-add {
    display: inline-grid;
    place-items: center;
    align-self: center;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    margin-inline: auto 1px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #727782;
    line-height: 1;
    cursor: pointer;
    opacity: 0.72;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-inline-add .material-symbols-outlined {
    color: inherit !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-inline-add:hover,
[data-view="planning-board"].plantafel-buildpro-view .planning-project-inline-add:focus-visible {
    border-color: #9fc5df;
    background: #fff;
    color: #005a91;
    opacity: 1;
    outline: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-group-toggle:focus-visible {
    outline: 2px solid #78aeda;
    outline-offset: -2px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.item > span:first-child {
    padding-left: 40px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.item > span:first-child strong {
    min-width: 0;
    overflow: hidden;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.empty {
    min-height: 48px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-left-row.empty.is-loading {
    color: #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-months,
[data-view="planning-board"].plantafel-buildpro-view .erp-weeks,
[data-view="planning-board"].plantafel-buildpro-view .erp-days,
[data-view="planning-board"].plantafel-buildpro-view .erp-timeline {
    min-width: max(760px, calc(var(--planning-day-units, 7) * var(--planning-day-size, 92px)));
    grid-template-columns: repeat(var(--planning-day-units, 7), minmax(var(--planning-day-size, 92px), 1fr));
}

[data-view="planning-board"].plantafel-buildpro-view .erp-months,
[data-view="planning-board"].plantafel-buildpro-view .erp-weeks {
    display: grid;
    height: 20px;
    min-height: 20px;
    border-bottom: 1px solid #e3e2e1;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-months {
    background: #f4f3f2;
    color: #1a1c1c;
    font-size: 9px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-weeks {
    background: rgba(244, 243, 242, 0.5);
    color: #727782;
    font-size: 8px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-months span,
[data-view="planning-board"].plantafel-buildpro-view .erp-weeks span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    overflow: hidden;
    border-right: 1px solid rgba(193, 199, 210, 0.3);
    line-height: 1;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days {
    display: grid;
    height: 32px;
    min-height: 32px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span {
    flex-direction: column;
    gap: 2px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days b,
[data-view="planning-board"].plantafel-buildpro-view .erp-days small {
    display: block;
    width: 100%;
    text-align: center;
    line-height: 1;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days b {
    color: #727782;
    font-size: 8px;
    font-weight: 500;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days small {
    color: #1a1c1c;
    font-size: 9px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-weekend {
    background: #f4f3f2;
    color: #727782;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-week-end {
    border-right-color: #c1c7d2;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-month-end {
    border-right: 2px solid #727782;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-today {
    background: rgba(0, 66, 119, 0.08);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-today b,
[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-today small {
    color: #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-timeline {
    min-height: calc(var(--planning-row-count, 6) * 32px);
    grid-auto-rows: 32px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.total {
    padding: 0 8px;
    pointer-events: auto;
    overflow: clip;
    border-color: #1a1c1c;
    border-radius: 4px;
    background: #1a1c1c !important;
    color: #fff;
    cursor: pointer;
    font: inherit;
    text-align: left;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.total .planning-bar-label {
    position: sticky;
    left: 8px;
    max-width: min(360px, calc(100vw - 640px));
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar.total:hover,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar.total:focus-visible {
    border-color: #4b5563;
    background: #30363d !important;
    outline: 2px solid rgba(120, 174, 218, 0.75);
    outline-offset: 1px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-months,
[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-weeks,
[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-days {
    display: grid;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-footer {
    margin-top: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 890;
    display: block;
    background: rgba(26, 28, 28, 0.48);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-inline {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 900;
    width: min(760px, calc(100vw - 48px));
    max-height: calc(100vh - 48px);
    margin: 0;
    overflow: auto;
    transform: translate(-50%, -50%);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-settings-modal,
[data-view="planning-board"].plantafel-buildpro-view .planning-export-modal,
[data-view="planning-board"].plantafel-buildpro-view .planning-cancel-modal,
[data-view="planning-board"].plantafel-buildpro-view .planning-reopen-modal,
[data-view="planning-board"].plantafel-buildpro-view .planning-schedule-modal {
    width: min(640px, calc(100vw - 48px));
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-bar-modal {
    width: min(860px, calc(100vw - 48px));
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-bar-form {
    padding: 16px 18px 4px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-period-field {
    grid-column: 1 / -1;
    min-width: 0;
    margin: 0;
    padding: 10px 12px 12px;
    border: 1px solid #c7d0da;
    border-radius: 2px;
    background: #f8fafc;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-period-field legend {
    padding: 0 5px;
    color: #344454;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-period-grid {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) minmax(112px, 0.65fr) minmax(150px, 1fr) minmax(112px, 0.65fr);
    gap: 10px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-period-field > p {
    margin: 8px 0 0;
    color: #657686;
    font-size: 10px;
    line-height: 1.4;
    text-transform: none;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-field {
    min-width: 0;
    margin: 0;
    padding: 10px 12px 12px;
    border: 1px solid #c7d0da;
    border-radius: 2px;
    background: #f8fafc;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-field legend {
    padding: 0 5px;
    color: #344454;
    font-size: 11px;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-field > p {
    margin: 0 0 8px;
    color: #657686;
    font-size: 10px;
    line-height: 1.4;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list {
    max-height: 174px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: 32px;
    gap: 3px;
    padding-right: 3px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #aeb9c5 transparent;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list label {
    min-width: 0;
    min-height: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 3px 7px;
    border: 1px solid #d8dee6;
    border-radius: 2px;
    background: #fff;
    cursor: pointer;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list label:hover {
    border-color: #7ca9c8;
    background: #f3f8fb;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list input {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list span {
    min-width: 0;
    display: grid;
    gap: 1px;
    line-height: 1;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list strong,
[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list strong {
    color: #263645;
    font-size: 10px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list small {
    color: #657686;
    font-size: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list::-webkit-scrollbar {
    width: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-team-list::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 8px;
    background: #aeb9c5;
    background-clip: padding-box;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-project-bar-modal .modal-actions {
    margin-top: 16px;
    padding: 12px 18px;
    border-top: 1px solid #c1c7d2;
}

@media (max-width: 760px) {
    [data-view="planning-board"].plantafel-buildpro-view .planning-project-period-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-inline .modal-head {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fff;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-project-context {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 14px 14px 0;
    border: 1px solid #c9d9e5;
    border-left: 3px solid #0067a8;
    background: #f5f9fc;
    padding: 9px 11px;
    color: #263645;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-project-context > .material-symbols-outlined {
    color: #0067a8;
    font-size: 20px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-project-context > span:last-child {
    display: grid;
    gap: 1px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-project-context small {
    color: #657686;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-modal-project-context strong {
    font-size: 12px;
}

@media (max-width: 1180px) {
    [data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
        flex-direction: column;
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
        justify-content: flex-start;
        width: 100%;
        max-width: none;
    }
}

/* Final cascade for the professional Plantafel extensions. */
[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 16px;
    margin-bottom: 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-title {
    flex-basis: 240px;
    min-width: 240px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
    width: 100%;
    max-width: none;
    gap: 6px;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-filter-chips {
    margin-bottom: 8px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board {
    order: 3;
    gap: 12px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-card {
    order: 2;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
    grid-template-columns: 420px minmax(0, 1fr);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-head,
[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row {
    grid-template-columns: minmax(0, 1fr) 82px 150px 34px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row {
    height: 40px;
    min-height: 40px;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline {
    min-height: calc(var(--planning-row-count, 6) * 40px);
    grid-auto-rows: 40px;
}

@media (max-width: 1300px) {
    [data-view="planning-board"].plantafel-buildpro-view .plantafel-demo-header {
        grid-template-columns: 1fr;
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-board-toolbar {
        justify-content: flex-start;
    }

}

@media (max-width: 1050px) {
    [data-view="planning-board"].plantafel-buildpro-view.active {
        min-width: 900px;
        padding: 16px;
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
        grid-template-columns: 340px minmax(0, 1fr);
    }

    [data-view="planning-board"].plantafel-buildpro-view .erp-resource-head,
    [data-view="planning-board"].plantafel-buildpro-view .erp-resource-board .erp-left-row {
        grid-template-columns: minmax(0, 1fr) 68px 118px 30px;
    }
}

/* Plantafel interaction and geometry hardening. */
[data-view="planning-board"].plantafel-buildpro-view {
    --planning-zoom: 1;
    --planning-zoomed-day-size: var(--planning-day-size, 92px);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-grid,
[data-view="planning-board"].plantafel-buildpro-view .erp-board-left,
[data-view="planning-board"].plantafel-buildpro-view .erp-gantt {
    min-width: 0;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-board-grid {
    align-items: stretch;
    max-width: 100%;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-project-board.is-project-pane-collapsed {
    grid-template-columns: minmax(0, 1fr);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-project-board.is-project-pane-collapsed .erp-gantt {
    grid-column: 1;
    width: 100%;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-gantt {
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
    cursor: grab;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-gantt.is-panning,
[data-view="planning-board"].plantafel-buildpro-view.is-gantt-panning .erp-gantt {
    cursor: grabbing;
}

[data-view="planning-board"].plantafel-buildpro-view.is-timeline-extending .erp-gantt {
    cursor: progress;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-months,
[data-view="planning-board"].plantafel-buildpro-view .erp-weeks,
[data-view="planning-board"].plantafel-buildpro-view .erp-days,
[data-view="planning-board"].plantafel-buildpro-view .erp-timeline {
    width: calc(var(--planning-day-units, 7) * var(--planning-zoomed-day-size, 92px));
    min-width: calc(var(--planning-day-units, 7) * var(--planning-zoomed-day-size, 92px));
    box-sizing: border-box;
    grid-template-columns: repeat(var(--planning-day-units, 7), var(--planning-zoomed-day-size, 92px));
}

[data-view="planning-board"].plantafel-buildpro-view.is-gantt-zooming .erp-months,
[data-view="planning-board"].plantafel-buildpro-view.is-gantt-zooming .erp-weeks,
[data-view="planning-board"].plantafel-buildpro-view.is-gantt-zooming .erp-days,
[data-view="planning-board"].plantafel-buildpro-view.is-gantt-zooming .erp-timeline {
    will-change: width;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-school-holiday {
    background: rgba(255, 243, 196, 0.58);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-school-holiday b,
[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-school-holiday small {
    color: #8a6510;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-holiday b {
    color: #9d2f2f;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-holiday small {
    color: #d0342c;
    font-weight: 800;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-holiday.is-school-holiday small {
    color: #d0342c;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-days span.is-today {
    box-shadow: inset 0 -2px #004277;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-day-band.erp-school-holiday-band {
    z-index: 1;
    border-left: 1px solid rgba(214, 158, 46, 0.2);
    background: rgba(255, 243, 196, 0.4);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-day-band.erp-holiday-band {
    z-index: 2;
    border-left: 1px solid rgba(224, 82, 82, 0.24);
    border-right: 1px solid rgba(224, 82, 82, 0.12);
    background:
        repeating-linear-gradient(
            135deg,
            rgba(255, 232, 232, 0.68) 0 8px,
            rgba(255, 246, 246, 0.38) 8px 16px);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-bar-resize-handle {
    width: 14px;
    border: 0;
    background: transparent;
}

[data-view="planning-board"].plantafel-buildpro-view .planning-bar-resize-handle::after {
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: 6px;
    width: 2px;
    border-radius: 1px;
    background: currentColor;
    content: "";
    opacity: 0.72;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar:hover .planning-bar-resize-handle,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar:focus-visible .planning-bar-resize-handle,
[data-view="planning-board"].plantafel-buildpro-view .erp-bar.is-dragging .planning-bar-resize-handle {
    opacity: 1;
    pointer-events: auto;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-bar[data-planning-drag-item]:not([data-planning-readonly="true"]) {
    touch-action: none;
}

[data-view="planning-board"][data-planning-view="day"].plantafel-buildpro-view
    .erp-board-card.is-drag-mode
    .erp-bar[data-planning-drag-item]:not([data-planning-readonly="true"])
    .planning-bar-resize-handle {
    display: block;
    pointer-events: auto;
}

[data-view="planning-board"].plantafel-buildpro-view .erp-timeline {
    grid-template-columns:
        repeat(
            var(--planning-quarter-units, 28),
            calc(var(--planning-zoomed-day-size, 92px) / 4));
    background:
        repeating-linear-gradient(
            to right,
            transparent 0,
            transparent calc((var(--planning-zoomed-day-size, 92px) / 4) - 1px),
            rgba(193, 199, 210, 0.22) calc((var(--planning-zoomed-day-size, 92px) / 4) - 1px),
            rgba(193, 199, 210, 0.22) calc(var(--planning-zoomed-day-size, 92px) / 4)),
        repeating-linear-gradient(
            to right,
            transparent 0,
            transparent calc(var(--planning-zoomed-day-size, 92px) - 1px),
            #d2d7de calc(var(--planning-zoomed-day-size, 92px) - 1px),
            #d2d7de var(--planning-zoomed-day-size, 92px)),
        repeating-linear-gradient(
            to bottom,
            transparent 0,
            transparent 31px,
            #efeeed 31px,
            #efeeed 32px);
}

[data-view="planning-board"].plantafel-buildpro-view .erp-resource-timeline {
    background:
        repeating-linear-gradient(
            to right,
            transparent 0,
            transparent calc((var(--planning-zoomed-day-size, 92px) / 4) - 1px),
            rgba(193, 199, 210, 0.22) calc((var(--planning-zoomed-day-size, 92px) / 4) - 1px),
            rgba(193, 199, 210, 0.22) calc(var(--planning-zoomed-day-size, 92px) / 4)),
        repeating-linear-gradient(
            to right,
            transparent 0,
            transparent calc(var(--planning-zoomed-day-size, 92px) - 1px),
            #d2d7de calc(var(--planning-zoomed-day-size, 92px) - 1px),
            #d2d7de var(--planning-zoomed-day-size, 92px)),
        repeating-linear-gradient(
            to bottom,
            transparent 0,
            transparent 39px,
            #e8ebef 39px,
            #e8ebef 40px);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-day-band,
[data-view="planning-board"].plantafel-buildpro-view .planning-capacity-day {
    grid-column: var(--start) / span var(--span, 4);
}

[data-view="planning-board"].plantafel-buildpro-view .planning-today-line {
    width: 2px;
    margin-left: calc(var(--planning-today-offset, 0px) - 1px);
    background: #ba1a1a;
    pointer-events: none;
}
.project-takeoff-summary {
    border: 1px solid #c8d0da;
    background: #fff;
}

.project-takeoff-summary-head {
    min-height: 46px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #c8d0da;
    background: #f4f3f2;
}

.project-takeoff-summary-head > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.project-takeoff-summary-head h3 {
    margin: 0;
    color: #202a35;
    font-size: 14px;
    font-weight: 700;
}

.project-takeoff-summary-head span,
.project-takeoff-summary-head small {
    color: #657386;
    font-size: 11px;
}

.project-takeoff-position-list {
    display: grid;
}

.project-takeoff-position {
    border-bottom: 1px solid #d7dde5;
}

.project-takeoff-position:last-child {
    border-bottom: 0;
}

.project-takeoff-position-head {
    width: 100%;
    min-height: 42px;
    padding: 5px 10px;
    display: grid;
    grid-template-columns: minmax(80px, 120px) minmax(240px, 1fr) 96px 96px 112px 24px;
    align-items: center;
    gap: 10px;
    border: 0;
    border-radius: 0;
    background: #f8fafc;
    color: #202a35;
    text-align: left;
}

.project-takeoff-position-head:hover,
.project-takeoff-position-head:focus-visible {
    background: #e8f2fb;
}

.project-takeoff-position-number {
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
    font-weight: 700;
}

.project-takeoff-position-title {
    min-width: 0;
    overflow: hidden;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-takeoff-position-quantity {
    display: grid;
    justify-items: end;
    gap: 1px;
}

.project-takeoff-position-quantity small {
    color: #657386;
    font-size: 9px;
    text-transform: uppercase;
}

.project-takeoff-position-quantity strong {
    font-size: 11px;
}

.project-takeoff-position-difference {
    padding-left: 10px;
    border-left: 1px solid #d7dde5;
}

.project-takeoff-position-difference strong {
    color: #005a9e;
}

.project-takeoff-position-head > .material-symbols-outlined {
    color: #005a9e;
    font-size: 17px;
}

.project-takeoff-export-feedback {
    min-height: 34px;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    gap: 7px;
    border-bottom: 1px solid #c8d0da;
    font-size: 11px;
}

.project-takeoff-export-feedback > .material-symbols-outlined {
    font-size: 17px;
}

.project-takeoff-export-feedback.is-success {
    background: #edf7f0;
    color: #176a37;
}

.project-takeoff-export-feedback.is-error {
    background: #fff1f1;
    color: #a4262c;
}

.project-takeoff-sheets {
    display: grid;
    background: #fff;
}

.project-takeoff-sheet {
    min-height: 40px;
    padding: 4px 10px 4px 28px;
    display: grid;
    grid-template-columns:
        20px
        minmax(105px, .7fr)
        84px
        minmax(105px, .75fr)
        minmax(125px, 1fr)
        100px
        112px
        auto;
    align-items: center;
    gap: 8px;
    border-top: 1px solid #edf0f4;
    color: #465466;
    font-size: 11px;
}

.project-takeoff-sheet-icon {
    color: #2676ac;
    font-size: 16px;
}

.project-takeoff-sheet-main {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.project-takeoff-sheet-main strong,
.project-takeoff-sheet-main span,
.project-takeoff-sheet-reference {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-takeoff-sheet-main strong {
    color: #273548;
}

.project-takeoff-sheet-main span,
.project-takeoff-sheet-reference,
.project-takeoff-sheet time {
    color: #657386;
    font-size: 10px;
}

.project-takeoff-sheet-status {
    width: fit-content;
    padding: 2px 6px;
    border: 1px solid #c4ccd6;
    border-radius: 8px;
    background: #f3f5f7;
    color: #536173;
    font-size: 9px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
}

.project-takeoff-sheet-status.is-created {
    border-color: #9fd3ad;
    background: #edf7f0;
    color: #176a37;
}

.project-takeoff-sheet-status.is-transferred {
    border-color: #9fc3df;
    background: #edf5fb;
    color: #005a8c;
}

.project-takeoff-sheet-status.is-warning {
    border-color: #e2c06e;
    background: #fff8e6;
    color: #7c5700;
}

.project-takeoff-sheet-quantity,
.project-takeoff-sheet time {
    text-align: right;
}

.project-takeoff-sheet-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}

.project-takeoff-sheet-actions button {
    width: 36px;
    height: 28px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 1px solid #b9c5d2;
    border-radius: 4px;
    background: #fff;
    color: #005a8c;
    font-size: 9px;
    font-weight: 700;
    cursor: pointer;
}

.project-takeoff-sheet-actions button:hover:not(:disabled),
.project-takeoff-sheet-actions button:focus-visible:not(:disabled) {
    border-color: #005a8c;
    background: #edf5fb;
}

.project-takeoff-sheet-actions button:disabled {
    color: #9aa4af;
    cursor: not-allowed;
    opacity: .7;
}

.project-takeoff-sheet-actions .material-symbols-outlined {
    font-size: 16px;
}

.project-takeoff-summary-state {
    min-height: 76px;
    padding: 18px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 4px;
    color: #657386;
    font-size: 11px;
    text-align: center;
}

.project-takeoff-summary-state > .material-symbols-outlined {
    color: #2676ac;
    font-size: 22px;
}

.project-takeoff-summary-state.is-error,
.project-takeoff-summary-state.is-error > .material-symbols-outlined {
    color: #a4262c;
}

@media (max-width: 1100px) {
    .project-takeoff-position-head {
        grid-template-columns: 90px minmax(180px, 1fr) 76px 76px 92px 20px;
    }

    .project-takeoff-sheet {
        grid-template-columns: 18px minmax(110px, 1fr) 78px minmax(120px, .8fr) 92px auto;
    }

    .project-takeoff-sheet-reference + .project-takeoff-sheet-reference,
    .project-takeoff-sheet time {
        display: none;
    }
}