/*
 * Marco de los diálogos.
 *
 * Reemplaza al que armaba CustomDialogBox: un DecoratorPanel de 3x3 donde seis
 * celdas existían sólo para pintar el borde con corner_blue.png, hborder y
 * vborder, con el contenido metido en un Grid de 1x1.
 *
 * Va como hoja aparte y no como CssResource por el mismo motivo que botones.css
 * y ops26.css: usa flex, calc y máscaras, que el parser de CssResource de GWT no
 * entiende, y así se ajusta el diseño sin recompilar el módulo.
 *
 * Se engancha después de Donasur.css a propósito: hay reglas viejas con
 * !important que hay que ganarles, y entre dos !important de igual peso gana la
 * última.
 *
 * Dos cosas viven acá y no en el Java, y conviene que siga así: el ancho, que
 * entra por --dsr-dlg-ancho para que la media query lo pueda pisar, y la
 * posición, que es un centrado por CSS. El Java sólo escribe --dsr-dlg-x/y
 * mientras arrastran el diálogo.
 */

.dsr-dlg {
	--dsr-dlg-ancho: 620px;
	--dsr-dlg-arrastre: 1;
	position: fixed !important;
	left: 50% !important;
	top: 50% !important;
	transform: translate(calc(-50% + var(--dsr-dlg-x, 0px)), calc(-50% + var(--dsr-dlg-y, 0px)));
	/* Van separados y no como min(): el ancho también puede ser max-content, que
	   es una palabra de dimensionado y adentro de min() no es válida. */
	width: var(--dsr-dlg-ancho);
	max-width: 94vw;
	font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	color: #2c3340;
}

/* Donasur.css le pone un borde de 3 px a todos los popups, con !important. */
.gwt-PopupPanel.dsr-dlg {
	border: 0 !important;
	background: none;
	padding: 0;
}

/* El div que GWT mete entre el popup y el widget. */
.dsr-dlg .popupContent {
	border: 0;
	padding: 0;
	background: none;
}

.dsr-dlg-vidrio {
	background-color: #0b1524;
	opacity: .38;
}

/* ----------------------------------------------------------------- la caja */

/*
 * Columna de tres: encabezado y pie quedan fijos y el cuerpo es el único que
 * scrollea. Es lo que hace que un selector de filtros largo entre en una
 * pantalla de 768 px en vez de irse abajo del borde.
 */
.dsr-dlg__caja {
	display: flex;
	flex-direction: column;
	max-height: 85vh;
	background: #fff;
	border: 1px solid #d7deea;
	border-radius: 6px;
	box-shadow: 0 14px 38px rgba(16, 32, 64, .22), 0 2px 6px rgba(16, 32, 64, .10);
	overflow: hidden;
	animation: dsr-dlg-entra .13s ease-out;
}

/*
 * Sólo el deslizamiento, sin opacidad: si la animación no llega a correr —un
 * tab estrangulado alcanza— el diálogo tiene que quedar igual a la vista. Con
 * un from de opacity:0 se queda invisible, y esto es lo que hay que leer sí o sí.
 */
@keyframes dsr-dlg-entra {
	from {
		transform: translateY(-6px);
	}
	to {
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.dsr-dlg__caja {
		animation: none;
	}
}

/* ------------------------------------------------------------- encabezado */

.dsr-dlg__cab {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 12px 14px;
	background: var(--dsr-dlg-tinte);
	border-bottom: 1px solid var(--dsr-dlg-borde);
	cursor: move;
	-webkit-user-select: none;
	user-select: none;
}

.dsr-dlg__tit {
	flex: 1 1 auto;
	min-width: 0;
}

.dsr-dlg__titulo {
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--dsr-dlg-tinta);
}

.dsr-dlg__sub {
	margin: 3px 0 0;
	font-size: 12px;
	line-height: 1.35;
	color: #5c6470;
}

/*
 * El glifo se elige por la clase del acento y se pinta con el color del texto,
 * igual que los íconos de botones.css. Ninguno se nombra en el Java.
 */
.dsr-dlg__ico {
	flex: none;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	background-color: var(--dsr-dlg-tinta);
	-webkit-mask-image: var(--dsr-dlg-glifo);
	mask-image: var(--dsr-dlg-glifo);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 18px 18px;
	mask-size: 18px 18px;
}

