/* X de cerrar en ventanas emergentes (Fabio, 2026-10-18).
   Un solo lugar para el color: fondo rojo oscuro #b91c1c, X blanca, sin línea blanca.
   Al pasar el mouse, al enfocar con teclado o al tocarla (celular/tablet) pasa en 0.2 s
   a un rojo más claro #ef4444 con un brillo suave, y vuelve sola al rojo oscuro.
   No cambia tamaño ni lugar. Claro y oscuro, celular y computadora.
   Ventana nueva: el botón X lleva la clase close-btn (o x-cerrar, que ya está aquí). */
html body .close-btn,
html body .x-cerrar,
html body .pos-venta-detalle-x,
html body .cot-close,
html body .gt-x,
html body .ayu-x,
html body #notas-panel .notas-panel-hd__close,
html body .presencia-panel .presencia-close,
html body .notas-panel-hd__close,
html body .presencia-close,
html body .hub-tutoriales-modal__close,
html body .landing-tutoriales-modal__close,
html body .pos-lightbox-close,
html body .mc-share-x,
html body .pwa-modal__x,
html body .orden-notas-drawer__close,
html body .mp-x,
html body .chat-av-x,
html body .orden-fotos-lightbox-close,
html body .cef-modal-x,
html body .ctr-x,
html body .ref-x,
html body .cp-gal-x,
html body .eqc-visor-x,
html body #ayu-cerrar-x,
html body #ayu-info-x,
html body .lpo-x,
html body .adm-borrar-float__x,
html body .modal-header > button.btn-ghost.btn-sm,
html body .etq-hd button.btn-ghost[onclick*="etqCerrar"],
html body #mc-pos-mas-x,
html body #mc-hdr-mas-x,
html body button.amc-ib[data-c="cerrar"] {
  background-color: #b91c1c !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-color: #b91c1c !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}

/* Solo donde hay mouse de verdad: en la pantalla táctil el :hover no se queda pegado. */
@media (hover: hover) {
  html body .close-btn:hover,
  html body .x-cerrar:hover,
  html body .pos-venta-detalle-x:hover,
  html body .cot-close:hover,
  html body .gt-x:hover,
  html body .ayu-x:hover,
  html body #notas-panel .notas-panel-hd__close:hover,
  html body .presencia-panel .presencia-close:hover,
  html body .notas-panel-hd__close:hover,
  html body .presencia-close:hover,
  html body .hub-tutoriales-modal__close:hover,
  html body .landing-tutoriales-modal__close:hover,
  html body .pos-lightbox-close:hover,
  html body .mc-share-x:hover,
  html body .pwa-modal__x:hover,
  html body .orden-notas-drawer__close:hover,
  html body .mp-x:hover,
  html body .chat-av-x:hover,
  html body .orden-fotos-lightbox-close:hover,
  html body .cef-modal-x:hover,
  html body .ctr-x:hover,
  html body .ref-x:hover,
  html body .cp-gal-x:hover,
  html body .eqc-visor-x:hover,
  html body #ayu-cerrar-x:hover,
  html body #ayu-info-x:hover,
  html body .lpo-x:hover,
  html body .adm-borrar-float__x:hover,
  html body .modal-header > button.btn-ghost.btn-sm:hover,
  html body .etq-hd button.btn-ghost[onclick*="etqCerrar"]:hover,
  html body #mc-pos-mas-x:hover,
  html body #mc-hdr-mas-x:hover,
  html body button.amc-ib[data-c="cerrar"]:hover {
    background-color: #ef4444 !important;
    border-color: #ef4444 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 0 0 4px rgba(239, 68, 68, .30) !important;
  }
}

html body .close-btn:focus-visible,
html body .x-cerrar:focus-visible,
html body .pos-venta-detalle-x:focus-visible,
html body .cot-close:focus-visible,
html body .gt-x:focus-visible,
html body .ayu-x:focus-visible,
html body #notas-panel .notas-panel-hd__close:focus-visible,
html body .presencia-panel .presencia-close:focus-visible,
html body .notas-panel-hd__close:focus-visible,
html body .presencia-close:focus-visible,
html body .hub-tutoriales-modal__close:focus-visible,
html body .landing-tutoriales-modal__close:focus-visible,
html body .pos-lightbox-close:focus-visible,
html body .mc-share-x:focus-visible,
html body .pwa-modal__x:focus-visible,
html body .orden-notas-drawer__close:focus-visible,
html body .mp-x:focus-visible,
html body .chat-av-x:focus-visible,
html body .orden-fotos-lightbox-close:focus-visible,
html body .cef-modal-x:focus-visible,
html body .ctr-x:focus-visible,
html body .ref-x:focus-visible,
html body .cp-gal-x:focus-visible,
html body .eqc-visor-x:focus-visible,
html body #ayu-cerrar-x:focus-visible,
html body #ayu-info-x:focus-visible,
html body .lpo-x:focus-visible,
html body .adm-borrar-float__x:focus-visible,
html body .modal-header > button.btn-ghost.btn-sm:focus-visible,
html body .etq-hd button.btn-ghost[onclick*="etqCerrar"]:focus-visible,
html body #mc-pos-mas-x:focus-visible,
html body #mc-hdr-mas-x:focus-visible,
html body button.amc-ib[data-c="cerrar"]:focus-visible,
html body .close-btn:active,
html body .x-cerrar:active,
html body .pos-venta-detalle-x:active,
html body .cot-close:active,
html body .gt-x:active,
html body .ayu-x:active,
html body #notas-panel .notas-panel-hd__close:active,
html body .presencia-panel .presencia-close:active,
html body .notas-panel-hd__close:active,
html body .presencia-close:active,
html body .hub-tutoriales-modal__close:active,
html body .landing-tutoriales-modal__close:active,
html body .pos-lightbox-close:active,
html body .mc-share-x:active,
html body .pwa-modal__x:active,
html body .orden-notas-drawer__close:active,
html body .mp-x:active,
html body .chat-av-x:active,
html body .orden-fotos-lightbox-close:active,
html body .cef-modal-x:active,
html body .ctr-x:active,
html body .ref-x:active,
html body .cp-gal-x:active,
html body .eqc-visor-x:active,
html body #ayu-cerrar-x:active,
html body #ayu-info-x:active,
html body .lpo-x:active,
html body .adm-borrar-float__x:active,
html body .modal-header > button.btn-ghost.btn-sm:active,
html body .etq-hd button.btn-ghost[onclick*="etqCerrar"]:active,
html body #mc-pos-mas-x:active,
html body #mc-hdr-mas-x:active,
html body button.amc-ib[data-c="cerrar"]:active {
  background-color: #ef4444 !important;
  border-color: #ef4444 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 0 0 4px rgba(239, 68, 68, .30) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .close-btn,
  html body .x-cerrar,
  html body .pos-venta-detalle-x,
  html body .cot-close,
  html body .gt-x,
  html body .ayu-x,
  html body #notas-panel .notas-panel-hd__close,
  html body .presencia-panel .presencia-close,
  html body .notas-panel-hd__close,
  html body .presencia-close,
  html body .hub-tutoriales-modal__close,
  html body .landing-tutoriales-modal__close,
  html body .pos-lightbox-close,
  html body .mc-share-x,
  html body .pwa-modal__x,
  html body .orden-notas-drawer__close,
  html body .mp-x,
  html body .chat-av-x,
  html body .orden-fotos-lightbox-close,
  html body .cef-modal-x,
  html body .ctr-x,
  html body .ref-x,
  html body .cp-gal-x,
  html body .eqc-visor-x,
  html body #ayu-cerrar-x,
  html body #ayu-info-x,
  html body .lpo-x,
  html body .adm-borrar-float__x,
  html body .modal-header > button.btn-ghost.btn-sm,
  html body .etq-hd button.btn-ghost[onclick*="etqCerrar"],
  html body #mc-pos-mas-x,
  html body #mc-hdr-mas-x,
  html body button.amc-ib[data-c="cerrar"] {
    transition: none !important;
  }
}
