body {
    background-color: #202124;
    scrollbar-width: auto;
    scrollbar-color: #6e6e6e transparent;
}

.mud-main-content {
    height: 100%;
    min-height: 100vh;
    display: flex;
    padding-top: 0;
    padding-bottom: 0;
}

.mud-container--gutters {
    padding-left: 9px;
    padding-right: 9px;
}

.mud-chip.mud-chip-size-medium {
    height: 28px;
}

.no-min-width .mud-list-item-icon {
    min-width: 32px !important;
}

.mud-disabled {
    font-size: xx-large;
}

.clickable-span {
    color: red;
    cursor: pointer;
    width: auto;
}

.clickable-span:hover {
    text-decoration: underline;
    cursor: pointer;
    width: auto;
}

.mud-progress-circular.mud-progress-small {
    height: 16px;
    width: 16px;
}

.mud-data-grid th.mud-table-cell.sticky-left, .mud-data-grid th.mud-table-cell.sticky-right {
    background-color: unset !important;
}

@media (max-width: 599px) {
    .mud-data-grid td.mud-table-cell.sticky-left,
    .mud-data-grid td.mud-table-cell.sticky-right {
        background-color: transparent !important;
    }
}

@media(max-width: 600px) {
    .mud-xs-table .mud-table-row .mud-table-cell:last-child {
        border-bottom: 3px solid var(--mud-palette-table-lines);
    }
}

.mud-data-grid th.mud-table-cell.sticky-left,
.mud-data-grid th.mud-table-cell.sticky-right {
    background-color: rgba(25, 26, 28, 1);
}

.mud-data-grid td.mud-table-cell.sticky-left,
.mud-data-grid td.mud-table-cell.sticky-right {
    background-color: rgba(32, 33, 36, 1);
}

.mud-drawer-open-responsive-md-left .mud-appbar {
    --mud-drawer-width-left: 130px;
}

.mud-drawer-open-responsive-md-left .mud-main-content {
    margin-left: 130px;
}

.mud-drawer-open-responsive-sm-left .mud-appbar {
    --mud-drawer-width-left: 130px;
}

.mud-drawer-open-responsive-sm-left .mud-main-content {
    margin-left: 130px;
}

.mud-drawer-open-responsive-xs-left .mud-appbar {
    margin-left: 130px;
}

.mud-drawer-open-responsive-xs-left .mud-main-content {
    margin-left: 130px;
}

.mud-input {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}
.mud-chip {
    font-size: var(--mud-typography-default-size);
}
.mud-chip.mud-chip-size-small {
    font-size: var(--mud-typography-body1-size);
}

.mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

.mud-simple-table table * tr > td, .mud-simple-table table * tr th {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

.mud-expand-panel .mud-expand-panel-header {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

.mud-button-year {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

.mud-table-cell {
 /*   font-size: inherit !important; */
 /*   font-weight: inherit !important; */
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

.mud-typography-body2 {
    color: var(--mud-palette-text-secondary);
}

.mud-typography-subtitle2 {
    color: var(--mud-palette-text-primary);
}

.mud-breadcrumbs.mud-typography-body1 {
    font-size: 1.5rem;
}

.mud-breadcrumbs.mud-typography-body1 a:hover {
    text-decoration: underline;
    transition: text-decoration 0.3s ease;
}

.mud-typography-body1 {
    font-size: var(--mud-typography-body1-size);
}

.mud-typography-body2 {
    font-size: var(--mud-typography-body2-size);
}

.mud-button-outlined-size-small {
    font-size: var(--mud-typography-body2-size);
}

.mud-grid.readonly-grid > .mud-grid-item {
    border-bottom: 1px solid var(--mud-palette-table-lines);
    padding-bottom:2px;
}

#blazor-error-ui {
    background-color: var(--mud-palette-error);
    color: var(--mud-palette-error-text);
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.75rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 9999;
}

#reconnect-modal {
    background-color: var(--mud-palette-warning-hover);
    color: var(--mud-palette-warning-darken);
    top: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    padding: 0.6rem 1.75rem 0.7rem 1.25rem;
    margin: 0px;
    position: fixed;
    width: 100%;
    z-index: 9999;
}

.mud-nav-link {
    white-space: normal !important;
    padding: 8px 8px 8px 8px;
}

.user-button {
    text-transform: none;
    background: rgba(var(--mud-palette-primary-rgb), 0.1)
}

.side-menu .mud-chip.mud-chip-size-small {
    font-size: 0.625rem;
    height: 1.125rem;
}

.mud-menu-item {
    padding: 4px 8px;
}

@keyframes glow-text {
    0%, 100% {
        text-shadow:
            0 0 4px snow,
            0 -10px 20px tomato,
            -10px 10px 20px yellow,
            10px 10px 20px tomato;
    }
    33% {
        text-shadow:
            0 0 4px snow,
            0 -10px 20px cyan,
            -10px 10px 20px tomato,
            10px 10px 20px cyan;
    }
    66% {
        text-shadow:
            0 0 4px snow,
            0 -10px 20px yellow,
            -10px 10px 20px cyan,
            10px 10px 20px yellow;
    }
}

@keyframes glow-div {
    0%, 100% {
        box-shadow:
            0 0 10px snow,
            0 0 20px tomato,
            0 0 30px yellow,
            0 0 40px tomato;
    }
    33% {
        box-shadow:
            0 0 10px snow,
            0 0 20px cyan,
            0 0 30px tomato,
            0 0 40px cyan;
    }
    66% {
        box-shadow:
            0 0 10px snow,
            0 0 20px yellow,
            0 0 30px cyan,
            0 0 40px yellow;
    }
}

@keyframes ticker-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        /* Смещение на 50% ширины контейнера, так как список продублирован */
        transform: translateX(-50%);
    }
}