/*
 * Los botones del encabezado: el signo de pregunta de la ayuda en línea y la
 * equis. Los dos son botones y no <img>, así que ahora se llega con el
 * tabulador; el de la ayuda además sube desde adentro del formulario, donde
 * quedaba abajo del encabezado nuevo y a nadie se le ocurría buscarlo ahí.
 *
 * Los 26 px son para que se les pueda pegar cómodo, pero al alinear el
 * encabezado tienen que pesar sólo lo que la línea del título. Si pesan 26, son
 * ellos los que fijan el alto de la franja y —con el alineado arriba, que es lo
 * que necesita el subtítulo— el glifo y el título quedan 3 px más arriba del
 * centro. Los márgenes negativos les sacan del cálculo lo que les sobra sin
 * achicarles el área para el clic.
 */
.dsr-dlg__accion {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	margin-top: -4px;
	margin-bottom: -4px;
	padding: 0;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: var(--dsr-dlg-tinta);
	cursor: pointer;
}

.dsr-dlg__accion:hover {
	background: rgba(12, 26, 51, .08);
}

.dsr-dlg__accion:focus-visible {
	outline: 2px solid var(--dsr-dlg-tinta);
	outline-offset: 1px;
}

/* La equis: una máscara pintada con el color del texto, como los íconos de botones.css. */
.dsr-dlg__cerrar .dsr-dlg__accion-ico {
	width: 14px;
	height: 14px;
	background-color: currentColor;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.2 4.2l7.6 7.6M11.8 4.2l-7.6 7.6'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.2 4.2l7.6 7.6M11.8 4.2l-7.6 7.6'/%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 14px 14px;
	mask-size: 14px 14px;
}

/*
 * El signo de pregunta va al revés: rueda llena con la tinta del acento y el
 * signo calado en blanco. Es como lo venía mostrando la app —el help24.png que
 * estaba adentro del formulario era una rueda azul con el signo blanco— y a
 * esta medida se lee de un vistazo, que una rueda de contorno no logra: el
 * signo de adentro se empasta.
 *
 * Por eso no es una máscara sola como la equis: la máscara pinta de un color y
 * acá hacen falta dos. La rueda es el fondo del span y el signo va calado en el
 * ::after. La tinta la sigue poniendo el acento, así que en un diálogo rojo o
 * ámbar la rueda se tiñe sola.
 */
.dsr-dlg__ayuda .dsr-dlg__accion-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--dsr-dlg-tinta);
}

/*
 * El circle-question-mark de Lucide sin su círculo: el viewBox viene recortado
 * al signo para que llene la rueda en vez de quedar flotando en el medio.
 */
.dsr-dlg__ayuda .dsr-dlg__accion-ico::after {
	content: "";
	width: 100%;
	height: 100%;
	background: #fff;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='7.3 6.5 9.4 11.6' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='7.3 6.5 9.4 11.6' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 9px 9px;
	mask-size: 9px 9px;
}

/* ------------------------------------------------------------------ cuerpo */

.dsr-dlg__cuerpo {
	flex: 0 1 auto;
	min-height: 0;
	overflow: auto;
	padding: 16px 18px;
	background: #fff;
}

/* --------------------------------------------------------------------- pie */

.dsr-dlg__pie {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
	background: #f6f8fb;
	border-top: 1px solid #e4e9f2;
}

.dsr-dlg__nota {
	font-size: 11px;
	color: #6b7280;
}

/*
 * Los botones tienen que ser hijos directos de acá: es este gap el que los
 * separa, y si llegan envueltos en un panel propio se appendean sin nada en el
 * medio y quedan a 0 px. Por eso Dialogo expone addAccion(Widget) de a uno.
 *
 * 14 y no 8 porque el espacio entre botones tiene que ganarle claro al que cada
 * botón tiene adentro entre su ícono y su texto, que son 7 px en botones.css.
 */
.dsr-dlg__acciones {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-left: auto;
}

/* ----------------------------------------------------------------- acentos */

/*
 * El encabezado se tiñe según lo que hace el diálogo. Los cuatro colores son los
 * de botones.css y el fondo es un tinte del 9 % del mismo color sobre blanco;
 * acá no se inventa ninguno.
 */

.dsr-dlg--info {
	--dsr-dlg-tinta: #1a4f9c;
	--dsr-dlg-tinte: #eaeff6;
	--dsr-dlg-borde: #d3ddec;
}

