/* Navorina DS data table — product runtime contract. */

.nv-o-table {
  --nv-table-edge-inline: var(--nv-island-padding, 24px);
  --nv-table-edge-block: var(--nv-island-padding, 24px);
  --nv-table-head-to-grid: 12px;
}

/* Every product table, including detail, preview, import and secondary tables,
   receives the same outer frame as the canonical calendar island. */
.nv-table-edge-frame {
  --nv-table-edge-inline: var(--nv-island-padding, 24px);
  --nv-table-edge-block: var(--nv-island-padding, 24px);
  box-sizing: border-box;
}

.nv-table-edge-frame:not(.nv-o-table__scroll) {
  padding-block: var(--nv-table-edge-block);
}

.nv-table-edge-frame.nv-table-edge-frame > table.nv-tbl.nv-tbl :is(th, td):first-child {
  padding-inline-start: var(--nv-table-edge-inline) !important;
}

.nv-table-edge-frame.nv-table-edge-frame > table.nv-tbl.nv-tbl :is(th, td):last-child {
  padding-inline-end: var(--nv-table-edge-inline) !important;
}

/* Every table island shares one outer content frame. Page modules may size
   columns and rows, but must not move the table away from these four edges. */
.nv-o-table > .nv-o-table__head {
  box-sizing: border-box;
  padding-block: var(--nv-table-edge-block) var(--nv-table-head-to-grid) !important;
  padding-inline: var(--nv-table-edge-inline) !important;
}

@container nv-responsive-table (min-width: 35.001rem) {
  .nv-table-edge-frame > .nv-tbl :is(th, td):first-child,
  .nv-o-table .nv-o-table__grid :is(th, td):first-child {
    padding-inline-start: var(--nv-table-edge-inline) !important;
  }

  .nv-table-edge-frame > .nv-tbl :is(th, td):last-child,
  .nv-o-table .nv-o-table__grid :is(th, td):last-child {
    padding-inline-end: var(--nv-table-edge-inline) !important;
  }
}

.nv-o-table > .nv-o-table__scroll:last-child,
.nv-o-table:has(> :is(.nv-o-table__pagination, .nv-o-table__pagination--controls-only)[hidden]) > .nv-o-table__scroll {
  box-sizing: border-box;
  padding-block-end: var(--nv-table-edge-block) !important;
}

.nv-o-table > :is(.nv-o-table__pagination, .nv-o-table__pagination--controls-only) {
  box-sizing: border-box;
  padding-block: 12px var(--nv-table-edge-block) !important;
  padding-inline: var(--nv-table-edge-inline) !important;
}

.nv-tbl-wrap.nv-tbl-wrap {
  container: nv-responsive-table / inline-size;
  position: relative;
  max-inline-size: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  border: 0;
  border-radius: 16px;
  /* Обёртка только скроллит: поверхность даёт карточка, иначе полупрозрачный фон двоится. */
  background: transparent;
  /* Tables scroll sideways only; a stable gutter would reserve a vertical
     scrollbar lane and pull the last column 11 px off the island edge. */
  scrollbar-gutter: auto;
}

/*
 * Continuation belongs to the viewport, not to an individual table.
 * Runtime adds .has-scroll-below only while the workspace itself can still scroll.
 */
body.dash-page .dash-main::after {
  position: absolute;
  z-index: 8;
  inset-inline: 0;
  inset-block-end: 0;
  block-size: 72px;
  background: linear-gradient(
    to bottom,
    transparent 0,
    color-mix(in srgb, var(--dash-canvas, var(--dash-bg)) 34%, transparent) 26px,
    color-mix(in srgb, var(--dash-canvas, var(--dash-bg)) 76%, transparent) 50px,
    var(--dash-canvas, var(--dash-bg)) 72px
  );
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity 80ms linear;
}

body.dash-page .dash-main.has-scroll-below::after {
  opacity: 1;
}

.nv-tbl.nv-tbl {
  inline-size: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: var(--nv-type-body-size);
  letter-spacing: var(--nv-type-body-tracking);
}

.nv-tbl-wrap.nv-tbl-wrap > .nv-tbl.nv-tbl {
  min-inline-size: 100%;
}

