.app-layout.theme-humanistic,
.admin-layout.theme-humanistic {
    --rz-primary: #087f8c;
    --rz-secondary: #3155d9;
    --rz-body-background-color: #edf5f6;
    --rz-base-background-color: #fbfdfd;
    --rz-border-radius: 2px;
    --dme-theme-accent: #087f8c;
    --dme-theme-secondary: #3155d9;
    --dme-theme-surface: #fbfdfd;
    --dme-theme-line: #a9c8cc;
    --dme-theme-grid-size: 40px;
    --dme-theme-primary-strength: 11%;
    --dme-theme-secondary-strength: 8%;
    --dme-theme-grid-strength: 16%;
    --dme-theme-route-opacity: 0.62;
    --dme-theme-surface-radius: 3px;
    --dme-theme-shadow: 0 0.45rem 1.35rem rgba(18, 76, 83, 0.09);
}

.app-layout.theme-humanistic-dark,
.admin-layout.theme-humanistic-dark {
    --rz-primary: #61e6d2;
    --rz-secondary: #7194ff;
    --rz-body-background-color: #0b1419;
    --rz-base-background-color: #111e24;
    --rz-border-radius: 2px;
    --dme-theme-accent: #61e6d2;
    --dme-theme-secondary: #7194ff;
    --dme-theme-surface: #111e24;
    --dme-theme-line: #36515a;
    --dme-theme-grid-size: 40px;
    --dme-theme-primary-strength: 16%;
    --dme-theme-secondary-strength: 12%;
    --dme-theme-grid-strength: 20%;
    --dme-theme-route-opacity: 0.76;
    --dme-theme-surface-radius: 3px;
    --dme-theme-shadow: 0 0.55rem 1.7rem rgba(0, 0, 0, 0.34);
}

.app-layout.theme-software,
.admin-layout.theme-software {
    --rz-primary: #496f7a;
    --rz-secondary: #756b9d;
    --rz-body-background-color: #f1f4f6;
    --rz-base-background-color: #fbfcfd;
    --rz-border-radius: 7px;
    --dme-theme-accent: #496f7a;
    --dme-theme-secondary: #756b9d;
    --dme-theme-surface: #fbfcfd;
    --dme-theme-line: #bdcbd0;
    --dme-theme-grid-size: 56px;
    --dme-theme-primary-strength: 6%;
    --dme-theme-secondary-strength: 5%;
    --dme-theme-grid-strength: 9%;
    --dme-theme-route-opacity: 0.4;
    --dme-theme-surface-radius: 8px;
    --dme-theme-shadow: 0 0.55rem 1.5rem rgba(44, 65, 72, 0.1);
}

.app-layout.theme-software-dark,
.admin-layout.theme-software-dark {
    --rz-primary: #72b7c7;
    --rz-secondary: #9ca8d8;
    --rz-body-background-color: #12191e;
    --rz-base-background-color: #192229;
    --rz-border-radius: 7px;
    --dme-theme-accent: #72b7c7;
    --dme-theme-secondary: #9ca8d8;
    --dme-theme-surface: #192229;
    --dme-theme-line: #41515a;
    --dme-theme-grid-size: 56px;
    --dme-theme-primary-strength: 10%;
    --dme-theme-secondary-strength: 8%;
    --dme-theme-grid-strength: 12%;
    --dme-theme-route-opacity: 0.52;
    --dme-theme-surface-radius: 8px;
    --dme-theme-shadow: 0 0.6rem 1.8rem rgba(0, 0, 0, 0.3);
}

.app-layout.theme-standard,
.admin-layout.theme-standard {
    --rz-primary: #245eaa;
    --rz-secondary: #68768a;
    --rz-body-background-color: #f3f4f6;
    --rz-base-background-color: #ffffff;
    --rz-border-radius: 3px;
    --dme-theme-accent: #245eaa;
    --dme-theme-secondary: #68768a;
    --dme-theme-surface: #ffffff;
    --dme-theme-line: #c7ccd3;
    --dme-theme-grid-size: 64px;
    --dme-theme-primary-strength: 3%;
    --dme-theme-secondary-strength: 2%;
    --dme-theme-grid-strength: 5%;
    --dme-theme-route-opacity: 0.16;
    --dme-theme-surface-radius: 3px;
    --dme-theme-shadow: 0 0.25rem 0.8rem rgba(31, 46, 67, 0.08);
}

.app-layout .rz-card,
.admin-layout .rz-card,
.app-layout .catalog-card,
.admin-layout .catalog-card,
.app-layout .settings-card,
.admin-layout .settings-card {
    border-color: var(--dme-theme-line) !important;
    border-radius: var(--dme-theme-surface-radius) !important;
    background-color: color-mix(in srgb, var(--dme-theme-surface) 96%, transparent) !important;
    box-shadow: var(--dme-theme-shadow) !important;
}

.app-layout .rz-form-field,
.admin-layout .rz-form-field,
.app-layout .rz-textbox,
.admin-layout .rz-textbox,
.app-layout .rz-dropdown,
.admin-layout .rz-dropdown,
.app-layout .rz-textarea,
.admin-layout .rz-textarea {
    border-radius: var(--rz-border-radius) !important;
}

.admin-body {
    position: relative !important;
    isolation: isolate;
    background: var(--rz-body-background-color) !important;
}

.admin-backdrop {
    position: fixed;
    z-index: 0;
    top: 4rem;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    background:
        linear-gradient(
            142deg,
            color-mix(in srgb, var(--dme-theme-accent) var(--dme-theme-primary-strength), var(--rz-body-background-color)),
            var(--rz-body-background-color) 42%,
            color-mix(in srgb, var(--dme-theme-secondary) var(--dme-theme-secondary-strength), var(--rz-body-background-color))
        );
    pointer-events: none;
}

.admin-backdrop::before {
    position: absolute;
    top: -28%;
    left: 22%;
    width: 18rem;
    height: 155%;
    background: linear-gradient(
        90deg,
        transparent,
        color-mix(in srgb, var(--dme-theme-accent) var(--dme-theme-primary-strength), transparent),
        color-mix(in srgb, var(--dme-theme-secondary) var(--dme-theme-secondary-strength), transparent),
        transparent
    );
    content: "";
    filter: blur(0.25rem);
    opacity: 0.8;
    transform: rotate(24deg);
}

.admin-backdrop::after {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(
        circle,
        color-mix(in srgb, var(--dme-theme-accent) var(--dme-theme-grid-strength), transparent) 0 1px,
        transparent 1.2px
    );
    background-position: 1.5rem 1.5rem;
    background-size: 2rem 2rem;
    content: "";
    mask-image: linear-gradient(115deg, transparent 5%, black 28%, transparent 61%);
    opacity: 0.42;
}

.backdrop-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(color-mix(in srgb, var(--dme-theme-accent) var(--dme-theme-grid-strength), transparent) 1px, transparent 1px),
        linear-gradient(90deg, color-mix(in srgb, var(--dme-theme-accent) var(--dme-theme-grid-strength), transparent) 1px, transparent 1px);
    background-size: var(--dme-theme-grid-size) var(--dme-theme-grid-size);
    mask-image:
        radial-gradient(ellipse at 12% 8%, black, transparent 58%),
        linear-gradient(to bottom, rgba(0, 0, 0, 0.8), transparent 88%);
    mask-composite: intersect;
}

.backdrop-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(1px);
}

.backdrop-glow-primary {
    top: -18rem;
    left: -12rem;
    width: 46rem;
    height: 46rem;
    background: radial-gradient(circle, color-mix(in srgb, var(--dme-theme-accent) 26%, transparent), transparent 67%);
}

.backdrop-glow-secondary {
    right: -16rem;
    bottom: -20rem;
    width: 50rem;
    height: 50rem;
    background: radial-gradient(circle, color-mix(in srgb, var(--dme-theme-secondary) 18%, transparent), transparent 68%);
}

.backdrop-routes {
    position: absolute;
    top: 0;
    right: -4%;
    width: min(68rem, 72vw);
    height: 100%;
    overflow: visible;
    opacity: var(--dme-theme-route-opacity);
}

.route-trace {
    fill: none;
    stroke-linecap: square;
    stroke-linejoin: bevel;
    vector-effect: non-scaling-stroke;
}

.route-trace-muted {
    stroke: color-mix(in srgb, var(--rz-text-color) 9%, transparent);
    stroke-width: 1;
    stroke-dasharray: 2 8;
}

.route-trace-primary {
    stroke: color-mix(in srgb, var(--rz-primary) 47%, transparent);
    stroke-width: 1.25;
    filter: drop-shadow(0 0 0.35rem color-mix(in srgb, var(--rz-primary) 20%, transparent));
}

.route-trace-secondary {
    stroke: color-mix(in srgb, #6385ff 30%, transparent);
    stroke-width: 1;
    stroke-dasharray: 34 7 5 7;
}

.route-trace-short {
    stroke: color-mix(in srgb, var(--rz-primary) 24%, transparent);
    stroke-width: 1;
}

.route-nodes circle {
    fill: var(--rz-body-background-color);
    stroke: color-mix(in srgb, var(--rz-primary) 68%, var(--rz-text-color));
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
}

.route-nodes circle:nth-child(2),
.route-nodes circle:nth-child(4) {
    fill: color-mix(in srgb, var(--rz-primary) 72%, white);
    filter: drop-shadow(0 0 0.35rem color-mix(in srgb, var(--rz-primary) 48%, transparent));
}

.route-labels {
    fill: color-mix(in srgb, var(--rz-text-color) 38%, transparent);
    font-family: Inter, "Segoe UI", sans-serif;
    font-size: 10.5px;
    font-weight: 750;
    letter-spacing: 1.6px;
}

.backdrop-data-mark {
    position: absolute;
    right: 5rem;
    bottom: 2.5rem;
    padding: 0.35rem 0.55rem;
    color: color-mix(in srgb, var(--rz-primary) 58%, var(--rz-text-color));
    border-left: 2px solid color-mix(in srgb, var(--rz-primary) 58%, transparent);
    background: color-mix(in srgb, var(--rz-base-background-color) 42%, transparent);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.17em;
    backdrop-filter: blur(4px);
}

.backdrop-axis {
    position: absolute;
    top: 8%;
    right: 1.25rem;
    bottom: 8%;
    width: 2px;
    background: repeating-linear-gradient(
        to bottom,
        color-mix(in srgb, var(--rz-primary) 52%, transparent) 0 2.5rem,
        transparent 2.5rem 3.3rem
    );
    box-shadow: 0 0 1rem color-mix(in srgb, var(--rz-primary) 18%, transparent);
}

.admin-body > .system-rail,
.admin-body > .admin-content {
    position: relative;
    z-index: 1;
}

.theme-dark .top-nav a {
    color: #e7f2f4 !important;
}

.theme-dark .top-nav .rzi {
    color: var(--dme-theme-accent) !important;
}

.theme-dark .top-nav a:hover {
    color: #ffffff !important;
    background: color-mix(in srgb, var(--dme-theme-accent) 11%, transparent) !important;
}

.theme-dark .top-nav a.active {
    color: #ffffff !important;
    background: color-mix(in srgb, var(--dme-theme-accent) 16%, transparent) !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dme-theme-accent) 32%, transparent) !important;
}

.theme-dark .top-nav a.active .rzi {
    color: color-mix(in srgb, var(--dme-theme-accent) 82%, white) !important;
}

.theme-dark {
    --rz-input-border: 1px solid var(--dme-theme-line);
    --rz-input-hover-border: 1px solid color-mix(in srgb, var(--dme-theme-accent) 48%, var(--dme-theme-line));
    --rz-input-focus-border: 1px solid var(--dme-theme-accent);
    --rz-input-shadow: none;
    --rz-input-hover-shadow: none;
    --rz-input-focus-shadow: 0 0 0 1px color-mix(in srgb, var(--dme-theme-accent) 20%, transparent);
    --rz-form-field-shadow: none;
    --rz-form-field-hover-shadow: none;
    --rz-form-field-focus-shadow: none;
}

.theme-dark .rz-card,
.theme-dark .catalog-card,
.theme-dark .settings-card,
.theme-dark .metric-card,
.theme-dark .quick-card {
    border-color: var(--dme-theme-line) !important;
    background: color-mix(in srgb, var(--dme-theme-surface) 97%, var(--dme-theme-accent)) !important;
    box-shadow:
        inset 0 1px 0 color-mix(in srgb, var(--dme-theme-accent) 10%, transparent),
        0 0.45rem 1.2rem rgba(0, 0, 0, 0.18) !important;
    backdrop-filter: none !important;
}

