/* =========================================================
   Giochi Uniti - Tornei & Classifiche
   Stylesheet plugin (frontend + admin condiviso)
   Palette brand: blu #0B5283 / #1485C9, arancione #F58220
   ========================================================= */

:root {
	--gut-blu-scuro: #0B5283;
	--gut-blu-acceso: #1485C9;
	--gut-blu-acceso-hover: #106BA3;
	--gut-arancione: #F58220;
	--gut-arancione-hover: #DD6F12;
	--gut-bg-page: #EFF4F8;
	--gut-bg-card: #FFFFFF;
	--gut-bg-table-head: #F8FBFD;
	--gut-testo: #1F2D3A;
	--gut-testo-muted: #6B7C8C;
	--gut-border: #DDE6EE;
	--gut-verde: #2BAA6B;
	--gut-giallo: #F2C14E;
	--gut-oro: #E8B923;
	--gut-argento: #9AA8B5;
	--gut-bronzo: #C2784A;
	--gut-rosso-errore: #C4392B;
	--gut-radius: 16px;
	--gut-radius-sm: 10px;
	--gut-font-display: 'Ubuntu', -apple-system, BlinkMacSystemFont, sans-serif;
	--gut-font-body: 'Ubuntu', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Tutti gli elementi prodotti dal plugin usano Ubuntu, inclusi i controlli form. */
[class^="gut-"], [class*=" gut-"],
[class^="gut-"] *, [class*=" gut-"] * {
	font-family: var(--gut-font-body);
}

.gut-account-bar { display:flex; justify-content:flex-end; align-items:center; gap:10px; margin:0 auto 18px; max-width:1100px; }
.gut-account-bar .gut-account-name { color:var(--gut-testo-muted); font-size:.92rem; }
.gut-profile-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 22px; }
.gut-profile-grid .gut-field-full { grid-column:1/-1; }
.gut-access-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:start; }
.gut-access-card { background:#fff; border:1px solid var(--gut-border); border-radius:var(--gut-radius); padding:26px; box-shadow:0 8px 24px rgba(11,82,131,.08); }
.gut-access-card h3 { color:var(--gut-blu-scuro); margin:0 0 8px; }
.gut-access-card > p { color:var(--gut-testo-muted); margin:0 0 20px; }
.gut-access-card .gut-field { margin:0 0 14px; }
.gut-access-card input:not([type="submit"]):not([type="checkbox"]) { width:100%; }
@media (max-width:700px) { .gut-profile-grid, .gut-access-grid { grid-template-columns:1fr; } .gut-profile-grid .gut-field-full { grid-column:auto; } .gut-account-bar { flex-wrap:wrap; justify-content:flex-start; } }

/* ---------- Reset locale e contenitori ---------- */

.gut-dashboard,
.gut-form-wrapper,
.gut-public-wrapper,
.gut-dettaglio-torneo,
.gut-store-locator-wrapper {
	font-family: var(--gut-font-body);
	color: var(--gut-testo);
	max-width: 1100px;
	margin: 0 auto;
	line-height: 1.5;
}

.gut-dashboard *,
.gut-form-wrapper *,
.gut-public-wrapper *,
.gut-dettaglio-torneo *,
.gut-store-locator-wrapper * {
	box-sizing: border-box;
}

/* ---------- Banner di intestazione (dashboard / sezioni pubbliche) ---------- */

.gut-banner {
	background: linear-gradient(120deg, var(--gut-blu-scuro) 0%, var(--gut-blu-acceso) 100%);
	border-radius: var(--gut-radius);
	padding: 32px 30px;
	color: #fff;
	margin-bottom: 26px;
	position: relative;
	overflow: hidden;
}

.gut-banner::before,
.gut-banner::after {
	content: '';
	position: absolute;
	border-radius: 50%;
	opacity: 0.14;
	pointer-events: none;
}

.gut-banner::before {
	width: 200px;
	height: 200px;
	background: var(--gut-arancione);
	top: -70px;
	right: 6%;
}

.gut-banner::after {
	width: 130px;
	height: 130px;
	background: var(--gut-giallo);
	bottom: -55px;
	right: 20%;
}

.gut-banner-eyebrow {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #aee0ff;
	margin-bottom: 8px;
	position: relative;
	z-index: 1;
}

.gut-banner h1,
.gut-banner h2 {
	font-family: var(--gut-font-display);
	font-weight: 700;
	margin: 0 0 8px;
	position: relative;
	z-index: 1;
	color: #fff;
}

.gut-banner p {
	margin: 0;
	color: #d7ecfa;
	max-width: 560px;
	position: relative;
	z-index: 1;
}

.gut-banner-meta {
	display: flex;
	gap: 26px;
	flex-wrap: wrap;
	margin-top: 16px;
	position: relative;
	z-index: 1;
}

.gut-banner-meta-item {
	font-size: 0.88rem;
}

.gut-banner-meta-item .gut-meta-label {
	display: block;
	color: #aee0ff;
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-weight: 700;
	margin-bottom: 3px;
}

.gut-banner-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: rgba(255, 255, 255, 0.15);
	padding: 5px 14px;
	border-radius: 20px;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 14px;
	position: relative;
	z-index: 1;
}

