:root {
    --rz-sidebar-width: 250px;
    --rz-border-radius: 22px;
    
    /* Shared Brand Colors */
    --rz-primary: #202650;
    --rz-primary-light: #59609a;
    --rz-primary-dark: #141936;
    --rz-accent: #eef58f;
}

/* Light Theme Variables (Default) */
.material {
    --sm-light-canvas: #f6f8fb;
    --sm-light-header: #f1f3f8;
    --sm-light-sidebar: #ffffff;
    --sm-light-panel: #ffffff;
    --sm-light-panel-strong: #ffffff;
    --sm-light-panel-soft: #f7f9fc;
    --sm-light-row: #ffffff;
    --sm-light-row-alt: #f7f9fc;
    --sm-light-border: #e3e7ef;
    --sm-light-border-soft: rgba(32, 38, 80, 0.08);
    --sm-light-text: #2d3548;
    --sm-light-text-muted: #697386;
    --sm-light-primary: #5965e8;
    --sm-light-primary-dark: #202650;
    --sm-light-primary-soft: #eef0ff;
    --sm-light-purple-soft: #f1edff;
    --sm-light-green: #0f9f7a;

    --rz-body-background-color: var(--sm-light-canvas);
    --rz-header-background-color: var(--sm-light-header);
    --rz-sidebar-background-color: var(--sm-light-sidebar);
    --rz-card-background-color: var(--sm-light-panel);
    --rz-dialog-background-color: var(--sm-light-panel);

    --rz-text-color: var(--sm-light-text);
    --rz-text-secondary-color: var(--sm-light-text-muted);
    --rz-text-disabled-color: #9aa3b5;

    --rz-primary: var(--sm-light-primary-dark);
    --rz-primary-light: var(--sm-light-primary);
    --rz-primary-dark: #141936;
    --rz-accent: #dce58a;

    --rz-input-background-color: #ffffff;
    --rz-input-border: 1px solid #dfe4ee;
    --rz-input-color: var(--sm-light-text);
    --rz-input-value-color: var(--sm-light-text);
    --rz-input-placeholder-color: #667085;
    --rz-input-border-radius: 18px;
    --rz-input-height: 44px;
    --rz-input-padding-block: 0.52rem;
    --rz-input-padding-inline: 1rem;
    --rz-input-focus-background-color: #ffffff;
    --rz-input-focus-border: 1px solid rgba(89, 101, 232, 0.58);
    --rz-input-focus-shadow: 0 0 0 3px rgba(89, 101, 232, 0.12);

    --rz-divider: var(--sm-light-border-soft);

    --rz-shadow-0: none;
    --rz-shadow-1: 0 2px 10px rgba(35, 45, 70, 0.08);
    --rz-shadow-2: 0 8px 20px rgba(35, 45, 70, 0.1);
    --rz-shadow-3: 0 14px 34px rgba(35, 45, 70, 0.12);

    --rz-button-border-radius: 999px;
    --rz-button-shadow: none;
    --rz-button-hover-shadow: none;
    --rz-button-focus-shadow: 0 0 0 3px rgba(89, 101, 232, 0.14);

    --rz-checkbox-width: 1.25rem;
    --rz-checkbox-height: 1.25rem;
    --rz-checkbox-border-radius: 5px;
    --rz-checkbox-checked-background-color: var(--sm-light-primary);
    --rz-checkbox-checked-border: 1px solid var(--sm-light-primary);

    --rz-switch-background-color: #d9dee8;
    --rz-switch-checked-background-color: #5965e8;
    --rz-switch-circle-background-color: #8792a3;
    --rz-switch-checked-circle-background-color: #ffffff;

    --rz-dropdown-open-background-color: #ffffff;
    --rz-dropdown-open-border: 1px solid rgba(89, 101, 232, 0.44);
    --rz-dropdown-item-hover-background-color: #eef0ff;
    --rz-dropdown-item-hover-color: var(--sm-light-text);
    --rz-dropdown-item-selected-background-color: #eef0ff;
    --rz-dropdown-item-selected-color: var(--sm-light-primary-dark);
    --rz-dropdown-panel-border: 1px solid #dfe4ee;
    --rz-dropdown-panel-shadow: 0 16px 34px rgba(35, 45, 70, 0.16);

    --rz-grid-background-color: var(--sm-light-panel);
    --rz-grid-border-radius: 6px;
    --rz-grid-shadow: var(--rz-shadow-2);
    --rz-grid-cell-border: 1px solid var(--sm-light-border);
    --rz-grid-bottom-cell-border: 1px solid var(--sm-light-border);
    --rz-grid-right-cell-border: 1px solid transparent;
    --rz-grid-cell-color: var(--sm-light-text);
    --rz-grid-cell-font-size: 0.95rem;
    --rz-grid-cell-padding: 0.68rem 0.78rem;
    --rz-grid-header-background-color: #f7f9fc;
    --rz-grid-header-color: #30384c;
    --rz-grid-header-font-size: 0.84rem;
    --rz-grid-header-font-weight: 800;
    --rz-grid-header-text-transform: none;
    --rz-grid-header-cell-padding: 0.72rem 0.58rem;
    --rz-grid-header-cell-border: 1px solid transparent;
    --rz-grid-header-cell-border-bottom: 1px solid var(--sm-light-border);
    --rz-grid-stripe-background-color: var(--sm-light-row-alt);
    --rz-grid-stripe-odd-background-color: var(--sm-light-row);
    --rz-grid-hover-background-color: #eef2f8;
    --rz-grid-hover-color: var(--sm-light-text);
    --rz-grid-group-header-padding: 0.65rem 1rem;
    --rz-grid-group-header-gap: 0.5rem;
    --rz-grid-group-header-item-background-color: #f3f5f9;
    --rz-grid-group-header-item-border: 1px solid #dfe4ee;
    --rz-grid-group-header-item-border-radius: 999px;
    --rz-grid-group-header-item-color: var(--sm-light-text);
    --rz-grid-foot-background-color: #ffffff;
    --rz-grid-filter-background-color: #ffffff;
    --rz-grid-filter-buttons-background-color: #ffffff;
    --rz-grid-filter-buttons-border: 1px solid var(--sm-light-border);
    --rz-grid-clear-filter-button-background-color: #f7f9fc;
    --rz-grid-clear-filter-button-color: var(--sm-light-primary-dark);
    --rz-grid-apply-filter-button-background-color: var(--sm-light-primary-dark);
    --rz-grid-apply-filter-button-color: #ffffff;
    --rz-grid-clear-filter-button-shadow: none;
    --rz-grid-apply-filter-button-shadow: none;

    --rz-pager-background-color: #ffffff;
    --rz-pager-border: 1px solid var(--sm-light-border);
    --rz-pager-summary-color: var(--sm-light-text-muted);
    --rz-pager-numeric-button-color: #384152;
    --rz-pager-numeric-button-background-color: transparent;
    --rz-pager-numeric-button-hover-background-color: #eef0ff;
    --rz-pager-numeric-button-hover-color: var(--sm-light-primary-dark);
    --rz-pager-numeric-button-selected-background-color: #eef0ff;
    --rz-pager-numeric-button-selected-border: 1px solid #dfe3ff;
    --rz-pager-numeric-button-selected-color: var(--sm-light-primary);
    --rz-pager-button-border-radius: 999px;

    --rz-tabs-background-color: transparent;
    --rz-tabs-border: none;
    --rz-tabs-border-radius: 0;
    --rz-tabs-tab-background-color: transparent;
    --rz-tabs-tab-color: #697386;
    --rz-tabs-tab-hover-background-color: transparent;
    --rz-tabs-tab-hover-color: var(--sm-light-primary-dark);
    --rz-tabs-tab-focus-background-color: transparent;
    --rz-tabs-tab-focus-color: var(--sm-light-primary-dark);
    --rz-tabs-tab-selected-background-color: transparent;
    --rz-tabs-tab-selected-color: var(--sm-light-primary);
    --rz-tabs-tab-selected-top-border-color: transparent;

    --rz-notification-container-background-color: transparent;
    --rz-notification-border-radius: 18px;
    --rz-notification-shadow: 0 16px 34px rgba(35, 45, 70, 0.16);
    --rz-notification-error-background-color: #fff0ee;
    --rz-notification-error-color: #c3342b;
    --rz-notification-warning-background-color: #fff8dd;
    --rz-notification-warning-color: #8a6500;
    --rz-notification-success-background-color: #eaf8ef;
    --rz-notification-success-color: #137a3c;
    --rz-notification-info-background-color: #eaf4ff;
    --rz-notification-info-color: #175b9b;
}

