:root {
    --sei-ui-control-height: 31px;
    --sei-ui-control-radius: 0.375rem;
    --sei-ui-control-border: #b8c7d3;
    --sei-ui-control-focus: rgba(79, 163, 227, 0.25);
    --sei-ui-loader-a: #1e73b8;
    --sei-ui-loader-b: #5dbb2f;
}

/* 2) Uniform compact controls */
.app-main .form-control,
.app-main .form-select {
    min-height: var(--sei-ui-control-height);
    height: var(--sei-ui-control-height);
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
    border-color: var(--sei-ui-control-border);
    border-radius: var(--sei-ui-control-radius);
    font-size: 0.875rem;
}

.app-main textarea.form-control {
    min-height: 88px;
    height: auto;
}

.app-main .form-control:focus,
.app-main .form-select:focus {
    border-color: #8dbfe7;
    box-shadow: 0 0 0 0.2rem var(--sei-ui-control-focus);
}

/* 1) Chosen select style harmonized with compact controls */
.chosen-container {
    width: 100% !important;
    font-size: 0.875rem;
}

.chosen-container .chosen-single,
.chosen-container .chosen-choices {
    min-height: var(--sei-ui-control-height);
    border: 1px solid var(--sei-ui-control-border);
    border-radius: var(--sei-ui-control-radius);
    background: #fff;
    box-shadow: none;
}

.chosen-container-single .chosen-single {
    height: var(--sei-ui-control-height);
    line-height: 29px;
    padding-left: 0.65rem;
}

.chosen-container-single .chosen-single div b {
    background-position: 0 6px;
}

.chosen-container-active .chosen-single,
.chosen-container-active .chosen-choices {
    border-color: #8dbfe7;
    box-shadow: 0 0 0 0.2rem var(--sei-ui-control-focus);
}

/* 3) Force compact buttons */
.app-main .btn {
    --bs-btn-padding-y: 0.16rem;
    --bs-btn-padding-x: 0.62rem;
    --bs-btn-font-size: 0.82rem;
    --bs-btn-border-radius: 0.35rem;
}

/* 4) AG Grid skin alignment */
.sei-ag-wrap {
    width: 100%;
    margin-top: 0.5rem;
}

/* First-paint hiding disabled to avoid any risk of blank content when JS enhancement is interrupted */

.sei-ag-theme {
    height: 420px;
    width: 100%;
    border: 1px solid rgba(30, 115, 184, 0.2);
    border-radius: 0.5rem;
    overflow: hidden;
}

/* Table rules: unified across native and AG Grid tables */
.app-main table.table {
    border-collapse: collapse;
    --bs-table-color: #1f2d3d;
    --bs-table-striped-color: #1f2d3d;
    --bs-table-active-color: #1f2d3d;
    --bs-table-hover-color: #1f2d3d;
    --bs-table-bg: #ffffff;
    --bs-table-striped-bg: #f6f9fc;
    --bs-table-hover-bg: #eef5fb;
    --bs-table-active-bg: #e7f1fb;
    --bs-table-border-color: rgba(10, 79, 138, 0.1);
}

.app-main table.table > :not(caption) > * > * {
    border: 0.5px solid rgba(10, 79, 138, 0.1);
    vertical-align: middle;
    height: 27px;
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
    color: #1f2d3d;
    background-color: #ffffff;
}

.app-main table.table > tbody > tr > td,
.app-main table.table > tbody > tr > th {
    color: #1f2d3d !important;
    opacity: 1;
    text-shadow: none;
}

.app-main .table tbody,
.app-main .table tbody tr,
.app-main .table tbody td,
.app-main .table tbody th,
.app-main .table-responsive .table tbody td,
.app-main .table-responsive .table tbody th {
    color: #1f2d3d !important;
    -webkit-text-fill-color: #1f2d3d !important;
}

.app-main table.table > thead > tr > th {
    background: var(--sei-blue-dark);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.2);
}

