:root {
	--lav: #f1e9fb;
	--violet1: #7c3aed;
	--violet2: #a855f7;
	--input: #6f6a80;
	--bg-primary: #ffffff;
	--bg-secondary: #f1e9fb;
	--text-primary: #000000;
	--text-secondary: #6f6a80;
	--text-muted: #999;
	--border-color: #c7c3d9;
	--border-light: #ece8f5;
	--input-bg: #ffffff;
	--card-bg: #ffffff;
	--separator-line: #ece8f5;
	--btn-soft-bg: #efeafb;
	--btn-soft-border: #e4def9;
	--btn-soft-text: #6b21a8;
	--strength-bg: #eee;
	--eye-btn-color: #777;
	--eye-btn-hover: #444;
	--modal-bg: #ffffff;
	--modal-body-bg: #f8f9fa;
	--modal-header-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	--form-section-bg: #ffffff;
	--gender-card-bg: #ffffff;
	--gender-card-border: #e2e8f0;
	--gender-card-hover-border: #cbd5e0;
	--label-color: #1a202c;
	--hint-color: #718096;
	--optional-badge-bg: #e2e8f0;
	--optional-badge-color: #718096;
	--input-border: #e2e8f0;
	--input-focus-border: #667eea;
	--input-focus-shadow: rgba(102, 126, 234, 0.1);
	--footer-border: #e2e8f0;
	--btn-link-color: #718096;
	--btn-link-hover: #1a202c;
	--bs-secondary-color: #6c757d;
}

[data-theme="dark"] {
	--lav: #1a1625;
	--bg-primary: #0f0a1a;
	--bg-secondary: #1a1625;
	--text-primary: #e5e5e5;
	--text-secondary: #a8a3b8;
	--text-muted: #6b6575;
	--border-color: #3a3448;
	--border-light: #2a2438;
	--input-bg: #1f1a2e;
	--card-bg: #1a1625;
	--separator-line: #2a2438;
	--btn-soft-bg: #2a1f3d;
	--btn-soft-border: #3a2f5d;
	--btn-soft-text: #c084fc;
	--input: #a8a3b8;
	--strength-bg: #2a2438;
	--eye-btn-color: #a8a3b8;
	--eye-btn-hover: #e5e5e5;
	--modal-bg: #1a1625;
	--modal-body-bg: #0f0a1a;
	--modal-header-bg: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%);
	--form-section-bg: #1f1a2e;
	--gender-card-bg: #1f1a2e;
	--gender-card-border: #3a3448;
	--gender-card-hover-border: #4a4158;
	--label-color: #e5e5e5;
	--hint-color: #a8a3b8;
	--optional-badge-bg: #3a3448;
	--optional-badge-color: #a8a3b8;
	--input-border: #3a3448;
	--input-focus-border: #8b5cf6;
	--input-focus-shadow: rgba(139, 92, 246, 0.2);
	--footer-border: #2a2438;
	--btn-link-color: #a8a3b8;
	--btn-link-hover: #e5e5e5;
	--bs-secondary-color: #a8a3b8;
}

html, body {
	height: 100%;
}

body {
	background: var(--bg-secondary);
	font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans";
	color: var(--text-primary);
	transition: background 0.3s ease, color 0.3s ease;
}

/* Theme Toggle Button */
.theme-toggle {
	position: fixed;
	top: 20px;
	right: 20px;
	width: 60px;
	height: 32px;
	background: var(--border-color);
	border-radius: 999px;
	cursor: pointer;
	display: flex;
	align-items: center;
	padding: 4px;
	transition: background 0.3s ease;
	z-index: 1000;
	border: 2px solid var(--border-light);
}

.theme-toggle:hover {
	background: var(--violet1);
}

