/* Базовые стили и сброс */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    background-color: #F8F9FA;
    display: flex;
    min-height: 100vh;
}

ul {
    list-style-type: none;
}

a {
    text-decoration: none;
    color: inherit;
}

button {
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
}

hr { /* Для .widget-divider */
    border: none;
    height: 1px;
    background-color: #E0E0E0;
}

/* Стили для сайдбара */
.sidebar {
    width: 260px;
    background-color: #FFFFFF;
    padding: 20px 0;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #E0E0E0;
    flex-shrink: 0;
    height: 100vh;
    position: sticky;
    top: 0;
}

.sidebar-top {
    padding: 0 20px 20px 20px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}

.logo .logo-svg {
    display: block;
}

.sidebar-nav {
    flex-grow: 1;
    overflow-y: auto;
}

.menu-link {
    display: flex;
    align-items: center;
    padding: 8px 20px; /* Уменьшил паддинг для меню-ссылок */
    font-size: 14px;
    font-weight: 500;
    color: #282828; /* Цвет текста как на оригинале */
    transition: background-color 0.2s ease, color 0.2s ease;
    border-left: 3px solid transparent;
    margin-left: -3px;
}

.menu-link:hover {
    background-color: #f0f4f8;
    color: #0D427A;
}

.menu-item.active .menu-link {
    background-color: #E9EFF6;
    color: #0D427A;
    font-weight: 700;
    border-left-color: #FB4D00;
}

