/* PowerCredit component styles. Load after tokens.css. Every value comes from a token.
   Class prefix: pc-. Works as plain CSS in Laravel Blade views; no JavaScript required. */

.pc-root { font-family: var(--font-text); color: var(--ink); background: var(--ground); font-size: 17px; line-height: 26px; }
.pc-root *, .pc-root *::before, .pc-root *::after { box-sizing: border-box; }

/* ---------- Button ---------- */
.pc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: 48px; padding: 0 var(--space-5);
  font: 620 17px/1 var(--font-text); text-decoration: none; cursor: pointer;
  border-radius: var(--radius-md); border: 2px solid transparent;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.pc-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.pc-btn svg { width: 20px; height: 20px; flex: none; }
.pc-btn--primary { background: var(--paddock); color: var(--on-paddock); }
.pc-btn--primary:hover { background: var(--paddock-hover); }
.pc-btn--secondary { background: var(--surface); color: var(--paddock); border-color: var(--paddock); }
.pc-btn--secondary:hover { background: var(--paddock-tint); }
.pc-btn--quiet { background: transparent; color: var(--paddock); padding: 0 var(--space-3); }
.pc-btn--quiet:hover { background: var(--paddock-tint); }
.pc-btn--danger { background: var(--surface); color: var(--danger); border-color: var(--danger); }
.pc-btn--danger:hover { background: var(--danger-tint); }
.pc-btn--sm { min-height: 36px; padding: 0 var(--space-3); font-size: 15px; border-width: 1.5px; }
.pc-btn--block { width: 100%; }
.pc-btn[disabled], .pc-btn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }

/* ---------- Field ---------- */
.pc-field { display: grid; gap: var(--space-2); }
.pc-field__label { font: 620 16px/22px var(--font-text); color: var(--ink); }
.pc-field__help { font: 400 14px/20px var(--font-text); color: var(--ink-muted); }
.pc-field__error { font: 620 14px/20px var(--font-text); color: var(--danger); display: flex; gap: var(--space-1); align-items: flex-start; }
.pc-input {
  width: 100%; min-height: 48px; padding: var(--space-3);
  font: 400 17px/24px var(--font-text); color: var(--ink);
  background: var(--surface); border: 1.5px solid var(--line-strong); border-radius: var(--radius-sm);
}
.pc-input::placeholder { color: var(--ink-muted); }
.pc-input:focus { outline: 2px solid var(--focus); outline-offset: 1px; border-color: var(--focus); }
.pc-input[aria-invalid="true"] { border-color: var(--danger); border-width: 2px; }
.pc-input[readonly] { background: var(--surface-sunk); }

/* ---------- Address check (signature component) ---------- */
.pc-check {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md);
  box-shadow: var(--shadow-raise); padding: var(--space-5); display: grid; gap: var(--space-4);
}
.pc-check__title { font: 700 22px/28px var(--font-display); margin: 0; }
.pc-check__row { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.pc-check__row .pc-input { flex: 1 1 260px; }
.pc-check__row .pc-btn { flex: 0 0 auto; }
.pc-check__note { font: 400 14px/20px var(--font-text); color: var(--ink-muted); margin: 0; }
.pc-check__scope { font: 650 12.5px/16px var(--font-text); letter-spacing: .07em; text-transform: uppercase; color: var(--paddock); }

/* ---------- Eligibility result ---------- */
.pc-result { border-radius: var(--radius-md); padding: var(--space-5); display: grid; gap: var(--space-3); border: 1px solid var(--line); background: var(--surface); }
.pc-result__head { display: flex; gap: var(--space-3); align-items: flex-start; }
.pc-result__icon { width: 40px; height: 40px; flex: none; border-radius: var(--radius-round); display: grid; place-items: center; }
.pc-result__icon svg { width: 22px; height: 22px; }
.pc-result__title { font: 700 22px/28px var(--font-display); margin: 0; }
.pc-result__body { margin: 0; }
.pc-result--eligible { background: var(--wattle-tint); border-color: transparent; }
.pc-result--eligible .pc-result__icon { background: var(--wattle); color: var(--on-wattle); }
.pc-result--other { background: var(--paddock-tint); border-color: transparent; }
.pc-result--other .pc-result__icon { background: var(--paddock); color: var(--on-paddock); }
.pc-result--outside .pc-result__icon { background: var(--surface-sunk); color: var(--ink-muted); }
.pc-result__projects { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.pc-result__project { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); flex-wrap: wrap; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: var(--space-3) var(--space-4); }
.pc-result__project strong { font-weight: 650; }
.pc-amount { font: 760 40px/44px var(--font-display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.pc-amount--sm { font-size: 22px; line-height: 28px; }

/* ---------- Status pill ---------- */
.pc-pill {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 8px;
  border-radius: var(--radius-round); font: 650 12.5px/16px var(--font-text); letter-spacing: .07em; text-transform: uppercase; white-space: nowrap;
}
.pc-pill::before { content: ""; width: 8px; height: 8px; border-radius: var(--radius-round); background: currentColor; }
.pc-pill--submitted { color: var(--info); background: var(--info-tint); }
.pc-pill--info-needed { color: var(--warning); background: var(--warning-tint); }
.pc-pill--approved { color: var(--paddock); background: var(--paddock-tint); }
.pc-pill--invoiced { color: var(--ink); background: var(--surface-sunk); }
.pc-pill--paid { color: var(--success); background: var(--success-tint); }
.pc-pill--paid::before { background: var(--wattle); box-shadow: 0 0 0 1.5px var(--success); }
.pc-pill--rejected { color: var(--danger); background: var(--danger-tint); }

/* ---------- Stat ---------- */
.pc-stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); padding: var(--space-4) var(--space-5); display: grid; gap: var(--space-1); min-width: 0; }
.pc-stat__label { font: 650 12.5px/16px var(--font-text); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-muted); }
.pc-stat__value { font: 760 30px/36px var(--font-display); letter-spacing: -.015em; font-variant-numeric: tabular-nums; }
.pc-stat__meta { font: 400 14px/20px var(--font-text); color: var(--ink-muted); }

/* ---------- Claim table ---------- */
.pc-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.pc-table { width: 100%; border-collapse: collapse; font: 400 15px/22px var(--font-text); font-variant-numeric: tabular-nums; }
.pc-table th { text-align: left; font: 650 12.5px/16px var(--font-text); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-muted); background: var(--surface-sunk); padding: var(--space-3); white-space: nowrap; }
.pc-table td { padding: var(--space-3); border-top: 1px solid var(--line); vertical-align: middle; }
.pc-table tr:hover td { background: var(--paddock-tint); }
.pc-table .num { text-align: right; }
.pc-table .ref { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 14px; }

/* ---------- Co-brand strip ---------- */
.pc-powered { display: inline-flex; align-items: center; gap: var(--space-2); font: 400 14px/20px var(--font-text); color: var(--ink-muted); }
.pc-powered img { height: 20px; width: auto; }
