/*
 * GMA Scadenziario — Impostazioni → Aziende and → Utenti e ruoli.
 *
 * Scoped under .gma-scd-app and built only from the shared tokens and the
 * components already used by Tasse (cards, fields, .gma-scd-table with its
 * card layout below 850px, pagination, row actions). Layout adapts through
 * the app container (gma-scd), like the shell.
 */

/* Status badge without colour meaning (the label carries the state). ----- */

.gma-scd-app .gma-scd-badge--neutral {
	--gma-scd-tone: var(--gma-scd-text-muted);
}

/* Filters ---------------------------------------------------------------- */

.gma-scd-app .gma-scd-admin-filters {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--gma-scd-spacing-3);
	align-items: end;
	margin-bottom: var(--gma-scd-spacing-4);
}

.gma-scd-app .gma-scd-admin-filters .gma-scd-field--wide {
	grid-column: span 2;
}

.gma-scd-app .gma-scd-admin-filters__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gma-scd-spacing-2);
}

/* Lists ------------------------------------------------------------------ */

.gma-scd-app .gma-scd-admin-list {
	margin-bottom: var(--gma-scd-spacing-3);
	padding: 0;
	overflow: hidden;
}

.gma-scd-app .gma-scd-admin-list .gma-scd-inline-empty {
	padding: var(--gma-scd-spacing-8) var(--gma-scd-spacing-4);
}

.gma-scd-app .gma-scd-field__label {
	color: var(--gma-scd-text);
	font-size: var(--gma-scd-font-size-sm);
	font-weight: 600;
}

.gma-scd-app .gma-scd-member-name {
	display: block;
	min-width: 0;
}

.gma-scd-app .gma-scd-member-self {
	color: var(--gma-scd-text-muted);
	font-size: var(--gma-scd-font-size-sm);
}

.gma-scd-app .gma-scd-member-login {
	display: block;
	color: var(--gma-scd-text-muted);
	font-size: var(--gma-scd-font-size-xs);
	overflow-wrap: anywhere;
}

.gma-scd-app .gma-scd-member-email {
	overflow-wrap: break-word;
}

/* Add member ------------------------------------------------------------- */

.gma-scd-app .gma-scd-member-add {
	margin-bottom: var(--gma-scd-spacing-4);
}

.gma-scd-app .gma-scd-member-add__fields {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto;
	gap: var(--gma-scd-spacing-3);
	align-items: end;
	margin: var(--gma-scd-spacing-3) 0 var(--gma-scd-spacing-2);
}

.gma-scd-app .gma-scd-member-add__fields .gma-scd-field--wide {
	grid-column: auto;
}

/* Role change: select and button on one line while they fit. The shell caps
   .gma-scd-select for the toolbar; here the full role label must stay readable. */
.gma-scd-app .gma-scd-member-role {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--gma-scd-spacing-2);
}

.gma-scd-app .gma-scd-member-role .gma-scd-select {
	width: auto;
	min-width: 13.5rem;
	max-width: none;
	min-height: var(--gma-scd-touch-target);
}

/* Accesso globale GMA (technical owner only) ------------------------------ */

.gma-scd-app .gma-scd-global-access {
	margin-bottom: var(--gma-scd-spacing-3);
}

.gma-scd-app .gma-scd-global-access__grant {
	grid-template-columns: minmax(0, 1fr) auto;
}

.gma-scd-app .gma-scd-global-access__title {
	margin: var(--gma-scd-spacing-4) 0 var(--gma-scd-spacing-1);
	font-size: var(--gma-scd-font-size-md);
}

.gma-scd-app .gma-scd-global-access__row .gma-scd-member-name {
	flex: 1 1 12rem;
}

/* Compact layout --------------------------------------------------------- */

@container gma-scd (max-width: 1049px) {
	.gma-scd-app .gma-scd-admin-filters {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.gma-scd-app .gma-scd-member-role {
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}

	.gma-scd-app .gma-scd-member-role .gma-scd-select {
		width: 100%;
	}
}

@container gma-scd (max-width: 849px) {
	/* In the card layout the name cell holds name, "(tu)" and login. */
	.gma-scd-app .gma-scd-admin-list .gma-scd-table td {
		flex-wrap: wrap;
	}

	/* Member actions: one full-width column in the card, like the role form. */
	.gma-scd-app .gma-scd-member-actions {
		flex: 1 1 100%;
		flex-direction: column;
		align-items: stretch;
	}

	.gma-scd-app .gma-scd-member-actions form,
	.gma-scd-app .gma-scd-member-actions .gma-scd-btn {
		width: 100%;
	}

	.gma-scd-app .gma-scd-member-role .gma-scd-select {
		min-width: 0;
	}
}

@container gma-scd (max-width: 699px) {
	.gma-scd-app .gma-scd-admin-filters,
	.gma-scd-app .gma-scd-member-add__fields {
		grid-template-columns: minmax(0, 1fr);
	}

	.gma-scd-app .gma-scd-admin-filters .gma-scd-field--wide {
		grid-column: auto;
	}

	.gma-scd-app .gma-scd-member-add__submit .gma-scd-btn {
		width: 100%;
	}
}