/* =====================================================================
   parteco.in — Phase 2 additions: Cart, Checkout, Payment styles
   Append this to parteco.css or keep as separate file
   ===================================================================== */

/* ── Form inputs ── */
.pt-form-input {
  border: 1.5px solid var(--pt-border);
  border-radius: 8px;
  font-size: .9rem;
  padding: .6rem .9rem;
  background: var(--pt-surface);
  color: var(--pt-text);
  transition: border-color .15s, box-shadow .15s;
}
.pt-form-input:focus {
  border-color: var(--pt-accent);
  box-shadow: 0 0 0 3px rgba(255,106,57,.12);
  outline: none;
  background: var(--pt-surface);
}
.pt-form-input::placeholder { color: var(--pt-text-muted); }

/* ── Cart table ── */
#cart-table { border-collapse: separate; border-spacing: 0; }
#cart-table td, #cart-table th { border-bottom: 1px solid var(--pt-border); vertical-align: middle; }
#cart-table tbody tr:last-child td { border-bottom: none; }
#cart-table tbody tr:hover td { background: var(--pt-bg); }

/* ── Progress steps ── */
.pt-checkout-steps { display: flex; align-items: center; gap: 0; margin-bottom: 2rem; }
.pt-step { display: flex; align-items: center; gap: .5rem; font-size: .8125rem; font-weight: 600; color: var(--pt-text-muted); }
.pt-step.active { color: var(--pt-accent); }
.pt-step.done   { color: var(--pt-success); }
.pt-step-num { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; border: 2px solid var(--pt-border); background: var(--pt-surface); }
.pt-step.active .pt-step-num { border-color: var(--pt-accent); background: var(--pt-accent); color: #fff; }
.pt-step.done   .pt-step-num { border-color: var(--pt-success); background: var(--pt-success); color: #fff; }
.pt-step-divider { flex: 1; height: 2px; background: var(--pt-border); margin: 0 .5rem; max-width: 60px; }
.pt-step.done + .pt-step-divider { background: var(--pt-success); }

/* ── Payment badges ── */
.pt-payment-methods { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .75rem; }
.pt-pay-badge { padding: .25rem .6rem; border-radius: 6px; border: 1px solid var(--pt-border); font-size: .7rem; color: var(--pt-text-muted); background: var(--pt-bg); display: flex; align-items: center; gap: .3rem; }

/* ── Confirm page ── */
.pt-confirm-step { text-align: center; }
.pt-confirm-step .step-icon { width: 44px; height: 44px; border-radius: 50%; background: var(--pt-accent-soft); display: inline-flex; align-items: center; justify-content: center; margin-bottom: .5rem; }

/* ── Responsive ── */
@media (max-width: 576px) {
  #cart-table th:nth-child(3),
  #cart-table td:nth-child(3) { display: none; } /* hide qty column on mobile */
}