.theme-dark .rz-form-field,
.theme-dark .rz-textbox,
.theme-dark .rz-password,
.theme-dark .rz-dropdown,
.theme-dark .rz-textarea {
    filter: none !important;
}

.theme-dark .rz-inputtext,
.theme-dark .rz-textbox,
.theme-dark .rz-password,
.theme-dark .rz-dropdown {
    background-color: color-mix(in srgb, var(--dme-theme-surface) 94%, var(--rz-body-background-color)) !important;
}

/*
 * Disabled controls must remain recognizably inactive without losing their
 * icon against dark surfaces.
 */
.theme-dark .rz-button:disabled,
.theme-dark .rz-button.rz-state-disabled,
.theme-dark .rz-button[aria-disabled="true"] {
    color: color-mix(in srgb, var(--rz-text-color) 82%, var(--dme-theme-accent) 18%) !important;
    border-color: color-mix(in srgb, var(--rz-text-color) 25%, var(--dme-theme-line)) !important;
    opacity: 0.78 !important;
    cursor: not-allowed !important;
    filter: saturate(0.72);
}

.theme-dark .rz-button:disabled .rzi,
.theme-dark .rz-button.rz-state-disabled .rzi,
.theme-dark .rz-button[aria-disabled="true"] .rzi,
.theme-dark .rz-button:disabled .rz-button-icon,
.theme-dark .rz-button.rz-state-disabled .rz-button-icon,
.theme-dark .rz-button[aria-disabled="true"] .rz-button-icon {
    color: color-mix(in srgb, var(--rz-text-color) 88%, white) !important;
    opacity: 1 !important;
}

.theme-dark .rz-button:disabled:hover,
.theme-dark .rz-button.rz-state-disabled:hover,
.theme-dark .rz-button[aria-disabled="true"]:hover {
    box-shadow: none !important;
    transform: none !important;
}

/*
 * Grid links use a brighter theme-aware color than ordinary body links.
 * Visited links stay distinct but retain sufficient contrast.
 */
.theme-dark .rz-data-grid .rz-grid-table tbody a:not(.rz-button),
.theme-dark table:not(.rz-grid-table) tbody a:not(.rz-button) {
    color: color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 72%, white) !important;
    font-weight: 650;
    text-decoration-color: color-mix(in srgb, currentColor 58%, transparent);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.16em;
}

.theme-dark .rz-data-grid .rz-grid-table tbody a:not(.rz-button):visited,
.theme-dark table:not(.rz-grid-table) tbody a:not(.rz-button):visited {
    color: color-mix(in srgb, var(--dme-theme-secondary, var(--rz-secondary)) 68%, white) !important;
}

.theme-dark .rz-data-grid .rz-grid-table tbody a:not(.rz-button):hover,
.theme-dark table:not(.rz-grid-table) tbody a:not(.rz-button):hover {
    color: white !important;
    text-decoration-color: currentColor;
}

.theme-dark .rz-data-grid .rz-grid-table tbody a:not(.rz-button):focus-visible,
.theme-dark table:not(.rz-grid-table) tbody a:not(.rz-button):focus-visible {
    border-radius: 2px;
    outline: 2px solid color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 76%, white);
    outline-offset: 2px;
}

/*
 * Dark themes can contain light hover/selected rows. Use a neutral mid-tone
 * separator that remains visible against both the dark surface and those
 * lighter row backgrounds.
 */
:is(.app-layout, .admin-layout, .dme-dialog, .rz-dialog) {
    --dme-grid-header-separator:
        color-mix(in srgb, var(--rz-text-color) 28%, var(--rz-base-300));
}

.theme-dark {
    --dme-grid-cell-separator:
        color-mix(in srgb, var(--rz-text-color) 36%, var(--dme-theme-line));
    --dme-grid-header-separator:
        color-mix(in srgb, var(--rz-text-color) 46%, var(--dme-theme-line));
}

.theme-dark .rz-data-grid .rz-grid-table thead th {
    border-right: 1px solid var(--dme-grid-header-separator) !important;
    border-bottom: 1px solid var(--dme-grid-header-separator) !important;
}

.theme-dark .rz-data-grid .rz-grid-table tbody td {
    border-right: 1px solid var(--dme-grid-cell-separator) !important;
    border-bottom: 1px solid var(--dme-grid-cell-separator) !important;
}

.theme-dark .rz-data-grid .rz-grid-table tr > :last-child {
    border-right-color: transparent !important;
}

.catalog-header {
    position: relative;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.35rem 0 0.35rem 1rem;
}

.catalog-header::before {
    position: absolute;
    top: 0.35rem;
    bottom: 0.35rem;
    left: 0;
    width: 2px;
    border-radius: 2px;
    background: linear-gradient(var(--rz-primary), color-mix(in srgb, var(--rz-primary) 20%, transparent));
    box-shadow: 0 0 0.8rem color-mix(in srgb, var(--rz-primary) 38%, transparent);
    content: "";
}

.catalog-eyebrow {
    margin: 0 0 0.35rem;
    color: var(--rz-primary);
    font-size: 0.71rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.catalog-header h1 {
    margin: 0;
    font-weight: 650;
    letter-spacing: -0.035em;
}

/*
 * Shared operational list header. List-level creation belongs here; actions
 * that depend on a selected row or a nested editor remain with that context.
 */
.dme-list-header {
    position: relative;
    display: flex;
    min-height: 2rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem 1rem;
    padding: 0.2rem 0 0.2rem 0.55rem;
}

.dme-list-header::before {
    position: absolute;
    inset: 0.2rem auto 0.2rem 0;
    width: 2px;
    border-radius: 2px;
    background: linear-gradient(var(--rz-primary), color-mix(in srgb, var(--rz-primary) 20%, transparent));
    box-shadow: 0 0 0.65rem color-mix(in srgb, var(--rz-primary) 30%, transparent);
    content: "";
}

.dme-list-eyebrow {
    min-width: 0;
    margin: 0;
    color: var(--rz-primary);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    line-height: 1.25;
}

.dme-list-header-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    color: var(--rz-text-secondary-color);
    font-size: 0.72rem;
    white-space: nowrap;
}

.dme-record-count strong {
    color: var(--rz-text-color);
    font-size: 0.76rem;
}

/*
 * Shared page-title strip. Every routed page opts in explicitly with
 * dme-page-header, so internal card, dialog and table headings are untouched.
 */
:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header {
    position: relative;
    display: flex;
    min-height: 1.75rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    margin: 0;
    padding: 0 0.5rem 0 0.72rem;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--rz-primary) 18%, var(--rz-base-300));
    border-radius: 0.35rem 0.35rem 0 0;
    background: linear-gradient(90deg, color-mix(in srgb, var(--rz-primary) 7%, transparent), transparent 42%);
    box-sizing: border-box;
}

:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header::before {
    position: absolute;
    top: 0.32rem;
    bottom: 0.32rem;
    left: 0;
    width: 2px;
    border-radius: 2px;
    background: linear-gradient(180deg, var(--rz-primary), color-mix(in srgb, var(--rz-primary) 38%, var(--rz-secondary)));
    box-shadow: 0 0 0.6rem color-mix(in srgb, var(--rz-primary) 28%, transparent);
    content: "";
}

:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header > div:first-child {
    display: flex;
    min-width: 0;
    align-items: baseline;
    gap: 0.58rem;
}

:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header :is(
    .dme-list-eyebrow,
    .catalog-eyebrow,
    .create-eyebrow,
    .clients-eyebrow,
    .inventory-eyebrow,
    .page-eyebrow
),
:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header > p,
:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header > div:first-child > p:first-child {
    min-width: 0;
    margin: 0;
    color: var(--rz-primary);
    font-size: 0.69rem;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: 0.17em;
    text-shadow: 0 0 0.7rem color-mix(in srgb, var(--rz-primary) 16%, transparent);
    white-space: nowrap;
}

:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header h1 {
    margin: 0;
    color: var(--rz-text-color);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    white-space: nowrap;
}

:is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header > div:first-child > :is(
    span,
    .page-subtitle,
    .catalog-subtitle
) {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: var(--rz-text-secondary-color);
    font-size: 0.68rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 700px) {
    :is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header {
        min-height: 1.75rem;
        flex-wrap: wrap;
        gap: 0.3rem 0.55rem;
        padding-block: 0.25rem;
    }

    :is(.app-layout, .admin-layout) :is(.app-content, .admin-content) .dme-page-header > div:first-child {
        flex: 1 1 100%;
        flex-wrap: wrap;
    }
}

.rz-button.dme-list-create-action {
    min-height: 2rem;
    flex: 0 0 auto;
    padding-inline: 0.72rem;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 50%, #073b45) !important;
    border-radius: 0.38rem;
    color: #fff !important;
    background-color: color-mix(in srgb, var(--rz-primary) 35%, #073b45) !important;
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.01em;
    box-shadow: 0 0.2rem 0.55rem color-mix(in srgb, var(--rz-primary) 18%, transparent);
    transition: filter 120ms ease, box-shadow 120ms ease;
}

.rz-button.dme-list-create-action:hover {
    filter: brightness(1.06);
}

.rz-button.dme-list-create-action:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--rz-primary) 72%, var(--rz-text-color));
    outline-offset: 2px;
}

.catalog-subtitle {
    color: var(--rz-text-secondary-color);
    font-size: 0.82rem;
}

.catalog-card,
.create-card,
.settings-card {
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 12%, var(--rz-base-300));
    border-radius: 0.7rem !important;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--rz-primary) 3.5%, transparent), transparent 28%),
        color-mix(in srgb, var(--rz-base-background-color) 91%, transparent) !important;
    box-shadow:
        0 1px 2px color-mix(in srgb, var(--rz-text-color) 6%, transparent),
        0 0.8rem 2.5rem color-mix(in srgb, var(--rz-text-color) 3%, transparent);
    backdrop-filter: blur(12px);
}

.catalog-card {
    box-shadow:
        inset 0 2px 0 color-mix(in srgb, var(--rz-primary) 28%, transparent),
        0 0.8rem 2.5rem color-mix(in srgb, var(--rz-text-color) 4%, transparent);
}

.catalog-card::before,
.settings-card::before {
    display: block;
    width: 100%;
    height: 1px;
    background: linear-gradient(
        90deg,
        var(--rz-primary),
        color-mix(in srgb, var(--rz-primary) 20%, transparent) 38%,
        transparent 72%
    );
    content: "";
    opacity: 0.58;
}

.admin-content .rz-alert,
.dme-dialog .rz-alert {
    border: 1px solid var(--rz-base-400);
    font-size: 0.8rem;
    font-weight: 650;
}

.admin-content .rz-alert.rz-success,
.dme-dialog .rz-alert.rz-success {
    --rz-alert-background-color: color-mix(in srgb, var(--rz-success) 11%, var(--rz-base-background-color));
    --rz-alert-color: color-mix(in srgb, var(--rz-success) 55%, var(--rz-text-color));
    --rz-alert-title-color: var(--rz-alert-color);
    --rz-alert-icon-color: var(--rz-alert-color);
    border-color: color-mix(in srgb, var(--rz-success) 42%, var(--rz-base-400));
}

.admin-content .rz-alert.rz-danger,
.dme-dialog .rz-alert.rz-danger {
    --rz-alert-background-color: color-mix(in srgb, var(--rz-danger) 10%, var(--rz-base-background-color));
    --rz-alert-color: color-mix(in srgb, var(--rz-danger) 58%, var(--rz-text-color));
    --rz-alert-title-color: var(--rz-alert-color);
    --rz-alert-icon-color: var(--rz-alert-color);
    border-color: color-mix(in srgb, var(--rz-danger) 42%, var(--rz-base-400));
}

.admin-content .rz-alert.rz-info,
.dme-dialog .rz-alert.rz-info {
    --rz-alert-background-color: color-mix(in srgb, var(--rz-info) 10%, var(--rz-base-background-color));
    --rz-alert-color: color-mix(in srgb, var(--rz-info) 50%, var(--rz-text-color));
    --rz-alert-title-color: var(--rz-alert-color);
    --rz-alert-icon-color: var(--rz-alert-color);
    border-color: color-mix(in srgb, var(--rz-info) 40%, var(--rz-base-400));
}

.password-card {
    border-left: 2px solid color-mix(in srgb, var(--rz-primary) 65%, var(--rz-base-300));
}

.compact-grid .rz-data-grid-data td,
.compact-grid .rz-grid-table thead th {
    height: 2.65rem;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    font-size: 0.78rem;
}

.compact-grid .rz-grid-table thead th {
    border-bottom-color: color-mix(in srgb, var(--rz-primary) 18%, var(--rz-base-300));
    background: color-mix(in srgb, var(--rz-primary) 4%, var(--rz-base-background-color));
}