/* Dark Theme Variables */
.material-dark {
    --sm-dark-canvas: #0a0f17;
    --sm-dark-header: #07090f;
    --sm-dark-sidebar: #151922;
    --sm-dark-panel: #1f232d;
    --sm-dark-panel-strong: #232733;
    --sm-dark-panel-soft: #171c25;
    --sm-dark-row: #171c24;
    --sm-dark-row-alt: #20242d;
    --sm-dark-border: #2d3442;
    --sm-dark-border-soft: rgba(255, 255, 255, 0.07);
    --sm-dark-text: #e8ebf4;
    --sm-dark-text-muted: #aeb4c4;
    --sm-dark-purple: #a984ff;
    --sm-dark-purple-soft: #312a47;
    --sm-dark-link: #b89cff;
    --sm-dark-link-hover: #d7c7ff;
    --sm-dark-green: #57d37a;

    --rz-body-background-color: var(--sm-dark-canvas);
    --rz-header-background-color: var(--sm-dark-header);
    --rz-sidebar-background-color: var(--sm-dark-sidebar);
    --rz-card-background-color: var(--sm-dark-panel);
    --rz-dialog-background-color: var(--sm-dark-panel-soft);

    --rz-text-color: var(--sm-dark-text);
    --rz-text-secondary-color: var(--sm-dark-text-muted);
    --rz-text-disabled-color: #697183;

    --rz-primary: var(--sm-dark-purple);
    --rz-primary-light: #c7b9ff;
    --rz-primary-dark: #7f6fd8;
    --rz-accent: #d7dc9a;

    --rz-input-background-color: #282c3d;
    --rz-input-border: 1px solid #3a4054;
    --rz-input-color: var(--sm-dark-text);
    --rz-input-value-color: var(--sm-dark-text);
    --rz-input-placeholder-color: #d0d4df;
    --rz-input-border-radius: 18px;
    --rz-input-height: 44px;
    --rz-input-padding-block: 0.52rem;
    --rz-input-padding-inline: 1rem;
    --rz-input-focus-background-color: #2b3043;
    --rz-input-focus-border: 1px solid rgba(169, 132, 255, 0.7);
    --rz-input-focus-shadow: 0 0 0 3px rgba(169, 132, 255, 0.18);

    --rz-divider: var(--sm-dark-border-soft);

    --rz-shadow-0: none;
    --rz-shadow-1: 0 8px 18px rgba(0, 0, 0, 0.28);
    --rz-shadow-2: 0 12px 28px rgba(0, 0, 0, 0.38);
    --rz-shadow-3: 0 18px 36px rgba(0, 0, 0, 0.5);

    --rz-button-border-radius: 999px;
    --rz-button-shadow: none;
    --rz-button-hover-shadow: none;
    --rz-button-focus-shadow: 0 0 0 3px rgba(169, 132, 255, 0.2);

    --rz-checkbox-width: 1.25rem;
    --rz-checkbox-height: 1.25rem;
    --rz-checkbox-border-radius: 5px;
    --rz-checkbox-checked-background-color: var(--sm-dark-purple);
    --rz-checkbox-checked-border: 1px solid var(--sm-dark-purple);

    --rz-switch-background-color: #303644;
    --rz-switch-checked-background-color: #7450ba;
    --rz-switch-circle-background-color: #8d96a8;
    --rz-switch-checked-circle-background-color: #d9ccff;

    --rz-dropdown-open-background-color: #2b3043;
    --rz-dropdown-open-border: 1px solid rgba(169, 132, 255, 0.55);
    --rz-dropdown-item-hover-background-color: rgba(169, 132, 255, 0.16);
    --rz-dropdown-item-hover-color: var(--sm-dark-text);
    --rz-dropdown-item-selected-background-color: rgba(169, 132, 255, 0.24);
    --rz-dropdown-item-selected-color: #ffffff;
    --rz-dropdown-panel-border: 1px solid #3a4054;
    --rz-dropdown-panel-shadow: 0 18px 40px rgba(0, 0, 0, 0.5);

    --rz-grid-background-color: var(--sm-dark-panel);
    --rz-grid-border-radius: 6px;
    --rz-grid-shadow: none;
    --rz-grid-cell-border: 1px solid var(--sm-dark-border);
    --rz-grid-bottom-cell-border: 1px solid var(--sm-dark-border);
    --rz-grid-right-cell-border: 1px solid transparent;
    --rz-grid-cell-color: #d7dbe6;
    --rz-grid-cell-font-size: 0.95rem;
    --rz-grid-cell-padding: 0.68rem 0.78rem;
    --rz-grid-header-background-color: #20232c;
    --rz-grid-header-color: #f2f5ff;
    --rz-grid-header-font-size: 0.84rem;
    --rz-grid-header-font-weight: 800;
    --rz-grid-header-text-transform: none;
    --rz-grid-header-cell-padding: 0.72rem 0.58rem;
    --rz-grid-header-cell-border: 1px solid transparent;
    --rz-grid-header-cell-border-bottom: 1px solid var(--sm-dark-border);
    --rz-grid-stripe-background-color: var(--sm-dark-row-alt);
    --rz-grid-stripe-odd-background-color: var(--sm-dark-row);
    --rz-grid-hover-background-color: #242936;
    --rz-grid-hover-color: #ffffff;
    --rz-grid-group-header-padding: 0.65rem 1rem;
    --rz-grid-group-header-gap: 0.5rem;
    --rz-grid-group-header-item-background-color: #2c3041;
    --rz-grid-group-header-item-border: 1px solid #42495f;
    --rz-grid-group-header-item-border-radius: 999px;
    --rz-grid-group-header-item-color: var(--sm-dark-text);
    --rz-grid-foot-background-color: #20232c;
    --rz-grid-filter-background-color: var(--sm-dark-panel-strong);
    --rz-grid-filter-buttons-background-color: var(--sm-dark-panel-strong);
    --rz-grid-filter-buttons-border: 1px solid var(--sm-dark-border);
    --rz-grid-clear-filter-button-background-color: #2b3040;
    --rz-grid-clear-filter-button-color: var(--sm-dark-text);
    --rz-grid-apply-filter-button-background-color: var(--sm-dark-purple);
    --rz-grid-apply-filter-button-color: #171827;
    --rz-grid-clear-filter-button-shadow: none;
    --rz-grid-apply-filter-button-shadow: 0 8px 18px rgba(169, 132, 255, 0.24);

    --rz-pager-background-color: #20232c;
    --rz-pager-border: 1px solid var(--sm-dark-border);
    --rz-pager-summary-color: var(--sm-dark-text-muted);
    --rz-pager-numeric-button-color: #d8dced;
    --rz-pager-numeric-button-background-color: transparent;
    --rz-pager-numeric-button-hover-background-color: rgba(169, 132, 255, 0.14);
    --rz-pager-numeric-button-hover-color: #ffffff;
    --rz-pager-numeric-button-selected-background-color: #47395f;
    --rz-pager-numeric-button-selected-border: 1px solid #5b4777;
    --rz-pager-numeric-button-selected-color: #ffffff;
    --rz-pager-button-border-radius: 999px;

    --rz-tabs-background-color: transparent;
    --rz-tabs-border: none;
    --rz-tabs-border-radius: 0;
    --rz-tabs-tab-background-color: transparent;
    --rz-tabs-tab-color: #aeb4c4;
    --rz-tabs-tab-hover-background-color: transparent;
    --rz-tabs-tab-hover-color: #e8ddff;
    --rz-tabs-tab-focus-background-color: transparent;
    --rz-tabs-tab-focus-color: #e8ddff;
    --rz-tabs-tab-selected-background-color: transparent;
    --rz-tabs-tab-selected-color: var(--sm-dark-purple);
    --rz-tabs-tab-selected-top-border-color: transparent;

    --rz-notification-container-background-color: transparent;
    --rz-notification-border-radius: 22px;
    --rz-notification-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
    --rz-notification-error-background-color: #5b2926;
    --rz-notification-error-color: #ff554d;
    --rz-notification-warning-background-color: #4e3c22;
    --rz-notification-warning-color: #ffcf70;
    --rz-notification-success-background-color: #1f4630;
    --rz-notification-success-color: #73e59a;
    --rz-notification-info-background-color: #22364c;
    --rz-notification-info-color: #95d5ff;
}