.glowing-text {
    color: snow;
    animation: glow-text 1s ease-in-out both infinite;
}

/******************************************************************************************************/

/* MudBlazor Overlay Override */
.mud-overlay .mud-overlay-scrim.mud-overlay-dark {
    border-color: var(--mud-palette-overlay-dark) !important;
    background-color: var(--mud-palette-overlay-dark) !important;
    backdrop-filter: blur(8px) !important;
}

/******************************************************************************************************/

/* Display contents utility classes for inline visibility */
.d-contents {
    display: contents !important;
}

/* Responsive display:contents - MudBlazor breakpoints */
/* sm: 600px, md: 960px, lg: 1280px, xl: 1920px, xxl: 2560px */
@media (min-width: 600px) {
    .d-sm-contents {
        display: contents !important;
    }
    .d-sm-none {
        display: none !important;
    }
}

@media (min-width: 960px) {
    .d-md-contents {
        display: contents !important;
    }
    .d-md-none {
        display: none !important;
    }
}

@media (min-width: 1280px) {
    .d-lg-contents {
        display: contents !important;
    }
    .d-lg-none {
        display: none !important;
    }
}

@media (min-width: 1920px) {
    .d-xl-contents {
        display: contents !important;
    }
    .d-xl-none {
        display: none !important;
    }
}

@media (min-width: 2560px) {
    .d-xxl-contents {
        display: contents !important;
    }
    .d-xxl-none {
        display: none !important;
    }
}

/******************************************************************************/

.mud-tab {
    text-transform: none !important;
    color: var(--mud-palette-secondary);
}

.mud-tab.mud-tab-active {
    color: var(--mud-palette-text-primary);
}

.mud-tabs-tabbar {
    background-color: transparent !important;
}

.mud-tabs-tabbar .mud-tabs-tabbar-inner {
    min-height: 52px !important;
}

.mud-tab-slider.mud-tab-slider-horizontal {
    height: 3px !important;
}

.mud-tab {
    min-height: 52px !important;
}

/*
.mud-tabs {
    background-color: var(--mud-palette-surface);
}
*/

.mud-tab.mud-tab-active .mud-svg-icon {
    fill: var(--active-icon-color);
}

/**************************************************************/

/* Trade Actions – reusable dual-button pill *******************/
/* Override --ta-left-color, --ta-right-color on .trade-actions-shell
   to theme per-instance; glows auto-derive via color-mix */

.trade-actions-shell {
    --ta-left-color:     var(--mud-palette-warning);
    --ta-right-color:    var(--mud-palette-success);
    --ta-left-glow:      color-mix(in srgb, var(--ta-left-color) 18%, transparent);
    --ta-right-glow:     color-mix(in srgb, var(--ta-right-color) 18%, transparent);
    --ta-divider:        rgba(255,255,255,.18);

    position: relative;
    width: 100%;
    border-radius: 999px;
    padding: 1px;
    background:
        linear-gradient(
            90deg,
            var(--ta-left-color) 0%,
            var(--ta-left-color) 28%,
            rgba(255,255,255,0.10) 50%,
            var(--ta-right-color) 72%,
            var(--ta-right-color) 100%
        );
}

.trade-actions-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 20% 50%, var(--ta-left-glow), transparent 28%),
        radial-gradient(circle at 80% 50%, var(--ta-right-glow), transparent 28%);
    filter: blur(14px);
    opacity: .9;
}

.trade-actions-panel {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: stretch;
    padding: 0;
    border-radius: 999px;
    background: linear-gradient(180deg, #1b1c1e 0%, #1b1c1e 100%);
    backdrop-filter: blur(80px);
}

.trade-action {
    appearance: none;
    border: 0;
    outline: 0;
    background: transparent;
    border-radius: 999px;
    padding: 6px 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    cursor: pointer;
    transition:
        transform .18s ease,
        background-color .18s ease,
        box-shadow .18s ease,
        opacity .18s ease;
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.01em;
    white-space: nowrap;
    user-select: none;
    min-height: 41px;
}

.trade-action:disabled {
    cursor: not-allowed;
    opacity: .5;
}

@media (hover: hover) {
    .trade-action-left:hover:not(:disabled) {
        background-color: color-mix(in srgb, var(--ta-left-color) 8%, transparent);
        transition-delay: 0s, .2s, 0s, 0s; /* transform, bg-color, box-shadow, opacity */
    }

    .trade-action-right:hover:not(:disabled) {
        background-color: color-mix(in srgb, var(--ta-right-color) 8%, transparent);
        transition-delay: 0s, .2s, 0s, 0s;
    }
}

.trade-action-left:active:not(:disabled) {
    background-color: color-mix(in srgb, var(--ta-left-color) 12%, transparent);
}

.trade-action-right:active:not(:disabled) {
    background-color: color-mix(in srgb, var(--ta-right-color) 12%, transparent);
}

.trade-action-left {
    color: var(--ta-left-color);
    justify-self: stretch;
    font-weight: var(--mud-typography-button-weight);
}

.trade-action-right {
    color: var(--ta-right-color);
    justify-self: stretch;
    font-weight: var(--mud-typography-button-weight);
}

.trade-action-icon {
    font-size: 1.55rem;
    line-height: 1;
}

.trade-action-divider {
    width: 0;
    height: 36px;
    background: linear-gradient(
        180deg,
        transparent 0%,
        var(--ta-divider) 18%,
        rgba(255,255,255,.28) 50%,
        var(--ta-divider) 82%,
        transparent 100%
    );
    margin: 0 2px;
}

/**************************************************************/