/* =========================================================
   ANAROSA — página de checkout.
   Arquivo isolado: não afeta a Home nem os componentes públicos.
   ========================================================= */

body {
  background: var(--beige-light);
}

.checkout-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--cream);
  border-bottom: 1px solid var(--border-soft);
}

.checkout-logo img {
  height: 40px;
  display: block;
}

.checkout-header-title {
  font-family: var(--font-heading);
  font-size: 16px;
  color: var(--brown-dark);
}

.checkout {
  max-width: 720px;
  margin: 0 auto;
  padding: 20px 16px 64px;
}

.checkout-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  margin-bottom: 20px;
  font-size: 12px;
}

.checkout-steps li {
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--beige);
  color: var(--muted);
}

.checkout-steps li.is-active {
  background: var(--brown-dark);
  color: var(--white);
}

.checkout-steps li.is-done {
  background: var(--gold);
  color: var(--white);
}

.checkout-banner {
  background: #fbe5e2;
  color: #a1352b;
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  font-size: 13px;
  margin-bottom: 16px;
}

.checkout-panel {
  background: var(--white);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  padding: 20px;
  box-shadow: var(--shadow-soft);
}

.checkout-panel h2 {
  font-family: var(--font-heading);
  font-size: 20px;
  color: var(--brown-dark);
  margin-bottom: 14px;
}

.checkout-panel h3 {
  font-family: var(--font-heading);
  font-size: 15px;
  color: var(--brown-dark);
  margin-bottom: 6px;
}

.checkout-note {
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
  margin-bottom: 14px;
}

.checkout-form {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
}

.checkout-form label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 13px;
  color: var(--text);
}

.checkout-form input {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  font: inherit;
  font-size: 14px;
  background: var(--beige-light);
}

.checkout-form-error {
  color: #a1352b;
  font-size: 12.5px;
  background: #fbe5e2;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
}

.checkout-option-group {
  display: grid;
  gap: 10px;
  margin-bottom: 16px;
}

.checkout-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
}

.checkout-option:has(input:checked) {
  border-color: var(--gold);
  background: var(--beige-light);
}

.checkout-option input {
  margin-top: 3px;
}

.checkout-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}

.checkout-actions .btn {
  flex: 1;
  text-align: center;
  min-width: 140px;
}

.checkout-actions .btn[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.checkout-cart-items {
  margin-bottom: 16px;
}

.checkout-review-block {
  padding: 12px 0;
  border-bottom: 1px solid var(--beige);
  font-size: 13.5px;
  color: var(--text);
}

.checkout-review-warnings {
  background: #fff1d6;
  color: #6b4a00;
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  font-size: 13px;
  margin-bottom: 14px;
}

.checkout-review-warnings ul {
  margin: 6px 0 0;
  padding-left: 18px;
}

.checkout-review-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 14px 0;
  font-size: 16px;
  color: var(--brown-dark);
}

.checkout-review-total strong {
  font-size: 20px;
}

.checkout-review-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  font-size: 13.5px;
  border-bottom: 1px solid var(--beige);
}

.checkout-review-item small {
  display: block;
  color: var(--muted);
}

.checkout-confirmation {
  text-align: center;
}

.checkout-confirmation-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #e4f4e8;
  color: #1f6b3a;
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
}

.checkout-order-ref {
  font-size: 13px;
  color: var(--muted);
  margin: 10px 0 18px;
}

@media (min-width: 640px) {
  .checkout {
    padding-top: 32px;
  }

  .checkout-actions .btn {
    flex: 0 0 auto;
    min-width: 160px;
  }

  .checkout-actions {
    justify-content: flex-end;
  }

  .checkout-actions a.btn-outline:first-child {
    margin-right: auto;
  }
}

/* Boutique Editorial Solar: presentation only; the checkout contract is intact. */
.checkout-header { padding:10px clamp(20px,4vw,60px); min-height:95px; background:var(--beige-light); }
.checkout-logo img { width:76px; height:76px; object-fit:contain; mix-blend-mode:multiply; }
.checkout-header-title { font-size:24px; }
.checkout-back { margin-left:auto; font-size:11px; color:var(--brown); }
.checkout-back:hover { text-decoration:underline; text-underline-offset:4px; }
.checkout { max-width:900px; padding:30px 24px 70px; }
.checkout-intro { text-align:center; margin:5px auto 30px; }
.checkout-intro h1 { font:500 47px/1.02 var(--font-heading); letter-spacing:-1.5px; color:var(--brown-dark); margin:12px 0; }
.checkout-intro>p:last-child { color:var(--muted); font-size:12px; }
.checkout-steps { justify-content:space-between; counter-reset:checkout-step; gap:10px; margin-bottom:25px; }
.checkout-steps li { counter-increment:checkout-step; display:flex; gap:7px; align-items:center; background:transparent; border-radius:0; border-bottom:1px solid var(--border-soft); padding:9px 2px; font-size:11px; flex:1; }
.checkout-steps li::before { content:counter(checkout-step,decimal-leading-zero); font:500 18px var(--font-heading); color:var(--brown); }
.checkout-steps li.is-active { background:transparent; color:var(--brown-dark); font-weight:600; border-bottom:2px solid var(--brown-dark); }
.checkout-steps li.is-done { background:transparent; color:var(--brown); }
.checkout-panel { padding:30px; border-radius:5px; background:var(--cream); box-shadow:none; }
.checkout-panel h2 { font-size:34px; line-height:1.1; margin-bottom:23px; }
.checkout-panel h3 { font-size:22px; }
.checkout-option { background:var(--cream); padding:16px; }
.checkout-option strong { font-weight:550; }
.checkout-form { gap:16px; }
.checkout-form input { min-height:45px; background:var(--beige-light); font-size:14px; }
.checkout-actions { margin-top:20px; }
.checkout-actions .btn { font-size:10px; }
.checkout-note { line-height:1.7; }
.checkout-review-total strong { font-weight:600; font-size:26px; }
.order-status { max-width:600px; padding-top:50px; }
.order-status-card { border-radius:5px; box-shadow:none; background:var(--cream); }
.order-status-card h1 { font-size:34px; line-height:1.05; }
@media (min-width:640px) {
  [data-form-customer],[data-form-address] { grid-template-columns:1fr 1fr; }
  [data-form-customer]>label:first-child,[data-form-customer]>.checkout-form-error,[data-form-address]>.checkout-form-error { grid-column:1/-1; }
}
@media (max-width:639px) {
  .checkout-header { gap:10px; padding:8px 16px; min-height:82px; }
  .checkout-logo img { width:65px; height:65px; }
  .checkout-header-title { font-size:20px; }
  .checkout-back { font-size:9px; max-width:95px; text-align:right; }
  .checkout { padding:22px 16px 50px; }
  .checkout-intro { margin:0 0 22px; }
  .checkout-intro h1 { font-size:38px; max-width:290px; margin-inline:auto; }
  .checkout-intro>p:last-child { font-size:11px; }
  .checkout-steps { gap:5px; flex-wrap:nowrap; overflow:auto; padding-bottom:3px; }
  .checkout-steps li { font-size:8px; gap:4px; white-space:nowrap; padding:7px 2px; }
  .checkout-steps li::before { font-size:14px; }
  .checkout-panel { padding:21px 17px; }
  .checkout-panel h2 { font-size:31px; margin-bottom:18px; }
  .checkout-actions { gap:8px; }
  .checkout-actions .btn { font-size:9px; min-width:0; padding-inline:11px; letter-spacing:.6px; }
  .checkout-form input { font-size:16px; }
  .order-status { padding-top:28px; }
}
