:root {
    --dialog-z-index: 1000;
    --color-primary: rgba(97, 121, 250, 1);
    --color-primary-light: #A8B6FF;
    --color-white: #ffffff;
    --color-gray: rgba(139, 148, 164, 1);
    --dxbl-checkbox-switch-unchecked-hover-bg: color-mix(in srgb, var(--color-gray) 85%, black 15%);
    --dxbl-text-edit-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    --dxbl-btn-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);

    /* Theme palette (light) */
    --color-bg: #F6F6F6;
    --color-modal-bg: #ffffff;
    --color-surface-alpha: #FFFFFFA6;
    --color-surface: #FFFFFF;
    --color-text: #303030;
    --color-surface-hover: #EBF1FF;
    --color-surface-alt: #FCFCFC;
    --color-success: #1DC5A9;
    --color-success-bg: #CCF1EB;
    --color-danger: #FF616D;
    --color-danger-bg: #FFE6E6;
    --color-warning: #FFA300;
    --color-warning-bg: #FFF6E6;
    --color-accent-bg: #CCD8F1;
    --color-combobox-active-bg: #CCD8F1;
    --color-contrast-bg: rgba(48, 48, 48, 0.05);
    --color-shadow: rgba(180, 206, 236, 0.3);
    --color-border-gradient: linear-gradient(268.99deg, #FFFFFF 2.95%, rgba(255, 255, 255, 0.45) 100.33%);
    --color-skeleton-shimmer: rgba(255, 255, 255, 0.55);

    /* Spacing (gap/padding/margin) */
    --space-0_125: 0.125rem;
    --space-0_25: 0.25rem;
    --space-0_375: 0.375rem;
    --space-0_625: 0.625rem;
    --space-0_875: 0.875rem;
    --space-1_0: 1rem;
    --space-1_25: 1.25rem;

    /* Border-radius */
    --radius-0_625: 0.625rem;
    --radius-0_875: 0.875rem;
    --radius-1_25: 1.25rem;
    --radius-full: 9999px;

    /* Font-size */
    --fs-0_625: 0.625rem;
    --fs-0_75: 0.75rem;
    --fs-0_875: 0.875rem;
    --fs-1_0: 1rem;
    --fs-1_25: 1.25rem;

    --vh-full: 100vh;
}

@supports (height: 100dvh) {
    :root {
        --vh-full: 100dvh;
    }
}

