/* =====================================================================
   Sancurec — PORTAL DEL CLIENTE FINAL (tienda del revendedor por comisión)
   Móvil primero · una columna · pocos botones · sin JavaScript.
   ===================================================================== */
:root {
  --ink: #0b1426; --ink-2: #33415c; --muted: #6b7a93; --line: #e3e8f2; --bg: #f3f5fa; --card: #fff;
  --brand: #3355ff; --brand-ink: #1f3ad6; --brand-soft: #eef1ff; --navy: #0a1430;
  --grad: linear-gradient(135deg, #3355ff 0%, #2a8bff 55%, #00c2ff 100%);
  --green: #0f9f63; --green-soft: #e7f8f0; --red: #d93a3a; --red-soft: #fdeceb; --gray-soft: #eef1f6;
  --amber: #b26a00; --amber-soft: #fff4de;
  --r: 18px; --font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body.pt { margin: 0; font-family: var(--font); font-size: 16px; line-height: 1.5; color: var(--ink); background: var(--bg); -webkit-font-smoothing: antialiased; }
a { color: var(--brand-ink); }
h1, h2, h3 { margin: 0; line-height: 1.2; letter-spacing: -.02em; }
p { margin: 0; }
s { color: var(--muted); font-weight: 600; }
.ic { width: 20px; height: 20px; flex: none; vertical-align: -4px; }
.ic.sm { width: 17px; height: 17px; }
.ic.lg { width: 30px; height: 30px; }
.small { font-size: 13px; }

.pt-demo { background: #ffcf33; color: #3b2a00; text-align: center; font-size: 12.5px; font-weight: 800; padding: 6px; }
.pt-wrap { max-width: 540px; margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; }

/* ---------- Barra superior (tienda + cuenta) ---------- */
.pt-bar { position: relative; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 16px; background: rgba(10, 20, 48, .97); color: #fff; backdrop-filter: saturate(1.4) blur(6px); }
.pt-bar-shop { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-weight: 800; font-size: 17px; min-width: 0; }
.pt-bar-shop span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-bar-ic { width: 34px; height: 34px; border-radius: 11px; background: var(--grad); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; flex: none; }
.pt-chip { display: inline-flex; align-items: center; gap: 6px; flex: none; color: #fff; text-decoration: none; font-weight: 700; font-size: 14px;
  padding: 8px 12px; border-radius: 999px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .18); }

.pt-main { flex: 1; padding: 16px 16px 8px; }
/* WEB-001 · portada (tienda de Sancurec): acciones del encabezado, presentación y marcas de tarjeta */
.pt-bar-acts { display: inline-flex; align-items: center; gap: 8px; flex: none; }
.pt-bar-logo { width: 34px; height: 34px; border-radius: 9px; flex: none; }
.pt-chip-soft { background: transparent; border-color: rgba(255, 255, 255, .28); font-weight: 600; }
@media (max-width: 440px) { .pt-chip-soft { display: none; } }
.pt-hero { margin: 4px 2px 16px; }
.pt-hero h1 { font-size: 26px; line-height: 1.15; margin: 0 0 6px; letter-spacing: -.01em; }
.pt-hero p { color: var(--muted); margin: 0 0 12px; }
.pt-hero ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pt-hero li { display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--ink-2); font-size: 15px; }
.pt-hero li svg { color: var(--brand); flex: none; }
.pt-cards { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pt-cards img { display: block; width: 46px; height: 30px; border-radius: 5px; background: #fff; box-shadow: 0 0 0 1px var(--line); }
.pt-cards-label { font-size: 12.5px; color: var(--muted); text-align: center; margin: 0 0 6px; }
.pt-paysafe { margin-top: 14px; }
.pt-row2 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; margin-top: 14px; }
.pt-row2 .pt-field + .pt-field { margin-top: 0; }
.pt-select { appearance: none; -webkit-appearance: none; padding-right: 36px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; }
.pt-ship { display: flex; gap: 10px; align-items: flex-start; margin-top: 12px; padding: 12px; border-radius: 12px; background: #f1f6ff; color: var(--ink-2); font-size: 14px; }
.pt-ship svg { color: var(--brand); flex: none; margin-top: 2px; }
.pt-cards-wrap { margin-top: 2px; }
.pt-tagline { color: var(--muted); font-weight: 600; margin: 0 2px 12px; }
.pt-hello, .pt-h1 { font-size: 24px; font-weight: 800; margin: 2px 2px 12px; }
.pt-h2 { font-size: 18px; font-weight: 800; margin: 4px 2px 12px; }
.pt-muted { color: var(--muted); }
.pt-note { font-size: 13.5px; color: var(--muted); text-align: center; margin: 14px 8px; }
.pt-note .ic { color: var(--green); }
.pt-sec { margin: 18px 0 8px; }
.pt-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.pt-sec-head a { font-weight: 700; font-size: 14px; text-decoration: none; }

.pt-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; margin: 0 0 14px; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
fieldset.pt-card { min-width: 0; }
.pt-center { text-align: center; padding: 28px 20px; }
.pt-center h2, .pt-center h3 { margin: 12px 0 6px; }
.pt-ic { width: 60px; height: 60px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.pt-ic-ok { background: var(--green-soft); color: var(--green); }
.pt-ic-gray { background: var(--gray-soft); color: var(--muted); }

/* ---------- Banners de promociones (plantillas fijas) ---------- */
.pt-banners { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory;
  margin: 0 -16px 4px; padding: 0 16px 6px; scrollbar-width: none; }
.pt-banners::-webkit-scrollbar { display: none; }
.pt-banners.is-multi { grid-auto-columns: 88%; }
/* (el aspecto de cada plantilla .pt-bn--* está en banners.css, compartido con Admin) */
.pt-swipe { text-align: right; font-size: 12.5px; color: var(--muted); font-weight: 700; margin: 0 4px 4px; }

/* ---------- Números guardados ---------- */
.pt-nums, .pt-list, .pt-hist, .pt-grid { list-style: none; margin: 0; padding: 0; }
.pt-nums { display: grid; gap: 8px; }
.pt-num, .pt-chosen-num { display: flex; align-items: center; gap: 12px; background: var(--card); border: 1.5px solid var(--line); border-radius: 16px;
  padding: 12px 14px; text-decoration: none; color: inherit; }
.pt-num:hover, .pt-num:focus-visible { border-color: var(--brand); outline: none; }
.pt-chosen-num { border-color: var(--brand); background: var(--brand-soft); margin-bottom: 12px; }
.pt-chosen-num a { font-weight: 700; font-size: 14px; text-decoration: none; margin-left: auto; }
.pt-num-ic { width: 38px; height: 38px; border-radius: 12px; background: var(--brand-soft); color: var(--brand-ink); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pt-num-main { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.pt-num-main b { font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-num-main span { color: var(--muted); font-size: 14px; font-variant-numeric: tabular-nums; }
.pt-num-go { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; color: var(--brand-ink); font-size: 14px; flex: none; }

/* ---------- Ofertas (tarjetas en 2 columnas) ---------- */
.pt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pt-tile { position: relative; display: flex; flex-direction: column; gap: 2px; min-height: 124px; padding: 16px 14px 14px; background: var(--card);
  border: 1.5px solid var(--line); border-radius: var(--r); text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s, transform .1s; }
.pt-tile:hover, .pt-tile:focus-visible { border-color: var(--brand); box-shadow: 0 8px 22px -12px rgba(51, 85, 255, .55); outline: none; }
.pt-tile:active { transform: scale(.98); }
.pt-tile.is-promo { border-color: #ffc94d; background: linear-gradient(180deg, #fffaf0, #fff 60%); }
.pt-tile-amount { font-size: 21px; font-weight: 800; letter-spacing: -.02em; margin-top: 4px; }
.pt-tile-name { font-size: 13.5px; color: var(--muted); font-weight: 600; }
.pt-tile-price { margin-top: auto; padding-top: 8px; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.pt-tile-price b { font-size: 20px; font-weight: 800; color: var(--brand-ink); font-variant-numeric: tabular-nums; }
.pt-tile-price s { font-size: 13px; }
.pt-badge { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; font-size: 11.5px; font-weight: 800; color: #7a4a00; background: #ffe6a6;
  padding: 3px 8px; border-radius: 999px; }
.pt-badge.sm { font-size: 10.5px; padding: 1px 6px; vertical-align: 1px; }

/* ---------- Historial ---------- */
.pt-hist { display: grid; gap: 8px; }
.pt-hist-row, .pt-list-row { display: flex; align-items: center; gap: 10px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; flex-wrap: wrap; }
.pt-hist-main { display: flex; flex-direction: column; min-width: 0; flex: 1; gap: 1px; }
.pt-hist-main span { color: var(--muted); font-size: 13.5px; }
.pt-st { display: inline-block; align-self: flex-start; font-size: 12px; font-weight: 800; padding: 2px 8px; border-radius: 999px; margin-top: 3px; }
.pt-hist-main .pt-st { color: inherit; }
.pt-st--amber { background: var(--amber-soft); color: var(--amber) !important; }
.pt-st--gray { background: var(--gray-soft); color: var(--muted) !important; }
.pt-st--green { background: var(--green-soft); color: var(--green) !important; }
.pt-mini { display: inline-flex; align-items: center; gap: 5px; flex: none; font: inherit; font-size: 14px; font-weight: 800; color: var(--brand-ink); background: var(--brand-soft);
  border: 0; border-radius: 11px; padding: 9px 12px; text-decoration: none; cursor: pointer; }
.pt-mini.pt-danger { color: var(--red); background: var(--red-soft); }
.pt-list { display: grid; gap: 8px; margin-bottom: 12px; }
.pt-edit { flex-basis: 100%; }
.pt-edit summary { list-style: none; cursor: pointer; display: inline-flex; color: var(--muted); font-size: 13px; font-weight: 700; }
.pt-edit summary::-webkit-details-marker { display: none; }
.pt-edit summary::after { content: 'Editar'; margin-left: 5px; }
.pt-edit[open] summary::after { content: 'Cerrar'; }
.pt-inline { display: flex; gap: 8px; margin-top: 10px; align-items: center; }
.pt-inline .pt-input { flex: 1; }
.pt-add > summary { cursor: pointer; font-weight: 800; color: var(--brand-ink); list-style: none; display: flex; align-items: center; gap: 6px; }
.pt-add > summary::-webkit-details-marker { display: none; }
.pt-add[open] > summary { margin-bottom: 12px; }
.pt-card .pt-add { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line); }

/* ---------- Formularios ---------- */
.pt-back { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; text-decoration: none; margin: 0 2px 12px; }
.pt-chosen { display: flex; justify-content: space-between; align-items: center; gap: 12px; border: 1.5px solid var(--brand); background: #f6f8ff; }
.pt-chosen > div { display: flex; flex-direction: column; gap: 2px; }
.pt-amount { display: block; font-size: 22px; font-weight: 800; letter-spacing: -.02em; }
.pt-name { display: block; font-weight: 600; color: var(--ink-2); }
.pt-desc { display: block; font-size: 14px; color: var(--muted); }
.pt-price { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; display: flex; flex-direction: column; align-items: flex-end; }
.pt-price s { font-size: 14px; }
.pt-form { margin: 0; }
fieldset { border: 1px solid var(--line); }
.pt-step { float: left; width: 100%; display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 16.5px; padding: 0; margin-bottom: 12px; }
.pt-step + * { clear: both; }
.pt-step span { width: 26px; height: 26px; border-radius: 50%; background: var(--grad); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; }
.pt-field { display: block; }
.pt-field + .pt-field { margin-top: 14px; }
.pt-label { display: block; font-weight: 700; font-size: 14.5px; margin-bottom: 6px; color: var(--ink-2); }
.pt-opt-tag { font-weight: 600; font-size: 12px; color: var(--muted); background: var(--gray-soft); border-radius: 999px; padding: 1px 7px; margin-left: 4px; }
.pt-input { width: 100%; height: 54px; border: 1.5px solid #d5dcea; border-radius: 14px; padding: 0 16px; font: inherit; font-size: 17px; color: var(--ink); background: #fff; outline: none; }
.pt-input.sm { height: 44px; font-size: 15px; border-radius: 11px; }
.pt-input:focus { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(51, 85, 255, .14); }
.pt-input.is-bad { border-color: var(--red); box-shadow: 0 0 0 4px rgba(217, 58, 58, .1); }
.pt-code { font-size: 26px; letter-spacing: .4em; text-align: center; font-weight: 800; }
.pt-inputgroup { position: relative; display: block; }
.pt-prefix { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); font-weight: 800; color: var(--ink-2); font-size: 17px; }
.pt-inputgroup .pt-input { padding-left: 62px; letter-spacing: .04em; }
.pt-hint { display: block; font-size: 13.5px; color: var(--muted); margin-top: 6px; }
.pt-hint.is-bad { color: var(--red); font-weight: 600; }
.pt-acct { margin-top: 18px !important; padding-top: 16px; border-top: 1px dashed var(--line); }

/* Elección de número guardado (radios con aspecto de tarjeta) */
.pt-pick { display: grid; gap: 8px; margin-bottom: 12px; }
.pt-opt, .pt-qopt { position: relative; display: block; cursor: pointer; }
.pt-opt input, .pt-qopt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pt-opt > span { display: flex; justify-content: space-between; align-items: center; gap: 10px; border: 1.5px solid var(--line); border-radius: 14px; padding: 13px 14px 13px 44px; position: relative; }
.pt-opt > span::before { content: ''; position: absolute; left: 14px; top: 50%; width: 20px; height: 20px; margin-top: -10px; border-radius: 50%; border: 2px solid #b9c3d6; background: #fff; }
.pt-opt small { color: var(--muted); font-size: 14px; font-variant-numeric: tabular-nums; }
.pt-opt input:checked + span { border-color: var(--brand); background: var(--brand-soft); }
.pt-opt input:checked + span::before { border: 6px solid var(--brand); }
.pt-opt input:focus-visible + span { box-shadow: 0 0 0 4px rgba(51, 85, 255, .18); }
.pt-other .pt-field:first-child .pt-label { font-size: 13.5px; }
/* Con números guardados, el campo "otro número" solo aparece al elegir «Otro número». */
/* (Navegadores sin :has ignoran la regla y lo muestran siempre: nunca queda inaccesible.) */
.pt-pick:has(input[value="new"]:not(:checked)) + .pt-other { display: none; }

/* Cantidad (chips con el total de cada opción) */
.pt-qty { display: grid; grid-template-columns: repeat(auto-fit, minmax(58px, 1fr)); gap: 6px; }
.pt-qopt > span { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border: 1.5px solid var(--line); border-radius: 14px; padding: 10px 6px; min-height: 64px; }
.pt-qopt b { font-size: 20px; font-weight: 800; }
.pt-qopt small { font-size: 11px; color: var(--muted); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pt-qopt input:checked + span { border-color: var(--brand); background: var(--brand); color: #fff; }
.pt-qopt input:checked + span small { color: rgba(255, 255, 255, .85); }
.pt-qopt input:focus-visible + span { box-shadow: 0 0 0 4px rgba(51, 85, 255, .18); }

.pt-alert, .pt-ok { display: flex; gap: 10px; align-items: flex-start; border-radius: 14px; padding: 12px 14px; margin: 0 0 14px; font-weight: 600; font-size: 15px; }
.pt-alert { background: var(--red-soft); color: #9c1f1f; border: 1px solid #f7c9c6; }
.pt-ok { background: var(--green-soft); color: #0b6b43; border: 1px solid #bfe9d5; }

/* ---------- Botones ---------- */
.pt-btn { display: flex; width: 100%; align-items: center; justify-content: center; gap: 8px; height: 58px; border-radius: 16px; border: 0; font: inherit; font-size: 17px; font-weight: 800;
  cursor: pointer; text-decoration: none; margin: 4px 0 10px; }
.pt-btn-primary { background: var(--grad); color: #fff; box-shadow: 0 12px 26px -12px rgba(51, 85, 255, .75); }
.pt-btn-primary:active { transform: translateY(1px); }
.pt-btn-ghost { background: transparent; color: var(--ink-2); border: 1.5px solid var(--line); height: 52px; font-weight: 700; }
.pt-link { display: block; text-align: center; font-weight: 700; margin-top: 4px; }
.pt-auth { padding: 22px 18px; }
.pt-auth .pt-muted { margin-bottom: 16px; }
.pt-auth .pt-hint { text-align: center; margin-top: 10px; }
.pt-auth .pt-ic { margin-bottom: 10px; }

/* ---------- Resumen ---------- */
.pt-steps { list-style: none; display: flex; gap: 6px; padding: 0; margin: 0 0 14px; }
.pt-steps li { flex: 1; text-align: center; font-size: 12.5px; font-weight: 700; color: var(--muted); padding-top: 8px; border-top: 4px solid #dfe5f0; }
.pt-steps li.done { color: var(--green); border-color: var(--green); }
.pt-steps li.on { color: var(--brand-ink); border-color: var(--brand); }
.pt-dl { margin: 0; display: grid; gap: 12px; }
.pt-dl div { display: grid; gap: 2px; }
.pt-dl dt { font-size: 13px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.pt-dl dd { margin: 0; }
.pt-big { font-size: 20px; font-weight: 800; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.pt-lines { margin-top: 16px; display: grid; gap: 6px; font-variant-numeric: tabular-nums; }
.pt-lines > div { display: flex; justify-content: space-between; gap: 10px; }
.pt-save { color: var(--green); font-weight: 700; }
.pt-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 12px; padding-top: 14px; border-top: 1px dashed var(--line); font-weight: 700; }
.pt-total b { font-size: 26px; font-weight: 800; }
.pt-total small { font-size: 13px; color: var(--muted); font-weight: 700; }
.pt-check { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pt-check li { display: flex; align-items: flex-start; gap: 8px; font-weight: 600; color: var(--ink-2); }
.pt-check li.done { color: var(--green); }
.pt-check li .ic { margin-top: 3px; }

.pt-foot { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--muted); font-size: 13px; padding: 18px 16px 26px; }
.pt-foot img { border-radius: 5px; }
.pt-foot-brand { display: flex; align-items: center; gap: 8px; }
.pt-foot-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; }
.pt-foot-links a { color: var(--ink-2); font-weight: 700; text-decoration: none; padding: 4px 0; }
.pt-foot-links a:hover { color: var(--brand-ink); text-decoration: underline; }

/* ---------- Contacto y páginas legales ---------- */
.pt-legal { padding: 22px 18px; line-height: 1.6; }
.pt-legal h2 { font-size: 16.5px; font-weight: 800; margin: 20px 0 6px; }
.pt-legal p, .pt-legal ul { margin: 0 0 10px; color: var(--ink-2); }
.pt-legal ul { padding-left: 20px; }
.pt-legal li { margin: 4px 0; }
.pt-contact { list-style: none; padding: 0 !important; display: grid; gap: 8px; }
.pt-contact li { display: flex; align-items: flex-start; gap: 8px; font-weight: 600; }
.pt-contact .ic { margin-top: 3px; color: var(--brand-ink); }

@media (min-width: 560px) {
  .pt-main { padding: 22px 20px 8px; }
  .pt-grid { grid-template-columns: 1fr 1fr 1fr; }
  .pt-banners { margin: 0 0 4px; padding: 0 0 6px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .pt-tile { transition: none; } }

/* ---------- REDDE-001 · Página de pago (Hosted Fields) ---------- */
.pt-paysum { display: grid; gap: 10px; }
.pt-paysum > div { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.pt-paysum-total { padding-top: 10px; border-top: 1px dashed var(--line); font-weight: 700; }
.pt-paysum-total b { font-size: 24px; font-weight: 800; }
.pt-paysum-total small { font-size: 12px; color: var(--muted); }
.pt-sandbox { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; font-weight: 700; color: #7a4a00; background: #fff4de;
  border: 1px solid #ffe0a3; border-radius: 12px; padding: 9px 12px; margin: 0 0 14px; }
.pt-hf .pt-label { margin-top: 12px; display: flex; justify-content: space-between; }
.pt-hf .pt-label:first-child { margin-top: 0; }
.pt-hf-field { min-height: 54px; border-radius: 12px; background: #fff; } /* el borde lo pinta el campo de Redde (styles) */
.pt-hf-field iframe { width: 100%; height: 54px; border: 0; display: block; }
.pt-hf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pt-hf-submit { margin-top: 16px; min-height: 58px; }
.pt-hf-submit iframe { width: 100%; height: 58px; border: 0; display: block; }
/* REDDE-002 · mientras se procesa: el formulario sigue visible (3DS) pero el botón no admite más clics */
#pay.is-processing .pt-hf-submit { pointer-events: none; opacity: .55; }
.pt-paystatus { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; background: #eef2ff; color: #22306b; font-weight: 600; font-size: 15px; }
#pay.is-processing .pt-paystatus::before { content: ''; display: inline-block; width: 14px; height: 14px; margin-right: 8px; vertical-align: -2px;
  border: 2px solid #3355ff; border-right-color: transparent; border-radius: 50%; animation: pt-spin .8s linear infinite; }
@media (max-width: 380px) { .pt-hf-row { grid-template-columns: 1fr; } }
.pt-cardtype { font-size: 12.5px; color: var(--brand-ink); text-transform: uppercase; letter-spacing: .04em; }
.pt-ic-bad { background: var(--red-soft); color: var(--red); }
.pt-spin { width: 46px; height: 46px; border-radius: 50%; border: 4px solid #dfe5f0; border-top-color: var(--brand); margin: 4px auto 6px; animation: pt-spin .9s linear infinite; }
@keyframes pt-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .pt-spin { animation-duration: 3s; } }
/* QA-001 · pago con Chase QuickAccept (cobro manual) */
.pt-btn-pay { height: 64px; font-size: 19px; margin-top: 16px; box-shadow: 0 10px 24px -12px rgba(51, 85, 255, .65); }
.pt-btn-pay[aria-disabled="true"] { opacity: .6; pointer-events: none; }
#mpay .pt-paystate h2 { margin-top: 10px; }
#mpay .pt-hint[data-slow] { margin-top: 12px; }
#mpay [hidden] { display: none !important; }
#cpay [hidden] { display: none !important; } /* AUTH-001: .pt-hint (display:block) no debe ganar a [hidden] */

/* AUTH-001 · formulario de tarjeta de Authorize.Net incrustado: a todo el ancho en el teléfono (sin barra lateral) */
.pt-anet-frame { display: block; width: 100%; height: 470px; border: 0; border-radius: 12px; background: #fff; }
@media (max-width: 560px) {
  .pt-anet-card { padding-left: 0; padding-right: 0; border-left: 0; border-right: 0; border-radius: 0; margin-left: -16px; margin-right: -16px; }
  .pt-anet-card > h2, .pt-anet-card > p, .pt-anet-card > form p { padding: 0 16px; }
  .pt-anet-frame { border-radius: 0; }
}

/* ---------- Fotos del portal (portada, separador, acceso y fondo de escritorio) ---------- */
.pt-photo { margin: 2px 0 16px; border-radius: var(--r); overflow: hidden; background: var(--navy); box-shadow: 0 10px 28px -14px rgba(10, 20, 48, .45); }
.pt-photo img { display: block; width: 100%; height: auto; }
.pt-photo--hero { aspect-ratio: 5 / 2; }
.pt-photo--hero img { height: 100%; object-fit: cover; object-position: 50% 40%; }
.pt-photo--band { margin: 6px 0 18px; aspect-ratio: 3 / 1; }
.pt-photo--band.pt-photo--wide { aspect-ratio: 16 / 9; } /* banner «Mejores descuentos» (1672×941): sin recortar el texto */
.pt-photo--band img { height: 100%; object-fit: cover; }
.pt-auth-photo { margin: -22px -18px 18px; height: 150px; overflow: hidden; border-radius: var(--r) var(--r) 0 0; background: var(--navy); }
.pt-auth-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 30% 35%; }
.pt-auth { overflow: hidden; }
@media (min-width: 720px) {
  /* En pantallas anchas la columna va en el centro: la foto difuminada solo se ve a los lados, nunca detrás del texto. */
  body.pt { background: var(--bg) url('/static/img/portal/fondo-1280.webp') center / cover fixed no-repeat; }
  body.pt::before { content: ''; position: fixed; inset: 0; background: linear-gradient(180deg, rgba(10, 20, 48, .55), rgba(10, 20, 48, .35)); pointer-events: none; z-index: 0; }
  .pt-wrap { position: relative; z-index: 1; background: var(--bg); box-shadow: 0 0 60px rgba(10, 20, 48, .35); }
  .pt-auth-photo { height: 180px; }
}
@media (prefers-reduced-data: reduce) { body.pt { background-image: none; } }

/* ---------- Visitante sin cuenta: promociones + invitación a crear la cuenta ---------- */
.pt-save { display: inline-block; align-self: flex-start; margin-top: 6px; font-size: 11.5px; white-space: nowrap; font-weight: 800; color: #0b7a4b; background: #e3f8ee; border-radius: 999px; padding: 3px 9px; }
.pt-join { text-align: center; padding: 22px 18px; margin-top: 4px; }
.pt-join h3 { margin: 6px 0 4px; font-size: 19px; }
.pt-join .pt-muted { margin: 0 0 16px; }
.pt-join .pt-btn + .pt-btn { margin-top: 10px; }
.pt-join-ic { width: 46px; height: 46px; margin: 0 auto; display: grid; place-items: center; border-radius: 14px; background: var(--brand-soft); color: var(--brand); }
.pt-hint-box { text-align: left; background: var(--brand-soft); color: var(--brand-ink); border-radius: 12px; padding: 10px 12px; margin: 0 0 14px; display: flex; gap: 8px; align-items: flex-start; }

/* PWA-001 · aviso «Ten Sancurec en tu teléfono» */
.pt-install { position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 60;
  max-width: 460px; margin: 0 auto; background: var(--navy); color: #fff; border-radius: var(--r); padding: 16px;
  box-shadow: 0 18px 40px rgba(10, 20, 48, .35); animation: pt-install-in .25s ease-out; }
@keyframes pt-install-in { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
.pt-install-top { display: flex; gap: 12px; align-items: center; }
.pt-install-ic { width: 44px; height: 44px; border-radius: 12px; flex: none; }
.pt-install-txt { display: flex; flex-direction: column; gap: 2px; font-size: 14px; line-height: 1.35; }
.pt-install-txt b { font-size: 15.5px; }
.pt-install-txt span { color: #c7d2ea; }
.pt-install-pic { display: block; width: 100%; height: auto; max-height: 170px; margin-top: 12px; }
.pt-install-steps { margin: 12px 0 0; padding-left: 20px; font-size: 14px; color: #e6ecfa; display: grid; gap: 4px; }
.pt-install-acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.pt-install-acts button { font: inherit; font-weight: 700; font-size: 14px; border-radius: 12px; padding: 10px 16px; border: 0; cursor: pointer; }
.pt-install-no { background: transparent; color: #c7d2ea; }
.pt-install-yes { background: var(--grad); color: #fff; }

/* PWA-002 · botón permanente «Instalar», tarjeta de la app / «instala y ahorra», y ojo de la contraseña */
.pt-chip-app { font: inherit; cursor: pointer; }
@media (max-width: 340px) { .pt-chip-app span { display: none; } }
.pt-btn-sm { width: auto; padding: 10px 14px; font-size: 14px; margin: 0; flex: none; }
.pt-app-card { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.pt-app-card img { width: 48px; height: 48px; border-radius: 12px; flex: none; }
.pt-app-card > div { flex: 1 1 200px; min-width: 0; }
.pt-app-promo { border: 2px solid #f5a400; background: #fff9e8; }
.pt-app-gift { color: #6b4a00; background: #fff4d6; }
.pt-pw { position: relative; display: block; width: 100%; }
.pt-pw > input { width: 100%; padding-right: 48px; }
.pt-pw-eye { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border: 0;
  background: transparent; color: var(--muted, #6b7590); border-radius: 10px; cursor: pointer; display: grid; place-items: center; }
.pt-pw-eye:hover, .pt-pw-eye[aria-pressed="true"] { color: var(--navy, #0a1430); background: rgba(10, 20, 48, .06); }
.pt-install-done .pt-install-txt span { color: #c7d2ea; }
/* [hidden] siempre gana (los botones de instalar, la oferta y el aviso de la app se muestran solo por JS) */
[data-install-btn][hidden], [data-install-promo][hidden], [data-app-only][hidden], [data-web-only][hidden] { display: none !important; }
.pt-app-gift { margin: 12px 0 0; }

/* REF-001 · Invita y gana */
.pt-invite-link { display: flex; gap: 8px; align-items: stretch; }
.pt-invite-link .pt-input { flex: 1 1 auto; min-width: 0; font-size: 14px; }
.pt-share { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.pt-share-btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 999px; border: 1px solid #d6ddee;
  background: #fff; color: var(--navy); font: inherit; font-weight: 700; font-size: 14px; text-decoration: none; cursor: pointer; }
.pt-share-wa { background: #25d366; border-color: #25d366; color: #fff; }
.pt-share-fb { background: #1877f2; border-color: #1877f2; color: #fff; }
.pt-share-tg { background: #229ed9; border-color: #229ed9; color: #fff; }
.pt-share-more { background: var(--navy); border-color: var(--navy); color: #fff; }
.pt-share-btn[hidden] { display: none !important; }
.pt-invite-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 14px; text-align: center; }
.pt-invite-stats div { background: var(--brand-soft); border-radius: 12px; padding: 10px 6px; display: flex; flex-direction: column; gap: 2px; }
.pt-invite-stats b { font-size: 18px; color: var(--navy); }
.pt-invite-stats span { font-size: 12px; color: #4a5674; }
.pt-invite-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 6px; font-size: 14px; }
.pt-invite-list li { display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid #eef1f7; padding-top: 6px; }
.pt-ok { color: #11875d; font-weight: 700; }

/* RSV-001 · reservas de promociones */
.pt-st--blue { background: var(--brand-soft); color: var(--brand-ink) !important; }
.pt-when { display: grid; gap: 8px; }
.pt-when .pt-opt { align-items: flex-start; }
.pt-when small { display: block; color: #4a5674; font-weight: 500; }
.pt-reserve-note { background: var(--brand-soft); color: var(--brand-ink); border-radius: 12px; padding: 10px 12px; font-size: 14px; display: flex; gap: 8px; }
.pt-when .pt-opt > span { display: block; flex: 1 1 auto; min-width: 0; }
.pt-when .pt-opt > span > b { display: block; margin-bottom: 2px; }

/* CRD-001 / REF-001 · crédito Sancurec, invitar (portada y regalo antes del pago) y cliente frecuente */
.pt-chip-credit { background: #ffd34d; border-color: #ffd34d; color: #0a1430 !important; }
.pt-invite-card { position: relative; overflow: hidden; }
.pt-invite-card.is-gift { border: 2px solid #ffd34d; background: linear-gradient(135deg, #fff9e8, #eef1ff); }
.pt-invite-top { display: flex; gap: 12px; align-items: flex-start; position: relative; }
.pt-gift-ic { font-size: 30px; line-height: 1; flex: none; }
.is-gift .pt-gift-ic { animation: pt-gift 1.6s ease-in-out infinite; }
@keyframes pt-gift { 0%, 100% { transform: rotate(0) scale(1); } 20% { transform: rotate(-12deg) scale(1.12); } 40% { transform: rotate(10deg) scale(1.12); } 60% { transform: rotate(0) scale(1); } }
.pt-invite-title { font-size: 16px; color: var(--navy); }
.pt-confetti { position: absolute; inset: 0; pointer-events: none; }
.pt-confetti i { position: absolute; top: -12px; width: 8px; height: 12px; border-radius: 2px; opacity: .9; animation: pt-fall 2.8s linear forwards; }
.pt-confetti i:nth-child(4n+1) { background: #ffd34d; } .pt-confetti i:nth-child(4n+2) { background: #3355ff; }
.pt-confetti i:nth-child(4n+3) { background: #25d366; } .pt-confetti i:nth-child(4n+4) { background: #ff5c8a; }
.pt-confetti i:nth-child(1) { left: 4%; animation-delay: 0s; } .pt-confetti i:nth-child(2) { left: 11%; animation-delay: .3s; }
.pt-confetti i:nth-child(3) { left: 18%; animation-delay: .1s; } .pt-confetti i:nth-child(4) { left: 26%; animation-delay: .5s; }
.pt-confetti i:nth-child(5) { left: 33%; animation-delay: .2s; } .pt-confetti i:nth-child(6) { left: 41%; animation-delay: .6s; }
.pt-confetti i:nth-child(7) { left: 48%; animation-delay: .15s; } .pt-confetti i:nth-child(8) { left: 56%; animation-delay: .45s; }
.pt-confetti i:nth-child(9) { left: 63%; animation-delay: .05s; } .pt-confetti i:nth-child(10) { left: 70%; animation-delay: .35s; }
.pt-confetti i:nth-child(11) { left: 77%; animation-delay: .55s; } .pt-confetti i:nth-child(12) { left: 84%; animation-delay: .25s; }
.pt-confetti i:nth-child(13) { left: 90%; animation-delay: .4s; } .pt-confetti i:nth-child(14) { left: 96%; animation-delay: .1s; }
@keyframes pt-fall { 0% { transform: translateY(0) rotate(0); opacity: 1; } 85% { opacity: 1; } 100% { transform: translateY(260px) rotate(540deg); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pt-confetti { display: none; } .is-gift .pt-gift-ic { animation: none; } }
.pt-meter { height: 10px; border-radius: 999px; background: #eef1f7; margin-top: 12px; overflow: hidden; }
.pt-meter span { display: block; height: 100%; background: linear-gradient(90deg, #ffd34d, #f5a400); border-radius: 999px; }
.pt-credit-opt { margin-top: 12px; align-items: flex-start; }
.pt-credit-opt small { display: block; color: #4a5674; font-weight: 500; }
.pt-credit-opt > span { display: block; }
.pt-credit-box { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; background: #fff4d6;
  border: 1px solid #ffd34d; border-radius: 14px; padding: 12px 14px; margin: 0 0 14px; }
.pt-credit-box small { display: block; color: #6b4a00; }

/* CMB-001 · recargas agrupadas (saldo · combos · datos) */
.pt-h3 { font-size: 16px; margin: 18px 0 10px; color: var(--navy); }
.pt-tile-amount.is-long { font-size: 17px; line-height: 1.25; }

/* SEO-001 · «Cómo recargar a Cuba» (portada, visitantes) */
.pt-about-steps { margin: 6px 0 10px; padding-left: 22px; display: grid; gap: 6px; color: var(--ink-2); }
.pt-about-note { color: var(--muted); font-size: 14px; margin: 0; }

/* ---------- PRM-002 · Botón llamativo «Ver todas las promociones» (portada, bajo el carrusel) ---------- */
.pt-promos-cta { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; gap: 12px; min-height: 66px; margin: 6px 0 18px; padding: 12px 14px;
  border-radius: 18px; color: #fff; text-decoration: none; background: linear-gradient(120deg, #7c3aed 0%, #4f46e5 45%, #2563eb 100%); background-size: 180% 100%;
  box-shadow: 0 14px 30px -14px rgba(91, 33, 182, .85); animation: ptPromoGlow 2.6s ease-in-out infinite, ptPromoBg 6s ease-in-out infinite; }
.pt-promos-cta:hover, .pt-promos-cta:focus-visible { color: #fff; }
.pt-promos-cta:focus-visible { outline: 3px solid #fbbf24; outline-offset: 3px; }
.pt-promos-cta:active { transform: translateY(1px); }
.pt-promos-cta > span { position: relative; z-index: 1; }
/* Destello que cruza el botón cada pocos segundos */
.pt-promos-cta::after { content: ''; position: absolute; z-index: 0; top: -20%; bottom: -20%; left: 0; width: 40%; pointer-events: none;
  background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, .55) 50%, transparent 100%); transform: translateX(-110%) skewX(-18deg);
  animation: ptPromoShine 3.4s ease-in-out infinite 1s; }
.pt-promos-ic { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255, 255, 255, .18); }
.pt-promos-ic svg { width: 24px; height: 24px; animation: ptPromoTwinkle 2.4s ease-in-out infinite; }
.pt-promos-txt { flex: 1; min-width: 0; line-height: 1.2; }
.pt-promos-txt b { display: block; font-size: 16.5px; font-weight: 800; }
.pt-promos-txt small { display: block; margin-top: 3px; font-size: 12.5px; font-weight: 600; opacity: .9; }
.pt-promos-go { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #fff; color: #4f46e5;
  animation: ptPromoNudge 1.4s ease-in-out infinite; }
/* Estrellita que brilla en la esquina */
.pt-promos-star { position: absolute !important; top: 7px; right: 56px; width: 12px; height: 12px; background: #fff;
  clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); animation: ptPromoStar 1.8s ease-in-out infinite; }
@keyframes ptPromoGlow { 50% { box-shadow: 0 14px 34px -10px rgba(124, 58, 237, .95), 0 0 0 5px rgba(124, 58, 237, .16); } }
@keyframes ptPromoBg { 50% { background-position: 100% 0; } }
@keyframes ptPromoShine { 0% { transform: translateX(-110%) skewX(-18deg); } 55%, 100% { transform: translateX(270%) skewX(-18deg); } }
@keyframes ptPromoTwinkle { 0%, 100% { transform: scale(1) rotate(0); } 50% { transform: scale(1.18) rotate(12deg); } }
@keyframes ptPromoNudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(4px); } }
@keyframes ptPromoStar { 0%, 100% { opacity: .15; transform: scale(.5) rotate(0); } 50% { opacity: 1; transform: scale(1.15) rotate(45deg); } }
@media (prefers-reduced-motion: reduce) {
  .pt-promos-cta, .pt-promos-ic svg, .pt-promos-go, .pt-promos-star { animation: none; }
  .pt-promos-cta::after { display: none; }
}

/* ---------- MKT-001 · combos en lista, etiquetas de Admin, precio con la app y borde de promo animado ---------- */
.pt-tile-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pt-tile-side { display: flex; flex-direction: column; align-items: flex-start; margin-top: auto; }
.pt-tile-side .pt-tile-price { margin-top: 0; }
.pt-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.pt-badge--popular { color: #fff; background: linear-gradient(90deg, #ff6a3d, #ff3d71); }
.pt-badge--recommended { color: #fff; background: linear-gradient(90deg, #3355ff, #7b5cff); }
.pt-badge--new { color: #0b6b43; background: #d9f7e8; }
.pt-appchip { display: inline-flex; align-items: center; gap: 3px; align-self: flex-start; margin-top: 4px; font-size: 11px; font-weight: 800; color: var(--brand-ink);
  background: var(--brand-soft); border: 1px solid #d5ddff; padding: 2px 7px; border-radius: 999px; white-space: nowrap; }
.pt-appchip svg { width: 12px; height: 12px; }
.pt-combo-head { font-size: 24px; font-weight: 800; letter-spacing: -.02em; margin-top: 4px; }
.pt-combo-parts { display: flex; flex-wrap: wrap; gap: 4px 6px; margin: 4px 0 2px; }
.pt-combo-parts span { font-size: 12.5px; font-weight: 700; color: var(--ink-2); background: #f1f4fa; border-radius: 8px; padding: 2px 7px; white-space: nowrap; }
.pt-grid.pt-grid--list { grid-template-columns: 1fr; }
.pt-grid--list .pt-tile { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: center; min-height: 0; }
.pt-grid--list .pt-tags { grid-column: 1 / -1; margin-bottom: 4px; }
.pt-grid--list .pt-tile-side { margin-top: 0; align-items: flex-end; text-align: right; }
.pt-grid--list .pt-tile-price { flex-direction: column; align-items: flex-end; gap: 0; padding-top: 0; }
.pt-grid--list .pt-appchip { align-self: flex-end; }
.pt-grid--list .pt-save { align-self: flex-end; }
.pt-note-app { display: flex; gap: 6px; align-items: flex-start; text-align: left; }
.pt-note-app svg { flex: none; margin-top: 2px; }
.pt-price-col { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: none; }
.pt-chosen .pt-combo-parts span { background: #fff; }
.pt-app-line { display: flex; gap: 8px; align-items: flex-start; }
.pt-app-line svg { flex: none; margin-top: 2px; }
.pt-app-line a { font-weight: 800; }
/* Borde de la tarjeta en promoción: un brillo que recorre la raya naranja y un halo que late */
@property --pt-spin { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.pt-tile.is-promo { border: 2px solid transparent;
  background: linear-gradient(180deg, #fffaf0, #fff 60%) padding-box,
    conic-gradient(from var(--pt-spin), #ffc94d 0deg, #ffc94d 200deg, #ff9f1c 250deg, #fff7dc 285deg, #ff8a00 320deg, #ffc94d 360deg) border-box;
  animation: ptPromoSpin 3s linear infinite, ptPromoPulse 2.4s ease-in-out infinite; }
.pt-tile.is-promo:hover, .pt-tile.is-promo:focus-visible { border-color: transparent; }
@keyframes ptPromoSpin { to { --pt-spin: 360deg; } }
@keyframes ptPromoPulse { 50% { box-shadow: 0 0 0 4px rgba(255, 177, 51, .2), 0 10px 24px -12px rgba(255, 140, 0, .6); } }
@media (prefers-reduced-motion: reduce) { .pt-tile.is-promo { animation: none; } }

/* PWA-003 · minivideo de instalar en iPhone */
.pt-install-pic.pt-install-anim { width: auto; max-width: 100%; height: 260px; max-height: 42vh; margin: 12px auto 0; border-radius: 14px; }

/* ---------- CHK-001 · «Elegir de mis contactos» (Android) / «Pegar número copiado» (iPhone y computadora) ---------- */
.pt-contact { display: none; margin: 0 0 12px; }
.can-pick-contacts .pt-contact, .can-paste-number .pt-contact { display: block; }
.pt-contact-btn { display: none; width: 100%; justify-content: center; gap: 8px; border-style: dashed; }
.can-pick-contacts .pt-contact-pick, .can-paste-number .pt-contact-paste { display: flex; }
.can-pick-contacts .pt-contact-pick + .pt-contact-paste { margin-top: 8px; height: 44px; font-size: 15px; border-style: solid; }
.pt-input.is-filled { box-shadow: 0 0 0 3px rgba(15, 159, 99, .35); transition: box-shadow .3s; }
.pt-contact-ios { display: none; margin-top: 6px; }
.is-ios.can-paste-number .pt-contact-ios { display: block; }
.pt-contact-msg:empty { display: none; }
.pt-contact-msg { margin-top: 6px; font-weight: 700; color: var(--green, #0f9d58); }
.pt-contact-msg.is-bad { color: var(--red, #d93025); }
.pt-or { display: flex; align-items: center; gap: 10px; margin: 12px 0 2px; color: var(--muted, #64748b); font-size: 12.5px; }
.pt-or::before, .pt-or::after { content: ""; flex: 1; height: 1px; background: var(--line, #e2e8f0); }

/* ---------- CHK-002 · reserva: el precio de arriba y los botones de cantidad siguen al radio «¿Cuándo la enviamos?» ---------- */
body:has(.pt-form input[name="when"][value="now"]:checked) [data-qwhen="reserve"] { display: none; }
body:not(:has(.pt-form input[name="when"][value="now"]:checked)) [data-qwhen="now"] { display: none; }

/* ---------- PAU-001 · mantenimiento (compras pausadas por el administrador) ---------- */
.pt-maint-bar { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 14px; padding: 12px 14px; border-radius: 14px; font-size: 14.5px;
  background: #fff6e0; color: #7a4b00; border: 1px solid #f2d59a; }
.pt-maint-bar .ic { flex: none; margin-top: 2px; }
.pt-maint-ic { background: #fff1cc; color: #b26a00; }
.pt-btn[disabled] { opacity: .55; cursor: not-allowed; }

/* PSK-001 · entrar con huella / Face ID */
/* [hidden] siempre gana: todo lo de la huella lo muestra passkeys.js solo si el teléfono puede */
[data-psk-offer][hidden], [data-psk-login-box][hidden], [data-psk-register][hidden], [data-psk-unsupported][hidden] { display: none !important; }
.pt-psk-offer { align-items: flex-start; margin: 4px 0 14px; }
.pt-psk-offer .pt-btn-sm + .pt-btn-sm { margin-left: 6px; }
.pt-psk-ic { flex: none; width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; color: #fff;
  background: linear-gradient(135deg, #2563eb, #06b6d4); }
.pt-psk-ic svg { width: 26px; height: 26px; }
.pt-psk-login .pt-btn { width: 100%; }
[data-psk-msg]:empty { display: none; }
[data-psk-msg].is-bad { color: #b42318; }
/* PSK-002 · huella arriba del formulario de Entrar */
.pt-psk-top { margin: 14px 0 4px; }
.pt-psk-top .pt-or { margin-top: 14px; }
.pt-psk-big { min-height: 54px; font-size: 17px; }
/* CHAT-007 · etiqueta «🇨🇺 Promo Cubacel» (mismos colores que en el chat) */
.pt-badge--cubacel { color: #fff; background: linear-gradient(120deg, #d62839, #1f3ad6); }