/**
 * Nutribiótica — Checkout Classic Plus (UI)
 * -----------------------------------------
 * Estilo moderno y ENCAPSULADO en #nutri-ch para el checkout clásico.
 */

#nutri-ch{
  --ink:#0b3557;
  --accent:#007b9e;
  --border:#e6edf4;
  --soft:#f6f9fc;
  --muted:#5b6b7a;
  --focus:0 0 0 3px rgba(0,123,158,.18);
  color:var(--ink);
}

/* ===== GRID general (dos columnas) ===== */
#nutri-ch .nutri-ch__grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:20px;
}
@media (min-width: 992px){
  #nutri-ch .nutri-ch__grid{
    grid-template-columns: minmax(0,1fr) minmax(360px,420px);
    align-items:start;
  }
}

/* ===== Tarjeta izquierda (datos) ===== */
#nutri-ch #customer_details{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:18px;
  box-shadow:0 10px 24px rgba(11,53,87,.06);
}

/* Wrapper de los grupos de campos en grid de 2 col */
#nutri-ch .woocommerce-billing-fields__field-wrapper,
#nutri-ch .woocommerce-shipping-fields__field-wrapper,
#nutri-ch .woocommerce-account-fields,
#nutri-ch .woocommerce-additional-fields__field-wrapper{
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
}
@media (min-width: 680px){
  #nutri-ch .woocommerce-billing-fields__field-wrapper,
  #nutri-ch .woocommerce-shipping-fields__field-wrapper{
    grid-template-columns: 1fr 1fr;
  }
  #nutri-ch .form-row-wide{ grid-column:1 / -1; }
}

/* Campo (contenedor de Woo form-row) */
#nutri-ch .nutri-ch__row{
  margin:0 !important;
  display:flex;
  flex-direction:column;
  gap:6px;
}

/* Label */
#nutri-ch .nutri-ch__label{
  font-size:.9rem;
  color:var(--muted);
  margin:0;
}

/* Control (input/select/textarea) */
#nutri-ch .nutri-ch__control{
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  padding:12px 12px;
  height:44px;
  font-size:.95rem;
  color:var(--ink);
  transition: box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
#nutri-ch .nutri-ch__control:focus{
  outline:none;
  border-color:var(--accent);
  box-shadow:var(--focus);
}

/* Select y textarea */
#nutri-ch .nutri-ch__select{
  appearance:none;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-right:36px;
}
#nutri-ch .nutri-ch__textarea{
  min-height:110px;
  height:auto;
  resize:vertical;
}

/* Select2 de Woo */
#nutri-ch .select2-container--default .select2-selection--single{
  border-radius:12px;
  border:1px solid var(--border);
  height:44px;
}
#nutri-ch .select2-selection__rendered{
  line-height:44px; padding-left:12px; color:var(--ink);
}
#nutri-ch .select2-selection__arrow{ height:44px; right:10px; }

/* ===== Tarjeta derecha (pedido + pagos) ===== */
#nutri-ch .nutri-ch__order{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  box-shadow:0 10px 24px rgba(11,53,87,.06);
}

/* Totales/tabla de pedido nativa de Woo */
#nutri-ch table.shop_table{
  border:0; margin:0 0 12px 0;
}
#nutri-ch table.shop_table th,
#nutri-ch table.shop_table td{
  border-top:0;
  padding:10px 8px;
  vertical-align:middle;
}
#nutri-ch table.shop_table thead th{
  font-weight:700; color:var(--ink);
  border-bottom:1px solid var(--border);
}
#nutri-ch table.shop_table tfoot th{
  font-weight:600;
}

/* ===== Métodos de envío ===== */
#nutri-ch .nutri-ch__shipping{
  margin-top:8px;
  padding-top:10px;
  border-top:1px dashed var(--border);
}
#nutri-ch #shipping_method{ margin:6px 0 0 0; }
#nutri-ch #shipping_method li{
  list-style:none; margin:6px 0;
  display:flex; align-items:center; gap:10px;
}
#nutri-ch input[type="radio"], 
#nutri-ch input[type="checkbox"]{
  accent-color:var(--accent);
}

/* ===== Métodos de pago (Paycomet dentro) ===== */
#nutri-ch .nutri-ch__payment{
  margin-top:12px;
  padding-top:12px;
  border-top:1px dashed var(--border);
}
#nutri-ch .wc_payment_methods{
  margin:0; padding:0;
}
#nutri-ch .wc_payment_methods .wc_payment_method{
  list-style:none;
  border:1px solid var(--border);
  border-radius:12px;
  padding:12px;
  margin:0 0 10px 0;
  background:#fff;
}
#nutri-ch .payment_box{
  background:var(--soft);
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px;
  margin-top:10px;
}

/* ===== Términos, políticas, etc. ===== */
#nutri-ch .woocommerce-terms-and-conditions-wrapper{
  margin-top:8px;
}
#nutri-ch .woocommerce-terms-and-conditions-wrapper label{
  display:flex; align-items:flex-start; gap:10px;
  font-size:.92rem; color:var(--ink);
}

/* ===== Botón: Realizar pedido ===== */
#nutri-ch #place_order{
  width:100%;
  background:var(--ink);
  color:#fff;
  border:0;
  border-radius:12px;
  height:48px;
  font-weight:800;
  letter-spacing:.02em;
  box-shadow:0 12px 26px rgba(11,53,87,.12);
  transition: transform .08s ease, box-shadow .2s ease, background .2s ease;
}
#nutri-ch #place_order:hover{
  transform: translateY(-1px);
  box-shadow:0 16px 30px rgba(11,53,87,.18);
  background:#0a314f;
}

/* ===== Mensajes / cupones ===== */
#nutri-ch .woocommerce-message,
#nutri-ch .woocommerce-info{
  border-radius:10px;
}

/* ===== Responsivo ===== */
@media (max-width: 480px){
  #nutri-ch .nutri-ch__control{ height:42px; padding:10px 12px; }
}
