/*
 * HLJH Pay console visual refresh.
 * Shared, build-free enhancement layer for admin, agent and merchant surfaces.
 * It intentionally loads after page styles so common hierarchy, alignment and
 * interaction rules remain consistent across the three protected applications.
 */

html {
    scroll-padding-top: calc(var(--app-header-height) + 16px);
}

body.app-body {
    min-width: 320px;
    background: var(--app-color-bg);
    color: var(--app-color-text);
    font-size: 15px;
    line-height: 1.55;
}

body.app-body :where(h1, h2, h3, h4) {
    text-wrap: balance;
}

body.app-body :where(p, dd, li) {
    overflow-wrap: anywhere;
}

body.app-body :where(button, a, input, select, textarea, summary) {
    transition-duration: 160ms;
}

body.app-body :where(button, .app-button, .app-icon-button):active:not(:disabled) {
    transform: translateY(1px) scale(0.985);
}

body.app-body :where(button, a, input, select, textarea, summary):focus-visible {
    outline: 2px solid var(--app-color-primary);
    outline-offset: 2px;
}

/* Icon geometry: one family, predictable optical sizes and text alignment. */
.app-icon,
[data-lucide] {
    display: inline-block;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    vertical-align: -0.18em;
    stroke-width: 2;
}

:where(.app-button, .app-icon-button, .protected-nav__link, .protected-nav__summary,
    .protected-layout__account-trigger, .app-action-menu__trigger,
    .app-action-menu__item, .dashboard-title, .operations-title,
    .admin-content-title, .commerce-title) > :where(.app-icon, [data-lucide]) {
    align-self: center;
    margin-block: 0;
}

:where(.dashboard-title__icon, .operations-title__icon, .admin-content-title__icon,
    .commerce-title__icon, .dashboard-highlight__icon, .dashboard-metric__icon) {
    display: inline-grid;
    place-items: center;
    line-height: 0;
}

:where(.dashboard-title__icon, .operations-title__icon, .admin-content-title__icon,
    .commerce-title__icon) :where(svg, .app-icon) {
    width: 21px;
    height: 21px;
}

/* Application chrome */
.protected-layout {
    min-height: 100dvh;
    grid-template-columns: var(--app-sidebar-width) minmax(0, 1fr);
    grid-template-rows: var(--app-header-height) minmax(0, 1fr);
    background: var(--app-color-bg);
}

.protected-layout__sidebar {
    width: var(--app-sidebar-width);
    grid-template-rows: var(--app-header-height) minmax(0, 1fr) auto;
    border-right: 1px solid #dbe4ee;
    background: var(--app-color-sidebar);
    color: var(--app-color-sidebar-text);
    box-shadow: 4px 0 18px rgba(34, 58, 88, 0.045);
}

.protected-layout__brand {
    gap: 12px;
    padding: 0 20px;
    border-bottom-color: #e7edf4;
    color: #17283e;
    font-size: 16px;
    font-weight: 700;
}

.protected-layout__brand-logo {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    border-radius: 10px;
    border: 1px solid #dbe7f3;
    background: #f2f7fc;
}

.protected-layout__navigation {
    padding: 14px 10px 22px;
}