/* Polishing components */
.material .rz-button.rz-primary {
    background: var(--rz-primary);
    border: none;
    box-shadow: none;
}

.material .rz-button.rz-primary:hover {
    background: #2a3164;
}

.material .rz-card,
.material .rz-dialog {
    background: var(--sm-light-panel) !important;
    border: 1px solid var(--sm-light-border) !important;
    border-radius: 12px !important;
    color: var(--sm-light-text) !important;
}

.rz-card, .rz-dialog {
    border: 1px solid var(--rz-divider);
    box-shadow: var(--rz-shadow-3);
    border-radius: var(--rz-border-radius);
}

.rz-textbox, .rz-dropdown, .rz-textarea, .rz-input-number {
    border-radius: var(--rz-border-radius) !important;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.rz-textbox:focus, .rz-dropdown:focus, .rz-textarea:focus, .rz-input-number:focus {
    border-color: var(--rz-primary) !important;
    box-shadow: 0 0 0 2px rgba(32, 38, 80, 0.18);
}

.rz-link {
    color: var(--rz-primary-light);
    text-decoration: none;
    transition: color 0.2s;
}

.rz-link:hover {
    color: var(--rz-primary);
    text-decoration: underline;
}

.rz-grid-table thead th,
.rz-datatable-thead th {
    white-space: normal !important;
}

.rz-grid-table thead th > div:not(.rz-cell-filter),
.rz-datatable-thead th > div:not(.rz-cell-filter) {
    gap: 0.18rem;
    min-width: 0;
}

.rz-grid-table thead th .rz-column-title,
.rz-datatable-thead th .rz-column-title {
    flex: 1 1 auto;
    min-width: 3.2rem;
    width: auto !important;
    color: var(--rz-grid-header-color) !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: normal !important;
}

.rz-grid-table thead th .rz-column-title-content,
.rz-datatable-thead th .rz-column-title-content {
    display: block !important;
    max-width: 100%;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
    line-height: 1.25;
}

.rz-grid-table thead th[title],
.rz-datatable-thead th[title],
.rz-grid-table thead th .rz-column-title-content[title],
.rz-datatable-thead th .rz-column-title-content[title] {
    cursor: help;
}

.rz-grid-table thead th .rz-grid-filter-icon,
.rz-datatable-thead th .rz-grid-filter-icon,
.rz-grid-table thead th .rz-column-drag,
.rz-datatable-thead th .rz-column-drag,
.rz-grid-table thead th .rzi-sort-asc,
.rz-grid-table thead th .rzi-sort-desc,
.rz-datatable-thead th .rzi-sort-asc,
.rz-datatable-thead th .rzi-sort-desc {
    flex: 0 0 auto;
    width: 1rem;
    min-width: 1rem;
    color: color-mix(in srgb, var(--rz-grid-header-color) 78%, transparent) !important;
}

.rz-grid-table thead th.smt-active-column,
.rz-datatable-thead th.smt-active-column,
.rz-grid-table tbody td.smt-active-column,
.rz-datatable-data td.smt-active-column {
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
    box-sizing: border-box;
    text-align: center !important;
}

.smt-active-toggle-grid:not(.smt-grouped-active-toggle-grid) .rz-grid-table colgroup col:first-child {
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
}

.smt-wide-grid .rz-grid-table thead th.smt-active-column,
.smt-wide-grid .rz-datatable-thead th.smt-active-column,
.smt-wide-grid .rz-grid-table tbody td.smt-active-column,
.smt-wide-grid .rz-datatable-data td.smt-active-column,
.smt-wide-grid.smt-active-toggle-grid:not(.smt-grouped-active-toggle-grid) .rz-grid-table colgroup col:first-child {
    width: 136px !important;
    min-width: 136px !important;
    max-width: 136px !important;
}

.smt-grouped-active-toggle-grid .rz-grid-table {
    table-layout: fixed;
}

/* Source grids keep compact data columns and give spare space to Actions. */
.smt-wide-grid.smt-source-grid .rz-grid-table,
.smt-wide-grid.smt-source-grid table {
    width: 100% !important;
    min-width: var(--smt-source-grid-min-width) !important;
}

.smt-grouped-active-toggle-grid .rz-grid-table colgroup col:first-child {
    width: 136px !important;
    min-width: 136px !important;
    max-width: 136px !important;
}

.smt-wide-grid.smt-devices-grid.smt-active-toggle-grid:not(.smt-grouped-active-toggle-grid) .rz-grid-table thead th.smt-active-column,
.smt-wide-grid.smt-devices-grid.smt-active-toggle-grid:not(.smt-grouped-active-toggle-grid) .rz-grid-table tbody td.smt-active-column,
.smt-wide-grid.smt-devices-grid.smt-active-toggle-grid:not(.smt-grouped-active-toggle-grid) .rz-grid-table colgroup col:first-child {
    width: 118px !important;
    min-width: 118px !important;
    max-width: 118px !important;
}

.smt-wide-grid .rz-grid-table thead th.smt-fill-column,
.smt-wide-grid .rz-grid-table tbody td.smt-fill-column,
.smt-wide-grid .rz-datatable-thead th.smt-fill-column,
.smt-wide-grid .rz-datatable-data td.smt-fill-column {
    min-width: 0;
}

.smt-wide-grid {
    --smt-grid-fill-width: clamp(360px, 36vw, 760px);
}

.smt-devices-grid {
    --smt-grid-fill-width: clamp(280px, 32vw, 680px);
}

.smt-wide-grid .rz-grid-table tbody td.smt-fill-column .rz-cell-data,
.smt-wide-grid .rz-datatable-data td.smt-fill-column .rz-cell-data {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rz-grid-table thead th.smt-active-column > div:not(.rz-cell-filter),
.rz-datatable-thead th.smt-active-column > div:not(.rz-cell-filter) {
    justify-content: center;
    padding-inline: 0.55rem !important;
}

.rz-grid-table thead th.smt-active-column .rz-column-title,
.rz-datatable-thead th.smt-active-column .rz-column-title {
    flex: 0 1 auto;
    justify-content: center;
}

.rz-grid-table tbody td.smt-active-column .rz-switch,
.rz-datatable-data td.smt-active-column .rz-switch,
.rz-grid-table tbody td.smt-active-column .rz-chkbox,
.rz-datatable-data td.smt-active-column .rz-chkbox {
    margin-inline: auto;
}

.material-dark a,
.material-dark .rz-link {
    color: var(--sm-dark-link);
    text-decoration-color: rgba(184, 156, 255, 0.68);
    text-underline-offset: 3px;
}

.material-dark a:hover,
.material-dark a:focus-visible,
.material-dark .rz-link:hover,
.material-dark .rz-link:focus-visible {
    color: var(--sm-dark-link-hover);
    text-decoration-color: currentColor;
}

.material .hero-lilac {
    background: linear-gradient(90deg, #9f9fee, #e1ccdf);
    border-radius: 24px;
}

.material .hero-yellow {
    background: #edf38f;
    border-radius: 24px;
}

.material-dark .rz-card,
.material-dark .rz-dialog {
    background: #171c25 !important;
    border: 1px solid #3a4054 !important;
    border-radius: 12px !important;
    color: var(--sm-dark-text) !important;
}

.material .rz-dialog,
.material-dark .rz-dialog {
    overflow: hidden;
    border-radius: 16px !important;
}

.material .rz-dialog {
    border: 1px solid var(--sm-light-border);
}

/* The title bar shares the dialog surface in both themes and is separated only by a line. */
.material .rz-dialog .rz-dialog-titlebar {
    background: var(--sm-light-panel-strong) !important;
    border-bottom: 1px solid var(--sm-light-border) !important;
    color: var(--sm-light-text) !important;
}

.material-dark .rz-dialog .rz-dialog-titlebar {
    background: var(--sm-dark-panel-soft) !important;
    border-bottom: 1px solid var(--sm-dark-border) !important;
    color: var(--sm-dark-text) !important;
}

.material .rz-dialog .rz-dialog-title,
.material-dark .rz-dialog .rz-dialog-title {
    color: inherit !important;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: normal;
}

.material .rz-dialog .rz-dialog-content {
    background: var(--sm-light-panel) !important;
    color: var(--sm-light-text) !important;
}

.material-dark .rz-dialog .rz-dialog-content {
    background: #171c25 !important;
    color: var(--sm-dark-text) !important;
}

/* The prompt gallery sizes to its content; the library owns its inner spacing. */
.rz-dialog .rz-dialog-content.mcp-prompt-gallery-content {
    padding: 0;
    min-height: 0;
}

.material .mcp-prompt-gallery-dialog {
    --ai-gallery-card: var(--sm-light-panel-soft);
    --ai-gallery-border: var(--sm-light-border);
    --ai-gallery-accent-soft: var(--sm-light-primary-soft);
    --ai-gallery-on-primary: #fff;
}

.material-dark .mcp-prompt-gallery-dialog {
    --ai-gallery-card: var(--sm-dark-panel);
    --ai-gallery-border: var(--sm-dark-border);
    --ai-gallery-accent-soft: var(--sm-dark-purple-soft);
    --ai-gallery-on-primary: #151628;
}

@media (max-width: 768px) {
    .rz-dialog.mcp-prompt-gallery-dialog:not(.rz-dialog-confirm):not(.rz-dialog-alert) {
        inset-block-start: 16px !important;
    }
}

.material .rz-dialog .rz-dialog-titlebar-icon {
    color: var(--sm-light-text-muted) !important;
}

.material-dark .rz-dialog .rz-dialog-titlebar-icon {
    color: var(--sm-dark-text-muted) !important;
}

.material .rz-dialog .rz-dialog-titlebar-icon:hover,
.material .rz-dialog .rz-dialog-titlebar-icon:focus-visible {
    background: var(--sm-light-panel-soft) !important;
    color: var(--sm-light-text) !important;
}

.material-dark .rz-dialog .rz-dialog-titlebar-icon:hover,
.material-dark .rz-dialog .rz-dialog-titlebar-icon:focus-visible {
    background: var(--sm-dark-panel-strong) !important;
    color: var(--sm-dark-text) !important;
}

/* Buttons use sentence case across the app. Radzen Material uppercases every button size. */
.rz-button,
.rz-button.rz-button-xs,
.rz-button.rz-button-sm,
.rz-button.rz-button-md,
.rz-button.rz-button-lg {
    font-weight: 600;
    letter-spacing: normal;
    text-transform: none;
}

.material-dark .rz-button.rz-primary {
    background: #b197ff;
    color: #151628;
    border: none;
    box-shadow: none;
}

.material-dark .rz-button.rz-primary:hover {
    background: #c6b8ff;
}

.material-dark .rz-textbox,
.material-dark .rz-dropdown,
.material-dark .rz-textarea,
.material-dark .rz-inputtext,
.material-dark .rz-input-number {
    background: var(--rz-input-background-color) !important;
    border-color: #3a4054 !important;
    color: var(--sm-dark-text) !important;
    border-radius: var(--rz-input-border-radius) !important;
}

.material-dark .rz-textbox:focus,
.material-dark .rz-dropdown:focus,
.material-dark .rz-textarea:focus,
.material-dark .rz-input-number:focus {
    border-color: var(--sm-dark-purple) !important;
    box-shadow: var(--rz-input-focus-shadow) !important;
}

.material-dark .accent-lime {
    background: #c8cf86;
    color: #151628;
}

.material-dark .accent-lavender {
    background: #a196ee;
    color: #151628;
}

.material-dark .surface-soft {
    background: #2a2b3a;
    border: 1px solid #373a4c;
}

/* Loading screen polish */
.loading-progress {
    position: relative;
    display: block;
    width: 8rem;
    height: 8rem;
    margin: 20vh auto 1rem auto;
}

.loading-progress circle {
    fill: none;
    stroke: var(--rz-divider);
    stroke-width: 0.6rem;
    stroke-dasharray: calc(3.14159 * 2 * 3.5rem);
    stroke-dashoffset: 0;
}

.loading-progress circle:last-child {
    stroke: var(--rz-primary);
    stroke-dashoffset: calc(3.14159 * 2 * 3.5rem * (1 - var(--blazor-load-percentage, 0%) / 100));
    transition: stroke-dashoffset 0.05s ease-in-out;
}

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0;
}

.loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "Loading...");
}