.gut-banner-badge .dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--gut-verde);
	display: inline-block;
}

/* ---------- Header semplice (senza gradiente, per form interni) ---------- */

.gut-dashboard-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 22px;
}

.gut-dashboard-header h2 {
	margin: 0;
	font-family: var(--gut-font-display);
	font-size: 1.4rem;
	color: var(--gut-blu-scuro);
}

/* ---------- Notifiche ---------- */

.gut-notice {
	padding: 13px 18px;
	border-radius: var(--gut-radius-sm);
	margin-bottom: 18px;
	font-size: 0.92rem;
}

.gut-notice-error {
	background: #fdecea;
	color: var(--gut-rosso-errore);
	border: 1px solid #f6c7c2;
}

.gut-notice-success {
	background: #e5f6ed;
	color: #1c8a53;
	border: 1px solid #bfe6d3;
}

.gut-empty-state {
	text-align: center;
	padding: 50px 24px;
	color: var(--gut-testo-muted);
	background: var(--gut-bg-card);
	border: 1px dashed var(--gut-border);
	border-radius: var(--gut-radius);
}

/* ---------- Cards statistiche ---------- */

.gut-stats-row {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	margin-bottom: 22px;
}

.gut-stat-card {
	background: var(--gut-bg-card);
	border-radius: var(--gut-radius);
	padding: 18px 22px;
	box-shadow: 0 8px 24px rgba(11, 82, 131, 0.08);
	border: 1px solid var(--gut-border);
	min-width: 140px;
	flex: 1;
}

.gut-stat-number {
	font-family: var(--gut-font-display);
	font-size: 1.8rem;
	font-weight: 700;
	color: var(--gut-blu-scuro);
	line-height: 1;
}

.gut-stat-card.gut-accent .gut-stat-number {
	color: var(--gut-arancione);
}

.gut-stat-label {
	font-size: 0.76rem;
	color: var(--gut-testo-muted);
	margin-top: 4px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	font-weight: 600;
}

/* ---------- Bottoni ---------- */

.gut-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 11px 22px;
	border-radius: var(--gut-radius-sm);
	font-weight: 700;
	font-size: 0.88rem;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
	line-height: 1.4;
	font-family: var(--gut-font-body);
}

.gut-btn-primary {
	background: var(--gut-arancione);
	color: #fff;
	box-shadow: 0 6px 16px rgba(245, 130, 32, 0.3);
}
.gut-btn-primary:hover {
	background: var(--gut-arancione-hover);
	color: #fff;
}

.gut-btn-secondary {
	background: #fff;
	color: var(--gut-blu-scuro);
	border: 1.5px solid var(--gut-border);
}
.gut-btn-secondary:hover {
	background: var(--gut-bg-page);
}

.gut-btn-danger {
	background: #fff;
	color: var(--gut-rosso-errore);
	border: 1.5px solid #f3c3bd;
}
.gut-btn-danger:hover {
	background: #fdecea;
}

.gut-btn-small {
	padding: 7px 14px;
	font-size: 0.78rem;
}

