/*
  Template 1, Cloudfy Clássico.
  Card único centralizado, layout vertical limpo, parecido com o
  checkout externo Cloudfy do seller. Mantém visual reconhecível
  pra quem já estava acostumado, vermelho Ferrari nos CTAs.
*/

.tpl-1 { background: #f7f7f7; }
.tpl-1 .checkout-shell { max-width: 560px; padding: 8px 18px 32px; }

.tpl-1 .checkout-top {
  background: #fff;
  border-bottom: 1px solid #ececec;
}

/* Cards limpos */
.tpl-1 .section-block,
.tpl-1 .step-panel {
  background: #fff;
  border: 1px solid #eee;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
  border-radius: 14px;
}

.tpl-1 .step-title { gap: 10px; font-size: 1.15rem; }
.tpl-1 .step-title-icon {
  background: var(--color-primary);
  width: 30px; height: 30px;
  border-radius: 50%;
}

.tpl-1 .input, .tpl-1 .select {
  border-radius: 10px;
  border: 1.5px solid #e5e7eb;
  padding: 13px 14px;
}
.tpl-1 .input:focus, .tpl-1 .select:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(255,0,4,.10);
}

.tpl-1 .resumo-card {
  background: #fafafa;
  border: 1.5px solid #eee;
}

.tpl-1 .btn-primary {
  background: var(--color-primary);
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(255,0,4,.25);
  font-weight: 800;
}
.tpl-1 .btn-primary:hover { background: var(--color-primary-hover); }

.tpl-1 .frete-item.selected {
  background: var(--red-soft);
  border-color: var(--color-primary);
}

.tpl-1 .totais-row.total .v { color: var(--color-primary); }

.tpl-1 .onepage-pix,
.tpl-1 #step3-pix {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 16px;
}