/* Finance > Accounting — reuses Billing's tabs/filter bar/list card, the base
   table recipe (.plx-fin-pd-table) and the Payments chrome; only the
   account-type tags, statement layouts and the Journal Entry modal are new. */
.plx-fin-ac-list-header {
  align-items: center;
}

.plx-fin-ac-header-btn {
  align-items: center;
  display: inline-flex;
  gap: var(--space-1);
  margin-left: auto;
}

.plx-fin-ac-period {
  background: var(--bg-card);
  border-radius: var(--radius-full);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  font-weight: var(--weight-regular);
  margin-left: auto;
  padding: var(--space-1) var(--space-3);
}

.plx-fin-ac-prop-card {
  margin-bottom: var(--space-4);
}

/* Outlined account-type / journal-type tags. */
.plx-fin-ac-tag {
  background: transparent;
  border: 1px solid currentColor;
  border-radius: var(--radius-full);
  display: inline-block;
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  line-height: normal;
  padding: 2px var(--space-3);
}

.plx-fin-ac-tag-asset {
  color: var(--color-info);
}

.plx-fin-ac-tag-liability {
  color: var(--color-danger);
}

.plx-fin-ac-tag-equity {
  color: #B23CD6;
}

.plx-fin-ac-tag-revenue {
  color: var(--color-success);
}

.plx-fin-ac-tag-expense {
  color: var(--color-warning);
}

.plx-fin-ac-tag-btn {
  cursor: pointer;
}

.plx-fin-ac-green {
  color: var(--color-success);
}

.plx-fin-ac-red {
  color: var(--color-danger);
}

.plx-fin-ac-blue {
  color: var(--color-info);
}

.plx-fin-ac-purple {
  color: #B23CD6;
}

.plx-fin-ac-group-row td {
  background: var(--bg-thead);
  color: var(--text-secondary);
}

.plx-fin-ac-group-name {
  color: var(--color-info);
}

.plx-fin-ac-totals td {
  background: var(--bg-thead);
  font-weight: var(--weight-semibold);
}

.plx-fin-ac-balanced {
  align-items: center;
  font-weight: var(--weight-semibold);
}

