/* Global application typography */
:root {
    --app-font-sans: "Inter", "Söhne", "OpenAI Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    --app-text-color: #2d2d2f;
    --app-muted-color: #6f747b;
    --bs-font-sans-serif: var(--app-font-sans);
    --bs-body-font-family: var(--app-font-sans);
    --bs-body-color: var(--app-text-color);
    --bs-secondary-color: var(--app-muted-color);
}

html,
body {
    font-family: var(--app-font-sans);
    color: var(--app-text-color);
    font-size: 16px;
    line-height: 1.55;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-feature-settings: "kern" 1, "liga" 1;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    color: #202123;
    font-family: var(--app-font-sans);
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.12;
}

h1,
.h1 {
    font-weight: 700;
}

.text-body-secondary,
.text-muted,
small,
.small {
    color: var(--app-muted-color) !important;
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
}

.btn,
.form-control,
.form-select,
.dropdown-menu,
.navbar,
.card,
.alert {
    font-family: var(--app-font-sans);
}

.form-control,
.form-select,
.btn {
    letter-spacing: 0;
}

input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.alert.alert-warning {
    padding: 0.45rem 0.65rem;
    margin-bottom: 0.65rem;
    font-size: 0.875rem;
    line-height: 1.25;
}

.app-confirm-modal .modal-content {
    border-radius: 0.45rem;
    box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.18);
}

.app-confirm-modal .modal-title {
    font-size: 1rem;
    font-weight: 650;
}

.app-confirm-modal .modal-body {
    font-size: 0.92rem;
    line-height: 1.35;
    padding-bottom: 0.65rem;
    padding-top: 0.65rem;
}


.app-datasheet-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
}


.py-3:has(> .app-breadcrumb + .app-datasheet-toolbar) {
    padding-top: 0.35rem !important;
}

body:has(main .app-compact-breadcrumb) main {
    padding-top: 1.95rem;
}

body:has(main .app-compact-breadcrumb) .app-work-context-bar {
    background: transparent;
    border: 0;
    color: var(--app-muted-color);
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 400;
    line-height: 1.25;
    padding: 0.25rem 0;
    pointer-events: none;
    position: fixed;
    right: 0.75rem;
    top: 38px;
    width: min(46vw, 42rem);
    z-index: 1021;
}

body:has(main .app-compact-breadcrumb) .app-work-context-main {
    pointer-events: auto;
}

body:has(main .app-compact-breadcrumb) .app-work-context-bar > .container-fluid {
    display: flex !important;
    justify-content: flex-end !important;
    padding-left: 0;
    padding-right: 0;
}

body:has(main .app-compact-breadcrumb) .app-work-context-main {
    flex-wrap: nowrap;
    font-weight: 400;
    justify-content: flex-end;
    width: 100%;
}

body:has(main .app-compact-breadcrumb) .app-work-context-main span {
    max-width: min(22rem, 28vw);
}

.app-breadcrumb.app-compact-breadcrumb,
.app-breadcrumb:has(+ .app-datasheet-toolbar) {
    background: #fff;
    border-bottom: 1px solid var(--bs-border-color);
    border-left: 3px solid var(--bs-primary);
    box-sizing: border-box;
    flex-wrap: nowrap;
    font-size: 0.78rem;
    gap: 0.35rem;
    left: 0;
    line-height: 1.25;
    margin: 0 !important;
    min-height: 1.7rem;
    overflow: hidden;
    padding: 0.25rem min(48vw, 44rem) 0.25rem 0.75rem;
    position: fixed;
    right: 0;
    top: 38px;
    z-index: 1020;
}

.app-breadcrumb:has(+ .app-datasheet-toolbar) + .app-datasheet-toolbar {
    display: none;
}


.app-compact-breadcrumb a,
.app-compact-breadcrumb .app-breadcrumb-separator,
.app-breadcrumb:has(+ .app-datasheet-toolbar) a,
.app-breadcrumb:has(+ .app-datasheet-toolbar) .app-breadcrumb-separator {
    flex: 0 0 auto;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
}

