.ipay-btn,
button.ipay-btn,
a.ipay-btn {
  min-height: var(--ipay-button-height);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  border: 1px solid var(--ipay-border);
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  color: var(--ipay-text-primary);
  text-decoration: none;
  font-weight: 700;
  cursor: pointer;
  transition: background var(--ipay-transition), border-color var(--ipay-transition), color var(--ipay-transition);
}

.ipay-btn:hover {
  border-color: var(--ipay-border-strong);
  background: var(--ipay-surface-muted);
}

.ipay-btn-primary {
  border-color: var(--ipay-primary);
  background: var(--ipay-primary);
  color: #fff;
}

.ipay-btn-primary:hover {
  border-color: var(--ipay-primary-hover);
  background: var(--ipay-primary-hover);
  color: #fff;
}

.ipay-input,
.ipay-select,
input.ipay-input,
select.ipay-select {
  min-height: var(--ipay-input-height);
  padding: 0 12px;
  border: 1px solid var(--ipay-border);
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  color: var(--ipay-text-primary);
}

.ipay-card,
.summary-card,
.table-container,
.ledger-wrapper,
.analytics-container,
.pages-table-container {
  border-radius: var(--ipay-radius) !important;
  border-color: var(--ipay-border) !important;
  box-shadow: var(--ipay-shadow-soft);
}

.ipay-status-badge,
.badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 22px;
  padding: 3px 9px;
  border-radius: 999px !important;
  font-size: var(--ipay-font-small);
  font-weight: 700;
  line-height: 1.2;
}

.ipay-status-success {
  background: var(--ipay-success-soft);
  color: var(--ipay-success);
}

.ipay-status-warning {
  background: var(--ipay-warning-soft);
  color: var(--ipay-warning);
}

.ipay-status-error {
  background: var(--ipay-error-soft);
  color: var(--ipay-error);
}

.ipay-status-info {
  background: var(--ipay-info-soft);
  color: var(--ipay-info);
}

table {
  border-collapse: collapse;
}

th {
  color: var(--ipay-text-secondary);
  font-size: var(--ipay-font-table);
}

td {
  min-height: var(--ipay-table-row-height);
  font-size: var(--ipay-font-table);
}

.tab,
.ipay-tab {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  border-radius: var(--ipay-radius);
  transition: background var(--ipay-transition), color var(--ipay-transition), border-color var(--ipay-transition);
}

.tab.active,
.ipay-tab.is-active {
  color: var(--ipay-primary) !important;
  border-color: var(--ipay-primary) !important;
}

.ipay-alert {
  display: flex;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--ipay-border);
  border-left: 4px solid var(--ipay-info);
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  color: var(--ipay-text-primary);
  box-shadow: var(--ipay-shadow-soft);
}

.ipay-alert-warning {
  border-left-color: var(--ipay-warning);
}

.ipay-alert-error {
  border-left-color: var(--ipay-error);
}

.ipay-alert-success {
  border-left-color: var(--ipay-success);
}

.ipay-empty-state,
.ipay-placeholder-state {
  display: grid;
  place-items: center;
  min-height: 280px;
  padding: 36px 24px;
  border: 1px dashed var(--ipay-border-strong);
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  text-align: center;
}

.ipay-empty-state h2,
.ipay-placeholder-state h2 {
  margin: 0 0 8px;
  font-size: 22px;
  color: var(--ipay-text-primary);
}

.ipay-empty-state p,
.ipay-placeholder-state p {
  max-width: 620px;
  margin: 0 auto;
  color: var(--ipay-text-secondary);
  line-height: 1.6;
}

.ipay-modal {
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  box-shadow: var(--ipay-shadow);
}

.ipay-toast-region {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1000;
  display: grid;
  gap: 10px;
}

.ipay-toast {
  min-width: 260px;
  padding: 12px 14px;
  border: 1px solid var(--ipay-border);
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  box-shadow: var(--ipay-shadow);
  color: var(--ipay-text-primary);
}

.ipay-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}

.ipay-pagination a,
.ipay-pagination button {
  min-width: 34px;
  height: 34px;
  border: 1px solid var(--ipay-border);
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  color: var(--ipay-text-primary);
}

.ipay-legacy-banner {
  margin-bottom: var(--ipay-page-gap);
}

.ipay-user-block {
  position: relative;
}

.ipay-profile-dropdown {
  position: absolute;
  display: none;
  right: 0;
  top: calc(100% + 8px);
  min-width: 190px;
  border: 1px solid var(--ipay-border);
  border-radius: var(--ipay-radius);
  background: var(--ipay-surface);
  box-shadow: var(--ipay-shadow);
  overflow: hidden;
}

.ipay-profile-dropdown.show {
  display: block;
}

.ipay-profile-dropdown a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  color: var(--ipay-text-primary);
  text-decoration: none;
  font-size: 13px;
}

.ipay-profile-dropdown a:hover {
  background: var(--ipay-surface-muted);
  color: var(--ipay-primary);
}

.ipay-nav-lock {
  margin-left: auto;
  color: var(--ipay-text-tertiary, #8b95a5);
  font-size: 11px;
}

.ipay-nav-child.is-locked,
.ipay-nav-link.is-locked,
.ipay-nav-parent.is-locked {
  color: var(--ipay-text-secondary);
}

.ipay-merchant-status {
  display: inline-flex;
  width: max-content;
  margin-top: 3px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--ipay-warning-soft);
  color: var(--ipay-warning);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}

.ipay-merchant-status[data-status="ACTIVE"] {
  background: var(--ipay-success-soft);
  color: var(--ipay-success);
}

.ipay-merchant-status[data-status="SUSPENDED"],
.ipay-merchant-status[data-status="CLOSED"] {
  background: var(--ipay-error-soft);
  color: var(--ipay-error);
}

.ipay-capability-gate {
  display: grid;
  grid-template-columns: auto minmax(0, 620px);
  justify-content: center;
  gap: 20px;
  min-height: 420px;
  padding: 72px 28px;
  border: 1px solid var(--ipay-border);
  border-radius: var(--ipay-radius-lg, 12px);
  background: var(--ipay-surface);
  box-shadow: var(--ipay-shadow-soft);
}

.ipay-capability-gate-icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--ipay-warning-soft);
  color: var(--ipay-warning);
  font-size: 20px;
}

.ipay-capability-gate h2 {
  margin: 5px 0 8px;
  font-size: 24px;
}

.ipay-capability-gate p {
  margin: 0;
  color: var(--ipay-text-secondary);
  line-height: 1.6;
}

.ipay-capability-label {
  color: var(--ipay-text-secondary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
}

.ipay-capability-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

@media (max-width: 640px) {
  .ipay-capability-gate {
    grid-template-columns: 1fr;
    padding: 36px 20px;
  }
}