.gut-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* ---------- Tabelle (dashboard, classifiche) ---------- */

.gut-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--gut-bg-card);
	border-radius: var(--gut-radius);
	overflow: hidden;
	box-shadow: 0 8px 26px rgba(11, 82, 131, 0.07);
	border: 1px solid var(--gut-border);
}

.gut-table th,
.gut-table td {
	padding: 14px 20px;
	text-align: left;
	border-bottom: 1px solid var(--gut-border);
	font-size: 0.9rem;
}

.gut-table th {
	background: var(--gut-bg-table-head);
	color: var(--gut-testo-muted);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 0.72rem;
	letter-spacing: 0.05em;
}

.gut-table tbody tr:hover td {
	background: #fafcfe;
}

.gut-table tbody tr:last-child td {
	border-bottom: none;
}

.gut-azioni {
	white-space: nowrap;
}
.gut-azioni .gut-btn {
	margin-right: 6px;
}

/* Nome evento con meta secondaria, dentro le celle tabella */
.gut-cell-titolo {
	font-weight: 700;
	color: var(--gut-testo);
}
.gut-cell-meta {
	font-size: 0.78rem;
	color: var(--gut-testo-muted);
	margin-top: 2px;
}

/* Badge stato con pallino colorato */

.gut-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 13px;
	border-radius: 20px;
	font-size: 0.74rem;
	font-weight: 700;
}

.gut-badge .gut-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	display: inline-block;
}

.gut-stato-bozza {
	background: #eef1f4;
	color: #5c6b7a;
}
.gut-stato-bozza .gut-dot {
	background: var(--gut-argento);
}

.gut-stato-pending {
	background: #fef1e2;
	color: #b86a0e;
}
.gut-stato-pending .gut-dot {
	background: var(--gut-arancione);
}

.gut-stato-pubblicato {
	background: #e5f6ed;
	color: #1c8a53;
}
.gut-stato-pubblicato .gut-dot {
	background: var(--gut-verde);
}

/* ---------- Form ---------- */

.gut-form {
	background: var(--gut-bg-card);
	padding: 26px;
	border-radius: var(--gut-radius);
	box-shadow: 0 8px 26px rgba(11, 82, 131, 0.07);
	border: 1px solid var(--gut-border);
}

.gut-field {
	margin-bottom: 18px;
}

.gut-field label {
	display: block;
	font-weight: 700;
	margin-bottom: 6px;
	font-size: 0.88rem;
	color: var(--gut-blu-scuro);
}

.gut-required {
	color: var(--gut-arancione);
}

.gut-form input[type="text"],
.gut-form input[type="date"],
.gut-form input[type="number"],
.gut-form input[type="url"],
.gut-form select {
	width: 100%;
	max-width: 420px;
	padding: 11px 14px;
	border: 1.5px solid var(--gut-border);
	border-radius: var(--gut-radius-sm);
	font-size: 0.95rem;
	font-family: var(--gut-font-body);
	color: var(--gut-testo);
	background: #fff;
}

.gut-form input:focus,
.gut-form select:focus {
	outline: none;
	border-color: var(--gut-blu-acceso);
	box-shadow: 0 0 0 3px rgba(20, 133, 201, 0.14);
}

.gut-form-actions {
	display: flex;
	gap: 12px;
	margin-top: 24px;
	flex-wrap: wrap;
}

.gut-login-box {
	background: var(--gut-bg-card);
	padding: 26px;
	border-radius: var(--gut-radius);
	box-shadow: 0 8px 26px rgba(11, 82, 131, 0.07);
	border: 1px solid var(--gut-border);
	max-width: 400px;
}

/* ---------- Filtro città (elenco pubblico) ---------- */

.gut-filtro-tornei {
	background: var(--gut-bg-card);
	border-radius: var(--gut-radius);
	box-shadow: 0 10px 28px rgba(11, 82, 131, 0.09);
	border: 1px solid var(--gut-border);
	padding: 16px 20px;
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin-bottom: 24px;
}

.gut-filtro-tornei label {
	font-weight: 700;
	font-size: 0.85rem;
	color: var(--gut-blu-scuro);
}