.app-compact-breadcrumb .app-breadcrumb-current,
.app-breadcrumb:has(+ .app-datasheet-toolbar) .app-breadcrumb-current {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-compact-breadcrumb .app-breadcrumb-separator,
.app-breadcrumb:has(+ .app-datasheet-toolbar) .app-breadcrumb-separator {
    font-size: 1rem;
}

.app-compact-breadcrumb .app-breadcrumb-separator,
.app-breadcrumb:has(+ .app-datasheet-toolbar) .app-breadcrumb-separator {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}

.app-compact-breadcrumb a + .app-breadcrumb-separator,
.app-breadcrumb:has(+ .app-datasheet-toolbar) a + .app-breadcrumb-separator {
    margin-left: 0.35rem;
}

.app-compact-breadcrumb .app-breadcrumb-separator + a,
.app-compact-breadcrumb .app-breadcrumb-separator + .app-breadcrumb-current,
.app-breadcrumb:has(+ .app-datasheet-toolbar) .app-breadcrumb-separator + a,
.app-breadcrumb:has(+ .app-datasheet-toolbar) .app-breadcrumb-separator + .app-breadcrumb-current {
    margin-left: 0.1rem;
}

@media (max-width: 768px) {
    body:has(main .app-compact-breadcrumb) main {
        padding-top: 2.15rem;
    }

    body:has(main .app-compact-breadcrumb) .app-work-context-bar {
        right: 0.5rem;
        top: 44px;
        width: 44vw;
    }

    body:has(main .app-compact-breadcrumb) .app-work-context-main span {
        max-width: 21vw;
    }

.app-breadcrumb.app-compact-breadcrumb,
.app-breadcrumb:has(+ .app-datasheet-toolbar) {
        padding-right: 46vw;
        top: 44px;
    }
}

.app-datasheet-wrap {
    max-height: calc(100vh - 8.75rem);
    overflow: auto;
}

.app-small-datasheet-wrap {
    max-width: 100%;
    width: fit-content;
}

.app-small-datasheet-wrap .app-datasheet {
    margin-left: 0;
    margin-right: 0;
}

.app-datasheet-grid-wrap {
    overflow-x: hidden;
    width: 100%;
}

@media (max-width: 991.98px) {
    .app-small-datasheet-wrap {
        width: 100%;
    }

    .app-small-datasheet-wrap .app-datasheet {
        min-width: 100%;
    }
}

.app-dynamic-datasheet {
    font-size: var(--app-dynamic-datasheet-font-size, 0.72rem);
    table-layout: fixed;
    width: var(--app-datasheet-table-width, max-content);
}

.app-dynamic-datasheet .col-code {
    min-width: var(--app-dynamic-datasheet-sticky-col-min-width, 4.8rem);
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .app-dynamic-datasheet {
        min-width: var(--app-dynamic-datasheet-mobile-min-width, 100%);
    }
}

.app-field-help {
    align-items: center;
    background: #f8f9fa;
    border: 1px solid var(--bs-border-color);
    border-left: 3px solid var(--bs-primary);
    color: #4b5158;
    display: flex;
    gap: 0.4rem;
    line-height: 1.25;
    min-height: 1.7rem;
    padding: 0.25rem 0.45rem;
    font-size: 0.78rem;
}

.app-field-help span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.app-field-help .bi {
    color: var(--bs-primary);
    flex: 0 0 auto;
    font-size: 0.9rem;
}

body:has(.app-window-statusbar) {
    padding-bottom: 3.25rem;
}

.app-window-statusbar {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    bottom: 0;
    box-sizing: border-box;
    left: 0;
    margin: 0 !important;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    position: fixed;
    right: 0;
    z-index: 1030;
}

.app-field-help.is-error {
    align-items: flex-start;
    background: var(--bs-danger-bg-subtle);
    border-color: var(--bs-danger-border-subtle);
    border-left-color: var(--bs-danger);
    color: var(--bs-danger-text-emphasis);
    line-height: 1.2;
    min-height: 2.35rem;
    padding-bottom: 0.35rem;
    padding-top: 0.35rem;
    z-index: 1045;
}

.app-field-help.is-error .bi {
    color: var(--bs-danger);
}

.app-datasheet {
    border-collapse: collapse;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
    table-layout: auto;
    width: auto;
}

.app-datasheet.app-dynamic-datasheet {
    table-layout: fixed;
    width: var(--app-datasheet-table-width, max-content);
}

.app-datasheet.app-datasheet-grid-mode {
    display: grid;
    grid-template-columns: var(--app-datasheet-grid-columns);
    max-width: none;
    min-width: 0;
    table-layout: auto;
    width: 100%;
}

.app-datasheet.app-datasheet-grid-mode colgroup {
    display: none;
}

.app-datasheet.app-datasheet-grid-mode thead,
.app-datasheet.app-datasheet-grid-mode tbody,
.app-datasheet.app-datasheet-grid-mode tr {
    display: contents;
}

.app-datasheet.app-datasheet-grid-mode tr[hidden] {
    display: none !important;
}

.app-datasheet tbody tr[hidden] {
    display: none !important;
}

.app-datasheet.app-datasheet-grid-mode th,
.app-datasheet.app-datasheet-grid-mode td {
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden;
    position: relative;
    width: auto !important;
}

.app-datasheet.app-datasheet-grid-mode tr.is-selected > td {
    border-bottom-color: var(--bs-primary);
    border-bottom-width: 2px;
    border-top-color: var(--bs-primary);
    border-top-width: 2px;
}

.app-datasheet:not(.app-datasheet-grid-mode) tr.is-selected > td {
    background: #eef5ff;
}

.app-datasheet tbody tr:not([data-new-row="1"]):not([data-empty-row="1"]):not(.is-selected):hover > td,
.app-datasheet.app-datasheet-grid-mode tbody tr:not([data-new-row="1"]):not([data-empty-row="1"]):not(.is-selected):has(> td:hover) > td {
    --bs-table-accent-bg: #f7fbff;
    --bs-table-bg-state: #f7fbff;
    background-color: #f7fbff;
    box-shadow: inset 0 0 0 9999px #f7fbff;
}

.app-datasheet tbody tr.is-selected:hover > td {
    --bs-table-accent-bg: #eef5ff;
    --bs-table-bg-state: #eef5ff;
    background-color: #eef5ff;
    box-shadow: inset 0 0 0 9999px #eef5ff;
}

.app-datasheet tbody tr:not([data-new-row="1"]):not([data-empty-row="1"]):not(.is-selected):hover > td input:not([type="checkbox"]):not([type="radio"]),
.app-datasheet tbody tr:not([data-new-row="1"]):not([data-empty-row="1"]):not(.is-selected):hover > td select,
.app-datasheet tbody tr:not([data-new-row="1"]):not([data-empty-row="1"]):not(.is-selected):hover > td textarea {
    background-color: #f7fbff;
}

.app-datasheet tbody tr.is-selected:hover > td input:not([type="checkbox"]):not([type="radio"]),
.app-datasheet tbody tr.is-selected:hover > td select,
.app-datasheet tbody tr.is-selected:hover > td textarea {
    background-color: #eef5ff;
}

.app-datasheet thead th {
    background: var(--bs-tertiary-bg);
    border-bottom: 2px solid var(--bs-border-color);
    position: sticky;
    text-align: left;
    top: 0;
    z-index: 2;
}

.app-datasheet th,
.app-datasheet td {
    border: 1px solid var(--bs-border-color);
    padding: 0.02rem 0.12rem;
    vertical-align: middle;
}

.app-datasheet > :not(caption) > * > * {
    padding: 0.02rem 0.12rem;
}

.app-dynamic-datasheet th,
.app-dynamic-datasheet td {
    max-width: var(--app-datasheet-cell-max-width, 18rem);
    overflow: hidden;
}

.app-datasheet .col-code {
    background: var(--bs-body-bg);
    left: 0;
    position: sticky;
    z-index: 3;
}

.app-datasheet thead .col-code {
    z-index: 5;
}

.app-datasheet input[type="text"],
.app-datasheet input[type="number"],
.app-datasheet select {
    border: 0;
    border-radius: 0;
    font-size: inherit;
    height: 1.08rem;
    line-height: 1.1;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: 0 0.12rem;
    text-overflow: ellipsis;
    width: 100%;
    box-sizing: border-box;
}

.app-datasheet td.text-end input,
.app-datasheet td.text-end select {
    text-align: right;
}

.app-datasheet td.text-center input,
.app-datasheet td.text-center select {
    text-align: center;
}

.app-datasheet-cell-text {
    display: block;
    max-width: var(--app-datasheet-cell-max-width, 18rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-datasheet-navigator {
    align-items: center;
    background: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-top: 0;
    color: var(--bs-secondary-color);
    display: flex;
    flex-wrap: wrap;
    font-size: 0.72rem;
    gap: 0.35rem 0.55rem;
    min-height: 1.45rem;
    padding: 0.08rem 0.35rem;
    width: fit-content;
}

.app-datasheet-navigator-size {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.2rem;
    color: var(--bs-body-color);
    line-height: 1.1;
    min-width: 3.5rem;
    padding: 0.12rem 0.45rem;
    text-align: center;
}

.app-datasheet-navigator-count {
    color: var(--bs-body-color);
}

.app-datasheet-record-navigation {
    align-items: center;
    display: inline-flex;
    gap: 0.08rem;
}

.app-datasheet-record-nav {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--bs-body-color);
    display: inline-flex;
    height: 1.35rem;
    justify-content: center;
    padding: 0;
    width: 1.35rem;
}

.app-datasheet-record-nav:hover:not(:disabled),
.app-datasheet-record-nav:focus-visible {
    background: var(--bs-secondary-bg);
    color: var(--bs-primary);
    outline: 0;
}

.app-datasheet-record-nav:disabled {
    color: var(--bs-secondary-color);
    opacity: 0.45;
}

.app-datasheet-record-position {
    color: var(--bs-body-color);
    min-width: 3.5rem;
    text-align: center;
    white-space: nowrap;
}

.app-datasheet-navigator-actions {
    align-items: center;
    display: flex;
    gap: 0.2rem;
    margin-left: auto;
}

.app-datasheet-navigator-action {
    align-items: center;
    display: inline-flex;
    height: 1.65rem;
    justify-content: center;
    padding: 0;
    width: 1.65rem;
}

.app-datasheet select {
    background-position: right 0.2rem center;
    padding-right: 1.1rem;
}

.app-datasheet input:focus,
.app-datasheet select:focus {
    box-shadow: inset 0 0 0 1px var(--bs-primary);
}

.app-datasheet .form-check-input {
    height: 0.85rem;
    margin-top: 0;
    width: 0.85rem;
}

.app-date-editor {
    display: block;
    height: 100%;
    min-width: 0;
    position: relative;
    width: 100%;
}

.app-date-text-input {
    padding-right: 1.45rem !important;
}

.app-date-picker-button {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--bs-secondary-color);
    display: flex;
    height: 100%;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 0.08rem;
    top: 0;
    width: 1.3rem;
    z-index: 1;
}

.app-date-picker-button:disabled {
    display: none;
}

.app-date-native-picker {
    height: 1px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 100%;
    width: 1px;
}


.app-lookup-input {
    background: var(--bs-body-bg);
}

.app-barcode-cell {
    position: relative;
}

.app-barcode-input {
    padding-right: 1.65rem !important;
}

.app-barcode-camera-button {
    align-items: center;
    background: var(--bs-body-bg);
    border: 0;
    color: var(--bs-primary);
    display: flex;
    height: calc(100% - 4px);
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 2px;
    top: 2px;
    width: 1.45rem;
    z-index: 2;
}

.app-barcode-camera-button:hover:not(:disabled),
.app-barcode-camera-button:focus-visible {
    background: var(--bs-primary-bg-subtle);
}

.app-barcode-camera-button:disabled {
    display: none;
}

.app-barcode-dialog {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    color: var(--bs-body-color);
    max-width: min(34rem, calc(100vw - 2rem));
    padding: 0.75rem;
    width: 100%;
}

.app-barcode-dialog::backdrop {
    background: rgba(0, 0, 0, 0.38);
}

.app-barcode-dialog-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.app-barcode-video {
    background: #111;
    display: block;
    max-height: 60vh;
    min-height: 12rem;
    object-fit: contain;
    width: 100%;
}

.app-barcode-camera-status {
    color: var(--bs-secondary-color);
    font-size: 0.82rem;
    min-height: 1.25rem;
    padding-top: 0.45rem;
}

.app-barcode-dialog-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.45rem;
}