/* Force Radzen notifications to bottom-right globally. */
.rz-notification {
    top: auto !important;
    bottom: max(1rem, env(safe-area-inset-bottom)) !important;
    left: auto !important;
    right: 1rem !important;
    z-index: 2000 !important;
}

.material-dark .rz-growl-message {
    background-color: var(--rz-header-background-color) !important;
    color: var(--rz-text-color) !important;
    border: 1px solid var(--rz-divider) !important;
    border-radius: var(--rz-border-radius) !important;
    box-shadow: var(--rz-shadow-3) !important;
}

.material-dark .rz-notification-item-wrapper {
    background: transparent !important;
    border-radius: var(--rz-notification-border-radius) !important;
    box-shadow: none !important;
    overflow: hidden;
}

.material-dark .rz-notification-item {
    border-radius: var(--rz-notification-border-radius) !important;
    box-shadow: var(--rz-notification-shadow) !important;
    overflow: hidden;
}

.material-dark .rz-notification-error .rz-notification-item {
    background: var(--rz-notification-error-background-color) !important;
    border: 1px solid rgba(255, 85, 77, 0.18) !important;
    color: var(--rz-notification-error-color) !important;
}

.material-dark .rz-notification-warning .rz-notification-item {
    background: var(--rz-notification-warning-background-color) !important;
    border: 1px solid rgba(255, 207, 112, 0.18) !important;
    color: var(--rz-notification-warning-color) !important;
}

