/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Hanlding Updates
-----------------------------------------------------------------*/


.accordion .accordion-body {
	padding: 1rem 0.5rem 0.5rem 0.5rem;
}


/* ----------------------------------------------------------------
	Accessibilita' - WCAG 2.4.7 Focus visibile

	stylesheet.css (da sass/_reset.scss) azzera l'outline su tutti i
	link e i bottoni: chi naviga da tastiera non vede dove si trova.

	Si usa :focus-visible e non :focus, quindi l'indicatore compare
	solo nella navigazione da tastiera. Il clic col mouse non lo
	mostra: e' il motivo per cui il tema lo aveva soppresso.

	Doppio anello scuro + chiaro: garantisce il contrasto sia sugli
	sfondi bianchi delle schede sia su quelli scuri del menu, senza
	dipendere dalla palette dell'ente.
-----------------------------------------------------------------*/

a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
summary:focus,
[tabindex]:focus,
.btn-check:focus + .btn {
	outline: 2px solid #1a1a1a !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 4px #ffffff !important;
}

/* Il bersaglio dello skip-link non deve mostrare l'anello:
   riceve il focus da programma, non dalla navigazione. */
main[tabindex="-1"]:focus {
	outline: none !important;
	box-shadow: none !important;
}


/* ----------------------------------------------------------------
	Accessibilita' - WCAG 2.1.1 Menu utilizzabile da tastiera

	I toggle del menu erano <a href="#"> senza data-bs-toggle, aperti
	da theme.js: su mouseover sopra i 991px, su clic sotto. Da
	tastiera, sopra i 991px, non si aprivano affatto.

	Ora li gestisce Bootstrap, che fornisce apertura da tastiera,
	chiusura con Escape e ritorno del focus al toggle. La gestione
	jQuery e' stata rimossa perche' mostrava il sottomenu impostando
	display inline, incompatibile con la classe .show di Bootstrap.

	Qui si ripristina l'apertura al passaggio del mouse su desktop,
	che era l'unica ragione d'essere di quella gestione.
-----------------------------------------------------------------*/

@media (min-width: 992px) {
	.primary-menu ul.navbar-nav > li.dropdown:hover > .dropdown-menu,
	.login-signup ul.navbar-nav > li.dropdown:hover > .dropdown-menu {
		display: block;
	}
}

/* La freccia ruotava tramite la classe .open aggiunta da theme.js.
   Ora segue lo stato dichiarato dal toggle, che e' anche quello
   annunciato dagli screen reader: una fonte sola invece di due. */
.primary-menu .dropdown-toggle[aria-expanded="true"] .arrow:after,
.login-signup .dropdown-toggle[aria-expanded="true"] .arrow:after {
	-webkit-transform: translate(-50%, -50%) rotate(-45deg);
	transform: translate(-50%, -50%) rotate(-45deg);
}


/* ----------------------------------------------------------------
	Accessibilita' - WCAG 2.1.1 / 4.1.2 Tab e fisarmonica

	Sotto i 768px easy-responsive-tabs.js mostra gli <h2 class="resp-accordion">
	al posto della lista dei tab. Il contenuto dell'intestazione sta ora in un
	<button>, che porta con se' tastiera e stato aria-expanded.

	Qui il bottone viene azzerato: lo stile visibile resta quello delle regole
	h2.resp-accordion gia' compilate in stylesheet.css.
-----------------------------------------------------------------*/

h2.resp-accordion > .resp-accordion-btn {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	color: inherit;
	text-align: inherit;
	cursor: pointer;
}

/* ----------------------------------------------------------------
	Accessibilita' - WCAG 1.4.3 contrasto minimo del testo
	#28a745 = 3.13:1 su bianco, #218a39 = 4.41:1: entrambi sotto 4.5:1.
	Sostituiti con #0a8927 (4.54:1) e #0b7c24 (5.35:1), stessa tinta.
	Gli usi come background-color NON sono toccati: li' il criterio
	si applica alla coppia sfondo/testo del pulsante, non al verde.
---------------------------------------------------------------- */
a, a:focus,
.primary-menu ul.navbar-nav > li:hover > a:not(.btn), .primary-menu ul.navbar-nav > li.active > a:not(.btn), .login-signup ul.navbar-nav > li:hover > a:not(.btn), .login-signup ul.navbar-nav > li.active > a:not(.btn),
.primary-menu ul.navbar-nav > li.dropdown .dropdown-menu li:hover > a:not(.btn), .login-signup ul.navbar-nav > li.dropdown .dropdown-menu li:hover > a:not(.btn),
/* Secondary Nav */
.secondary-nav.nav .nav-item .nav-link.active,
/* Page Header */
.page-header.page-header-light .breadcrumb > li a:hover,
/* List Item */
.list-item a:hover,
/* Side Post */
.side-post .item-post .caption a:hover,
/* Post */
.blog-post .title-blog a:hover,
.blog-post .meta-blog li i,
.blog-post .meta-blog li a:hover,
.accordion.accordion-flush .accordion-header .accordion-button,
/* nav */
.nav-link,
.nav-pills.alternate .nav-link:not(.active):hover,
.nav-tabs.flex-column .nav-item .nav-link.active,
.resp-vtabs li.resp-tab-active, .resp-vtabs li.resp-tab-active:hover,
/* Brands Grid */
.brands-grid > .row > * a:hover,
#footer .nav .nav-item .nav-link:focus,
#footer .nav .nav-link:hover,
#footer .nav .nav-link:hover,
.btn-outline-primary, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active,
.page-link {
	color: #0a8927;
}

