/* Banners «Bajate la app» (2026-11-06) · ver Helpers/AppPromo.cs y wwwroot/js/app-promo.js */
.tla-badge{display:inline-block;height:48px}.tla-badge img{height:48px;display:block}
.tla-qr{background:#fff;border-radius:10px;padding:6px;display:inline-block;line-height:0}
.tla-qr img{width:96px;height:96px}

/* A · tarjeta en la home */
.tla-a{margin:8px auto 22px}
.tla-a-in{position:relative;overflow:hidden;border-radius:14px;background:linear-gradient(120deg,#0b1222,#1e3a8a 55%,#3483fa);color:#fff;
  display:flex;align-items:center;gap:20px;padding:22px 24px;box-shadow:0 6px 22px rgba(30,58,138,.25)}
.tla-a h3{font-size:20px;font-weight:800;margin:0 0 6px;color:#fff}.tla-a h3 b{color:#ffd23f}
.tla-a ul{list-style:none;margin:0 0 14px;padding:0;font-size:13.5px;opacity:.95}.tla-a li{margin:3px 0}.tla-a li i{color:#ffd23f;margin-right:6px}
.tla-a-txt{flex:1;min-width:0;z-index:1}
.tla-phone{width:118px;height:210px;border-radius:22px;background:#0b1222;border:4px solid #1f2937;box-shadow:0 10px 30px rgba(0,0,0,.4);
  position:relative;flex-shrink:0;overflow:hidden;transform:rotate(-6deg);margin:-30px 0 -60px}
.tla-phone .s{position:absolute;inset:0;background:#f0f2f5}
.tla-phone .t{background:#0b1222;height:34px;display:flex;align-items:center;padding:0 8px;gap:4px}
.tla-phone .t img{width:16px;height:16px;border-radius:4px}.tla-phone .t span{color:#fff;font-size:8px;font-weight:800}
.tla-phone .b{background:linear-gradient(120deg,#1e3a8a,#3483fa);height:30px}
.tla-phone .c{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:6px}.tla-phone .c i{display:block;height:52px;background:#fff;border-radius:6px}
.tla-phone .p{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);width:26px;height:26px;border-radius:50%;background:#f5c400;
  color:#0b1222;font-weight:900;display:flex;align-items:center;justify-content:center;font-size:16px}
.tla-x{position:absolute;top:8px;right:10px;background:none;border:0;color:rgba(255,255,255,.7);font-size:22px;line-height:1;cursor:pointer;z-index:2}
.tla-a-qr{display:flex;align-items:center;gap:12px;font-size:12.5px;opacity:.95}
@media(max-width:576px){.tla-a-in{padding:18px 16px;gap:10px}.tla-a h3{font-size:17px}.tla-phone{width:92px;height:168px;margin:-20px -8px -50px 0}.tla-badge,.tla-badge img{height:42px}}

/* B · barra arriba (celu) / franja fina (PC) */
.tla-b{position:relative;z-index:1031;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;gap:10px;padding:8px 12px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.tla-b .x{background:none;border:0;color:#9ca3af;font-size:20px;padding:0 2px;cursor:pointer}
.tla-b img.i{width:40px;height:40px;border-radius:10px}
.tla-b .t{flex:1;min-width:0;line-height:1.25}.tla-b .t b{display:block;font-size:14px;color:#1a1a2e}.tla-b .t span{font-size:12px;color:#6b7280}
.tla-b a.go{background:#3483fa;color:#fff!important;font-weight:800;font-size:13.5px;border-radius:6px;padding:8px 14px;text-decoration:none!important}
.tla-b-pc{position:relative;background:linear-gradient(120deg,#1e3a8a,#3483fa);color:#fff;font-size:13.5px;text-align:center;padding:7px 36px}
.tla-b-pc b{color:#ffd23f}.tla-b-pc a{color:#fff!important;font-weight:800;text-decoration:underline!important;margin-left:8px}
.tla-b-pc .x{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:0;color:rgba(255,255,255,.8);font-size:18px;cursor:pointer}

/* C · hoja desde abajo (celu) / recuadro con QR (PC) */
.tla-c-bg{position:fixed;inset:0;background:rgba(11,18,34,.45);z-index:99998;opacity:0;transition:opacity .25s}
.tla-c{position:fixed;left:0;right:0;bottom:0;z-index:99999;background:#fff;border-radius:18px 18px 0 0;padding:10px 20px calc(20px + env(safe-area-inset-bottom));
  transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.8,.2,1);text-align:center;box-shadow:0 -8px 30px rgba(0,0,0,.2)}
.tla-c.on{transform:none}.tla-c-bg.on{opacity:1}
.tla-c .h{width:40px;height:4px;border-radius:4px;background:#e5e7eb;margin:0 auto 14px}
.tla-c img.i{width:64px;height:64px;border-radius:16px;box-shadow:0 4px 14px rgba(52,131,250,.35)}
.tla-c h3{font-size:19px;font-weight:800;margin:12px 0 6px;color:#1a1a2e}.tla-c p{color:#6b7280;font-size:14px;margin:0 0 14px}
.tla-c .row{display:flex;justify-content:center;gap:14px;font-size:12.5px;color:#374151;margin-bottom:16px}.tla-c .row i{color:#3483fa;display:block;font-size:20px;margin-bottom:2px}
.tla-c a.go{display:block;background:#3483fa;color:#fff!important;font-weight:800;border-radius:8px;padding:13px;text-decoration:none!important;font-size:15px}
.tla-c button.no{background:none;border:0;color:#6b7280;font-size:14px;margin-top:10px;cursor:pointer}
.tla-c-pc{position:fixed;left:20px;bottom:20px;z-index:99999;background:#fff;border-radius:14px;box-shadow:0 10px 34px rgba(0,0,0,.2);padding:16px 30px 16px 16px;display:flex;gap:14px;
  align-items:center;max-width:400px;transform:translateY(160%);transition:transform .35s}
.tla-c-pc.on{transform:none}.tla-c-pc b{display:block;font-size:15px;color:#1a1a2e;margin-bottom:4px}.tla-c-pc span{font-size:13px;color:#6b7280}
.tla-c-pc .tla-qr{border:1px solid #e5e7eb}.tla-c-pc .x{position:absolute;top:6px;right:10px;background:none;border:0;color:#9ca3af;font-size:18px;cursor:pointer}
body.modal-open .tla-c-pc, body.modal-open .tla-c, body.modal-open .tla-c-bg{display:none}

/* D · detalle, debajo de «Consultar al vendedor» */
.tla-d{margin:12px 0 4px;border:1px solid #dbe7fb;background:#f3f8ff;border-radius:8px;padding:12px;display:flex;gap:12px;align-items:center}
.tla-d img.i{width:40px;height:40px;border-radius:10px;flex-shrink:0}
.tla-d .t{flex:1;min-width:0;font-size:13px;color:#374151;line-height:1.35}.tla-d .t b{display:block;color:#1a1a2e;font-size:14px;margin-bottom:2px}
.tla-d a.go{color:#3483fa!important;font-weight:800;font-size:13.5px;white-space:nowrap;text-decoration:none!important}
.tla-d .tla-qr{padding:2px}.tla-d .tla-qr img{width:64px;height:64px}

/* A en PC · tres columnas (2026-11-09) */
.tla-a3{background:linear-gradient(120deg,#0b1222,#1e3a8a 55%,#3483fa);border-radius:14px;color:#fff;display:grid;grid-template-columns:1.1fr 1.6fr .9fr;gap:28px;align-items:center;padding:28px 32px;box-shadow:0 6px 22px rgba(30,58,138,.25)}
.tla-a3 h3{font-size:26px;line-height:1.15;margin:0 0 8px;font-weight:800;color:#fff}.tla-a3 h3 b{color:#ffd23f}.tla-a3 .t p{margin:0;opacity:.85;font-size:14px}
.tla-a3 .bens{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.tla-a3 .ben{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:16px 14px}
.tla-a3 .ben i{font-size:22px;color:#ffd23f}.tla-a3 .ben b{display:block;margin:8px 0 3px;font-size:14.5px}.tla-a3 .ben span{font-size:12.5px;opacity:.85;line-height:1.35;display:block}
.tla-a3 .get{display:flex;gap:14px;align-items:center;justify-content:flex-end}.tla-a3 .get small{display:block;font-size:12px;opacity:.85;margin-bottom:8px}
.tla-a3 .tla-qr img{width:98px;height:98px}
@media(max-width:1180px){.tla-a3{grid-template-columns:1fr 1.5fr;}.tla-a3 .get{grid-column:1 / -1;justify-content:flex-start}}
