/**
 * Plantilla «Compacta».
 *
 * Una línea por sesión: hora destacada en color, título, y ponente, cargo y
 * empresa seguidos en una sola línea. Sin etiquetas, sin ubicación y con el
 * botón de información a la derecha, alineado verticalmente con la fila.
 *
 * El marcado es el mismo que en el resto de plantillas: aquí solo se
 * recoloca y se oculta lo que no entra en esta composición.
 */

/* ------------------------------------------------------------ la fila */

.fp-tpl-compacta .fp-sesion {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 18px;
	padding: var(--fp-sep-px) 0;
	border-bottom: 1px solid var(--fp-linea);
}

.fp-tpl-compacta .fp-hora {
	flex: 0 0 64px;
	padding-top: 1px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--fp-hora-color);
}
/* La hora de fin se mantiene, más discreta, debajo de la de inicio. */
.fp-tpl-compacta .fp-hora-fin {
	display: block;
	font-size: 12px;
	font-weight: 400;
	color: var(--fp-txt3);
}

.fp-tpl-compacta .fp-cuerpo { flex: 1 1 auto; min-width: 0; }

.fp-tpl-compacta .fp-titulo {
	margin: 0 0 3px;
	font-size: var(--fp-titulo-px);
	line-height: 1.3;
}
.fp-tpl-compacta .fp-t { font-weight: 700; }
.fp-tpl-compacta .fp-adicional { font-weight: 400; color: var(--fp-txt2); }

/* --------------------------- ponente, cargo y empresa en una sola línea */

/* Los dos párrafos se vuelven texto corrido y las etiquetas desaparecen:
   el nombre y la empresa se leen solos, sin necesidad de rotularlos. */
.fp-tpl-compacta .fp-ponentes,
.fp-tpl-compacta .fp-organiza {
	display: inline;
	margin: 0;
	line-height: 1.5;
	color: var(--fp-txt2);
}
/* Rótulos discretos: en una sola línea compiten con el nombre, así que
   van más pequeños y en el tono tenue. Se pueden quitar desde el editor. */
.fp-tpl-compacta .fp-etq {
	font-size: .86em;
	font-weight: 600;
	color: var(--fp-txt3);
}
.fp-tpl-compacta .fp-organiza::before {
	content: " · ";
	color: var(--fp-txt3);
}
/* Si no hay ponente, la empresa es el primer párrafo y el punto sobra. */
.fp-tpl-compacta .fp-cuerpo p:first-of-type::before { content: ""; }

/* Las etiquetas, la ubicación y el botón de calendario los decide cada
   plantilla desde su editor, con las clases fp-sin-*. Aquí solo se les da
   el aspecto que les toca cuando están encendidos. */
.fp-tpl-compacta .fp-acc { margin-top: 7px; }
.fp-tpl-compacta .fp-ics {
	padding: 5px 11px;
	font-size: 12.5px;
	border-radius: var(--fp-radio);
}
.fp-tpl-compacta .fp-meta { margin-top: 6px; font-size: 12.5px; }

/* ------------------------------------- el botón de información, a la derecha */

.fp-tpl-compacta .fp-desc {
	flex: 0 0 auto;
	margin: 0;
	align-self: center;
}
.fp-tpl-compacta .fp-desc-btn {
	min-height: 34px;
	padding: 6px 14px;
	border-radius: var(--fp-radio);
	border-color: var(--fp-linea);
	color: var(--fp-acento);
	white-space: nowrap;
}
.fp-tpl-compacta .fp-desc-btn:hover {
	background: var(--fp-acento);
	border-color: var(--fp-acento);
	color: #fff;
}
.fp-tpl-compacta .fp-icono-info { color: currentColor; }

/* En móvil no caben dos columnas y un botón: baja a su propia línea. */
@media (max-width: 600px) {
	.fp-tpl-compacta .fp-sesion { flex-wrap: wrap; gap: 10px 14px; }
	.fp-tpl-compacta .fp-hora { flex-basis: 56px; }
	.fp-tpl-compacta .fp-desc { flex: 1 1 100%; margin-left: 70px; }
	.fp-tpl-compacta .fp-desc-btn { width: 100%; justify-content: center; }
}

/* ------------------------------------------------------- barra superior */

/* Pestañas de día en forma de píldora, a la derecha del encabezado. */
.fp-tpl-compacta .fp-dia {
	min-width: 0;
	min-height: 42px;
	padding: 8px 18px;
	border-radius: 999px;
	font-weight: 600;
}
.fp-tpl-compacta .fp-dia-sem { display: none; }
.fp-tpl-compacta .fp-dia-num { font-weight: 600; }
.fp-tpl-compacta .fp-toolbar { border-bottom: none; }
.fp-tpl-compacta .fp-barra { justify-content: flex-end; }
.fp-tpl-compacta .fp-dias { flex: 0 1 auto; }

/* Cabecera de día: en esta plantilla las pestañas ya dicen el día, así que
   el separador solo aparece cuando se miran todos los días a la vez. */
.fp-tpl-compacta .fp-sep h3 {
	font-size: 13px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--fp-txt3);
}

.fp-tpl-compacta .fp-destacada .fp-t { color: var(--fp-hora-color); }


/* --------------------------------------------- la ventana, en esta plantilla */

/* Más estrecha y más aireada que la clásica, con el mismo redondeo de
   píldora de las pestañas y una barra del color de la hora arriba, que es
   lo que ata la ventana al listado del que sale. */
.fp-tpl-compacta .fp-modal {
	width: 560px;
	border-radius: 18px;
	border-top: 4px solid var(--fp-hora-color);
	box-shadow: 0 20px 56px rgba(43, 33, 80, .22);
}
.fp-tpl-compacta .fp-modal-caja { padding: 30px 32px 32px; }

.fp-tpl-compacta .fp-modal-meta {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--fp-hora-color);
}
.fp-tpl-compacta .fp-modal-tit {
	margin-top: 4px;
	font-size: 21px;
	line-height: 1.25;
	color: var(--fp-txt);
}
.fp-tpl-compacta .fp-modal-cuerpo p {
	font-size: 15px;
	line-height: 1.7;
}
.fp-tpl-compacta .fp-modal-cerrar {
	border-radius: 999px;
	border-color: var(--fp-linea);
	color: var(--fp-txt2);
}
.fp-tpl-compacta .fp-modal-cerrar:hover {
	background: var(--fp-acento);
	border-color: var(--fp-acento);
	color: #fff;
}
.fp-tpl-compacta .fp-modal::backdrop { background: rgba(43, 33, 80, .5); }

@media (max-width: 600px) {
	.fp-tpl-compacta .fp-modal { width: auto; }
	.fp-tpl-compacta .fp-modal-caja { padding: 24px 18px 26px; }
	.fp-tpl-compacta .fp-modal-tit { font-size: 18px; }
}