.app-lookup-menu {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.12);
    display: none;
    font-size: 0.74rem;
    min-width: 12rem;
    overflow-y: auto;
    position: fixed;
    z-index: 1085;
}

.app-lookup-menu.is-open {
    display: block;
}

.app-lookup-option {
    background: var(--bs-body-bg);
    border: 0;
    color: var(--bs-body-color);
    display: block;
    line-height: 1.18;
    padding: 0.24rem 0.4rem;
    text-align: left;
    width: 100%;
}

.app-lookup-option + .app-lookup-option {
    border-top: 1px solid rgba(var(--bs-secondary-rgb), 0.16);
}

.app-lookup-option:hover,
.app-lookup-option.is-active {
    background: var(--bs-primary-bg-subtle);
    color: var(--bs-body-color);
}

.app-lookup-option.is-empty {
    color: var(--bs-secondary-color);
    cursor: default;
}

.app-datasheet-context-menu {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.12);
    display: none;
    font-size: 0.78rem;
    min-width: 9rem;
    padding: 0.2rem 0;
    position: fixed;
    z-index: 1090;
}

.app-datasheet-context-menu.is-open {
    display: block;
}

.app-datasheet-context-menu button {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--bs-body-color);
    display: flex;
    gap: 0.4rem;
    padding: 0.25rem 0.65rem;
    text-align: left;
    white-space: nowrap;
    width: 100%;
}