.material-dark .rz-notification-success .rz-notification-item {
    background: var(--rz-notification-success-background-color) !important;
    border: 1px solid rgba(115, 229, 154, 0.18) !important;
    color: var(--rz-notification-success-color) !important;
}

.material-dark .rz-notification-info .rz-notification-item {
    background: var(--rz-notification-info-background-color) !important;
    border: 1px solid rgba(149, 213, 255, 0.18) !important;
    color: var(--rz-notification-info-color) !important;
}

.material-dark .rz-notification-content,
.material-dark .rz-notification-message,
.material-dark .rz-notification-summary {
    background: transparent !important;
    color: inherit !important;
}

.material-dark .rz-notification-close,
.material-dark .rz-notification-icon {
    color: inherit !important;
}

.main-tabs .rz-tabview-panels,
.main-tabs .rz-tabview-panel {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.main-tabs .rz-tabview-nav {
    margin-bottom: 0 !important;
}

.main-tabs .rz-tabview-panels {
    margin-top: 0 !important;
}

.content-tabs .rz-tabview-panel {
    padding: 10px !important;
}

.material-dark .rz-tabview {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.material-dark .rz-tabview .rz-tabview-nav {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--sm-dark-border) !important;
    box-shadow: none !important;
    gap: 2px;
    padding: 0 !important;
}

.material-dark .rz-tabview .rz-tabview-nav li {
    position: relative;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: #aeb4c4 !important;
    transition: background-color 140ms ease, color 140ms ease;
}

.material-dark .rz-tabview .rz-tabview-nav li::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: -1px;
    height: 3px;
    border-radius: 999px 999px 0 0;
    background: transparent;
    pointer-events: none;
}

