@layer pages {
  .manager-invoices {
    margin: 2em 0;
  }

  .manager-invoices__header {
    display: flex;
    align-items: center;
    gap: 1.6em;
    margin-bottom: 1em;
  }

  .manager-invoices__header h2 {
    margin: 0;
  }

  .manager-invoices__sync-info {
    font-size: 1.2em;
    color: var(--neutral-500);
  }

  .manager-invoices__summary {
    margin-bottom: 1em;
    font-size: 1.4em;
  }

  .manager-invoice-status {
    display: inline-block;
    padding: 0.2em 0.8em;
    border-radius: 4px;
    font-size: 1.2em;
    font-weight: 500;
  }

  .manager-invoice-status--paid {
    background: var(--success-100, #dcfce7);
    color: var(--success-700, #15803d);
  }

  .manager-invoice-status--unpaid {
    background: var(--warning-100, #fef9c3);
    color: var(--warning-700, #a16207);
  }

  .manager-invoice-status--overdue {
    background: var(--danger-100, #fee2e2);
    color: var(--danger-700, #b91c1c);
  }

  .manager-customers__summary {
    margin-bottom: 1.6em;
    font-size: 1.4em;
    color: var(--neutral-600);
  }

  .manager-customers__unmapped {
    background: var(--warning-50, #fffbeb);
  }
}