.protected-nav__group {
    padding: 18px 12px 8px;
    color: #8090a4;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.protected-nav__link,
.protected-nav__summary {
    position: relative;
    min-height: 44px;
    gap: 12px;
    margin: 2px 0;
    padding: 10px 12px;
    border-radius: 10px;
    color: #465970;
    font-size: 14px;
    font-weight: 550;
}

.protected-nav__link:hover,
.protected-nav__summary:hover,
.protected-nav__section[open] > .protected-nav__summary {
    background: #f2f7fd;
    color: #1769d2;
}

.protected-nav__link[data-active="true"] {
    background: #eaf4ff;
    color: #1769d2;
    font-weight: 700;
    box-shadow: inset 0 0 0 1px #d3e7fb;
}

.protected-nav__link[data-active="true"]::before {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: -10px;
    width: 3px;
    border-radius: 0 4px 4px 0;
    background: #2b7fd8;
    content: "";
}

.protected-nav__link .app-icon,
.protected-nav__summary .app-icon {
    width: 19px;
    height: 19px;
    flex-basis: 19px;
    color: #74879e;
}

.protected-nav__link:hover .app-icon,
.protected-nav__summary:hover .app-icon,
.protected-nav__link[data-active="true"] .app-icon {
    color: #2879ce;
}

.protected-nav__children {
    gap: 2px;
    padding: 3px 0 7px 31px;
}

.protected-nav__link--child {
    min-height: 38px;
    padding: 8px 12px;
    font-size: 13px;
}

.protected-layout__account {
    padding: 12px;
    border-top-color: #e7edf4;
}

.protected-layout__account-trigger {
    min-height: 52px;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    gap: 11px;
    padding: 7px 9px;
    border-radius: 11px;
    color: #34475e;
}

.protected-layout__account-trigger:hover,
.protected-layout__account-trigger[aria-expanded="true"] {
    background: #f1f7fd;
}

.protected-layout__avatar {
    width: 38px;
    height: 38px;
    border: 1px solid #c9e0f8;
    background: #e8f3ff;
    color: #1769d2;
    box-shadow: none;
}

.protected-layout__account-menu {
    right: 8px;
    bottom: calc(100% + 4px);
    left: 8px;
    gap: 3px;
    padding: 8px;
    border-color: var(--app-color-border);
    border-radius: 12px;
    box-shadow: var(--app-shadow-overlay);
}

.protected-layout__account-menu a,
.protected-layout__account-menu button {
    min-height: 40px;
    border-radius: 8px;
}

.protected-layout__account-meta {
    color: var(--app-color-text-muted);
    font-size: 13px;
}

.protected-layout__header {
    grid-column: 2;
    height: var(--app-header-height);
    padding: 0 28px;
    border-bottom-color: var(--app-color-border);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 2px 12px rgba(27, 50, 80, 0.04);
    backdrop-filter: saturate(130%) blur(10px);
}

.protected-layout__header-leading {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 12px;
}

.protected-layout__header-title {
    color: var(--app-color-text);
    font-size: 16px;
    font-weight: 700;
}

.protected-layout__role-badge {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    gap: 7px;
    padding: 5px 10px;
    border: 1px solid #cadcf0;
    border-radius: 999px;
    background: #edf5ff;
    color: #245d9f;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.protected-layout__role-badge .app-icon {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
}

.protected-layout__main {
    grid-column: 2;
    padding: 28px;
}

.protected-layout__main-inner {
    width: 100%;
    max-width: none;
    margin: 0;
}

.protected-layout__loading {
    background: var(--app-color-bg);
}

/* Buttons and inputs */
.app-button,
.app-icon-button {
    min-height: var(--app-control-height);
    border-radius: var(--app-radius-md);
    font-size: 14px;
    font-weight: 650;
    line-height: 1;
}

.app-button {
    min-width: 82px;
    gap: 7px;
    padding-inline: 16px;
}

.app-button--primary {
    border-color: var(--app-color-primary);
    background: linear-gradient(180deg, #2479df, var(--app-color-primary));
    color: #ffffff;
    box-shadow: 0 5px 14px rgba(23, 105, 210, 0.2);
}

.app-button--primary:hover,
.app-button--primary:focus-visible {
    border-color: var(--app-color-primary-hover);
    background: linear-gradient(180deg, #1b6dca, var(--app-color-primary-hover));
    color: #ffffff;
    box-shadow: 0 7px 18px rgba(17, 87, 180, 0.24);
}

.app-button--secondary {
    border-color: var(--app-color-border-strong);
    background: #ffffff;
    color: #29384e;
    box-shadow: 0 1px 3px rgba(30, 54, 84, 0.05);
}

.app-button--secondary:hover,
.app-button--secondary:focus-visible {
    border-color: var(--app-color-primary-border);
    background: var(--app-color-primary-soft);
    color: var(--app-color-primary-hover);
}

.app-button--danger {
    box-shadow: 0 5px 14px rgba(180, 35, 24, 0.16);
}

.app-button:disabled,
.app-icon-button:disabled {
    box-shadow: none;
    opacity: 0.48;
    transform: none;
}

.app-icon-button {
    width: var(--app-control-height);
    min-width: var(--app-control-height);
    border-color: var(--app-color-border);
    background: #ffffff;
    color: var(--app-color-text-muted);
}

.app-icon-button:hover,
.app-icon-button:focus-visible {
    border-color: var(--app-color-primary-border);
    background: var(--app-color-primary-soft);
    color: var(--app-color-primary);
}

.app-input,
.app-select,
.app-textarea {
    min-height: var(--app-control-height);
    border-color: var(--app-color-border-strong);
    border-radius: var(--app-radius-md);
    background: #ffffff;
    color: var(--app-color-text);
    font-size: 14px;
}

.app-input,
.app-select {
    padding-block: 8px;
}

.app-input:hover,
.app-select:hover,
.app-textarea:hover {
    border-color: #8fa3bb;
}

.app-input:focus,
.app-select:focus,
.app-textarea:focus {
    border-color: var(--app-color-primary);
    box-shadow: var(--app-focus-ring);
}

.app-input::placeholder,
.app-textarea::placeholder {
    color: #7c8da2;
}

.app-field {
    gap: 7px;
}

.app-label {
    color: #34445a;
    font-size: 14px;
    font-weight: 650;
}

.app-field-error {
    font-size: 13px;
}

/* Shared surfaces and hierarchy */
.app-card,
.dashboard-panel,
.operations-header,
.operations-panel,
.advanced-panel,
.admin-content-card,
.commerce-panel,
.financial-panel,
.compensation-panel,
.protected-orders-panel,
.account-settings-card,
.account-permissions-panel {
    border-color: var(--app-color-border);
    border-radius: var(--app-radius-lg);
    background: var(--app-color-surface);
    box-shadow: var(--app-shadow-low);
}

.app-card:hover,
.dashboard-panel:hover,
.admin-content-card:hover {
    border-color: #c8d6e6;
}

.app-card__header,
.app-card__body,
.app-card__footer {
    padding: 18px 20px;
}

.app-card__header {
    border-bottom-color: var(--app-color-border);
}

.app-card__footer {
    border-top-color: var(--app-color-border);
    background: var(--app-color-surface-muted);
}

.app-page-title,
.admin-content-toolbar__title,
.operations-header h1,
.advanced-header h1,
.commerce-header h1,
.financial-header h1,
.dashboard-header h1 {
    color: var(--app-color-text);
    font-size: 22px;
    font-weight: 750;
    line-height: 1.3;
}

:where(.admin-content-toolbar__description, .operations-subtitle, .advanced-muted,
    .dashboard-header p, .dashboard-panel__header p) {
    color: var(--app-color-text-muted);
    font-size: 14px;
}

/* Page headings carry only the amount of surface their real content needs. */
.operations-title {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 12px;
}

.operations-title > div {
    min-width: 0;
}

.operations-title__icon {
    width: 42px;
    min-width: 42px;
    height: 42px;
    border: 1px solid #cfe1f7;
    border-radius: 12px;
    background: #eaf4ff;
    color: #1769d2;
}

.operations-header.operations-header--compact,
.advanced-header.advanced-header--compact {
    min-height: 0;
    justify-content: flex-start;
    padding: 3px 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.operations-header.operations-header--roomy {
    min-height: 90px;
    padding: 22px clamp(24px, 2vw, 30px);
}

.operations-header.operations-header--roomy > .app-button {
    flex: 0 0 auto;
}

.operations-header.operations-header--summary {
    display: grid;
    grid-template-columns: minmax(250px, 0.8fr) minmax(700px, 2.2fr);
    align-items: stretch;
    gap: 22px;
    padding: 18px 20px;
    border-color: #cadbea;
    background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%);
}

.certificate-summary__heading {
    align-self: center;
}

.certificate-summary__facts {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(120px, 0.8fr) minmax(145px, 1fr) minmax(120px, 0.8fr) minmax(155px, 1.15fr) minmax(180px, 1.2fr);
    align-items: stretch;
    overflow: hidden;
    margin: 0;
    border: 1px solid #d7e3ef;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.82);
}

.certificate-summary__facts > div {
    display: grid;
    min-width: 0;
    align-content: center;
    gap: 5px;
    padding: 11px 14px;
    border-left: 1px solid #e2eaf3;
}

.certificate-summary__facts > div:first-child {
    border-left: 0;
}

.certificate-summary__facts dt,
.certificate-summary__facts dd {
    min-width: 0;
    margin: 0;
}

.certificate-summary__facts dt {
    color: #6b7d92;
    font-size: 12px;
    font-weight: 650;
}

.certificate-summary__facts dd {
    overflow: hidden;
    color: #263a52;
    font-size: 15px;
    font-weight: 720;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.certificate-summary[data-state="loading"] .certificate-summary__status dd,
.certificate-summary[data-state="disabled"] .certificate-summary__status dd {
    color: #66768a;
}

.certificate-summary[data-state="pending"] .certificate-summary__status dd {
    color: var(--app-color-warning);
}

.certificate-summary[data-state="verified"] .certificate-summary__status dd {
    color: var(--app-color-success);
}

.operations-tabs.operations-tabs--complaint-status {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    overflow: visible;
    padding: 6px;
    border: 1px solid var(--app-color-border);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: var(--app-shadow-low);
}

.operations-tabs--complaint-status .operations-tab {
    min-width: 0;
    min-height: 44px;
    border: 0;
    border-radius: 8px;
}

.operations-tabs--complaint-status .operations-tab[aria-selected="true"] {
    background: #eaf4ff;
    box-shadow: inset 0 -2px 0 #1769d2;
}

.operations-stats.operations-stats--complaint-filters {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.operations-stats--complaint-filters button.operations-stat[aria-pressed="true"] {
    border-color: #80aee5;
    background: #eef6ff;
    box-shadow: 0 5px 14px rgba(24, 86, 158, 0.12);
}

.operations-filter-summary {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
    margin: -2px 2px 0;
    color: var(--app-color-text-muted);
    font-size: 13px;
    line-height: 1.55;
}

.operations-filter-summary > svg {
    color: #1769d2;
}

.operations-filter-summary strong {
    color: var(--app-color-text);
}

@media (max-width: 1320px) {
    .operations-stats.operations-stats--complaint-filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .operations-stats.operations-stats--complaint-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .operations-header.operations-header--roomy {
        min-height: 0;
        padding: 18px;
    }
}

@media (max-width: 460px) {
    .operations-stats.operations-stats--complaint-filters {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 1180px) {
    .operations-header.operations-header--summary {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }
}

@media (max-width: 760px) {
    .certificate-summary__facts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .certificate-summary__facts > div {
        border-top: 1px solid #e2eaf3;
    }

    .certificate-summary__facts > div:nth-child(-n + 2) {
        border-top: 0;
    }

    .certificate-summary__facts > div:nth-child(odd) {
        border-left: 0;
    }

    .certificate-summary__facts > div:last-child {
        grid-column: 1 / -1;
        border-left: 0;
    }
}

@media (max-width: 460px) {
    .certificate-summary__facts {
        grid-template-columns: minmax(0, 1fr);
    }

    .certificate-summary__facts > div,
    .certificate-summary__facts > div:nth-child(-n + 2) {
        border-top: 1px solid #e2eaf3;
        border-left: 0;
    }

    .certificate-summary__facts > div:first-child {
        border-top: 0;
    }

    .certificate-summary__facts > div:last-child {
        grid-column: auto;
    }
}

/* Filters become a recognizable workbench rather than another white card. */
.admin-content-filters,
.operations-filters,
.advanced-filters,
.commerce-filters,
.financial-filters,
.protected-orders-filters,
.account-permissions-filters {
    border: 1px solid #cddbeb;
    border-radius: var(--app-radius-lg);
    background: #f4f8fd;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.admin-content-filters,
.advanced-filters,
.commerce-filters,
.financial-filters,
.protected-orders-filters,
.account-permissions-filters {
    padding: 18px;
}

/* Tables: stronger headers, readable body size and consistent alignment. */
.app-table-wrap,
.dashboard-table-wrap,
.financial-subtable,
.merchant-control-table {
    overflow: auto;
    border: 1px solid var(--app-color-border);
    border-radius: var(--app-radius-lg);
    background: #ffffff;
    box-shadow: 0 2px 10px rgba(28, 54, 88, 0.045);
    scrollbar-gutter: stable;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table) {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-variant-numeric: tabular-nums;
}

/* Data workspaces should distribute dense columns instead of squeezing them
   into the visible center. The wrapper owns overflow on smaller screens. */
:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table):has(> thead > tr > th:nth-child(7)) {
    min-width: 1080px;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table):has(> thead > tr > th:nth-child(10)) {
    min-width: 1380px;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table) th {
    height: 46px;
    padding: 11px 14px;
    border-bottom: 1px solid #cbd8e7;
    background: #eaf1f8;
    color: #32445b;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: 0.015em;
    text-align: center;
    white-space: nowrap;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table) td {
    min-height: var(--app-table-row-height);
    padding: 12px 14px;
    border-bottom: 1px solid #e4ebf3;
    color: #2f4056;
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
    vertical-align: middle;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table) :where(th:first-child, td:first-child) {
    text-align: left;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table) tbody tr:nth-child(even) td {
    background: #fbfcfe;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table) tbody tr:hover td {
    background: #eef6ff;
}

:where(.app-table, .dashboard-table-wrap table, .financial-subtable table,
    .merchant-control-table table) tbody tr:last-child td {
    border-bottom: 0;
}

/* Keep compact values aligned while preserving left alignment for long identity text. */
.app-body .app-table th,
.app-body .app-table td {
    text-align: center;
}

.app-body .app-table :where(.advanced-cell-stack, .admin-content-cell--stack,
    .protected-order-numbers, .protected-order-times, .agent-merchants-orders,
    .agent-merchants-permissions, .agent-merchants-status) {
    text-align: left;
}

.app-body .app-table :where(.advanced-cell-stack--center, .protected-order-stack--center) {
    justify-items: center;
    text-align: center;
}

.app-body .app-table :where(.admin-content-row-actions, .advanced-row-actions) {
    justify-content: center;
}

.app-table-state,
.dashboard-table-empty {
    min-height: 140px;
    color: var(--app-color-text-muted);
    font-size: 14px;
}

.app-pagination {
    grid-template-columns: minmax(0, 1fr) auto 44px 44px;
    min-height: 62px;
    gap: 10px;
    padding: 14px 4px 2px;
}

.app-pagination__summary,
.app-pagination__size {
    color: var(--app-color-text-muted);
    font-size: 13px;
}

.app-pagination__size .app-select,
.app-pagination > .app-select {
    min-height: 40px;
    height: 40px;
}

.app-pagination > .app-icon-button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
}

/* Metric and status contrast */
.admin-content-stats,
.operations-stats,
.dashboard-metrics,
.merchant-control-stats,
.financial-stats,
.commerce-stats,
.advanced-stats,
.user-chargeback-stats,
.account-permissions-stats {
    gap: 14px;
}

.admin-content-stat,
.operations-stat,
.dashboard-metrics article,
.merchant-control-stat,
.platform-stat {
    position: relative;
    overflow: hidden;
    min-height: 112px;
    border: 1px solid var(--app-color-border);
    border-radius: 12px;
    background: linear-gradient(145deg, #ffffff, #f8fbff);
    box-shadow: 0 3px 12px rgba(28, 54, 88, 0.055);
}

.admin-content-stat__label,
.operations-stat span,
.dashboard-metrics article > span,
.platform-stat__label {
    color: var(--app-color-text-muted);
    font-size: 14px;
    font-weight: 600;
}

.admin-content-stat__value,
.operations-stat strong,
.dashboard-metrics article > strong,
.platform-stat__value {
    color: #172a43;
    font-size: 26px;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

.dashboard-highlight {
    --dashboard-highlight-accent: #1769d2;
    --dashboard-highlight-bg: #eef6ff;
    --dashboard-highlight-border: #c9e1fb;
    --dashboard-highlight-icon-bg: #dceeff;
    --dashboard-highlight-icon-border: #b8d9fa;
    min-height: 142px;
    border: 1px solid var(--dashboard-highlight-border);
    border-radius: 12px;
    background: var(--dashboard-highlight-bg);
    color: #17283e;
    box-shadow: 0 4px 14px rgba(32, 67, 108, 0.07);
}

.dashboard-highlight--violet,
.dashboard-highlight--blue,
.dashboard-highlight--primary,
.dashboard-highlight--total {
    background: var(--dashboard-highlight-bg);
}

.dashboard-highlight--green,
.dashboard-highlight--success {
    --dashboard-highlight-accent: #067647;
    --dashboard-highlight-bg: #edf9f3;
    --dashboard-highlight-border: #bfe7d2;
    --dashboard-highlight-icon-bg: #d9f2e5;
    --dashboard-highlight-icon-border: #a8d9bf;
    background: var(--dashboard-highlight-bg);
}

.dashboard-highlight--pink,
.dashboard-highlight--calendar {
    --dashboard-highlight-accent: #a15c0c;
    --dashboard-highlight-bg: #fff7e9;
    --dashboard-highlight-border: #f2d8a7;
    --dashboard-highlight-icon-bg: #fbeacb;
    --dashboard-highlight-icon-border: #ebcb91;
    background: var(--dashboard-highlight-bg);
}

.dashboard-highlight--total {
    --dashboard-highlight-accent: #53657c;
    --dashboard-highlight-bg: #f3f6f9;
    --dashboard-highlight-border: #d6e0ea;
    --dashboard-highlight-icon-bg: #e6ebf1;
    --dashboard-highlight-icon-border: #cad5e1;
}

.dashboard-highlight strong {
    color: #14243a;
    font-size: 30px;
    font-weight: 780;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.dashboard-highlight--total strong {
    font-size: 26px;
}

.dashboard--admin .dashboard-highlight [data-admin-stat$="_amount"],
.dashboard--agent .dashboard-highlight [data-agent-stat$=".amount"] {
    font-size: 27px;
}

.dashboard--admin .dashboard-highlight--total [data-admin-stat="total_amount"] {
    font-size: 22px;
}

.dashboard-highlight strong small {
    color: #52657b;
    font-weight: 600;
}

.dashboard-highlight > small {
    color: #52657b;
    font-size: 13px;
    font-weight: 600;
}

.dashboard-highlight__top {
    color: #52657b;
}

.dashboard-highlight__label {
    color: #52657b;
    font-size: 14px;
    font-weight: 650;
}

.dashboard-highlight__icon {
    width: 34px;
    height: 34px;
    border: 1px solid var(--dashboard-highlight-icon-border);
    border-radius: 9px;
    background: var(--dashboard-highlight-icon-bg);
    color: var(--dashboard-highlight-accent);
}

.dashboard-highlight__icon .app-icon {
    width: 18px;
    height: 18px;
}

.dashboard--admin > .dashboard-filter label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #40536a;
    font-size: 14px;
    font-weight: 600;
}

.dashboard--admin > .dashboard-filter > span {
    color: #718298;
    font-weight: 600;
}

.dashboard--admin .dashboard-metrics--eight {
    grid-template-columns: repeat(8, minmax(0, 1fr));
}

.dashboard--admin .dashboard-metrics--eight article {
    display: grid;
    min-height: 106px;
    grid-template-columns: 26px minmax(0, 1fr);
    grid-template-rows: minmax(32px, auto) auto;
    align-content: center;
    justify-content: stretch;
    column-gap: 6px;
    row-gap: 8px;
    padding: 14px 12px;
}

.dashboard--admin .dashboard-metrics--eight article > strong {
    grid-column: 1 / -1;
    grid-row: 1;
    overflow: visible;
    font-size: 21px;
    line-height: 1.25;
    text-overflow: clip;
}

.dashboard--admin .dashboard-metrics--eight article > span:last-child {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    line-height: 1.35;
}

.dashboard--admin .dashboard-metrics--eight .dashboard-metric__icon {
    position: static;
    grid-column: 1;
    grid-row: 2;
    width: 26px;
    height: 26px;
    border: 1px solid #c8dff8;
    border-radius: 7px;
    background: #edf6ff;
    color: #2876c7;
}

.dashboard--admin .dashboard-metrics--eight .dashboard-metric__icon .app-icon {
    width: 14px;
    height: 14px;
}

.dashboard--agent .dashboard-metrics--six {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dashboard--agent .dashboard-metrics--six article {
    min-height: 104px;
    padding: 16px 52px 16px 16px;
}

.dashboard--agent .dashboard-metrics--six article > strong {
    overflow: visible;
    font-size: 24px;
    text-overflow: clip;
}

.dashboard--agent .dashboard-metrics--six .dashboard-metric__icon {
    position: absolute;
    top: 16px;
    right: 14px;
    order: 0;
    width: 32px;
    height: 32px;
    border: 1px solid #c8dff8;
    border-radius: 9px;
    background: #edf6ff;
    color: #2876c7;
}

.dashboard--agent .dashboard-metrics--six .dashboard-metric__icon .app-icon {
    width: 17px;
    height: 17px;
}

@media (min-width: 1201px) and (max-width: 1600px) {
    .dashboard--admin .dashboard-metrics--eight article > strong {
        font-size: 19px;
    }
}

.dashboard-success-body {
    gap: 16px;
}

.dashboard-rate-ring {
    width: 136px;
    height: 136px;
}

.dashboard-rate-ring > div {
    width: 106px;
    height: 106px;
}

.dashboard-success-body .dashboard-metrics article {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding-inline: 12px;
}

.dashboard-success-body .dashboard-metrics article > span {
    min-width: 0;
}

.dashboard-success-body .dashboard-metrics article > strong {
    overflow: visible;
    font-size: 16px;
    text-overflow: clip;
}

/* Tabs and compact actions */
.dashboard-segments,
.dashboard-tabs {
    gap: 4px;
    padding: 4px;
    border: 1px solid #d8e2ed;
    border-radius: 10px;
    background: #edf2f7;
}

.dashboard-segments button,
.dashboard-tabs button {
    min-height: 34px;
    padding: 7px 13px;
    border-radius: 7px;
    color: #52657b;
    font-weight: 600;
}

.dashboard-segments button.is-active,
.dashboard-tabs button.is-active,
.dashboard-tabs button[aria-selected="true"] {
    background: #ffffff;
    color: var(--app-color-primary);
    box-shadow: 0 2px 7px rgba(27, 55, 91, 0.12);
}

.operations-tabs,
.admin-content-tabs,
.commerce-tabs,
.protected-orders-tabs,
.user-messages-tabs {
    gap: 4px;
    border-bottom-color: var(--app-color-border);
}

.operations-tab,
.admin-content-tab,
.commerce-tab,
.protected-orders-tab {
    min-height: 46px;
    padding-inline: 16px;
    color: var(--app-color-text-muted);
    font-size: 14px;
    font-weight: 650;
}

.operations-tab[aria-selected="true"],
.admin-content-tab[aria-selected="true"],
.commerce-tab[aria-selected="true"],
.protected-orders-tab[aria-selected="true"] {
    border-bottom-color: var(--app-color-primary);
    color: var(--app-color-primary);
}

.app-action-menu__trigger {
    min-height: 34px;
    padding: 6px 9px;
    border-radius: 8px;
    font-size: 14px;
}

.app-action-menu__popup {
    min-width: 184px;
    padding: 7px;
    border-color: var(--app-color-border);
    border-radius: 12px;
    box-shadow: var(--app-shadow-overlay);
}

.app-action-menu__item {
    min-height: 38px;
    border-radius: 8px;
    color: #34455a;
    font-size: 14px;
}

/* Dialogs and drawers */
.app-dialog {
    width: min(680px, calc(100vw - 32px));
    max-height: min(88dvh, 900px);
    padding: 0;
    border: 1px solid #c8d6e5;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: var(--app-shadow-overlay);
}

.app-dialog--large {
    width: min(1040px, calc(100vw - 48px));
}

.app-dialog--wide {
    width: min(1360px, calc(100vw - 32px));
}

.app-dialog--wide .dashboard-table-wrap {
    max-height: min(56dvh, 560px);
}

.app-dialog--wide :where([data-admin-merchant-summary], [data-admin-channel-summary]) {
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #cbdcf0;
    border-radius: 9px;
    background: #f1f7fe;
    color: #314b69;
    font-weight: 650;
    line-height: 1.55;
}

.app-dialog::backdrop {
    background: rgba(8, 20, 37, 0.58);
    backdrop-filter: blur(3px);
}

.app-dialog__surface {
    max-height: min(88dvh, 900px);
    background: #ffffff;
}

.app-dialog__header {
    min-height: 64px;
    gap: 10px;
    padding: 18px 22px;
    border-bottom: 1px solid #d9e4ef;
    background: #f3f7fc;
}

.app-dialog__header > :where(.app-icon, [data-lucide]) {
    width: 20px;
    height: 20px;
    color: var(--app-color-primary);
}

.app-dialog__title {
    color: var(--app-color-text);
    font-size: 18px;
    font-weight: 750;
}

.app-dialog__content {
    padding: 22px;
    color: #33465d;
    font-size: 14px;
}

.app-dialog__actions {
    gap: 10px;
    padding: 16px 22px 20px;
    border-top: 1px solid #e0e8f1;
    background: #f8fafc;
}

.app-dialog__message {
    color: #41546b;
    font-size: 15px;
    line-height: 1.7;
}

.app-dialog .account-permissions-editor {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* Confirmation dialogs are compact prompts, not data-detail windows. */
#app-confirm-dialog.app-confirm-dialog {
    width: min(520px, calc(100vw - 24px));
}

#app-confirm-dialog .app-dialog__header {
    min-height: 68px;
    justify-content: flex-start;
    gap: 12px;
    padding-inline: 22px;
}

.app-confirm-dialog__icon {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border-radius: 50%;
    background: #eaf3ff;
    color: #1769c2;
}

.app-confirm-dialog__icon svg { width: 20px; height: 20px; }
#app-confirm-dialog .app-dialog__message { padding: 20px 22px 22px 70px; text-align: left; }
#app-confirm-dialog[data-confirm-tone="warning"] .app-confirm-dialog__icon { background: #fff4d8; color: #a15c00; }
#app-confirm-dialog[data-confirm-tone="danger"] .app-confirm-dialog__icon { background: #ffebeb; color: #c62b32; }

/* Keep the shared login captcha aligned to its 310px challenge canvas. */
.app-dialog.identity-captcha {
    width: min(390px, calc(100vw - 24px));
}

.identity-captcha .app-dialog__header,
.identity-captcha .app-dialog__actions {
    padding-inline: 20px;
}

.identity-captcha .app-dialog__content {
    padding-inline: 20px;
}

@media (max-width: 520px) {
    #app-confirm-dialog .app-dialog__message { padding-inline: 22px; }
}

/* Applyment screens own their table and dialog primitives; keep them in the shared system. */
.applyment-table th,
.applyment-table td {
    text-align: center;
    vertical-align: middle;
}

.applyment-table :where(.applyment-table-primary, .applyment-table-limit,
    .applyment-table-payments, .applyment-meta, .applyment-table-reason) {
    text-align: left;
}

.applyment-table td:last-child {
    min-width: 96px;
    white-space: nowrap;
}

.applyment-table .app-action-menu__trigger {
    white-space: nowrap;
}

.applyment-dialog {
    max-height: min(88dvh, 900px);
    border: 1px solid #c8d6e5;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: var(--app-shadow-overlay);
}

.applyment-dialog::backdrop {
    background: rgba(8, 20, 37, 0.58);
    backdrop-filter: blur(3px);
}

.applyment-dialog__header {
    min-height: 64px;
    padding: 18px 22px;
    border-bottom-color: #d9e4ef;
    background: #f3f7fc;
}

.applyment-dialog__header h2 {
    color: var(--app-color-text);
    font-size: 18px;
    font-weight: 750;
}

.applyment-dialog__header .app-icon-button {
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
}

.applyment-dialog__body {
    max-height: calc(88dvh - 140px);
    padding: 22px;
}

.applyment-dialog__footer {
    padding: 16px 22px 20px;
    border-top-color: #e0e8f1;
    background: #f8fafc;
}

/* Alerts, notes and badges use consistent semantic contrast. */
.admin-content-alert,
.operations-note,
.advanced-notice,
.commerce-warning,
.financial-notice,
.complaints-notice,
.compensation-notice,
.dashboard-alert {
    border-radius: 11px;
    font-size: 14px;
    box-shadow: 0 2px 8px rgba(29, 55, 87, 0.04);
}

:where(.admin-content-badge, .operations-badge, .dashboard-owner-badge,
    .dashboard-agent-level, .dashboard-agent-centralized) {
    min-height: 26px;
    padding: 3px 9px;
    border: 1px solid transparent;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
}

.admin-content-badge--success,
.operations-badge--success { border-color: var(--app-color-success-border); }
.admin-content-badge--warning,
.operations-badge--warning { border-color: var(--app-color-warning-border); }
.admin-content-badge--danger,
.operations-badge--danger { border-color: var(--app-color-danger-border); }
.admin-content-badge--info,
.operations-badge--info { border-color: var(--app-color-info-border); }

/* Dashboard pages should inherit the app canvas instead of creating a second inset page. */
.dashboard {
    gap: 22px;
    min-height: 100%;
    padding: 0;
    background: transparent;
    color: var(--app-color-text);
}

.dashboard-panel {
    padding: 20px;
}

.dashboard-panel__header {
    margin-bottom: 18px;
}

.dashboard-panel__header h2,
.operations-panel h2,
.advanced-panel h2,
.commerce-panel h2,
.financial-panel h2 {
    color: #1f3047;
    font-size: 17px;
    font-weight: 750;
}

.dashboard-chart {
    min-height: 300px;
}

.dashboard-money,
.admin-content-money,
.operations-money {
    font-variant-numeric: tabular-nums;
    font-weight: 750;
}

/* Page-family normalization: older feature styles use their own panel names. */
.complaints-panel,
.compensation-panel,
.financial-section,
.platform-monthly-panel,
.platform-expense-summary,
.platform-expense-list,
.merchant-control-results,
.account-permissions-editor,
.account-permissions-stats-panel,
.protected-orders-table-panel,
.protected-bills-list,
.user-chargeback-detail-section,
.user-message-detail,
.admin-blacklist-stat-tables > section,
.commerce-summary {
    border: 1px solid var(--app-color-border);
    border-radius: var(--app-radius-lg);
    background: #ffffff;
    box-shadow: var(--app-shadow-low);
}

.complaints-panel,
.compensation-panel,
.financial-section,
.platform-monthly-panel,
.platform-expense-summary,
.platform-expense-list,
.account-permissions-editor,
.account-permissions-stats-panel,
.user-chargeback-detail-section,
.admin-blacklist-stat-tables > section,
.commerce-summary {
    padding: 18px;
}

:where(.complaints-header, .compensation-header, .platform-monthly-panel__header,
    .account-permissions-panel__toolbar) {
    gap: 16px;
}

:where(.complaints-header h1, .compensation-header h1) {
    color: var(--app-color-text);
    font-size: 22px;
    font-weight: 750;
}

:where(.complaints-header p, .compensation-header p) {
    color: var(--app-color-text-muted);
    font-size: 14px;
}

.complaints-filters,
.compensation-filters,
.platform-expense-form,
.account-permissions-log-filters,
.protected-bills-filters {
    padding: 18px;
    border: 1px solid #cddbeb;
    border-radius: var(--app-radius-lg);
    background: #f4f8fd;
}

.complaints-stats,
.compensation-stats,
.account-permissions-stats-grid {
    gap: 12px;
}

.complaints-stats button,
.compensation-stats article,
.account-permissions-stats-grid article,
.financial-stats > div,
.financial-metrics > div,
.platform-expense-summary {
    position: relative;
    overflow: hidden;
    min-height: 108px;
    padding: 16px;
    border: 1px solid var(--app-color-border);
    border-radius: 12px;
    background: linear-gradient(145deg, #ffffff, #f8fbff);
    color: var(--app-color-text-muted);
    box-shadow: 0 3px 12px rgba(28, 54, 88, 0.055);
}

.complaints-stats button:hover,
.complaints-stats button[aria-pressed="true"] {
    border-color: var(--app-color-primary-border);
    background: var(--app-color-primary-soft);
    color: var(--app-color-primary);
    box-shadow: 0 0 0 3px rgba(23, 105, 210, 0.09);
}

:where(.complaints-stats, .compensation-stats, .account-permissions-stats-grid,
    .financial-stats, .financial-metrics) span {
    color: var(--app-color-text-muted);
    font-size: 14px;
    font-weight: 600;
}

:where(.complaints-stats, .compensation-stats, .account-permissions-stats-grid,
    .financial-stats, .financial-metrics) strong {
    color: #172a43;
    font-size: 25px;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

.complaints-badge,
.compensation-status,
.financial-status,
.account-settings-badge,
.account-thresholds__default {
    min-height: 26px;
    padding: 3px 9px;
    border: 1px solid var(--app-color-border);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

:where(.complaints-badge--success, .compensation-status--success, .financial-status--success) {
    border-color: var(--app-color-success-border);
    background: var(--app-color-success-soft);
    color: var(--app-color-success);
}

:where(.complaints-badge--warning, .compensation-status--warning, .financial-status--warning) {
    border-color: var(--app-color-warning-border);
    background: var(--app-color-warning-soft);
    color: var(--app-color-warning);
}

:where(.complaints-badge--danger, .compensation-status--danger, .financial-status--danger) {
    border-color: var(--app-color-danger-border);
    background: var(--app-color-danger-soft);
    color: var(--app-color-danger);
}

:where(.complaints-badge--info, .compensation-status--info, .financial-status--info) {
    border-color: var(--app-color-info-border);
    background: var(--app-color-info-soft);
    color: var(--app-color-info);
}

.complaints-detail,
.compensation-detail,
.account-permissions-log-detail,
.account-settings-details {
    overflow: hidden;
    border: 1px solid var(--app-color-border);
    border-radius: 11px;
    background: var(--app-color-border);
}

:where(.complaints-detail, .compensation-detail, .account-permissions-log-detail,
    .account-settings-details) > div {
    background: #ffffff;
}

:where(.complaints-detail, .compensation-detail, .account-permissions-log-detail,
    .account-settings-details) dt {
    color: #50647b;
    font-size: 13px;
    font-weight: 650;
}

:where(.complaints-detail, .compensation-detail, .account-permissions-log-detail,
    .account-settings-details) dd {
    color: #25374e;
    font-size: 14px;
}

.complaints-history-item {
    padding: 14px;
    border: 1px solid var(--app-color-border);
    border-radius: 10px;
    background: #f8fbff;
}

.complaints-history-meta {
    color: var(--app-color-text-muted);
    font-size: 13px;
}

.complaints-provider,
.operations-governance article,
.operations-hierarchy__item,
.account-permissions-tree-fieldset,
.account-permissions-tree__group,
.account-threshold,
.user-chargeback-evidence a {
    border-color: var(--app-color-border);
    border-radius: 10px;
    background: #f7faff;
}

/* Account/settings pages */
.account-settings-card__header {
    padding: 18px 20px;
    border-bottom: 1px solid var(--app-color-border);
    background: #f5f8fc;
}

.account-settings-card__header h1,
.account-settings-card__header h2 {
    color: var(--app-color-text);
    font-size: 19px;
    font-weight: 750;
}

.account-settings-content,
.account-settings-form,
.account-permissions-page,
.account-permissions-panel,
.account-permissions-editor {
    gap: 18px;
}

.account-settings-notice,
.user-chargeback-upload-state {
    border-radius: 10px;
}

/* Platform statistics and expandable monthly rows. */
.platform-stats-grid {
    gap: 14px;
}

.platform-stat--purple { --platform-stat-color: #6a58c9; }
.platform-stat--cyan { --platform-stat-color: #087f8c; }
.platform-stat--pink { --platform-stat-color: #b83b78; }

.platform-monthly-list details {
    border-bottom: 1px solid #e1e9f2;
}

.platform-monthly-list summary {
    min-height: 54px;
    padding: 12px 14px;
    border-radius: 9px;
}

.platform-monthly-list summary:hover,
.platform-monthly-list details[open] summary {
    background: #eef6ff;
}

.platform-monthly__content {
    margin: 0 14px 14px;
    border: 1px solid var(--app-color-border);
    border-radius: 10px;
    background: #ffffff;
}

/* Orders and bill reconciliation are dense, but their hierarchy must stay obvious. */
.protected-orders-tabs {
    padding: 4px;
    border: 1px solid #d7e1ec;
    border-radius: 11px;
    background: #eaf0f6;
}

.protected-orders-tab {
    border: 0;
    border-radius: 8px;
}

.protected-orders-tab[aria-selected="true"] {
    border: 0;
    background: #ffffff;
    color: var(--app-color-primary);
    box-shadow: 0 2px 7px rgba(27, 55, 91, 0.12);
}

.protected-bill {
    overflow: hidden;
    border: 1px solid var(--app-color-border);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 2px 9px rgba(28, 54, 88, 0.045);
}

.protected-bill__summary {
    min-height: 62px;
    padding: 14px 16px;
    background: #f8fbff;
}

.protected-bill__summary:hover,
.protected-bill[open] > .protected-bill__summary {
    background: #edf5ff;
}

.protected-bill__metrics {
    gap: 10px;
}

.protected-bill-metric {
    min-height: 74px;
    padding: 12px;
    border: 1px solid var(--app-color-border);
    border-radius: 10px;
    background: #ffffff;
}

.protected-bill-metric svg {
    width: 20px;
    height: 20px;
}

/* Plugin/channel imagery has explicit bounds to remove large/small icon collisions. */
:where(.commerce-panel, .admin-content-card, .operations-panel) img:not(.app-upload__preview) {
    max-width: 100%;
}

:where(.commerce-plugin-icon, .commerce-channel-icon, .admin-plugin-icon,
    .payment-type-icon, .applyment-channel-icon) {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border: 1px solid var(--app-color-border);
    border-radius: 10px;
    background: #ffffff;
    object-fit: contain;
    padding: 5px;
}

/* Authentication surfaces inherit the same control quality without changing their layout. */
.identity-card,
.identity-split__form,
.identity-user-panel {
    border-color: var(--app-color-border);
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(20, 44, 74, 0.13);
}

.identity-submit {
    min-height: 44px;
    border-radius: 10px;
    background: linear-gradient(180deg, #2479df, var(--app-color-primary));
    box-shadow: 0 7px 18px rgba(23, 105, 210, 0.2);
}

.identity-submit:hover,
.identity-submit:focus-visible {
    background: linear-gradient(180deg, #1b6dca, var(--app-color-primary-hover));
}

/* Details: labels receive a tinted surface so values no longer blend together. */
.operations-detail,
.advanced-detail,
.commerce-detail,
.financial-detail,
.admin-content-detail-list,
.dashboard-detail-list,
.protected-order-detail {
    overflow: hidden;
    border-color: var(--app-color-border);
    border-radius: 11px;
    background: #ffffff;
}

:where(.operations-detail, .advanced-detail, .commerce-detail, .financial-detail,
    .admin-content-detail-list, .dashboard-detail-list, .protected-order-detail) dt {
    background: #edf3f9;
    color: #4b5f76;
    font-weight: 650;
}

:where(.operations-detail, .advanced-detail, .commerce-detail, .financial-detail,
    .admin-content-detail-list, .dashboard-detail-list, .protected-order-detail) dd {
    color: #25374e;
}

/* Detail pages open with a composed identity surface rather than edge-pinned title/actions. */
:where(.commerce-page[data-commerce-page*="detail"], .operations-page[data-operations-page*="detail"])
    > :where(.commerce-header, .operations-header) {
    min-height: 96px;
    padding: 20px 22px;
    border-color: #cad9e8;
    background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%);
}

/* Dense directories and operational tables use explicit semantic width budgets. */
.merchant-directory-page {
    gap: 16px;
}

.merchant-directory-header {
    min-height: 78px;
    padding: 16px 20px;
    border: 1px solid var(--app-color-border);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(28, 54, 88, 0.05);
}

.merchant-directory-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(240px, 1.25fr);
    gap: 12px;
}

.merchant-directory-stats > :where(div, article) {
    min-height: 98px;
    border: 1px solid var(--app-color-border);
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 2px 9px rgba(28, 54, 88, 0.045);
}

.merchant-directory-stats.commerce-stats strong[data-commerce-stat="total_balance"],
.merchant-directory-stats.operations-stats strong[data-operation-stat="total_balance"] {
    font-size: 18px;
    white-space: nowrap;
}

.merchant-directory-filters {
    grid-template-columns: repeat(4, minmax(150px, 1fr)) auto;
    align-items: end;
    gap: 14px;
    padding: 18px;
}

.merchant-directory-table .app-table {
    table-layout: auto;
}

.merchant-directory-table :where(th, td).merchant-column--uid { width: 150px; min-width: 150px; }
.merchant-directory-table :where(th, td).merchant-column--identity { width: 180px; min-width: 180px; }
.merchant-directory-table :where(th, td).merchant-column--owner { width: 210px; min-width: 210px; }
.merchant-directory-table :where(th, td).merchant-column--money { width: 130px; min-width: 130px; }
.merchant-directory-table :where(th, td).merchant-column--rate { width: 100px; min-width: 100px; }
.merchant-directory-table :where(th, td).merchant-column--permission { width: 92px; min-width: 92px; }
.merchant-directory-table :where(th, td).merchant-column--type { width: 112px; min-width: 112px; }
.merchant-directory-table :where(th, td).merchant-column--status { width: 132px; min-width: 132px; }
.merchant-directory-table :where(th, td).merchant-column--time { width: 176px; min-width: 176px; }
.merchant-directory-table :where(th, td).merchant-column--actions { width: 112px; min-width: 112px; }

.merchant-directory-table :where(.merchant-column--uid, .merchant-column--identity, .merchant-column--owner) {
    text-align: left !important;
}

.merchant-directory-table :where(.merchant-column--money, .merchant-column--rate,
    .merchant-column--permission, .merchant-column--type, .merchant-column--status,
    .merchant-column--time, .merchant-column--actions) {
    white-space: nowrap;
}

.merchant-directory-stack,
.merchant-directory-table .commerce-cell-stack {
    display: grid;
    min-width: 0;
    gap: 4px;
    text-align: left;
}

.merchant-directory-stack small,
.merchant-directory-table .commerce-cell-stack small {
    color: var(--app-color-text-muted);
    font-size: 12px;
    line-height: 1.35;
}

.merchant-directory-money {
    color: var(--app-color-success);
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.merchant-directory-icon-action {
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    padding: 0;
    vertical-align: middle;
}

.merchant-directory-icon-action svg {
    width: 14px;
    height: 14px;
}

.merchant-status-switch {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 7px;
    padding: 3px 7px 3px 4px;
    border: 1px solid #d9e1eb;
    border-radius: 999px;
    background: #ffffff;
    color: #5f6d80;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.merchant-status-switch__track {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 17px;
    flex: 0 0 30px;
    border-radius: 999px;
    background: #b8c2cf;
}

.merchant-status-switch__track::after {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(31, 50, 78, 0.24);
    content: "";
    transition: transform 160ms ease;
}

.merchant-status-switch.is-on {
    border-color: #bdd5f7;
    background: #f4f8ff;
    color: #155bb2;
}

.merchant-status-switch.is-on .merchant-status-switch__track { background: var(--app-color-primary); }
.merchant-status-switch.is-on .merchant-status-switch__track::after { transform: translateX(13px); }

.merchant-directory-table .operations-row-actions,
.merchant-directory-table .commerce-row-actions {
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.violation-callback-tools {
    flex-wrap: nowrap;
}

.violation-callback-tools .app-label {
    margin: 0;
    white-space: nowrap;
}

.violation-callback-tools .app-select {
    width: 210px;
}

/* Transaction complaints: identity columns stay intact and content gets the flexible space. */
#admin-complaints-table :where(th:nth-child(1), td:nth-child(1)) { width: 72px; min-width: 72px; white-space: nowrap; }
#admin-complaints-table :where(th:nth-child(2), td:nth-child(2)) { width: 290px; min-width: 290px; text-align: left; }
#admin-complaints-table :where(th:nth-child(3), td:nth-child(3)) { width: 180px; min-width: 180px; text-align: left; }
#admin-complaints-table :where(th:nth-child(4), td:nth-child(4)) { width: 180px; min-width: 180px; text-align: left; }
#admin-complaints-table :where(th:nth-child(5), td:nth-child(5)) { width: 340px; min-width: 340px; text-align: left; }
#admin-complaints-table :where(th:nth-child(6), td:nth-child(6)) { width: 130px; min-width: 130px; text-align: center; }
#admin-complaints-table :where(th:nth-child(7), td:nth-child(7)) { width: 180px; min-width: 180px; text-align: center; }
#admin-complaints-table :where(th:nth-child(8), td:nth-child(8)) { width: 190px; min-width: 190px; white-space: nowrap; }
#admin-complaints-table :where(th:nth-child(9), td:nth-child(9)) { width: 96px; min-width: 96px; text-align: center; white-space: nowrap; }

#admin-complaints-table td:nth-child(5) .complaints-stack small {
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    overflow-wrap: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* Violation notices: prevent channel names, merchant IDs and dates from collapsing vertically. */
#violation-table :where(th:nth-child(1), td:nth-child(1)) { width: 70px; min-width: 70px; white-space: nowrap; }
#violation-table :where(th:nth-child(2), td:nth-child(2)) { width: 96px; min-width: 96px; white-space: nowrap; }
#violation-table :where(th:nth-child(3), td:nth-child(3)) { width: 140px; min-width: 140px; }
#violation-table :where(th:nth-child(4), td:nth-child(4)) { width: 170px; min-width: 170px; }
#violation-table :where(th:nth-child(5), td:nth-child(5)) { width: 180px; min-width: 180px; }
#violation-table :where(th:nth-child(6), td:nth-child(6)) { width: 150px; min-width: 150px; }
#violation-table :where(th:nth-child(7), td:nth-child(7)) { width: 170px; min-width: 170px; white-space: nowrap; }
#violation-table :where(th:nth-child(8), td:nth-child(8)) { width: 220px; min-width: 220px; text-align: left; }
#violation-table :where(th:nth-child(9), td:nth-child(9)) { width: 130px; min-width: 130px; }
#violation-table :where(th:nth-child(10), td:nth-child(10)) { width: 210px; min-width: 210px; text-align: left; }
#violation-table :where(th:nth-child(11), td:nth-child(11)) { width: 220px; min-width: 220px; text-align: left; }
#violation-table :where(th:nth-child(12), td:nth-child(12)) { width: 108px; min-width: 108px; white-space: nowrap; }
#violation-table :where(th:nth-child(13), td:nth-child(13)) { width: 176px; min-width: 176px; white-space: nowrap; }
#violation-table :where(th:nth-child(14), td:nth-child(14)) { width: 145px; min-width: 145px; white-space: nowrap; }

/* Long-identity audit tables. */
#blacklist-table :where(th:nth-child(1), td:nth-child(1)) { min-width: 72px; white-space: nowrap; }
#blacklist-table :where(th:nth-child(2), td:nth-child(2)) { min-width: 220px; text-align: left; }
#blacklist-table :where(th:nth-child(3), td:nth-child(3), th:nth-child(4), td:nth-child(4), th:nth-child(6), td:nth-child(6)) { min-width: 200px; white-space: nowrap; }
#blacklist-table :where(th:nth-child(5), td:nth-child(5)) { min-width: 135px; white-space: nowrap; }
#blacklist-table :where(th:nth-child(7), td:nth-child(7)) { min-width: 140px; }
#blacklist-table :where(th:nth-child(8), td:nth-child(8)) { min-width: 180px; }
#blacklist-table :where(th:nth-child(9), td:nth-child(9)) { min-width: 270px; text-align: left; }
#blacklist-table :where(th:nth-child(10), td:nth-child(10), th:nth-child(11), td:nth-child(11)) { min-width: 100px; white-space: nowrap; }
#blacklist-table :where(th:nth-child(12), td:nth-child(12)) { min-width: 130px; }
#blacklist-table :where(th:nth-child(13), td:nth-child(13)) { min-width: 176px; white-space: nowrap; }
#blacklist-table :where(th:nth-child(14), td:nth-child(14)) { min-width: 150px; white-space: nowrap; }

#issue-record-table :where(th:nth-child(1), td:nth-child(1)) { min-width: 72px; white-space: nowrap; }
#issue-record-table :where(th:nth-child(2), td:nth-child(2)) { min-width: 140px; }
#issue-record-table :where(th:nth-child(3), td:nth-child(3)) { min-width: 230px; white-space: nowrap; }
#issue-record-table :where(th:nth-child(4), td:nth-child(4), th:nth-child(5), td:nth-child(5)) { min-width: 180px; text-align: left; }
#issue-record-table :where(th:nth-child(6), td:nth-child(6)) { min-width: 170px; }
#issue-record-table :where(th:nth-child(7), td:nth-child(7)) { min-width: 120px; }
#issue-record-table :where(th:nth-child(8), td:nth-child(8), th:nth-child(9), td:nth-child(9)) { min-width: 210px; white-space: nowrap; }
#issue-record-table :where(th:nth-child(10), td:nth-child(10)) { min-width: 240px; text-align: left; }
#issue-record-table :where(th:nth-child(11), td:nth-child(11)) { min-width: 100px; white-space: nowrap; }
#issue-record-table :where(th:nth-child(12), td:nth-child(12)) { min-width: 176px; white-space: nowrap; }

#title-risk-table :where(th:nth-child(1), td:nth-child(1)) { min-width: 230px; white-space: nowrap; }
#title-risk-table :where(th:nth-child(2), td:nth-child(2)) { min-width: 180px; }
#title-risk-table :where(th:nth-child(3), td:nth-child(3)) { min-width: 120px; white-space: nowrap; }
#title-risk-table :where(th:nth-child(4), td:nth-child(4), th:nth-child(5), td:nth-child(5), th:nth-child(6), td:nth-child(6)) { min-width: 260px; text-align: left; }
#title-risk-table :where(th:nth-child(7), td:nth-child(7)) { min-width: 130px; }
#title-risk-table :where(th:nth-child(8), td:nth-child(8)) { min-width: 230px; text-align: left; }
#title-risk-table :where(th:nth-child(9), td:nth-child(9)) { min-width: 96px; white-space: nowrap; }
#title-risk-table :where(th:nth-child(10), td:nth-child(10)) { min-width: 176px; white-space: nowrap; }

/* Financial tables allocate space to IDs, compound statistics, failures and row actions. */
#admin-commissions-table :where(th:nth-child(2), td:nth-child(2)) { min-width: 220px; white-space: nowrap; }
#admin-commissions-table :where(th:nth-child(3), td:nth-child(3)) { min-width: 180px; text-align: left; }
#admin-commissions-table :where(th:nth-child(n+4):nth-child(-n+10), td:nth-child(n+4):nth-child(-n+10)) { min-width: 118px; white-space: nowrap; }
#admin-commissions-table :where(th:nth-last-child(2), td:nth-last-child(2)) { min-width: 176px; white-space: nowrap; }
#admin-commissions-table :where(th:last-child, td:last-child) { min-width: 150px; white-space: nowrap; }

#profit-rules-table :where(th:nth-child(1), td:nth-child(1)) { width: 170px; min-width: 170px; white-space: nowrap; }
#profit-rules-table :where(th:nth-child(2), td:nth-child(2)) { width: 135px; min-width: 135px; white-space: nowrap; }
#profit-rules-table :where(th:nth-child(3), td:nth-child(3)) { width: 160px; min-width: 160px; }
#profit-rules-table :where(th:nth-child(4), td:nth-child(4)) { width: 100px; min-width: 100px; white-space: nowrap; }
#profit-rules-table :where(th:nth-child(5), td:nth-child(5)) { width: 170px; min-width: 170px; }
#profit-rules-table :where(th:nth-child(6), td:nth-child(6)) { width: 170px; min-width: 170px; }
#profit-rules-table :where(th:nth-child(7), td:nth-child(7)) { width: 210px; min-width: 210px; text-align: left; }
#profit-rules-table :where(th:nth-child(8), td:nth-child(8), th:nth-child(9), td:nth-child(9)) { width: 112px; min-width: 112px; white-space: nowrap; }
#profit-rules-table :where(th:nth-child(10), td:nth-child(10)) { width: 92px; min-width: 92px; white-space: nowrap; }
#profit-rules-table :where(th:nth-child(11), td:nth-child(11)) { width: 176px; min-width: 176px; white-space: nowrap; }
#profit-rules-table :where(th:nth-child(12), td:nth-child(12)) { width: 210px; min-width: 210px; white-space: nowrap; }

#profit-receivers-table :where(th:nth-child(1), td:nth-child(1)) { width: 140px; min-width: 140px; white-space: nowrap; }
#profit-receivers-table :where(th:nth-child(2), td:nth-child(2)) { width: 245px; min-width: 245px; text-align: left; }
#profit-receivers-table :where(th:nth-child(3), td:nth-child(3)) { width: 190px; min-width: 190px; }
#profit-receivers-table :where(th:nth-child(4), td:nth-child(4)) { width: 160px; min-width: 160px; }
#profit-receivers-table :where(th:nth-child(5), td:nth-child(5)) { width: 175px; min-width: 175px; }
#profit-receivers-table :where(th:nth-child(6), td:nth-child(6)) { width: 180px; min-width: 180px; }
#profit-receivers-table :where(th:nth-child(7), td:nth-child(7)) { width: 185px; min-width: 185px; }
#profit-receivers-table :where(th:nth-child(8), td:nth-child(8)) { width: 270px; min-width: 270px; text-align: left; }
#profit-receivers-table :where(th:nth-child(9), td:nth-child(9)) { width: 245px; min-width: 245px; white-space: nowrap; }

#profit-records-table :where(th:nth-child(1), td:nth-child(1)) { width: 230px; min-width: 230px; white-space: nowrap; text-align: left; }
#profit-records-table :where(th:nth-child(2), td:nth-child(2)) { width: 265px; min-width: 265px; white-space: nowrap; text-align: left; }
#profit-records-table :where(th:nth-child(3), td:nth-child(3)) { width: 145px; min-width: 145px; }
#profit-records-table :where(th:nth-child(4), td:nth-child(4)) { width: 180px; min-width: 180px; text-align: left; }
#profit-records-table :where(th:nth-child(5), td:nth-child(5)) { width: 116px; min-width: 116px; white-space: nowrap; }
#profit-records-table :where(th:nth-child(6), td:nth-child(6)) { width: 210px; min-width: 210px; text-align: left; }
#profit-records-table :where(th:nth-child(7), td:nth-child(7)) { width: 145px; min-width: 145px; white-space: nowrap; }
#profit-records-table :where(th:nth-child(8), td:nth-child(8)) { width: 150px; min-width: 150px; white-space: nowrap; }
#profit-records-table :where(th:nth-child(9), td:nth-child(9)) { width: 125px; min-width: 125px; white-space: nowrap; }
#profit-records-table :where(th:nth-child(10), td:nth-child(10)) { width: 200px; min-width: 200px; white-space: nowrap; }
#profit-records-table :where(th:nth-child(11), td:nth-child(11)) { width: 80px; min-width: 80px; white-space: nowrap; }
#profit-records-table :where(th:nth-child(12), td:nth-child(12)) { width: 300px; min-width: 300px; text-align: left; }
#profit-records-table :where(th:nth-child(13), td:nth-child(13)) { width: 176px; min-width: 176px; white-space: nowrap; }
#profit-records-table :where(th:nth-child(14), td:nth-child(14)) { width: 180px; min-width: 180px; white-space: nowrap; }

#profit-withdrawals-table :where(th:nth-child(1), td:nth-child(1)) { width: 220px; min-width: 220px; white-space: nowrap; text-align: left; }
#profit-withdrawals-table :where(th:nth-child(2), td:nth-child(2)) { width: 220px; min-width: 220px; text-align: left; }
#profit-withdrawals-table :where(th:nth-child(3), td:nth-child(3)) { width: 120px; min-width: 120px; white-space: nowrap; }
#profit-withdrawals-table :where(th:nth-child(4), td:nth-child(4), th:nth-child(5), td:nth-child(5)) { width: 125px; min-width: 125px; white-space: nowrap; }
#profit-withdrawals-table :where(th:nth-child(6), td:nth-child(6)) { width: 125px; min-width: 125px; white-space: nowrap; }
#profit-withdrawals-table :where(th:nth-child(7), td:nth-child(7)) { width: 200px; min-width: 200px; white-space: nowrap; }
#profit-withdrawals-table :where(th:nth-child(8), td:nth-child(8)) { width: 260px; min-width: 260px; text-align: left; }
#profit-withdrawals-table :where(th:nth-child(9), td:nth-child(9)) { width: 176px; min-width: 176px; white-space: nowrap; }
#profit-withdrawals-table :where(th:nth-child(10), td:nth-child(10)) { width: 112px; min-width: 112px; white-space: nowrap; }

#profit-record-detail-dialog .financial-subtable table { min-width: 1150px; }
#profit-record-detail-dialog .financial-subtable :where(th:nth-child(1), td:nth-child(1)) { min-width: 176px; white-space: nowrap; }
#profit-record-detail-dialog .financial-subtable :where(th:nth-child(2), td:nth-child(2)) { min-width: 120px; }
#profit-record-detail-dialog .financial-subtable :where(th:nth-child(3), td:nth-child(3)) { min-width: 180px; }
#profit-record-detail-dialog .financial-subtable :where(th:nth-child(4), td:nth-child(4)) { min-width: 140px; }
#profit-record-detail-dialog .financial-subtable :where(th:nth-child(5), td:nth-child(5)) { min-width: 220px; }
#profit-record-detail-dialog .financial-subtable :where(th:nth-child(6), td:nth-child(6)) { min-width: 280px; text-align: left; }

/* Remaining high-density admin lists receive the same semantic column budgeting. */
#commerce-agents-table :where(th:nth-child(1), td:nth-child(1)) { width: 180px; min-width: 180px; text-align: left; }
#commerce-agents-table :where(th:nth-child(2), td:nth-child(2)) { width: 190px; min-width: 190px; text-align: left; }
#commerce-agents-table :where(th:nth-child(3), td:nth-child(3)) { width: 140px; min-width: 140px; }
#commerce-agents-table :where(th:nth-child(4), td:nth-child(4)) { width: 170px; min-width: 170px; }
#commerce-agents-table :where(th:nth-child(5), td:nth-child(5)) { width: 130px; min-width: 130px; }
#commerce-agents-table :where(th:nth-child(6), td:nth-child(6)) { width: 95px; min-width: 95px; white-space: nowrap; }
#commerce-agents-table :where(th:nth-child(7), td:nth-child(7), th:nth-child(8), td:nth-child(8)) { width: 120px; min-width: 120px; white-space: nowrap; }
#commerce-agents-table :where(th:nth-child(9), td:nth-child(9)) { width: 145px; min-width: 145px; }
#commerce-agents-table :where(th:nth-child(10), td:nth-child(10)) { width: 176px; min-width: 176px; white-space: nowrap; }
#commerce-agents-table :where(th:nth-child(11), td:nth-child(11)) { width: 100px; min-width: 100px; white-space: nowrap; }

#commerce-recharge-channels-table :where(th:nth-child(1), td:nth-child(1)) { width: 72px; min-width: 72px; white-space: nowrap; }
#commerce-recharge-channels-table :where(th:nth-child(2), td:nth-child(2)) { width: 190px; min-width: 190px; text-align: left; }
#commerce-recharge-channels-table :where(th:nth-child(3), td:nth-child(3), th:nth-child(4), td:nth-child(4)) { width: 150px; min-width: 150px; }
#commerce-recharge-channels-table :where(th:nth-child(5), td:nth-child(5)) { width: 130px; min-width: 130px; white-space: nowrap; }
#commerce-recharge-channels-table :where(th:nth-child(6), td:nth-child(6)) { width: 190px; min-width: 190px; white-space: nowrap; }
#commerce-recharge-channels-table :where(th:nth-child(7), td:nth-child(7), th:nth-child(8), td:nth-child(8), th:nth-child(9), td:nth-child(9)) { width: 100px; min-width: 100px; white-space: nowrap; }
#commerce-recharge-channels-table :where(th:nth-child(10), td:nth-child(10)) { width: 176px; min-width: 176px; white-space: nowrap; }
#commerce-recharge-channels-table :where(th:nth-child(11), td:nth-child(11)) { width: 190px; min-width: 190px; white-space: nowrap; }

#admin-withdraws-table :where(th:nth-child(1), td:nth-child(1)) { width: 230px; min-width: 230px; white-space: nowrap; text-align: left; }
#admin-withdraws-table :where(th:nth-child(2), td:nth-child(2)) { width: 180px; min-width: 180px; text-align: left; }
#admin-withdraws-table :where(th:nth-child(3), td:nth-child(3)) { width: 170px; min-width: 170px; white-space: nowrap; }
#admin-withdraws-table :where(th:nth-child(4), td:nth-child(4)) { width: 110px; min-width: 110px; white-space: nowrap; }
#admin-withdraws-table :where(th:nth-child(5), td:nth-child(5)) { width: 290px; min-width: 290px; text-align: left; }
#admin-withdraws-table :where(th:nth-child(6), td:nth-child(6)) { width: 110px; min-width: 110px; white-space: nowrap; }
#admin-withdraws-table :where(th:nth-child(7), td:nth-child(7)) { width: 176px; min-width: 176px; white-space: nowrap; }
#admin-withdraws-table :where(th:nth-child(8), td:nth-child(8)) { width: 155px; min-width: 155px; white-space: nowrap; }

#admin-chargebacks-table :where(th:nth-child(1), td:nth-child(1)) { width: 265px; min-width: 265px; white-space: nowrap; text-align: left; }
#admin-chargebacks-table :where(th:nth-child(2), td:nth-child(2)) { width: 175px; min-width: 175px; text-align: left; }
#admin-chargebacks-table :where(th:nth-child(3), td:nth-child(3)) { width: 125px; min-width: 125px; white-space: nowrap; }
#admin-chargebacks-table :where(th:nth-child(4), td:nth-child(4)) { width: 280px; min-width: 280px; text-align: left; }
#admin-chargebacks-table :where(th:nth-child(5), td:nth-child(5)) { width: 110px; min-width: 110px; white-space: nowrap; }
#admin-chargebacks-table :where(th:nth-child(6), td:nth-child(6), th:nth-child(7), td:nth-child(7)) { width: 176px; min-width: 176px; white-space: nowrap; }
#admin-chargebacks-table :where(th:nth-child(8), td:nth-child(8)) { width: 95px; min-width: 95px; white-space: nowrap; }

#scheduled-tasks-table :where(th:nth-child(1), td:nth-child(1)) { width: 72px; min-width: 72px; white-space: nowrap; }
#scheduled-tasks-table :where(th:nth-child(2), td:nth-child(2)) { width: 190px; min-width: 190px; text-align: left; }
#scheduled-tasks-table :where(th:nth-child(3), td:nth-child(3)) { width: 320px; min-width: 320px; text-align: left; }
#scheduled-tasks-table :where(th:nth-child(4), td:nth-child(4)) { width: 135px; min-width: 135px; white-space: nowrap; }
#scheduled-tasks-table :where(th:nth-child(5), td:nth-child(5)) { width: 100px; min-width: 100px; white-space: nowrap; }
#scheduled-tasks-table :where(th:nth-child(6), td:nth-child(6), th:nth-child(7), td:nth-child(7)) { width: 176px; min-width: 176px; white-space: nowrap; }
#scheduled-tasks-table :where(th:nth-child(8), td:nth-child(8)) { width: 220px; min-width: 220px; }

/* Shared balance-log dialogs reserve intact order and time columns. */
:where(#commerce-user-balance-logs-table, #staff-balance-logs-table) :where(th:nth-child(1), td:nth-child(1)) { min-width: 110px; }
:where(#commerce-user-balance-logs-table, #staff-balance-logs-table) :where(th:nth-child(n+2):nth-child(-n+5), td:nth-child(n+2):nth-child(-n+5)) { min-width: 112px; white-space: nowrap; }
:where(#commerce-user-balance-logs-table, #staff-balance-logs-table) :where(th:nth-child(6), td:nth-child(6)) { min-width: 220px; white-space: nowrap; }
:where(#commerce-user-balance-logs-table, #staff-balance-logs-table) :where(th:nth-child(7), td:nth-child(7)) { min-width: 250px; text-align: left; }
:where(#commerce-user-balance-logs-table, #staff-balance-logs-table) :where(th:nth-child(8), td:nth-child(8)) { min-width: 176px; white-space: nowrap; }

/* Monitoring and role complaint tables share stable time/action treatment. */
#monitor-rules-table :where(th:nth-child(6), td:nth-child(6)) { min-width: 240px; text-align: left; }
#monitor-rules-table :where(th:nth-child(9), td:nth-child(9), th:nth-child(10), td:nth-child(10)) { min-width: 176px; white-space: nowrap; }
#monitor-rules-table :where(th:nth-child(11), td:nth-child(11)) { min-width: 140px; white-space: nowrap; }
#monitor-alerts-table :where(th:nth-child(8), td:nth-child(8)) { min-width: 280px; text-align: left; }
#monitor-alerts-table :where(th:nth-child(9), td:nth-child(9), th:nth-child(10), td:nth-child(10)) { min-width: 176px; white-space: nowrap; }
#monitor-alerts-table :where(th:nth-child(11), td:nth-child(11)) { min-width: 140px; white-space: nowrap; }

:where(#agent-complaints-table, #user-complaints-table) :where(th:nth-child(2), td:nth-child(2), th:nth-child(3), td:nth-child(3)) { min-width: 210px; white-space: nowrap; }
:where(#agent-complaints-table, #user-complaints-table) :where(th:nth-child(4), td:nth-child(4)) { min-width: 170px; }
:where(#agent-complaints-table, #user-complaints-table) :where(th:nth-child(6), td:nth-child(6), th:nth-child(8), td:nth-child(8)) { min-width: 220px; text-align: left; }
:where(#agent-complaints-table, #user-complaints-table) :where(th:nth-child(9), td:nth-child(9)) { min-width: 176px; white-space: nowrap; }
:where(#agent-complaints-table, #user-complaints-table) :where(th:nth-child(10), td:nth-child(10)) { min-width: 125px; white-space: nowrap; }

#agent-merchants-table :where(th:nth-child(1), td:nth-child(1)) { min-width: 150px; white-space: nowrap; }
#agent-merchants-table :where(th:nth-child(2), td:nth-child(2), th:nth-child(3), td:nth-child(3)) { min-width: 190px; text-align: left; }
#agent-merchants-table :where(th:nth-child(4), td:nth-child(4)) { min-width: 130px; white-space: nowrap; }
#agent-merchants-table :where(th:nth-child(5), td:nth-child(5), th:nth-child(6), td:nth-child(6), th:nth-child(7), td:nth-child(7), th:nth-child(8), td:nth-child(8)) { min-width: 105px; white-space: nowrap; }
#agent-merchants-table :where(th:nth-last-child(2), td:nth-last-child(2)) { min-width: 176px; white-space: nowrap; }
#agent-merchants-table :where(th:last-child, td:last-child) { min-width: 120px; white-space: nowrap; }

#settings-sms-logs-table .app-table { min-width: 1700px !important; }
#settings-sms-logs-table :where(th:nth-child(3), td:nth-child(3)) { min-width: 180px; text-align: left; }
#settings-sms-logs-table :where(th:nth-child(4), td:nth-child(4)) { min-width: 135px; white-space: nowrap; }
#settings-sms-logs-table :where(th:nth-child(5), td:nth-child(5)) { min-width: 280px; text-align: left; }
#settings-sms-logs-table :where(th:nth-child(6), td:nth-child(6)) { min-width: 190px; white-space: nowrap; }
#settings-sms-logs-table :where(th:nth-child(9), td:nth-child(9)) { min-width: 240px; white-space: nowrap; }
#settings-sms-logs-table :where(th:nth-child(10), td:nth-child(10)) { min-width: 176px; white-space: nowrap; }

.platform-staff-table { min-width: 1120px; }
.platform-staff-table :where(th, td) { min-width: 125px; white-space: nowrap; }
.platform-staff-table :where(th:nth-child(1), td:nth-child(1), th:nth-child(2), td:nth-child(2)) { min-width: 150px; }
.platform-detail-table { min-width: 1040px; }

#admin-compensation-table :where(th:nth-child(1), td:nth-child(1)) { width: 52px; min-width: 52px; white-space: nowrap; }
#admin-compensation-table :where(th:nth-child(2), td:nth-child(2), th:nth-child(3), td:nth-child(3)) { min-width: 230px; white-space: nowrap; }
#admin-compensation-table :where(th:nth-child(4), td:nth-child(4)) { min-width: 160px; white-space: nowrap; }
#admin-compensation-table :where(th:nth-child(5), td:nth-child(5)) { min-width: 280px; text-align: left; }
#admin-compensation-table :where(th:nth-child(6), td:nth-child(6), th:nth-child(7), td:nth-child(7)) { min-width: 120px; white-space: nowrap; }
#admin-compensation-table :where(th:nth-child(8), td:nth-child(8), th:nth-child(10), td:nth-child(10)) { min-width: 176px; white-space: nowrap; }
#admin-compensation-table :where(th:nth-child(9), td:nth-child(9)) { min-width: 290px; text-align: left; }
#admin-compensation-table :where(th:nth-child(11), td:nth-child(11)) { min-width: 220px; white-space: nowrap; }

@media (max-width: 1200px) {
    .merchant-directory-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .merchant-directory-filters {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }
    .protected-layout__main {
        padding: 22px;
    }

    .admin-content-stats--six,
    .dashboard-metrics--six,
    .complaints-stats,
    .compensation-stats,
    .financial-stats--six {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dashboard-metrics--eight,
    .dashboard--admin .dashboard-metrics--eight {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .protected-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .protected-layout__header,
    .protected-layout__main {
        grid-column: 1;
    }

    .protected-layout__header {
        padding-inline: 18px;
    }

    .protected-layout__main {
        padding: 18px;
    }

    .admin-content-stats,
    .admin-content-stats--six,
    .operations-stats,
    .dashboard-metrics,
    .dashboard-metrics--four,
    .dashboard-metrics--six,
    .dashboard-metrics--eight,
    .merchant-control-stats,
    .financial-stats,
    .commerce-stats,
    .advanced-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .complaints-stats,
    .compensation-stats,
    .account-permissions-stats-grid,
    .financial-stats,
    .financial-metrics,
    .platform-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-highlight-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard--admin .dashboard-metrics--eight {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard--agent .dashboard-metrics--six {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    body.app-body {
        font-size: 14px;
    }

    .protected-layout__header {
        padding-inline: 12px;
    }

    .protected-layout__main {
        padding: 12px;
    }

    .protected-layout__role-badge span {
        display: none;
    }

    .protected-layout__role-badge {
        width: 36px;
        min-width: 36px;
        height: 36px;
        padding: 0;
        justify-content: center;
    }

    .app-page-title,
    .admin-content-toolbar__title,
    .operations-header h1,
    .dashboard-header h1 {
        font-size: 20px;
    }

    .admin-content-toolbar,
    .operations-header,
    .dashboard-header,
    .financial-header,
    .commerce-header {
        align-items: stretch;
        flex-direction: column;
    }

    .merchant-directory-filters {
        grid-template-columns: minmax(0, 1fr);
    }

    .violation-callback-tools {
        display: grid;
        width: 100%;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    .violation-callback-tools .app-select,
    .violation-callback-tools .app-button {
        width: 100%;
    }

    .admin-content-stats,
    .admin-content-stats--six,
    .operations-stats,
    .dashboard-metrics,
    .dashboard-metrics--four,
    .dashboard-metrics--six,
    .dashboard-metrics--eight,
    .dashboard-highlight-grid,
    .merchant-control-stats,
    .financial-stats,
    .commerce-stats,
    .advanced-stats {
        grid-template-columns: minmax(0, 1fr);
    }

    .dashboard--admin .dashboard-metrics--eight {
        grid-template-columns: minmax(0, 1fr);
    }

    .dashboard--agent .dashboard-metrics--six {
        grid-template-columns: minmax(0, 1fr);
    }

    .complaints-stats,
    .compensation-stats,
    .account-permissions-stats-grid,
    .financial-stats,
    .financial-metrics,
    .platform-stats-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .app-button {
        min-height: 42px;
    }

    .app-dialog {
        width: calc(100vw - 20px);
        max-height: calc(100dvh - 20px);
        border-radius: 14px;
    }

    .app-dialog__surface {
        max-height: calc(100dvh - 20px);
    }

    .app-dialog__header,
    .app-dialog__content,
    .app-dialog__actions {
        padding-inline: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media (prefers-reduced-transparency: reduce) {
    .protected-layout__header,
    .app-dialog::backdrop {
        backdrop-filter: none;
    }
}