/* page: dashboard / admin-dashboard */

.admin-dashboard-container {
    padding: 8px 12px;
}

/* Заголовок дашборда трейдера — читаемый в тёмной теме (был тёмный на тёмном) */
html.app-dark .dashboard-header,
html.app-dark .dashboard-header h2 {
    color: #e6edf3;
}

/* =====================================================
   Переключатель Вход/Выход — две кнопки по центру (как в монолите)
   ===================================================== */
.tab-bar-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 12px 10px;
}

.tab-bar-tabs {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.tab-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 20px;
    border-radius: 20px;
    border: 1px solid #c5c9df;
    background: #f0f1f8;
    color: #464e80;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.18s, box-shadow 0.18s, transform 0.1s, border-color 0.18s;
    letter-spacing: 0.01em;
}
.tab-btn:hover {
    background: #e4e6f5;
    border-color: #a8aed6;
    box-shadow: 0 2px 8px rgba(70, 78, 128, 0.12);
    transform: translateY(-1px);
}
.tab-btn:active { transform: translateY(0); }
.tab-btn-active {
    background: #e8eaf8;
    border-color: #7c83c8;
    color: #2e3570;
    box-shadow: 0 2px 10px rgba(70, 78, 128, 0.18);
}

.tab-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 10px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1;
}
.tab-badge-danger { background: #fce8e8; color: #922b2b; border: 1px solid #f0b8b8; }
.tab-badge-muted  { background: #ebebeb; color: #888; border: 1px solid #ddd; }

/* Тёмная тема */
html.app-dark .tab-btn {
    background: rgba(70, 78, 128, 0.12);
    border-color: #3d4470;
    color: #9aa0cc;
}
html.app-dark .tab-btn:hover {
    background: rgba(70, 78, 128, 0.22);
    border-color: #5a63a0;
}
html.app-dark .tab-btn-active {
    background: rgba(70, 78, 128, 0.28);
    border-color: #6870b8;
    color: #c5caee;
}
html.app-dark .tab-badge-danger { background: rgba(180, 40, 40, 0.15); color: #e8a0a0; border-color: #7a2a2a; }
html.app-dark .tab-badge-muted  { background: rgba(255,255,255,0.06); color: #6e7681; border-color: #30363d; }

/* =====================================================
   Приём заявок вход/выход — кнопки вкл/выкл (пастельные тона), правее переключателя.
   Зелёная = приём включён, красная = выключен. Клик переключает.
   ===================================================== */
.accept-toggles {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.accept-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 20px;
    border: 1px solid transparent;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    letter-spacing: 0.01em;
    transition: background 0.18s, box-shadow 0.18s, transform 0.1s, border-color 0.18s;
}
.accept-btn:hover { transform: translateY(-1px); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); }
.accept-btn:active { transform: translateY(0); }
.accept-btn:disabled { opacity: 0.6; cursor: default; transform: none; box-shadow: none; }

/* Включено — пастельный зелёный */
.accept-on { background: #e7f6ec; color: #2e7d4f; border-color: #b6e0c2; }
.accept-on:hover { background: #d7efe0; border-color: #98d3ab; }
/* Выключено — пастельный красный */
.accept-off { background: #fdecec; color: #b5453b; border-color: #f2c3bd; }
.accept-off:hover { background: #fbdedd; border-color: #eaa9a1; }

/* Тёмная тема */
html.app-dark .accept-on { background: rgba(46, 125, 79, 0.16); color: #7fd6a0; border-color: #2f6b48; }
html.app-dark .accept-on:hover { background: rgba(46, 125, 79, 0.26); border-color: #3c855b; }
html.app-dark .accept-off { background: rgba(180, 60, 50, 0.16); color: #e8a29a; border-color: #7a3630; }
html.app-dark .accept-off:hover { background: rgba(180, 60, 50, 0.26); border-color: #964238; }

/* Делаем toolbar плотным и всегда читаемым. */
.admin-dash-toolbar.dxbl-toolbar {
    padding: 4px 6px;
    flex-wrap: wrap;
    row-gap: 4px;
}

/* Поиск компактный, фиксированной ширины — не растягивается на полтоблицы. */
.admin-dash-search.dxbl-textbox {
    width: 260px;
    min-width: 220px;
}

/* Серверные фильтры-дропдауны (Трейдер/Мерчант/Статус) — заметная фиксированная ширина. */
.admin-dash-filter.dxbl-combobox,
.admin-dash-dir.dxbl-combobox {
    width: 190px;
    min-width: 160px;
}

/* Редакторы в фильтр-строке грида занимают всю ширину ячейки колонки. */
.admin-dash-grid .dash-fr {
    width: 100%;
    min-width: 0;
}

/* Подтягиваем pager + toolbar ближе, чтобы строки не "съедали" пространство. */
.admin-dash-grid .dxbl-grid-pager-container {
    padding: 2px 6px;
}
.admin-dash-grid .dxbl-grid-toolbar-container {
    padding: 0;
}

/* Action-кнопки в строках поменьше, не плодим высоту. */
.admin-dash-grid .admin-btn .dxbl-btn,
.admin-dash-grid .admin-btn.dxbl-btn {
    padding: 2px 10px !important;
    font-size: 0.75rem !important;
    border-radius: 20px !important;
    min-height: unset !important;
    line-height: 1.6 !important;
}

/* Цвета строк по направлению — из старого PayScrowing dx-grid.css. */
.admin-dash-grid .row-in td { background: rgba(60, 160, 100, 0.06) !important; }
.admin-dash-grid .row-out td { background: rgba(220, 60, 60, 0.05) !important; }

/* ── Компактные карточки ордеров трейдера на узких/средних десктоп-экранах (<1200px) ──
   Карточки переиспользуются из мобильных компонентов (Incoming/OutgoingOrdersMobile).
   Все стили ограничены контекстом .dash-compact-cards, чтобы:
   1) не затронуть мобильный app-shell (MobileTraderDashboard);
   2) карточки были оформлены в ЛЮБОЙ вкладке (базовые .order-card стили живут в <style>
      внутри IncomingPayOrdersMobile и пропадают при переключении на вкладку Выход —
      поэтому дублируем их здесь, в всегда-загруженном CSS). */

/* Базовая раскладка карточки */
.dash-compact-cards .orders-mobile { display: flex; flex-direction: column; gap: 12px; padding: 10px; }
.dash-compact-cards .order-card {
    border-radius: 14px;
    padding: 12px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
}
html.app-dark .dash-compact-cards .order-card { background: #161b22; border-color: #30363d; }

.dash-compact-cards .card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.dash-compact-cards .order-id { font-size: 16px; font-weight: 700; }
.dash-compact-cards .order-usdt { font-size: 16px; font-weight: 700; color: #008f13; }
.dash-compact-cards .card-body { font-size: 13px; }
.dash-compact-cards .info-row { display: flex; justify-content: space-between; padding: 1px 0; gap: 10px; }
.dash-compact-cards .info-row > span { color: var(--bs-secondary-color, #6c757d); }
.dash-compact-cards .profit { color: #008f13; }
.dash-compact-cards .timer-row { margin-top: 8px; text-align: center; }
.dash-compact-cards .card-actions { display: flex; gap: 10px; margin-top: 8px; }
.dash-compact-cards .card-actions button { flex: 1; height: 40px; }
.dash-compact-cards .processing { width: 100%; text-align: center; color: orange; font-weight: 600; }

/* Поиск по карточкам (номер карты / ID) — заменяет searchbox грида в компактном виде. */
.dash-compact-cards .cards-search {
    position: relative;
    margin: 10px 10px 0;
}
.dash-compact-cards .cards-search i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--bs-secondary-color, #6c757d);
    pointer-events: none;
}
.dash-compact-cards .cards-search input {
    width: 100%;
    padding: 8px 12px 8px 34px;
    border-radius: 10px;
    border: 1px solid var(--bs-border-color, #dee2e6);
    background: var(--bs-body-bg, #fff);
    color: inherit;
    font-size: 14px;
    outline: none;
}
.dash-compact-cards .cards-search input:focus {
    border-color: #6f42c1;
    box-shadow: 0 0 0 3px rgba(111, 66, 193, 0.15);
}
html.app-dark .dash-compact-cards .cards-search input {
    background: #0d1117;
    border-color: #30363d;
    color: #c9d1d9;
}
.dash-compact-cards .cards-empty {
    text-align: center;
    padding: 24px;
    color: var(--bs-secondary-color, #6c757d);
}

/* Адаптивная сетка карточек: заполняем ширину (несколько карточек в ряд), а не один столбец. */
@media (min-width: 680px) {
    .dash-compact-cards .orders-mobile {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
        gap: 12px;
        align-items: start;
    }
}

/* Больше воздуха между строками карточки на десктоп-компакте + удобные тап-зоны копирования
   (раньше строки шли впритык — легко промахнуться по иконке копирования). */
.dash-compact-cards .order-card .info-row {
    padding: 8px 2px;
    font-size: 14px;
    align-items: center;
    min-height: 38px;
}
.dash-compact-cards .order-card .info-row + .info-row {
    border-top: 1px solid var(--bs-border-color, rgba(128, 128, 128, 0.18));
}
/* Значение строки с копированием — увеличенная кликабельная зона. */
.dash-compact-cards .order-card .copy-cell {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    margin: -6px -8px -6px 0;
    border-radius: 8px;
}
.dash-compact-cards .order-card .copy-cell:hover {
    background: rgba(128, 128, 128, 0.14);
}
.dash-compact-cards .order-card .copy-cell i {
    font-size: 15px;
}