.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):hover,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):active,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):focus-within,
.material-dark .rz-tabview .rz-tabview-nav li.rz-state-focused:not(.rz-tabview-selected) {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: #e8ddff !important;
}

.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):hover::after {
    background: rgba(169, 132, 255, 0.36);
}

.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):hover > a,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):hover > button,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):hover > .rz-tabview-link,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):active > a,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):active > button,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):active > .rz-tabview-link,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):focus-within > a,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):focus-within > button,
.material-dark .rz-tabview .rz-tabview-nav li:not(.rz-tabview-selected):focus-within > .rz-tabview-link,
.material-dark .rz-tabview .rz-tabview-nav li.rz-state-focused:not(.rz-tabview-selected) > a,
.material-dark .rz-tabview .rz-tabview-nav li.rz-state-focused:not(.rz-tabview-selected) > button,
.material-dark .rz-tabview .rz-tabview-nav li.rz-state-focused:not(.rz-tabview-selected) > .rz-tabview-link {
    background: transparent !important;
    color: #e8ddff !important;
    border: 0 !important;
    box-shadow: none !important;
}

.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected {
    background: transparent !important;
    border-color: transparent !important;
}

.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected:hover,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected:active,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected:focus-within {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected::after {
    background: var(--sm-dark-purple);
}

.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > a,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > button,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > .rz-tabview-link,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > a .rz-tabview-title,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > button .rz-tabview-title,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > .rz-tabview-link .rz-tabview-title,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > a span,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > button span,
.material-dark .rz-tabview .rz-tabview-nav li.rz-tabview-selected > .rz-tabview-link span {
    color: var(--rz-primary) !important;
}

.material-dark .rz-tabview .rz-tabview-nav li > a,
.material-dark .rz-tabview .rz-tabview-nav li > button,
.material-dark .rz-tabview .rz-tabview-nav li > .rz-tabview-link {
    min-height: 46px;
    padding: 0 18px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: #aeb4c4 !important;
    font-weight: 700;
    letter-spacing: 0;
}

.material .main-tabs.rz-tabview .rz-tabview-nav li > a,
.material .main-tabs.rz-tabview .rz-tabview-nav li > button,
.material .main-tabs.rz-tabview .rz-tabview-nav li > .rz-tabview-link,
.material .main-tabs .rz-tabview-nav li > a,
.material .main-tabs .rz-tabview-nav li > button,
.material .main-tabs .rz-tabview-nav li > .rz-tabview-link,
.material-dark .main-tabs.rz-tabview .rz-tabview-nav li > a,
.material-dark .main-tabs.rz-tabview .rz-tabview-nav li > button,
.material-dark .main-tabs.rz-tabview .rz-tabview-nav li > .rz-tabview-link,
.material-dark .main-tabs .rz-tabview-nav li > a,
.material-dark .main-tabs .rz-tabview-nav li > button,
.material-dark .main-tabs .rz-tabview-nav li > .rz-tabview-link {
    min-height: 40px !important;
    padding: 0 16px !important;
}

.error-image-small {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid #ddd;
}

.hidden-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
}