.ag-theme-quartz.sei-ag-theme {
    --ag-font-family: "Source Sans 3", sans-serif;
    --ag-font-size: 13px;
    --ag-header-height: 31px;
    --ag-row-height: 27px;
    --ag-foreground-color: var(--sei-charcoal);
    --ag-data-color: var(--sei-charcoal);
    --ag-background-color: #ffffff;
    --ag-border-color: rgba(10, 79, 138, 0.1);
    --ag-header-background-color: var(--sei-blue-dark);
    --ag-header-foreground-color: #ffffff;
    --ag-odd-row-background-color: #fcfdff;
    --ag-selected-row-background-color: rgba(79, 163, 227, 0.15);
}

.ag-theme-quartz.sei-ag-theme .ag-header,
.ag-theme-quartz.sei-ag-theme .ag-header-row,
.ag-theme-quartz.sei-ag-theme .ag-header-cell,
.ag-theme-quartz.sei-ag-theme .ag-cell {
    border-color: rgba(10, 79, 138, 0.16);
}

.ag-theme-quartz.sei-ag-theme .ag-header-cell,
.ag-theme-quartz.sei-ag-theme .ag-cell {
    border-right: 0.5px solid rgba(10, 79, 138, 0.1) !important;
    border-bottom: 0.5px solid rgba(10, 79, 138, 0.1) !important;
}

.ag-theme-quartz.sei-ag-theme .ag-cell,
.ag-theme-quartz.sei-ag-theme .ag-row,
.ag-theme-quartz.sei-ag-theme .ag-row .ag-cell-value {
    color: #1f2d3d !important;
    opacity: 1;
}

.ag-theme-quartz.sei-ag-theme .ag-cell-value,
.ag-theme-quartz.sei-ag-theme .ag-cell-wrapper,
.ag-theme-quartz.sei-ag-theme .ag-group-value,
.ag-theme-quartz.sei-ag-theme .ag-group-expanded,
.ag-theme-quartz.sei-ag-theme .ag-group-contracted {
    color: #1f2d3d !important;
    -webkit-text-fill-color: #1f2d3d !important;
}

.ag-theme-quartz.sei-ag-theme .ag-root-wrapper,
.ag-theme-quartz.sei-ag-theme .ag-body,
.ag-theme-quartz.sei-ag-theme .ag-row,
.ag-theme-quartz.sei-ag-theme .ag-cell,
.ag-theme-quartz.sei-ag-theme .ag-cell * {
    color: #1f2d3d !important;
    -webkit-text-fill-color: #1f2d3d !important;
}

.ag-theme-quartz.sei-ag-theme .ag-header,
.ag-theme-quartz.sei-ag-theme .ag-header *,
.ag-theme-quartz.sei-ag-theme .ag-header-cell,
.ag-theme-quartz.sei-ag-theme .ag-header-cell * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.ag-theme-quartz.sei-ag-theme .ag-row {
    border-bottom: 0 !important;
}

/* 6) Uniform notification modal */
#seiNoticeModal .modal-content {
    border: 0;
    border-radius: 0.7rem;
    box-shadow: 0 18px 36px rgba(10, 79, 138, 0.2);
}

#seiNoticeModal .sei-notice-badge {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.05rem;
}

#seiNoticeModal .sei-notice-success {
    background: linear-gradient(145deg, #5dbb2f, #3e8e1c);
}

#seiNoticeModal .sei-notice-error {
    background: linear-gradient(145deg, #cc3a3a, #a32121);
}

#seiConfirmModal .modal-content {
    border: 0;
    border-radius: 0.7rem;
    box-shadow: 0 18px 36px rgba(10, 79, 138, 0.2);
}

#seiConfirmModal .sei-confirm-badge {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 1.05rem;
    background: linear-gradient(145deg, #cc3a3a, #a32121);
}

#seiConfirmModal .sei-confirm-badge.is-primary {
    background: linear-gradient(145deg, #1e73b8, #14588f);
}