.menu-icon {
    margin-right: 12px;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.menu-icon path {
    fill: #868e96; /* Базовый цвет иконок в меню */
    fill-opacity: 1; /* На оригинале fill-opacity: 0.5, но так они лучше видны */
}

.menu-link:hover .menu-icon path,
.menu-item.active .menu-link .menu-icon path {
    fill: #0D427A; /* Цвет иконок при наведении и для активного пункта */
}

.menu-badge {
    margin-left: auto;
    background-color: #FB4D00;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 12px;
    line-height: 1;
    min-width: 20px;
    text-align: center;
}

.sidebar-bottom {
    padding: 20px;
    border-top: 1px solid #E0E0E0;
    font-size: 12px;
    color: #535c67;
}

.language-label {
    display: block;
    margin-bottom: 8px;
}

.language-button {
    display: flex;
    align-items: center;
    padding: 6px 10px;
    border: 1px solid #DDE1E6;
    border-radius: 6px;
    width: 100%;
    text-align: left;
    background-color: #fff;
}

.language-button:hover {
    border-color: #BCC2CC;
}

.flag-icon {
    width: 16px;
    height: 16px;
    margin-right: 8px;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3 2"><path fill="%23fff" d="M0 0h3v2H0z"/><path fill="%23d52b1e" d="M0 1h3v1H0z"/><path fill="%230039a6" d="M0 0h3v1H0z" transform="translate(0 1) scale(1 -1)"/></svg>');
    background-size: cover;
}

.language-name {
    flex-grow: 1;
    color: #282828;
    font-weight: 500;
}

.language-arrow path {
    fill: #868e96;
}

/* Стили для основного контента */
.main-content {
    flex-grow: 1;
    padding: 24px;
    background-color: #F8F9FA;
    overflow-y: auto;
    position: relative; /* Для корректной работы position:sticky у дочерних элементов */
}

/* Стили для хедера (верхней панели с кнопками) */
.page-header {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
    width: 100%;
}

.header-button {
    background-color: #FFFFFF;
    border: 2px solid #0d427a; /* Рамка как на оригинале */
    border-radius: 12px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    min-height: 90px;
    flex-grow: 1;
    flex-basis: 0;
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    color: #282828;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.header-button:hover {
    border-color: #2865a6; /* Темнее синий при наведении */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
}

.header-button-icon-wrapper {
    background-color: #ececec; /* Фон для иконки как на оригинале */
    border-radius: 8px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

.header-button-icon-wrapper svg {
    width: 24px;
    height: 24px;
}
.header-button-icon-wrapper svg path {
    fill: #0D427A;
    fill-opacity: 1;
}

.header-button-text {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    color: #282828;
}

/* Стили для секции "Ваши кассы" */
.cash-desks-section {
    background-color: #FFFFFF;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.cash-desks-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.cash-desks-title {
    font-size: 24px; /* Как на оригинале */
    font-weight: 700; /* Как на оригинале */
    color: #282828;
}

.add-cash-desk-button {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background-color: transparent;
    border: 1px solid #0D427A;
    color: #0D427A;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.add-cash-desk-button svg path {
    fill: #0D427A;
    transition: fill 0.2s ease;
}

.add-cash-desk-button:hover {
    background-color: #0D427A;
    color: #FFFFFF;
}

.add-cash-desk-button:hover svg path {
    fill: #FFFFFF;
}

.current-cash-desk-info {
    /* margin-bottom: 20px; */ /* Убрал, так как под ним сразу поиск */
}

.cash-desk-name {
    display: block;
    font-size: 12px;
    color: #868e96;
    margin-bottom: 4px;
}

.cash-desk-balance {
    display: inline-block;
    font-size: 16px; /* Размер баланса как на оригинале */
    font-weight: 700;
    color: #282828;
    padding-bottom: 5px; /* Толщина и отступ линии */
    border-bottom: 2px solid #FB4D00;
}

/* Обертка для "липкого" хедера в режиме поиска */
.sticky-content-header {
    background-color: #F8F9FA; /* Фон основной области, чтобы не было просветов при "прилипании" */
    /* padding-bottom: 1px;  */ /* Может не понадобиться */
}

.sticky-content-header.is-sticky-search {
    position: sticky;
    top: -1px; /* Чтобы перекрыть верхний padding .main-content и не было скачка */
    z-index: 900;
    /* background-color: #F8F9FA; уже есть */
    /* Добавим тень, как на оригинале в режиме поиска */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    padding-top: 24px; /* Чтобы компенсировать padding .main-content */
    margin-top: -24px; /* Чтобы компенсировать padding .main-content */
    padding-bottom: 16px; /* Отступ под полем поиска */
}
.sticky-content-header.is-sticky-search .cash-desks-section {
    border-radius: 12px 12px 0 0; /* Убираем нижнее скругление у блока касс */
    box-shadow: none; /* Убираем тень у блока касс, т.к. общая тень на sticky-content-header */
    margin-bottom: 0; /* Убираем отступ, если он не нужен до поля поиска */
}
.sticky-content-header.is-sticky-search .search-bar-wrapper {
    padding: 3px 20px; /* Добавляем отступы по бокам для поля поиска в sticky режиме */
    margin-bottom: 0; /* Убираем нижний отступ у поля поиска в sticky режиме */
}


/* Поле поиска */
.search-bar-wrapper {
    position: relative;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.search-input {

    flex-grow: 1;
    width: 100%;
    padding: 12px 16px 12px 40px;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    font-size: 14px;
    color: #282828;
    background-color: #FFFFFF;
}

.search-input::placeholder {
    color: #868e96;
}

.search-input:focus {
    outline: none;
    border-color: #0D427A;
    box-shadow: 0 0 0 2px rgba(13, 66, 122, 0.2);
}

.search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #868e96;
    pointer-events: none;
}

.cancel-search-button {
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 500;
    color: #0D427A;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    white-space: nowrap; /* Чтобы текст "Отменить" не переносился */
}
.cancel-search-button:hover {
    background-color: #dde2e7;
}


.widgets-container {
    display: flex;
    gap: 20px;
}

/* Общие стили для виджетов */
.transaction-widget,
.tariff-widget {
    padding: 16px;
    border-radius: 12px;
    color: #282828;
    display: flex;
    flex-direction: column;
}

/* Виджет транзакций */
.transaction-widget {
    background-color: #F2F3F4;
    flex: 2;
}

.transaction-widget-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.transaction-widget h2,
.tariff-widget h2 {
    font-size: 16px;
    font-weight: 700;
}

.date-picker-button {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #0D427A;
}

.date-picker-button svg {
    width: 12px;
    height: 12px;
    stroke: #0D427A;
}

.widget-divider {
    margin-top: 0;
    margin-bottom: 16px;
}

.transaction-summary {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    font-size: 14px;
}

.summary-label {
    color: #535c67;
    margin-bottom: 2px;
}
.summary-item.align-right .summary-label,
.summary-item.align-right .summary-value {
    text-align: right;
}

.summary-value {
    font-weight: 700;
}

.summary-value.blue {
    color: #3798FF;
}

.summary-value.green {
    color: #46AD21;
}

.transaction-progress-bar-container {
    width: 100%;
    margin-bottom: 16px;
}

.transaction-progress-bar {
    display: flex;
    height: 10px;
    border-radius: 5px;
    overflow: hidden;
    background-color: #E0E0E0;
}
.progress-withdrawal {
    background-color: #46AD21;
    height: 100%;
}
.progress-deposit {
    background-color: #3798FF;
    height: 100%;
}

.transaction-stats {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
}

.stat-item {
    flex: 1;
    padding-right: 10px;
}
.stat-item:not(:first-child) {
     padding-left: 10px;
     border-left: 1px solid #E0E0E0;
}

.stat-item p {
    color: #535c67;
    margin-bottom: 2px;
}

.stat-item strong {
    font-weight: 700;
}

/* Виджет тарифа */
.tariff-widget {
    background-color: rgba(55, 152, 255, 0.1);
    flex: 1;
}

.tariff-widget h2 {
    margin-bottom: 16px;
}

.tariff-fee-items {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
    font-size: 14px;
}

.tariff-fee-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fee-description {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fee-description svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.tariff-fee-item strong {
    font-weight: 700;
    font-size: 16px;
}

.tariff-button {
    background-color: #FFFFFF;
    border: 1px solid #DDE1E6;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 14px;
    margin-top: auto;
}

.tariff-button > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tariff-button strong {
    font-weight: 500;
    color: #282828;
}

.tariff-button svg path {
    fill: #868e96;
    fill-opacity: 1;
}

/* Контент, который переключается */
.content-area {
    /* Сюда можно добавить padding-top, если sticky-header будет перекрывать контент.
       Но position:sticky обычно сам это обрабатывает. */
}

/* Стили для списка транзакций */
.transactions-list-section {
    margin-top: 24px; /* Отступ от виджетов */
}

.daily-transactions-group {
    margin-bottom: 20px;
}

.TransactionsList_transactionsHeader__ZzkFf {
    font-size: 14px;
    font-weight: 500;
    color: #282828;
    padding-bottom: 8px;
    margin-bottom: 12px;
    border-bottom: 1px solid #E0E0E0;
}

.TransactionsList_transactionsList__BAfng {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.CommonItem_item__Sa5wr {
    display: flex;
    align-items: center;
    gap: 16px;
}

.CommonItem_item__Sa5wr > svg {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
}

.CommonItem_item__desc__DZ_UK {
    flex-grow: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.CommonItem_item__desc_left__wzWko {
    display: flex;
    flex-direction: column;
    font-size: 16px;
    font-weight: 500;
    color: #282828;
    line-height: 1.3;
}

.CommonItem_item__corrected__dlEYl p {
    font-size: 14px;
    color: #868e96;
    line-height: 1.3;
    margin-top: 2px;
}

.CommonItem_item__desc_right__VvmNQ {
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.CommonItem_item__desc_right__VvmNQ > strong {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}
.DepositItem_title__NACwQ {
    color: #282828;
}
.CommonItem_item__desc_right__VvmNQ > strong:not(.DepositItem_title__NACwQ) {
    color: #282828; /* На оригинале вывод тоже черный, но с плюсом */
}
/* Добавим зеленый цвет для суммы вывода, если есть класс от вывода */
.CommonItem_item__desc_right__VvmNQ > strong.CashOutItem_amount { /* Пример класса для суммы вывода, если он есть */
    color: #46AD21;
}


.DepositItem_estimated__s6eQ9,
.CashOutItem_estimated___BRQ_ {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    line-height: 1.3;
    color: #46AD21;
    margin-top: 2px;
}

.DepositItem_plus_icon__obKCq,
.CashOutItem_plus_icon__tyRyi {
    width: 12px;
    height: 12px;
}

/* Стили для сообщения "Введите поисковой запрос" */
.SearchMessage_root__kDCjh {
    display: flex;
    gap: 16px;
    padding: 16px;
    align-items: center;
    border-radius: 12px;
    background-color: rgba(55, 152, 255, .1);
    margin-bottom: 24px;
}

.SearchMessage_icon__to7HH svg {
    width: 56px;
    height: 56px;
}

.SearchMessage_content__buz00 {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.SearchMessage_title___12wJ {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: #282828;
}

.SearchMessage_description__Zsobo {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #535c67;
}

.search-results-list {
    /* Стили для отображения результатов поиска */
}


/* Стили для модального окна */
.modal-hidden, .page-section-hidden { /* Объединил для скрытия */
    display: none !important;
}

.modal-overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.modal-content {
    position: relative;
    background: rgb(255, 255, 255);
    border-radius: 24px;
    padding: 40px 32px 32px;
    min-width: 400px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

.modal-close-button {
    position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
}
.modal-close-button svg path {
    fill: #868e96;
    transition: fill 0.2s ease;
}
.modal-close-button:hover svg path {
    fill: #282828;
}

.modal-title {
    font-size: 20px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 4px;
    line-height: 1.4;
}

.modal-subtitle {
    font-size: 14px;
    color: #868e96;
    margin-bottom: 24px;
    line-height: 1.4;
}

.modal-tariff-table {
    font-size: 14px;
}

.modal-tariff-header,
.modal-tariff-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding: 8px 0;
}

.modal-tariff-header {
    color: #535c67;
    font-weight: 500;
    border-bottom: 1px solid #E9ECEF;
    margin-bottom: 4px;
}
.modal-tariff-header span:last-child,
.modal-tariff-row span:last-child {
    text-align: right;
}

.modal-tariff-row {
    background-color: #F8F9FA;
    border-radius: 8px;
    padding: 10px 12px;
    font-weight: 500;
}
.modal-tariff-row span {
    color: #282828;
}


/* ... (все предыдущие стили CSS) ... */

/* .page-section-hidden - уже определен выше */

/* Стили для страницы "Мои кассы" (CashpointsPage) - на основе вашего HTML */
.CashpointsPage_root__KuEMQ {
    /* общие стили для контейнера страницы, если нужны */
}
.CashpointsPage_title__tFEjY {
    font-size: 28px; /* Размер как на "Ваши кассы" */
    font-weight: 700;
    color: #282828;
    margin-bottom: 24px;
}
.add-new-cashpoint-btn-page { /* Добавил уникальный класс, чтобы не конфликтовал с кнопкой на главной */
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 1px solid #0D427A;
    color: #0D427A;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 24px;
    background-color: #FFFFFF; /* Фон для кнопки "Добавить новую кассу" */
}
.add-new-cashpoint-btn-page:hover {
    background-color: #f0f4f8;
}
.add-new-cashpoint-btn-page .Button_icon__V2EYJ svg path {
    fill: #0D427A;
}

.CashpointsList_list__F1MOF {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.CashpointsListItem_item__xwp1D {
    background-color: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    padding: 20px;
}
.CashpointsListItem_itemTop__ZniTG {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; /* Чтобы кнопки не растягивались по высоте */
    margin-bottom: 12px;
}
.CashpointsListItem_itemTopContent__dVI9v {
    display: flex;
    justify-content: space-between;
    width: 100%; /* Растянуть, чтобы кнопки были справа */
}
.CashpointsListItem_itemTopDesc__agwQD {
    font-size: 12px;
    color: #868e96;
    margin-bottom: 2px;
}
.CashpointsListItem_itemBalance__lLlCP {
    font-size: 20px; /* Крупнее, чем на главной */
    font-weight: 700;
    color: #282828;
}
.CashpointsListItem_buttons__QFMnb {
    display: flex;
    gap: 8px;
    position: relative; /* Для позиционирования поповера */
}
.CashpointsListItem_btn__dSEyl,
.EllipsisWithPopover_ellipsis__tyfxm {
    padding: 8px 12px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
}
.CashpointsListItem_btn__dSEyl { /* Кнопка "Пополнить" */
    background-color: #0D427A;
    color: #FFFFFF;
}
.CashpointsListItem_btn__dSEyl .Button_icon__V2EYJ svg path {
    fill: #FFFFFF;
}
.EllipsisWithPopover_ellipsis__tyfxm { /* Кнопка троеточия */
    background-color: #F0F2F5; /* Светло-серый фон */
    padding: 8px; /* Чтобы была квадратной */
}
.EllipsisWithPopover_ellipsis__tyfxm svg path {
    fill: #0D427A;
}

/* Поповер для действий с кассой */
.popover {
    position: absolute;
    top: 100%; /* Появляется под кнопкой */
    right: 0;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    z-index: 1010; /* Выше остального контента */
    padding: 8px 0; /* Отступы внутри поповера */
    min-width: 220px; /* Минимальная ширина */
}
.EllipsisWithPopover_content__dSRt4 button {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 10px 16px;
    text-align: left;
    font-size: 14px;
    color: #282828;
}
.EllipsisWithPopover_content__dSRt4 button:hover {
    background-color: #f0f4f8;
}
.EllipsisWithPopover_content__dSRt4 button svg {
    margin-right: 10px;
    width: 20px;
    height: 20px;
}
.EllipsisWithPopover_content__dSRt4 button svg path {
    /* fill или stroke в зависимости от SVG иконок */
}


.Badge_root__vpHqb {
    font-size: 12px;
    padding: 4px 8px;
    border-radius: 16px;
    font-weight: 500;
    margin-bottom: 16px; /* Отступ до информера */
    display: inline-block;
}
.Badge_blue__4pgym {
    background-color: rgba(55, 152, 255, 0.1);
    color: #3798FF;
}
.AddressUnfilledInformer_informer__tp3WP {
    background-color: rgba(251, 77, 0, 0.05); /* Оранжеватый фон */
    border-radius: 12px;
    padding: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.AddressUnfilledInformer_informerInfo__Wx_ed {
    display: flex;
    align-items: center;
    gap: 12px;
}
.AddressUnfilledInformer_informerIcon__3RZsP svg {
    width: 40px; /* Уменьшил иконку, чтобы соответствовала высоте текста */
    height: 40px;
}
.AddressUnfilledInformer_informerInfo__Wx_ed h3 {
    font-size: 16px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 2px;
}
.AddressUnfilledInformer_informerInfoDesc__0NK3Y {
    font-size: 14px;
    color: #535c67;
}
.AddressUnfilledInformer_btn__Q8z9R {
    padding: 10px 16px;
    border-radius: 8px;
    background-color: #0D427A;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
}

/* Стили для модального окна добавления адреса */
/* Общие стили для модалок уже есть (.modal-overlay, .modal-content, .modal-close-button) */
.AddressForm_root__TuEZg h3 {
    font-size: 18px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 20px;
}
.AddressFormFields_formFields__mlUbD {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}
/* Стили для инпутов и селектов внутри модалки адреса нужно будет добавить,
   они довольно специфичны (Control_label__nksmf, Input_input__5WxBl и т.д.)
   Пока что они будут выглядеть как стандартные элементы. */
.Input_label__q7b80 {
    display: block;
    font-size: 12px;
    color: #535c67;
    margin-bottom: 4px;
}
.Input_input__5WxBl {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #DDE1E6;
    border-radius: 6px;
    font-size: 14px;
    color: #282828; /* Цвет текста в инпуте */
}
.Input_input__5WxBl:focus { /* Стандартный фокус для инпутов */
    outline: none;
    border-color: #0D427A;
    box-shadow: 0 0 0 2px rgba(13, 66, 122, 0.2);
}
.AddressForm_formActions__uqWo2 {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
}
.AddressForm_formActions__uqWo2 .Button_link__bm5JO {
    color: #0D427A;
}
.AddressForm_formActions__uqWo2 .Button_dark__mg9Ut {
    background-color: #0D427A;
    color: #FFFFFF;
    padding: 10px 16px;
    border-radius: 8px;
}


/* Стили для страницы "Запросы на вывод" */
.WithdrawalRequests_root__pVOnQ h1,
.ReplenishmentCashpointPage_root__bYs_E h1,
.ReplenishmentAccount_root__c9E8e h1 { /* Общий стиль для заголовков страниц */
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 24px;
}

/* ИСПРАВЛЕНИЕ: Позиционирование иконки поиска в "Пополнение счета" -> "Обработанные" */
.Search_search__x5KoN { /* Это класс для .Input_root__ONHox Search_search__x5KoN */
    position: relative; /* Важно для позиционирования дочерней иконки */
}
.RequestsSearch_root__yUhCn .Search_search__x5KoN .Input_label__q7b80 {
    /* Для "Поиск запроса" - он внутри инпута как placeholder */
    display: none;
}
.RequestsSearch_root__yUhCn .Search_input__cnkKM::placeholder {
    color: #868e96;
}
.RequestsSearch_root__yUhCn .Search_search__x5KoN .Input_leftIcon__BIziH {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #868e96;
    pointer-events: none; /* Иконка не должна перехватывать клики */
    z-index: 1; /* На случай, если фон инпута перекрывает */
}
.RequestsSearch_root__yUhCn .Search_search__x5KoN .Input_input__5WxBl {
     padding-left: 40px; /* Отступ для иконки */
}

/* Стили для страницы "Пополнение счета" (ReplenishmentAccount) */
.ApplicationForm_root__rfImR {
    background-color: #FFFFFF;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    margin-bottom: 24px;
}
.ApplicationForm_fieldsWrapper__U4HnH {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Примерно пополам, можно настроить */
    gap: 20px 24px; /* row-gap column-gap */
    margin-bottom: 24px;
}
.ApplicationForm_field__rldT9 {
    /* Стили для обертки поля */
}
.Input_rightIcon__uDkO_ {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #535c67;
    font-size: 14px;
}
.Input_inputWrapper__rxAYa {
    position: relative; /* Для позиционирования правого значка RUB */
}
.ApplicationForm_descriptionField__afiEX {
    font-size: 12px;
    color: #868e96;
    margin-top: 4px;
    display: block;
}
.ApplicationForm_button__pFpBa {
    background-color: #0D427A;
    color: white;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    width: 100%; /* Кнопка на всю ширину формы */
}
.Tabs_root__ycvDy {
    display: flex;
    border-bottom: 1px solid #E0E0E0;
    margin-bottom: 24px;
}
.Tabs_tab__eFKA7 {
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 500;
    color: #535c67;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px; /* Чтобы рамка таба перекрывала рамку контейнера */
}
.Tabs_tab__eFKA7.Tabs_active__UxTcA {
    color: #0D427A;
    border-bottom-color: #0D427A;
}
.Requests_wrapper__yYrzV .SearchMessage_root__kDCjh {
    /* Сообщение "Здесь пока пусто" */
}

/* --- Стили для страницы "Пополнить кассу" (ReplenishmentCashpoint) --- */
.ReplenishmentCashpointPage_root__bYs_E {
    /* Общий контейнер страницы */
}

.ReplenishmentCashpointPage_title__GnvJF { /* Используется старый класс, можно поправить если нужно */
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 24px;
}

.ReplenishmentCashpointPage_content__NXiF_ {
    display: flex;
    gap: 24px; /* Расстояние между левым блоком методов и правой формой */
}

@media (max-width: 991px) { /* Адаптивность: на меньших экранах блоки друг под другом */
    .ReplenishmentCashpointPage_content__NXiF_ {
        flex-direction: column;
    }
    .ReplenishmentCashpointPage_methods__Uw2_7 {
        flex: 1 1 auto; /* Позволяем блоку методов занимать доступную ширину */
    }
}

.ReplenishmentCashpointPage_methods__Uw2_7 {
    flex: 0 0 260px; /* Фиксированная ширина для левого блока */
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ReplenishmentCashpointPage_select__2UHWF .Control_label__nksmf {
    font-size: 12px;
    color: #535c67;
    margin-bottom: 4px;
}

.CashpointSelect_singleValue__2ANqj { /* Стиль для отображения выбранной кассы */
    font-size: 14px;
    color: #282828;
}
.CashpointSelect_uuid__rMlhA {
    color: #868e96; /* Серый цвет для ID кассы */
}


.MethodsList_root__C7_6d {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.Method_root__10lgg {
    width: 70px; /* Ширина кнопки метода */
    height: 48px; /* Высота кнопки метода */
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    padding: 6px;
    position: relative;
    overflow: hidden;
    background-color: #FFFFFF;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    cursor: pointer;
}
.Method_root__10lgg:hover {
    border-color: #BCC2CC;
}
.Method_root__10lgg.Method_selected__Y6M_0 {
    border-color: #0D427A;
    box-shadow: 0 0 0 2px #0D427A; /* Выделение активного метода */
}
.Method_logo__Wg_56 { /* Логотип внутри кнопки метода */
    width: 100%;
    height: 100%;
    object-fit: contain; /* Чтобы логотип красиво вписывался */
}

.MethodForm_root__x72J1 {
    flex-grow: 1; /* Правая форма занимает оставшееся место */
    background-color: #FFFFFF;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

/* ИСПРАВЛЕНИЕ: отступ между "Выбранный метод оплаты" и "USDT" */
.Header_methodWrapper__snN9m {
    display: flex;
    align-items: baseline; /* Выравнивание по базовой линии текста */
    gap: 6px; /* Отступ между элементами span */
}
.Header_root__AivdX { /* Заголовок формы с выбранным методом */
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.Header_title___BB_o { /* "Выбранный метод оплаты" */
    font-size: 12px;
    color: #868e96;
    margin-bottom: 2px; /* Уже есть, но gap в .Header_methodWrapper__snN9m важнее для горизонтального отступа */
}
.Header_methodName__Dg67b { /* "USDT" */
    font-size: 16px;
    font-weight: 700;
    color: #282828;
}
.Header_logoWrapper__pNzNs { /* Обертка лого в заголовке формы */
    width: 32px;
    height: 32px;
    position: relative;
}
.Header_logo__ODgUr {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.MethodForm_formWrapper__hbbie {
    display: flex;
    flex-direction: column;
    gap: 20px; /* Расстояние между группами полей в форме */
}
.MethodForm_border__kHpAj { /* Разделитель hr */
    margin: 0; /* Убираем стандартные отступы hr */
}

.Attention_root__aSwmv { /* Блок "Минимальная сумма" */
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    padding: 12px 0; /* Отступы для этого блока */
}
.Attention_labelWrapper__xVcbt {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #282828;
}
.Attention_icon__1CA6m svg {
    width: 16px;
    height: 16px;
}
.Attention_value__IuRFp {
    font-weight: 500;
    color: #FB4D00; /* Оранжевый для значения мин. суммы */
}

.StepForm_root__B9lZK { /* Обертка для шага формы (например, выбор кошелька) */
    margin-bottom: 16px; /* Отступ под шагом */
}
.StepForm_header__ouAbu {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}
.StepForm_stepNumber__mcxH6 {
    background-color: #282828;
    color: white;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
}
.StepForm_title__ER5Xx {
    font-size: 14px;
    font-weight: 500;
    color: #282828;
}

/* Стили для RadioButton (TRC20/ERC20) */
.RadioButton_radioButtonWrapper__0jiz9 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px; /* Отступ между радио-кнопками */
    cursor: pointer;
    font-size: 14px;
    color: #282828;
}
.RadioButton_radio__c4WVG { /* Сам кружок радио-кнопки */
    width: 18px; /* Немного увеличил для лучшей кликабельности */
    height: 18px;
    border-radius: 50%;
    border: 2px solid #BCC2CC; /* Более заметная рамка */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.2s ease;
}
.RadioButton_input__ibdax:checked + .RadioButton_radioButtonWrapper__0jiz9 .RadioButton_radio__c4WVG {
    border-color: #0D427A; /* Синяя рамка для выбранного */
}
.RadioButton_input__ibdax:checked + .RadioButton_radioButtonWrapper__0jiz9 .RadioButton_radio__c4WVG::after {
    content: '';
    display: block;
    width: 10px; /* Внутренний кружок */
    height: 10px;
    background-color: #0D427A; /* Синий */
    border-radius: 50%;
}
.RadioButton_input__ibdax { /* Скрываем стандартный input radio */
    display: none;
}

/* Стили для инпута суммы */
.Input_wrapper__Fx_33 .Input_label__q7b80 {
    font-size: 12px;
    color: #535c67;
    margin-bottom: 4px;
}

.Input_description__jDqjO { /* "мин: 30 USDT" */
    font-size: 12px;
    color: #868e96;
    margin-top: 4px;
}

.MethodForm_button__1qMm8 { /* Кнопка "Продолжить" */
    background-color: #0D427A;
    color: white;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    width: 100%; /* Кнопка на всю ширину */
    margin-top: 16px; /* Отступ сверху */
    transition: background-color 0.2s ease;
}
.MethodForm_button__1qMm8:hover {
    background-color: #0a335e; /* Темнее при наведении */
}

/* Базовая стилизация для react-select, если он используется */
.Select_root__RTO2E .Control_label__nksmf { /* Это для всех <p> над селектами */
    font-size: 12px;
    color: #535c67;
    margin-bottom: 4px;
}
.Select_control__BW2jN { /* Обертка селекта - react-select */
    background-color: white !important;
    border: 1px solid #DDE1E6 !important;
    border-radius: 6px !important;
    min-height: 44px !important; /* Высота селекта */
    box-shadow: none !important;
    padding: 0 4px; /* Небольшие внутренние отступы */
}
.Select_control__BW2jN:hover {
    border-color: #BCC2CC !important;
}
.css-w54w9q-singleValue, /* Выбранное значение в react-select */
.Select_placeholder__lVChe { /* Плейсхолдер в react-select */
    color: #282828 !important;
    font-size: 14px;
    margin-left: 8px !important; /* Отступ для текста внутри (был 6px) */
}
.Select_input__H_HHP input { /* Сам инпут внутри react-select */
    font-family: 'Roboto', sans-serif !important;
    margin-left: 8px !important; /* Отступ для курсора ввода */
}
.css-g56vrd-indicatorContainer svg { /* Стрелка вниз в react-select */
    color: #868e96 !important;
}

/* --- Стили для страницы "Запросы на вывод" --- */
.WithdrawalRequests_root__pVOnQ {
    /* Общий контейнер страницы */
}

.WithdrawalRequests_withdrawalRequestsTitle__7oM5B {
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 24px;
}

.RequestsSearch_root__yUhCn {
    /* Контейнер для поиска и результатов/сообщения */
}

/* Стили для инпута поиска на этой странице */
.Search_root__AjY2p { /* Обертка для Search_search__x5KoN */
    margin-bottom: 24px; /* Отступ под полем поиска */
}

.Search_search__x5KoN .Input_label__q7b80 {
    /* На оригинале лейбл "Поиск запроса" скрыт, т.к. есть плейсхолдер */
    display: none;
}

.Search_search__x5KoN .Input_input__5WxBl.Input_withLeftIcon__1V2Oi {
    padding-left: 40px; /* Отступ для иконки */
    background-color: #FFFFFF; /* Белый фон для инпута */
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    height: 44px; /* Высота инпута */
}
.Search_search__x5KoN .Input_input__5WxBl::placeholder {
    color: #868e96;
}

.Search_search__x5KoN .Input_leftIcon__BIziH {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none; /* Чтобы иконка не мешала */
}
.Search_search__x5KoN .Input_leftIcon__BIziH svg path {
    fill: #868e96; /* Цвет иконки поиска */
}

.Loader_root__4aA_j.RequestsSearch_loader__5NjWj {
    /* Этот блок может содержать лоадер или сообщение.
       Если он только для сообщения, его стили могут быть не нужны,
       т.к. стилизуется вложенный .SearchMessage_root__kDCjh */
}

.RequestsSearch_loader__5NjWj .SearchMessage_root__kDCjh {
    /* margin-top: 0; если не нужен отступ сверху */
}

/* --- Стили для страницы "Пополнение счета" --- */
.ReplenishmentAccount_root__c9E8e {
    /* Общий контейнер страницы */
}

.ReplenishmentAccount_title__1VgjX {
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 24px;
}

/* Стили для вкладок */
.Tabs_root__ycvDy {
    display: flex;
    border-bottom: 1px solid #E0E0E0;
    margin-bottom: 24px;
}

.Tabs_tab__eFKA7 {
    padding: 12px 16px; /* Можно увеличить для лучшей кликабельности */
    font-size: 14px;
    font-weight: 500;
    color: #535c67;
    border-bottom: 3px solid transparent; /* Толщина неактивной полоски (прозрачная) */
    margin-bottom: -1px; /* Чтобы активная полоска перекрывала общую рамку */
    transition: color 0.2s ease, border-color 0.2s ease;
}
.Tabs_tab__eFKA7:hover {
    color: #0D427A;
}
.Tabs_tab__eFKA7.Tabs_active__UxTcA {
    color: #0D427A;
    font-weight: 700; /* Делаем активную вкладку жирнее */
    border-bottom-color: #FB4D00; /* Оранжевая полоска для активной вкладки */
}

.Requests_wrapper__yYrzV {
    /* Контейнер для содержимого вкладок */
}

.tab-content { /* Общий класс для содержимого вкладок */
    /* По умолчанию все, кроме активного, скрыты через .page-section-hidden */
}
.tab-content.active { /* Для показа активной вкладки (если не используется page-section-hidden) */
    display: block;
}


/* Стили для вкладки "Обработанные" (если там есть список) */
.Requests_searchSortWrapper__Dh1g2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}
.Requests_searchWrapper__CPAs1 {
    flex-grow: 1;
    margin-right: 16px; /* Отступ от селекта сортировки */
    max-width: 400px; /* Ограничение ширины поля поиска */
}
.Requests_searchWrapper__CPAs1 .Input_input__5WxBl { /* Инпут поиска внутри вкладки "Обработанные" */
    height: 40px; /* Чуть ниже основного */
}

.SmallSelect_root__KOgeK { /* Обертка для селекта "Сначала новые" */
    min-width: 180px; /* Чтобы текст помещался */
}
.SmallSelect_control__BRiKF { /* Сам селект */
    background-color: white !important;
    border-color: #DDE1E6 !important;
    border-radius: 6px !important;
    min-height: 40px !important; /* Высота как у инпута */
    box-shadow: none !important;
    font-size: 14px;
}
.SmallSelect_control__BRiKF:hover {
    border-color: #BCC2CC !important;
}
.SmallSelect_valueContainer__oBfIA .css-w54w9q-singleValue { /* Текст внутри селекта */
    color: #282828 !important;
     margin-left: 8px !important;
}


.RequestsList_root__jX0YJ {
    /* Контейнер для списка обработанных заявок */
}
.FinishedItem_root__VsgIi { /* Карточка обработанной заявки */
    background-color: #FFFFFF;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.FinishedItem_titleWrapper__UITR9 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 16px;
    font-weight: 700;
    color: #282828;
}
.Badge_root__vpHqb.Badge_green__vLZMr { /* "Выполнена" */
    background-color: rgba(70, 173, 33, 0.1);
    color: #46AD21;
    font-size: 12px;
    padding: 4px 8px;
    border-radius: 16px;
    font-weight: 500;
}
.FinishedItem_infoItems__Me9O3 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); /* Адаптивные колонки */
    gap: 8px 16px; /* row-gap column-gap */
    font-size: 12px;
}
.FinishedItem_itemTitle__5ZG1P { /* "Создана", "Бренд" и т.д. */
    color: #868e96;
    display: block;
    margin-bottom: 2px;
}
.FinishedItem_itemSubTitle__H5iiA { /* Значения полей */
    color: #282828;
    font-weight: 500;
}

/* --- Стили для страницы "Выгрузка отчета" --- */
.ReportDownloadForm_root__dUxtS {
    max-width: 520px; /* Ограничиваем ширину формы, как на скриншоте */
    margin: 0 auto; /* Центрируем форму, если она не на всю ширину */
    background-color: #FFFFFF;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.ReportDownloadForm_title__Ro1d7 {
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 24px;
    text-align: center; /* Заголовок по центру */
}

.report-download-form-actual { /* Используем этот класс для формы */
    display: flex;
    flex-direction: column;
    gap: 16px; /* Отступ между полями */
}

.ReportDownloadForm_field__o7hh8 {
    /* Контейнер для каждого поля формы */
}

/* Стили для селекта языка с флагом */
.LanguageSelect_singleValue__Ilp2m {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #282828;
}
.LanguageSelect_singleValue__Ilp2m .FlagIcon_root__3mmsr {
    width: 16px;
    height: 12px; /* Флаги обычно не квадратные */
    border: 1px solid #eee; /* Тонкая рамка для флага */
    flex-shrink: 0;
}

/* Стили для селекта Кассы */
.CashpointSelect_singleValue__PAI_5 {
    font-size: 14px;
    color: #282828;
}
.CashpointSelect_uuid__ckV8K {
    color: #868e96;
}

/* Стили для поля Email */
.Input_label__q7b80.Input_moveLabel__cyyIw {
    /* Этот класс используется, когда лейбл "плавает" над инпутом.
       Для простоты сейчас оставляем как есть (над инпутом). */
}

/* Стили для блока "Период" */
.PeriodField_root__6iSLZ {
    margin-top: 8px; /* Небольшой отступ сверху */
}
.PeriodField_header__w5quz {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}
.PeriodField_title__jSYZp {
    font-size: 16px;
    font-weight: 700;
    color: #282828;
}
.PeriodField_periods__h2gxJ {
    display: flex;
    gap: 4px;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    padding: 2px; /* Небольшой внутренний отступ */
}
.DottedButton_button__Hc4KS {
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    color: #535c67;
    border-radius: 6px;
    background-color: transparent;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.DottedButton_button__Hc4KS:hover {
    background-color: #f0f4f8;
}
.DottedButton_button__Hc4KS.DottedButton_selected__f3dCw {
    background-color: #E9EFF6; /* Фон для выбранной кнопки периода */
    color: #0D427A;
    font-weight: 700;
}

/* Стили для инпутов выбора даты */
.RangeInputs_root__sNVUX {
    display: flex;
    gap: 16px; /* Расстояние между инпутами "С" и "По" */
}
.RangeInputs_input__EiRhn { /* Обертка для каждого инпута даты */
    flex: 1; /* Чтобы занимали равное пространство */
}
.RangeInputs_input__EiRhn .Input_input__5WxBl {
    background-color: #F8F9FA; /* Светло-серый фон для инпутов даты */
    cursor: pointer; /* Указывает на то, что это поле открывает календарь */
}
.RangeInputs_input__EiRhn .Input_rightIcon__uDkO_ svg path {
    fill: #868e96; /* Цвет иконки календаря */
}

.ReportDownloadForm_button__MXBl_ { /* Кнопка "Получить отчет" */
    background-color: #0D427A;
    color: white;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    width: 100%;
    margin-top: 16px; /* Отступ сверху от полей даты */
    transition: background-color 0.2s ease;
}
.ReportDownloadForm_button__MXBl_:hover {
    background-color: #0a335e;
}
/* --- Стили для страницы "Обращения" --- */
.AppealsPage_root__bO7G1 {
    /* Общий контейнер страницы */
}

.AppealsPage_root__bO7G1 h1 { /* Заголовок "Обращения" */
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 8px; /* Меньший отступ до кнопки даты */
}

.AppealsPage_headerDate__XY_eO { /* Кнопка выбора диапазона дат */
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #0D427A;
    margin-bottom: 24px; /* Отступ до списка */
    padding: 4px 0; /* Небольшие отступы для кликабельности */
    background: none;
    border: none;
    cursor: pointer;
}
.AppealsPage_headerDate__XY_eO svg {
    width: 12px;
    height: 12px;
    stroke: #0D427A;
}

.AppealsList_container__Qz5Th {
    /* Контейнер для всех групп обращений */
}

.appeals-daily-group { /* Обертка для обращений за одну дату */
    margin-bottom: 20px; /* Отступ между группами дат */
}

.AppealsList_appealsHeader__rvxLS { /* Заголовок даты (напр. "16 апрель") */
    font-size: 14px;
    font-weight: 500;
    color: #535c67; /* Серый цвет */
    padding-bottom: 8px;
    margin-bottom: 12px;
    border-bottom: 1px solid #E0E0E0;
}

.AppealsList_appealsList__JJedU {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1px; /* Очень маленький отступ, т.к. фон и рамки у li */
}

.AppealsList_item__sP1yF { /* Элемент списка обращений */
    background-color: #FFFFFF;
    border: 1px solid #E9ECEF; /* Светлая рамка */
    border-radius: 8px;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
    cursor: pointer;
}
.AppealsList_item__sP1yF:hover {
    border-color: #DDE1E6;
    box-shadow: 0 2px 6px rgba(0,0,0,0.07);
}

.CommonAppealItem_infoRoot__TXYmL { /* Внутренний контейнер элемента */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px; /* Внутренние отступы */
}

.CommonAppealItem_info__DuzgS { /* Левая часть: иконка и текст */
    display: flex;
    align-items: center;
    gap: 12px;
}

.ActiveAppealItem_icon___OGuW { /* Обертка для иконки */
    width: 40px; /* Размер обертки */
    height: 40px;
    border-radius: 8px; /* Скругление обертки */
    background-color: #3798FF; /* Синий фон для иконки */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.ActiveAppealItem_icon___OGuW svg {
    width: 24px;
    height: 24px;
}
.ActiveAppealItem_icon___OGuW svg path {
    fill: #FFFFFF; /* Белый цвет для самой иконки */
}

.appeal-text-content h4 { /* "Обращение № 1147" */
    font-size: 16px;
    font-weight: 500;
    color: #282828;
    margin-bottom: 2px;
}
.appeal-text-content p { /* "16.04" (или время) */
    font-size: 12px;
    color: #868e96;
}

.CommonAppealItem_date__7d6P6 { /* Дата справа */
    font-size: 14px;
    color: #535c67;
}

/* --- Стили для страницы "Бонусы" (Раздел в разработке) --- */
.Bonuses_content__edTi5 { /* Ваш класс для специфичного контента страницы бонусов */
    display: flex;
    align-items: center; /* Центрирование по вертикали */
    justify-content: center; /* Центрирование по горизонтали */
    text-align: center;
    min-height: calc(100vh - 48px - 50px); /* Примерная высота: высота экрана минус паддинги main-content и возможный футер */
    padding: 20px;
}

.ErrorLayout_root__L6KXi { /* Общий контейнер для страницы-заглушки */
    width: 100%;
    display: flex; /* Для центрирования .ErrorLayout_contentWrapper__rhovq */
    justify-content: center;
    align-items: center;
}

.ErrorLayout_contentWrapper__rhovq {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px; /* Отступы между элементами */
    max-width: 500px; /* Ограничение ширины контента */
}

.DevelopmentScreen_img__ddDlp {
    max-width: 200px; /* Ограничиваем размер изображения, чтобы не было слишком большим */
    height: auto;
    margin-bottom: 16px; /* Отступ под картинкой */
}

.ErrorLayout_title__DEYMQ {
    font-size: 28px; /* Крупный заголовок */
    font-weight: 700;
    color: #282828;
    margin-bottom: 4px;
}

.ErrorLayout_desc__q2t98 {
    font-size: 16px;
    color: #535c67; /* Серый цвет для подзаголовка */
    margin-bottom: 24px;
}

/* Стили для кнопки "Вернуться на главную" - используем существующие классы Button_* */
.ErrorLayout_contentWrapper__rhovq .Button_button__5Fngg {
    padding: 12px 24px; /* Делаем кнопку чуть побольше */
    font-size: 14px;
    font-weight: 500;
}
.ErrorLayout_contentWrapper__rhovq .Button_dark__mg9Ut {
    background-color: #0D427A;
    color: #FFFFFF;
    border-radius: 8px;
    transition: background-color 0.2s ease;
}
.ErrorLayout_contentWrapper__rhovq .Button_dark__mg9Ut:hover {
    background-color: #0a335e;
}

/* --- Стили для страницы "Профиль" --- */
.ProfilePage_root__eothE {
    max-width: 680px; /* Ограничиваем ширину контента, как на скриншоте */
    /* margin: 0 auto; */ /* Если нужно центрировать на очень широких экранах */
}

.ProfilePage_root__eothE h1 {
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 4px; /* Меньший отступ до имени */
}

.profile-name-display { /* Имя пользователя под заголовком */
    display: block;
    font-size: 14px;
    color: #535c67;
    margin-bottom: 24px; /* Отступ до формы */
}

.ProfileForm_root__dKika {
    display: flex;
    flex-direction: column;
    gap: 8px; /* Небольшой отступ между "строками" формы */
    margin-bottom: 32px; /* Отступ до кнопки "Выйти" */
}

.ProfileFormWrapper_form__MhWbU { /* Обертка для каждой строки (Email, Телефон, ID) */
    /* Не требует особых стилей, если используется только для группировки */
}

.ProfileFormWrapper_formInner__PZs3Y {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0; /* Вертикальные отступы для строки */
    border-bottom: 1px solid #E9ECEF; /* Разделитель между строками */
}
.ProfileForm_root__dKika .ProfileFormWrapper_form__MhWbU:first-child .ProfileFormWrapper_formInner__PZs3Y {
    border-top: 1px solid #E9ECEF; /* Верхняя рамка для первого элемента */
}


.ProfileFormWrapper_formFields__Ky2eZ {
    display: flex;
    flex-direction: column; /* Лейбл сверху, значение снизу */
    gap: 2px;
}

.ProfileFormWrapper_formFields__Ky2eZ > span:first-child { /* "Email", "Телефон", "ID франчайзи" */
    font-size: 12px;
    color: #868e96;
}

.ProfileFormWrapper_formFields__Ky2eZ > div,
.ProfileFormWrapper_formFields__Ky2eZ > div > span { /* Значение поля */
    font-size: 16px;
    color: #282828;
    font-weight: 500;
}

/* Стили для кнопок "Изменить", "Копировать" - используем существующие Button_* */
.ProfileFormWrapper_formInner__PZs3Y .Button_button__5Fngg {
    padding: 8px 16px; /* Стандартный размер для таких кнопок */
    font-size: 14px;
    font-weight: 500;
    border-radius: 8px;
}
.ProfileFormWrapper_formInner__PZs3Y .Button_light__Ny_Cg { /* "Изменить", "Копировать" */
    border: 1px solid #0D427A;
    color: #0D427A;
    background-color: #FFFFFF;
}
.ProfileFormWrapper_formInner__PZs3Y .Button_light__Ny_Cg:hover {
    background-color: #f0f4f8;
}

/* Кнопка "Выйти из профиля" */
.ProfilePage_btn__kQSQo {
    display: inline-flex; /* Чтобы иконка и текст были в строку и кнопка не растягивалась */
    align-items: center;
    gap: 8px;
    color: #C83333; /* Красный цвет */
    font-size: 14px;
    font-weight: 500;
    padding: 8px 0; /* Убираем горизонтальные паддинги, если они не нужны */
}
.ProfilePage_btn__kQSQo .Button_icon__V2EYJ svg path {
    fill: #C83333; /* Красный цвет для иконки */
}
.ProfilePage_btn__kQSQo:hover {
    /* Можно добавить эффект при наведении, например, text-decoration: underline; */
    text-decoration: underline;
}

@media (max-width: 600px) { /* Точка перелома, где кнопки начнут адаптироваться */
    .ProfileFormWrapper_formInner__PZs3Y {
        flex-direction: column; /* Ставим элементы в столбик */
        align-items: flex-start; /* Выравниваем по левому краю */
        gap: 12px; /* Отступ между блоком текста и кнопкой */
    }

    .ProfileFormWrapper_formInner__PZs3Y .Button_button__5Fngg {
        width: auto; /* Позволяем кнопке занять ширину по содержимому + padding */
        align-self: flex-start; /* Кнопка также по левому краю */
    }

    .ProfilePage_root__eothE h1 {
        font-size: 24px; /* Немного уменьшим заголовок на мобильных */
    }

    .profile-name-display {
        margin-bottom: 20px;
    }

    .ProfileForm_root__dKika {
        margin-bottom: 24px;
    }
}
/* --- Стили для страницы "Добавление кассы" --- */
.CreateCashpointPage_root__do7lc {
    max-width: 600px; /* Ограничим ширину формы */
    margin: 0 auto;  /* Центрируем */
    background-color: #FFFFFF;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.CreateCashpointPage_title__dg6cs {
    font-size: 28px;
    font-weight: 700;
    color: #282828;
    margin-bottom: 24px;
    text-align: center;
}

.create-cashpoint-actual-form { /* Используем этот класс для самой формы */
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.CreateCashpointPage_formFields__tQCX0 {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.CurrencyTags_root__7AY3x {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin-top: -8px; /* Компенсация отступа селекта */
    margin-bottom: 16px;
}

.CurrencyTags_tag__gdi1R {
    padding: 6px 12px;
    border: 1px solid #0D427A;
    color: #0D427A;
    background-color: #FFFFFF;
    border-radius: 16px; /* Сильно скругленные теги */
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.CurrencyTags_tag__gdi1R:hover,
.CurrencyTags_tag__gdi1R.selected { /* Класс для выбранного тега */
    background-color: #0D427A;
    color: #FFFFFF;
}

.CreateCashpointPage_addressFields__neopa {
    border-top: 1px solid #E0E0E0;
    padding-top: 20px;
}

.AddressFormFields_address___Vh4H {
    /* Стили для обертки адреса */
}

.AddressFormFields_addressTitle__ji6B1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.AddressFormFields_addressTitle__ji6B1 h3 {
    font-size: 16px;
    font-weight: 700;
    color: #282828;
}
.AddressFormFields_btnEdit__VSG_H { /* Кнопка "Изменить" у адреса */
    padding: 6px 12px;
    font-size: 12px; /* Мельче */
    border: 1px solid #0D427A;
    color: #0D427A;
    border-radius: 6px;
}
.AddressFormFields_btnEdit__VSG_H:hover {
    background-color: #f0f4f8;
}

.AddressFormFields_addressContent__NWJmJ p {
    font-size: 14px;
    color: #282828;
    line-height: 1.5;
    margin-bottom: 4px;
}
.AddressFormFields_additionalAddress__X1_sW {
    font-size: 12px;
    color: #535c67;
}

.CreateCashpointPage_formActions__tsNPI {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
}
.CreateCashpointPage_formActions__tsNPI .Button_dark__mg9Ut {
    background-color: #0D427A;
    color: white;
}
.CreateCashpointPage_formActions__tsNPI .Button_light__Ny_Cg {
    border: 1px solid #DDE1E6;
    color: #282828;
}
.CreateCashpointPage_formActions__tsNPI .Button_button__5Fngg {
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 500;
}
.Button_disabled__Cu6k9 {
    background-color: #A0A0A0 !important; /* Перебиваем другие стили для задизейбленной кнопки */
    cursor: not-allowed;
    border-color: #A0A0A0 !important;
}


/* Стили для форм внутри модальных окон */
.edit-profile-field-form {
    display: flex;
    flex-direction: column;
}

.form-actions-modal {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
}

.form-actions-modal .Button_button__5Fngg { /* Общий стиль для кнопок в модалке */
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 500;
}
.form-actions-modal .Button_light__Ny_Cg { /* Кнопка "Отменить" */
    border: 1px solid #DDE1E6;
    color: #282828;
}
.form-actions-modal .Button_light__Ny_Cg:hover {
    background-color: #f0f4f8;
}
.form-actions-modal .Button_dark__mg9Ut { /* Кнопка "Сохранить" */
    background-color: #0D427A;
    color: #FFFFFF;
}
.form-actions-modal .Button_dark__mg9Ut:hover {
    background-color: #0a335e;
}
.product-select-wrapper {
    position: relative;
}

#productThemeSelector {
    width: 100%;
    /* appearance: none;  Можно раскомментировать для полного контроля над стрелкой, но тогда ее надо будет добавить вручную */
}
.home-cashpoints-selector-container {
    display: flex;
    flex-wrap: nowrap;
    gap: 20px;
    padding-bottom: 10px;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: thin;
    scrollbar-color: #0D427A #F8F9FA;
}
.home-cashpoints-selector-container::-webkit-scrollbar {
    height: 6px;
}
.home-cashpoints-selector-container::-webkit-scrollbar-track {
    background: #F0F2F5;
    border-radius: 3px;
}
.home-cashpoints-selector-container::-webkit-scrollbar-thumb {
    background-color: #BCC2CC;
    border-radius: 3px;
}
.home-cashpoints-selector-container:hover::-webkit-scrollbar-thumb {
    background-color: #868e96;
}

.home-cashpoint-item {
    padding: 10px 0;
    cursor: pointer;
    text-align: left;
    border-bottom: 3px solid transparent;
    transition: border-color 0.2s ease;
    flex-shrink: 0;
    min-width: 120px;
}

.home-cashpoint-item:hover {
    border-bottom-color: #E0E0E0;
}

.home-cashpoint-item.active {
    border-bottom-color: #FB4D00;
}

.home-cashpoint-item.active .home-cashpoint-name,
.home-cashpoint-item.active .home-cashpoint-balance {
    font-weight: 700;
    color: #282828;
}

.home-cashpoint-name {
    display: block;
    font-size: 12px;
    color: #868e96;
    margin-bottom: 2px;
    white-space: nowrap;
}

.home-cashpoint-balance {
    display: block;
    font-size: 16px;
    font-weight: 500;
    color: #535c67;
    white-space: nowrap;
}

.home-cashpoints-selector-container .no-cashpoints-message {
    color: #535c67;
    padding: 10px 0;
    font-style: italic;
}


/* Обертка для вкладок и кнопки "Еще" */
.home-cashpoints-tabs-wrapper {
    display: flex; /* Чтобы вкладки и кнопка "Еще" были в один ряд */
    align-items: flex-end; /* Выравниваем по низу, если кнопка "Еще" другой высоты */
    border-bottom: 1px solid #E0E0E0; /* Общая нижняя граница для всей зоны вкладок */
    margin-bottom: 10px; /* Отступ под всей этой зоной */
}

.home-cashpoints-selector-container {
    display: flex;
    flex-wrap: nowrap;
    gap: 20px;
    /* padding-bottom: 10px; Убрали, т.к. border-bottom теперь у .home-cashpoint-item */
    overflow-x: hidden; /* Теперь скролла нет, мы его заменяем кнопкой "Еще" */
    flex-grow: 1; /* Позволяем контейнеру вкладок занять доступное место */
    /* -ms-overflow-style и scrollbar-width больше не нужны, если нет overflow-x: auto */
}
/* Стили для скроллбара Webkit убираем, если нет overflow-x: auto */
/* .home-cashpoints-selector-container::-webkit-scrollbar ... */


.home-cashpoint-item {
    padding: 10px 0;
    cursor: pointer;
    text-align: left;
    border-bottom: 3px solid transparent;
    transition: border-color 0.2s ease, color 0.2s ease, font-weight 0.2s ease; /* Добавил color и font-weight */
    flex-shrink: 0;
    min-width: 100px; /* Можно немного уменьшить, если текст короткий */
    margin-bottom: -1px; /* Чтобы border-bottom элемента перекрывал border-bottom родителя */
}
/* ... остальные стили для .home-cashpoint-item, .active, .name, .balance остаются ... */

/* Кнопка "Еще" */
.home-cashpoints-more-trigger {
    margin-left: 10px; /* Отступ от последней видимой вкладки */
    position: relative; /* Для позиционирования выпадающего списка */
    padding-bottom: 3px; /* Чтобы быть на одном уровне с подчеркиванием вкладок */
}

#homeCashpointsMoreBtn {
    padding: 8px 12px;
    border: 1px solid #DDE1E6;
    border-radius: 6px;
    background-color: #FFFFFF;
    font-size: 13px;
    color: #282828;
    display: flex;
    align-items: center;
    gap: 6px;
}
#homeCashpointsMoreBtn:hover {
    border-color: #BCC2CC;
    background-color: #f8f9fa;
}
#homeCashpointsMoreBtn svg path {
    fill: #535c67; /* Цвет стрелки */
}

/* Выпадающий список для "Еще" */
#homeCashpointsMoreDropdown {
    /* Стили из вашего .popover должны подойти, но можно уточнить */
    position: absolute;
    top: calc(100% + 5px); /* Появляется под кнопкой "Еще" */
    right: 0; /* Выравнивание по правому краю кнопки */
    min-width: 200px; /* Минимальная ширина списка */
    z-index: 1000;
    background: #fff;
    border: 1px solid #E0E0E0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    border-radius: 8px;
    padding: 5px 0;
}

.home-cashpoints-dropdown-list {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 200px; /* Ограничение высоты, если много элементов */
    overflow-y: auto;
}

.home-cashpoints-dropdown-list li a {
    display: block;
    padding: 8px 15px;
    font-size: 14px;
    color: #282828;
    text-decoration: none;
    white-space: nowrap;
}
.home-cashpoints-dropdown-list li a:hover {
    background-color: #f0f4f8;
}
.text-color-blue { color: #3798FF; } /* Или ваш оттенок синего/красного для расходов */
.text-color-green { color: #46AD21; }
.transaction-date-filter-controls {
    display: flex;
    gap: 8px;
    align-items: center;
}

.simple-select {
    padding: 6px 10px;
    border: 1px solid #DDE1E6;
    border-radius: 6px;
    background-color: #FFFFFF;
    font-size: 14px; /* Уменьшим немного, чтобы помещалось */
    font-family: inherit;
    color: #0D427A;
    font-weight: 500;
    cursor: pointer;
}

.simple-select:hover {
    border-color: #BCC2CC;
}

.simple-select:focus {
    outline: none;
    border-color: #0D427A;
    box-shadow: 0 0 0 2px rgba(13, 66, 122, 0.2);
}

/* style.css */
.date-picker-wrapper {
    position: relative; /* Для позиционирования поповера */
}

.date-picker-button { /* Стили для основной кнопки, если нужны доп. */
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px; /* Вернули исходный размер */
    font-weight: 500;
    color: #0D427A;
    background: none;
    border: none;
    cursor: pointer;
}
.date-picker-button svg {
    stroke: #0D427A;
}

.date-range-popover {
    position: absolute;
    top: calc(100% + 5px); /* Под кнопкой */
    right: 0; /* Выравниваем по правому краю кнопки */
    background-color: #fff;
    border: 1px solid #E0E0E0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 8px;
    padding: 15px;
    z-index: 100; /* Должен быть выше остального контента страницы */
    min-width: 220px; /* Чтобы селекты поместились */
}

.date-range-popover-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.date-filter-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.date-filter-row label {
    font-size: 13px;
    color: #535c67;
    white-space: nowrap;
}

.simple-select-popover { /* Стили для селектов внутри поповера */
    padding: 5px 8px;
    border: 1px solid #DDE1E6;
    border-radius: 4px;
    background-color: #FFFFFF;
    font-size: 13px;
    font-family: inherit;
    flex-grow: 1; /* Чтобы занимали доступное место */
}

#applyDateFilterPopover { /* Кнопка "Применить" в поповере */
    margin-top: 10px;
    padding: 6px 12px; /* Делаем ее чуть меньше */
    align-self: flex-end; /* Кнопка справа */
}

/* Стили для страниц авторизации и регистрации */
.auth-page-container {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 48px); /* Высота экрана минус паддинги .main-content */
    padding: 20px;
}

.auth-form-wrapper {
    background-color: #FFFFFF;
    padding: 32px;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    width: 100%;
    max-width: 420px; /* Ограничиваем ширину формы */
}

.auth-logo-mobile {
    /* Если будет логотип для мобильных, стилизуем здесь.
       Пока что не используется в разметке.
       Пример: display: none; @media (max-width: 639px) { display: block; margin-bottom: 20px; text-align: center; } */
}

.auth-title {
    font-size: 32px; /* Крупный заголовок */
    font-weight: 800; /* Очень жирный */
    color: #282828;
    text-align: center;
    margin-bottom: 28px;
}

.auth-form {
    display: flex;
    flex-direction: column;
}

.auth-form-inputs {
    display: flex;
    flex-direction: column;
    gap: 18px; /* Расстояние между инпутами */
    margin-bottom: 28px;
}

.auth-form-inputs .Input_label__q7b80 {
    font-size: 13px;
    color: #535c67;
    margin-bottom: 6px;
}

.auth-form-inputs .Input_input__5WxBl {
    height: 48px; /* Более высокие инпуты */
    padding: 12px 14px;
    font-size: 15px;
}

.auth-link {
    color: #0D427A;
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
}
.auth-link:hover {
    text-decoration: underline;
}

.auth-forgot-password {
    display: block;
    text-align: right;
    margin-top: 8px;
    font-size: 13px;
}

.auth-form-buttons {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.auth-submit-button {
    width: 100%;
    padding: 14px 20px !important; /* Увеличиваем паддинг кнопки */
    font-size: 15px !important;
    font-weight: 700 !important;
}

.auth-switch-form-text {
    text-align: center;
    font-size: 14px;
    color: #535c67;
}
.auth-switch-form-text .auth-link {
    font-weight: 700; /* Делаем ссылку жирнее */
}

.auth-terms {
    margin-top: 8px; /* Небольшой отступ перед чекбоксом */
    font-size: 13px;
    color: #535c67;
    display: flex;
    align-items: center;
}
.auth-terms input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #0D427A; /* Цвет галочки */
}
.auth-terms label {
    line-height: 1.4;
}

/* Адаптация для маленьких экранов */
@media (max-width: 480px) {
    .auth-form-wrapper {
        padding: 24px;
        box-shadow: none;
        border-radius: 0;
    }
    .auth-title {
        font-size: 28px;
        margin-bottom: 24px;
    }
    .auth-page-container {
        padding: 0;
        align-items: flex-start; /* Форма прижмется к верху */
        padding-top: 20px; /* Небольшой отступ сверху на мобильных */
    }
}


/* Стили для Админ-панели */
#page-admin-panel {
    height: 100%; /* Занимает всю высоту main-content, если другие скрыты */
}

.admin-panel-layout {
    display: flex;
    height: 100%;
    width: 100%;
}

.admin-sidebar {
    width: 256px; /* Ширина сайдбара админки */
    background-color: #3c4b64; /* Темный фон как в CoreUI */
    color: #fff;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    border-right: 1px solid #2c3a51; /* Темная граница */
}

.admin-sidebar .sidebar-brand {
    height: 56px; /* Высота бренда */
    background-color: rgba(0,0,21,.2);
    padding: 0 1rem;
    justify-content: flex-start; /* Лого/текст слева */
}
.admin-sidebar .sidebar-brand img { /* Если будешь использовать лого */
    max-height: 30px;
}

.admin-sidebar .sidebar-nav {
    flex-grow: 1;
    overflow-y: auto;
}
.admin-sidebar .sidebar-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.admin-sidebar .nav-item .nav-link {
    display: flex;
    align-items: center;
    padding: 0.85rem 1rem;
    color: hsla(0,0%,100%,.6);
    text-decoration: none;
    border-left: 3px solid transparent;
}
.admin-sidebar .nav-item .nav-link:hover {
    color: hsla(0,0%,100%,.87);
    background-color: hsla(0,0%,100%,.05);
}
.admin-sidebar .nav-item.active .nav-link {
    color: hsla(0,0%,100%,.87);
    background-color: hsla(0,0%,100%,.05);
    border-left-color: #39f; /* Синий акцент для активного пункта */
}
.admin-sidebar .nav-icon {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    fill: currentColor;
}
.admin-sidebar .nav-name {
    font-size: 0.875rem;
}

.admin-sidebar-toggler {
    height: 50px; /* Примерная высота тогглера */
    background-color: rgba(0,0,21,.2);
    border-top: 1px solid #2c3a51;
    /* Стили для иконки тогглера, если она будет */
}

.admin-main-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    background-color: #ebedef; /* Светлый фон для контента админки */
}

.admin-header {
    min-height: 56px; /* Высота шапки админки */
    background-color: #fff;
    border-bottom: 1px solid #d8dbe0;
    padding: 0 1rem; /* Паддинги для шапки */
}
.admin-header .container-fluid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.admin-header-toggler {
    /* Стили для кнопки открытия мобильного меню админки */
}

.admin-body-content {
    flex-grow: 1;
    padding: 1.5rem; /* Основные отступы для контента админки */
    overflow-y: auto;
}

.admin-footer {
    min-height: 50px; /* Высота футера админки */
    background-color: #fff;
    border-top: 1px solid #d8dbe0;
    padding: 0 1rem;
    font-size: 0.875rem;
    color: #636f83;
}
.admin-footer .ms-auto { margin-left: auto; }

.admin-page-placeholder {
    padding: 2rem;
    text-align: center;
    background-color: #fff;
    border-radius: 0.375rem;
    box-shadow: 0 1px 1px 0 rgba(60,75,100,.14),0 2px 1px -1px rgba(60,75,100,.12),0 1px 3px 0 rgba(60,75,100,.2);
}
.admin-page-placeholder h2 { margin-bottom: 0.5rem; }

/* Стили для таблиц и карточек из CoreUI (упрощенные) */
.card {
    margin-bottom: 1.5rem;
    border: 1px solid #d8dbe0;
    border-radius: 0.375rem;
    background-color: #fff;
    box-shadow: 0 1px 1px 0 rgba(60,75,100,.14),0 2px 1px -1px rgba(60,75,100,.12),0 1px 3px 0 rgba(60,75,100,.2);
}
.card-header {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f0f3f5;
    border-bottom: 1px solid #d8dbe0;
}
.card-body {
    padding: 1.25rem;
}
.card-footer {
    padding: 0.75rem 1.25rem;
    background-color: #f0f3f5;
    border-top: 1px solid #d8dbe0;
}

.table-responsive { overflow-x: auto; }
.table { width: 100%; margin-bottom: 1rem; color: #2c384a; border-collapse: collapse; }
.table th, .table td { padding: 0.75rem; vertical-align: top; border-top: 1px solid #d8dbe0; }
.table thead th { vertical-align: bottom; border-bottom: 2px solid #c3cbe4; }
.table-hover tbody tr:hover { color: #2c384a; background-color: rgba(0,0,0,.075); }
.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0,0,0,.05); }

.filters-wrapper { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
.form-control { display: block; width: 100%; padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #2c384a; background-color: #fff; background-clip: padding-box; border: 1px solid #b1b7c1; border-radius: 0.375rem; }
.form-control-sm { padding: 0.25rem 0.5rem; font-size: 0.875rem; border-radius: 0.25rem; }
.form-label, .d-inline-block { display: inline-block; margin-bottom: 0.5rem; }
.btn { display: inline-block; font-weight: 400; line-height: 1.5; color: #212529; text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; user-select: none; background-color: transparent; border: 1px solid transparent; padding: 0.375rem 0.75rem; font-size: 1rem; border-radius: 0.375rem; }
.btn-sm { padding: 0.25rem 0.5rem; font-size: 0.875rem; border-radius: 0.25rem; }
.btn-info { color: #fff; background-color: #39f; border-color: #39f; }
.btn-info:hover { background-color: #1aa; border-color: #1799e6; }
.btn-outline-success { color: #2eb85c; border-color: #2eb85c; }
.btn-outline-success:hover { color: #fff; background-color: #2eb85c; border-color: #2eb85c; }
.btn-outline-danger { color: #e55353; border-color: #e55353; }
.btn-outline-danger:hover { color: #fff; background-color: #e55353; border-color: #e55353; }
.text-white { color: #fff !important; }
.me-2 { margin-right: 0.5rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.d-flex { display: flex !important; }
.align-items-center { align-items: center !important; }
.justify-content-between { justify-content: space-between !important; }
.gap-2 { gap: 0.5rem !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.input-group { position: relative; display: flex; flex-wrap: wrap; align-items: stretch; width: 100%; }
.select-wrapper { position: relative; width: 100%; }
.select-control { display: flex; align-items: center; border: 1px solid #b1b7c1; border-radius: 0.375rem; padding: 0.375rem 0.75rem; background-color: #fff; }
.select-value-container { flex-grow: 1; }
.select-single-value { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.select-input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.select-indicators { display: flex; align-items: center; }
.select-indicator-separator { background-color: #d8dbe0; width: 1px; align-self: stretch; margin: 0 0.5rem; }
.cursor-pointer { cursor: pointer; }
.badge { display: inline-block; padding: .35em .65em; font-size: .75em; font-weight: 700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .375rem; }
.bg-success { background-color: #2eb85c !important; }
.bg-danger { background-color: #e55353 !important; }
.bg-secondary { background-color: #9da5b1 !important; }

.pagination-wrapper { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; }
.rc-pagination { display: flex; list-style: none; padding-left: 0; }
.rc-pagination-item, .rc-pagination-prev, .rc-pagination-next, .rc-pagination-jump-prev, .rc-pagination-jump-next { margin: 0 2px; padding: 0.375rem 0.75rem; border: 1px solid #d8dbe0; border-radius: 0.25rem; cursor: pointer; user-select: none; }
.rc-pagination-item:hover, .rc-pagination-prev:hover, .rc-pagination-next:hover, .rc-pagination-jump-prev:hover, .rc-pagination-jump-next:hover { background-color: #ebedef; }
.rc-pagination-item-active { background-color: #321fdb; color: #fff; border-color: #321fdb; }
.rc-pagination-disabled { color: #adb5bd; cursor: not-allowed; background-color: #e9ecef; border-color: #d8dbe0;}
.rc-pagination-disabled:hover { background-color: #e9ecef; }
.pagination-select .custom-select-wrapper { min-width: 120px; }
.pagination-select .select-input { font-size: 0.875rem; }
.nowrap-space { white-space: nowrap; }
.table-th .icon { margin-left: 0.25rem; opacity: 0.5; }
.table-th[data-sort-order="asc"] .icon, .table-th[data-sort-order="desc"] .icon { opacity: 1; }
.table-th[data-sort-order="desc"] .icon { transform: rotate(180deg); }


/* Стили для контейнера сообщений чата */
#chatMessagesContainer {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Общий стиль для всех сообщений */
.chat-message {
    display: flex;
    max-width: 80%;
}

/* Стили для сообщений оператора (слева) */
.operator-message {
    justify-content: flex-start;
}

.operator-message .message-bubble {
    background-color: #f0f2f5; /* Светло-серый фон */
    color: #1c1e21; /* Темный текст */
    border-radius: 18px 18px 18px 4px;
}

/* Стили для сообщений пользователя (справа) */
.user-message {
    justify-content: flex-end;
    align-self: flex-end; /* Прижимаем к правому краю */
}

.user-message .message-bubble {
    background-color: #0084ff; /* Синий фон */
    color: white; /* Белый текст */
    border-radius: 18px 18px 4px 18px;
}

/* Общий стиль для "пузыря" сообщения */
.message-bubble {
    padding: 8px 12px;
    display: inline-block;
    word-wrap: break-word; /* Для переноса длинных слов */
}

.message-sender {
    font-weight: 600;
    font-size: 13px;
    margin-bottom: 4px;
}

.message-text {
    font-size: 14px;
    line-height: 1.4;
}

.message-time {
    font-size: 11px;
    margin-top: 5px;
    text-align: right;
    opacity: 0.7;
}