.theme-toggle-slider {
	width: 24px;
	height: 24px;
	background: white;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.3s ease;
	box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

[data-theme="dark"] .theme-toggle-slider {
	transform: translateX(28px);
	background: var(--card-bg);
}

.theme-toggle-slider i {
	font-size: 12px;
	color: var(--violet1);
}

/* Marque */
.brand-title {
	font-family: "Times New Roman", Georgia, serif;
	letter-spacing: .25rem;
	font-weight: 700;
	color: var(--text-primary);
	transition: color 0.3s ease;
}

.mini-brand {
	font-family: "Times New Roman", Georgia, serif;
	letter-spacing: .5rem;
	color: var(--text-muted);
	transition: color 0.3s ease;
}

/* Carte 2 colonnes arrondie */
.auth-wrapper {
	max-width: 1100px;
	margin: 0 auto;
	background: var(--card-bg);
	border-radius: 28px;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1fr 1fr;
	border: 1px solid var(--border-light);
	transition: background 0.3s ease, border 0.3s ease;
}

.auth-right {
	position: relative;
	min-height: 560px;
	background: #000;
}

.auth-hero {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	filter: saturate(1.05) contrast(1.05);
}

/* Inputs avec icône */
.input-with-icon {
	position: relative;
}

.input-with-icon > i {
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--input);
	pointer-events: none;
	transition: color 0.3s ease;
}

.input-with-icon .form-control {
	padding-left: 42px;
	height: 48px;
	border-radius: 999px;
	border: 1.5px solid var(--border-color);
	box-shadow: none;
	background: var(--input-bg);
	color: var(--text-primary);
	transition: all 0.3s ease;
}

.input-with-icon .form-control:focus {
	border-color: var(--violet1);
}

.input-with-icon .form-control::placeholder {
	color: var(--text-secondary);
}

/* Bouton œil */
.btn-eye {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	border: 0;
	background: transparent;
	padding: 6px 8px;
	color: var(--eye-btn-color);
	transition: color 0.3s ease;
}

.btn-eye:hover {
	color: var(--eye-btn-hover);
}

/* Boutons */
.btn-gradient {
	height: 50px;
	border-radius: 999px;
	color: #fff;
	background: linear-gradient(90deg, var(--violet1), var(--violet2));
	border: none;
	font-weight: 600;
}

.btn-soft {
	height: 48px;
	border-radius: 999px;
	background: var(--btn-soft-bg);
	border: 1px solid var(--btn-soft-border);
	color: var(--btn-soft-text);
	font-weight: 600;
	transition: all 0.3s ease;
}

/* Séparateur */
.sep {
	position: relative;
	text-align: center;
	color: var(--text-secondary);
	transition: color 0.3s ease;
}

.sep::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	height: 1px;
	background: var(--separator-line);
	transform: translateY(-50%);
	transition: background 0.3s ease;
}

.sep > span {
	position: relative;
	padding: 0 .75rem;
	background: var(--card-bg);
	transition: background 0.3s ease;
}

/* Barre force MDP */
.strength {
	height: 6px;
	background: var(--strength-bg);
	border-radius: 999px;
	overflow: hidden;
	transition: background 0.3s ease;
}

.strength > div {
	height: 100%;
	width: 0%;
	transition: width .25s ease;
}

.strength .weak {
	background: #ef4444;
}

.strength .mid {
	background: #f59e0b;
}

.strength .good {
	background: #3b82f6;
}

.strength .strong {
	background: #10b981;
}

@media (max-width: 991.98px) {
	.auth-wrapper {
		grid-template-columns: 1fr;
	}
	.auth-right {
		display: none;
	}
}

/* Bootstrap text-muted support */
.text-muted {
	--bs-text-opacity: 1;
	color: var(--bs-secondary-color) !important;
}

.reg-step .input-with-icon i {
	position: absolute;
	left: 10px;
	top: 25px;
	transform: translateY(-50%);
	color: var(--input);
	pointer-events: none;
	transition: color 0.3s ease;
}

.input-with-icon .form-control {
	padding-left: 2.2rem;
}

.reg-step i.fa-regular.fa-eye {
	position: relative;
	transform: none;
	left: 0;
	top: 0;
}

#guestZipGeo {
	cursor: pointer;
}

#guestZipGeo[aria-disabled="true"] {
	pointer-events: none;
	opacity: .6;
}

/*
guest modal
 */

/* Modern Guest Modal */
.modern-guest-modal {
	border: none;
	border-radius: 24px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
	overflow: hidden;
	background: var(--modal-bg);
	color: var(--text-primary);
}

