/* Mosal CRM · Rediseño UX (23/10/2026, fases 3 y 4) · seguimiento-cajon.css
   Dónde va el cajón de ficha (seguimiento-cajon.js) y el buscador Ctrl K (ui/rd-buscar.js) en el CRM real. Lo de dentro
   (cabecera, «Lo que falta», secciones, 409, Ctrl K) lo pinta ui/components.css (la evolución, acotada a .m-rd).
   · ≥ 961 px: cajón fijo a la derecha (440 px; 480 desde 1440), sobre la vista; desde 1100 px la página deja su sitio
     (la lista se compacta en vez de quedar tapada).
   · ≤ 960 px: página entera (D19; ronda 3, R2-03: a 768 px tapaba media barra y el foco pasaba por debajo). */

.rd-cajon-capa[hidden] { display: none !important; }
#rd-cajon.rd-cajon {
  position: fixed; top: 0; right: 0; bottom: 0; left: auto; z-index: 70;
  width: var(--m-drawer-w-md, 440px); max-width: 100vw; height: 100vh; height: 100dvh;
  display: flex; flex-direction: column; overflow: hidden; margin: 0;
  background: var(--m-surface); box-shadow: var(--m-shadow-drawer); border-left: 1px solid var(--m-line);
}
@media (min-width: 1440px) { #rd-cajon.rd-cajon { width: var(--m-drawer-w, 480px); } }
@media (min-width: 1100px) {
  html.rd-con-cajon body { padding-right: var(--m-drawer-w-md, 440px); box-sizing: border-box; }
}
@media (min-width: 1440px) {
  html.rd-con-cajon body { padding-right: var(--m-drawer-w, 480px); }
}
@media (max-width: 960px) {
  #rd-cajon.rd-cajon { left: 0; width: 100vw; border-left: 0; box-shadow: none; z-index: 95; }
  html.rd-con-cajon body { overflow: hidden; }
}
#rd-cajon .m-drawer__inner { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
#rd-cajon .m-drawer__fixed { flex: none; }
#rd-cajon .m-drawer__scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
@media (max-width: 720px) {
  /* En el móvil se desplaza el cajón entero (la cabecera fija ocupaba media pantalla) */
  #rd-cajon .m-drawer__inner { overflow-y: auto; }
  #rd-cajon .m-drawer__scroll { overflow: visible; flex: none; }
}

/* Carga: nunca «Ninguno» antes de los datos */
.m-rd .rd-esqueleto { display: grid; gap: 12px; padding: var(--m-sp-4, 16px) 0; }
.m-rd .rd-esqueleto i { display: block; height: 44px; border-radius: 8px; background: var(--m-skeleton, #eef1ef); }

/* Error en línea con «Reintentar» (MosalRd.errorEnLinea): en su sitio, sin tapar lo escrito */
.m-rd .m-inline-error { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0 0; padding: 8px 12px;
  border: 1px solid var(--m-block-line, #e3b7b2); border-radius: 8px; background: var(--m-block-bg, #fdf1ef); color: var(--m-block-ink, #8c2a1f);
  font-size: var(--m-fs-14, 14px); line-height: 20px; }
.m-rd .m-inline-error__t { flex: 1 1 200px; min-width: 0; }
.m-rd li > .m-inline-error { grid-column: 1 / -1; }

/* El botón ocupado no se pulsa dos veces */
.m-rd [aria-busy="true"] { cursor: progress; opacity: .7; }

/* Ctrl K (ui/rd-buscar.js): el diálogo vive en la capa de arriba */
.m-rd .m-palette .m-tag--dup { margin-left: 6px; }
.m-rd .m-palette__opt[aria-selected="true"] { outline: 2px solid var(--m-ring, #1f6f4a); outline-offset: -2px; }

/* Fase 8 · nombre larguísimo: dos líneas en la cabecera y «Ver el nombre completo» (lienzo Estado_nombre_largo) */
.m-rd .m-drawer__head .rd-nombre-mas { margin: 2px 0 4px -8px; }
.m-rd .m-ui .m-drawer__head .m-drawer__name { -webkit-line-clamp: 2; }
.m-rd .m-ui .m-drawer__head.is-nombre-abierto .m-drawer__name { display: block; -webkit-line-clamp: unset; overflow: visible; overflow-wrap: anywhere; }

/* «Mover de fase» (02/11): lo que se dio por hecho a mano, plegado dentro del aviso */
.rd-movido__faltas { margin-top: 4px; }
.rd-movido__faltas summary { cursor: pointer; font-weight: 600; }
.rd-movido__faltas ul { margin: 4px 0 0 18px; padding: 0; }

/* «Mover de fase» arriba (09/11): en el móvil comparte la barra de abajo con el botón principal, sin añadirle otra fila */
@media (max-width: 720px) {
  .m-rd .m-drawer__actions > .m-btn--primary:has(+ [data-rd-accion="mover-fase"]) { flex: 1 1 0; }
  .m-rd .m-drawer__actions > [data-rd-accion="mover-fase"]:not(:only-child) { flex: 0 0 auto; }
}