/* Oficina → Promociones (owner, 15 Oct 2026) and the promo panel of the estimate builder; plus the
   iPad's "Cobrar" pay panel (three ways to pay, ATH Móvil QR). Mobile first (390 px). */
.pm-sec{padding:16px;margin-bottom:16px}
.pm-sec h2{font-size:22px;font-weight:800;text-transform:uppercase;margin:0 0 4px}
.pm-sec-h .muted{font-size:14px;line-height:1.45}
.pm-sec-h--row{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.pm-sec-h--row > div{flex:1;min-width:220px}
.pm-note{margin-top:10px}

/* Precios: one card per service */
.pm-prices{display:grid;gap:10px;margin-top:12px}
.pm-svc{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;display:grid;gap:10px}
.pm-svc.changed{border-color:var(--amber)}
.pm-svc.saved{border-color:var(--green)}
.pm-svc-top{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pm-svc-top .input{flex:1;min-width:0;font-weight:700}
.pm-total{font-family:var(--head);font-weight:800;font-size:22px;white-space:nowrap}
.pm-total small{font-size:12px;color:var(--muted);font-weight:600;display:block;text-align:right}
.pm-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.pm-nums .field label{font-size:12px}
.pm-nums .input{min-height:42px;padding:8px 10px;font-size:15px}
.pm-nums .input[readonly]{background:var(--gray-50);color:var(--muted)}
.pm-flags{display:flex;gap:6px;flex-wrap:wrap}
.pm-flag{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);border-radius:99px;padding:6px 10px;font-size:13px;font-weight:600;cursor:pointer;background:#fff;user-select:none}
.pm-flag input{accent-color:var(--red);width:16px;height:16px;margin:0}
.pm-flag.on{border-color:var(--ink);background:var(--gray-50)}
.pm-flag.promo.on{border-color:var(--green);background:var(--green-50);color:var(--green)}
.pm-svc-acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pm-svc-acts .fine{flex:1;min-width:120px}
.pm-svc .field-err{color:var(--red-700);font-size:12.5px}

/* Promociones: list cards + form */
.pm-list{display:grid;gap:10px;margin-top:12px}
.pm-card{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff;display:grid;gap:6px}
.pm-card.off{opacity:.72}
.pm-card-h{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pm-card-h b{font-size:17px;flex:1;min-width:120px}
.pm-code{font-family:var(--head);font-weight:800;letter-spacing:1px;background:var(--ink);color:#fff;border-radius:6px;padding:2px 8px;font-size:13px}
.pm-what{font-size:15px;font-weight:700}
.pm-meta{font-size:13px;color:var(--muted);line-height:1.5}
.pm-card-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.pm-form{border:2px solid var(--red);border-radius:16px;padding:14px;margin-top:12px;background:#fff;display:grid;gap:12px}
.pm-form h3{font-size:18px;margin:0}
.pm-kind{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.pm-kind button{border:1px solid var(--line-2);background:#fff;border-radius:10px;padding:10px 6px;font-weight:700;font-size:13.5px;cursor:pointer;min-height:44px}
.pm-kind button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.pm-chips{display:flex;gap:6px;flex-wrap:wrap}
.pm-row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pm-form .acts{display:flex;gap:8px;flex-wrap:wrap}
.pm-form .input.code{text-transform:uppercase;letter-spacing:1px;font-weight:700}
.pm-form .field-err{color:var(--red-700);font-size:12.5px}
.pm-form .input[aria-invalid="true"]{border-color:var(--red)}
.pm-help{font-size:12.5px;color:var(--muted)}
@media (max-width:640px){
  .pm-svc-top{flex-direction:column;align-items:stretch}
  .pm-svc-top .input{width:100%}
  .pm-total{text-align:right}
  .pm-nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pm-row2{grid-template-columns:minmax(0,1fr)}
  .pm-sec{padding:14px}
  .pm-sec-h--row .btn{width:100%}
}

/* Estimate builder: the Promoción panel and the discount line */
.est-promo .pm-applied{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px;border:1px solid var(--green);background:var(--green-50);border-radius:10px}
.est-promo .pm-applied b{flex:1;min-width:120px}
.est-promo .pm-applied .amt{font-weight:800;color:var(--green)}
.est-promo form{display:grid;gap:8px;margin-top:8px}
.est-promo .pm-coderow{display:flex;gap:6px}
.est-promo .pm-coderow .input{text-transform:uppercase;letter-spacing:1px}
.lines tr.promo td{background:var(--green-50)}
.lines tr.promo .num{color:var(--green);font-weight:700}

/* iPad: Cobrar — three ways, then what each shows */
.kpay-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kpay-pick .btn{min-height:56px;font-size:16px;flex-direction:column;gap:2px;line-height:1.1}
.kpay-pick .btn small{font-size:11.5px;font-weight:600;opacity:.75}
.kpay-how{margin-top:12px;border:2px solid var(--ink);border-radius:16px;padding:14px;text-align:center;display:grid;gap:8px;justify-items:center}
.kpay-how .amt{font-family:var(--head);font-size:34px;font-weight:800;line-height:1}
.kpay-how .how{font-size:15px;color:var(--ink-2);max-width:420px}
.kpay-how img.kqr-img{width:min(260px,70vw);height:auto;border-radius:12px;border:1px solid var(--line);background:#fff}
.kpay-how .handle{font-family:var(--head);font-weight:800;font-size:20px;letter-spacing:.5px}
.kpay-how.ath{border-color:#f36f21;background:#fff7f0}
.kpay-how .noqr{font-size:14px;color:var(--muted)}
@media (max-width:700px){.kpay{grid-template-columns:minmax(0,1fr)}}

/* Mi Garage: promos card + invoice pay line */
.g-promos{display:grid;gap:8px}
.g-promo{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.g-promo .grow{flex:1;min-width:0}
.g-promo b{display:block;font-size:14.5px}
.g-promo span{display:block;font-size:13px;color:var(--muted)}
.g-pay{display:grid;gap:10px;justify-items:center;text-align:center;margin-top:10px}
.g-pay img{width:min(220px,60vw);height:auto;border-radius:12px;border:1px solid var(--line);background:#fff}