:root[data-theme="dark"] {
    --color-bg: #323339;
    --color-modal-bg: #323339;
    --color-surface-alpha: #393A41;
    --color-surface: #393A41;
    --color-white: #43444E;
    --color-text: #EBF1FF;
    --color-surface-hover: #474B53;
    --color-surface-alt: #EBF1FF;
    --color-success-bg: #31403D;
    --color-danger-bg: #423434;
    --color-warning-bg: #3B3730;
    --color-accent-bg: #343B4A;
    --color-combobox-active-bg: rgba(97, 121, 250, 0.35);
    --color-contrast-bg: rgba(255, 255, 255, 0.06);
    --color-shadow: #2C2D32;
    --color-border: #43444E;
    --color-border-gradient: linear-gradient(268.99deg, #43444E 2.95%, #43444E 100.33%);
    --color-skeleton-shimmer: rgba(255, 255, 255, 0.08);
    --bs-white-rgb: 67, 68, 78;
    --bs-body-bg-rgb: 50, 51, 57;
}

[data-theme="dark"] .dxbl-btn {
    --dxbl-btn-color: var(--color-text);
}

[data-theme="dark"] .dxbl-btn-secondary.dxbl-btn-standalone,
[data-theme="dark"] .dxbl-btn-secondary:where(:not(.dxbl-btn-standalone)) {
    --dxbl-btn-bg: var(--color-surface) !important;
    --dxbl-btn-color: var(--color-text) !important;
    --dxbl-btn-border-color: var(--color-border) !important;
    --dxbl-btn-hover-bg: var(--color-surface-hover) !important;
    --dxbl-btn-hover-color: var(--color-text) !important;
    --dxbl-btn-active-bg: var(--color-surface-hover) !important;
    --dxbl-btn-active-color: var(--color-text) !important;
    --dxbl-btn-active-border-color: var(--color-border) !important;
    --dxbl-btn-focus-bg: var(--color-surface-hover) !important;
    --dxbl-btn-focus-color: var(--color-text) !important;
    --dxbl-btn-focus-border-color: var(--color-border) !important;
}

[data-theme="dark"] .dxbl-btn-secondary.dxbl-disabled.dxbl-btn-standalone {
    --dxbl-btn-bg: var(--color-surface) !important;
    --dxbl-btn-color: var(--color-text) !important;
    --dxbl-btn-border-color: var(--color-border) !important;
    --dxbl-btn-disabled-bg: var(--color-surface) !important;
    --dxbl-btn-disabled-color: var(--color-text) !important;
    --dxbl-btn-disabled-border-color: var(--color-border) !important;
}

[data-theme="dark"] .dxbl-btn-outline-secondary {
    --dxbl-btn-bg: transparent !important;
    --dxbl-btn-color: var(--color-text) !important;
    --dxbl-btn-border-color: transparent !important;
    --dxbl-btn-hover-bg: var(--color-surface-hover) !important;
    --dxbl-btn-hover-border-color: var(--color-surface-hover) !important;
    --dxbl-btn-hover-color: var(--color-text) !important;
    --dxbl-btn-active-bg: var(--color-surface-hover) !important;
    --dxbl-btn-active-border-color: var(--color-surface-hover) !important;
    --dxbl-btn-active-color: var(--color-text) !important;
}

[data-theme="dark"] .dxbl-btn-text-secondary {
    --dxbl-btn-color: var(--color-text) !important;
    --dxbl-btn-hover-bg: var(--color-surface-hover) !important;
    --dxbl-btn-hover-color: var(--color-text) !important;
    --dxbl-btn-active-bg: var(--color-surface-hover) !important;
    --dxbl-btn-active-color: var(--color-text) !important;
}

[data-theme="dark"] .dxbl-text-edit {
    --dxbl-text-edit-bg: var(--color-surface);
    --dxbl-text-edit-color: var(--color-text);
    --dxbl-text-edit-btn-bg: var(--color-surface);
    --dxbl-text-edit-btn-color: var(--color-text);
    --dxbl-text-edit-btn-hover-color: var(--color-text) !important;
    --dxbl-text-edit-border-color: var(--color-border);
    --dxbl-text-edit-border-width: 1px;
    --dxbl-text-edit-disabled-color: var(--color-text);
    --dxbl-text-edit-disabled-bg: var(--color-surface-alpha);
    --dxbl-text-edit-readonly-color: var(--color-text);
    --dxbl-text-edit-readonly-bg: var(--color-surface-alpha);
    --dxbl-text-edit-btn-disabled-color: var(--color-text);
    --dxbl-text-edit-btn-disabled-bg: var(--color-surface-alpha);
    --dxbl-text-edit-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    border: 1px solid var(--color-border) !important;
}

[data-theme="dark"] .dxbl-btn-standalone {
    --dxbl-btn-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    --dxbl-btn-focus-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    --dxbl-btn-active-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    --dxbl-btn-hover-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    --dxbl-btn-disabled-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
}

[data-theme="dark"] .dxbl-list-box,
[data-theme="dark"] .dxbl-list-box-render-container {
    --dxbl-list-box-bg: var(--color-surface-alpha);
    --dxbl-list-box-color: var(--color-text);
    --dxbl-list-box-border-color: var(--color-border);
    --dxbl-list-box-readonly-color: var(--color-text);
    --dxbl-list-box-disabled-color: var(--color-text);
    --dxbl-list-box-item-selected-bg: var(--color-combobox-active-bg);
    --dxbl-list-box-item-selected-color: var(--color-text);
    --dxbl-list-box-item-multi-selected-bg: var(--color-combobox-active-bg);
    --dxbl-list-box-item-multi-selected-color: var(--color-text);
    --dxbl-list-box-item-active-bg: var(--color-combobox-active-bg);
    --dxbl-list-box-item-active-color: var(--color-text);
    --dxbl-list-box-item-hover-bg: var(--color-contrast-bg);
    --dxbl-list-box-item-hover-color: var(--color-text);
    --dxbl-list-box-item-selected-hover-bg: var(--color-combobox-active-bg);
    --dxbl-list-box-item-selected-hover-color: var(--color-text);
    --dxbl-list-box-item-multi-selected-hover-bg: var(--color-combobox-active-bg);
    --dxbl-list-box-item-multi-selected-hover-color: var(--color-text);
    --dxbl-list-box-item-disabled-color: var(--color-gray);
    border: none !important;
}

[data-theme="dark"] .dxbl-edit-dropdown {
    --dxbl-edit-dropdown-bg: var(--color-surface-alpha);
    --dxbl-edit-dropdown-color: var(--color-text);
    --dxbl-edit-dropdown-border-color: var(--color-border);
    --dxbl-edit-dropdown-border-width: 1px;
    --dxbl-edit-dropdown-footer-bg: var(--color-surface);
    --dxbl-edit-dropdown-footer-color: var(--color-text);
    --dxbl-edit-dropdown-footer-btn-color: var(--color-text);
    --dxbl-edit-dropdown-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-0_625) !important;
}

[data-theme="dark"] .dxbl-dropdown,
[data-theme="dark"] .dxbl-itemlist-dropdown {
    --dxbl-dropdown-bg: var(--color-surface-alpha);
    --dxbl-dropdown-color: var(--color-text);
    --dxbl-dropdown-border-color: var(--color-border);
    --dxbl-dropdown-border-width: 1px;
    --dxbl-dropdown-box-shadow: 0px 4px 7.8px 0px var(--color-shadow);
    border-radius: var(--radius-0_625) !important;
}

[data-theme="dark"] dxbl-calendar {
    --dxbl-calendar-bg: var(--color-surface-alpha);
    --dxbl-calendar-header-bg: var(--color-surface-alpha);
    --dxbl-calendar-footer-bg: var(--color-surface-alpha);
    --dxbl-calendar-footer-btn-bg: var(--color-surface);
    --dxbl-calendar-color: var(--color-text);
    --dxbl-calendar-disabled-color: var(--color-text);
    --dxbl-calendar-readonly-color: var(--color-text);
    --dxbl-calendar-not-current-view-color: var(--color-gray);
    --dxbl-calendar-border-color: var(--color-border);
    --dxbl-calendar-border-width: 1px;
    --dxbl-calendar-today-border-color: var(--color-surface-hover);
    --dxbl-calendar-item-selected-bg: var(--color-combobox-active-bg);
    --dxbl-calendar-item-selected-color: var(--color-text);
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-0_625) !important;
    box-shadow: 0px 4px 7.8px 0px var(--color-shadow) !important;
}

[data-theme="dark"] dxbl-calendar div.dxbl-calendar-footer .dxbl-btn {
    box-shadow: 0px 4px 7.8px 0px var(--color-shadow) !important;
}

[data-theme="dark"] .bg-combobox-active {
    --dxbl-btn-bg: var(--color-combobox-active-bg) !important;
    --dxbl-btn-border-color: var(--color-combobox-active-bg) !important;
    --dxbl-btn-hover-bg: var(--color-combobox-active-bg) !important;
    --dxbl-btn-hover-border-color: var(--color-combobox-active-bg) !important;
    --dxbl-btn-active-bg: var(--color-combobox-active-bg) !important;
    --dxbl-btn-active-border-color: var(--color-combobox-active-bg) !important;
}

