/* Check Payment Status tab — lookup toggle, status card and status pill styling. */

.status-lookup-toggle {
  display: inline-flex;
  background: #fff;
  border: 1px solid #eadfc9;
  border-radius: 999px;
  padding: 4px;
  margin-top: 16px;
  box-shadow: var(--shadow);
}
.toggle-btn {
  background: transparent;
  color: var(--maroon);
  border: none;
  padding: 8px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.toggle-btn.active { background: var(--maroon); color: #fff; }

.lookup-panel { display: none; }
.lookup-panel.active { display: block; }

.status-form { max-width: 400px; margin-top: 20px; }
#statusResult { margin-top: 24px; max-width: 500px; }
.status-card {
  background: #fff;
  border-radius: var(--radius);
  padding: 20px;
  border-left: 6px solid #ccc;
}
.status-card.pending { border-left-color: var(--pending); }
.status-card.approved { border-left-color: var(--success); }
.status-card.rejected { border-left-color: var(--danger); }
.status-card h4 { margin-top: 0; }
.status-pill {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
}
.status-pill.pending { background: var(--pending); }
.status-pill.approved { background: var(--success); }
.status-pill.rejected { background: var(--danger); }