/* Billing page (design-port 2026-08-25, docs/design/review/pages/billing.html).
   Card chrome, micro-labels, pills, chips and .plan-* blocks are global
   (dashboard.css); this file owns the design's page-scoped block only.
   Tokens only; specificity instead of the design's !important. */

/* Two card rows: Current plan ‖ Manage plan, Payment method ‖ Founding. */
.billing-pair {
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr;
  align-items: stretch;
  margin: 16px 0;
}

@media (min-width: 1000px) {
  .billing-pair { grid-template-columns: 1fr 1fr; }
}

/* Equal-height pair; (0,1,1) beats the base .k-card margin without !important. */
.billing-pair > .k-card {
  height: 100%;
  box-sizing: border-box;
  margin: 0;
}

.billing-pair .plan-option { padding: 10px 0; }

/* Owner-gate (C6): the member banner under the page head, and disabled
   plan controls that stay visible but inert. */
.billing-owner-note {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--ink3);
  font-size: 13px;
  margin: 0 0 14px;
}

body:not(.landing) .billing-pair button.btn-pill[disabled],
body:not(.landing) .billing-pair button.btn-pill[disabled]:hover {
  color: var(--ink3);
  border-color: var(--line-10);
  cursor: not-allowed;
  opacity: 0.7;
}
/* A45 statements: print cleanly */
@media print {
  .app-sidebar, .no-print, nav, .footer, .flash { display: none !important; }
  .statement { padding: 0; }
  .statement .k-card { break-inside: avoid; border: 1px solid #999; box-shadow: none; }
  .statement table { font-size: 11px; }
}