.app-datasheet-context-menu button .bi {
    flex: 0 0 1rem;
    text-align: center;
}

.app-datasheet-context-menu button:hover:not(:disabled) {
    background: var(--bs-primary-bg-subtle);
}

.app-datasheet-context-menu button:disabled {
    color: var(--bs-secondary-color);
    cursor: default;
    opacity: 0.5;
}

.app-datasheet-menu-separator {
    border-top: 1px solid var(--bs-border-color);
    margin: 0.2rem auto;
    width: 80%;
}

.app-datasheet-row-dirty td,
.deals-row-dirty td,
.countries-row-dirty td,
.uom-row-dirty td,
.codecn-row-dirty td {
    background: var(--bs-warning-bg-subtle);
}

.app-datasheet-row-saving td,
.deals-row-saving td,
.countries-row-saving td,
.uom-row-saving td,
.codecn-row-saving td {
    background: var(--bs-info-bg-subtle);
}

.app-datasheet-row-error td,
.deals-row-error td,
.countries-row-error td,
.uom-row-error td,
.codecn-row-error td {
    background: var(--bs-danger-bg-subtle);
}


.app-datasheet-new-placeholder {
    color: var(--bs-primary);
    font-size: 0.68rem;
    font-weight: 600;
    left: 0.2rem;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    white-space: nowrap;
}