.compact-grid .rz-column-title {
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.compact-grid .rz-data-row {
    transition: background-color 120ms ease, box-shadow 120ms ease;
}

.compact-grid .rz-data-row:hover > td {
    background: var(
        --dme-table-row-hover-background,
        color-mix(in srgb, var(--rz-primary) 9%, var(--rz-base-background-color))
    );
}

.compact-grid .rz-data-row:hover > td:first-child {
    box-shadow: inset 2px 0 0 color-mix(in srgb, var(--rz-primary) 75%, transparent);
}

/*
 * Use the same row-hover feedback in every application/admin grid and in
 * native editor tables. Selected Radzen rows retain their theme state.
 */
.app-layout,
.admin-layout,
.rz-dialog {
    --dme-table-row-hover-background:
        color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 9%, var(--rz-base-background-color));
}

.theme-dark {
    --dme-table-row-hover-background:
        color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 14%, var(--rz-base-background-color));
}

.app-content .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight):hover > td,
.admin-content .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight):hover > td,
.rz-dialog .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight):hover > td {
    background-color: var(--dme-table-row-hover-background);
}

.app-content .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight) > td,
.admin-content .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight) > td,
.rz-dialog .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight) > td,
.app-content table:not(.rz-grid-table) tbody tr > *,
.admin-content table:not(.rz-grid-table) tbody tr > *,
.rz-dialog table:not(.rz-grid-table) tbody tr > * {
    transition: background-color 120ms ease, box-shadow 120ms ease;
}

.app-content table:not(.rz-grid-table) tbody tr:hover > *,
.admin-content table:not(.rz-grid-table) tbody tr:hover > *,
.rz-dialog table:not(.rz-grid-table) tbody tr:hover > * {
    background-color: var(--dme-table-row-hover-background);
}

.app-content .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight):hover > td:first-child,
.admin-content .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight):hover > td:first-child,
.rz-dialog .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight):hover > td:first-child,
.app-content table:not(.rz-grid-table) tbody tr:hover > :first-child,
.admin-content table:not(.rz-grid-table) tbody tr:hover > :first-child,
.rz-dialog table:not(.rz-grid-table) tbody tr:hover > :first-child {
    box-shadow: inset 2px 0 0 color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 78%, transparent);
}

.compact-grid .rz-cell-filter .rz-textbox,
.compact-grid .rz-cell-filter .rz-dropdown {
    border-color: var(--rz-base-400);
    background: var(--rz-base-background-color);
}

.grid-action {
    min-height: 1.85rem !important;
    padding: 0.15rem 0.48rem !important;
    color: var(--rz-text-secondary-color) !important;
    border: 1px solid var(--rz-base-300) !important;
    border-radius: 0.32rem !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 0.74rem !important;
    font-weight: 600 !important;
    opacity: 1 !important;
    transition: color 120ms ease, border-color 120ms ease, background-color 120ms ease;
}

.grid-action:hover {
    color: var(--rz-primary) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 55%, var(--rz-base-300)) !important;
    background: color-mix(in srgb, var(--rz-primary) 7%, transparent) !important;
}

.grid-action:focus-visible {
    outline: 2px solid var(--rz-primary) !important;
    outline-offset: 2px;
}

.grid-action-password {
    color: color-mix(in srgb, var(--rz-primary) 80%, var(--rz-text-color)) !important;
}

.grid-action-save {
    color: var(--rz-success-dark, var(--rz-success)) !important;
}

.grid-action-save:hover {
    color: var(--rz-success-dark, var(--rz-success)) !important;
    border-color: color-mix(in srgb, var(--rz-success) 55%, var(--rz-base-300)) !important;
    background: color-mix(in srgb, var(--rz-success) 8%, transparent) !important;
}

.grid-action-cancel {
    color: var(--rz-danger) !important;
}

.grid-action-cancel:hover {
    color: var(--rz-danger) !important;
    border-color: color-mix(in srgb, var(--rz-danger) 50%, var(--rz-base-300)) !important;
    background: color-mix(in srgb, var(--rz-danger) 7%, transparent) !important;
}

.grid-action:disabled,
.grid-action.rz-state-disabled {
    color: var(--rz-text-disabled-color) !important;
    border-color: var(--rz-base-300) !important;
    background: var(--rz-base-200) !important;
    box-shadow: none;
    opacity: 0.5 !important;
}

.surface-close {
    display: inline-grid !important;
    width: 2rem !important;
    min-width: 2rem !important;
    height: 2rem !important;
    min-height: 2rem !important;
    padding: 0 !important;
    color: var(--rz-text-color) !important;
    border: 1px solid var(--rz-base-400) !important;
    border-radius: 0.45rem !important;
    background: var(--rz-base-background-color) !important;
    box-shadow: none !important;
    place-items: center;
}

.surface-close:hover {
    color: var(--rz-danger) !important;
    border-color: color-mix(in srgb, var(--rz-danger) 50%, var(--rz-base-400)) !important;
    background: color-mix(in srgb, var(--rz-danger) 6%, transparent) !important;
}

.surface-close:focus-visible,
.secondary-action:focus-visible {
    outline: 2px solid var(--rz-primary) !important;
    outline-offset: 2px;
}

.secondary-action {
    color: var(--rz-text-color) !important;
    border: 1px solid var(--rz-base-400) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-weight: 600 !important;
}

.secondary-action:hover {
    color: var(--rz-primary) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 55%, var(--rz-base-400)) !important;
    background: color-mix(in srgb, var(--rz-primary) 6%, transparent) !important;
}

.dme-dialog {
    border: 1px solid color-mix(in srgb, var(--rz-primary) 24%, var(--rz-base-300));
    border-radius: 0.7rem !important;
    background: color-mix(in srgb, var(--rz-base-background-color) 96%, transparent) !important;
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--rz-primary) 5%, transparent),
        0 1.4rem 4rem color-mix(in srgb, var(--rz-text-color) 20%, transparent) !important;
    overflow: hidden;
    backdrop-filter: none;
}

.dme-dialog .rz-dialog-titlebar {
    min-height: 3.2rem;
    padding: 0.8rem 1.1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--rz-primary) 16%, var(--rz-base-300));
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--rz-primary) 7%, transparent), transparent 45%),
        var(--rz-base-background-color);
}

.dme-dialog .rz-dialog-title {
    color: var(--rz-text-color);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dme-dialog .rz-dialog-titlebar-close {
    display: inline-grid;
    width: 2rem;
    height: 2rem;
    color: var(--rz-text-color) !important;
    border: 1px solid var(--rz-base-400);
    border-radius: 0.45rem;
    background: transparent;
    opacity: 1;
    place-items: center;
}

.dme-dialog .rz-dialog-titlebar-close:hover {
    color: var(--rz-danger) !important;
    border-color: color-mix(in srgb, var(--rz-danger) 50%, var(--rz-base-400));
    background: color-mix(in srgb, var(--rz-danger) 6%, transparent);
}

.dme-dialog .rz-dialog-titlebar-close:focus-visible {
    outline: 2px solid var(--rz-primary);
    outline-offset: 2px;
}

.dme-dialog .rz-dialog-content {
    padding: 1.1rem;
    background: var(--rz-base-background-color);
}

.dialog-form .rz-form-field {
    width: 100%;
}

.dialog-form .rz-message {
    margin-top: -0.7rem;
    font-size: 0.74rem;
}

.dialog-copy {
    margin: 0 0 1rem;
    color: var(--rz-text-secondary-color);
    font-size: 0.82rem;
}

.dialog-checkbox-row {
    display: flex;
    min-height: 3.5rem;
    align-items: center;
    gap: 0.7rem;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--rz-base-300);
    border-radius: 0.55rem;
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease;
}

.dialog-checkbox-row:hover {
    border-color: color-mix(in srgb, var(--rz-primary) 45%, var(--rz-base-300));
    background: color-mix(in srgb, var(--rz-primary) 4%, transparent);
}

.dialog-checkbox-row:focus-within {
    outline: 2px solid var(--rz-primary);
    outline-offset: 2px;
}

.dialog-checkbox-row .rz-chkbox {
    flex: 0 0 auto;
}

.dialog-checkbox-row .rz-chkbox-box {
    border-color: var(--rz-base-500);
}

.dialog-checkbox-row strong,
.dialog-checkbox-row span {
    display: block;
}

.dialog-checkbox-row strong {
    color: var(--rz-text-color);
    font-size: 0.82rem;
}

.dialog-checkbox-row span {
    margin-top: 0.15rem;
    color: var(--rz-text-secondary-color);
    font-size: 0.74rem;
}

.dialog-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin: 1.2rem -1.1rem -1.1rem;
    padding: 0.8rem 1.1rem;
    border-top: 1px solid var(--rz-base-300);
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--rz-primary) 4%, transparent), transparent),
        color-mix(in srgb, var(--rz-base-200) 55%, var(--rz-base-background-color));
}

