/* Rediseño visual de web/paginas/checkout. Solo CSS - no toca ids, names ni
   estructura de los que depende validatePedido.js / el submit AJAX. Reusa la
   paleta ya usada en shop-redesign.css (#c4a000). El mapa se oculta a
   proposito (ver .chk-map-block) sin quitarlo del DOM, para no romper el
   listener de lat/long si en el futuro se vuelve a mostrar. */

:root {
  --chk-gold: #c4a000;
  --chk-gold-dark: #8f7500;
  --chk-ink: #111111;
  --chk-ink-soft: #5a5a5a;
  --chk-border: rgba(17, 17, 17, 0.09);
  --chk-bg-soft: #faf8f2;
  --chk-radius: 14px;
}

.chk-map-block {
  display: none;
}

.billing-heading {
  font-size: 18px;
  font-weight: 600;
  color: var(--chk-ink);
  padding-bottom: 12px;
  margin-bottom: 22px !important;
  border-bottom: 1px solid var(--chk-border);
}

.form-group label {
  font-size: 13px;
  font-weight: 500;
  color: var(--chk-ink-soft);
  margin-bottom: 6px;
}

.form-control {
  height: 46px;
  border: 1px solid var(--chk-border);
  border-radius: 8px;
  font-size: 14px;
  box-shadow: none;
}

.form-control:focus {
  border-color: var(--chk-gold);
  box-shadow: 0 0 0 3px rgba(196, 160, 0, 0.15) !important;
}

.select-wrap select.form-control {
  appearance: none;
  -webkit-appearance: none;
}

.cart-detail {
  width: 100%;
  background: #fff;
  border: 1px solid var(--chk-border);
  border-radius: var(--chk-radius);
}

.cart-detail.cart-total {
  border-top: 3px solid var(--chk-gold);
}

.cart-detail p.d-flex {
  justify-content: space-between;
  color: var(--chk-ink-soft);
  font-size: 14px;
}

.cart-detail p.total-price {
  font-size: 17px;
  font-weight: 600;
  color: var(--chk-ink);
}

.cart-detail p.total-price span:last-child {
  color: var(--chk-gold-dark);
}

.radio label,
.checkbox label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1px solid var(--chk-border);
  border-radius: 10px;
  font-size: 14px;
  color: var(--chk-ink);
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}

.radio label:hover {
  border-color: var(--chk-gold);
  background: var(--chk-bg-soft);
}

.radio input[type="radio"] {
  margin: 0 !important;
}

#terminosCondiciones {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--chk-ink-soft);
  text-decoration: none;
  font-size: 13px;
}

#terminosCondiciones:hover {
  color: var(--chk-gold-dark);
}

#buttonConfirmar.btn {
  background: var(--chk-ink) !important;
  border-color: var(--chk-ink) !important;
  color: #fff !important;
  border-radius: 24px !important;
  font-weight: 500;
  width: 100%;
  text-align: center;
}

#buttonConfirmar.btn:hover {
  background: var(--chk-gold-dark) !important;
  border-color: var(--chk-gold-dark) !important;
}

@media (max-width: 767.98px) {
  .cart-detail {
    margin-bottom: 20px;
  }
}