.dxbl-btn {
    box-shadow: var(--dxbl-btn-box-shadow) !important;
}

.dxbl-text-edit > .dxbl-btn.dxbl-edit-btn-clear {
    --dxbl-btn-padding-x: 0.25rem;
}

.text-md-medium {
    font-size: var(--fs-0_875);
    line-height: 1.3;
    font-weight: 500;
}

.vertical-flex-sm {
    display: flex;
    flex-direction: column;
    gap: var(--space-0_125);
}

.vertical-flex-md {
    display: flex;
    flex-direction: column;
    gap: var(--space-0_625);
}

.card-sm {
    padding: var(--space-0_375);
    gap: var(--space-0_375);
    border-radius: var(--radius-0_625);
    --dxbl-btn-border-radius: var(--radius-0_625);
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    backdrop-filter: blur(15px);
    background-color: var(--color-surface-alpha);
}

.horizontal-flex-md {
    display: flex;
    gap: var(--space-0_625);
    align-items: center;
}

.grid-card {
    padding: var(--space-0_625);
    gap: var(--space-0_625);
    border-radius: var(--radius-0_625);
    --dxbl-btn-border-radius: var(--radius-0_625);
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    backdrop-filter: blur(15px);
    background-color: var(--color-surface-alpha);
    display: grid !important;
    align-items: center;
    width: 100%;
    height: 68px;
}

