/* ============================================================================ mobile-tables.css — на мобиле (≤768px) ВСЕ таблицы админки PolyFucked превращаются в КАРТОЧКИ (как у доменов). Горизонтального скролла больше нет — «показываем всё сразу»: каждая строка = карточка, каждая ячейка = строка «ПОДПИСЬ: значение». Подписи берутся из и проставляются в data-label декоратором /new/js/table-cards.js (CSS показывает их через ::before). Первая ячейка строки = заголовок карточки (крупно, без подписи). Сложные ячейки (NS-список, действия, список кошельков) раскладываются вертикально: подпись сверху, контент на всю ширину. На десктопе (>768px) ничего не меняется — обычные таблицы. Подключён последним → перекрывает .panel{overflow:hidden} и .table из base. ========================================================================== */ @media (max-width: 768px) { /* ── Панель больше НЕ скролл-контейнер: карточки влезают по ширине. ──────── */ .admin-main .panel:has(> .table), .admin-main .panel:has(> .table-toolbar), .admin-main .panel:has(.table), .admin-main .panel:has(.payout-table), .admin-main .table-wrap, .admin-main .md-table-wrap, .admin-main .pd-history { overflow: visible !important; } /* ── TABLE → CARDS (общий каркас для всех .table) ───────────────────────── */ .admin-main .table, .admin-main .table > tbody, .admin-main .table > tbody > tr, .admin-main .table > tbody > tr > td { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; } .admin-main .table { table-layout: auto !important; min-width: 0 !important; border: 0 !important; border-collapse: collapse !important; box-shadow: none !important; } .admin-main .table > thead { display: none !important; } /* строка = карточка */ .admin-main .table > tbody > tr { border: 1px solid var(--border) !important; border-radius: 10px !important; background: var(--bg) !important; padding: 6px 14px !important; margin: 0 0 10px !important; box-shadow: none !important; } .admin-main .table > tbody > tr:last-child { margin-bottom: 0 !important; } .admin-main .table > tbody > tr:hover { background: var(--bg) !important; } /* ячейка = строка «подпись | значение» */ .admin-main .table > tbody > tr > td { height: auto !important; min-height: 0 !important; border: 0 !important; border-bottom: 1px solid color-mix(in srgb, var(--border) 55%, transparent) !important; padding: 9px 0 !important; white-space: normal !important; text-align: right !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 14px !important; vertical-align: top !important; } .admin-main .table > tbody > tr > td:last-child { border-bottom: 0 !important; } /* подпись слева (из data-label, ставит JS-декоратор) */ .admin-main .table > tbody > tr > td::before { content: attr(data-label); flex: 0 0 auto; text-align: left; color: var(--mkt-muted) !important; font-weight: 600 !important; font-size: 11px !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; white-space: nowrap !important; font-family: var(--font-ui) !important; } /* ячейки без подписи — значение на всю ширину */ .admin-main .table > tbody > tr > td:not([data-label])::before, .admin-main .table > tbody > tr > td[data-label=""]::before { content: none !important; } /* пустые ячейки не плодят пустые строки */ .admin-main .table > tbody > tr > td:empty { display: none !important; } /* значение справа — переносим длинное (адреса/хэши), не режем */ .admin-main .table > tbody > tr > td > * { min-width: 0 !important; max-width: 100% !important; } .admin-main .table .mono-value, .admin-main .table .truncate, .admin-main .table code { overflow-wrap: anywhere !important; white-space: normal !important; text-overflow: clip !important; } /* ── Первая ячейка = заголовок карточки (крупно, без подписи) ──────────── */ .admin-main .table > tbody > tr > td:first-child { display: block !important; text-align: left !important; border-bottom: 1px solid var(--border) !important; padding: 4px 0 9px !important; margin-bottom: 3px !important; } .admin-main .table > tbody > tr > td:first-child::before { content: none !important; } .admin-main .table > tbody > tr > td:first-child, .admin-main .table > tbody > tr > td:first-child .truncate, .admin-main .table > tbody > tr > td:first-child > span { font-size: 15px !important; font-weight: 600 !important; color: var(--text-strong) !important; } /* ── Блочный контент (NS-список, кошельки, транзакции): подпись сверху, контент на всю ширину карточки. ТОЛЬКО эти — чтобы не плодить высокие пустые карточки из обычных ячеек. ──────────────────────────────────── */ .admin-main .table > tbody > tr > td:has(.ns-list), .admin-main .table > tbody > tr > td:has(.wallet-list), .admin-main .table > tbody > tr > td:has(.tx-list) { flex-direction: column !important; align-items: stretch !important; text-align: left !important; gap: 8px !important; } .admin-main .table > tbody > tr > td:has(.ns-list)::before, .admin-main .table > tbody > tr > td:has(.wallet-list)::before { align-self: flex-start; } /* ── Ячейки ДЕЙСТВИЙ — иконки в ОДИН ГОРИЗОНТАЛЬНЫЙ РЯД, прижаты вправо, подпись слева. Никаких вертикальных столбцов иконок и высоких пустых карточек. Работает и для .actions-обёртки (domains/users), и для голых .icon-btn/