/*
 * @author: Mathieu MARI <contact@mathieumari.com>
 * @date:   01-04-2024 16:57:58
 * @lastModifiedBy:   Mathieu MARI <contact@mathieumari.com>
 * @lastModifiedTime: 2026-06-25 12:00:00
 */

@charset "UTF-8";

@media all {
	:root {
		--iti-surface: var(--mc-surface, var(--surface-elevated, var(--bs-body-bg, #fff)));
		--iti-border: var(--mc-border, var(--divider-color, var(--bs-border-color, #dfe5ef)));
		--iti-text: var(--primary-color, var(--bs-body-color, #111c2d));
		--iti-muted: var(--text-color, var(--bs-secondary-color, #5a6a85));
		--iti-hover: color-mix(in srgb, var(--brand-primary, var(--bs-primary, #00a1ff)) 12%, var(--iti-surface));
		--iti-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
		--iti-radius: 10px;
	}

	html[data-bs-theme="dark"],
	.iti[data-iti-theme="dark"],
	.iti--container[data-iti-theme="dark"],
	[data-iti-theme-scope="dark"] .iti,
	[data-iti-theme-scope="dark"] .iti--container {
		--iti-surface: #161d21;
		--iti-border: rgba(255, 255, 255, 0.1);
		--iti-text: #e8edf2;
		--iti-muted: #94a3b8;
		--iti-hover: rgba(255, 255, 255, 0.09);
		--iti-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
	}

	html[data-bs-theme="dark"] {
		--iti-hover: color-mix(in srgb, var(--brand-primary, var(--bs-primary, #00a1ff)) 16%, var(--iti-surface));
	}

	.iti.iti--allow-dropdown.iti--show-flags.iti--inline-dropdown {
		display: block;
	}

	.iti--container {
		z-index: 1065;
	}

	/* ------------------------------------------------ Fallback — navigateurs sans appearance:base-select */
	@supports not (appearance: base-select) {
		.iti__dropdown-content {
			background: var(--iti-surface) !important;
			border: 1px solid var(--iti-border) !important;
			border-radius: var(--iti-radius) !important;
			box-shadow: var(--iti-shadow) !important;
			overflow: hidden;
			font-family: var(--default-font, var(--bs-body-font-family, inherit));
			font-size: 14px;
		}

		.iti--inline-dropdown .iti__dropdown-content {
			margin-top: 4px;
		}

		.iti__search-input {
			background: var(--iti-surface) !important;
			color: var(--iti-text) !important;
			border: 0 !important;
			border-bottom: 1px solid var(--iti-border) !important;
			border-radius: 0 !important;
			padding: 10px 14px;
			font-size: 14px;
		}

		.iti__search-input::placeholder {
			color: var(--mm-placeholder-color, color-mix(in srgb, var(--iti-text) 40%, transparent));
			opacity: 1;
		}

		.iti__search-input:focus {
			outline: none;
			box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--brand-primary, var(--bs-primary, #00a1ff)) 35%, transparent);
		}

		.iti__search-input + .iti__country-list {
			border-top: 1px solid var(--iti-border) !important;
		}

		.iti__country-list {
			background: var(--iti-surface) !important;
			scrollbar-width: thin;
			scrollbar-color: var(--mc-scroll-thumb, rgba(15, 23, 42, 0.2)) transparent;
		}

		.iti--inline-dropdown .iti__country-list {
			max-height: 220px;
		}

		.iti__country {
			color: var(--iti-text) !important;
			background: transparent !important;
			padding: 10px 14px;
			transition: background-color 0.15s ease;
		}

		.iti__country-name {
			color: var(--iti-text) !important;
		}

		.iti__dial-code {
			color: var(--iti-muted) !important;
		}

		.iti__country.iti__highlight,
		.iti__country:hover {
			background: var(--iti-hover) !important;
		}

		.iti__divider {
			border-bottom-color: var(--iti-border) !important;
		}

		.iti__arrow {
			border-top-color: var(--iti-muted);
		}

		.iti__arrow--up {
			border-top: none;
			border-bottom-color: var(--iti-muted);
		}

		.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
			background: var(--iti-hover);
		}

		html[data-bs-theme="dark"] .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag,
		.iti[data-iti-theme="dark"] .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag,
		[data-iti-theme-scope="dark"] .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
			background: rgba(255, 255, 255, 0.06);
		}
	}

	/* ------------------------------------------------ Best design 2026 — aligné sur maestra.css ::picker(select) */
	@supports (appearance: base-select) {
		.iti__dropdown-content {
			border: none !important;
			border-radius: 14px !important;
			padding: 6px;
			margin-top: 6px;
			background: var(--iti-surface) !important;
			box-shadow:
				0 0 0 1px rgba(15, 23, 42, 0.06),
				0 14px 36px rgba(15, 23, 42, 0.16) !important;
			overflow: hidden;
			font-family: var(--default-font, var(--bs-body-font-family, inherit));
			font-size: 14px;
			opacity: 1;
			transform: translateY(0);
			transition: opacity 0.18s ease, transform 0.18s ease;
		}

		@starting-style {
			.iti__dropdown-content {
				opacity: 0;
				transform: translateY(-6px);
			}
		}

		.iti__search-input {
			background: transparent !important;
			color: var(--iti-text) !important;
			border: 0 !important;
			border-bottom: 1px solid var(--iti-border) !important;
			border-radius: 9px 9px 0 0 !important;
			padding: 9px 12px;
			font-size: 14px;
			line-height: 1.3;
		}

		.iti__search-input::placeholder {
			color: var(--mm-placeholder-color, color-mix(in srgb, var(--iti-text) 40%, transparent));
			opacity: 1;
		}

		.iti__search-input:focus {
			outline: none;
			box-shadow: none;
		}

		.iti__search-input + .iti__country-list {
			border-top: none !important;
		}

		.iti__country-list {
			background: transparent !important;
			padding: 0 2px 2px;
			scrollbar-width: thin;
			scrollbar-color: var(--mc-scroll-thumb, rgba(15, 23, 42, 0.2)) transparent;
		}

		.iti--inline-dropdown .iti__country-list {
			max-height: 240px;
		}

		.iti__country {
			display: flex;
			align-items: center;
			gap: 10px;
			padding: 9px 12px !important;
			border-radius: 9px;
			font-size: 14px;
			line-height: 1.3;
			color: var(--iti-text) !important;
			background: transparent !important;
			cursor: pointer;
			transition: background-color 0.12s ease, color 0.12s ease;
		}

		.iti__country-name {
			color: inherit !important;
		}

		.iti__dial-code {
			margin-left: auto;
			color: var(--iti-muted) !important;
		}

		.iti__country.iti__highlight,
		.iti__country:hover {
			background: color-mix(in srgb, var(--brand-primary, #00a1ff) 12%, transparent) !important;
			outline: none;
		}

		.iti__country.iti__active,
		.iti__country.iti__highlight.iti__active {
			font-weight: 600;
		}

		.iti__divider {
			margin: 4px 8px;
			padding-bottom: 0;
			border-bottom-color: var(--iti-border) !important;
		}

		.iti__arrow {
			border-top-color: #94a3b8;
			transition: transform 0.2s ease;
		}

		.iti__arrow--up {
			border-top: none;
			border-bottom-color: #94a3b8;
			transform: rotate(180deg);
		}

		.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
			background: color-mix(in srgb, var(--brand-primary, #00a1ff) 12%, transparent);
		}

		html[data-bs-theme="dark"] .iti__dropdown-content,
		.iti[data-iti-theme="dark"] .iti__dropdown-content,
		.iti--container[data-iti-theme="dark"] .iti__dropdown-content,
		[data-iti-theme-scope="dark"] .iti__dropdown-content {
			background: var(--iti-surface) !important;
			box-shadow:
				0 0 0 1px rgba(255, 255, 255, 0.08),
				0 16px 42px rgba(0, 0, 0, 0.48) !important;
		}

		html[data-bs-theme="dark"] .iti__country.iti__highlight,
		html[data-bs-theme="dark"] .iti__country:hover,
		.iti[data-iti-theme="dark"] .iti__country.iti__highlight,
		.iti[data-iti-theme="dark"] .iti__country:hover,
		.iti--container[data-iti-theme="dark"] .iti__country.iti__highlight,
		.iti--container[data-iti-theme="dark"] .iti__country:hover,
		[data-iti-theme-scope="dark"] .iti__country.iti__highlight,
		[data-iti-theme-scope="dark"] .iti__country:hover {
			background: rgba(255, 255, 255, 0.09) !important;
		}

		html[data-bs-theme="dark"] .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag,
		.iti[data-iti-theme="dark"] .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag,
		[data-iti-theme-scope="dark"] .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
			background: rgba(255, 255, 255, 0.09);
		}
	}
}