/* Copyright © 2026 Tal4Biz · The Valuetech Company. All rights reserved. */
/* [26/09/2026] Stili del bottone "Assistenza" e della sua finestra (PROGETTO 6.12, parziale _Assistenza in
   _Layout). Vuoto in F0: lo scrive F8, che ne e' il proprietario; _Layout.cshtml lo collega gia' su ogni pagina.
   Solo proprieta' logiche (block/inline). */
/* [26/09/2026] F8: il bottone ha la forma della scelta della lingua (.lang-chip in site.css), accanto a lei nella barra;
   sotto i 760 px resta solo l'icona, come la lingua resta solo con la bandiera (il testo non sparisce per chi usa un
   lettore di schermo). La finestra e' una modale di Bootstrap, spostata in fondo a <body> da assistenza.js. Con
   dir="rtl" (arabo) tutto si ribalta da solo: niente left/right. */

.t4b-assistenza-bottone
{
	display: inline-flex;
	gap: 7.2px;
	align-items: center;
	padding-block: 8px;
	padding-inline: 12px;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: transparent;
	color: var(--navy-800);
	font-size: 14.4px;
	font-weight: 500;
	line-height: 1.2;
	white-space: nowrap;
	cursor: pointer;
	transition: border-color 0.2s, background-color 0.2s;
}

.t4b-assistenza-bottone:hover
{
	border-color: var(--yellow-500);
	background: var(--navy-050);
}

.t4b-assistenza-bottone:focus-visible
{
	outline: 2px solid var(--yellow-500);
	outline-offset: 3px;
}

.t4b-assistenza-bottone .bi
{
	font-size: 1rem;
	line-height: 1;
}

@media (max-width: 760px)
{
	.t4b-assistenza-bottone
	{
		padding-block: 7.2px;
		padding-inline: 9.6px;
	}

	/* Solo l'icona a video. [03/10/2026] La scritta a video e' «SOS»; il nome per i lettori di schermo viene dall'aria-label
	   del bottone (la parola intera nella lingua della pagina, _Assistenza.cshtml). */
	.t4b-assistenza-etichetta
	{
		position: absolute;
		overflow: hidden;
		clip-path: inset(50%);
		inline-size: 1px;
		block-size: 1px;
		white-space: nowrap;
	}
}

@media (prefers-reduced-motion: reduce)
{
	.t4b-assistenza-bottone
	{
		transition: none;
	}
}

/* --- Finestra --- */
.t4b-assistenza .modal-title
{
	margin-block-end: 0;
}

.t4b-assistenza-aiuto
{
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	justify-content: space-between;
}

.t4b-assistenza-conteggio
{
	font-variant-numeric: tabular-nums;
	margin-inline-start: auto;
}

.t4b-assistenza-elenco
{
	margin-block: 0.5rem 0;
	padding-inline-start: 0;
	list-style: none;
}

.t4b-assistenza-voce
{
	display: flex;
	gap: 0.75rem;
	align-items: center;
	padding-block: 0.4rem;
	border-block-end: 1px solid var(--border);
}

.t4b-assistenza-anteprima,
.t4b-assistenza-icona
{
	flex: none;
	inline-size: 48px;
	block-size: 48px;
	border-radius: 6px;
}

.t4b-assistenza-anteprima
{
	object-fit: cover;
	background: var(--grey-100);
}

.t4b-assistenza-icona
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--grey-100);
	color: var(--grey-500);
	font-size: 1.4rem;
}

.t4b-assistenza-nome
{
	flex: 1 1 auto;
	min-inline-size: 0;
	overflow-wrap: anywhere;
}

.t4b-assistenza-dimensione
{
	color: var(--text-muted);
	font-size: 0.85rem;
	white-space: nowrap;
}

.t4b-assistenza-togli
{
	flex: none;
}

.t4b-assistenza-nota
{
	margin-block: 0.75rem 0;
	color: var(--text-soft);
	font-size: 0.9rem;
}

.t4b-assistenza-errore
{
	margin-block: 0.75rem 0;
}

.t4b-assistenza-esito
{
	display: flex;
	gap: 0.75rem;
	align-items: flex-start;
}

.t4b-assistenza-esito:focus
{
	outline: none;
}

.t4b-assistenza-esito-icona
{
	color: var(--green);
	font-size: 1.6rem;
	line-height: 1;
}

.t4b-assistenza-esito-testo
{
	margin-block-end: 0;
	overflow-wrap: anywhere;
}

/* --- Pagina /Assistenza --- */
.t4b-assistenza-pagina
{
	max-inline-size: 720px;
	padding-block: 1.5rem;
}