tr[data-new-row="1"].has-value .app-datasheet-new-placeholder {
    display: none;
}

.app-datasheet-row-new td,
.deals-row-new td,
.countries-row-new td,
.uom-row-new td,
.codecn-row-new td {
    background: var(--bs-tertiary-bg);
    border-top: 2px solid var(--bs-primary-border-subtle);
}

@media (max-width: 767.98px) {
    .app-datasheet-wrap {
        max-height: calc(100vh - 9.25rem);
    }
}


.app-work-context-bar {
    border-bottom: 1px solid var(--bs-border-color);
    background: #fff;
    color: #202123;
    font-size: 0.86rem;
    line-height: 1.25;
    padding: 0.35rem 0;
}

.app-work-context-bar > .container-fluid {
    display: flex;
    justify-content: flex-end;
}

.app-work-context-main {
    appearance: none;
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    display: flex;
    font: inherit;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 0.55rem;
    min-width: 0;
    padding: 0;
    justify-content: flex-end;
    margin-left: auto;
    text-align: right;
}

.app-work-context-main span {
    min-width: 0;
    max-width: 32rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-work-context-main span:not(:first-child)::before {
    content: "·";
    margin-right: 0.55rem;
    color: #8d939a;
}

.app-work-context-main {
    font-weight: 600;
}

.app-work-context-main i {
    color: var(--bs-primary);
    flex: 0 0 auto;
    font-size: 0.78rem;
    margin-left: 0.15rem;
}

.app-work-context-main:hover,
.app-work-context-main:focus-visible {
    color: var(--bs-primary);
}

.app-work-context-modal .form-label {
    color: var(--bs-secondary-color);
    font-size: 0.78rem;
    margin-bottom: 0.25rem;
}

.app-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    color: var(--app-muted-color);
    font-size: 0.95rem;
    line-height: 1.4;
}

