/*
 * R9 · Marcador provisional (componentes.md).
 *
 * Trama y borde discontinuo: tiene que leerse como provisional a primera
 * vista. Ocupa la proporción de la imagen que falta.
 */

.loha-provisional {
	display: grid;
	place-content: center;
	justify-items: center;
	gap: 0.5em;
	width: 100%;
	aspect-ratio: var(--proporcion, 16 / 9);
	padding: 1.5rem;
	border: 2px dashed var(--azul-300);
	background-color: var(--papel);
	background-image: repeating-linear-gradient(
		135deg,
		var(--azul-300) 0 1px,
		transparent 1px 12px
	);
	color: var(--azul-700);
	font-family: var(--sans);
	font-size: var(--fs-micro);
	font-weight: 500;
	line-height: var(--lh-interfaz);
	text-align: center;
}

/* Fondo liso detrás del texto para que la trama no lo ensucie. */
.loha-provisional > span {
	padding: 0.3em 0.6em;
	background-color: var(--papel);
	overflow-wrap: anywhere;
}

.loha-provisional__archivo {
	font-weight: 600;
}

/* Sobre fondo oscuro (apertura del 03, texto en blanco): el marcador toma
   los colores del fondo para que el texto de la escena se siga leyendo. */
[data-fondo="oscuro"] .loha-provisional,
[data-fondo="oscuro"] .loha-provisional > span {
	background-color: var(--c-fondo);
}

[data-fondo="oscuro"] .loha-provisional {
	border-color: var(--c-filete);
	background-image: repeating-linear-gradient(
		135deg,
		var(--c-filete) 0 1px,
		transparent 1px 12px
	);
	color: var(--c-texto-2);
}
