/* Common Template Styles - Mobile-first */

/* Container fluid padding override */
.container-fluid {
	padding: 0;
}

/* Dashboard row gaps */
.dashboard {
	.row {
		&.g-0.g-xl-3 {
			gap: 2rem;
		}

		&.g-0 {
			width: 100%;
			justify-content: center;
		}
	}
}

/* Progress page row gaps */
.scenario-progress,
.riskmap-progress,
.grid-progress {
	.row {
		gap: 1rem;
	}
}

/* Password icon visibility - controlled by JS */
.password-icon.eye-off-icon {
	display: none;
}

/* Spinner visibility - controlled by JS */
#spinner {
	display: none;
}

/* Error message visibility - controlled by JS */
.error-message {
	display: none;
}

/* Scenario results specific styles */
.scenario-results {
	.card {
		&.p-4.bg-dark.mb-4 {
			background: var(--clr-surface-1);
			box-shadow: var(--card-shadow);
		}

		&.p-3 {
			background: transparent;
			width: fit-content;
		}
	}

	#plot-3d {
		min-height: 600px;
	}

	.text-decoration-none {
		color: var(--clr-secondary);
	}

	.info-value {
		text-align: inherit;
	}

	#evacuationSuggestionsCard {
		display: none;
	}
}

/* Visualisation pages */
.visualise-page {
	.floating-card {
		background-color: var(--clr-surface-1);
		border-radius: 20px;

		&.p-4 {
			padding: var(--pd-400);
		}

		&.mb-4 {
			margin-bottom: var(--mg-400);
		}
	}

	.plot-container {
		max-width: 100%;
		height: auto;
		object-fit: contain;
	}

	.text-decoration-none {
		color: var(--clr-secondary);
	}
}

/* Compare scenarios page */
.compare-scenarios {
	.floating-card {
		background-color: var(--clr-surface-1);
		border-radius: 20px;

		&.p-4 {
			padding: var(--pd-400);
		}

		&.mb-4 {
			margin-bottom: var(--mg-400);
		}
	}

	img {
		width: 100%;
		height: auto;
	}
}

/* Compare scenarios specific */
.compare-scenarios-page {
	img {
		width: 100%;
		height: auto;
	}
}

/* Settings page */
.settings-page {
	.language-selector {
		margin-top: 1rem;
	}
}

/* Social account signup */
.socialaccount-signup {
	h1 {
		color: gainsboro;
	}
}

/* Admin custom add form */
.admin-custom-add-form {
	.form-control {
		width: 50%;
	}
}
