// Questo file fa parte di MyTown.
// MyTown è software libero: puoi ridistribuirlo e/o modificarlo secondo
// i termini della GNU Affero General Public License come pubblicata dalla
// Free Software Foundation, versione 3.
// Distribuito senza ALCUNA GARANZIA; vedi la GNU AGPL v3 per i dettagli.
// Copyright (C) Kondor Consulting & Services S.r.l.
// SPDX-License-Identifier: AGPL-3.0-or-later

.asd-content {
	--background: #f4f6f9;
}

/* Header */
.asd-header {
	padding: 18px 16px 20px;
	background: linear-gradient(135deg, var(--ion-color-primary) 0%, #0a5a92 100%);
	color: #fff;
	border-bottom-left-radius: 22px;
	border-bottom-right-radius: 22px;
	&[data-status='conclusa'] { background: linear-gradient(135deg, #1f8f5f 0%, #146c46 100%); }
	&[data-status='annullata'] { background: linear-gradient(135deg, #c0392b 0%, #922b21 100%); }

	.asd-header-top {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-bottom: 8px;
		ion-badge { font-size: 0.66rem; font-weight: 700; text-transform: uppercase; border-radius: 6px; }
	}
	h1 { margin: 0 0 12px; font-size: 1.35rem; font-weight: 800; line-height: 1.2; }

	.asd-chip {
		font-size: 0.64rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.4px;
		padding: 3px 9px; border-radius: 999px; background: rgba(255,255,255,0.22); color: #fff;
	}
	.asd-calls { display: flex; flex-wrap: wrap; gap: 16px; }
	.asd-call {
		display: flex; flex-direction: column; gap: 2px;
		.lbl { font-size: 0.64rem; text-transform: uppercase; letter-spacing: 0.4px; opacity: 0.75; }
		.val { display: inline-flex; align-items: center; gap: 6px; font-size: 0.88rem; font-weight: 600; ion-icon { font-size: 1rem; } }
	}
	.asd-loc { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 0.85rem; opacity: 0.92; ion-icon { font-size: 1rem; } }
	.asd-descr { margin: 10px 0 0; font-size: 0.85rem; opacity: 0.92; line-height: 1.4; }
}

/* Sections */
.asd-section {
	margin: 14px 14px 0;
	background: #fff;
	border-radius: 16px;
	padding: 14px 14px 16px;
	box-shadow: 0 2px 10px rgba(20, 40, 70, 0.06);
}
.asd-section-head { display: flex; align-items: center; justify-content: space-between; }
.asd-section-title {
	display: flex; align-items: center; gap: 8px;
	margin: 0 0 10px; font-size: 0.95rem; font-weight: 700; color: #34424f;
	ion-icon { color: var(--ion-color-primary); font-size: 1.15rem; }
	.cnt { background: #eef2f7; color: #5a6b7b; border-radius: 999px; font-size: 0.7rem; padding: 1px 8px; font-weight: 700; }
}
.asd-mini-btn {
	display: inline-flex; align-items: center; gap: 5px;
	background: rgba(var(--app-brand-rgb),0.1); color: var(--ion-color-primary); border: none;
	border-radius: 999px; padding: 6px 12px; font-size: 0.78rem; font-weight: 600;
	ion-icon { font-size: 0.95rem; }
}
.asd-hint { color: var(--ion-color-medium); font-size: 0.83rem; }

/* ODG */
.asd-odg { margin: 0; padding-left: 20px; li { font-size: 0.9rem; color: #44525f; margin-bottom: 6px; line-height: 1.35; } }

/* Quorum */
.asd-quorum-card {
	.q-top { display: flex; align-items: baseline; gap: 8px; }
	.q-num { font-size: 1.6rem; font-weight: 800; color: var(--ion-color-primary); small { font-size: 0.9rem; color: #93a1b0; font-weight: 600; } }
	.q-cap { font-size: 0.78rem; color: #93a1b0; }
	.q-bar { height: 9px; background: #eaeef3; border-radius: 999px; margin: 10px 0 12px; overflow: hidden; }
	.q-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--ion-color-primary), #3aa0e0); transition: width 0.4s ease; }
	.q-chips { display: flex; gap: 10px; }
	.q-chip {
		flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
		padding: 8px; border-radius: 10px; font-size: 0.8rem; font-weight: 700;
		background: #f1f3f6; color: #93a1b0;
		ion-icon { font-size: 1.05rem; }
		&.ok { background: rgba(25,135,84,0.12); color: var(--ion-color-success); }
	}
}

/* Partecipanti */
.asd-part {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	padding: 10px 0; border-bottom: 1px solid #f0f3f6;
	&:last-child { border-bottom: none; }
	&.mine { background: rgba(var(--app-brand-rgb),0.04); margin: 0 -14px; padding: 10px 14px; border-radius: 10px; }
	.asd-part-name { font-size: 0.9rem; font-weight: 600; color: #34424f; display: flex; align-items: center; gap: 7px; }
	.asd-tu { background: var(--ion-color-primary); color: #fff; font-size: 0.6rem; font-weight: 700; padding: 1px 7px; border-radius: 999px; text-transform: uppercase; }
	.asd-part-sub { display: flex; align-items: center; gap: 8px; margin-top: 3px; ion-badge { font-size: 0.62rem; border-radius: 5px; } }
	.asd-mill { display: inline-flex; align-items: center; gap: 3px; font-size: 0.74rem; color: #93a1b0; ion-icon { font-size: 0.85rem; } }
	.asd-rsvp { display: flex; gap: 6px; flex: 0 0 auto; }
	.rsvp-btn {
		width: 36px; height: 36px; border-radius: 50%; border: 1.5px solid #dde3ea; background: #fff;
		display: inline-flex; align-items: center; justify-content: center;
		ion-icon { font-size: 1.1rem; color: #b3bdc7; }
		&.ok.active { background: var(--ion-color-success); border-color: var(--ion-color-success); ion-icon { color: #fff; } }
		&.ko.active { background: var(--ion-color-danger); border-color: var(--ion-color-danger); ion-icon { color: #fff; } }
	}
}

/* File rows */
.asd-file {
	display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #f0f3f6;
	&:last-child { border-bottom: none; }
	.asd-file-ic { font-size: 1.6rem; color: var(--ion-color-primary); }
	.asd-file-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
	.nm { font-size: 0.85rem; font-weight: 600; color: #34424f; }
	.fn { font-size: 0.72rem; color: #93a1b0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.asd-file-dl { font-size: 1.3rem; color: var(--ion-color-primary); }
}

/* Action bar */
.asd-actionbar {
	position: sticky;
	bottom: 0;
	display: flex;
	gap: 8px;
	padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
	background: linear-gradient(to top, #f4f6f9 70%, rgba(244,246,249,0));
	margin-top: 16px;
	.ab-btn {
		flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
		border: none; border-radius: 12px; padding: 12px 8px; font-size: 0.82rem; font-weight: 700;
		ion-icon { font-size: 1.05rem; }
		&.light { background: #e7ecf2; color: #44525f; }
		&.ok { background: var(--ion-color-success); color: #fff; }
		&.danger { background: rgba(220,53,69,0.12); color: var(--ion-color-danger); }
	}
}
