/* Estilos mínimos de los campos de pago (captura + OCR, aviso de pago repetido) y de Configuración › Formas de pago.
   Ola 6: antes los ponía pagos-campos.ts con un <style> armado en JS; la CSP ya no permite estilos en línea sin hash, así que
   viven aquí y los enlazan el panel (public/Index.html) y Mi cuenta (public/Cliente.html). Cada pantalla trae además los suyos. */
/* captura-bonita: la captura sigue el componente de subir del panel (M11, .subida) y las tarjetas de archivo (.ent-arch). */
.pc-captura{position:relative;margin:0 0 var(--e3,12px);min-width:0}
.pc-captura-rot{display:block;font-weight:600;margin-bottom:var(--e1,4px)}
.pc-oculto{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;opacity:0}
.pc-captura svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pc-zona{display:flex;align-items:center;gap:var(--e3,12px);min-height:64px;padding:var(--e3,12px) var(--e4,16px);border:1.5px dashed var(--campo-borde,#8593a8);border-radius:var(--r-control,10px);background:var(--superficie,#fff);color:var(--accion-texto,#1f4fa8);cursor:pointer;transition:background .15s,border-color .15s}
.pc-zona svg{width:24px;height:24px}
.pc-zona:hover,.pc-sobre .pc-zona{border-color:var(--accion,#2f6fd0);background:var(--accion-suave,#e8f0fc)}
.pc-sobre .pc-zona{border-style:solid}
.pc-zona:focus-visible{outline:none;border-color:var(--accion,#2f6fd0);box-shadow:var(--anillo,0 0 0 3px rgba(47,111,208,.35))}
.pc-zona-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.pc-zona-txt b{font-weight:700;color:var(--accion-texto,#1f4fa8)}
.pc-zona-txt small{font-size:var(--t-chico,12px);font-weight:500;color:var(--tenue,#5b6b82)}
.pc-apagada .pc-zona{cursor:not-allowed;background:var(--fila,#eef2f7);border-color:var(--linea,#e3e8f0);color:var(--tenue,#5b6b82)}
.pc-apagada .pc-zona-txt b{color:var(--tenue,#5b6b82)}
.pc-arch{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:var(--e3,12px);align-items:center;padding:var(--e2,8px);border:1px solid var(--linea,#e3e8f0);border-radius:var(--r-control,10px);background:var(--superficie-2,#fbfcfe)}
.pc-sobre .pc-arch{border-color:var(--accion,#2f6fd0);background:var(--accion-suave,#e8f0fc)}
.pc-arch-mini{width:56px;height:56px;border-radius:8px;overflow:hidden;background:var(--accion-suave,#e8f0fc);color:var(--accion-texto,#1f4fa8);display:flex;align-items:center;justify-content:center}
.pc-arch-mini img{width:100%;height:100%;object-fit:cover;display:block}
.pc-arch-mini span{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px;font-weight:800;letter-spacing:.05em}
.pc-arch-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.pc-arch-txt b{font-weight:700;color:var(--tinta,#0a1628);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-arch-txt>span{font-size:var(--t-chico,12px);color:var(--tenue,#5b6b82)}
.pc-arch-leyendo{display:flex;align-items:center;gap:6px;color:var(--accion-texto,#1f4fa8)!important;font-weight:600}
.pc-sp{flex:none;width:12px;height:12px;border-radius:50%;border:2px solid var(--accion-borde,#c9dbf5);border-top-color:var(--accion,#2f6fd0);animation:pc-gira .8s linear infinite}
@keyframes pc-gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.pc-sp{animation-duration:2.4s}}
.pc-arch-acc{display:flex;gap:var(--e1,4px)}
.pc-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 var(--e3,12px);border:1px solid var(--linea,#e3e8f0);border-radius:var(--r-control,10px);background:var(--superficie,#fff);color:var(--accion-texto,#1f4fa8);font:inherit;font-size:var(--t-chico,12px);font-weight:700;cursor:pointer}
.pc-btn svg{width:16px;height:16px}
.pc-btn:hover{background:var(--accion-suave,#e8f0fc);border-color:var(--accion-borde,#c9dbf5)}
.pc-btn:focus-visible{outline:none;box-shadow:var(--anillo,0 0 0 3px rgba(47,111,208,.35))}
.pc-btn-mal{color:var(--mal-texto,#b42318)}
.pc-btn-mal:hover{background:var(--mal-fondo,#fdecea);border-color:rgba(180,35,24,.25)}
@media (max-width:480px){.pc-arch{grid-template-columns:48px minmax(0,1fr)}
.pc-arch-mini{width:48px;height:48px}
.pc-arch-acc{grid-column:1/-1}
.pc-arch-acc .pc-btn{flex:1;justify-content:center;min-height:40px}}
.pc-captura-estado{margin:var(--e2,8px) 0 0;padding:var(--e2,8px) var(--e3,12px);border-radius:var(--r-control,10px);font-size:var(--t-chico,12.5px);line-height:1.45;font-weight:600}
.pc-tono-inicio{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pc-tono-bien{background:var(--bien-fondo,#e5f5ec);color:var(--bien-texto,#0f7a47)}
.pc-tono-neutro{background:var(--neutro-fondo,#eef2f7);color:var(--neutro-texto,#33415a)}
.pc-tono-aviso{background:var(--atencion-fondo,#fff1d6);color:var(--atencion-texto,#8a5200)}
.pc-tono-mal,.pc-rechazada .pc-captura-estado{background:var(--mal-fondo,#fdecea);color:var(--mal-texto,#b42318)}
.pc-dup{border:1px solid #e0b252;background:rgba(224,178,82,.12);border-radius:10px;padding:10px 12px;margin:8px 0}
.pc-dup label{display:block;margin:4px 0}
.pc-dup textarea{width:100%;box-sizing:border-box}
.pc-ayuda{font-size:.8em;opacity:.75;margin-top:2px}
.pc-dup-txt{margin:0 0 6px}
.fp-panel{max-width:960px}
.fp-lista{display:grid;gap:12px}
.fp-forma{border:1px solid var(--linea,#d9dde3);border-radius:10px;padding:10px 12px 12px;margin:0;min-width:0}
.fp-forma legend{font-weight:600;padding:0 6px}
.fp-rejilla{display:grid;gap:10px;grid-template-columns:minmax(160px,2fr) repeat(2,minmax(130px,1.3fr)) repeat(2,minmax(96px,.9fr))}
@media (max-width:900px){.fp-rejilla{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.fp-ancho{grid-column:span 2}}
.fp-c{display:flex;flex-direction:column;gap:4px;min-width:0}
.fp-c label{font-size:.85em;font-weight:600}
.fp-c input,.fp-c select{width:100%;min-width:0;box-sizing:border-box}
.fp-marcas{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-top:10px}
.fp-marca{display:flex;gap:6px;align-items:center}
.fp-quitar{margin-left:auto}
@media (max-width:520px){.fp-rejilla .fp-ancho{grid-column:auto}
.fp-rejilla{grid-template-columns:1fr 1fr}
.fp-rejilla .fp-ancho,.fp-rejilla .fp-c:nth-child(2),.fp-rejilla .fp-c:nth-child(3){grid-column:1/-1}
.fp-quitar{margin-left:0}}
.fp-acc{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
/* diseno-ux: el pago repetido es una caja roja (box r) que dice primero qué pasó, ofrece «Cancelar» y deja el motivo pegado a la casilla. */
.pc-dup.pc-dup-r{border:1px solid currentColor;background:var(--mal-fondo,#fdecea);color:var(--mal-texto,#b42318);padding:12px 14px}
.pc-dup.pc-dup-r:focus{outline:2px solid var(--mal-texto,#b42318);outline-offset:2px}
.pc-dup-tit{margin:0 0 4px!important;font-size:1.02em}
.pc-dup-r .pc-dup-txt{margin:0 0 8px!important;font-size:.92em}
.pc-dup-acc{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:0 0 10px;margin:0 0 8px;border-bottom:1px solid rgba(180,35,24,.25)}
.pc-dup-acc .btn{margin-left:0!important}
.pc-dup-otro{color:var(--texto,#1d2433)}
.pc-dup-otro .pc-dup-si{font-weight:400}
.pc-dup-otro label[for]{font-weight:600;margin-top:8px}
.pc-dup-otro textarea:disabled{opacity:.55;cursor:not-allowed}
.pc-dup-otro .pc-ayuda{opacity:1;color:var(--tenue,#555f6d)}