:root{--teclado-tactil-alto:0px}
.teclado-tactil-sistema{position:fixed;z-index:20000;left:50%;bottom:0;width:min(920px,100vw);padding:10px 12px max(10px,env(safe-area-inset-bottom));border:1px solid #334155;border-bottom:0;border-radius:18px 18px 0 0;background:#152235;box-shadow:0 -12px 34px #0f172a59;transform:translate(-50%,110%);transition:transform .18s ease;visibility:hidden;font-family:Arial,Helvetica,sans-serif;touch-action:manipulation;user-select:none}
body.teclado-tactil-abierto .teclado-tactil-sistema{transform:translate(-50%,0);visibility:visible}
.teclado-tactil-cabecera{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 2px 8px;color:#fff}.teclado-tactil-cabecera strong{font-size:15px}.teclado-tactil-cerrar{min-width:48px;min-height:42px;border:1px solid #64748b;border-radius:10px;background:#334155;color:#fff;font-size:21px;font-weight:700}.teclado-tactil-filas{display:grid;gap:7px}.teclado-tactil-fila{display:flex;justify-content:center;gap:6px}
.teclado-tactil-tecla{flex:1 1 0;min-width:42px;min-height:49px;padding:5px 7px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;color:#172033;box-shadow:0 2px 0 #94a3b8;font-size:19px;font-weight:700;line-height:1;touch-action:manipulation}.teclado-tactil-tecla:active,.teclado-tactil-tecla.activa{transform:translateY(2px);box-shadow:none;background:#dbeafe}.teclado-tactil-tecla.especial{background:#e2e8f0;font-size:14px}.teclado-tactil-tecla.confirmar{background:#16a34a;border-color:#15803d;color:#fff;box-shadow:0 2px 0 #166534}.teclado-tactil-tecla.peligro{background:#ef4444;border-color:#dc2626;color:#fff;box-shadow:0 2px 0 #991b1b}.teclado-tactil-tecla.espacio{flex-grow:4.5}.teclado-tactil-tecla.ancha{flex-grow:1.65}.teclado-tactil-numerico{width:min(500px,100vw)}.teclado-tactil-numerico .teclado-tactil-tecla{min-height:58px;font-size:23px}.teclado-tactil-numerico .teclado-tactil-tecla.especial{font-size:14px}
@media(max-width:700px){.teclado-tactil-sistema{padding-left:5px;padding-right:5px;border-radius:12px 12px 0 0}.teclado-tactil-filas,.teclado-tactil-fila{gap:4px}.teclado-tactil-tecla{min-width:0;min-height:46px;padding:4px 2px;font-size:16px}.teclado-tactil-tecla.especial{font-size:11px}}
@media print{.teclado-tactil-sistema{display:none!important}}

.control-teclado-tactil{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:7px 10px;border:1px solid #cbd5e1;border-radius:9px;background:#e2e8f0;color:#334155;font:700 12px Arial,Helvetica,sans-serif;cursor:pointer;white-space:nowrap}.control-teclado-tactil.activo{border-color:#22c55e;background:#dcfce7;color:#166534}.app-session-card .control-teclado-tactil{margin-left:auto;border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.1);color:#fff}.app-session-card .control-teclado-tactil.activo{border-color:#86efac;background:#166534;color:#fff}.app-session-card .control-teclado-tactil+.app-session-logout{margin-left:0}

.teclado-tactil-visor{display:block;min-height:54px;margin:0 0 9px;padding:11px 15px;overflow-x:auto;border:2px solid #60a5fa;border-radius:11px;background:#fff;color:#0f172a;font-size:25px;font-weight:800;line-height:1.15;letter-spacing:.3px;white-space:nowrap;text-align:left;box-shadow:inset 0 1px 3px rgba(15,23,42,.12)}.teclado-tactil-visor.vacio{color:#64748b;font-size:17px;font-weight:600}

/* Vista horizontal para conservar visibles las sugerencias de búsqueda. */
@media(min-width:701px){
.teclado-tactil-sistema{display:grid;grid-template-columns:minmax(150px,190px) minmax(0,1fr);column-gap:10px;row-gap:6px;width:min(1400px,100vw);padding:6px 10px max(7px,env(safe-area-inset-bottom))}
.teclado-tactil-cabecera{grid-column:1;padding:0;min-height:44px}
.teclado-tactil-visor{grid-column:2;min-height:44px;margin:0;padding:8px 13px;font-size:22px}
.teclado-tactil-visor.vacio{font-size:15px}
.teclado-tactil-filas{grid-column:1/-1;gap:5px}
.teclado-tactil-fila{gap:5px}
.teclado-tactil-tecla{min-height:41px;padding:4px 6px;font-size:17px}
.teclado-tactil-tecla.especial{font-size:12px}
.teclado-tactil-numerico{width:min(650px,100vw)}
.teclado-tactil-numerico .teclado-tactil-tecla{min-height:46px;font-size:20px}
}