.icon-wrapper {
    aspect-ratio: 1 / 1;
    min-width: 1.5rem;
    max-width: 1.5rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/*
 * Theme-aware monochrome icons: instead of maintaining a light/dark copy of
 * every flat-color SVG, mask the source file with the current text color.
 * mask-image only cares about the icon's alpha/shape, so the original file's
 * baked-in fill/stroke color is irrelevant - it always renders as currentColor,
 * which already flips between --color-text (light) and --color-text (dark)
 * everywhere else. Only suitable for single-color icons; multi-color icons
 * (status/brand icons) should keep using a plain <img>.
 */
.icon-mask {
    display: inline-block;
    width: 1.125rem;
    height: 1.125rem;
    background-color: currentColor;
    -webkit-mask-image: var(--icon-mask-src);
    mask-image: var(--icon-mask-src);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.card-icon {
    aspect-ratio: 1 / 1;
    min-width: 2.875rem;
    max-width: 2.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    backdrop-filter: blur(15px);
    background-color: var(--color-surface-alpha);
    --dxbl-btn-border-radius: var(--radius-0_625);
    border-radius: var(--radius-0_625);
}

.card-fields {
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    backdrop-filter: blur(15px);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    background-color: var(--color-surface-alpha);
    --dxbl-btn-padding-x: var(--space-0_375) !important;
    --dxbl-btn-padding-y: var(--space-0_375) !important;
    --dxbl-text-edit-padding-x: var(--space-0_375) !important;
    --dxbl-text-edit-padding-y: var(--space-0_375) !important;
    padding: var(--space-0_375);
    --dxbl-btn-border-radius: var(--radius-0_625);
    border-radius: var(--radius-0_625);
    display: flex;
    flex-direction: column;
    gap: var(--space-0_625);
}

.text-sm-medium {
    font-size: var(--fs-0_75);
    line-height: 1.3;
    font-weight: 500;
}

.horizontal-flex-lg {
    display: flex;
    gap: var(--space-1_25) !important;
    align-items: center;
}

.base-card-sm {
    display: flex;
    flex-direction: column;
    gap: var(--space-0_625);
    background-color: var(--color-surface);
    border-radius: var(--radius-0_625);
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    backdrop-filter: blur(15px);
    padding: var(--space-0_625);
}

.skeleton-checkbox {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    min-width: 50px;
    max-width: 50px;
    min-height: 26px;
    max-height: 26px;
    border-radius: var(--radius-full);
    --dxbl-btn-border-radius: var(--radius-full);
}

.button-icon {
    aspect-ratio: 1 / 1;
    min-width: 2.5rem;
    max-width: 2.5rem;
    padding: 0 !important;
}

.text-md-secondary {
    font-size: var(--fs-0_875);
    line-height: 1.3;
    font-weight: 500;
    color: var(--color-gray);
}

.vertical-flex-lg {
    display: flex;
    flex-direction: column;
    gap: var(--space-1_25);
}

@media (max-width: 768px) {
    .vertical-flex-lg {
        gap: var(--space-0_625);
    }
}

.skeleton-icon {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    min-width: 2.875rem;
    max-width: 2.875rem;
    border-radius: var(--radius-0_625);
    --dxbl-btn-border-radius: var(--radius-0_625);
}

.text-lg-medium {
    font-size: var(--fs-1_0);
    font-weight: 500;
}

.text-md-normal {
    font-size: var(--fs-0_875);
    line-height: 1.3;
    font-weight: 400;
}

.text-sm-normal {
    font-size: var(--fs-0_75);
    line-height: 1.3;
    font-weight: 400;
}

.horizontal-flex-sm {
    display: flex;
    gap: var(--space-0_25);
    align-items: center;
}

.skeleton-text {
    width: 100%;
    --dxbl-btn-padding-x: var(--space-0_375) !important;
    --dxbl-btn-padding-y: var(--space-0_375) !important;
    padding: var(--space-0_375);
    --dxbl-btn-border-radius: var(--radius-0_625);
    border-radius: var(--radius-0_625);
}

.grid-split-cols-2 {
    display: grid;
    gap: var(--space-0_625);
    align-items: stretch;
    width: 100%;
    grid-template-columns: repeat(2, 1fr);
}

button {
    border: none;
    padding: 0;
    background: unset;
}

.ws-normal {
    white-space: normal;
}

.ws-nowrap {
    white-space: nowrap;
}

.text-ellipsis__wrapper {
    min-width: 0;
    overflow: hidden;
    display: grid;
}

.text-ellipsis {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-ellipsis-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    overflow-wrap: break-word;
    min-width: 0;
}


auto-disable {
    display: contents;
}

* {
    box-sizing: border-box;
}

body {
    --bs-body-bg: var(--color-bg);
    --bs-body-color: var(--color-text);
    --bs-font-sans-serif: "Poppins", sans-serief, serif;
    --bs-body-line-height: 1.3;
    min-height: var(--vh-full);
    display: flex;
    flex-direction: column;
    font-family: "Poppins", sans-serief, serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
}

hr {
    margin: 0 !important;
    border-color: var(--color-surface-hover) !important;
    opacity: 1 !important;
}

dialog::backdrop {
    backdrop-filter: blur(6px);
    background: rgba(0, 0, 0, 0.5);
    opacity: 1;
}

.glass-card {
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    backdrop-filter: blur(15px);
    background-color: var(--color-surface-alpha);
}

.glass-card.bg-surface {
    background-color: var(--color-surface);
}

.modals-glass-card {
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    backdrop-filter: blur(15px);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    background-color: var(--color-surface-alpha);
}

.field-text {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: var(--space-0_375);
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-auto {
    flex: 1 1 auto;
}

.grid-row {
    display: grid;
    gap: var(--space-0_625);
    align-items: stretch;
    width: 100%;
}

.circle {
    --circle-size: var(--space-0_625);
    border-radius: 9999px;
    min-width: var(--circle-size);
    max-width: var(--circle-size);
    aspect-ratio: 1 / 1;
}

.vertical-line {
    --line-height: 9px;
    width: 1px;
    height: var(--line-height);
    background-color: var(--color-primary);
}

.card-content-hidden {
    pointer-events: none;
}

.card-content-hidden > * {
    opacity: 0;
    transition: opacity 150ms ease-in-out;
}

.card-content-visible > * {
    opacity: 1;
    transition: opacity 150ms ease-in-out;
}

.btn-icon > img {
    max-width: 18px;
    max-height: 18px;
}

.custom-combobox {
    --dxbl-btn-padding-x: var(--space-0_375) !important;
    --dxbl-btn-padding-y: var(--space-0_375) !important;
    --dxbl-text-edit-padding-x: var(--space-0_375) !important;
    --dxbl-text-edit-padding-y: var(--space-0_375) !important;
}

.custom-combobox-dropdown-body > .dxbl-list-box-render-container {
    --dxbl-list-box-item-padding-y: var(--space-0_375) !important;
    --dxbl-list-box-item-padding-x: var(--space-0_375) !important;
}

.button-unstyle {
    appearance: none;
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
}

/* ENUM COLORS */
.FailedToService,
.CanceledByCustomer,
.CanceledByMerchant,
.CanceledByTrader,
.CanceledByTimeout,
.CanceledByAdmin,
.Canceled,
.Error,
.Off {
    color: var(--color-danger);
}

.Completed,
.Paid,
.Success {
    color: var(--color-success);
}

.Processing,
.Queued,
.Submitted,
.Processing,
.Unpaid {
    color: var(--color-warning);
}

.dxbl-checkbox.dxbl-checkbox-switch.dxbl-lg .dxbl-checkbox-check-element {
    margin: 0 !important;
}

.relative {
    position: relative;
}

/* Pages max height (shared across multiple pages/components) */
.max-h-orders {
    max-height: calc(var(--vh-full) - 310px);
}

@media (max-width: 768px) {
    .max-h-orders {
        max-height: calc(var(--vh-full) - 308px);
    }
}

.max-h-support {
    max-height: calc(var(--vh-full) - 120px);
}

.max-h-support-chat {
    max-height: calc(var(--vh-full) - 203px);
}

.min-h-max {
    min-height: max-content;
}

.min-w-max {
    min-width: max-content;
}

.max-w-screen-padding {
    max-width: calc(100vw - 40px);
}

.modal-scroll {
    position: relative !important;
    z-index: 1000 !important;
}

.modal-scroll > .dxbl-scroll-viewer-content {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
    display: flex !important;
}

.dialog-content-scroll > .dxbl-scroll-viewer-content {
    padding: var(--space-0_25) !important;
    display: flex !important;
    min-width: 0;
}

/* Extensions */

.w-2_5 {
    width: 2.5rem;
}

.min-content {
    width: min-content;
}

.min-w-0 {
    min-width: 0;
}

.h-stretch {
    height: 100%;
}

.max-w-5_8 {
    max-width: 5.8rem;
}

.max-w-inherit {
    max-width: calc(var(--max-width) - 40px);
}

.w-min {
    width: min-content;
}

.max-w-400px {
    max-width: 400px;
}

.max-w-max {
    max-width: max-content;
}

@media (max-width: 768px) {
    .md-w-100 {
        width: 100%;
        max-width: 100%;
    }
}

.min-w-2_5 {
    min-width: 2.5rem;
}

.min-w-220px {
    min-width: 220px
}

.max-h-84px {
    max-height: 84px;
}

.min-h-84px {
    min-height: 84px;
}

.min-h-62px {
    min-height: 62px;
}

.max-h-140px {
    max-height: 140px;
}

.min-h-140px {
    min-height: 140px;
}

.max-h-204px {
    max-height: 204px;
}

.max-h-280px {
    max-height: 280px;
}

.min-h-100px {
    min-height: 100px;
}

.min-h-screen {
    min-height: var(--vh-full);
}

.p-1_25 {
    --dxbl-btn-padding-x: var(--space-1_25) !important;
    --dxbl-btn-padding-y: var(--space-1_25) !important;
    padding: var(--space-1_25);
}

.p-0 {
    --dxbl-btn-padding-x: 0 !important;
    --dxbl-btn-padding-y: 0 !important;
    padding: 0;
}

.p-0_375 {
    --dxbl-btn-padding-x: var(--space-0_375) !important;
    --dxbl-btn-padding-y: var(--space-0_375) !important;
    --dxbl-text-edit-padding-x: var(--space-0_375) !important;
    --dxbl-text-edit-padding-y: var(--space-0_375) !important;
    padding: var(--space-0_375);
}

.py-0_625 {
    --dxbl-btn-padding-y: var(--space-0_625) !important;
    padding-top: var(--space-0_625);
    padding-bottom: var(--space-0_625);
}

.pr-1_25 {
    padding-right: var(--space-1_25);
}

.p-0_625 {
    --dxbl-btn-padding-x: var(--space-0_625) !important;
    --dxbl-btn-padding-y: var(--space-0_625) !important;
    --dxbl-dropdown-body-padding-y: var(--space-0_625) !important;
    --dxbl-dropdown-body-padding-x: var(--space-0_625) !important;
    padding: var(--space-0_625);
}

.px-0_375 {
    --dxbl-btn-padding-x: var(--space-0_375) !important;
    padding-inline: var(--space-0_375);
}

.px-1_25 {
    --dxbl-btn-padding-x: var(--space-1_25) !important;
    padding-inline: var(--space-1_25);
}

.mt-0_625 {
    margin-top: var(--space-0_625);
}

.mt-1_25 {
    margin-top: var(--space-1_25);
}

.pt-0_625 {
    padding-top: var(--space-0_625);
}

.mb-0_625 {
    margin-bottom: var(--space-0_625);
}

.ml-auto {
    margin-left: auto;
}

.mr-auto {
    margin-right: auto;
}

.mx-auto {
    margin-inline: auto;
}

.md-mx-auto {
    margin-inline: 0;
}

@media (min-width: 768px) {
    .md-mx-auto {
        margin-inline: auto;
    }
}

.mx-1_25 {
    margin-inline: var(--space-1_25);
}

.m-0 {
    margin: 0;
}

.gap-0_125 {
    gap: var(--space-0_125);
}

.gap-0_375 {
    gap: var(--space-0_375);
}

.gap-0_625 {
    gap: var(--space-0_625);
}

.card-md {
    padding: var(--space-0_625);
    gap: var(--space-0_625);
    border-radius: var(--radius-0_625);
    --dxbl-btn-border-radius: var(--radius-0_625);
    border: 1px solid var(--color-surface-alpha);
    border-image-source: var(--color-border-gradient);
    box-shadow: var(--dxbl-text-edit-box-shadow);
    backdrop-filter: blur(15px);
    background-color: var(--color-surface-alpha);
}

[data-theme="dark"] .card-sm,
[data-theme="dark"] .grid-card,
[data-theme="dark"] .card-icon,
[data-theme="dark"] .card-fields,
[data-theme="dark"] .base-card-sm,
[data-theme="dark"] .card-md,
[data-theme="dark"] .glass-card,
[data-theme="dark"] .modals-glass-card,
[data-theme="dark"] .modal-tabs {
    border-color: var(--color-border);
    border-image-source: none;
}

.gap-0_875 {
    gap: var(--space-0_875);
}

.gap-1_0 {
    gap: var(--space-1_0);
}

.gap-1_25 {
    gap: var(--space-1_25);
}

.grid-cols-4 {
    grid-template-columns: repeat(4, 1fr);
}

.rounded-1_25 {
    border-radius: var(--radius-1_25);
}

.rounded-0 {
    --dxbl-btn-border-radius: 0;
    border-radius: 0;
}

.rounded-0_875 {
    --dxbl-btn-border-radius: var(--radius-0_875);
    border-radius: var(--radius-0_875);
}

.rounded-0_625 {
    --dxbl-btn-border-radius: var(--radius-0_625);
    border-radius: var(--radius-0_625);
}

.b-shadow {
    box-shadow: var(--dxbl-text-edit-box-shadow);
}

.b-shadow-inset {
    box-shadow: inset 0 -2px 12px 0 var(--color-shadow);
}

.bg-red {
    background-color: var(--color-danger);
}

.bg-white-blue {
    background-color: var(--color-accent-bg) !important;
}

.border-white-blue {
    border-color: var(--color-accent-bg) !important;
}

[data-theme="dark"] .bg-white-blue {
    background-color: var(--color-surface-hover) !important;
}

[data-theme="dark"] .border-white-blue {
    border-color: var(--color-surface-hover) !important;
}

.bg-white {
    background-color: var(--color-surface);
}

.bg-surface-alpha {
    background-color: var(--color-surface-alpha) !important;
}

.bg-green {
    background-color: var(--color-success);
}

.text--primary {
    color: var(--color-primary);
}

.text--red {
    color: var(--color-danger);
}

.count {
    font-weight: 600;
    color: var(--color-danger);
}

.text--orange {
    color: var(--color-warning);
}

.text--green {
    color: var(--color-success);
}

.text--black {
    color: var(--color-text);
}

.text--gray {
    color: var(--color-gray);
}

.text--placeholder {
    color: var(--color-gray);
}

.text-unwrap {
    text-wrap: nowrap;
}

.font-weight-medium {
    font-weight: 500;
}

.ratio-cube {
    aspect-ratio: 1 / 1;
}

.qr-code {
    width: 170px;
    height: 170px;
    aspect-ratio: 1 / 1;
}

.border-glass {
    border: 1px solid var(--color-surface-alpha);
}

[data-theme="dark"] .border-glass {
    border-color: var(--color-border);
}

.z-dialog {
    z-index: var(--dialog-z-index);
}

.underline {
    text-decoration: underline;
}

.d-contents {
    display: contents;
}

.cursor-pointer {
    cursor: pointer;
}

.dxbl-btn.btn-hover-none:hover {
    --dxbl-btn-hover-bg: var(--color-surface-hover) !important;
    --dxbl-btn-hover-border-color: var(--color-surface-hover) !important;
}

.dxbl-btn.dxbl-btn-secondary.bg-contrast {
    --dxbl-btn-bg: var(--color-contrast-bg) !important;
    --dxbl-btn-border-color: transparent !important;
    --dxbl-btn-hover-bg: var(--color-contrast-bg) !important;
    --dxbl-btn-hover-border-color: transparent !important;
}

.overflow-hidden {
    overflow: hidden;
}

.scrollbar-hidden {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.scrollbar-hidden::-webkit-scrollbar {
    display: none;
}

.message-field {
    margin-top: auto;
}

@media (max-width: 768px) {
    .mobile-mt-auto {
        margin-top: auto;
    }

    .terminal-card {
        --dxbl-btn-padding-x: 10px !important;
        --dxbl-btn-padding-y: 10px !important;
    }

    .message-field {
        margin-top: 0;
    }
}

timer-countdown-element,
.data-warning,
.data-expired {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

timer-countdown-element[data-expired],
.data-expired {
    color: var(--color-danger);
    transition: color 150ms;
}

timer-countdown-element[data-warning],
.data-warning {
    color: var(--color-warning);
    transition: color 150ms;
}

timer-countdown-element[data-warning]::before,
.data-warning::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    background-image: url("icons/IconWarningClockSquare.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
}

timer-countdown-element[data-expired]::before,
.data-expired::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    background-image: url("icons/IconExpireClockSquare.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
}

.icon-arrow-up-primary::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    background-image: url("icons/IconArrowUpPrimary.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
}

.rotate-180 {
    transform: rotate(180deg);
}

.dxbl-text-edit.invalid {
    outline: 1px solid var(--dxbl-text-edit-border-color) !important;
}

.b-b-l-r-0 {
    border-bottom-left-radius: 0 !important;
}

.b-b-r-r-0 {
    border-bottom-right-radius: 0 !important;
}

.input-text-end .dxbl-text-edit-input {
    text-align: end;
}

.word-break-all {
    word-break: break-all;
}

.pr-0_625 {
    padding-right: var(--space-0_625);
}

dxbl-combo-box .dxbl-text-edit-template {
    padding-right: 0 !important;
}

/* Transition API */
::view-transition-old(root),
::view-transition-new(root) {
    animation: none;
    mix-blend-mode: normal;
}

/* ========= SWAP ========= */
.swap-target--content {
    display: none;
}

.swap-target--content.active {
    display: block;
}

::view-transition-image-pair(card-left),
::view-transition-image-pair(card-right) {
    isolation: auto;
}

::view-transition-old(card-left),
::view-transition-new(card-left),
::view-transition-old(card-right),
::view-transition-new(card-right) {
    mix-blend-mode: normal;
    height: 100%;
    overflow: hidden;
}

::view-transition-old(card-left) {
    animation: 110ms ease-in both vt-slide-out-left;
}

::view-transition-new(card-left) {
    animation: 110ms ease-out both vt-slide-in-right;
}

::view-transition-old(card-right) {
    animation: 110ms ease-in both vt-slide-out-right;
}

::view-transition-new(card-right) {
    animation: 110ms ease-out both vt-slide-in-left;
}

::view-transition-old(content-panel) {
    animation: 90ms ease-in both vt-fade-out;
}

::view-transition-new(content-panel) {
    animation: 90ms ease-out both vt-fade-in;
}

@keyframes vt-slide-out-left {
    to {
        transform: translateX(-20px);
        opacity: 0;
    }
}

@keyframes vt-slide-in-right {
    from {
        transform: translateX(20px);
        opacity: 0;
    }
}

@keyframes vt-slide-out-right {
    to {
        transform: translateX(20px);
        opacity: 0;
    }
}

@keyframes vt-slide-in-left {
    from {
        transform: translateX(-20px);
        opacity: 0;
    }
}

@keyframes vt-fade-out {
    to {
        opacity: 0;
    }
}

@keyframes vt-fade-in {
    from {
        opacity: 0;
    }
}

::view-transition-image-pair(icon-left),
::view-transition-image-pair(icon-right) {
    isolation: auto;
}

::view-transition-old(icon-left),
::view-transition-new(icon-left),
::view-transition-old(icon-right),
::view-transition-new(icon-right) {
    mix-blend-mode: normal;
    height: 100%;
    overflow: hidden;
}

::view-transition-old(icon-left),
::view-transition-old(icon-right) {
    animation: 110ms ease-in both vt-fade-out;
}

::view-transition-new(icon-left),
::view-transition-new(icon-right) {
    animation: 110ms ease-out both vt-fade-in;
}

.pe-none {
    pointer-events: none !important;
}

.cursor-default {
    cursor: default !important;
}

.dxbl-text-edit > .dxbl-text-edit-template .dxbl-text-edit-input {
    border-radius: 0 !important;
    width: 100%;
    font-weight: 500;
    color: var(--color-gray);
}

.dxbl-text-edit > .dxbl-text-edit-template .dxbl-text-edit-input::placeholder {
    color: var(--color-gray);
}

/* devanagari */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/poppins-1.woff2') format('woff2');
    unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

/* latin-ext */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/poppins-2.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/poppins-3.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* devanagari */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('fonts/poppins-4.woff2') format('woff2');
    unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

/* latin-ext */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('fonts/poppins-5.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('fonts/poppins-6.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* MAX HEIGHT SECTION */
.max-h-dashboard {
    max-height: calc(var(--vh-full) - 120px);
}

.max-h-active-appeals {
    max-height: calc(var(--vh-full) - 246px);
}

.max-h-history-appeals {
    max-height: calc(var(--vh-full) - 246px);
}

.max-h-sms-notifications {
    max-height: calc(var(--vh-full) - 245px);
}

.max-h-terminals {
    max-height: calc(var(--vh-full) - 184px);
}

.max-h-payin-credentials {
    max-height: calc(var(--vh-full) - 246px);
}

.max-h-payout-directions {
    max-height: calc(var(--vh-full) - 185px);
}

.max-h-modal-load-template {
    max-height: 460px;
}

.max-h-balance {
    max-height: calc(var(--vh-full) - 403px);
}

.max-h-all-sessions {
    max-height: calc(var(--vh-full) - 120px);
}

.max-h-tab-notifications {
    flex: 1 1 auto;
    min-height: 0;
}

.dialog-content form.h-100 {
    height: auto !important;
    flex: 1 1 auto;
    min-height: 0;
}

.max-h-modal-contragents {
    max-height: 658px;
}

.max-h-modal-payout-exceptions {
    max-height: 566px;
}

.max-h-modal-files {
    max-height: 450px;
}

.max-h-modal-deposit-warning {
    max-height: 200px;
}

@media (max-width: 1200px) {
    .grid-card-order {
        grid-template-columns: 0.5fr 1fr 0.5fr 100px 90px 46px !important;
    }
}

@media (max-width: 1024px) {
    .grid-card-order {
        grid-template-columns: 1fr 1fr 1fr !important;
        grid-template-rows: repeat(3, min-content) !important;
        height: 170px !important;
    }

    .grid-card-order__status {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .grid-card-order__appeal {
        grid-column: 3;
        grid-row: 1;
        justify-self: end;
    }

    .grid-card-order__payment-info {
        grid-column: 1 / 4;
        grid-row: 2;
    }

    .grid-card-order__amount {
        grid-column: 1;
        grid-row: 3;
    }

    .grid-card-order__date {
        grid-column: 2;
        grid-row: 3;
    }

    .grid-card-order__time {
        grid-column: 3;
        grid-row: 3;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    .grid-card-transaction {
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: repeat(3, min-content) !important;
        height: 170px !important;
    }

    .grid-card-transaction__status {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .grid-card-transaction__payment-info {
        grid-column: 1 / 3;
        grid-row: 2;
    }

    .grid-card-transaction__amount {
        grid-column: 1;
        grid-row: 3;
        justify-self: start !important;
        margin-inline: 0 !important;
        text-align: start;
    }

    .grid-card-transaction__date {
        grid-column: 2;
        grid-row: 3;
        display: flex;
        justify-content: end;
        align-items: end;
    }

    .grid-card-transaction__date .date-time-root {
        margin-inline: 0 !important;
        align-items: flex-end;
        text-align: right;
    }

    .grid-card-deposit-claim {
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: repeat(3, min-content) !important;
        height: 170px !important;
    }

    .grid-card-deposit-claim__status {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .grid-card-deposit-claim__address {
        grid-column: 1 / 3;
        grid-row: 2;
    }

    .grid-card-deposit-claim__fraction {
        grid-column: 1;
        grid-row: 3;
    }

    .grid-card-deposit-claim__timer {
        grid-column: 2;
        grid-row: 3;
        justify-content: end;
    }

    .grid-card-payin-credentials {
        grid-template-columns: 1fr 1fr 1fr !important;
        grid-template-rows: repeat(4, min-content) !important;
        height: 210px !important;
        overflow: hidden;
    }

    .grid-card-payin-credentials__status {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .grid-card-payin-credentials__switch {
        grid-column: 3;
        grid-row: 1;
        justify-self: end;
    }

    .grid-card-payin-credentials__payment-info {
        grid-column: 1 / 4;
        grid-row: 2;
    }

    .grid-card-payin-credentials__description {
        grid-column: 1 / 4;
        grid-row: 3;
    }

    .grid-card-payin-credentials__progress {
        grid-column: 1 / 3;
        grid-row: 4;
    }

    .grid-card-payin-credentials__transfer-icon {
        grid-column: 3;
        grid-row: 4;
        justify-self: end;
    }

    .grid-card-payout-directions {
        grid-template-columns: 1fr auto !important;
        grid-template-rows: repeat(4, min-content) !important;
        height: 210px !important;
        overflow: hidden;
    }

    .grid-card-payout-directions__info {
        grid-column: 1;
        grid-row: 1;
    }

    .grid-card-payout-directions__switch {
        grid-column: 2;
        grid-row: 1;
        justify-content: end;
    }

    .grid-card-payout-directions__associated {
        grid-column: 1 / 3;
        grid-row: 2;
    }

    .grid-card-payout-directions__amount-range {
        grid-column: 1 / 3;
        grid-row: 3;
    }

    .grid-card-payout-directions__counters {
        grid-column: 1 / 3;
        grid-row: 4;
    }

    .grid-card-sms-notifications {
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: repeat(3, min-content) !important;
        height: 170px !important;
    }

    .grid-card-sms-notifications__status {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .grid-card-sms-notifications__app-info {
        grid-column: 1 / 3;
        grid-row: 2;
    }

    .grid-card-sms-notifications__message {
        grid-column: 1;
        grid-row: 3;
    }

    .grid-card-sms-notifications__date {
        grid-column: 2;
        grid-row: 3;
        justify-self: end;
    }

    .grid-card-lost-order {
        grid-template-columns: 1fr 1fr 1fr !important;
        grid-template-rows: repeat(3, min-content) !important;
        height: 150px !important;
    }

    .grid-card-lost-order__payment-info {
        grid-column: 1 / 4;
        grid-row: 1 / 3;
    }

    .grid-card-lost-order__sender {
        grid-column: 1;
        grid-row: 3;
    }

    .grid-card-lost-order__amount {
        grid-column: 2;
        grid-row: 3;
    }

    .grid-card-lost-order__date {
        grid-column: 3;
        grid-row: 3;
    }

    .grid-card-appeal {
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: repeat(3, min-content) !important;
        height: 170px !important;
    }

    .grid-card-appeal__status {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .grid-card-appeal__payment-info {
        grid-column: 1 / 3;
        grid-row: 2;
    }

    .grid-card-appeal__amount {
        grid-column: 1;
        grid-row: 3;
    }

    .grid-card-appeal__time {
        grid-column: 2;
        grid-row: 3;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }
}

@media (max-width: 768px) {
    .max-h-dashboard {
        max-height: calc(var(--vh-full) - 90px);
    }

    .max-h-terminals {
        max-height: calc(var(--vh-full) - 194px);
    }

    .max-h-payin-credentials {
        max-height: calc(var(--vh-full) - 300px);
    }

    .max-h-payout-directions {
        max-height: calc(var(--vh-full) - 195px);
    }

    .max-h-history-appeals {
        max-height: calc(var(--vh-full) - 245px);
    }

    .max-h-active-appeals {
        max-height: calc(var(--vh-full) - 205px);
    }

    .max-h-balance {
        max-height: calc(var(--vh-full) - 355px);
    }

    .max-h-sms-notifications {
        max-height: calc(var(--vh-full) - 204px);
    }

    .max-h-support-chat {
        height: calc(var(--vh-full) - 215px) !important;
    }

    .max-h-all-sessions {
        max-height: calc(var(--vh-full) - 90px);
    }

    .max-h-modal-contragents {
        max-height: calc(calc(var(--vh-full) * 0.85) - 90px);
    }

    .max-h-modal-payout-exceptions {
        max-height: calc(calc(var(--vh-full) * 0.85) - 90px);
    }

    .payin-credentials-filters-row {
        display: grid !important;
        grid-template-columns: 1fr auto auto;
        grid-template-rows: auto auto auto;
    }

    .terminals-filters-row {
        display: grid !important;
        grid-template-columns: 1fr auto auto;
        grid-template-rows: auto auto;
    }
}

.grid-card-transaction__amount {
    text-align: start;
}

.more-actions-dropdown--body {
    --dxbl-dropdown-body-padding-y: 0 !important;
    --dxbl-dropdown-body-padding-x: 0 !important;
    overflow: hidden !important;
    border-radius: var(--radius-0_625) !important;
}

.more-actions-dropdown--body .dxbl-btn {
    --dxbl-text-edit-box-shadow: unset !important;
    --dxbl-btn-border-radius: 0 !important;
    box-shadow: unset !important;
}

.more-actions-dropdown--body .dxbl-btn:hover {
    background-color: var(--color-surface-hover) !important;
}

dxbl-toast-portal {
    position: fixed !important;
}

.dxbl-toast {
    --dxbl-toast-border-radius: var(--radius-0_625) !important;
    --dxbl-toast-accent-line-width: 8px !important;
    --dxbl-toast-color: var(--color-text) !important;
    --dxbl-toast-title-color: var(--color-text) !important;
    --dxbl-toast-message-color: var(--color-text) !important;
    border: 1px solid var(--color-surface-alpha) !important;
    border-image-source: var(--color-border-gradient);
    box-shadow: var(--dxbl-text-edit-box-shadow) !important;
    backdrop-filter: blur(15px);
    background-color: var(--color-surface-alpha) !important;
    color: var(--color-text) !important;
    border-radius: var(--radius-0_625) !important;
}

.dxbl-toast * {
    color: inherit !important;
}

[data-theme="dark"] .dxbl-toast {
    border-color: var(--color-border) !important;
    border-image-source: none;
}

.dxbl-toast-portal .dxbl-toast .dxbl-toast-close {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dxbl-toast-portal .dxbl-toast .dxbl-toast-close button.dxbl-toast-close-btn {
    padding: 0;
    fill: var(--dxbl-toast-close-button-color);
    aspect-ratio: 1 / 1 !important;
    min-width: 24px;
    min-height: 24px;
    margin: 0;
    border-radius: var(--radius-full) !important;
}

.dxbl-toast-portal .dxbl-toast .dxbl-toast-close svg.dxbl-toast-close-btn {
    width: 14px !important;
    height: 14px !important;
}

.ps-card {
    display: grid;
    align-items: center;
    gap: var(--space-0_375);
    grid-template-columns: 1fr 1fr;
}

.chat-input-form {
    display: grid;
    align-items: stretch;
    padding-top: 0;
    padding-bottom: 0;
    grid-template-columns: min-content 1fr min-content;
}

.validation-errors,
.validation-message {
    color: var(--color-danger);
}

.adaptive-sidebar-mobile-only {
    display: none !important;
}

.adaptive-sidebar-desktop-only {
    height: 100%;
}

@media (max-width: 1200px) {
    .adaptive-sidebar-mobile-only {
        display: inline-flex !important;
    }

    .adaptive-sidebar-desktop-only {
        display: none;
    }
}

.combobox-list-item {
    border-radius: 0 !important;
}

@media (max-width: 768px) {
    .combobox-list-item {
        border-radius: var(--dxbl-btn-border-radius) !important;
    }
}

.dxbl-upload .dxbl-upload-container .dxbl-upload-file-list-view .dxbl-upload-file-view .dxbl-upload-file-view-details {
    margin-left: 10px;
    gap: 0 !important;
    align-items: start !important;
    justify-content: center !important;
}

.scroll-container {
    display: grid;
    width: 100%;
}