/* ===== Solicitud por WhatsApp (reemplaza el checkout) — paleta oscura ===== */
.cpsw{
  --cpsw-surface:#122320;
  --cpsw-line:#203330;
  --cpsw-text:#e7e8ee;
  --cpsw-muted:#9aa0ad;
  --cpsw-accent:#16a39a;
  --cpsw-wa:#25d366;

  display:grid; grid-template-columns:1.15fr .85fr; gap:34px;
  max-width:1040px; margin:10px auto 56px; align-items:start;
  color:var(--cpsw-text);
}
.cpsw h2{ font-size:26px; margin:0 0 10px; color:#fff; }
.cpsw h3{ font-size:15px; margin:0 0 14px; color:#fff; text-transform:uppercase; letter-spacing:.05em; }
.cpsw-intro{ color:var(--cpsw-muted); font-size:15px; line-height:1.65; margin:0 0 24px; }

/* ---- Formulario ---- */
.cpsw form label{ display:block; font-weight:700; font-size:14px; margin:0 0 7px; color:var(--cpsw-text); }
.cpsw form label span{ color:var(--cpsw-accent); }
.cpsw form input,
.cpsw form textarea{
  box-sizing:border-box; width:100%; margin:0 0 18px;
  background:#0f1e1b !important; color:var(--cpsw-text) !important;
  border:1px solid var(--cpsw-line) !important; border-radius:10px !important;
  padding:12px 14px !important; font-size:15px; box-shadow:none !important;
}
.cpsw form input::placeholder,
.cpsw form textarea::placeholder{ color:#6f7680; }
.cpsw form textarea{ resize:vertical; min-height:96px; }
.cpsw form input:focus,
.cpsw form textarea:focus{
  border-color:var(--cpsw-accent) !important;
  box-shadow:0 0 0 3px rgba(22,163,154,.22) !important; outline:none;
}

.cpsw-error{
  background:rgba(209,132,31,.12); border-left:4px solid #d1841f; border-radius:8px;
  color:#f0c48a; font-size:14px; margin:0 0 16px; padding:11px 14px;
}

.cpsw-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  background:var(--cpsw-wa); color:#fff !important; border:0; border-radius:999px;
  padding:15px 30px; font-size:16px; font-weight:800; line-height:1;
  text-decoration:none; cursor:pointer;
  box-shadow:0 8px 22px rgba(37,211,102,.28);
  transition:background .16s, transform .14s, box-shadow .16s;
}
.cpsw-btn:hover{ background:#1eb655; transform:translateY(-1px); box-shadow:0 12px 28px rgba(37,211,102,.36); }
.cpsw-btn--tienda{ background:var(--cpsw-accent); box-shadow:0 8px 22px rgba(22,163,154,.3); }
.cpsw-btn--tienda:hover{ background:#0f7169; box-shadow:0 12px 28px rgba(22,163,154,.36); }
.cpsw-btn svg{ flex:none; }

.cpsw-nota{ color:var(--cpsw-muted); font-size:13px; line-height:1.6; margin:14px 0 0; }
.cpsw-nota strong{ color:var(--cpsw-text); }

/* ---- Resumen ---- */
.cpsw-col--resumen{
  background:var(--cpsw-surface); border:1px solid var(--cpsw-line);
  border-radius:14px; padding:22px 22px 18px;
}
.cpsw-lista{ list-style:none; margin:0 0 14px; padding:0; }
.cpsw-lista li{
  display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:baseline;
  padding:11px 0; border-bottom:1px solid var(--cpsw-line); font-size:14.5px;
}
.cpsw-lista li:last-child{ border-bottom:0; }
.cpsw-cant{ font-weight:800; color:var(--cpsw-accent); }
.cpsw-nombre{ line-height:1.45; }
.cpsw-precio{ font-weight:700; color:#eb9b34; white-space:nowrap; }

.cpsw-total{
  display:flex; justify-content:space-between; align-items:baseline;
  border-top:2px solid var(--cpsw-line); margin:0; padding:14px 0 0; font-size:15px;
}
.cpsw-total strong{ font-size:21px; color:#eb9b34; }
.cpsw-editar{ display:inline-block; margin-top:14px; font-size:14px; color:var(--cpsw-accent) !important; text-decoration:underline; }

/* ---- Lista vacía ---- */
.cpsw--vacio{ display:block; text-align:center; padding:40px 20px 60px; }
.cpsw--vacio p{ color:var(--cpsw-muted); }

@media (max-width:849px){
  .cpsw{ grid-template-columns:1fr; gap:26px; margin-bottom:36px; }
  .cpsw-col--resumen{ order:-1; }   /* primero qué pide, después el formulario */
  .cpsw-btn{ width:100%; }
}

/* "(opcional)" junto a la etiqueta de comentarios */
.cpsw form label small{ color:var(--cpsw-muted); font-weight:500; font-size:13px; margin-left:4px; }