/* Móvil: objetivos táctiles de al menos 44 px (los enlaces dentro de una frase quedan como están: min-height no afecta a los enlaces en línea)
   y ningún texto por debajo de 11 px. Se carga junto al CSS de Tailwind en todas las pantallas (bk_tw_css). */
@media (max-width:767px){
a,button,summary,[role=button]{min-height:44px}
button,[role=button],summary{min-width:44px}
a.inline-flex,a.flex,button{align-items:center}
a.inline-flex.justify-center{min-width:44px}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]),select{min-height:44px}
input[type=checkbox],input[type=radio]{width:24px;height:24px}
.tap{display:inline-flex;align-items:center}
td a,td button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding-inline:4px}
}
@media (max-width:640px){.text-\[9px\],.text-\[10px\]{font-size:11px !important;line-height:1.3 !important}}
/* Tablas anchas en móvil: las listas (table.bk-stack) pasan a tarjetas y las numéricas se desplazan con un degradado que avisa de que hay más columnas (assets/js/bk-tables.js). */
@media (max-width:640px){
table.bk-stack,table.bk-stack tbody{display:block;width:100%;min-width:0 !important}
table.bk-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
table.bk-stack tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2px 14px;padding:12px 16px;border-bottom:1px solid rgba(100,116,139,.25)}
table.bk-stack td:first-child,table.bk-stack td:last-child,table.bk-stack td[colspan]{grid-column:1/-1}
table.bk-stack td:last-child:has(a,button,form)::before{display:none !important}
table.bk-stack td:has(form){grid-column:1/-1}
table.bk-stack td form{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
table.bk-stack tr:last-child{border-bottom:0}
table.bk-stack td{display:block;padding:5px 0 !important;text-align:left !important;white-space:normal !important;border:0 !important}
table.bk-stack td[data-label]::before{content:attr(data-label);display:block;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;opacity:.65;margin-bottom:1px}
.overflow-x-auto.bk-more-r,.tw.bk-more-r,.bk-scroll.bk-more-r{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.overflow-x-auto.bk-more-l,.tw.bk-more-l,.bk-scroll.bk-more-l{-webkit-mask-image:linear-gradient(270deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(270deg,#000 calc(100% - 28px),transparent)}
.overflow-x-auto.bk-more-l.bk-more-r,.tw.bk-more-l.bk-more-r,.bk-scroll.bk-more-l.bk-more-r{-webkit-mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent)}
}
/* Un contenedor con desplazamiento horizontal debe ser el bloque contenedor de lo que tiene dentro: si no, los textos solo para lectores
   de pantalla (.sr-only, posición absoluta) dentro de tablas anchas se salen y ensanchan la página en el celular. */
.overflow-x-auto{position:relative}