[data-theme="dark"] .modern-guest-modal {
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

/* Header */
.modern-guest-modal .modal-header {
	background: var(--modal-header-bg);
	color: white;
	padding: 2rem;
	border: none;
}

.modern-guest-modal .header-content {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	flex: 1;
}

.modern-guest-modal .icon-wrapper {
	width: 56px;
	height: 56px;
	background: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	flex-shrink: 0;
}

.modern-guest-modal .header-text {
	flex: 1;
}

.modern-guest-modal .modal-title {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0;
	color: white;
}

.modern-guest-modal .modal-subtitle {
	margin: 0.25rem 0 0;
	font-size: 0.9rem;
	opacity: 0.9;
	color: rgba(255, 255, 255, 0.95);
}

.modern-guest-modal .btn-close {
	filter: brightness(0) invert(1);
	opacity: 0.8;
}

.modern-guest-modal .btn-close:hover {
	opacity: 1;
}

/* Body */
.modern-guest-modal .modal-body {
	padding: 2rem;
	background: var(--modal-body-bg);
}

.modern-guest-modal .content-grid {
	display: grid;
	grid-template-columns: 1fr 280px;
	gap: 2rem;
	align-items: start;
}

/* Form Section */
.modern-guest-modal .form-section {
	background: var(--form-section-bg);
	padding: 1.75rem;
	border-radius: 16px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
	border: 1px solid var(--border-light);
}

[data-theme="dark"] .modern-guest-modal .form-section {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.modern-guest-modal .form-group {
	margin-bottom: 1.5rem;
}

.modern-guest-modal .form-group:last-child {
	margin-bottom: 0;
}

.modern-guest-modal .form-label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 600;
	color: var(--label-color);
	margin-bottom: 0.5rem;
	font-size: 0.95rem;
}

.modern-guest-modal .label-icon {
	color: #667eea;
	font-size: 0.9rem;
}

[data-theme="dark"] .modern-guest-modal .label-icon {
	color: #8b5cf6;
}

.modern-guest-modal .optional-badge {
	margin-left: 0.5rem;
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--optional-badge-color);
	background: var(--optional-badge-bg);
	padding: 0.125rem 0.5rem;
	border-radius: 6px;
}

.modern-guest-modal .modern-input {
	border: 2px solid var(--input-border);
	border-radius: 12px;
	padding: 0.75rem 1rem;
	font-size: 0.95rem;
	transition: all 0.2s ease;
	background: var(--input-bg);
	color: var(--text-primary);
}

.modern-guest-modal .modern-input:focus {
	border-color: var(--input-focus-border);
	box-shadow: 0 0 0 4px var(--input-focus-shadow);
	outline: none;
}

.modern-guest-modal .modern-input::placeholder {
	color: var(--text-secondary);
}

.modern-guest-modal .form-hint {
	font-size: 0.8rem;
	color: var(--hint-color);
	margin-top: 0.375rem;
}

/* Gender Grid */
.modern-guest-modal .gender-grid {
	display: flex;
	justify-items: center;
	gap: 0.75rem;
	align-items: center;
	justify-content: center;
}

.modern-guest-modal .gender-card {
	background: var(--gender-card-bg);
	border: 2px solid var(--gender-card-border);
	border-radius: 12px;
	padding: 1rem 0.5rem;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	text-align: center;
}

.modern-guest-modal .gender-card:hover {
	border-color: var(--gender-card-hover-border);
	transform: translateY(-2px);
}

