.checkout-body {
  min-height: 100vh;
  background: #f5ead0;
}

.checkout-header {
  min-height: 68px;
  padding: 0.8rem clamp(1rem, 4vw, 3rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: #f2e5c0;
  background: linear-gradient(135deg, #0d0500, #2c1002);
  border-bottom: 2px solid #c87830;
}

.checkout-header p { margin: 0; font-size: 0.9rem; }
.checkout-logo img { display: block; width: 120px; max-height: 44px; object-fit: contain; }

.checkout-shell {
  width: min(1160px, calc(100% - 2rem));
  margin: 2rem auto 3rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 1.5rem;
  align-items: start;
}

.checkout-flow,
.checkout-summary {
  background: rgba(255, 250, 236, 0.96);
  border: 1px solid rgba(92, 46, 0, 0.2);
  border-radius: 18px;
  box-shadow: 0 16px 45px rgba(42, 18, 0, 0.12);
}

.checkout-flow { padding: clamp(1.1rem, 3vw, 2.2rem); }
.checkout-summary { padding: 1.4rem; position: sticky; top: 1rem; }
.checkout-intro h1, .checkout-panel h2, .checkout-summary h2 {
  font-family: 'Cinzel', serif;
  color: #3d1500;
}
.checkout-intro h1 { line-height: 1.15; margin: 0.15rem 0 0.5rem; }
.checkout-kicker { color: #9b4e14; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; }

.checkout-steps {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.4rem;
  margin: 1.7rem 0;
  padding: 0;
}
.checkout-steps li { color: #786650; font-size: 0.75rem; text-align: center; }
.checkout-steps span {
  width: 2rem;
  height: 2rem;
  margin: 0 auto 0.35rem;
  display: grid;
  place-items: center;
  border: 1px solid #c9b899;
  border-radius: 999px;
  background: #fffaf0;
  font-weight: 800;
}
.checkout-steps .is-active { color: #5c2e00; font-weight: 800; }
.checkout-steps .is-active span, .checkout-steps .is-complete span {
  color: white;
  border-color: #9b4e14;
  background: #9b4e14;
}

.checkout-status { margin: 0 0 1rem; padding: 0.8rem 1rem; border-radius: 10px; background: #fff3cd; color: #5b4300; }
.checkout-status.is-error { background: #f9d9d6; color: #701b14; }
.checkout-panel { border-top: 1px solid #dfd0b1; padding-top: 1.4rem; }
.checkout-panel h2 { margin-bottom: 0.35rem; }
.checkout-panel > p { color: #665540; }

.checkout-product {
  margin: 1rem 0 1.3rem;
  padding: 1rem;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  border-radius: 12px;
  background: #f6e6bd;
}
.checkout-product img { width: 92px; height: 92px; object-fit: cover; border-radius: 9px; }
.checkout-product h3 { margin: 0; font-size: 1rem; }
.checkout-product p { color: #6f5b43; margin-bottom: 0.6rem; }
.checkout-product label { display: block; font-size: 0.8rem; font-weight: 800; }
.checkout-product select { margin: 0.2rem 0; padding: 0.45rem; border-radius: 7px; }
.checkout-product small { display: block; color: #7c654b; }

.checkout-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.2rem 0; }
.checkout-grid label { display: grid; gap: 0.3rem; color: #49341f; font-size: 0.88rem; font-weight: 800; }
.checkout-span-2 { grid-column: span 2; }
.checkout-grid input, .checkout-grid select {
  width: 100%;
  min-height: 46px;
  padding: 0.7rem 0.8rem;
  border: 1px solid #bda987;
  border-radius: 9px;
  background: #fffdf7;
  color: #2a1200;
  font: inherit;
}
.checkout-grid input:focus { outline: 3px solid rgba(224, 160, 64, 0.32); border-color: #9b4e14; }
.checkout-privacy { font-size: 0.83rem; }
.checkout-field-status { min-height: 1.1em; color: #6f5b43; font-weight: 600; }

.checkout-primary {
  width: 100%;
  min-height: 50px;
  padding: 0.75rem 1rem;
  border: 0;
  border-radius: 10px;
  color: white;
  background: linear-gradient(135deg, #9b4e14, #6d2f06);
  font: 800 0.95rem 'Nunito', sans-serif;
  cursor: pointer;
}
.checkout-primary:hover:not(:disabled) { filter: brightness(1.08); }
.checkout-primary:disabled { cursor: not-allowed; opacity: 0.48; }
.checkout-back {
  width: 100%;
  min-height: 46px;
  margin-top: 0.75rem;
  padding: 0.7rem 1rem;
  border: 1px solid #8f480f;
  border-radius: 10px;
  color: #6d2f06;
  background: transparent;
  font: 800 0.95rem 'Nunito', sans-serif;
  cursor: pointer;
}
.checkout-back:hover { background: rgba(155, 78, 20, 0.08); }

.checkout-pending { margin: 1rem 0; padding: 1rem; border: 1px dashed #b98742; border-radius: 10px; background: #fff5db; }
.checkout-shipping-options { display: grid; gap: 0.75rem; margin: 1rem 0; }
.checkout-shipping-option {
  align-items: center;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid #c8b28e;
  border-radius: 10px;
  display: flex;
  gap: 0.75rem;
  padding: 1rem;
}
.checkout-payment-options { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; margin: 1rem 0; }
.checkout-payment-options button { min-height: 54px; border: 1px solid #c8b28e; border-radius: 9px; }
.checkout-payment-options button:not(:disabled) { cursor: pointer; background: #fff8e7; color: #5c2e00; font-weight: 800; }
.checkout-payment-options button[aria-pressed="true"] { border-color: #9b4e14; box-shadow: 0 0 0 2px rgba(155, 78, 20, 0.2); background: #f6e6bd; }
.checkout-installments { display: grid; gap: 0.35rem; margin: 0.8rem 0 1rem; color: #5c2e00; font-weight: 700; }
.checkout-installments select { width: 100%; min-height: 44px; border: 1px solid #c8b28e; border-radius: 8px; background: #fff; color: inherit; padding: 0.55rem; font: inherit; }
.checkout-installments small { color: #704b00; font-weight: 500; }
.checkout-card-form { margin-top: 1rem; padding: 1rem; border: 1px solid #d6c19b; border-radius: 12px; background: #fffaf0; }
.checkout-card-form > p { margin-top: 0; color: #665540; font-size: 0.86rem; }
.checkout-pix-panel { margin-top: 1rem; padding: 1rem; border: 1px solid #d6c19b; border-radius: 12px; background: #fffaf0; }
.checkout-pix-panel h3 { margin-top: 0; }
.checkout-pix-panel > .checkout-primary { margin-top: 0.75rem; }
.checkout-pix-deadline { padding: 0.7rem 0.8rem; border-radius: 8px; background: #fff0c7; color: #5c4300; text-align: center; }
.checkout-pix-deadline strong { font-variant-numeric: tabular-nums; }
.checkout-pix-panel img { display: block; width: min(240px, 100%); height: auto; aspect-ratio: 1; margin: 1rem auto; border: 8px solid #fff; border-radius: 8px; }
.checkout-pix-panel textarea { width: 100%; resize: vertical; overflow-wrap: anywhere; font: 0.78rem/1.35 ui-monospace, SFMono-Regular, Consolas, monospace; }
.checkout-pix-status { margin-bottom: 0; font-weight: 800; color: #665540; }
.checkout-pix-status.is-paid { color: #205b2d; }
.checkout-secondary { min-height: 44px; margin-top: 0.75rem; padding: 0.65rem 1rem; border: 1px solid #9d6b2d; border-radius: 8px; background: #fff; color: #5c2e00; font-weight: 800; cursor: pointer; }
.checkout-payment-result { margin-top: 1rem; padding: 1rem; border-radius: 10px; background: #e4f4e8; color: #205b2d; font-weight: 800; }
.checkout-payment-result.is-error { background: #fbe2df; color: #8f241c; }
.checkout-payment-result.is-pending { background: #fff0c7; color: #704b00; }
.checkout-payment-result.is-pending::before { content: ""; display: inline-block; width: 0.85rem; height: 0.85rem; margin-right: 0.55rem; vertical-align: -0.12rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: checkout-spin 0.8s linear infinite; }
@keyframes checkout-spin { to { transform: rotate(360deg); } }

.checkout-summary dl { margin: 1rem 0; }
.checkout-summary dl div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.65rem 0; border-bottom: 1px solid #e5d7bb; }
.checkout-summary dd { margin: 0; font-weight: 800; text-align: right; }
.checkout-total { font-size: 1.08rem; }
.checkout-summary ul { padding-left: 1.1rem; color: #65523c; font-size: 0.85rem; }
.checkout-summary li { margin-bottom: 0.4rem; }

.checkout-footer {
  padding: 1.2rem;
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  color: #e9d9b3;
  background: #1a0a00;
  font-size: 0.85rem;
}
.checkout-footer a { color: #e0a040; }

@media (max-width: 820px) {
  .checkout-shell { grid-template-columns: 1fr; margin-top: 1rem; }
  .checkout-summary { position: static; }
  .checkout-steps li { font-size: 0; }
  .checkout-steps span { font-size: 0.78rem; }
}

@media (max-width: 560px) {
  .checkout-shell { width: min(100% - 1rem, 1160px); }
  .checkout-flow, .checkout-summary { border-radius: 12px; }
  .checkout-product { grid-template-columns: 74px 1fr; }
  .checkout-product img { width: 74px; height: 74px; }
  .checkout-product > strong { grid-column: 2; }
  .checkout-grid { grid-template-columns: 1fr; }
  .checkout-span-2 { grid-column: auto; }
  .checkout-footer { flex-direction: column; align-items: center; gap: 0.4rem; }
}