.app-breadcrumb a {
    color: #202123;
    text-decoration: none;
}

.app-breadcrumb a:hover,
.app-breadcrumb a:focus {
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.app-breadcrumb-separator {
    color: #8d939a;
    font-size: 1.35rem;
    line-height: 1;
}

.app-breadcrumb-current {
    color: var(--app-muted-color);
}


.app-result-compact .h4 {
    font-size: 1.35rem;
}

.app-result-summary .fw-semibold,
.app-result-panels .fw-semibold {
    line-height: 1.25;
}

.app-result-panels .btn-sm {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

.app-validation-list {
    font-size: 0.95rem;
}

.app-validation-row {
    line-height: 1.28;
    scroll-margin-top: 4.5rem;
}

.accordion-item[id^="validation-error-"] {
    scroll-margin-top: 4.5rem;
}

.app-validation-row:target .app-validation-target-head,
.accordion-item[id^="validation-error-"]:target .app-validation-target-head {
    background: var(--bs-warning-bg-subtle);
    box-shadow: inset 3px 0 0 var(--bs-warning);
    padding: 0.18rem 0.35rem;
}

.app-validation-human {
    font-weight: 600;
    line-height: 1.3;
}

.app-validation-diagnostic {
    background: var(--bs-info-bg-subtle);
    border-left: 3px solid var(--bs-info);
    color: #25313d;
    font-size: 0.86rem;
    line-height: 1.32;
    padding: 0.35rem 0.5rem;
}

.app-validation-group-summary {
    background: #fff;
    border: 1px solid var(--bs-border-color);
    border-left: 3px solid var(--bs-primary);
    font-size: 0.88rem;
    line-height: 1.3;
    max-width: 70rem;
    padding: 0.45rem 0.55rem;
}

.app-validation-group-row {
    border-top: 1px solid var(--bs-border-color);
    padding: 0.35rem 0;
}

.app-validation-group-row:first-of-type {
    border-top: 0;
}

.app-validation-group-lines,
.app-validation-group-details {
    font-size: 0.82rem;
    overflow-wrap: anywhere;
}

.app-validation-group-details summary {
    color: var(--bs-link-color);
    cursor: pointer;
}

.app-validation-detail-line {
    align-items: center;
    display: flex;
    gap: 0.65rem;
    justify-content: space-between;
}

.app-validation-detail-line a,
.app-validation-top-link {
    font-size: 0.78rem;
    font-weight: 500;
    white-space: nowrap;
}

.app-validation-technical {
    margin-top: 0.15rem;
    font-size: 0.82rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
    word-break: break-word;
}


.app-validation-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.8rem;
    color: var(--app-muted-color);
    font-size: 0.82rem;
    line-height: 1.25;
}

.app-validation-doc {
    color: #3f444a;
    font-size: 0.86rem;
    line-height: 1.28;
}


.app-export-result-card {
    border-bottom: 1px solid var(--bs-border-color);
    line-height: 1.25;
    margin-bottom: 0.65rem !important;
    max-width: none;
    padding: 0 0 0.45rem;
}

.app-export-result-head {
    line-height: 1.25;
    margin-bottom: 0.25rem;
}

.app-export-result-grid {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1.75rem;
    line-height: 1.25;
}

.app-export-result-field {
    align-items: baseline;
    column-gap: 0.55rem;
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    min-width: 0;
}

.app-export-result-label {
    font-size: 0.78rem;
    white-space: nowrap;
}

.app-export-result-value {
    min-width: 0;
    overflow-wrap: anywhere;
}


.app-export-result-note {
    margin-top: 0.25rem;
}

@media (max-width: 991.98px) {
    .app-export-result-grid {
        align-items: flex-start;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.35rem 1rem;
    }
}

@media (max-width: 767.98px) {
    .app-export-result-grid {
        align-items: flex-start;
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }
}


.app-xml-context-details summary {
    cursor: pointer;
    color: var(--bs-link-color);
    font-size: 0.86rem;
    line-height: 1.25;
}

.app-xml-context {
    max-height: 24rem;
    overflow: auto;
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--bs-border-color);
    background: #f8f9fa;
    color: #1f2328;
    font-size: 0.76rem;
    line-height: 1.18;
    tab-size: 2;
    -moz-tab-size: 2;
    white-space: pre;
}

