/* assets/d-maleta.css — auditoría del dueño (9-oct-2026) · unidad M · Maleta (maleta.html y lo que pinta assets/caja.js).
   Va DESPUÉS de assets/ux.css: aquí se afina botones de pago, código de premio, promos y franja «Pruébala primero».
   Usa el sistema de ux.css: --t-portada · --t-seccion · --t-sub · --t-cuerpo · --t-ante · --t-min (docs/AUDITOR-PLAN.md,
   «Sistema entregado»). Sin colores ni tipografías nuevas; el papel con fibra se queda.

   H11 (lado compra) — al pagar, la vista va a UN lugar:
     · «Pagar ahora» / «Ir a pagar →» es el único botón sólido, a todo el ancho, 56 px.
     · «Pruébala primero» va debajo, con borde tinta, pegado a su explicación (.mlt-prueba).
     · «Seguir comprando» es un enlace de texto (.mlt-seguir).
     · «Aplicar» lleva borde tinta (ya no es lo más saturado de la página).
     · Las promos son una NOTA, la misma de la tienda (.promo .in, unidad T): papel liso #F4EEDD, filete sepia
       de 1 px, y SOLO la cifra resaltada — en ámbar la oferta (24/26 px = texto grande, 4,1:1 ≥ 3:1) y en el
       verde de «aprobado» cuando ya está aplicada (4,6:1). Sin cajas rosadas ni verdes.
   La franja «Pruébala primero» de la tienda (.cjx-fr) y la promo del cajón (.cjx-promo) llevan la misma nota;
   su CSS viaja dentro de assets/caja.js porque esas páginas no cargan esta hoja. */

/* ---------- la página: la cuenta sube y el pie no deja un hueco ---------- */
.wrap{padding-bottom:8px}                         /* footer.casa-pie ya trae su margen y su filete */
@media (min-width:900px){
  .mhead{padding-top:20px}
  .wrap{padding-top:10px}
}
@media (min-width:1100px){ .mhead{margin-top:-30px} }   /* el titular sube a la franja de «← Seguir comprando» (no se cruzan):
                                                           en 1440×615 caben «Pagar ahora», «Pruébala primero» y su explicación */

/* ---------- superficies: un solo papel liso para lo que habla de plata, esquinas de papel (3 px) ---------- */
.mlt-items,.mlt-chip,.mlt-code input,.mlt-code button{border-radius:3px}
.mlt-tot{background:#FBF8EF;border-color:rgba(92,76,55,.3);border-radius:3px;padding:18px 18px 12px}

/* ---------- nota de promo ---------- */
.mlt-promo{margin:8px 0 16px;padding:16px 20px 15px;background:#F4EEDD;border:1px solid rgba(92,76,55,.25);border-radius:2px;
  box-shadow:0 2px 6px rgba(44,38,31,.07);text-align:center;text-wrap:balance;font-size:var(--t-cuerpo);line-height:1.45;color:#2C261F}
.mlt-promo b{font-weight:600;color:#2C261F}
.mlt-promo .cf{font-size:24px;line-height:1.1;font-weight:600;color:#966A28;white-space:nowrap}
.mlt-promo.on .cf{color:#1f7a4d}
.mlt-promo .nb{white-space:nowrap}                /* «(4 × $49.750 = $199.000).» no se parte en el signo igual */
.mlt-promo i{display:block;margin-top:6px;font-style:italic;color:#5C4C37;opacity:1}
@media (min-width:821px){ .mlt-promo .cf{font-size:26px} }

/* ---------- lo que llevas: letra menuda a todo contraste ---------- */
.mlt-nm .sub{opacity:1}
.mlt-nm .pr{color:#2C261F}
.mlt-nm .pr s{color:#5C4C37}
.mlt-sug .t{font-family:var(--t-flat);font-size:var(--t-ante);font-weight:600;letter-spacing:var(--t-ante-track);color:var(--t-ante-color)}

/* ---------- código de premio ---------- */
.mlt-code input{border-color:rgba(44,38,31,.4);color:#2C261F}
.mlt-code input::placeholder{color:#5C4C37;opacity:1}
.mlt-code input:focus-visible{outline:2px solid #2C261F;outline-offset:1px}
.mlt-code button{min-width:96px;font-size:17px;transition:background-color .16s ease,color .16s ease}
@media (hover:hover){ #mltCodBtn:hover{background:rgba(44,38,31,.07)!important} }
@media (max-width:340px){ .mlt-code button{min-width:0;padding:0 14px} .mlt-code input{padding-left:10px;padding-right:8px} .mlt-code input::placeholder{font-size:14.5px} }
.mlt-codmsg{margin-top:8px;padding:7px 12px 8px;background:#F4EEDD;border:1px solid rgba(92,76,55,.25);border-radius:2px;font-size:15px;line-height:1.35}

/* ---------- los botones: uno solo es sólido ---------- */
.mlt-btn{box-sizing:border-box;display:flex;align-items:center;justify-content:center;min-height:52px;padding:12px 16px;
  border-radius:2px;font-family:var(--t-serif);font-size:18px;line-height:1.15;letter-spacing:.3px;
  transition:background-color .16s ease,color .16s ease}
.mlt-btn.pay{min-height:56px;margin-top:16px;border:1px solid #2C261F;background:#2C261F;color:#EFE9DB;font-size:20px;letter-spacing:.5px}
.mlt-btn.borde{margin-top:0;border:1px solid #2C261F;background:transparent;color:#2C261F}
@media (hover:hover){
  .mlt-btn.pay:hover{background:#20140E}
  .mlt-btn.borde:hover{background:rgba(44,38,31,.07)}   /* se entinta apenas: ni al pasar el cursor compite con «Pagar ahora» */
}
.mlt-btn:active{transform:scale(.985)}

/* «Pruébala primero» + su explicación: un solo bloque, debajo del botón de pago */
.mlt-prueba{margin-top:10px}
.mlt-prueba p.mlt-ln.note{margin:8px 0 0;text-align:center;text-wrap:balance}
p.mlt-ln.note{font-size:15px;line-height:1.38;color:#5C4C37}
.mlt-tot>p.mlt-ln.note{margin-top:10px;text-align:center;text-wrap:balance}   /* «En Bogotá, … aplica hasta con 2 botellas» */

/* «Seguir comprando»: enlace de texto */
a.mlt-seguir,a.mlt-seguir:visited{display:flex;align-items:center;justify-content:center;width:max-content;max-width:100%;
  min-height:44px;margin:8px auto 0;color:#5C4C37;font-size:17px;line-height:1.2;text-decoration:underline;
  text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:rgba(92,76,55,.5)}
a.mlt-seguir:hover{color:#2C261F;text-decoration-color:currentColor}
a.mlt-seguir:focus-visible{outline:2px solid #2C261F;outline-offset:2px}

/* ---------- maleta vacía: el camino es la tienda ---------- */
.mlt-empty .mlt-btn{display:inline-flex;width:auto;min-width:min(280px,100%);margin-top:4px}