.modern-guest-modal .btn-check:checked + .gender-card {
	border-color: var(--gender-color, #667eea);
	background: color-mix(in srgb, var(--gender-color, #667eea) 6%, var(--gender-card-bg));
	box-shadow: 0 4px 12px color-mix(in srgb, var(--gender-color, #667eea) 25%, transparent);
}

[data-theme="dark"] .modern-guest-modal .btn-check:checked + .gender-card {
	border-color: var(--gender-color, #8b5cf6);
	background: color-mix(in srgb, var(--gender-color, #8b5cf6) 15%, var(--gender-card-bg));
}

.modern-guest-modal .gender-icon {
	width: 48px;
	height: 48px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.25rem;
	transition: all 0.2s ease;
	/* Use DB color directly */
	background: var(--gender-color, #667eea);
	color: #fff;
}

[data-theme="dark"] .modern-guest-modal .gender-icon {
	background: var(--gender-color, #8b5cf6);
}

.modern-guest-modal .btn-check:checked + .gender-card .gender-icon {
	transform: scale(1.1);
}

.modern-guest-modal .gender-label {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--label-color);
}

/* Avatar Section */
.modern-guest-modal .avatar-section {
	position: sticky;
	top: 1rem;
}

.modern-guest-modal .avatar-container {
	background: var(--form-section-bg);
	padding: 1.75rem;
	border-radius: 16px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
	border: 1px solid var(--border-light);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}

[data-theme="dark"] .modern-guest-modal .avatar-container {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.modern-guest-modal .avatar-wrapper {
	position: relative;
}

.modern-guest-modal .avatar-image {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	object-fit: cover;
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
	border: 4px solid var(--form-section-bg);
}

[data-theme="dark"] .modern-guest-modal .avatar-image {
	background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
	box-shadow: 0 8px 24px rgba(139, 92, 246, 0.4);
}

.modern-guest-modal .avatar-status {
	position: absolute;
	bottom: 4px;
	right: 4px;
	width: 32px;
	height: 32px;
	background: #10b981;
	border: 3px solid var(--form-section-bg);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 0.875rem;
}

.modern-guest-modal .btn-suggest {
	width: 100%;
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: white;
	border: none;
	border-radius: 12px;
	padding: 0.75rem 1.25rem;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	cursor: pointer;
	transition: all 0.2s ease;
}

[data-theme="dark"] .modern-guest-modal .btn-suggest {
	background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
}

.modern-guest-modal .btn-suggest:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 16px rgba(102, 126, 234, 0.3);
}

[data-theme="dark"] .modern-guest-modal .btn-suggest:hover {
	box-shadow: 0 8px 16px rgba(139, 92, 246, 0.4);
}

.modern-guest-modal .avatar-hint {
	font-size: 0.8rem;
	color: var(--hint-color);
	text-align: center;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 0.375rem;
}

.modern-guest-modal .avatar-hint i {
	color: #667eea;
}

[data-theme="dark"] .modern-guest-modal .avatar-hint i {
	color: #8b5cf6;
}

/* Footer */
.modern-guest-modal .modal-footer {
	background: var(--form-section-bg);
	padding: 1.5rem 2rem;
	border: none;
	border-top: 1px solid var(--footer-border);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.modern-guest-modal .btn-link {
	color: var(--btn-link-color);
	text-decoration: none;
	font-weight: 500;
	padding: 0.625rem 1.25rem;
	transition: color 0.3s ease;
}

.modern-guest-modal .btn-link:hover {
	color: var(--btn-link-hover);
}

.modern-guest-modal .btn-submit {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: white;
	border: none;
	border-radius: 12px;
	padding: 0.75rem 2rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

[data-theme="dark"] .modern-guest-modal .btn-submit {
	background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
}

.modern-guest-modal .btn-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 16px rgba(102, 126, 234, 0.3);
}

[data-theme="dark"] .modern-guest-modal .btn-submit:hover {
	box-shadow: 0 8px 16px rgba(139, 92, 246, 0.4);
}

.modern-guest-modal .btn-content {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/* Responsive */
@media (max-width: 991px) {
	.modern-guest-modal .content-grid {
		grid-template-columns: 1fr;
	}

	.modern-guest-modal .avatar-section {
		order: -1;
	}

	.modern-guest-modal .avatar-container {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.modern-guest-modal .avatar-image {
		width: 100px;
		height: 100px;
	}

	.modern-guest-modal .btn-suggest {
		width: auto;
		flex: 1;
		margin-left: 1rem;
	}

	.modern-guest-modal .avatar-hint {
		display: none;
	}
}

@media (max-width: 576px) {
	.modern-guest-modal .modal-header {
		padding: 1.5rem;
	}

	.modern-guest-modal .modal-body {
		padding: 1.5rem;
	}

	.modern-guest-modal .icon-wrapper {
		width: 48px;
		height: 48px;
		font-size: 1.25rem;
	}

	.modern-guest-modal .modal-title {
		font-size: 1.25rem;
	}

	.modern-guest-modal .gender-grid {
		grid-template-columns: repeat(4, 1fr);
	}

	.modern-guest-modal .avatar-container {
		flex-direction: column;
	}

	.modern-guest-modal .btn-suggest {
		width: 100%;
		margin-left: 0;
	}
}