.nv-tbl.nv-tbl :is(th, td) {
  block-size: 52px;
  padding-block: 0;
  padding-inline: 16px;
  border-block-end: 1px solid var(--color-border-secondary, rgba(255, 255, 255, 0.08));
  text-align: start;
  vertical-align: middle;
  white-space: nowrap;
}

.nv-tbl.nv-tbl th {
  block-size: 44px;
  background: transparent;
  color: var(--dash-muted, #71717a);
  font-size: var(--nv-type-footnote-size);
  font-weight: var(--nv-type-weight-semibold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  user-select: none;
}

.nv-tbl.nv-tbl [data-nv-table-resize] {
  touch-action: none;
  cursor: col-resize;
}

.nv-o-table.is-resizing,
.nv-tbl.is-column-resizing {
  cursor: col-resize;
  user-select: none;
}

/* Table density follows the amount of useful data, not the viewport. */
.nv-tbl.nv-tbl:is(.nv-tbl--single, .nv-tbl--few) :is(.dash-table-grip, .dash-table-resize) {
  display: none;
}

.nv-tbl.nv-tbl.nv-tbl--single thead {
  display: none;
}

/* Avatars and account marks inside data tables are compact service markers. */
.nv-tbl.nv-tbl :is(
  .tx-desc__avatar,
  .tx-account__flag,
  .pay-recipient__avatar,
  .pay-account-cell__flag,
  .inv-client__avatar,
  .acc-account__icon
) {
  inline-size: 24px;
  block-size: 24px;
  min-inline-size: 24px;
  flex-basis: 24px;
  border-radius: 50%;
  font-size: 10px;
}

/* Identity cells share one DS axis with their movable header: 12 | mark | 8 | copy | 12. */
.nv-tbl.nv-tbl.nv-o-table__grid td:has(> :is(
  .nv-o-table__desc,
  .tx-desc,
  .tx-account,
  .pay-recipient,
  .pay-account-cell,
  .inv-client,
  .acc-account
)) {
  padding-inline: 12px;
}

.nv-tbl.nv-tbl :is(
  .nv-o-table__desc,
  .tx-desc,
  .tx-account,
  .pay-recipient,
  .pay-account-cell,
  .inv-client,
  .acc-account
) {
  gap: 8px;
}

.nv-tbl.nv-tbl :is(.tx-desc__avatar, .pay-recipient__avatar, .inv-client__avatar, .acc-account__icon) svg {
  inline-size: 14px;
  block-size: 14px;
}

.nv-tbl.nv-tbl :is(.tx-desc__avatar--logo, .acc-account__icon--crypto) img {
  inline-size: 16px;
  block-size: 16px;
}

.nv-tbl.nv-tbl .tx-desc__avatar--brand-aws img {
  inline-size: 18px;
  block-size: 18px;
}

.nv-tbl.nv-tbl tbody tr {
  background: transparent;
  transition: background-color 150ms ease;
}

.nv-tbl.nv-tbl tbody tr:hover {
  background: var(--color-well, rgba(255, 255, 255, 0.035));
}

.nv-tbl.nv-tbl tbody tr:focus-within,
.nv-tbl.nv-tbl tbody tr.is-focused {
  outline: 2px solid var(--dash-border-strong, rgba(139, 111, 255, 0.55));
  outline-offset: -2px;
}

.nv-tbl.nv-tbl tbody tr.is-selected,
.nv-tbl.nv-tbl tbody tr[aria-selected="true"] {
  background: var(--dash-surface, rgba(109, 74, 255, 0.09));
}

.nv-tbl.nv-tbl tbody tr:last-child > td {
  border-block-end: 0;
}

.nv-tbl.nv-tbl :is(.is-muted, [data-table-muted]) {
  color: var(--dash-muted, #71717a);
}

.nv-tbl.nv-tbl :is(.is-amount, [data-table-amount]),
.nv-tbl.nv-tbl :is(th, td):has(.nv-money) {
  font-variant-numeric: tabular-nums;
}

.nv-tbl.nv-tbl :is(.is-amount, [data-table-amount]) {
  text-align: end;
}

.nv-tbl.nv-tbl :is(button, a):focus-visible {
  outline: 2px solid var(--dash-accent, #8b6fff);
  outline-offset: 2px;
}

.nv-tbl.nv-tbl .nv-tbl__badge {
  display: inline-flex;
  align-items: center;
  min-block-size: 24px;
  padding-block: 4px;
  padding-inline: 10px;
  border-radius: 999px;
  font-size: var(--nv-type-footnote-size);
  letter-spacing: var(--nv-type-footnote-tracking);
  font-weight: var(--nv-type-weight-medium);
}

.nv-tbl.nv-tbl .nv-tbl__badge--success { background: var(--color-success-soft); color: var(--color-success); }
.nv-tbl.nv-tbl .nv-tbl__badge--warning { background: var(--color-warning-soft); color: var(--color-warning); }
.nv-tbl.nv-tbl .nv-tbl__badge--danger { background: var(--color-error-soft); color: var(--color-error); }
.nv-tbl.nv-tbl .nv-tbl__badge--muted { background: var(--color-well-hover); color: var(--dash-text-secondary, #a1a1aa); }

.nv-tbl.nv-tbl .nv-tbl__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

.nv-tbl.nv-tbl .nv-tbl__action {
  display: grid;
  inline-size: 32px;
  block-size: 32px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--dash-muted, #71717a);
  cursor: pointer;
  transition: background-color 150ms ease, color 150ms ease, scale 150ms ease;
}

.nv-tbl.nv-tbl .nv-tbl__action:hover {
  background: var(--color-well-hover, rgba(255, 255, 255, 0.07));
  color: var(--dash-text, #f4f4f5);
}

.nv-tbl.nv-tbl .nv-tbl__action:active { scale: 0.96; }

/*
 * Wide tables keep their trailing decision column visible while the middle
 * scrolls. JS supplies the offset when Status + Actions travel together.
 */
@container nv-responsive-table (min-width: 35.001rem) {
  .nv-tbl-wrap.is-inline-overflowing .nv-tbl :is(th, td)[data-nv-sticky-trailing] {
    position: sticky;
    inset-inline-end: var(--nv-sticky-inline-end, 0px);
    z-index: 2;
    background: var(--nv-table-sticky-bg, var(--nv-shell-island, #0a0a0b));
    background-clip: padding-box;
  }

  .nv-tbl-wrap.is-inline-overflowing .nv-tbl th[data-nv-sticky-trailing] {
    z-index: 3;
  }

  .nv-tbl-wrap.is-inline-overflowing:not(.is-at-inline-end) .nv-tbl [data-nv-sticky-leading-edge] {
    box-shadow: -12px 0 18px -16px rgb(0 0 0 / 0.95), -1px 0 rgb(255 255 255 / 0.055);
  }

  .nv-tbl-wrap.is-inline-overflowing .nv-tbl tbody tr:hover > [data-nv-sticky-trailing] {
    background: linear-gradient(var(--nv-table-row-hover, rgb(255 255 255 / 0.035)), var(--nv-table-row-hover, rgb(255 255 255 / 0.035))), var(--nv-table-sticky-bg, var(--nv-shell-island, #0a0a0b));
  }

  .nv-tbl-wrap.is-inline-overflowing .nv-tbl tbody tr:is(.is-selected, [aria-selected="true"]) > [data-nv-sticky-trailing] {
    background: linear-gradient(var(--nv-table-row-selected, rgb(109 74 255 / 0.09)), var(--nv-table-row-selected, rgb(109 74 255 / 0.09))), var(--nv-table-sticky-bg, var(--nv-shell-island, #0a0a0b));
  }
}

:dir(rtl) .nv-tbl-wrap.is-inline-overflowing:not(.is-at-inline-end) .nv-tbl [data-nv-sticky-leading-edge] {
  box-shadow: 12px 0 18px -16px rgb(0 0 0 / 0.95), 1px 0 rgb(255 255 255 / 0.055);
}

html.light-theme .nv-tbl-wrap.is-inline-overflowing:not(.is-at-inline-end) .nv-tbl [data-nv-sticky-leading-edge],
html.light .nv-tbl-wrap.is-inline-overflowing:not(.is-at-inline-end) .nv-tbl [data-nv-sticky-leading-edge] {
  box-shadow: -10px 0 16px -14px rgb(31 31 35 / 0.2), -1px 0 rgb(31 31 35 / 0.06);
}

:is(html.light-theme, html.light):dir(rtl) .nv-tbl-wrap.is-inline-overflowing:not(.is-at-inline-end) .nv-tbl [data-nv-sticky-leading-edge] {
  box-shadow: 10px 0 16px -14px rgb(31 31 35 / 0.2), 1px 0 rgb(31 31 35 / 0.06);
}

@media (max-width: 42rem) {
  .nv-tbl-wrap.nv-tbl-wrap {
    border-radius: 14px;
  }

  .nv-tbl.nv-tbl :is(th, td) {
    padding-inline: 12px;
  }
}

/*
 * Small containers use a row-card reading order. The breakpoint follows the
 * table island, not the browser, so the same contract also works beside an
 * aside or inside a narrow design-system preview.
 */
@container nv-responsive-table (max-width: 35rem) {
  /* Row cards grow with their content: fixed desktop row heights would let
     the stacked cells spill into the next row. */
  .nv-o-table__scroll > .nv-o-table__grid > tbody > tr,
  .nv-o-table__scroll > .nv-o-table__grid > tbody > tr > td,
  .nv-tbl-wrap > .nv-tbl > tbody > tr,
  .nv-tbl-wrap > .nv-tbl > tbody > tr > td {
    block-size: auto !important;
    max-block-size: none !important;
  }

  /* The row card owns the island edge; the desktop first/last cell insets
     would push the identity and the last value off the shared edge. */
  .nv-table-edge-frame.nv-table-edge-frame > table.nv-tbl.nv-tbl > tbody > tr > td:nth-child(n),
  .nv-o-table .nv-o-table__scroll > .nv-o-table__grid > tbody > tr > td:nth-child(n) {
    padding-inline: 0 !important;
    width: auto !important;
    inline-size: auto !important;
    min-inline-size: 0 !important;
  }

  .nv-tbl-wrap.nv-tbl-wrap {
    max-block-size: none;
    overflow-x: visible;
    overflow-y: visible;
    scrollbar-gutter: auto;
  }

  :where(.nv-tbl-wrap > .nv-tbl),
  :where(.nv-tbl-wrap > .nv-tbl > tbody) {
    display: block;
    inline-size: 100%;
    min-inline-size: 0 !important;
  }

  :where(.nv-tbl-wrap > .nv-tbl > thead) {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 16px;
    min-inline-size: 0;
    padding: 16px var(--nv-table-edge-inline);
    border-block-end: 1px solid var(--color-border-secondary, rgba(255, 255, 255, 0.08));
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr:last-child) {
    border-block-end: 0;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td) {
    display: flex;
    inline-size: auto !important;
    min-inline-size: 0 !important;
    block-size: auto;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 !important;
    border: 0;
    text-align: end !important;
    white-space: normal;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td)::before {
    min-inline-size: 0;
    color: var(--dash-muted, #71717a);
    content: attr(data-nv-label);
    font-size: var(--nv-type-footnote-size);
    letter-spacing: var(--nv-type-footnote-tracking);
    font-weight: var(--nv-type-weight-medium);
    text-align: start;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td[data-nv-primary]) {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-block-end: 4px !important;
    text-align: start !important;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td[data-nv-primary])::before,
  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td[colspan])::before,
  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td[data-nv-label=""])::before {
    display: none;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td[colspan]) {
    grid-column: 1 / -1;
    justify-content: stretch;
    text-align: start !important;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td[data-nv-control]) {
    justify-self: end;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr > td[data-nv-control]:last-child) {
    grid-column: 2;
    grid-row: 1;
  }

  :where(.nv-tbl-wrap > .nv-tbl > tbody > tr:has(> td[data-nv-control]:last-child) > td[data-nv-primary]) {
    grid-column: 1;
    grid-row: 1;
  }

  :where(.nv-tbl-wrap :is(td, td > *, td > * > *)) {
    min-inline-size: 0;
    max-inline-size: 100%;
    overflow-wrap: anywhere;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nv-tbl.nv-tbl tbody tr,
  .nv-tbl.nv-tbl .nv-tbl__action {
    transition-duration: 0.01ms;
  }
}

@media (forced-colors: active) {
  .nv-tbl.nv-tbl tbody tr:focus-within,
  .nv-tbl.nv-tbl tbody tr.is-focused,
  .nv-tbl.nv-tbl :is(button, a):focus-visible {
    outline-color: Highlight;
  }
}