.gut-filtro-tornei select {
	padding: 9px 14px;
	border-radius: 20px;
	border: 1.5px solid var(--gut-border);
	font-size: 0.85rem;
	color: var(--gut-testo);
	background: #fff;
	font-family: var(--gut-font-body);
}

/* ---------- Elenco pubblico / Card tornei ---------- */

.gut-grid-tornei {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
	gap: 20px;
}

.gut-card-torneo {
	display: flex;
	flex-direction: column;
	background: var(--gut-bg-card);
	border-radius: var(--gut-radius);
	overflow: hidden;
	text-decoration: none;
	color: var(--gut-testo);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	border: 1px solid var(--gut-border);
	box-shadow: 0 6px 18px rgba(11, 82, 131, 0.06);
}

.gut-card-torneo:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(11, 82, 131, 0.14);
}

.gut-card-torneo-top {
	height: 7px;
	background: var(--gut-arancione);
}

/* Alterna automaticamente il colore della fascia superiore in base alla posizione nella grid */
.gut-grid-tornei .gut-card-torneo:nth-child(3n+2) .gut-card-torneo-top {
	background: var(--gut-blu-acceso);
}
.gut-grid-tornei .gut-card-torneo:nth-child(3n+3) .gut-card-torneo-top {
	background: var(--gut-verde);
}

.gut-card-body {
	padding: 20px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.gut-card-data {
	font-size: 0.74rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--gut-arancione);
	margin-bottom: 10px;
}

.gut-card-titolo {
	font-family: var(--gut-font-display);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--gut-blu-scuro);
	margin: 0 0 12px;
	line-height: 1.25;
}

.gut-card-luogo {
	font-size: 0.85rem;
	color: var(--gut-testo-muted);
	margin-top: auto;
}

.gut-icon-pin {
	margin-right: 4px;
}

.gut-card-footer {
	padding: 13px 20px;
	border-top: 1px solid var(--gut-border);
	font-size: 0.78rem;
	font-weight: 700;
	color: var(--gut-blu-acceso);
}

/* ---------- Dettaglio torneo + classifica con podio ---------- */

.gut-dettaglio-torneo h2.gut-dettaglio-titolo {
	color: #fff;
	font-size: 1.7rem;
	margin: 0 0 8px;
}

.gut-dettaglio-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	color: var(--gut-testo-muted);
	font-size: 0.9rem;
}

.gut-dettaglio-meta strong {
	color: var(--gut-testo);
}

.gut-dettaglio-torneo h2 {
	font-family: var(--gut-font-display);
	color: var(--gut-blu-scuro);
	font-size: 1.3rem;
	margin: 30px 0 14px;
}

.gut-table-classifica td:first-child,
.gut-table-classifica th:first-child {
	width: 56px;
}

.gut-pos-medal {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-weight: 700;
	font-size: 0.85rem;
	color: #fff;
	background: var(--gut-argento);
}
.gut-pos-medal.gut-pos-1 { background: var(--gut-oro); }
.gut-pos-medal.gut-pos-2 { background: var(--gut-argento); }
.gut-pos-medal.gut-pos-3 { background: var(--gut-bronzo); }

.gut-table-classifica .gut-nome-giocatore {
	font-weight: 700;
}
.gut-table-classifica .gut-team-giocatore {
	color: var(--gut-testo-muted);
	font-size: 0.85rem;
}
.gut-table-classifica .gut-punti-giocatore {
	font-weight: 700;
	color: var(--gut-blu-scuro);
	text-align: right;
}
.gut-table-classifica th:last-child {
	text-align: right;
}

/* ---------- Store Locator ---------- */

.gut-map-container {
	width: 100%;
	height: 480px;
	border-radius: var(--gut-radius);
	background: var(--gut-bg-page);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	box-shadow: 0 8px 26px rgba(11, 82, 131, 0.07);
	border: 1px solid var(--gut-border);
}

.gut-map-loading {
	color: var(--gut-testo-muted);
	font-size: 0.9rem;
}

