/* BoleteraDigital · base responsiva transversal
   Mantiene los componentes de cada página y evita desbordamientos/zoom accidental. */
html{
  inline-size:100%;
  max-inline-size:100%;
  overflow-x:clip;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  min-inline-size:0;
  max-inline-size:100%;
  min-block-size:100dvh;
  overflow-wrap:break-word;
}
*,*::before,*::after{box-sizing:border-box}
main,header,footer,nav,section,article,aside,form,fieldset{min-inline-size:0}
:where(img,picture,video,canvas,svg,iframe){max-inline-size:100%}
/* Esta hoja se carga al final: una altura automática con especificidad normal
   anulaba los tamaños exactos de iconos e imágenes definidos por cada vista. */
:where(img,picture,video,canvas){block-size:auto}
:where(img){image-rendering:auto}
svg{shape-rendering:geometricPrecision}
button svg,a svg,[role="button"] svg,.app-icon,.ui-icon,.auth-glyph{
  filter:none;
  -webkit-filter:none;
  box-shadow:none;
  text-shadow:none;
}
img[src*="/assets/icons/"],img[src*="/images/ui/"]{
  display:inline-block;
  object-fit:contain;
  image-rendering:auto;
  border:0;
  outline:0;
  box-shadow:none;
  background:transparent;
}
/* Los logos bancarios se mantienen nítidos: el drop-shadow sobre transparencias
   pequeñas producía halos visibles en pantallas móviles de alta densidad. */
img[data-payment-logo],.institution__logo img.payment-logo{
  display:block;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  inline-size:100%!important;
  block-size:100%!important;
  max-inline-size:100%!important;
  max-block-size:100%!important;
  object-fit:contain!important;
  object-position:center;
  image-rendering:auto;
  opacity:1!important;
  visibility:visible!important;
}
.institution__logo img:not(.is-monochrome),.preview-logo img:not(.is-monochrome),.payment-logo:not(.is-monochrome){
  filter:none!important;
  -webkit-filter:none!important;
}
.institution__logo img.is-monochrome,.preview-logo img.is-monochrome,.payment-logo.is-monochrome{
  filter:brightness(0) saturate(0) invert(1)!important;
  -webkit-filter:brightness(0) saturate(0) invert(1)!important;
}
input,select,textarea,button{max-inline-size:100%;font:inherit}
button,a,input,select,textarea,summary{touch-action:manipulation}
[hidden]{display:none!important}
@supports not (overflow:clip){html,body{overflow-x:hidden}}
@media(max-width:767px){
  input:not([type="checkbox"]):not([type="radio"]),select,textarea{font-size:max(16px,1em)}
}
@media(prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
}
@media(display-mode:standalone){
  body{min-block-size:100svh;min-block-size:100dvh}
  [role="dialog"],[aria-modal="true"]{max-block-size:100dvh}
  /* Dashboard ya reserva el safe-area en su contenedor. Duplicarlo aquí dejaba
     el encabezado demasiado abajo en la PWA de iOS. */
  .cp2-topbar,.app-header{padding-top:env(safe-area-inset-top)}
  .cp2-toast-region,.form-toast-region{bottom:max(14px,env(safe-area-inset-bottom))}
}