/**
 * AvelCoop Design System - Container Queries
 *
 * Responsive adaptation to Elementor column widths.
 */

/* Base container query setup */
@container (min-width: 320px) {
	/* Narrow mobile */
}

@container (min-width: 390px) {
	/* Standard mobile */
}

@container (min-width: 450px) {
	/* Large mobile / small tablet */
}

@container (min-width: 600px) {
	/* Tablet portrait / narrow desktop */
}

@container (min-width: 900px) {
	/* Standard desktop */
}

/* Subscription form container adaptation */
.avelcoop-subscription-entry {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-md );
}

@container (min-width: 600px) {
	.avelcoop-subscription-entry {
		flex-direction: row;
		align-items: flex-start;
	}
}

/* Onboarding form container adaptation */
.avelcoop-profile-onboarding {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-lg );
}

@container (min-width: 600px) {
	.avelcoop-profile-onboarding {
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
	}
}

/* KYC dossier container adaptation */
.avelcoop-kyc-dossier {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-md );
}

@container (min-width: 600px) {
	.avelcoop-kyc-dossier {
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
	}
}

/* Magic login container adaptation */
.avelcoop-magic-login-entry {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-md );
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
}

@container (min-width: 600px) {
	.avelcoop-magic-login-entry {
		max-width: 100%;
	}
}

/* KYC prompt container adaptation */
.avelcoop-kyc-prompt-entry {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-md );
	padding: var( --avelcoop-spacing-md );
	max-width: 100%;
}

@container (min-width: 600px) {
	.avelcoop-kyc-prompt-entry {
		padding: var( --avelcoop-spacing-lg );
	}
}

/* Milestone list container adaptation */
.avelcoop-milestones-list {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-sm );
}

@container (min-width: 600px) {
	.avelcoop-milestones-list {
		flex-direction: row;
		flex-wrap: wrap;
		gap: var( --avelcoop-spacing-md );
	}
}

/* Milestone item */
.avelcoop-milestone-item {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-xs );
	min-width: 100px;
}

@container (min-width: 600px) {
	.avelcoop-milestone-item {
		flex: 1;
		min-width: auto;
	}
}

/* Progress gauge container adaptation */
.avelcoop-progress-gauge-wrapper {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-sm );
}

@container (min-width: 600px) {
	.avelcoop-progress-gauge-wrapper {
		flex-direction: row;
		align-items: center;
		gap: var( --avelcoop-spacing-md );
	}
}

/* Campaign stats container adaptation */
.avelcoop-campaign-stats-entry {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-sm );
	padding: var( --avelcoop-spacing-md );
	background-color: var( --avelcoop-bg-surface-alt );
	border-radius: var( --avelcoop-border-radius );
}

@container (min-width: 600px) {
	.avelcoop-campaign-stats-entry {
		padding: var( --avelcoop-spacing-lg );
	}
}

/* Share selector container adaptation */
.avelcoop-share-selector-wrapper {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-sm );
	padding: var( --avelcoop-spacing-md );
}

@container (min-width: 600px) {
	.avelcoop-share-selector-wrapper {
		padding: var( --avelcoop-spacing-lg );
	}
}

/* Notice container adaptation */
.avelcoop-notice {
	display: flex;
	flex-direction: column;
	gap: var( --avelcoop-spacing-xs );
	padding: var( --avelcoop-spacing-md );
	border-radius: var( --avelcoop-border-radius );
	margin-bottom: var( --avelcoop-spacing-md );
}

@container (min-width: 600px) {
	.avelcoop-notice {
		padding: var( --avelcoop-spacing-lg );
	}
}

/* Field error container */
.avelcoop-field-error {
	display: block;
	margin-top: var( --avelcoop-spacing-xs );
	font-size: var( --avelcoop-font-size-sm );
	color: var( --avelcoop-error-color );
}