/*--------------------------------------------------
---- Archivio schede -------------------------------
--------------------------------------------------*/

/*
 * Le card vengono visualizzate come inline-block.
 *
 * Gli spazi presenti nel markup HTML tra un elemento
 * e l'altro generano un "white space" che altera
 * il calcolo delle colonne.
 *
 * Azzeriamo quindi il font-size del contenitore.
 *
 * ATTENZIONE:
 * ogni elemento figlio deve ripristinare esplicitamente
 * la propria dimensione del testo.
 */
.context-doppiatori #inner-wrapper {
	font-size: 0;
}

/* Ripristina la dimensione del testo delle card. */
#inner-wrapper > article {
	font-size: var(--anad-font-size-base);
}

#inner-wrapper .type-doppiatori {
	display: inline-block;
	margin-bottom: 1.5rem; /* 24px */
	margin-right: 1.5rem; /* 24px */
	opacity: 1;
	transform: translateY(0);
	transition:
		opacity 0.25s ease,
		transform 0.25s ease;
	vertical-align: top;
	width: calc((100% - 6rem) / 5);
}

#inner-wrapper .type-doppiatori:nth-of-type(5n) {
	margin-right: 0;
}

#inner-wrapper .type-doppiatori.is-ajax-entering {
	animation: anad-card-enter 0.32s ease both;
}

#inner-wrapper .type-doppiatori.is-removing {
	opacity: 0;
	pointer-events: none;
	transform: translateY(0.5rem) scale(0.98);
}

#inner-wrapper.is-loading {
	pointer-events: none;
}

@keyframes anad-card-enter {

	0% {
		opacity: 0;
		transform: translateY(0.5rem);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}

}


/*--------------------------------------------------
---- Archivio schede: responsive -------------------
--------------------------------------------------*/

@media screen and (max-width: 1432px) {

	#inner-wrapper .type-doppiatori {
		margin-right: 1.5rem;
		width: calc((100% - 4.5rem) / 4);
	}

	#inner-wrapper .type-doppiatori:nth-of-type(5n) {
		margin-right: 1.5rem;
	}

	#inner-wrapper .type-doppiatori:nth-of-type(4n) {
		margin-right: 0;
	}

}

@media screen and (max-width: 1180px) {

	#inner-wrapper .type-doppiatori {
		margin-right: 1.5rem;
		width: calc((100% - 3rem) / 3);
	}

	#inner-wrapper .type-doppiatori:nth-of-type(4n) {
		margin-right: 1.5rem;
	}

	#inner-wrapper .type-doppiatori:nth-of-type(3n) {
		margin-right: 0;
	}

}

@media screen and (max-width: 880px) {

	#inner-wrapper .type-doppiatori {
		margin-right: 1.5rem;
		width: calc((100% - 1.5rem) / 2);
	}

	#inner-wrapper .type-doppiatori:nth-of-type(3n) {
		margin-right: 1.5rem;
	}

	#inner-wrapper .type-doppiatori:nth-of-type(2n) {
		margin-right: 0;
	}

}

@media screen and (max-width: 600px) {

    /* Stili per utenti non loggati */
	body:not(.logged-in) #inner-wrapper .type-doppiatori {
		display: block;
		height: 96px;
		margin-right: 0;
		padding: 0 1rem 0 112px;
		position: relative;
		width: auto;
	}

	body:not(.logged-in) #inner-wrapper .type-doppiatori:nth-of-type(2n) {
		margin-right: 0;
	}

	body:not(.logged-in) .type-doppiatori figure {
		border-radius: 1rem;
		height: 96px;
		left: 0;
		margin: 0;
		overflow: hidden;
		position: absolute;
		top: 0;
		width: 96px;
	}

	body:not(.logged-in) .type-doppiatori figure::after {
		display: none;
	}

	body:not(.logged-in) .type-doppiatori figure a,
	body:not(.logged-in) .type-doppiatori figure img {
		border-radius: inherit;
		display: block;
		height: 100%;
		width: 100%;
	}

	body:not(.logged-in) .type-doppiatori figure img {
		object-fit: cover;
	}

	body:not(.logged-in) .type-doppiatori h3 {
        margin-top: 16px;
        margin-right: 0;
        margin-bottom: 8px;
        margin-left: -16px;
    }

	body:not(.logged-in) .type-doppiatori h3 a {
		display: block;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	body:not(.logged-in) .type-doppiatori .button-group {
		margin: 0;
		padding: 0;
	}

    /* Stili per utenti loggati */
	.logged-in #inner-wrapper .type-doppiatori {
		display: grid;
		gap: 0 0.25rem;
		grid-template-areas:
			"image title"
			"image details"
			"image actions";
		grid-template-columns: minmax(7rem, 32%) minmax(0, 1fr);
		margin-right: 0;
		width: 100%;
	}

	.logged-in #inner-wrapper .type-doppiatori:nth-of-type(2n) {
		margin-right: 0;
	}

	.logged-in .type-doppiatori figure {
		border-radius: 1rem;
		grid-area: image;
		height: 100%;
		overflow: hidden;
	}

	.logged-in .type-doppiatori figure::after {
		display: none;
	}

	.logged-in .type-doppiatori figure a,
	.logged-in .type-doppiatori figure img {
		border-radius: inherit;
		height: 100%;
	}

	.logged-in .type-doppiatori figure img {
		display: block;
		object-fit: cover;
		width: 100%;
	}

	.logged-in .type-doppiatori h3 {
		grid-area: title;
		margin-top: 1rem;
	}

	.logged-in .type-doppiatori dl {
		grid-area: details;
	}

	.logged-in .type-doppiatori .button-group {
		grid-area: actions;
	}

}

@media screen and (max-width: 500px) {

	.logged-in #inner-wrapper .type-doppiatori {
		grid-template-columns: minmax(9rem, 40%) minmax(0, 1fr);
	}

}

/*--------------------------------------------------
---- Archivio schede: correzione titoli mobile -----
--------------------------------------------------*/
@media screen and (max-width: 600px) {

    body:not(.logged-in) .type-doppiatori h3 {
        line-height: 1.25;
    }

    body:not(.logged-in) .type-doppiatori h3 a {
        line-height: inherit;
    }

}

/*--------------------------------------------------
---- Archivio schede: email lunghe -----------------
--------------------------------------------------*/

.type-doppiatori dl,
.type-doppiatori dd {
	min-width: 0;
}

.type-doppiatori dd a[href^="mailto:"] {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}