.material-dark input[type="time"] {
    color-scheme: dark;
    background-color: #2b2b2b;
    color: #ffffff;
    border: 1px solid #555;
    border-radius: 4px;
    padding: 6px 8px;
}
#blazor-error-ui {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff3cd;
    color: #856404;
    padding: 0.6rem 1rem;
    z-index: 1000;
    box-shadow: 0 -2px 6px rgba(0,0,0,.2);
}

.rz-inputtext::placeholder {
    white-space: normal;
    overflow-wrap: break-word;
}
/* Blazor automatically adds this when an error happens */
#blazor-error-ui.show {
    display: block;
}

.validation-error {
    color: #d32f2f;          /* strong red */
    font-weight: bold;
    margin: 8px 0;
    padding-left: 20px;      /* space for bullets */
    list-style-type: disc;
}

.validation-error li {
    margin-bottom: 4px;
}

.rz-spin {
    animation: rz-spin 1s linear infinite;
}

@keyframes rz-spin {
    100% {
        transform: rotate(360deg);
    }
}
.rz-column-title {
    white-space: nowrap;
}

.rz-data-grid table {
    table-layout: fixed;
  
}

.smt-wide-grid.smt-devices-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.smt-devices-grid.smt-active-toggle-grid table,
.smt-wide-grid.smt-accounts-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.smt-accounts-grid.smt-active-toggle-grid table,
.smt-wide-grid.extractions-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.extractions-grid.smt-active-toggle-grid table,
.smt-wide-grid.automation-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.automation-grid.smt-active-toggle-grid table,
.smt-wide-grid.workflows-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.workflows-grid.smt-active-toggle-grid table {
    table-layout: fixed;
}