/* Statements (P&L / Balance Sheet / Cash Flow) */
.plx-fin-ac-statement {
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.plx-fin-ac-section-title {
  border-bottom: 1px solid var(--border-default);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  padding: var(--space-2) var(--space-3);
}

.plx-fin-ac-empty-row {
  border-bottom: 1px solid var(--border-default);
  color: var(--text-muted);
  font-size: var(--text-sm);
  font-style: italic;
  padding: var(--space-2) var(--space-3);
}

.plx-fin-ac-total-row,
.plx-fin-ac-line-row {
  align-items: center;
  display: flex;
  font-size: var(--text-sm);
  justify-content: space-between;
  padding: var(--space-2) var(--space-3);
}

.plx-fin-ac-total-row {
  background: var(--bg-thead);
  font-weight: var(--weight-semibold);
}

.plx-fin-ac-line-row {
  border-bottom: 1px solid var(--border-default);
  color: var(--text-muted);
}

.plx-fin-ac-grand-row {
  align-items: center;
  background: var(--bg-thead);
  color: var(--pm-primary);
  display: flex;
  font-size: var(--text-lg);
  font-weight: var(--weight-bold);
  justify-content: space-between;
  padding: var(--space-3);
}

.plx-fin-ac-grand-row .plx-fin-ac-green {
  font-size: var(--text-xl);
}

.plx-fin-ac-bs-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.plx-fin-ac-bs-col:first-child {
  border-right: 1px solid var(--border-default);
}

.plx-fin-ac-cf-head,
.plx-fin-ac-cf-net {
  display: grid;
  grid-template-columns: 1fr 140px 140px;
}

.plx-fin-ac-cf-head {
  border-bottom: 1px solid var(--border-default);
  font-weight: var(--weight-semibold);
  padding: var(--space-2) var(--space-3);
}

.plx-fin-ac-cf-head span:not(:first-child),
.plx-fin-ac-cf-net span:not(:first-child) {
  text-align: right;
}

/* Journal Entry modal */
.plx-fin-ac-modal-grid {
  display: grid;
  gap: 0 var(--space-4);
  grid-template-columns: repeat(2, 1fr);
}

.plx-fin-ac-modal-grid .plx-input.plx-fin-ref-readonly {
  background: var(--bg-card);
}

.plx-fin-ac-lines {
  margin-bottom: var(--space-3);
}

.plx-fin-ac-lines-head,
.plx-fin-ac-line {
  align-items: center;
  display: grid;
  gap: var(--space-2);
  grid-template-columns: 1.4fr 1fr 1fr 24px;
}

.plx-fin-ac-lines-head {
  border-bottom: 1px solid var(--border-default);
  color: var(--pm-primary);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  padding: var(--space-2) 0;
}

.plx-fin-ac-lines-head span:nth-child(2),
.plx-fin-ac-lines-head span:nth-child(3),
.plx-fin-ac-line .plx-input {
  text-align: right;
}

.plx-fin-ac-line {
  padding: var(--space-2) 0;
}

.plx-fin-ac-line-remove {
  background: none;
  border: 0;
  color: var(--color-danger);
  cursor: pointer;
  font-size: var(--text-lg);
  line-height: 1;
}

.plx-fin-ac-add-line {
  align-items: center;
  display: inline-flex;
  gap: var(--space-1);
  margin-top: var(--space-2);
}

.plx-fin-ac-balance {
  align-items: center;
  display: flex;
  font-size: var(--text-sm);
  gap: var(--space-1);
  margin: var(--space-3) 0 var(--space-4);
}

/* Date range text ("Jan, 2026 → Jun, 2026") needs more room than the shared filter-bar slot. */
.plx-fin-ac-bar .plx-date-filter {
  flex: 0 0 auto;
  min-width: 190px;
}

/* Figma: the table/statement wrapper cards on this page are white, not
   Billing's muted --bg-card. */
.plx-tab-panel .plx-fin-invoice-list {
  background: var(--bg-surface);
}

/* Six tabs: when the row still overflows (narrow widths) it scrolls by
   swipe/wheel without painting the thin scrollbar under the tab underline. */
.plx-fin-ac-tabs {
  scrollbar-width: none;
}

.plx-fin-ac-tabs::-webkit-scrollbar {
  display: none;
}

/* ==========================================================================
   MEDIA QUERIES — all breakpoints for this file, grouped by tier
   (0–575.98 / 576–767.98 / 768–991.98 / 992–1199.98 / 1200–1399.98 / 1400+),
   one block per range, kept together here at the bottom of the file.
   ========================================================================== */

@media (max-width: 575.98px) {
  .plx-fin-ac-bs-grid,
  .plx-fin-ac-modal-grid {
    grid-template-columns: 1fr;
  }

  .plx-fin-ac-bs-col:first-child {
    border-right: 0;
  }

  .plx-fin-ac-cf-head,
  .plx-fin-ac-cf-net {
    grid-template-columns: 1fr 90px 90px;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .plx-fin-ac-bs-grid,
  .plx-fin-ac-modal-grid {
    grid-template-columns: 1fr;
  }

  .plx-fin-ac-bs-col:first-child {
    border-right: 0;
  }

  .plx-fin-ac-cf-head,
  .plx-fin-ac-cf-net {
    grid-template-columns: 1fr 90px 90px;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .plx-fin-ac-tabs {
    gap: var(--space-2);
  }

  .plx-fin-ac-tabs .plx-tab {
    padding-inline: var(--space-2);
  }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
  .plx-fin-ac-tabs .plx-tab {
    padding-inline: var(--space-5);
  }
}