.dsr-dlg--atencion {
	--dsr-dlg-tinta: #b45309;
	--dsr-dlg-tinte: #f8f0e9;
	--dsr-dlg-borde: #eddfcd;
}

.dsr-dlg--peligro {
	--dsr-dlg-tinta: #a81f14;
	--dsr-dlg-tinte: #f7ebea;
	--dsr-dlg-borde: #ecd6d3;
}

.dsr-dlg--exito {
	--dsr-dlg-tinta: #1c7a44;
	--dsr-dlg-tinte: #ebf3ee;
	--dsr-dlg-borde: #d5e6dc;
}

/* >>> iconos de Lucide: generados por scripts/iconos_lucide.py, no editar a mano */

/*
 * Iconos de Lucide 1.43.0 (https://lucide.dev), licencia ISC:
 * Copyright (c) Lucide Contributors. Se conserva el aviso, que es lo unico
 * que la licencia pide.
 *
 * Del SVG de Lucide se copia solo el dibujo; el envoltorio y el grosor los
 * pone este bloque, y el color lo pone la tinta del acento.
 */

/* ---------------------------------------- el glifo que trae cada acento */

/* info — azul: el resto */
.dsr-dlg--info {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
}

/* triangle-alert — ambar: lo que cuesta revertir */
.dsr-dlg--atencion {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

/* circle-alert — rojo: lo que no se deshace */
.dsr-dlg--peligro {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' x2='12' y1='8' y2='12'/%3E%3Cline x1='12' x2='12.01' y1='16' y2='16'/%3E%3C/svg%3E");
}

/* circle-check — verde: lo que ya salio bien */
.dsr-dlg--exito {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m16 9-5.5 5.5L8 12'/%3E%3C/svg%3E");
}

/* ------------------------------- el glifo propio: Dialogo.Icono */

/* funnel — los selectores de filtro */
.dsr-dlg--ico-filtro {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z'/%3E%3C/svg%3E");
}

/* file-check — guardar reporte */
.dsr-dlg--ico-guardar {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z'/%3E%3Cpath d='M14 2v5a1 1 0 0 0 1 1h5'/%3E%3Cpath d='m9 15 2 2 4-4'/%3E%3C/svg%3E");
}

/* user — login, ficha y datos personales */
.dsr-dlg--ico-persona {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
}

/* key — contrasena olvidada, vencida o reseteada */
.dsr-dlg--ico-llave {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 21 9.6-9.6'/%3E%3Cpath d='m7.5 15.5 2.3 2.3a1 1 0 0 1 0 1.4l-2.1 2.1a1 1 0 0 1-1.4 0L4 19'/%3E%3Ccircle cx='15.5' cy='7.5' r='5.5'/%3E%3C/svg%3E");
}

/* circle-question-mark — no tengo usuario */
.dsr-dlg--ico-ayuda {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

/* import — importar y su resultado */
.dsr-dlg--ico-importar {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='m8 11 4 4 4-4'/%3E%3Cpath d='M8 5H4a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-4'/%3E%3C/svg%3E");
}

/* download — descargar lista y exportar reporte */
.dsr-dlg--ico-descargar {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

/* paperclip — subir archivo o imagen */
.dsr-dlg--ico-archivo {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551'/%3E%3C/svg%3E");
}

/* search — el buscador */
.dsr-dlg--ico-buscar {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 21-4.34-4.34'/%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3C/svg%3E");
}

/* image — la foto de una noticia */
.dsr-dlg--ico-imagen {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='3' rx='2' ry='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21'/%3E%3C/svg%3E");
}

/* trash-2 — las confirmaciones que borran */
.dsr-dlg--ico-borrar {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E");
}

/* ban — las confirmaciones que deshabilitan */
.dsr-dlg--ico-deshabilitar {
	--dsr-dlg-glifo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M4.929 4.929 19.07 19.071'/%3E%3C/svg%3E");
}

/* <<< iconos de Lucide */

/* -------------------------------------------- contenido que todavía no migró */

/*
 * Cuando un diálogo trae adentro un panel de formulario, el contenido llega con
 * su propio encabezado: un JPG de 32 px al costado, el título otra vez y una
 * línea azul de 2 px, ahora abajo del encabezado nuevo. Se poda sólo acá adentro
 * y sólo la sección de más afuera: SectionPanel se usa en 36 pantallas que no son
 * diálogos, y adentro de un diálogo puede haber secciones anidadas cuyo título sí
 * dice algo.
 *
 * Lo de "más afuera" va por :not() y no contando divs a mano: SimpleFormPanel
 * cuelga la tabla de un solo div y MultiSectionFormPanel mete otro en el medio,
 * así que una cadena de hijos fija le acierta a uno y le erra al otro.
 *
 * Lo que se poda es la franja entera del título: el JPG, el título repetido, la
 * línea y los dos íconos que iban a la derecha. El signo de pregunta de la ayuda
 * era lo único vivo que quedaba ahí y ahora lo lleva el encabezado, al lado de
 * la equis (Dialogo.setAyuda); el de imprimir no lo prende nadie. El subtítulo
 * no entra en la poda: ahí es donde DialogBoxActivity escribía el mensaje de la
 * confirmación antes de que fuera al encabezado, y ahí sigue el de los
 * formularios de usuario.
 *
 * Los genéricos y los sueltos ya no pasan por acá. Siguen entrando los 15 que
 * conservan su MultiSectionFormPanel, que además del enlace de ayuda lleva el
 * cartel de campos obligatorios y el panel del resultado: los 12 selectores de
 * filtro, los dos formularios grandes y la ficha de usuario.
 */

/* La celda del JPG; de qué se trata ya lo dice el glifo del encabezado. */
.dsr-dlg__cuerpo table.sectionPanel:not(.sectionPanel .sectionPanel) > tbody > tr:first-child > td:first-child {
	display: none;
}

/* El título repetido, la línea y los íconos que subieron al encabezado. */
.dsr-dlg__cuerpo table.sectionPanel:not(.sectionPanel .sectionPanel) > tbody > tr:first-child .titleSectionPanel {
	display: none;
}

/* Que el mensaje se lea como mensaje y no como una leyenda gris al pie. */
.dsr-dlg__cuerpo table.sectionPanel:not(.sectionPanel .sectionPanel) > tbody > tr:first-child .subtitle .gwt-Label {
	color: #2c3340;
	font-size: 12px;
}

/* La sangría de 53 px estaba para esquivar el JPG que ya no está. */
.dsr-dlg__cuerpo table.sectionPanel:not(.sectionPanel .sectionPanel) > tbody > tr:last-child > td > div {
	padding-left: 0;
}

/* ------------------------------------------- los servicios de una institución */

/*
 * La tabla de programas de trasplante y bancos de tejidos que se prende y apaga
 * desde la lista de instituciones. No usa las clases de una lista de verdad
 * porque no lo es: no pagina, no ordena y no tiene acciones de fila; es un
 * formulario con forma de tabla.
 */
.dsr-servicios {
	width: 100%;
	border-collapse: collapse;
}

.dsr-servicios__cab td {
	font-weight: 600;
	color: #5c6470;
	border-bottom: 1px solid #e4e9f2;
	padding: 0 10px 6px 0;
	white-space: nowrap;
}

.dsr-servicios td {
	padding: 6px 10px 6px 0;
	border-bottom: 1px solid #f0f3f8;
	vertical-align: middle;
}

/* El interruptor va a la derecha de todo y no arrastra el ancho de la tabla. */
.dsr-servicios__interruptor {
	width: 1%;
	text-align: right;
	padding-right: 0;
}

/* ------------------------------------------------------------ pantalla chica */

/*
 * A pantalla completa y sin arrastre. El Java lee --dsr-dlg-arrastre para saber
 * si tiene que soltar el mouse, así el corte queda escrito en un solo lado.
 */
@media (max-width: 640px) {
	.dsr-dlg {
		--dsr-dlg-arrastre: 0;
		left: 0 !important;
		top: 0 !important;
		width: 100vw;
		max-width: none;
		transform: none !important;
	}
	.dsr-dlg__caja {
		height: 100vh;
		height: 100dvh;
		max-height: none;
		border: 0;
		border-radius: 0;
	}
	/* Acá la caja tiene alto fijo, así que el cuerpo estira y el pie se va abajo
	   de todo. Arriba no: la caja se achica a lo que mide el contenido. */
	.dsr-dlg__cuerpo {
		flex: 1 1 auto;
	}
	.dsr-dlg__cab {
		cursor: default;
	}
}