/*--------------------------------------------------
---- Variabili CSS ---------------------------------
--------------------------------------------------*/

:root {

	/* Colori */
	--anad-color-background: #ffffff;
	--anad-color-page-background: #f8f9fb;
	--anad-color-primary: #181f49;
	--anad-color-searches: #b65c82;
	--anad-color-secondary: #e21e33;
	--anad-color-success: #2f8f5b;
	--anad-color-taxonomies: #7a5c9e;
	--anad-color-text: #1a1a1a;
	--anad-color-warning: #d98924;
    --anad-color-notes: #8D6E63;

	/* Font */
	--anad-font-body: "lato", sans-serif;
	--anad-font-display: "lorimer-no-2", sans-serif;
	--anad-font-display-condensed: "lorimer-no-2-condensed", sans-serif;
	--anad-font-editorial: "ff-meta-serif-web-pro", serif;

	/* Layout */
	--anad-container-width: 1400px;

	/* Tipografia */
	--anad-font-size-base: 1rem;    /* 16px */
	--anad-font-size-sm: 0.875rem;  /* 14px */
	--anad-font-size-xs: 0.75rem;   /* 12px */
	--anad-line-height-base: 1.5;   /* 24px su 16px */
	--anad-line-height-xs: 1.3333;  /* 16px su 12px */

	/* Transizioni */
	--anad-transition-base: 0.25s ease-in-out;
	--anad-transition-fast: 0.2s ease-in-out;

}


/*--------------------------------------------------
---- Stili globali ---------------------------------
--------------------------------------------------*/

html {
	font-size: 100% !important;
	-webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
	background-color: var(--anad-color-primary);
	color: var(--anad-color-text);
	font-family: var(--anad-font-body);
	font-size: var(--anad-font-size-base);
	line-height: var(--anad-line-height-base);
	margin: 0;
}

/*
 * Colore sincronizzato con la barra di amministrazione WordPress
 * durante la visualizzazione per gli utenti autenticati.
 */
body.logged-in {
	background-color: rgb(29, 35, 39);
}

/*
 * Ripristina il colore standard del sito dopo la barra amministrativa.
 */
body.logged-in.ios-adminbar-background {
	background-color: var(--anad-color-primary);
}

main {
    background-color: var(--anad-color-page-background);
}

[hidden] {
	display: none !important;
}

/**
 * ==========================================================================
 * Web App — pull to refresh
 * ==========================================================================
 */

.anad-pull-to-refresh {
	position: fixed;
	top: -48px;
	left: calc( 50% - 20px );
	z-index: 99999;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 40px;
	height: 40px;

	background: #fff;
	border-radius: 50%;
	box-shadow: 0 2px 10px rgba( 24, 31, 73, 0.18 );

	transform: none;
	transition:
		transform 0.2s ease,
		opacity 0.2s ease;

	pointer-events: none;
	opacity: 0;
}

.anad-pull-to-refresh[style*="translateY"] {
	opacity: 1;
}

.anad-pull-to-refresh__spinner {
	display: block;

	width: 18px;
	height: 18px;

	border: 2px solid rgba( 24, 31, 73, 0.2 );
	border-top-color: #181f49;
	border-radius: 50%;

	transition: transform 0.2s ease;
}

/* Soglia di aggiornamento raggiunta. */
.anad-pull-to-refresh.is-ready
	.anad-pull-to-refresh__spinner {
	transform: rotate( 180deg );
}

/* Ricaricamento in corso. */
.anad-pull-to-refresh.is-loading
	.anad-pull-to-refresh__spinner {
	animation: anad-pull-to-refresh-spin 0.7s linear infinite;
}

/**
 * Rotazione.
 */
@keyframes anad-pull-to-refresh-spin {

	to {
		transform: rotate( 360deg );
	}
}