.app-xml-context span {
    display: block;
}

.app-xml-context .is-error {
    background: #fff3cd;
    color: #111;
    font-weight: 700;
}

.app-platform-updates {
    max-width: 72rem;
}

.app-update-panel {
    border: 1px solid var(--bs-border-color);
    margin-top: 1rem;
}

.app-update-summary {
    display: grid;
    grid-template-columns: minmax(14rem, 2fr) repeat(3, minmax(9rem, 1fr));
}

.app-update-summary > div {
    border-right: 1px solid var(--bs-border-color);
    min-width: 0;
    padding: 0.65rem 0.8rem;
}

.app-update-summary > div:last-child {
    border-right: 0;
}

.app-update-summary span,
.app-update-summary strong {
    display: block;
    overflow-wrap: anywhere;
}

.app-update-summary span {
    color: var(--bs-secondary-color);
    font-size: 0.78rem;
}

.app-update-summary strong {
    font-weight: 600;
    margin-top: 0.2rem;
}

.app-update-actions,
.app-update-settings {
    align-items: center;
    border-top: 1px solid var(--bs-border-color);
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.65rem 0.8rem;
}

.app-update-actions .btn {
    align-items: center;
    display: inline-flex;
    gap: 0.4rem;
}

.app-update-notice {
    background: #eef5ff;
    border-top: 1px solid #b7d0f7;
    color: #173f73;
    padding: 0.55rem 0.8rem;
}

.app-update-notice.is-error {
    background: #f8d7da;
    border-color: #f1aeb5;
    color: #842029;
}

.app-update-technical {
    border-top: 1px solid var(--bs-border-color);
    padding: 0.55rem 0.8rem;
}

.app-update-release-notes {
    border-top: 1px solid var(--bs-border-color);
    padding: 0.75rem 0.8rem;
}

.app-update-release-notes > div {
    margin-top: 0.35rem;
    white-space: pre-line;
}

.app-update-technical > div {
    margin-top: 0.35rem;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.app-update-settings {
    border: 1px solid var(--bs-border-color);
    margin-top: 0.75rem;
}

.app-update-settings > label:not(.form-check) {
    color: var(--bs-secondary-color);
    font-size: 0.82rem;
    margin-left: auto;
}

.app-update-settings .form-select {
    max-width: 12rem;
}

@media (max-width: 767.98px) {
    .app-update-summary {
        grid-template-columns: 1fr 1fr;
    }

    .app-update-summary > div:nth-child(2) {
        border-right: 0;
    }

    .app-update-summary > div:nth-child(n + 3) {
        border-top: 1px solid var(--bs-border-color);
    }

    .app-update-settings > label:not(.form-check) {
        margin-left: 0;
    }
}
