/*--------------------------------------------------
---- Pagina società --------------------------------
--------------------------------------------------*/

body.context-societa #inner-wrapper {
	padding-bottom: 1.5rem;
}


/*--------------------------------------------------
---- Società: archivio -----------------------------
--------------------------------------------------*/

#companies {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	list-style: none;
	margin: 1.5rem 0 0;
	padding: 0;
}

.companies-column {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	min-width: 0;
}

.company {
	margin: 0;
}


/*--------------------------------------------------
---- Società: card ---------------------------------
--------------------------------------------------*/

.company details {
	background:
		linear-gradient(#ffffff, #ffffff) padding-box,
		linear-gradient(#ffffff, #ffffff) border-box;
	border-left: 4px solid transparent;
	border-radius: 1rem;
	box-shadow:
		0 2px 4px rgba(0, 0, 0, 0.04),
		0 8px 16px rgba(0, 0, 0, 0.06);
	overflow: hidden;
	transition:
		background var(--anad-transition-fast),
		box-shadow var(--anad-transition-fast),
		transform var(--anad-transition-fast);
}

.company details[open] {
	background:
		linear-gradient(#ffffff, #ffffff) padding-box,
		linear-gradient(
			to bottom,
			var(--anad-color-secondary),
			var(--anad-color-primary)
		) border-box;
	box-shadow:
		0 4px 8px rgba(0, 0, 0, 0.05),
		0 12px 24px rgba(0, 0, 0, 0.08);
	transform: translateY(-2px);
}

.company details:hover {
	box-shadow:
		0 6px 18px rgba(24, 31, 73, 0.10),
		0 2px 6px rgba(24, 31, 73, 0.06);
	transform: translateY(-2px);
}

.company details:focus-within:not(:hover):not([open]) {
	box-shadow:
		0 2px 4px rgba(0, 0, 0, 0.04),
		0 8px 16px rgba(0, 0, 0, 0.06);
	transform: none;
}


/*--------------------------------------------------
---- Società: header -------------------------------
--------------------------------------------------*/

.company-header {
	align-items: center;
	cursor: pointer;
	display: grid;
	gap: 0.75rem;
	grid-template-columns: minmax(0, 1fr) auto auto;
	list-style: none;
	padding: 1.125rem 1.25rem;
}

.company-header::-webkit-details-marker {
	display: none;
}

.company-header::after {
	color: var(--anad-color-primary);
	content: "\f341";
	font-family: dashicons;
	font-size: 1.25rem;
	line-height: 1;
	transition: transform var(--anad-transition-fast);
}

.company details[open] .company-header::after {
	transform: rotate(-90deg);
}

.company h3 {
	color: var(--anad-color-primary);
	font-family: var(--anad-font-body);
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.25;
	margin: 0;
	min-width: 0;
	white-space: normal;
}


/*--------------------------------------------------
---- Società: servizi ------------------------------
--------------------------------------------------*/

.company .services {
	align-items: center;
	display: flex;
	justify-content: flex-end;
	list-style: none;
	margin: 0;
	padding: 0;
}

.company .services li {
	margin: 0;
	padding: 0;
	position: relative;
}

.company .services li + li {
	margin-left: -0.5rem;
}

.company .services li:nth-child(1) {
	z-index: 5;
}

.company .services li:nth-child(2) {
	z-index: 4;
}

.company .services li:nth-child(3) {
	z-index: 3;
}

.company .services li:nth-child(4) {
	z-index: 2;
}

.company .services li:nth-child(5) {
	z-index: 1;
}

.company .services a {
	align-items: center;
	background-color: #efe7ff;
	border: 2px solid #ffffff;
	border-radius: 50%;
	box-sizing: border-box;
	color: var(--anad-color-taxonomies);
	display: inline-flex;
	font-size: 0;
	height: 2rem;
	justify-content: center;
	line-height: 1;
	padding: 0;
	text-decoration: none;
	transition:
		background-color var(--anad-transition-fast),
		color var(--anad-transition-fast);
	width: 2rem;
}

.company .services a::before {
	color: inherit;
	display: block;
	font-family: dashicons;
	font-size: 1rem;
	line-height: 1;
}

.company .services a.icon--doppiaggio::before {
	content: "\f235";
}

.company .services a.icon--videogiochi::before {
	content: "\f18a";
}

.company .services a.icon--pubblicita::before {
	content: "\f488";
}

.company .services a.icon--audiolibri::before {
	content: "\f330";
}

.company .services a.icon--speakeraggio::before {
	content: "\f521";
}

.company .services a:hover,
.company .services a:focus-visible {
	background-color: var(--anad-color-taxonomies);
	color: #ffffff;
	outline: none;
}

.company .services a:active {
	background-color: var(--anad-color-primary);
	color: #ffffff;
	transition: none;
}


/*--------------------------------------------------
---- Società: contenuto ----------------------------
--------------------------------------------------*/

.company-info {
	border-top: 1px solid rgba(24, 31, 73, 0.08);
	display: grid;
	gap: 0.5rem 0.75rem;
	grid-template-columns: 1rem minmax(0, 1fr);
	margin: 0;
	padding: 1.25rem 1.25rem 2rem;
}

.company-info dt {
	align-items: center;
	display: flex;
	font-size: 0;
	height: 1.125rem;
	justify-content: center;
	line-height: 1;
	margin: 0;
	padding: 0;
	width: 1rem;
}

.company-info dt::before {
	color: rgba(24, 31, 73, 0.4);
	display: block;
	font-family: dashicons;
	font-size: 1rem;
	line-height: 1;
	position: relative;
	top: 1px;
}

.company-info dd {
	font-size: 1rem;
	line-height: 1.125rem;
	margin: 0;
	min-width: 0;
}


/*--------------------------------------------------
---- Società: icone --------------------------------
--------------------------------------------------*/

.company-info dt.locations::before {
	content: "\f230";
}

.location-info dt.location-name::before {
	content: none;
}

.location-info dt.address::before {
	content: none;
}

.company-info dt.telephone::before,
.location-info dt.telephone::before {
	content: "\f525";
}

.company-info dt.email::before {
	content: "\f466";
}

.company-info dt.website::before {
	content: "\f319";
	left: 1.5px;
	top: 3px;
}

/*
 * L'icona della mappa viene mostrata direttamente
 * all'interno del pulsante "Visualizza mappa".
 */

.company-info dt.map::before,
.location-info dt.map::before {
	content: none;
}


/*--------------------------------------------------
---- Società: sedi ---------------------------------
--------------------------------------------------*/

.company-info dd > ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.location {
	border-bottom: 1px solid rgba(24, 31, 73, 0.08);
	padding-bottom: 1.25rem;
}

.location + .location {
	margin-top: 1.25rem;
	padding-top: 0;
}

.location-info {
	display: block;
	margin: 0;
	padding-right: 1rem;
}

.location-info dt {
	display: none;
}

.location-info dd {
	margin: 0;
}

.location-info dd.location-name {
	font-weight: 700;
	margin-bottom: 0.25rem;
}

.location-info address {
	font-style: normal;
	line-height: 1.25rem;
	margin: 0;
}

.location-info address::first-line {
	font-style: italic;
}

.location-info dd.address {
	margin-bottom: 1rem;
}

.location-info dd.address:has(+ dt.telephone) {
	margin-bottom: 0.75rem;
}

.location-info dd.telephone {
	margin-bottom: 1rem;
}

.location-info dd.telephone a {
	align-items: center;
	border-bottom: 2px solid rgba(24, 31, 73, 0.15);
	color: var(--anad-color-primary);
	display: inline-flex;
	gap: 0;
	margin-left: 1.5rem;
	padding-bottom: 1px;
	position: relative;
	text-decoration: none;
	transition:
		border-color var(--anad-transition-fast),
		color var(--anad-transition-fast);
}

.location-info dd.telephone a::before {
	color: rgba(24, 31, 73, 0.4);
	content: "\f525";
	font-family: dashicons;
	font-size: 1rem;
	left: -1.5rem;
	line-height: 1;
	position: absolute;
	top: 1px;
}

.location-info dd.telephone a:hover,
.location-info dd.telephone a:focus-visible {
	border-bottom-color: var(--anad-color-secondary);
	color: var(--anad-color-primary);
	text-decoration: none;
}

.location-info dd.telephone a:active {
	border-bottom-color: var(--anad-color-secondary);
	color: var(--anad-color-secondary);
	transition: none;
}

.location-info dd.map {
	margin: 0;
}

.company-info dd.locations {
	margin-bottom: 0.375rem;
}

.company-info dd.telephone {
	margin-top: 0;
}


/*--------------------------------------------------
---- Società: link ---------------------------------
--------------------------------------------------*/

.company-info a {
	border-bottom: 2px solid rgba(24, 31, 73, 0.15);
	color: var(--anad-color-primary);
	overflow-wrap: anywhere;
	padding-bottom: 1px;
	text-decoration: none;
	transition:
		border-color var(--anad-transition-fast),
		color var(--anad-transition-fast);
}

.company-info a:hover,
.company-info a:focus-visible {
	border-bottom-color: var(--anad-color-secondary);
	color: var(--anad-color-primary);
	text-decoration: none;
}

.company-info a:active {
	border-bottom-color: var(--anad-color-secondary);
	color: var(--anad-color-secondary);
	transition: none;
}

.company-info dd.map a,
.location-info dd.map a {
	align-items: center;
	background-color: #ffffff;
	border: 0;
	border-radius: 9999px;
	box-shadow: inset 0 0 0 1px rgba(24, 31, 73, 0.12);
	color: var(--anad-color-primary);
	display: inline-flex;
	font-size: var(--anad-font-size-xs);
	font-weight: 500;
	gap: 0.375rem;
	height: 36px;
	line-height: 1;
	padding: 0 0.75rem;
	text-decoration: none;
	transition:
		background-color var(--anad-transition-fast),
		box-shadow var(--anad-transition-fast),
		color var(--anad-transition-fast);
}

.company-info dd.map a::before,
.location-info dd.map a::before {
	color: inherit;
	content: "\f231";
	display: block;
	font-family: dashicons;
	font-size: 1rem;
	line-height: 1;
}

.company-info dd.map a:hover,
.company-info dd.map a:focus-visible,
.location-info dd.map a:hover,
.location-info dd.map a:focus-visible {
	background-color: rgba(24, 31, 73, 0.08);
	box-shadow: none;
	color: var(--anad-color-primary);
}

.company-info dd.map a:active,
.location-info dd.map a:active {
	background-color: var(--anad-color-primary);
	box-shadow: none;
	color: #ffffff;
	transition: none;
}


/*--------------------------------------------------
---- Società: mappe --------------------------------
--------------------------------------------------*/

.map-lightbox {
	height: 80vh;
	width: 90vw;
}

.map-lightbox iframe {
	border: 0;
	display: block;
	height: 100%;
	width: 100%;
}


/*--------------------------------------------------
---- Società: risultati AJAX -----------------------
--------------------------------------------------*/

body.context-societa #inner-wrapper {
	position: relative;
	transition:
		opacity 220ms ease,
		transform 220ms ease,
		filter 220ms ease;
	will-change: opacity, transform, filter;
}

body.context-societa #inner-wrapper.is-loading {
	filter: blur(2px);
	opacity: 0.2;
	pointer-events: none;
	transform: translateY(6px) scale(0.99);
}


/*--------------------------------------------------
---- Società: responsive ---------------------------
--------------------------------------------------*/

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

	#companies {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

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

	#companies {
		grid-template-columns: 1fr;
	}

}

/* ==========================================================
   PATCH — Toolbar Società su mobile
   ========================================================== */

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

	#content-controls:has(#content-service) {
		max-width: none;
		width: 100%;
	}

	#content-controls:has(#content-service) fieldset {
		display: block;
		max-width: none;
		position: relative;
		width: 100%;
	}

	#content-controls:has(#content-service) input[type="search"] {
		display: block;
		margin: 0 0 0.5rem;
		width: calc(100% - 3rem);
	}

	#content-controls:has(#content-service) .field-icon {
		display: none;
	}

	#content-controls:has(#content-service) select {
		display: block;
		margin: 0 0 0.5rem;
		min-width: 0;
		width: calc(100% - 3rem);
	}

	#content-controls:has(#content-service) .field-icon + .field {
		padding-left: 1rem;
	}

	#content-controls:has(#content-service) .to-print {
		display: inline-block;
		margin: 0;
		position: absolute;
		right: 0;
		top: 0;
	}

}

/* ==========================================================
   PATCH — Titolo Società a due livelli
   ========================================================== */

@media screen and (min-width: 401px) and (max-width: 580px) {

	#page-title {
		white-space: nowrap;
	}

	#page-title .page-title-value::before {
		content: "\A";
		white-space: pre;
	}

}