.user-cell {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.role-badge {
    color: color-mix(in srgb, var(--rz-info) 48%, var(--rz-text-color)) !important;
    background: color-mix(in srgb, var(--rz-info) 13%, var(--rz-base-background-color)) !important;
    font-weight: 650 !important;
}

.theme-dark .role-badge {
    color: #d9f5ff !important;
    background: rgba(35, 124, 156, 0.38) !important;
}

.user-cell strong,
.user-cell small {
    display: block;
}

.user-cell small {
    margin-top: 0.1rem;
    color: var(--rz-text-secondary-color);
    font-size: 0.7rem;
}

.user-avatar {
    display: grid;
    width: 1.9rem;
    height: 1.9rem;
    flex: 0 0 auto;
    color: var(--rz-primary);
    border: 1px solid color-mix(in srgb, var(--rz-primary) 18%, transparent);
    border-radius: 0.42rem;
    background: color-mix(in srgb, var(--rz-primary) 12%, transparent);
    font-size: 0.7rem;
    font-weight: 750;
    place-items: center;
}

.settings-card {
    width: 100%;
    max-width: none;
}

.settings-section {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.settings-icon {
    display: grid;
    width: 2.6rem;
    height: 2.6rem;
    color: var(--rz-primary);
    border: 1px solid color-mix(in srgb, var(--rz-primary) 20%, transparent);
    border-radius: 0.5rem;
    background: color-mix(in srgb, var(--rz-primary) 12%, transparent);
    place-items: center;
}

.admin-content .rz-button.rz-primary:not(.grid-action) {
    box-shadow: 0 0.45rem 1.2rem color-mix(in srgb, var(--rz-primary) 16%, transparent);
}

.admin-content .rz-form-field:focus-within,
.dme-dialog .rz-form-field:focus-within {
    filter: none;
}

.rz-layout > .rz-body.app-body {
    padding: 0;
}

.app-content:has(.clients-page),
.app-content:has(.delivery-check-manager-page),
.app-content:has(.visit-check-manager-page),
.app-content:has(.diagnoses-page),
.app-content:has(.delivery-procedures-page),
.app-content:has(.billing-file-page),
.app-content:has(.inventory-import-page),
.app-content:has(.eligibility-workflow-page),
.app-content:has(.client-import-page),
.app-content:has(.patient-chart-page),
.app-content:has(.superbill-page),
.app-content:has(.medgen-page),
.app-content:has(.integra-order-page),
.app-content:has(.catalog-page) {
    width: 100%;
    max-width: none;
    height: calc(100dvh - 4rem);
    min-height: 0;
    padding: 0.5rem 0.5rem var(--dme-page-bottom-safe-area, 5px);
    overflow: hidden;
    box-sizing: border-box;
}

/* MainLayout's scoped padding is loaded after this stylesheet. Keep dense
   catalog workspaces aligned to the viewport with a more specific selector. */
.app-layout .app-content:has(:is(
    .clients-page,
    .delivery-check-manager-page,
    .visit-check-manager-page,
    .diagnoses-page,
    .delivery-procedures-page,
    .billing-file-page,
    .inventory-import-page,
    .eligibility-workflow-page,
    .client-import-page,
    .patient-chart-page,
    .superbill-page,
    .medgen-page,
    .integra-order-page,
    .catalog-page
)) {
    padding: 0.5rem 0.5rem var(--dme-page-bottom-safe-area, 5px);
}

.admin-content:has(.users-page) {
    width: 100%;
    max-width: none;
    height: calc(100dvh - 5.85rem);
    min-height: 0;
    padding: 0.5rem 0.5rem calc(0.5rem + var(--dme-page-bottom-safe-area, 5px));
    overflow: hidden;
    box-sizing: border-box;
}

html:has(.users-page),
body:has(.users-page),
.admin-layout:has(.users-page) {
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

.admin-body:has(.users-page) {
    height: calc(100dvh - 4rem);
    min-height: 0;
    overflow: hidden;
}

@media (min-width: 761px) {
    .app-content:has(.vehicle-tracking-page) {
        width: 100%;
        max-width: none;
        height: calc(100dvh - 5.85rem);
        min-height: 0;
        padding: 0.5rem 0.5rem calc(0.5rem + var(--dme-page-bottom-safe-area, 5px));
        overflow: hidden;
        box-sizing: border-box;
    }

    html:has(.vehicle-tracking-page),
    body:has(.vehicle-tracking-page),
    .app-layout:has(.vehicle-tracking-page) {
        height: 100dvh;
        min-height: 0;
        overflow: hidden;
    }

    .app-body:has(.vehicle-tracking-page) {
        height: calc(100dvh - 4rem);
        min-height: 0;
        overflow: hidden;
    }
}

.admin-content .users-page .search-card.rz-card,
.admin-content .users-page .results-card.rz-card {
    display: flex;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    flex-direction: column;
    overflow: hidden;
}

.admin-content .users-page .search-card.rz-card > .search-scroll {
    min-height: 0;
    flex: 1 1 0;
    overflow-x: hidden;
    overflow-y: auto;
}

.admin-content .users-page .search-card.rz-card > .search-actions {
    flex: 0 0 auto;
    padding-bottom: 0.5rem;
}

.admin-content .users-page .results-card.rz-card > .users-grid-shell {
    height: auto;
    min-height: 0;
    flex: 1 1 0;
    overflow: hidden;
}

.admin-content .users-page .users-grid.rz-data-grid {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.admin-content .users-page .users-grid.rz-data-grid > .rz-data-grid-data {
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto !important;
}

.admin-content .users-page .users-grid.rz-data-grid > .rz-pager {
    display: none !important;
}

html:has(.clients-page),
body:has(.clients-page),
html:has(.delivery-check-manager-page),
body:has(.delivery-check-manager-page),
html:has(.visit-check-manager-page),
body:has(.visit-check-manager-page),
html:has(.diagnoses-page),
body:has(.diagnoses-page),
html:has(.delivery-procedures-page),
body:has(.delivery-procedures-page),
html:has(.billing-file-page),
body:has(.billing-file-page),
html:has(.inventory-import-page),
body:has(.inventory-import-page),
html:has(.eligibility-workflow-page),
body:has(.eligibility-workflow-page),
html:has(.client-import-page),
body:has(.client-import-page),
html:has(.patient-chart-page),
body:has(.patient-chart-page),
html:has(.superbill-page),
body:has(.superbill-page),
html:has(.medgen-page),
body:has(.medgen-page),
html:has(.integra-order-page),
body:has(.integra-order-page),
html:has(.catalog-page),
body:has(.catalog-page) {
    height: 100dvh;
    overflow: hidden;
}

.app-layout:has(.clients-page),
.app-layout:has(.delivery-check-manager-page),
.app-layout:has(.visit-check-manager-page),
.app-layout:has(.diagnoses-page),
.app-layout:has(.delivery-procedures-page),
.app-layout:has(.billing-file-page),
.app-layout:has(.inventory-import-page),
.app-layout:has(.eligibility-workflow-page),
.app-layout:has(.client-import-page),
.app-layout:has(.patient-chart-page),
.app-layout:has(.superbill-page),
.app-layout:has(.medgen-page),
.app-layout:has(.integra-order-page),
.app-layout:has(.catalog-page) {
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

.app-body:has(.clients-page),
.app-body:has(.delivery-check-manager-page),
.app-body:has(.visit-check-manager-page),
.app-body:has(.diagnoses-page),
.app-body:has(.delivery-procedures-page),
.app-body:has(.billing-file-page),
.app-body:has(.inventory-import-page),
.app-body:has(.eligibility-workflow-page),
.app-body:has(.client-import-page),
.app-body:has(.patient-chart-page),
.app-body:has(.superbill-page),
.app-body:has(.medgen-page),
.app-body:has(.integra-order-page),
.app-body:has(.catalog-page) {
    height: calc(100dvh - 4rem);
    min-height: 0;
    overflow: hidden;
}

.app-content .client-import-page,
.app-content .patient-chart-page,
.app-content .superbill-page,
.app-content .medgen-page,
.app-content .integra-order-page {
    display: flex !important;
    height: 100% !important;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.app-content .client-import-grid.rz-data-grid tr.client-import-row-warning > td {
    background: color-mix(in srgb, var(--rz-warning) 9%, var(--rz-base-background-color));
}

.app-content .client-import-grid.rz-data-grid tr.client-import-row-attention > td {
    background: color-mix(in srgb, var(--rz-success) 8%, var(--rz-base-background-color));
}

.app-content .client-import-grid.rz-data-grid tr.client-import-row-error > td {
    background: color-mix(in srgb, var(--rz-danger) 9%, var(--rz-base-background-color));
}

.app-content .superbill-grid.rz-data-grid tr.superbill-row-warning > td {
    background: color-mix(in srgb, var(--rz-warning) 12%, var(--rz-base-background-color));
}

.app-content .superbill-grid.rz-data-grid tr.superbill-row-attention > td {
    background: color-mix(in srgb, var(--rz-success) 10%, var(--rz-base-background-color));
}

.app-content .superbill-grid.rz-data-grid tr.superbill-row-error > td {
    background: color-mix(in srgb, var(--rz-danger) 12%, var(--rz-base-background-color));
}

.app-content .superbill-grid.rz-data-grid tr.superbill-row-adjusted > td {
    background: color-mix(in srgb, var(--rz-info) 12%, var(--rz-base-background-color));
}

.app-content .clients-page.rz-stack,
.app-content .diagnoses-page.rz-stack,
.app-content .delivery-procedures-page,
.app-content .billing-file-page.rz-stack,
.app-content .eligibility-workflow-page,
.app-content .catalog-page {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100% !important;
    min-height: 0;
    overflow: hidden;
}

/* Keep tab headers uniformly compact across every application page. */
.app-content,
.admin-content {
    --dme-tab-header-height: 1.5rem;
}

:is(.app-content, .admin-content) .rz-tabview > .rz-tabview-nav {
    min-height: var(--dme-tab-header-height) !important;
    overflow-y: hidden;
    scrollbar-width: none;
}

:is(.app-content, .admin-content) .rz-tabview > .rz-tabview-nav::-webkit-scrollbar {
    display: none;
}

:is(.app-content, .admin-content) .rz-tabview > .rz-tabview-nav > li {
    min-height: var(--dme-tab-header-height) !important;
}

:is(.app-content, .admin-content) .rz-tabview > .rz-tabview-nav > li > a,
:is(.app-content, .admin-content) .rz-tabview > .rz-tabview-nav [role="tab"] {
    box-sizing: border-box;
    height: var(--dme-tab-header-height) !important;
    min-height: var(--dme-tab-header-height) !important;
    padding: 0.08rem 0.45rem !important;
    line-height: 1 !important;
}

:is(.app-content, .admin-content) .rz-tabview > .rz-tabview-nav [role="tab"] .rzi {
    font-size: 0.9rem !important;
}

:is(.app-content, .admin-content) :is(
    .company-settings-tabs,
    .client-activity-tabs,
    .eligibility-tabs,
    .message-tabs,
    .payment-tabs
) > .rz-tabview-panels {
    padding: 5px 0 0 !important;
}

:is(.app-content, .admin-content) :is(
    .company-settings-tabs,
    .client-activity-tabs,
    .eligibility-tabs,
    .message-tabs,
    .payment-tabs
) > .rz-tabview-panels > .rz-tabview-panel {
    padding: 0 !important;
}

/* Radzen tab internals are rendered outside the page's isolated CSS scope. */
.app-content .eligibility-workflow-page .eligibility-tabs > .rz-tabview-panels {
    height: calc(100% - var(--dme-tab-header-height));
    min-height: 0;
    padding: 0.65rem 0 0;
    overflow: hidden;
    box-sizing: border-box;
}

.app-content .eligibility-workflow-page .eligibility-tabs > .rz-tabview-panels > .rz-tabview-panel {
    height: 100%;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.app-content .clients-page.rz-stack > .clients-workspace,
.app-content .diagnoses-page.rz-stack > .diagnoses-workspace,
.app-content .delivery-procedures-page > .delivery-procedures-workspace,
.app-content .catalog-page > .catalog-workspace,
.app-content .catalog-page > .workspace,
.app-content .catalog-page > [class*="-workspace"] {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    padding-bottom: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.app-content .clients-page .results-card.rz-card,
.app-content .diagnoses-page .results-card.rz-card,
.app-content .delivery-procedures-page .results-card.rz-card,
.app-content .eligibility-workflow-page .results-card.rz-card,
.app-content .catalog-page .results-card.rz-card {
    display: flex;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    flex-direction: column;
    overflow: hidden;
}

.app-content .clients-page .results-card.rz-card > [class*="grid-shell"],
.app-content .diagnoses-page .results-card.rz-card > [class*="grid-shell"],
.app-content .delivery-procedures-page .results-card.rz-card > [class*="grid-shell"],
.app-content .eligibility-workflow-page .results-card.rz-card > [class*="grid-shell"],
.app-content .catalog-page .results-card.rz-card > [class*="grid-shell"] {
    height: auto;
    min-height: 0;
    flex: 1 1 0;
    overflow: hidden;
}

.app-content .clients-page .results-card.rz-card .rz-data-grid,
.app-content .diagnoses-page .results-card.rz-card .rz-data-grid,
.app-content .delivery-procedures-page .results-card.rz-card .rz-data-grid,
.app-content .eligibility-workflow-page .results-card.rz-card .rz-data-grid,
.app-content .catalog-page .results-card.rz-card .rz-data-grid {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.app-content .clients-page .results-card.rz-card .rz-data-grid > .rz-data-grid-data,
.app-content .diagnoses-page .results-card.rz-card .rz-data-grid > .rz-data-grid-data,
.app-content .delivery-procedures-page .results-card.rz-card .rz-data-grid > .rz-data-grid-data,
.app-content .eligibility-workflow-page .results-card.rz-card .rz-data-grid > .rz-data-grid-data,
.app-content .catalog-page .results-card.rz-card .rz-data-grid > .rz-data-grid-data {
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto !important;
}

.app-content .clients-page .results-card.rz-card .rz-pager,
.app-content .diagnoses-page .results-card.rz-card .rz-pager,
.app-content .delivery-procedures-page .results-card.rz-card .rz-pager,
.app-content .eligibility-workflow-page .results-card.rz-card .rz-pager,
.app-content .catalog-page .results-card.rz-card .rz-pager {
    min-height: 2.35rem;
    flex: 0 0 auto;
    margin-bottom: var(--dme-page-bottom-safe-area, 5px) !important;
}

.app-content .delivery-procedures-page .results-card.rz-card
    > .delivery-grid-shell
    > .delivery-procedures-grid.rz-data-grid
    > .rz-pager {
    margin-bottom: calc(var(--dme-page-bottom-safe-area, 5px) - 2px) !important;
}

.app-content:has(.create-page),
.app-content:has(.editor-page) {
    width: 100%;
    max-width: none;
    height: calc(100dvh - 5.85rem);
    min-height: 0;
    padding: 0.5rem 0.5rem calc(0.5rem + var(--dme-page-bottom-safe-area, 5px));
    overflow: hidden;
    box-sizing: border-box;
}

html:has(.create-page),
body:has(.create-page),
.app-layout:has(.create-page),
html:has(.editor-page),
body:has(.editor-page),
.app-layout:has(.editor-page) {
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

.app-body:has(.create-page),
.app-body:has(.editor-page) {
    height: calc(100dvh - 4rem);
    min-height: 0;
    overflow: hidden;
}

.app-content .create-page,
.app-content .editor-page {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.app-content .create-page > form,
.app-content .editor-page > form {
    display: flex;
    flex: 1 1 0;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.app-content .create-page .create-form-layout,
.app-content .editor-page .editor-layout {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.app-content .create-page .create-columns,
.app-content .editor-page .editor-columns {
    display: grid;
    min-height: 0;
    overflow: hidden;
}

.app-content .create-page .create-left-column,
.app-content .create-page .create-right-column,
.app-content .editor-page .left-column,
.app-content .editor-page .right-column {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.app-content .create-page .form-actions {
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    margin-bottom: var(--dme-page-bottom-safe-area, 5px);
}

.app-content .create-page .create-cancel-button {
    color: color-mix(in srgb, var(--rz-text-color) 82%, var(--rz-primary)) !important;
    border-color: color-mix(in srgb, var(--rz-text-color) 38%, var(--rz-base-300)) !important;
    background: transparent !important;
    box-shadow: none !important;
}

.app-content .create-page .create-cancel-button .rzi {
    color: color-mix(in srgb, var(--rz-text-color) 88%, var(--rz-primary)) !important;
}

.app-content .create-page .create-cancel-button:hover {
    color: var(--rz-text-title-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 48%, var(--rz-text-color)) !important;
    background: color-mix(in srgb, var(--rz-primary) 7%, transparent) !important;
}

.app-content .dme-back-button.rz-button,
.admin-content .dme-back-button.rz-button {
    color: color-mix(in srgb, var(--rz-text-color) 88%, var(--rz-primary)) !important;
    border-color: color-mix(in srgb, var(--rz-text-color) 48%, var(--rz-base-300)) !important;
    background: color-mix(in srgb, var(--rz-base-background-color) 92%, var(--rz-primary) 8%) !important;
    box-shadow: none !important;
}

.app-content .dme-back-button.rz-button .rzi,
.admin-content .dme-back-button.rz-button .rzi {
    color: color-mix(in srgb, var(--rz-text-color) 92%, var(--rz-primary)) !important;
}

.app-content .dme-back-button.rz-button:hover,
.admin-content .dme-back-button.rz-button:hover {
    color: var(--rz-text-title-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 58%, var(--rz-text-color)) !important;
    background: color-mix(in srgb, var(--rz-primary) 12%, var(--rz-base-background-color)) !important;
}

.app-content .dme-back-button.rz-button:hover .rzi,
.admin-content .dme-back-button.rz-button:hover .rzi {
    color: var(--rz-text-title-color) !important;
}

.app-content .dme-back-button.rz-button:focus-visible,
.admin-content .dme-back-button.rz-button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--rz-primary) 42%, transparent);
    outline-offset: 2px;
}

.app-content .create-page .check-address-button,
.app-content .editor-page .check-address-button {
    color: color-mix(in srgb, var(--rz-text-color) 84%, var(--rz-primary)) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 46%, var(--rz-text-color)) !important;
    background: transparent !important;
    box-shadow: none !important;
}

.app-content .create-page .check-address-button .rzi,
.app-content .editor-page .check-address-button .rzi {
    color: color-mix(in srgb, var(--rz-primary) 55%, var(--rz-text-color)) !important;
}

.app-content .create-page .check-address-button:hover,
.app-content .editor-page .check-address-button:hover {
    color: var(--rz-text-title-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 68%, var(--rz-text-color)) !important;
    background: color-mix(in srgb, var(--rz-primary) 8%, transparent) !important;
}

.app-content .create-page .rz-dropdown,
.app-content .editor-page .rz-dropdown,
.admin-content .editor-page .rz-dropdown {
    display: inline-flex;
    align-items: center;
}

.app-content .create-page .rz-dropdown-label,
.app-content .editor-page .rz-dropdown-label,
.admin-content .editor-page .rz-dropdown-label {
    display: flex;
    height: 100%;
    align-items: center;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1;
}

.app-content .create-page .rz-dropdown-trigger,
.app-content .editor-page .rz-dropdown-trigger,
.admin-content .editor-page .rz-dropdown-trigger {
    display: grid;
    height: 100%;
    align-items: center;
    place-items: center;
}

/*
 * Keep long closed dropdown values out of the clear and trigger actions.
 * Radzen positions both actions over the value area, so reserve their space
 * explicitly and truncate only the displayed closed value.
 */
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog, .login-card)
    .rz-dropdown > .rz-dropdown-label {
    display: flex !important;
    height: 100%;
    min-width: 0;
    width: calc(100% - var(--rz-dropdown-trigger-icon-width, 1.5rem) - .75rem) !important;
    align-self: flex-start !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: hidden;
    padding-block: 0 !important;
    padding-inline-end: .25rem !important;
    line-height: normal !important;
    text-align: left !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog, .login-card)
    .rz-dropdown.rz-clear > .rz-dropdown-label,
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog, .login-card)
    .rz-dropdown:has(> .rz-dropdown-clear-icon) > .rz-dropdown-label {
    width: calc(100%
        - var(--rz-dropdown-trigger-icon-width, 1.5rem)
        - var(--rz-dropdown-trigger-icon-width, 1.5rem)
        - 1.5rem) !important;
}

.app-content .create-page .fields-grid,
.app-content .create-page .text-area-grid {
    row-gap: 5px;
}

/* Radzen renders the grid internals outside the page's isolated CSS scope. */
.clients-results-grid-shell > .clients-grid.rz-data-grid {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.clients-results-grid-shell > .clients-grid.rz-data-grid > .rz-data-grid-data {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: auto !important;
    overflow-y: scroll !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.clients-results-grid-shell > .clients-grid.rz-data-grid > .rz-pager {
    display: none !important;
}

.results-card > .clients-external-pager.rz-pager {
    display: flex !important;
    width: 100%;
    min-height: 2.35rem;
    flex: 0 0 auto;
    margin-bottom: var(--dme-page-bottom-safe-area, 5px) !important;
}

.results-card > .clients-external-pager.rz-pager .rz-dropdown {
    display: inline-flex;
    height: 1.8rem !important;
    min-height: 1.8rem !important;
    align-items: center;
}

.results-card > .clients-external-pager.rz-pager .rz-dropdown-label {
    display: flex;
    height: 100%;
    align-items: center;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1;
}

.results-card > .clients-external-pager.rz-pager .rz-dropdown-trigger {
    display: grid;
    height: 100%;
    align-items: center;
    place-items: center;
}

.results-card > .clients-external-pager.rz-pager .rz-pagesize-text {
    display: inline-flex;
    height: 1.8rem;
    align-items: center;
    line-height: 1;
}

/* Application-wide compact density */
.admin-content .rz-stack,
.app-content .rz-stack,
.dme-dialog .rz-stack,
.login-card .rz-stack {
    gap: 0.62rem !important;
}

.app-content .search-scroll .search-fields.rz-stack {
    row-gap: 5px !important;
    column-gap: 0 !important;
}

.app-content .search-card.rz-card {
    display: flex !important;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    flex-direction: column;
    overflow: hidden !important;
}

.app-content .search-card.rz-card > .search-scroll {
    min-height: 0;
    flex: 1 1 0 !important;
    overflow-x: hidden;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.app-content .search-card.rz-card > .search-actions {
    position: relative;
    z-index: 1;
    flex: 0 0 auto !important;
    padding-bottom: 0.5rem;
}

.app-content .authorization-numbers-page > .authorization-numbers-workspace {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    box-sizing: border-box;
}

.app-content .authorization-numbers-page .search-card.rz-card,
.app-content .authorization-numbers-page .results-card.rz-card {
    display: flex;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    flex-direction: column;
    overflow: hidden;
}

.app-content .authorization-numbers-page .auth-results-grid-shell {
    height: auto;
    min-height: 0;
    flex: 1 1 0;
    overflow: hidden;
}

.app-content .authorization-numbers-page .results-card.rz-card > .clients-external-pager.rz-pager {
    flex: 0 0 auto;
    margin-bottom: var(--dme-page-bottom-safe-area, 5px);
}

.app-content .requests-page .search-card .search-fields .rz-dropdown,
.app-content .authorization-numbers-page .search-card .search-fields .rz-dropdown,
.app-content .authorization-number-editor .rz-dropdown {
    display: inline-flex;
    align-items: center;
}

.app-content .requests-page .search-card .search-fields .rz-dropdown-label,
.app-content .authorization-numbers-page .search-card .search-fields .rz-dropdown-label,
.app-content .authorization-number-editor .rz-dropdown-label {
    display: flex;
    width: 100%;
    min-width: 0;
    flex: 1 1 auto;
    height: 100%;
    align-items: center;
    justify-content: flex-start !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1 !important;
    text-align: left !important;
}

.app-content .requests-page .search-card .search-fields .rz-dropdown-trigger,
.app-content .authorization-numbers-page .search-card .search-fields .rz-dropdown-trigger,
.app-content .authorization-number-editor .rz-dropdown-trigger {
    display: grid;
    height: 100%;
    align-items: center;
    place-items: center;
}

.app-content .search-clear-action.rz-button {
    color: color-mix(in srgb, var(--rz-text-color) 88%, var(--rz-primary)) !important;
    border-color: color-mix(in srgb, var(--rz-text-color) 42%, var(--rz-base-300)) !important;
    background: color-mix(in srgb, var(--rz-primary) 5%, var(--rz-base-background-color)) !important;
    box-shadow: none !important;
}

.app-content .search-clear-action.rz-button .rzi {
    color: inherit !important;
}

.app-content .search-clear-action.rz-button:hover {
    color: var(--rz-text-title-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 58%, var(--rz-text-color)) !important;
    background: color-mix(in srgb, var(--rz-primary) 11%, var(--rz-base-background-color)) !important;
}

.app-content .search-clear-action.rz-button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--rz-primary) 38%, transparent);
    outline-offset: 2px;
}

.app-content .dme-file-picker,
.dme-dialog .dme-file-picker {
    position: relative;
    display: grid;
    width: 100%;
    min-width: 0;
    min-height: 2.1rem;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.55rem;
    overflow: hidden;
    padding: 0.2rem 0.6rem 0.2rem 0.25rem;
    color: var(--rz-text-color);
    border: 1px solid color-mix(in srgb, var(--rz-primary) 34%, var(--rz-base-400));
    border-radius: 0.42rem;
    background: color-mix(in srgb, var(--rz-base-background-color) 92%, var(--rz-base-200));
    cursor: pointer;
    box-sizing: border-box;
}

.app-content .dme-file-picker:hover,
.dme-dialog .dme-file-picker:hover {
    border-color: color-mix(in srgb, var(--rz-primary) 68%, var(--rz-text-color));
    background: color-mix(in srgb, var(--rz-primary) 7%, var(--rz-base-background-color));
}

.app-content .dme-file-picker:focus-within,
.dme-dialog .dme-file-picker:focus-within {
    outline: 3px solid color-mix(in srgb, var(--rz-primary) 30%, transparent);
    outline-offset: 1px;
}

.app-content .dme-file-picker-action,
.dme-dialog .dme-file-picker-action {
    display: inline-flex;
    min-height: 1.65rem;
    align-items: center;
    gap: 0.35rem;
    padding: 0 0.55rem;
    color: color-mix(in srgb, var(--rz-primary) 55%, var(--rz-text-color));
    border: 1px solid color-mix(in srgb, var(--rz-primary) 35%, var(--rz-base-400));
    border-radius: 0.32rem;
    background: color-mix(in srgb, var(--rz-primary) 9%, transparent);
    font-size: 0.7rem;
    font-weight: 800;
    white-space: nowrap;
}

.app-content .dme-file-picker.has-file .dme-file-picker-action,
.dme-dialog .dme-file-picker.has-file .dme-file-picker-action {
    color: color-mix(in srgb, var(--rz-success) 65%, var(--rz-text-color));
    border-color: color-mix(in srgb, var(--rz-success) 40%, var(--rz-base-400));
    background: color-mix(in srgb, var(--rz-success) 9%, transparent);
}

.app-content .dme-file-picker-name,
.dme-dialog .dme-file-picker-name {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: var(--rz-text-secondary-color);
    font-size: 0.72rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-content .dme-file-picker.has-file .dme-file-picker-name,
.dme-dialog .dme-file-picker.has-file .dme-file-picker-name {
    color: var(--rz-text-color);
}

.app-content .dme-file-picker input[type="file"],
.dme-dialog .dme-file-picker input[type="file"] {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    cursor: pointer;
}

.dme-dialog .dme-file-picker.disabled {
    opacity: 0.62;
    cursor: wait;
}

.dme-dialog .dme-file-picker.disabled:hover {
    border-color: color-mix(in srgb, var(--rz-primary) 34%, var(--rz-base-400));
    background: color-mix(in srgb, var(--rz-base-background-color) 92%, var(--rz-base-200));
}

.dme-dialog .dme-file-picker.disabled input[type="file"] {
    cursor: wait;
}

.dme-dialog .history-shell .history-filters .rz-dropdown {
    display: inline-flex;
    height: 2.05rem;
    min-height: 2.05rem;
    align-items: center;
}

.dme-dialog .history-shell .history-filters .rz-dropdown-label {
    display: flex;
    width: 100%;
    min-width: 0;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    align-items: center;
    justify-content: flex-start !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1 !important;
    text-align: left !important;
}

.dme-dialog .history-shell .history-filters .rz-dropdown-trigger {
    display: grid;
    height: 100%;
    min-height: 0;
    align-items: center;
    place-items: center;
}

.admin-content .rz-card,
.app-content .rz-card {
    padding: 0.75rem;
    font-size: 0.82rem;
}

.admin-content .rz-input-md,
.app-content .rz-input-md,
.dme-dialog .rz-input-md,
.login-card .rz-input-md,
.admin-content .rz-dropdown,
.app-content .rz-dropdown,
.dme-dialog .rz-dropdown,
.login-card .rz-dropdown,
.admin-content .rz-numeric,
.app-content .rz-numeric,
.dme-dialog .rz-numeric,
.admin-content .rz-datepicker,
.app-content .rz-datepicker,
.dme-dialog .rz-datepicker {
    min-height: 2.05rem !important;
    height: 2.05rem;
    font-size: 0.82rem;
}

.admin-content .rz-inputtext,
.app-content .rz-inputtext,
.dme-dialog .rz-inputtext,
.login-card .rz-inputtext {
    padding-top: 0.28rem;
    padding-bottom: 0.28rem;
}

textarea:is(.rz-textarea, .rz-inputtext) {
    field-sizing: content;
    overflow-y: hidden;
    resize: none;
}

.admin-content textarea:is(.rz-textarea, .rz-inputtext),
.app-content textarea:is(.rz-textarea, .rz-inputtext),
.dme-dialog textarea:is(.rz-textarea, .rz-inputtext) {
    height: auto;
    min-height: 3.6rem !important;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    line-height: 1.3;
}

.admin-content .rz-form-field-label,
.app-content .rz-form-field-label,
.dme-dialog .rz-form-field-label,
.login-card .rz-form-field-label {
    font-size: 0.76rem;
}

.admin-content .rz-button-md,
.app-content .rz-button-md,
.dme-dialog .rz-button-md {
    min-height: 2.05rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    font-size: 0.8rem;
}

:is(.admin-content, .app-content, .dme-dialog, .login-card)
    :is(.rz-inputtext, .rz-dropdown-label, .rz-dropdown-filter)::placeholder {
    font-size: 0.8rem;
}

.rz-dropdown-panel.rz-input-md,
.rz-dropdown-panel .rz-dropdown-filter,
.rz-dropdown-panel .rz-dropdown-item {
    font-size: 0.82rem;
}

:is(.admin-content, .app-content, .dme-dialog)
    :is(.panel-heading, .section-header) strong {
    font-size: 0.76rem !important;
}

:is(.admin-content, .app-content, .dme-dialog)
    :is(.panel-heading, .section-header) small {
    font-size: 0.68rem !important;
}

:is(.admin-content, .app-content, .dme-dialog)
    :is(.subsection-title, .helper-text, .document-note, .footer-note) {
    font-size: 0.72rem !important;
}

.admin-content .rz-data-grid-data td,
.app-content .rz-data-grid-data td,
.admin-content .rz-grid-table thead th,
.app-content .rz-grid-table thead th {
    height: 2.1rem;
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

.admin-content .rz-paginator,
.app-content .rz-paginator {
    min-height: 2.35rem;
    padding: 0.2rem 0.45rem;
}

.admin-content .rz-paginator-element,
.app-content .rz-paginator-element {
    min-width: 1.85rem;
    height: 1.85rem;
}

.dme-dialog .rz-dialog-titlebar {
    min-height: 2.65rem;
    padding: 0.5rem 0.75rem;
}

.dme-dialog .rz-dialog-titlebar-close {
    width: 1.8rem;
    height: 1.8rem;
}

.dme-dialog .rz-dialog-content {
    padding: 0.75rem;
}

.dme-dialog .dialog-copy {
    margin-bottom: 0.65rem;
}

.dme-dialog .required-fields-note {
    margin: 0 0 0.55rem;
    color: color-mix(in srgb, var(--rz-danger) 72%, var(--rz-text-color));
    font-size: 0.72rem;
    font-weight: 700;
}

.dme-dialog .dialog-checkbox-row {
    min-height: 2.8rem;
    gap: 0.5rem;
    padding: 0.4rem 0.6rem;
}

.dme-dialog .dialog-footer {
    gap: 0.4rem;
    margin: 0.75rem -0.75rem -0.75rem;
    padding: 0.55rem 0.75rem;
}

.client-nested-dialog .rz-dialog-content {
    max-height: min(76vh, 46rem);
    overflow: auto;
}

.client-nested-dialog form {
    display: grid;
    min-width: 0;
    gap: 0.55rem;
}

.client-nested-dialog-grid {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.5rem;
}

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

.inventory-product-dialog-grid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-bottom: .25rem;
}

.inventory-manager-product-dialog-host .rz-dialog-content {
    display: flex;
    min-height: 0;
    overflow: hidden !important;
}

.inventory-manager-product-dialog {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
}

.inventory-manager-product-dialog > .dialog-footer {
    flex: 0 0 auto;
    margin-top: .5rem;
    padding-top: .5rem;
    border-top: 1px solid var(--dme-border);
    background: var(--rz-base-background-color);
}

.client-nested-dialog .rz-dialog-content:has(> .form-grid.dialog-form) {
    position: relative;
    overflow: hidden !important;
    padding-bottom: 3.5rem !important;
}

.client-nested-dialog .form-grid.dialog-form {
    max-height: calc(88vh - 7rem);
    min-height: 0;
    overflow-y: auto;
    margin: 0;
    padding-bottom: 0;
}

.client-nested-dialog .form-grid.dialog-form > .dialog-footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    margin: 0;
    padding: .5rem .75rem;
    border-top: 1px solid var(--dme-border);
    background: var(--rz-base-background-color);
}

.inventory-product-image-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: .5rem;
}

.inventory-product-image-actions img {
    width: 4rem;
    height: 4rem;
    object-fit: contain;
    border: 1px solid var(--dme-border);
    border-radius: .35rem;
}

.additional-field-dialog-editor {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: .5rem;
    margin-bottom: .5rem;
}

@media (max-width: 640px) {
    .additional-field-dialog-editor {
        grid-template-columns: 1fr;
    }
}

.client-nested-dialog-span {
    min-width: 0;
    grid-column: 1 / -1;
}

.client-nested-dialog-toggles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.client-nested-dialog .dialog-footer {
    justify-content: flex-end;
}

.client-nested-dialog .secondary-action {
    color: var(--rz-text-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 45%, var(--rz-base-400)) !important;
    background: color-mix(in srgb, var(--rz-primary) 8%, var(--rz-base-background-color)) !important;
}

.client-nested-dialog .secondary-action:hover {
    color: var(--rz-text-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 62%, var(--rz-text-color)) !important;
    background: color-mix(in srgb, var(--rz-primary) 15%, var(--rz-base-background-color)) !important;
}

.client-nested-dialog .secondary-action:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--rz-primary) 58%, transparent);
    outline-offset: 2px;
}

@media (max-width: 560px) {
    .client-nested-dialog-grid.two-columns,
    .client-nested-dialog-toggles {
        grid-template-columns: minmax(0, 1fr);
    }
}

.grid-tools {
    display: flex;
    min-width: 0;
    min-height: 2.35rem;
    align-items: center;
    flex: 0 0 auto;
    gap: 5px;
    margin-bottom: 5px;
    padding: 0.2rem 0.25rem;
    border: 1px solid color-mix(in srgb, var(--dme-theme-accent) 16%, var(--dme-theme-line));
    border-radius: var(--dme-theme-surface-radius);
    background: color-mix(in srgb, var(--dme-theme-accent) 4%, transparent);
}

.grid-tools .grid-quick-search {
    width: min(22rem, 38vw);
    min-width: 11rem;
}

.grid-tools .rz-textbox,
.grid-tools .rz-button {
    min-height: 2rem;
}

.grid-tools.compact-grid-tools {
    min-height: 2rem;
    flex-wrap: wrap;
    gap: 3px;
    padding-block: .08rem;
}

.grid-tools.compact-grid-tools .grid-quick-search {
    width: min(18rem, 24vw);
    min-width: 10rem;
    max-width: 22rem;
    flex: 1 1 12rem;
}

.grid-tools.compact-grid-tools .rz-textbox,
.grid-tools.compact-grid-tools .rz-button {
    min-height: 1.85rem;
}

.grid-tools .grid-toolbar-icon {
    width: 1.95rem;
    min-width: 1.95rem;
    padding-inline: 0 !important;
}

.grid-tools .grid-toolbar-icon .rz-button-box {
    justify-content: center;
}

.grid-tools .grid-toolbar-icon:hover {
    filter: brightness(1.04);
}

.grid-tools .grid-toolbar-icon:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--rz-primary) 72%, transparent);
    outline-offset: 1px;
}

.grid-tools .grid-reset-button {
    color: color-mix(in srgb, var(--dme-theme-accent) 32%, var(--rz-text-color)) !important;
    border-color: color-mix(in srgb, var(--dme-theme-accent) 38%, var(--dme-theme-line)) !important;
    background: transparent !important;
}

.grid-tools .grid-reset-button:hover {
    color: var(--rz-text-color) !important;
    background: color-mix(in srgb, var(--dme-theme-accent) 9%, transparent) !important;
}

.grid-tools-hint {
    margin-left: auto;
    color: var(--rz-text-secondary-color);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.025em;
    white-space: nowrap;
}

.rz-group-header:has(> .grid-tools) {
    flex-wrap: nowrap;
    gap: 0.4rem;
    padding: 0.25rem;
}

.rz-group-header > .grid-tools {
    flex: 1 1 auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

.rz-group-header > .grid-tools .grid-quick-search {
    width: min(18rem, 24vw);
}

.rz-group-header > .rz-column-picker {
    flex: 0 0 auto;
}

.rz-group-header > .rz-column-picker .rz-dropdown {
    min-width: 10rem;
    max-width: 13rem;
}

.rz-popup .rz-filter-container {
    padding: 0.55rem;
}

.rz-popup .rz-filter-container .rz-button {
    min-height: 2rem;
}

@media (max-width: 760px) {
    .rz-group-header:has(> .grid-tools) {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .rz-group-header > .grid-tools,
    .rz-group-header > .rz-column-picker,
    .rz-group-header > .rz-column-picker .rz-dropdown {
        width: 100%;
        max-width: none;
    }

    .grid-tools {
        flex-wrap: wrap;
    }

    .grid-tools .grid-quick-search {
        width: 100%;
    }

    .grid-tools-hint {
        display: none;
    }
}

.theme-humanistic .app-header,
.theme-humanistic .admin-header {
    border-bottom-width: 2px;
    background: color-mix(in srgb, var(--dme-theme-surface) 91%, transparent);
}

.theme-humanistic .backdrop-grid {
    transform: skewX(-2deg);
}

.theme-humanistic .rz-grid-table thead th {
    color: color-mix(in srgb, var(--dme-theme-accent) 72%, var(--rz-text-color));
    background: color-mix(in srgb, var(--dme-theme-accent) 8%, var(--dme-theme-surface));
}

.theme-humanistic-dark .app-header,
.theme-humanistic-dark .admin-header {
    border-bottom-color: color-mix(in srgb, var(--dme-theme-accent) 54%, transparent);
    box-shadow:
        0 0.5rem 1.8rem rgba(0, 0, 0, 0.34),
        0 1px 0 color-mix(in srgb, var(--dme-theme-accent) 22%, transparent);
}

.theme-humanistic-dark .backdrop-grid {
    filter: drop-shadow(0 0 0.18rem color-mix(in srgb, var(--dme-theme-accent) 15%, transparent));
}

.theme-software .app-header,
.theme-software .admin-header,
.theme-software-dark .app-header,
.theme-software-dark .admin-header {
    border-bottom-color: color-mix(in srgb, var(--dme-theme-secondary) 25%, var(--dme-theme-line));
    background: color-mix(in srgb, var(--dme-theme-surface) 94%, transparent);
    box-shadow: var(--dme-theme-shadow);
}

.theme-software .backdrop-grid,
.theme-software-dark .backdrop-grid {
    transform: rotate(0.35deg) scale(1.02);
}

.theme-software .rz-grid-table thead th,
.theme-software-dark .rz-grid-table thead th {
    color: color-mix(in srgb, var(--dme-theme-secondary) 52%, var(--rz-text-color));
    background: color-mix(in srgb, var(--dme-theme-secondary) 7%, var(--dme-theme-surface));
    text-transform: none;
}

.theme-software .rz-button,
.theme-software-dark .rz-button {
    border-radius: 7px !important;
}

.theme-software-dark .admin-backdrop::before,
.theme-software-dark .app-backdrop::before {
    opacity: 0.42;
    transform: skewX(-14deg);
}

.theme-standard .app-header,
.theme-standard .admin-header {
    border-bottom-color: #b7c0cc;
    background: #ffffff;
    box-shadow: 0 1px 4px rgba(31, 46, 67, 0.08);
    backdrop-filter: none;
}

.theme-standard .app-backdrop,
.theme-standard .admin-backdrop {
    background:
        linear-gradient(180deg, rgba(36, 94, 170, 0.035), transparent 34%),
        var(--rz-body-background-color);
}

.theme-standard .backdrop-glow,
.theme-standard .backdrop-routes,
.theme-standard .backdrop-axis,
.theme-standard .backdrop-data-mark,
.theme-standard .admin-backdrop::before,
.theme-standard .admin-backdrop::after,
.theme-standard .app-backdrop::before,
.theme-standard .app-backdrop::after {
    display: none;
}

.theme-standard .backdrop-grid {
    background-image:
        linear-gradient(rgba(36, 94, 170, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(36, 94, 170, 0.045) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(to bottom, black, transparent 72%);
    transform: none;
}

.theme-standard .rz-grid-table thead th {
    color: #29496f;
    background: #edf1f6;
    text-transform: uppercase;
}

.theme-standard .rz-card,
.theme-standard .catalog-card,
.theme-standard .settings-card {
    backdrop-filter: none !important;
}

.rz-button.dme-history-button {
    width: 2rem;
    min-width: 2rem;
    height: 2rem;
    padding: 0;
    color: color-mix(in srgb, var(--rz-primary) 38%, var(--rz-text-color)) !important;
    border: 1px solid color-mix(in srgb, var(--rz-text-color) 28%, transparent) !important;
    border-radius: .35rem;
    background: transparent !important;
    box-shadow: none !important;
}

.rz-button.dme-history-button:hover {
    color: var(--rz-text-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 48%, transparent) !important;
    background: color-mix(in srgb, var(--rz-primary) 11%, transparent) !important;
}

.rz-button.dme-history-button:focus-visible {
    outline: 2px solid var(--rz-primary);
    outline-offset: 1px;
}

.row-actions,
.draft-row-actions,
.document-actions {
    display: flex;
    align-items: center;
    gap: .08rem;
    white-space: nowrap;
}

.settings-heading > .dme-history-button {
    margin-left: auto;
}

.dialog-footer > .dme-history-button,
.form-actions > .dme-history-button,
.editor-footer > div > .dme-history-button {
    margin-right: auto;
}

@media (max-width: 700px) {
    .backdrop-routes {
        right: -55%;
        width: 64rem;
        opacity: 0.42;
    }

    .backdrop-data-mark,
    .backdrop-axis {
        display: none;
    }

    .catalog-header {
        align-items: start;
        flex-direction: column;
    }

    .dme-list-header {
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .dme-list-header-actions {
        width: 100%;
        justify-content: flex-end;
    }

    .dme-record-count {
        margin-right: auto;
    }
}

/* Shared legacy-compatible Client rail on Jobs create/edit pages. */
.authorization-number-editor .editor-columns,
.visit-editor .editor-columns {
    grid-template-columns: minmax(20rem, 23rem) minmax(0, 1fr);
}

.authorization-number-editor .job-client-column,
.visit-editor .job-client-column {
    min-width: 0;
}

@media (max-width: 900px) {
    .authorization-number-editor .editor-columns,
    .visit-editor .editor-columns {
        grid-template-columns: 1fr;
    }
}

/*
 * Page grids keep their natural column width inside a full-width grid shell.
 * Wide tables scroll horizontally instead of stretching or compressing columns.
 */
.dme-editor-grid.rz-data-grid,
.app-content .rz-data-grid,
.admin-content .rz-data-grid,
.rz-dialog .rz-data-grid {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

.dme-editor-grid.rz-data-grid > .rz-data-grid-data,
.app-content .rz-data-grid > .rz-data-grid-data,
.admin-content .rz-data-grid > .rz-data-grid-data,
.rz-dialog .rz-data-grid > .rz-data-grid-data {
    overflow-x: auto !important;
    scrollbar-gutter: stable;
}

.dme-editor-grid.rz-data-grid .rz-grid-table,
.app-content .rz-data-grid .rz-grid-table,
.admin-content .rz-data-grid .rz-grid-table {
    width: max-content !important;
    min-width: 0 !important;
    table-layout: auto !important;
}

.rz-dialog .rz-data-grid .rz-grid-table {
    width: max-content !important;
    min-width: 0 !important;
    table-layout: auto !important;
}

.dme-editor-grid.rz-data-grid .rz-grid-table thead th,
.dme-editor-grid.rz-data-grid .rz-grid-table tbody td,
.app-content .rz-data-grid .rz-grid-table thead th,
.app-content .rz-data-grid .rz-grid-table tbody td,
.admin-content .rz-data-grid .rz-grid-table thead th,
.admin-content .rz-data-grid .rz-grid-table tbody td,
.rz-dialog .rz-data-grid .rz-grid-table thead th,
.rz-dialog .rz-data-grid .rz-grid-table tbody td {
    overflow: visible;
    white-space: nowrap;
    text-overflow: clip;
}

/*
 * Create/edit forms contain compact embedded grids whose component styles can
 * remove Radzen's default border width. Draw both axes explicitly so the
 * separators remain visible in every theme without changing column sizing.
 */
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog) form {
    --dme-editor-grid-cell-separator:
        color-mix(in srgb, var(--rz-text-color) 20%, var(--rz-base-300));
    --dme-editor-grid-header-separator:
        color-mix(in srgb, var(--rz-text-color) 28%, var(--rz-base-300));
}

.theme-dark :is(.app-content, .admin-content, .dme-dialog, .rz-dialog) form {
    --dme-editor-grid-cell-separator: var(--dme-grid-cell-separator);
    --dme-editor-grid-header-separator: var(--dme-grid-header-separator);
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    form .rz-data-grid .rz-grid-table thead th,
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    form table:not(.rz-grid-table) thead th {
    border-right: 1px solid var(--dme-editor-grid-header-separator) !important;
    border-bottom: 1px solid var(--dme-editor-grid-header-separator) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    form .rz-data-grid .rz-grid-table tbody td,
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    form table:not(.rz-grid-table) tbody td {
    border-right: 1px solid var(--dme-editor-grid-cell-separator) !important;
    border-bottom: 1px solid var(--dme-editor-grid-cell-separator) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    form :is(.rz-grid-table, table:not(.rz-grid-table)) tr > :last-child {
    border-right-color: transparent !important;
}

/*
 * Keep cards inside the available page/dialog width. When a card contains a
 * wider editor, toolbar, table, or other fixed-width content, scroll only that
 * card horizontally instead of clipping or compressing its contents.
 */
.app-content .rz-card,
.admin-content .rz-card,
.dme-dialog .rz-card,
.rz-dialog .rz-card,
.login-card,
.dme-dialog .history-event-card,
.rz-dialog .history-event-card {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain;
    box-sizing: border-box;
}
/* Shared create/edit header actions: primary workflow first, navigation last. */
.dme-editor-header-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: .4rem;
}

/* Requests list procedure selection workflow. */
.requests-page .procedure-detail-list > div {
    grid-template-columns: 2rem 7rem 6rem 8rem 8rem 5rem 7rem 8rem 8rem 7rem !important;
}

.requests-page .procedure-detail-list > div.selected {
    outline: 1px solid color-mix(in srgb, var(--rz-primary) 58%, transparent) !important;
    background: color-mix(in srgb, var(--rz-primary) 12%, var(--rz-base-background-color)) !important;
}

.requests-page .procedure-selection-count {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    padding: .2rem .45rem;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 22%, var(--rz-base-300));
    border-radius: 99px;
    color: var(--rz-text-secondary-color);
    font-size: .68rem;
    white-space: nowrap;
}

.requests-page .procedure-selection-count strong {
    color: var(--rz-text-color);
    font-size: .74rem;
}

.requests-page .requests-grid-tools .grid-quick-search {
    width: min(17rem, 24vw);
}

.requests-page .requests-grid-tools .procedure-selection-count {
    padding: .12rem .36rem;
}

@media (max-width: 760px) {
    .requests-page .requests-grid-tools .grid-quick-search {
        width: auto;
        max-width: none;
        flex-basis: 100%;
        order: 10;
    }
}

.dme-editor-header-actions .dme-required-note {
    margin-right: .2rem;
    color: var(--rz-danger);
    font-size: .68rem;
    font-weight: 700;
}

.dme-editor-header-actions .dme-header-action-separator {
    width: 1px;
    height: 1.5rem;
    margin-inline: .12rem;
    background: var(--rz-base-300);
}

.dme-editor-header-actions .dme-header-save {
    box-shadow: 0 .2rem .55rem color-mix(in srgb, var(--rz-primary) 18%, transparent);
}

@media (max-width: 700px) {
    .dme-editor-header-actions {
        width: 100%;
        justify-content: flex-end;
    }

    .dme-editor-header-actions .dme-required-note {
        width: 100%;
        margin-right: 0;
    }
}

/*
 * Readability floor for locally scoped page typography.
 * These rules intentionally change only text size; control heights, spacing,
 * grids, and the reserved dropdown action areas remain page-owned.
 */
:is(.app-layout, .admin-layout)
    :is(
        .page-header p,
        .catalog-header p,
        .editor-header p,
        .clients-eyebrow,
        .create-eyebrow,
        .diagnoses-eyebrow,
        .plan-types-header p,
        .message-center-header p,
        .document-import-page-header p
    ) {
    font-size: 0.68rem !important;
}

:is(.app-layout, .admin-layout)
    :is(
        .app-brand small,
        .profile-copy small,
        .menu-trigger,
        .menu-group-label,
        .menu-dropdown-header small,
        .menu-group-label small,
        .backdrop-data-mark
    ) {
    font-size: 0.7rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    :is(.rz-card, form) small {
    font-size: 0.72rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    :is(
        .editor-header > div,
        .editor-header > div > span,
        .editor-footer > span,
        .header-actions,
        .records-in-view,
        .helper-text,
        .document-limit,
        .document-note,
        .required-note,
        .required-fields-note,
        .dme-required-note,
        .footer-note,
        .address-check,
        .address-coordinates > span,
        .history-action,
        .character-count,
        .client-result-limit,
        .evidence-confidence,
        .grid-tools-hint
    ) {
    font-size: 0.72rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    :is(.panel-heading, .section-header, .settings-heading, .mask-heading) small {
    font-size: 0.68rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    :is(.client-details, .insurance-summary) dt {
    font-size: 0.7rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    :is(.client-details, .insurance-summary) legend {
    font-size: 0.72rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    .client-disclosure > summary strong {
    font-size: 0.74rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    :is(.documents-table, .documents-table-wrap, .draft-table) th {
    font-size: 0.68rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    :is(.document-status, .client-avatar) {
    font-size: 0.7rem !important;
}

:is(.app-content, .admin-content, .dme-dialog)
    form label:not(.rz-form-field-label) {
    font-size: 0.76rem;
}

.request-report-page .field label {
    font-size: 0.68rem !important;
}

.request-report-page .report-sheet table {
    font-size: 0.68rem !important;
}

.request-report-page .report-sheet th,
.request-report-page .report-sheet footer span {
    font-size: 0.65rem !important;
}

/*
 * Requests use Radzen's master-detail row for procedures. The nested grid
 * stays in document flow so several requests can be expanded without panels
 * overlapping one another.
 */
.requests-grid .request-procedure-master-detail {
    width: fit-content;
    min-width: 0;
    max-width: 100%;
    padding: 0.45rem 0.55rem 0.55rem;
    border-left: 2px solid color-mix(in srgb, var(--rz-primary) 72%, transparent);
    background:
        linear-gradient(
            90deg,
            color-mix(in srgb, var(--rz-primary) 7%, var(--rz-base-background-color)),
            var(--rz-base-background-color) 28%
        );
}

.requests-grid .request-procedure-detail-heading {
    display: flex;
    min-height: 2rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0 0.15rem 0.35rem;
    color: var(--rz-text-secondary-color);
    font-size: 0.7rem;
}

.requests-grid .request-procedure-detail-heading > div {
    display: flex;
    align-items: baseline;
    gap: 0.55rem;
}

.requests-grid .request-procedure-detail-heading strong {
    color: var(--rz-primary);
    font-size: 0.72rem;
    letter-spacing: 0.1em;
}

.requests-grid .request-procedure-detail-grid.rz-data-grid {
    width: fit-content;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--rz-text-color) 20%, var(--rz-base-300));
    border-radius: 0.4rem;
    background: var(--rz-base-background-color);
}

.requests-grid .request-procedure-detail-grid .rz-grid-table {
    width: max-content !important;
    min-width: 0 !important;
}

.requests-grid .request-procedure-detail-grid .rz-grid-table thead th,
.requests-grid .request-procedure-detail-grid .rz-grid-table tbody td {
    height: 2rem;
    padding-block: 0.18rem;
    border-right: 1px solid color-mix(in srgb, var(--rz-text-color) 18%, var(--rz-base-300)) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--rz-text-color) 18%, var(--rz-base-300)) !important;
    font-size: 0.74rem;
}

.requests-grid .request-procedure-detail-grid .rz-grid-table tr > :last-child {
    border-right-color: transparent !important;
}

.requests-grid .procedure-detail-state {
    display: inline-flex;
    min-height: 1.35rem;
    align-items: center;
    padding: 0.08rem 0.4rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--rz-primary) 9%, transparent);
    font-size: 0.68rem;
    font-weight: 750;
}

.requests-grid .procedure-detail-state.overdue {
    color: color-mix(in srgb, var(--rz-danger) 78%, var(--rz-text-color));
    background: color-mix(in srgb, var(--rz-danger) 16%, var(--rz-base-background-color));
}

.requests-grid .procedure-detail-state.due-soon {
    color: color-mix(in srgb, #eab308 72%, var(--rz-text-color));
    background: color-mix(in srgb, #eab308 17%, var(--rz-base-background-color));
}

.requests-grid .procedure-detail-state.inactive {
    color: var(--rz-text-secondary-color);
    background: var(--rz-base-200);
}

.requests-grid .request-procedure-master-cell {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.25rem;
}

.requests-grid .request-procedure-master-cell > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.requests-grid .request-procedure-expand-button.rz-button {
    flex: 0 0 1.7rem;
    width: 1.7rem;
    min-width: 1.7rem;
    height: 1.7rem;
    padding: 0 !important;
    color: color-mix(in srgb, var(--rz-primary) 68%, var(--rz-text-color)) !important;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 25%, transparent) !important;
    background: color-mix(in srgb, var(--rz-primary) 7%, transparent) !important;
}

.requests-grid .request-procedure-expand-button.rz-button:hover,
.requests-grid .request-procedure-expand-button.rz-button:focus-visible {
    color: var(--rz-text-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 58%, var(--rz-base-400)) !important;
    background: color-mix(in srgb, var(--rz-primary) 15%, var(--rz-base-background-color)) !important;
}

/*
 * Grid columns size to their widest header or cell content. Fixed widths from
 * page markup and persisted user settings are intentionally not used; wide
 * result sets remain available through the grid's horizontal scroller.
 */
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid .rz-grid-table {
    width: max-content !important;
    min-width: 0 !important;
    table-layout: auto !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid .rz-grid-table col {
    width: auto !important;
    min-width: 0 !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid .rz-grid-table :is(th, td) {
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    white-space: nowrap;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid .rz-grid-table thead th {
    border-right: 1px solid var(--dme-grid-header-separator) !important;
    border-bottom: 1px solid var(--dme-grid-header-separator) !important;
    background-clip: padding-box;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid .rz-grid-table thead tr > th:last-child {
    border-right-color: transparent !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid :is(.dme-row-number-header, .dme-row-number-cell) {
    box-sizing: border-box;
    width: 2.75rem !important;
    min-width: 2.75rem !important;
    max-width: 2.75rem !important;
    padding-inline: 0.35rem !important;
    color: var(--rz-text-secondary-color);
    font-variant-numeric: tabular-nums;
    text-align: center !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid .dme-row-number-header {
    font-weight: 800;
}

:is(.app-layout, .admin-layout, .dme-dialog, .rz-dialog) {
    --dme-grid-selected-background:
        color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 17%, var(--rz-base-background-color));
    --dme-grid-selected-foreground:
        color-mix(in srgb, var(--rz-text-color) 92%, var(--dme-theme-accent, var(--rz-primary)));
    --dme-grid-selected-accent:
        color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 84%, var(--rz-text-color));
}

.theme-dark {
    --dme-grid-selected-background:
        color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 26%, var(--rz-base-background-color));
    --dme-grid-selected-foreground:
        color-mix(in srgb, var(--rz-text-color) 94%, white);
    --dme-grid-selected-accent:
        color-mix(in srgb, var(--dme-theme-accent, var(--rz-primary)) 72%, white);
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid tbody tr.rz-data-row.rz-state-highlight > td,
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid tbody tr.rz-data-row:has(.dme-row-selector .rz-state-active) > td {
    color: var(--dme-grid-selected-foreground) !important;
    background-color: var(--dme-grid-selected-background) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid tbody tr.rz-data-row.rz-state-highlight:hover > td,
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid tbody tr.rz-data-row:has(.dme-row-selector .rz-state-active):hover > td {
    color: var(--dme-grid-selected-foreground) !important;
    background-color: var(--dme-grid-selected-background) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid tbody tr.rz-data-row.rz-state-highlight > td:first-child,
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid tbody tr.rz-data-row:has(.dme-row-selector .rz-state-active) > td:first-child {
    box-shadow: inset 3px 0 0 var(--dme-grid-selected-accent) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-data-grid :is(.request-detail-toggle-header, .request-detail-toggle-cell) {
    box-sizing: border-box;
    width: 2.35rem !important;
    min-width: 2.35rem !important;
    max-width: 2.35rem !important;
    padding-inline: 0.25rem !important;
    text-align: center !important;
}

.requests-grid .request-detail-row-button.rz-button {
    width: 1.7rem;
    min-width: 1.7rem;
    height: 1.7rem;
    padding: 0 !important;
    color: color-mix(in srgb, var(--rz-primary) 68%, var(--rz-text-color)) !important;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 25%, transparent) !important;
    background: color-mix(in srgb, var(--rz-primary) 7%, transparent) !important;
}

.requests-grid .request-detail-row-button.rz-button:hover,
.requests-grid .request-detail-row-button.rz-button:focus-visible {
    color: var(--rz-text-color) !important;
    border-color: color-mix(in srgb, var(--rz-primary) 58%, var(--rz-base-400)) !important;
    background: color-mix(in srgb, var(--rz-primary) 15%, var(--rz-base-background-color)) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-datepicker.dme-date-input-invalid {
    border-color: var(--rz-danger) !important;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--rz-danger) 72%, transparent) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .rz-datepicker.dme-date-input-invalid .rz-inputtext {
    color: color-mix(in srgb, var(--rz-danger) 82%, var(--rz-text-color)) !important;
}

.dme-date-validation-message {
    display: block;
    margin: 0.15rem 0 0;
    color: var(--rz-danger);
    font-size: 0.76rem;
    font-weight: 650;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-transform: none;
}

.dme-date-validation-message[hidden] {
    display: none !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .dme-active-status-badge.rz-badge {
    min-width: 5.25rem;
    justify-content: center;
    padding: 0.24rem 0.55rem;
    border: 1px solid transparent;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.035em;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .dme-active-status-badge.is-active.rz-badge {
    color: color-mix(in srgb, var(--rz-success-dark, var(--rz-success)) 72%, var(--rz-text-color)) !important;
    border-color: color-mix(in srgb, var(--rz-success) 48%, transparent) !important;
    background: color-mix(in srgb, var(--rz-success) 22%, var(--rz-base-background-color)) !important;
}

.theme-dark :is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .dme-active-status-badge.is-active.rz-badge {
    color: color-mix(in srgb, var(--rz-success-lighter, var(--rz-success)) 84%, white) !important;
    border-color: color-mix(in srgb, var(--rz-success) 66%, transparent) !important;
    background: color-mix(in srgb, var(--rz-success) 34%, var(--rz-base-background-color)) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .dme-active-status-badge.is-inactive.rz-badge {
    color: color-mix(in srgb, var(--rz-warning-dark, var(--rz-warning)) 76%, var(--rz-text-color)) !important;
    border-color: color-mix(in srgb, var(--rz-warning) 45%, transparent) !important;
    background: color-mix(in srgb, var(--rz-warning) 18%, var(--rz-base-background-color)) !important;
}

.theme-dark :is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    .dme-active-status-badge.is-inactive.rz-badge {
    color: color-mix(in srgb, var(--rz-warning-lighter, var(--rz-warning)) 78%, white) !important;
    border-color: color-mix(in srgb, var(--rz-warning) 58%, transparent) !important;
    background: color-mix(in srgb, var(--rz-warning) 28%, var(--rz-base-background-color)) !important;
}

/*
 * Control hints are consistently uppercase while entered and selected values
 * retain their original casing.
 */
:is(.app-content, .admin-content, .dme-dialog, .login-card)
    .rz-form-field-label {
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

:is(.app-content, .admin-content, .dme-dialog, .login-card)
    :is(input, textarea)::placeholder,
.rz-dropdown-panel .rz-dropdown-filter::placeholder {
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

:is(.app-content, .admin-content, .dme-dialog, .login-card)
    .rz-dropdown-label.rz-placeholder {
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

/*
 * Canonical grid density and typography. Clients is the visual reference for
 * every page, dialog, nested editor grid, draft table, and document table.
 */
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(.rz-data-grid .rz-grid-table, .draft-table, .documents-table, .documents-table-wrap > table) {
    font-family: Inter, "Segoe UI", sans-serif !important;
    font-size: 0.76rem !important;
}

/*
 * Embedded editor tables follow the same sizing rule as Radzen grids: keep
 * every record on one line and let the containing table shell scroll sideways.
 */
:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(.draft-table-wrap, .documents-table-wrap) {
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(.draft-table, .documents-table, .documents-table-wrap > table) {
    width: max-content !important;
    min-width: 100% !important;
    table-layout: auto !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(
        .draft-table th,
        .draft-table td,
        .documents-table th,
        .documents-table td,
        .documents-table-wrap > table th,
        .documents-table-wrap > table td
    ) {
    min-width: max-content;
    max-width: none;
    white-space: nowrap;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(
        .rz-data-grid .rz-grid-table thead th,
        .rz-data-grid .rz-grid-table tbody td,
        .draft-table th,
        .draft-table td,
        .documents-table th,
        .documents-table td,
        .documents-table-wrap > table th,
        .documents-table-wrap > table td
    ) {
    height: 2.1rem !important;
    min-height: 0 !important;
    padding-top: 0.2rem !important;
    padding-bottom: 0.2rem !important;
    font-family: Inter, "Segoe UI", sans-serif !important;
    font-size: 0.76rem !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(
        .rz-data-grid .rz-grid-table thead th,
        .draft-table th,
        .documents-table th,
        .documents-table-wrap > table th
    ) {
    border-bottom-color: color-mix(in srgb, var(--rz-primary) 18%, var(--rz-base-300)) !important;
    background: color-mix(in srgb, var(--rz-primary) 5%, var(--rz-base-background-color)) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(
        .rz-data-grid .rz-column-title,
        .draft-table th,
        .documents-table th,
        .documents-table-wrap > table th
    ) {
    font-size: 0.69rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.075em !important;
    text-transform: uppercase !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(
        .rz-data-grid tbody tr.rz-data-row:not(.rz-state-highlight):hover > td,
        .draft-table tbody tr:hover > td,
        .documents-table tbody tr:hover > td,
        .documents-table-wrap > table tbody tr:hover > td
    ) {
    background: color-mix(in srgb, var(--rz-primary) 6%, var(--rz-base-background-color)) !important;
}

:is(.app-content, .admin-content, .dme-dialog, .rz-dialog)
    :is(
        .draft-table,
        .documents-table,
        .documents-table-wrap > table
    ) :is(.draft-row-number, .dme-row-number-header, .dme-row-number-cell) {
    box-sizing: border-box;
    width: 2.75rem !important;
    min-width: 2.75rem !important;
    max-width: 2.75rem !important;
    padding-inline: 0.35rem !important;
    color: var(--rz-text-secondary-color);
    font-variant-numeric: tabular-nums;
    text-align: center !important;
}

@media (min-width: 1181px) and (max-width: 1720px) {
    .rz-layout > .rz-header.app-header {
        min-height: 5rem;
    }

    :is(.app-body, .app-content):has(:is(
        .clients-page,
        .delivery-check-manager-page,
        .visit-check-manager-page,
        .diagnoses-page,
        .delivery-procedures-page,
        .billing-file-page,
        .inventory-import-page,
        .eligibility-workflow-page,
        .client-import-page,
        .patient-chart-page,
        .superbill-page,
        .medgen-page,
        .integra-order-page,
        .catalog-page
    )) {
        height: calc(100dvh - 5rem);
    }
}