#seiPromptModal .modal-content {
    border: 0;
    border-radius: 0.7rem;
    box-shadow: 0 18px 36px rgba(10, 79, 138, 0.2);
}

#seiPromptModal .sei-prompt-badge {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 1.05rem;
    background: linear-gradient(145deg, #1e73b8, #14588f);
}

/* Small top-right toasts for fast grid update feedback */
.sei-toast-host {
    position: fixed;
    top: 0.9rem;
    right: 0.9rem;
    z-index: 3500;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    pointer-events: none;
}

.sei-toast {
    min-width: 180px;
    max-width: 320px;
    color: #ffffff;
    padding: 0.44rem 0.65rem;
    border-radius: 0.45rem;
    box-shadow: 0 9px 20px rgba(0, 0, 0, 0.18);
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.25;
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.sei-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.sei-toast-success {
    background: linear-gradient(140deg, #2f9e44, #237936);
}

.sei-toast-error {
    background: linear-gradient(140deg, #c73a3a, #9d2a2a);
}

/* 7) Custom centered Seitrack loader */
#seiLoaderOverlay {
    position: fixed;
    inset: 0;
    background: rgba(10, 28, 45, 0.42);
    z-index: 3000;
    display: none;
    align-items: center;
    justify-content: center;
}

#seiLoaderOverlay.is-visible {
    display: flex;
}

.sei-loader-shell {
    width: 118px;
    height: 118px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.95), rgba(220, 238, 252, 0.92));
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}

.sei-loader-ring {
    width: 74px;
    height: 74px;
    border-radius: 50%;
    border: 5px solid rgba(30, 115, 184, 0.2);
    border-top-color: var(--sei-ui-loader-a);
    border-right-color: var(--sei-ui-loader-b);
    animation: seiSpin 0.85s linear infinite;
}

.sei-loader-logo-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--sei-ui-loader-a), var(--sei-ui-loader-b));
    position: absolute;
}

@keyframes seiSpin {
    to {
        transform: rotate(360deg);
    }
}

/* 5) Form modal trigger helper spacing */
.sei-modal-trigger-row {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.6rem;
}

/* Global modal behavior: expand with content up to viewport, then scroll body; keep select dropdowns visible */
.app-main .modal .modal-dialog {
    margin: 0.5rem auto;
    max-height: calc(100vh - 1rem);
}

.app-main .modal {
    --bs-modal-margin: 0.5rem;
}

.app-main .modal .modal-content {
    display: flex;
    flex-direction: column;
    min-height: 50vh;
    max-height: calc(100vh - 1rem);
    overflow: visible;
}

.app-main .modal .modal-body {
    overflow-y: auto;
    overflow-x: visible;
}

.app-main .modal.modal-dialog-scrollable .modal-content,
.app-main .modal .modal-dialog-scrollable .modal-content {
    overflow: visible;
}

.app-main .modal .modal-dialog.modal-dialog-scrollable {
    height: calc(100vh - 1rem) !important;
    max-height: calc(100vh - 1rem) !important;
}

.app-main .modal .modal-dialog.modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 1rem) !important;
}

.app-main .modal .modal-dialog.modal-dialog-scrollable .modal-body {
    max-height: calc(100vh - 8.5rem) !important;
    overflow-y: auto !important;
}

.app-main .modal .chosen-container {
    width: 100% !important;
}

.app-main .modal .chosen-container-active {
    z-index: 1086;
}

.app-main .modal .chosen-container .chosen-drop {
    z-index: 1087;
}

.app-main .modal .chosen-container.chosen-with-drop .chosen-drop {
    top: 100%;
    bottom: auto;
    margin-top: 0.3rem;
    margin-bottom: 0;
}

.app-main .modal.sei-modal-allow-overflow .modal-content,
.app-main .modal.sei-modal-allow-overflow .modal-body {
    overflow: visible !important;
}