a:hover, a:active,
/*== Primary Nav ==*/
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .show > .nav-link,
.nav-link:hover, .nav-link:focus,
/* Tabs */
.nav-tabs .nav-item .nav-link.active,
.page-link:hover {
	color: #0b7c24;
}

/* tab non attivi: #999 = 2.85:1 */
.resp-vtabs .resp-tabs-list li {
	color: #707070;
}

/* copyright su footer scuro: alpha 0.5 = 3.76:1 */
#footer.footer-text-light .footer-copyright {
	color: rgba(250, 250, 250, 0.85);
}

/* ----------------------------------------------------------------
	Accessibilita' - WCAG 1.4.3 sul footer scuro (bg-dark #212529)
	Qui la regola si inverte: il verde scurito sopra scende a 3.39:1
	su fondo scuro, quindi serve la variante chiara (#6fdc8c = 9.03:1).
	Il copyright ereditava #67727c da .copyright-text = 3.14:1.
---------------------------------------------------------------- */
#footer.footer-text-light a:not(.btn) {
	color: #6fdc8c;
}

#footer.footer-text-light a:not(.btn):hover,
#footer.footer-text-light a:not(.btn):focus {
	color: #a6ecbd;
}

#footer.footer-text-light .footer-copyright .copyright-text {
	color: rgba(250, 250, 250, 0.85);
}

/* ----------------------------------------------------------------
	Accessibilita' - WCAG 1.4.3 contrasto: sfondi e placeholder
	1) Testo bianco su .btn-primary #28a745 = 3.13:1 -> sfondo #0a8927
	   (4.54:1), stato attivo/hover #076b1e (6.71:1).
	2) Placeholder #b1b4b6 = 2.08:1: e' testo a tutti gli effetti.
	   -> #6c757d (4.69:1).
	3) .bg-success di Bootstrap (#198754) con .text-light = 4.3:1,
	   sotto soglia per un soffio -> #067441 (5.56:1).
---------------------------------------------------------------- */
.btn-primary {
	background-color: #0a8927;
	border-color: #0a8927;
}

.btn-primary:hover,
.btn-primary.focus,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active {
	background-color: #076b1e;
	border-color: #076b1e;
}

.btn-outline-primary,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active {
	color: #0a8927;
	border-color: #0a8927;
}

/* NB: regole separate. In una lista unica un solo selettore non
   riconosciuto (es. :-ms-input-placeholder su Chrome) invalida
   l'intera regola e il colore non viene applicato. */
.form-control::placeholder,
.form-select::placeholder {
	color: #5c6469;
}

.form-control::-webkit-input-placeholder,
.form-select::-webkit-input-placeholder {
	color: #5c6469;
}

.form-control::-moz-placeholder,
.form-select::-moz-placeholder {
	color: #5c6469;
	opacity: 1;
}

.form-control:-ms-input-placeholder,
.form-select:-ms-input-placeholder {
	color: #5c6469;
}

.bg-success {
	background-color: #067441 !important;
}

/* testo dei campi: #777 = 4.48:1 su bianco, sotto soglia per un soffio */
.form-control,
.form-select {
	color: #495057;
}

/* tab non attivi Bootstrap: #7b8084 = 3.99:1 su bianco.
   Selettore piu' specifico di .nav-link, quindi va ripetuto. */
.nav-tabs .nav-item .nav-link {
	color: #5f6468;
}

/* ----------------------------------------------------------------
	WCAG 1.4.3 - testo bianco sui banner immagine.
	Immagine e .banner-mask sono elementi FRATELLI della .caption, non
	sfondi di un antenato: axe non puo' tenerne conto e calcola il testo
	bianco sullo sfondo bianco del contenitore. Serve uno sfondo esplicito
	sulla caption, che garantisce il contrasto anche nella resa reale
	(bianco su rgba(0,0,0,.6) sopra il bianco = 5.74:1).
---------------------------------------------------------------- */
.banner .caption {
	background: rgba(0, 0, 0, 0.6);
	border-bottom-left-radius: .25rem;
	border-bottom-right-radius: .25rem;
}

/* WCAG 1.4.1 - link dentro un blocco di testo devono essere distinguibili
   senza affidarsi al solo colore. Nel footer il link "Softline srl" e'
   inline nella riga di copyright. */
main p a:not(.btn),
main label a:not(.btn),
main .tab-pane a:not(.btn):not(.nav-link),
.modal-body a:not(.btn),
main a[href^="mailto:"]:not(.btn),
main a[href^="tel:"]:not(.btn),
main .h-100 > a:not([class]),
main .card-text a:not(.btn),
#footer a:not(.btn):not(.nav-link) {
	text-decoration: underline;
}

#footer .payments-types a:not(.btn):not(.nav-link) {
	text-decoration: none;
}

/* WCAG 1.3.1 (G140) - sostituisce style="text-align: justify" inline nei template */
.text-justify {
	text-align: justify;
}

/* ----------------------------------------------------------------
	WCAG 1.4.3 (G18) - MAUVE++ non risolve gli sfondi Bootstrap espressi
	con var(): misura il testo sul grigio del body (#e7e9ed), dove il
	verde #0a8927 scende a 3.83:1. Sfondi e testo ridichiarati con valori
	letterali: nessun cambiamento visivo.
---------------------------------------------------------------- */
.bg-white {
	background-color: #ffffff !important;
}

.modal-content,
.nav-tabs .nav-link.active {
	background-color: #ffffff;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
	color: #ffffff;
}