/* Le dashboard di Statistiche e Incassi: barra dei filtri (gs-df), schede dei numeri (gs-dk), riquadri dei grafici (gs-dr),
   frasi "in evidenza" (gs-dev) e la griglia che li dispone (gs-dash). Stile come il resto del programma: schede bianche con
   ombra leggera sul fondo sabbia, colori del tema. */

.gs-dash {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/* ---------- filtri ---------- */
.gs-df {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: .75rem 1rem;
	padding: .8rem 1rem;
	border-radius: .9rem;
	background: #fff;
	box-shadow: 0 .2rem .8rem rgba(15, 45, 65, .07);
}

.gs-df-campi {
	display: flex;
	flex: 1;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: .6rem 1rem;
}

.gs-df-campo {
	min-width: 10rem;
}

.gs-df-periodo-campo {
	min-width: 22rem;
}

.gs-df-campo label {
	display: block;
	margin-bottom: .15rem;
	color: var(--gs-ink);
	font-size: .75rem;
	font-weight: 600;
}

.gs-df-periodo {
	position: relative;
	width: 11.5rem;
	cursor: pointer;
}

.gs-df-periodo dxbl-date-range-picker {
	width: 100%;
	height: 31px;
	font-size: .875rem;
}

.gs-df-periodo .dxbl-text-edit-input {
	padding-left: .75rem;
	cursor: pointer;
}

.gs-df-aggiorna {
	min-width: 9.5rem;
	height: 31px;
	padding: 0 1rem;
	font-weight: 600;
}

.gs-df-descrizione {
	margin: -.25rem 0 0;
	color: #6c7a86;
	font-size: .85rem;
}

/* ---------- schede dei numeri ---------- */
.gs-dash-kpi {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
	gap: .8rem;
}

.gs-dk {
	display: flex;
	flex-direction: column;
	gap: .15rem;
	padding: .8rem 1rem .85rem;
	border-radius: .9rem;
	border-left: .3rem solid var(--gs-primary);
	background: #fff;
	box-shadow: 0 .2rem .8rem rgba(15, 45, 65, .07);
}

.gs-dk-ok { border-left-color: #3fb76d; }
.gs-dk-attenzione { border-left-color: #ef8a3a; }
.gs-dk-problema { border-left-color: #dc3f4d; }

.gs-dk-testa {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .5rem;
}

.gs-dk-titolo {
	color: #6c7a86;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
}

.gs-dk-icona {
	color: var(--gs-primary);
	font-size: 1.15rem;
}

.gs-dk-ok .gs-dk-icona { color: #3fb76d; }
.gs-dk-attenzione .gs-dk-icona { color: #ef8a3a; }
.gs-dk-problema .gs-dk-icona { color: #dc3f4d; }

.gs-dk-valore {
	color: var(--gs-ink);
	font-size: 1.7rem;
	font-weight: 700;
	line-height: 1.2;
}

.gs-dk-variazione {
	display: flex;
	align-items: center;
	gap: .3rem;
	font-size: .82rem;
	font-weight: 600;
}

.gs-dk-su { color: #2fa35a; }
.gs-dk-giu { color: #dc3f4d; }
.gs-dk-neutro { color: #6c7a86; }

.gs-dk-confronto {
	color: #8b97a2;
	font-weight: 400;
}

.gs-dk-dettaglio {
	color: #6c7a86;
	font-size: .82rem;
}

/* ---------- riquadri ---------- */
.gs-dash-griglia {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(24rem, 100%), 1fr));
	gap: 1rem;
}

.gs-dr {
	min-width: 0;
	padding: .85rem 1rem 1rem;
	border-radius: .9rem;
	background: #fff;
	box-shadow: 0 .2rem .8rem rgba(15, 45, 65, .07);
}

.gs-dr-largo {
	grid-column: 1 / -1;
}

.gs-dr-medio {
	grid-column: span 2;
}

@media (max-width: 1000px) {
	.gs-dr-medio {
		grid-column: 1 / -1;
	}
}

.gs-dr-testa {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .1rem .75rem;
	margin-bottom: .4rem;
}

.gs-dr-titolo {
	display: flex;
	align-items: center;
	gap: .45rem;
	margin: 0;
	color: var(--gs-ink);
	font-size: 1rem;
	font-weight: 700;
}

.gs-dr-titolo i {
	color: var(--gs-primary);
}

.gs-dr-sottotitolo {
	color: #8b97a2;
	font-size: .78rem;
}

.gs-dr-vuoto {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-height: 8rem;
	color: #8b97a2;
}

.gs-dash-attesa {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	min-height: 12rem;
	color: #6c7a86;
}

.gs-dash-vuoto {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	padding: 2.5rem 1rem;
	border-radius: .9rem;
	background: #fff;
	color: #6c7a86;
	box-shadow: 0 .2rem .8rem rgba(15, 45, 65, .07);
}

/* ---------- in evidenza ---------- */
.gs-dev-elenco {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(26rem, 100%), 1fr));
	gap: .35rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.gs-dev-voce {
	display: flex;
	align-items: flex-start;
	gap: .55rem;
	padding: .3rem 0;
	border-bottom: 1px solid #eef2f5;
	font-size: .9rem;
}

.gs-dev-voce i {
	margin-top: .1rem;
	color: var(--gs-primary);
}

.gs-dev-ok i { color: #2fa35a; }
.gs-dev-attenzione i { color: #e08a1f; }
.gs-dev-problema i { color: #dc3f4d; }

/* ---------- da contabilizzare (Incassi) ---------- */
.gs-dash-azioni {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: .8rem;
}

.gs-da {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .7rem 1rem;
	border: 0;
	border-radius: .9rem;
	background: #fff6df;
	box-shadow: 0 .2rem .8rem rgba(15, 45, 65, .07);
	color: var(--gs-ink);
	text-align: left;
	cursor: pointer;
}

.gs-da:hover {
	background: #ffefc4;
}

.gs-da-nulla {
	background: #eaf7ef;
	cursor: default;
}

.gs-da i {
	font-size: 1.5rem;
	color: #e08a1f;
}

.gs-da-nulla i {
	color: #2fa35a;
}

.gs-da strong {
	display: block;
	font-size: 1.1rem;
	line-height: 1.2;
}

.gs-da span {
	color: #6c7a86;
	font-size: .8rem;
}

/* ---------- grafici DevExpress ---------- */
/* Il contenitore interno del grafico non eredita da solo l'altezza data al grafico e resterebbe a 400 px, uscendo dal riquadro. */
.gs-dr dxbl-chart,
.gs-dr dxbl-pie-chart {
	display: block;
	width: 100%;
}

.gs-dr dxbl-chart > div,
.gs-dr dxbl-pie-chart > div,
.gs-dr dxbl-chart .dxbl-widget-container,
.gs-dr dxbl-pie-chart .dxbl-widget-container {
	height: 100%;
}

.gs-dash-tip {
	padding: .4rem .6rem;
	font-size: .85rem;
	line-height: 1.35;
}