.smt-wide-grid.smt-devices-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.smt-devices-grid.smt-active-toggle-grid table {
    min-width: 1680px !important;
}

.smt-wide-grid.smt-accounts-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.smt-accounts-grid.smt-active-toggle-grid table {
    min-width: 1780px !important;
}

.smt-wide-grid.extractions-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.extractions-grid.smt-active-toggle-grid table {
    min-width: 1060px !important;
}

.smt-wide-grid.automation-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.automation-grid.smt-active-toggle-grid table {
    min-width: 1690px !important;
}

.smt-wide-grid.workflows-grid.smt-active-toggle-grid .rz-grid-table,
.smt-wide-grid.workflows-grid.smt-active-toggle-grid table {
    min-width: 1410px !important;
}

.smt-devices-grid .rz-cell-data,
.smt-devices-grid .rz-cell-data > div,
.smt-accounts-grid .rz-cell-data,
.smt-accounts-grid .rz-cell-data > div,
.extractions-grid .rz-cell-data,
.extractions-grid .rz-cell-data > div,
.automation-grid .rz-cell-data,
.automation-grid .rz-cell-data > div,
.workflows-grid .rz-cell-data,
.workflows-grid .rz-cell-data > div {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.smt-devices-grid .grid-actions-row,
.smt-accounts-grid .grid-actions-row,
.extractions-grid .grid-actions-row,
.automation-grid .grid-actions-row,
.workflows-grid .grid-actions-row {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.smt-devices-grid .grid-actions-row {
    justify-content: flex-start !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.smt-wide-grid .rz-cell-data {
    min-width: 0;
}

.smt-wide-grid .rz-grid-table th,
.smt-wide-grid .rz-grid-table td {
    box-sizing: border-box;
}