.gut-info-window h4 {
	margin: 0 0 4px;
	color: var(--gut-blu-scuro);
	font-family: var(--gut-font-display);
}
.gut-info-window p {
	margin: 2px 0;
	font-size: 0.85rem;
}
.gut-info-window a {
	color: var(--gut-blu-acceso);
	font-weight: 700;
}

/* ---------- Responsive: tabelle a "card" su mobile ---------- */

@media (max-width: 640px) {
	.gut-table-tornei thead {
		display: none;
	}
	.gut-table-tornei tbody tr {
		display: block;
		margin-bottom: 14px;
		border: 1px solid var(--gut-border);
		border-radius: var(--gut-radius);
		padding: 6px 10px;
	}
	.gut-table-tornei tbody td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px solid #f0f2f5;
		padding: 10px 4px;
	}
	.gut-table-tornei tbody td:last-child {
		border-bottom: none;
	}
	.gut-table-tornei tbody td::before {
		content: attr(data-label);
		font-weight: 700;
		color: var(--gut-blu-scuro);
		font-size: 0.74rem;
		text-transform: uppercase;
		margin-right: 12px;
	}

	.gut-table-classifica thead {
		display: none;
	}
	.gut-table-classifica tbody tr {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 10px;
		padding: 14px 16px;
	}
	.gut-table-classifica tbody td {
		padding: 0;
		border-bottom: none;
	}

	.gut-dashboard-header {
		flex-direction: column;
		align-items: stretch;
	}
	.gut-dashboard-header .gut-btn {
		text-align: center;
		justify-content: center;
	}

	.gut-stats-row {
		gap: 10px;
	}
	.gut-stat-card {
		padding: 14px;
		min-width: 0;
	}

	.gut-form-actions {
		flex-direction: column;
	}
	.gut-form-actions .gut-btn {
		justify-content: center;
		width: 100%;
	}

	.gut-filtro-tornei {
		flex-direction: column;
		align-items: stretch;
	}
	.gut-filtro-tornei select {
		width: 100%;
	}

	.gut-banner {
		padding: 24px 20px;
	}
	.gut-banner h1, .gut-banner h2 {
		font-size: 1.5rem;
	}

	.gut-map-container {
		height: 320px;
	}
}

/* =========================================================
   Immagini torneo
   ========================================================= */

/* -- Campo immagine nel form -- */
.gut-image-field {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 6px;
}

.gut-image-preview {
	position: relative;
	width: 160px;
	flex-shrink: 0;
}

.gut-image-preview img {
	width: 160px;
	height: 110px;
	object-fit: cover;
	border-radius: 10px;
	border: 2px solid var(--gut-border);
	display: block;
}

.gut-image-remove {
	position: absolute;
	top: -8px;
	right: -8px;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--gut-rosso-errore);
	color: #fff;
	border: none;
	cursor: pointer;
	font-size: 14px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
}

.gut-field-desc {
	font-size: 0.8rem;
	color: var(--gut-testo-muted);
	margin-top: 8px;
}

/* -- Thumbnail nella dashboard rivenditore -- */
.gut-cell-evento {
	display: flex;
	align-items: center;
	gap: 14px;
}

.gut-cell-thumb {
	flex-shrink: 0;
	width: 60px;
	height: 60px;
	border-radius: 8px;
	overflow: hidden;
	background: var(--gut-bg-page);
}

.gut-cell-thumb img {
	width: 60px;
	height: 60px;
	object-fit: cover;
	display: block;
}

/* -- Thumbnail nelle card pubbliche -- */
.gut-card-thumb {
	width: 100%;
	height: 180px;
	overflow: hidden;
	background: var(--gut-bg-page);
}

.gut-card-thumb img {
	width: 100%;
	height: 180px;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}

.gut-card-torneo:hover .gut-card-thumb img {
	transform: scale(1.04);
}

/* -- Pin SVG (se non già presente) -- */
.gut-pin-svg {
	display: inline-block;
	width: 13px;
	height: 13px;
	vertical-align: middle;
	margin-right: 4px;
	margin-top: -2px;
	color: var(--gut-testo-muted);
	flex-shrink: 0;
}