/* ================================================================
   Notete — Mon-compte Contacts (scoped to .page-account-contacts)
   Viewport-locked: listing fills shell, pagination at bottom, table scrolls
   ================================================================ */

.page-account-dashboard.page-account-contacts {
	height: 100vh;
	overflow: hidden;
}

.page-account-dashboard.page-account-contacts .mc-dash {
	height: 100%;
	min-height: 0;
	overflow: hidden;
}

.page-account-dashboard.page-account-contacts .mc-dash__shell {
	flex: 1;
	min-height: 0;
	overflow: hidden;
}

.page-account-dashboard.page-account-contacts .mc-dash__header {
	flex-shrink: 0;
}

.page-account-dashboard.page-account-contacts .mc-dash__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
	overflow: hidden;
}

.page-account-contacts .mc-dash__contacts {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
	gap: 24px;
}

.page-account-contacts .mc-dash__contacts-head {
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	gap: 6px;
}

.page-account-contacts .mc-dash__contacts-page {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
}

.page-account-contacts .mc-dash__contacts-toolbar {
	display: flex;
	flex-wrap: wrap;
	flex-shrink: 0;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 0;
	margin-bottom: 16px;
	background: transparent;
	border: none;
	border-radius: 0;
	position: relative;
	z-index: 30;
}

.page-account-contacts .mc-dash__contacts-toolbar-start {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 12px;
	flex: 1;
	min-width: 0;
}

.page-account-contacts .mc-dash__contacts-toolbar-end {
	flex-shrink: 0;
	margin-left: auto;
}

/* ----------------------------------------------------------------
   Mobile : la barre de filtres devient un bouton « Rechercher »
   qui ouvre une feuille (search sheet) glissant depuis le haut.
   Desktop : éléments masqués, toolbar inchangée.
   ---------------------------------------------------------------- */
.page-account-contacts .mc-dash__contacts-search-trigger,
.page-account-contacts .mc-dash__contacts-search-sheet-head,
.page-account-contacts .mc-dash__contacts-search-scrim {
	display: none;
}

.page-account-contacts .mc-dash__contacts-search-trigger {
	align-items: center;
	gap: 10px;
	min-width: 0;
	height: 44px;
	padding: 0 18px;
	border: 1px solid var(--mc-border, #dfe5ef);
	border-radius: 999px;
	background: var(--mc-surface, #fff);
	color: var(--text-color);
	font-family: var(--default-font);
	font-size: 15px;
	font-weight: 500;
	white-space: nowrap;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: border-color .15s ease, color .15s ease, box-shadow .15s ease, background .15s ease;
}

.page-account-contacts .mc-dash__contacts-search-trigger svg {
	flex-shrink: 0;
	color: var(--brand-primary);
}

.page-account-contacts .mc-dash__contacts-search-trigger:hover,
.page-account-contacts .mc-dash__contacts-search-trigger:focus-visible {
	border-color: var(--brand-primary);
	color: var(--primary-color);
	box-shadow: 0 2px 12px rgba(var(--brand-primary-rgb), .16);
	outline: none;
}

.page-account-contacts .mc-dash__contacts-toolbar-search {
	flex: 0 0 280px;
	width: 280px;
	max-width: 280px;
	min-width: 0;
}

.page-account-contacts .mc-dash__contacts-search-wrap {
	position: relative;
}

.page-account-contacts .mc-dash__contacts-search-input {
	padding-left: 40px;
	height: 44px;
	border-radius: 8px;
	border: 1px solid var(--mc-border, #dfe5ef);
	font-family: var(--default-font);
}

.page-account-contacts .mc-dash__contacts-search-input:focus {
	border-color: var(--brand-primary);
	box-shadow: 0 0 0 0.2rem rgba(var(--brand-primary-rgb), 0.15);
}

.page-account-contacts .mc-dash__contacts-search-icon {
	position: absolute;
	top: 50%;
	left: 14px;
	transform: translateY(-50%);
	color: var(--text-color);
	pointer-events: none;
}

.page-account-contacts .mc-dash__contacts-source-filter,
.page-account-contacts .mc-dash__toolbar-select {
	flex: 0 0 158px;
	width: 158px;
	max-width: 158px;
	min-width: 158px;
	height: 44px;
	min-height: 44px;
	padding: 0 28px 0 10px;
	line-height: 44px;
	border-radius: 8px;
	border: 1px solid var(--mc-border, #dfe5ef);
	background: var(--mc-surface, #fff);
	font-family: var(--default-font);
	font-size: 0.875rem;
	box-shadow: none;
}

.page-account-contacts .mc-dash__btn.mc-dash__toolbar-filters-btn,
.page-account-contacts .mc-dash__btn.mc-dash__toolbar-letters-btn {
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	min-height: 44px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.page-account-contacts .mc-dash__btn.mc-dash__toolbar-filters-btn > svg,
.page-account-contacts .mc-dash__btn.mc-dash__toolbar-letters-btn > svg {
	width: 26px;
	height: 26px;
	flex-shrink: 0;
}

.page-account-contacts .mc-dash__contacts-source-filter:focus,
.page-account-contacts .mc-dash__toolbar-select:focus {
	border-color: var(--brand-primary);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-primary) 12%, transparent);
}

.page-account-contacts .contact-communication-filter-selectize + .selectize-control {
	min-width: 220px;
}

.page-account-contacts .contact-communication-filter-selectize + .selectize-control .selectize-input {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 8px 36px 8px 12px;
	border-radius: 8px;
	border: 1px solid var(--mc-border, #dfe5ef);
	background: var(--mc-surface, #fff);
	font-family: var(--default-font);
	font-size: 14px;
	box-shadow: none;
}

.page-account-contacts .contact-communication-filter-selectize + .selectize-control .selectize-input > div {
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 0;
}

.page-account-contacts .contact-communication-filter-selectize + .selectize-control .selectize-input .item {
	display: inline-flex;
	align-items: center;
	padding: 0;
	line-height: 1.2;
}

.page-account-contacts .contact-communication-filter-selectize + .selectize-control .selectize-input.focus {
	border-color: var(--brand-primary);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-primary) 12%, transparent);
}

.page-account-contacts .contact-communication-filter-selectize + .selectize-control.single .selectize-input:after {
	right: 12px;
}

.selectize-dropdown.contacts-communication-filter-dropdown {
	z-index: 1060;
	min-width: 220px;
	background: var(--mc-surface, #fff);
	border: 1px solid var(--mc-border, #dfe5ef);
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
	font-family: var(--default-font);
	font-size: 14px;
	margin-top: 4px;
}

.selectize-dropdown.contacts-communication-filter-dropdown .selectize-dropdown-content {
	background: var(--mc-surface, #fff);
	border-radius: 8px;
	overflow: hidden;
	padding: 4px 0;
}

.selectize-dropdown.contacts-communication-filter-dropdown [data-selectable].option {
	padding: 10px 14px;
	background: var(--mc-surface, #fff);
}

.selectize-dropdown.contacts-communication-filter-dropdown .option .option {
	padding: 0;
	margin: 0;
	background: transparent;
}

.selectize-dropdown.contacts-communication-filter-dropdown .contact-communication-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 500;
	color: var(--primary-color);
	white-space: nowrap;
}

.selectize-dropdown.contacts-communication-filter-dropdown .contact-communication-badge__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.selectize-dropdown.contacts-communication-filter-dropdown .contact-communication-badge__label {
	line-height: 1.2;
}

.selectize-dropdown.contacts-communication-filter-dropdown .active,
.selectize-dropdown.contacts-communication-filter-dropdown .active:not(.selected) {
	background-color: color-mix(in srgb, var(--brand-primary) 12%, #fff);
	color: var(--primary-color);
}

.selectize-dropdown.contacts-communication-filter-dropdown .selected {
	background-color: color-mix(in srgb, var(--brand-primary) 12%, #fff);
	color: var(--primary-color);
}

.page-account-contacts .mc-dash__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border: none;
	border-radius: 8px;
	font-family: var(--default-font);
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	text-decoration: none;
}

.page-account-contacts .mc-dash__btn--primary {
	background: var(--brand-primary);
	color: #fff;
}

.page-account-contacts .mc-dash__btn--primary:hover {
	background: var(--brand-primary-hover);
	color: #fff;
}

.page-account-contacts .mc-dash__btn--outline {
	background: transparent;
	border: 1px solid var(--mc-border, #dfe5ef);
	color: var(--primary-color);
}

.page-account-contacts .mc-dash__btn--outline:hover {
	background: var(--mc-surface, #fff);
	border-color: var(--brand-primary);
	color: var(--brand-primary);
}

.page-account-contacts .mc-dash__contacts-card {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
	background: var(--mc-surface, #fff);
	border: 1px solid var(--mc-border, #dfe5ef);
	border-radius: 12px;
	overflow: hidden;
	position: relative;
	z-index: 1;
}

.page-account-contacts .mc-dash__contacts-table-wrap {
	flex: 1 1 auto;
	height: 0;
	min-height: 0;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	container-type: inline-size;
}

.page-account-contacts .mc-dash__contacts-table-wrap.table-responsive {
	overflow: auto;
}

.page-account-contacts .mc-dash__contacts-table {
	--mc-contacts-col-name: var(--mc-col-name, 18rem);
	--mc-contacts-col-favorite: var(--mc-col-favorite, 5.5rem);
	--mc-contacts-col-assigned: var(--mc-col-assigned, 6rem);
	--mc-contacts-col-status: var(--mc-col-status, 9rem);
	--mc-contacts-col-email: var(--mc-col-email, 14rem);
	--mc-contacts-col-phone: var(--mc-col-phone, 12rem);
	--mc-contacts-col-whatsapp: 6rem;
	--mc-contacts-col-country: var(--mc-col-country, 7.5rem);
	--mc-contacts-col-linkedin: 7.5rem;
	--mc-contacts-col-tags: var(--mc-col-tags, 12.5rem);
	--mc-contacts-col-created: var(--mc-col-created, 8rem);
	--mc-contacts-col-apporteur: var(--mc-col-apporteur, 7.25rem);
	--mc-contacts-col-actions: var(--mc-col-actions, 7.25rem);
	table-layout: fixed;
	width: calc(
		var(--mc-contacts-col-name)
		+ var(--mc-contacts-col-favorite)
		+ var(--mc-contacts-col-assigned)
		+ var(--mc-contacts-col-status)
		+ var(--mc-contacts-col-email)
		+ var(--mc-contacts-col-phone)
		+ var(--mc-contacts-col-whatsapp)
		+ var(--mc-contacts-col-country)
		+ var(--mc-contacts-col-linkedin)
		+ var(--mc-contacts-col-tags)
		+ var(--mc-contacts-col-created)
		+ var(--mc-contacts-col-apporteur)
		+ var(--mc-contacts-col-actions)
	);
	min-width: 100%;
	font-family: var(--default-font);
	font-size: 14px;
	border-collapse: separate;
	border-spacing: 0;
}

.page-account-contacts .mc-dash__contacts-table--to-check {
	width: calc(
		var(--mc-contacts-col-name)
		+ var(--mc-contacts-col-email)
		+ var(--mc-contacts-col-phone)
		+ var(--mc-contacts-col-country)
		+ var(--mc-contacts-col-tags)
		+ var(--mc-contacts-col-status)
		+ var(--mc-contacts-col-actions)
	);
}

.page-account-contacts .mc-dash__contacts-col--name {
	width: var(--mc-contacts-col-name);
	min-width: var(--mc-contacts-col-name);
	max-width: var(--mc-contacts-col-name);
}
.page-account-contacts .mc-dash__contacts-col--favorite { width: var(--mc-contacts-col-favorite); }
.page-account-contacts .mc-dash__contacts-col--assigned { width: var(--mc-contacts-col-assigned); }
.page-account-contacts .mc-dash__contacts-col--status { width: var(--mc-contacts-col-status); }
.page-account-contacts .mc-dash__contacts-col--email { width: var(--mc-contacts-col-email); }
.page-account-contacts .mc-dash__contacts-col--phone { width: var(--mc-contacts-col-phone); }
.page-account-contacts .mc-dash__contacts-col--whatsapp { width: var(--mc-contacts-col-whatsapp); }
.page-account-contacts .mc-dash__contacts-col--country { width: var(--mc-contacts-col-country); }
.page-account-contacts .mc-dash__contacts-col--linkedin { width: var(--mc-contacts-col-linkedin); }
.page-account-contacts .mc-dash__contacts-col--tags { width: var(--mc-contacts-col-tags); }
.page-account-contacts .mc-dash__contacts-col--created { width: var(--mc-contacts-col-created); }
.page-account-contacts .mc-dash__contacts-col--apporteur { width: var(--mc-contacts-col-apporteur); }
.page-account-contacts .mc-dash__contacts-col--actions { width: var(--mc-contacts-col-actions); }

.page-account-contacts .mc-dash__contacts-table .mc-dash__contacts-col-actions {
	position: sticky;
	right: 0;
	z-index: 2;
	min-width: var(--mc-contacts-col-actions);
	width: var(--mc-contacts-col-actions);
	overflow: visible;
	background: #fff;
	border-left: 1px solid var(--mc-border, #dfe5ef);
	box-shadow: -6px 0 12px -8px rgba(15, 23, 42, 0.16);
}

.page-account-contacts .mc-dash__contacts-table .mc-dash__contacts-col-name {
	width: var(--mc-contacts-col-name);
	min-width: var(--mc-contacts-col-name);
	max-width: var(--mc-contacts-col-name);
}

.page-account-contacts .mc-dash__contacts-table .mc-dash__contacts-col-favorite {
	width: var(--mc-contacts-col-favorite);
	min-width: var(--mc-contacts-col-favorite);
}

.page-account-contacts .mc-dash__contacts-table .mc-dash__contacts-col-assigned {
	width: var(--mc-contacts-col-assigned);
	min-width: var(--mc-contacts-col-assigned);
}

.page-account-contacts .mc-dash__contacts-table .mc-dash__contacts-col-apporteur {
	width: var(--mc-contacts-col-apporteur);
	min-width: var(--mc-contacts-col-apporteur);
}

.page-account-contacts .mc-dash__contacts-table thead th.mc-dash__contacts-col-actions {
	z-index: 5;
	background: #f6f9fc;
}

.page-account-contacts .mc-dash__contacts-table.table-hover > tbody > tr:hover > td.mc-dash__contacts-col-actions {
	z-index: 3;
	background-color: #f5f8fb;
}

.page-account-contacts .mc-dash__contacts-table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: #f6f9fc;
	font-weight: 600;
	font-size: 13px;
	color: var(--primary-color);
	border-bottom: 1px solid var(--mc-border, #dfe5ef);
	white-space: nowrap;
}

.page-account-contacts .mc-dash__contacts-table tbody td {
	vertical-align: middle;
	border-bottom: 1px solid var(--mc-border, #dfe5ef);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Tags : la colonne reste à largeur fixe, le contenu peut passer à la ligne. */
.page-account-contacts .mc-dash__contacts-table tbody td.text-wrap {
	white-space: normal;
	text-overflow: clip;
	overflow: hidden;
}

.page-account-contacts .mc-dash__contacts-table tbody td:has(.contact-status-select),
.page-account-contacts .mc-dash__contacts-table tbody td:has(.mc-status-select),
.page-account-contacts .mc-dash__contacts-table tbody td.mc-dash__contacts-col-favorite,
.page-account-contacts .mc-dash__contacts-table tbody td.mc-dash__contacts-col-assigned,
.page-account-contacts .mc-dash__contacts-table tbody td.mc-dash__contacts-col-apporteur,
.page-account-contacts .mc-dash__contacts-table tbody td:has(.contact-pays-badge),
.page-account-contacts .mc-dash__contacts-table tbody td:has(.contact-geo),
.page-account-contacts .mc-dash__contacts-table tbody td.contact-whatsapp-col,
.page-account-contacts .mc-dash__contacts-table tbody td.contact-linkedin-col {
	overflow: visible;
}

.page-account-contacts .mc-dash__contacts-table tbody td:has(.contact-geo) {
	white-space: normal;
}

.page-account-contacts .mc-dash__contacts-name {
	min-width: 0;
	max-width: 100%;
}

.page-account-contacts .mc-dash__contacts-identity {
	min-width: 0;
	flex: 1;
	overflow: hidden;
}

.page-account-contacts .mc-dash__contacts-name-link,
.page-account-contacts .mc-dash__contacts-meta,
.page-account-contacts .mc-dash__contacts-created-date,
.page-account-contacts .mc-dash__contacts-created-by {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.page-account-contacts .mc-dash__contacts-table .contact-email-link,
.page-account-contacts .mc-dash__contacts-table .contact-phone-stack,
.page-account-contacts .mc-dash__contacts-table .contact-assignee,
.page-account-contacts .mc-dash__contacts-table .contact-pays-badge {
	max-width: 100%;
	min-width: 0;
}

.page-account-contacts .mc-dash__contacts-table .contact-email-link:not(.contact-email-link--empty) {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.page-account-contacts .mc-dash__contacts-table .contact-email-link .contact-email-label,
.page-account-contacts .mc-dash__contacts-table .contact-phone-stack .contact-phone-tel,
.page-account-contacts .mc-dash__contacts-table .contact-assignee__name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.contact-contacts-page .mc-dash__contacts-avatar {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--brand-primary-soft);
	color: var(--primary-color);
	font-family: var(--default-font);
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	flex-shrink: 0;
}

.page-account-contacts .mc-dash__contact-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 8px;
	background: transparent;
	color: var(--text-color);
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.page-account-contacts .contact-row-actions {
	gap: 0.25rem;
	overflow: visible;
}

.page-account-contacts .contact-row-actions .mc-dash__contact-action svg {
	display: block;
	flex-shrink: 0;
}

.page-account-contacts .mc-dash__contact-action--edit:hover {
	background: var(--brand-primary-soft);
	color: var(--brand-primary);
}

.page-account-contacts .mc-dash__contact-action--delete:hover {
	background: rgba(230, 87, 87, 0.1);
	color: var(--error-color);
}

.page-account-contacts .mc-dash__contact-action--view:hover {
	background: rgba(59, 130, 246, 0.1);
	color: var(--brand-primary);
}

.page-account-contacts .mc-dash__contact-action--note {
	position: relative;
	overflow: visible;
}

.page-account-contacts .mc-dash__contact-action--note:hover {
	background: var(--brand-primary-soft);
	color: var(--brand-primary);
}

.page-account-contacts .mc-dash__contact-action--note.is-empty {
	color: var(--text-muted, #94a3b8);
}

.page-account-contacts .mc-dash__contact-action--note.is-empty:hover {
	color: var(--brand-primary);
	opacity: 1;
}

.page-account-contacts .mc-dash__note-count {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 14px;
	height: 14px;
	padding: 0 3px;
	border-radius: 999px;
	background: var(--brand-primary);
	color: #fff;
	font-size: 9px;
	font-weight: 750;
	line-height: 1;
	font-variant-numeric: tabular-nums;
	pointer-events: none;
	box-shadow: 0 0 0 1.5px var(--mc-surface, #fff);
}

.page-account-contacts .mc-dash__note-count.is-zero {
	display: none;
}

.page-account-contacts .mc-dash__contact-action--tier:hover {
	background: rgba(100, 116, 139, 0.12);
	color: var(--text-color);
}

.page-account-contacts .mc-dash__contact-action--tier.is-disabled {
	color: var(--text-muted, #94a3b8);
	opacity: 0.45;
	cursor: default;
}

.page-account-contacts .mc-dash__contact-action--tier.is-disabled:hover {
	background: transparent;
	color: var(--text-muted, #94a3b8);
}

.page-account-contacts .mc-dash__contact-action--more {
	color: var(--text-muted, #94a3b8);
	box-shadow: none;
}

.page-account-contacts .mc-dash__contact-action--more:hover,
.page-account-contacts .contact-row-actions-trigger.is-open {
	background: color-mix(in srgb, var(--primary-color, #111c2d) 5%, transparent);
	color: var(--text-color, #5a6a85);
}

.page-account-contacts .mc-dash__contact-action--more:focus-visible {
	outline: 2px solid color-mix(in srgb, var(--brand-primary, #00a1ff) 32%, transparent);
	outline-offset: 1px;
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contact-action--more:hover,
html[data-bs-theme="dark"] .page-account-contacts .contact-row-actions-trigger.is-open {
	background: rgba(255, 255, 255, 0.06);
	color: var(--primary-color);
}

.page-account-contacts .mc-dash__contacts-pagination {
	flex-shrink: 0;
	margin-top: auto;
	padding: 14px 20px;
	border-top: 1px solid var(--mc-border, #dfe5ef);
}

/* ================================================================
   Pagination component (.mm-pager) — design 2026
   Shared by the contacts list.
   Layout: info (left) · page jump (center) · nav controls (right)
   ================================================================ */
.mm-pager {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
	font-family: var(--default-font);
}

.mm-pager--single {
	display: flex;
	justify-content: flex-start;
}

.mm-pager__info {
	justify-self: start;
	font-size: 13px;
	color: var(--text-color);
	white-space: nowrap;
}

.mm-pager__info strong {
	font-weight: 600;
	color: var(--primary-color);
}

.mm-pager__jump {
	justify-self: center;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--text-color);
	white-space: nowrap;
}

.mm-pager__jump-label {
	margin: 0;
	font-weight: 500;
}

.mm-pager__nav {
	justify-self: end;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.mm-pager__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 11px;
	border-radius: 9px;
	border: 1px solid var(--mc-border, #dfe5ef);
	background: var(--mc-surface, #fff);
	color: var(--primary-color);
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease,
		transform 0.08s ease, box-shadow 0.15s ease;
}

.mm-pager__btn--icon {
	padding: 0;
	color: var(--text-color);
}

.mm-pager__btn--page:not(.is-active) {
	color: var(--text-color);
	font-weight: 500;
}

.mm-pager__btn:hover:not(.is-active):not(.is-disabled) {
	border-color: var(--brand-primary);
	color: var(--brand-primary);
	background: color-mix(in srgb, var(--brand-primary) 8%, var(--mc-surface, #fff));
}

.mm-pager__btn--page:not(.is-active):hover {
	box-shadow: 0 2px 10px rgba(var(--brand-primary-rgb, 0, 161, 255), 0.14);
}

.mm-pager__btn--icon:hover:not(.is-disabled) {
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.mm-pager__btn:active:not(.is-active):not(.is-disabled) {
	transform: translateY(1px);
	box-shadow: none;
}

.mm-pager__btn--page.is-active {
	background: var(--brand-primary);
	border-color: var(--brand-primary);
	color: #fff;
	font-weight: 700;
	box-shadow: 0 4px 14px rgba(var(--brand-primary-rgb, 0, 161, 255), 0.32);
	cursor: default;
	pointer-events: none;
}

.mm-pager__btn.is-disabled {
	color: var(--mc-sidebar-muted, #9aa6b8);
	background: transparent;
	opacity: 0.55;
	cursor: not-allowed;
	pointer-events: none;
	box-shadow: none;
}

@media (max-width: 860px) {
	.mm-pager {
		grid-template-columns: 1fr;
		justify-items: center;
		gap: 12px;
	}

	.mm-pager__info,
	.mm-pager__jump,
	.mm-pager__nav {
		justify-self: center;
	}

	.mm-pager__nav {
		flex-wrap: wrap;
		justify-content: center;
	}
}

/* Phones — 2 lignes : « Affichage … » puis précédent / suivant.
   Dans .mm-pager__nav l'ordre est toujours : première · précédente · [numéros] · suivante · dernière. */
@media (max-width: 575.98px) {
	.mm-pager {
		grid-template-columns: 1fr;
		justify-items: center;
		gap: 10px;
	}

	.mm-pager__jump {
		display: none;
	}

	.mm-pager__info {
		justify-self: center;
		text-align: center;
	}

	.mm-pager__nav {
		justify-self: center;
		flex-wrap: nowrap;
		justify-content: center;
		gap: 14px;
	}

	.mm-pager__nav .mm-pager__btn--page,
	.mm-pager__nav .mm-pager__btn--icon:first-child,
	.mm-pager__nav .mm-pager__btn--icon:last-child {
		display: none;
	}

	.mm-pager__nav .mm-pager__btn--icon {
		min-width: 44px;
		height: 40px;
	}
}

.page-account-contacts .mc-dash__contacts-table-wrap:has(.mc-dash__list-empty-row) {
	display: flex;
	flex-direction: column;
}

.page-account-contacts .mc-dash__contacts-table-wrap:has(.mc-dash__list-empty-row) > .table {
	width: 100%;
	flex: 1 1 auto;
	height: 100%;
	margin-bottom: 0;
}

.page-account-contacts .mc-dash__contacts-table-wrap:has(.mc-dash__list-empty-row) > .table > tbody {
	height: 100%;
}

.page-account-contacts .mc-dash__contacts-table-wrap:has(.mc-dash__list-empty-row) > .table > tbody > tr.mc-dash__list-empty-row {
	height: 100%;
}

.page-account-contacts .mc-dash__contacts-table-wrap:has(.mc-dash__list-empty-row) > .table > tbody > tr.mc-dash__list-empty-row > td {
	height: 100%;
	padding: 0;
	border-bottom: none;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
	overflow: visible;
	text-overflow: unset;
	white-space: normal;
}

.page-account-contacts .mc-dash__contacts-table-wrap:has(.mc-dash__list-empty-row) > .table > tbody > tr.mc-dash__list-empty-row > td:focus-visible {
	outline: 2px solid var(--brand-primary);
	outline-offset: -4px;
}

.page-account-contacts .mc-dash__contacts-table.table-hover > tbody > tr.mc-dash__list-empty-row:hover > td {
	--bs-table-color-state: var(--bs-table-color);
	--bs-table-bg-state: transparent;
}

.page-account-contacts .mc-dash__contacts-table-wrap:has(.mc-dash__list-empty-row) > .table > tbody > tr.mc-dash__list-empty-row:hover .mc-dash__list-empty {
	background: color-mix(in srgb, var(--brand-primary) 5%, transparent);
}

.page-account-contacts .mc-dash__list-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: sticky;
	left: 0;
	width: 100cqw;
	max-width: 100cqw;
	height: 100%;
	min-height: 100%;
	padding: 2.5rem 1.5rem;
	box-sizing: border-box;
	color: var(--text-color);
	transition: background-color 0.15s ease;
}

.page-account-contacts .mc-dash__list-empty:focus-visible {
	outline: none;
}

.page-account-contacts .mc-dash__list-empty__cta {
	pointer-events: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.page-account-contacts .mc-dash__list-empty__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 5rem;
	height: 5rem;
	border-radius: 50%;
	background: var(--brand-primary-soft, rgba(59, 130, 246, 0.1));
	color: var(--brand-primary);
	margin-bottom: 1.25rem;
}

.page-account-contacts .mc-dash__list-empty__title {
	margin: 0 0 0.5rem;
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--primary-color);
}

.page-account-contacts .mc-dash__list-empty__text {
	margin: 0 0 1.5rem;
	max-width: 22.5rem;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--text-color);
	opacity: 0.72;
}

.page-account-contacts .modal .btn-primary {
	background: var(--brand-primary);
	border-color: var(--brand-primary);
}

.page-account-contacts .modal .btn-primary:hover {
	background: var(--brand-primary-hover);
	border-color: var(--brand-primary-hover);
}

/* La pilule de statut (colonne Statut des listes contacts et tiers) est un
   composant du plugin contact : voir « Statut (contacts + tiers) » dans
   plugins/contact/css/contact-list_inline.css. */

.page-account-contacts .contact-communication-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 500;
	color: var(--primary-color);
	white-space: nowrap;
}

.page-account-contacts .contact-communication-badge__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.page-account-contacts .contact-communication-badge__label {
	line-height: 1.2;
}

/* Phone cell + déclencheur WhatsApp : déplacé dans plugins/contact/css/phone_cell_inline.css */

/* WhatsApp active toggle — custom pill switch (listings) */
.contact-contacts-page .contact-whatsapp-col,
.mc-dash__contacts-page .contact-whatsapp-col {
	text-align: center;
	vertical-align: middle;
}

.contact-whatsapp-active-switch {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 22px;
	margin: 0;
	cursor: pointer;
	user-select: none;
	vertical-align: middle;
}

.contact-whatsapp-active-switch.is-disabled {
	cursor: not-allowed;
	opacity: 0.45;
}

.contact-whatsapp-active-switch__input {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.contact-whatsapp-active-switch__input:disabled {
	cursor: not-allowed;
}

.contact-whatsapp-active-switch__track {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: 38px;
	height: 22px;
	border-radius: 999px;
	background: #e2e8f0;
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
	transition: background-color 0.22s ease, box-shadow 0.22s ease;
}

.contact-whatsapp-active-switch__thumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.14);
	transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.contact-whatsapp-active-switch__input:checked + .contact-whatsapp-active-switch__track {
	background: var(--brand-primary, #00a1ff);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
}

.contact-whatsapp-active-switch__input:checked + .contact-whatsapp-active-switch__track .contact-whatsapp-active-switch__thumb {
	transform: translateX(16px);
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.16);
}

.contact-whatsapp-active-switch:not(.is-disabled):hover .contact-whatsapp-active-switch__track {
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.1), 0 0 0 3px rgba(var(--brand-primary-rgb, 0, 161, 255), 0.14);
}

.contact-whatsapp-active-switch__input:focus-visible + .contact-whatsapp-active-switch__track {
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08), 0 0 0 3px rgba(var(--brand-primary-rgb, 0, 161, 255), 0.28);
}

.contact-whatsapp-active-switch__input:disabled + .contact-whatsapp-active-switch__track {
	background: #f1f5f9;
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.04);
}

.contact-whatsapp-active-switch__input:disabled + .contact-whatsapp-active-switch__track .contact-whatsapp-active-switch__thumb {
	background: #f8fafc;
}

/* Compact variant — email modal toggles, inline forms */
.contact-whatsapp-active-switch--sm {
	width: 32px;
	height: 18px;
}

.contact-whatsapp-active-switch--sm .contact-whatsapp-active-switch__track {
	width: 32px;
	height: 18px;
}

.contact-whatsapp-active-switch--sm .contact-whatsapp-active-switch__thumb {
	top: 3px;
	left: 3px;
	width: 12px;
	height: 12px;
}

.contact-whatsapp-active-switch--sm .contact-whatsapp-active-switch__input:checked + .contact-whatsapp-active-switch__track .contact-whatsapp-active-switch__thumb {
	transform: translateX(14px);
}

/* ================================================================
   DARK THEME — Contacts list (data-bs-theme="dark")
   ================================================================ */
html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table {
	--bs-table-bg: transparent;
	--bs-table-color: var(--primary-color);
	--bs-table-border-color: var(--mc-border);
	--bs-table-hover-bg: rgba(255, 255, 255, 0.04);
	--bs-table-hover-color: var(--primary-color);
	color: var(--primary-color);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table thead th {
	background: #1b242a;
	color: var(--primary-color);
	border-bottom-color: var(--mc-border);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table .mc-dash__contacts-col-actions {
	background: #141a1f;
	box-shadow: -6px 0 12px -8px rgba(0, 0, 0, 0.45);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table thead th.mc-dash__contacts-col-actions {
	background: #1b242a;
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table.table-hover > tbody > tr:hover > td.mc-dash__contacts-col-actions {
	background-color: #1f2830;
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__list-empty__icon {
	background: color-mix(in srgb, var(--brand-primary) 18%, #1b242a);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__list-empty__title {
	color: var(--primary-color);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table tbody td {
	border-bottom-color: var(--mc-border);
}

/* Neutral pills (badge origine « Manuel », etc.) → chips sombres discrets.
   Les tags sont rendus par le composant .mm-tag (voir custom.css). */
html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table .badge.bg-light {
	background-color: rgba(255, 255, 255, 0.08) !important;
	color: #c8d2dc !important;
}

/* Muted text & empty "-" cells */
html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-table .text-muted {
	color: var(--mc-sidebar-muted) !important;
}

html[data-bs-theme="dark"] .contact-whatsapp-active-switch__track {
	background: rgba(255, 255, 255, 0.12);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}

html[data-bs-theme="dark"] .contact-whatsapp-active-switch__input:checked + .contact-whatsapp-active-switch__track {
	background: var(--brand-primary, #00a1ff);
}

html[data-bs-theme="dark"] .contact-whatsapp-active-switch__thumb {
	background: #f8fafc;
}

/* LinkedIn viewer modal (le cercle déclencheur vit dans le CSS du plugin contact) */

.contact-linkedin-viewer-dialog {
	max-width: min(1200px, 96vw);
	height: 85vh;
}

.contact-linkedin-viewer-dialog .modal-content {
	height: 100%;
}

.contact-linkedin-viewer-body {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	padding: 0;
}

.contact-linkedin-iframe {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 70vh;
	border: none;
	background: #fff;
}

.contact-linkedin-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	padding: 2rem;
	text-align: center;
	background: var(--bs-body-bg, #fff);
}

/* Pagination component (.mm-pager) — dark */
html[data-bs-theme="dark"] .mm-pager__btn {
	background: var(--mc-surface);
	border-color: var(--mc-border);
	color: var(--primary-color);
}

html[data-bs-theme="dark"] .mm-pager__btn--icon {
	color: var(--mc-sidebar-muted, #9aa6b8);
}

html[data-bs-theme="dark"] .mm-pager__btn--page:not(.is-active) {
	color: var(--mc-sidebar-muted, #9aa6b8);
}

html[data-bs-theme="dark"] .mm-pager__btn:hover:not(.is-active):not(.is-disabled) {
	background: color-mix(in srgb, var(--brand-primary) 16%, var(--mc-surface));
	border-color: var(--brand-primary);
	color: var(--brand-primary);
}

html[data-bs-theme="dark"] .mm-pager__btn--page:not(.is-active):hover {
	box-shadow: 0 2px 12px rgba(var(--brand-primary-rgb, 0, 161, 255), 0.22);
}

html[data-bs-theme="dark"] .mm-pager__btn--icon:hover:not(.is-disabled) {
	box-shadow: none;
}

html[data-bs-theme="dark"] .mm-pager__btn--page.is-active {
	background: var(--brand-primary);
	border-color: var(--brand-primary);
	color: #fff;
	box-shadow: 0 4px 16px rgba(var(--brand-primary-rgb, 0, 161, 255), 0.38);
}

html[data-bs-theme="dark"] .mm-pager__btn.is-disabled {
	background: transparent;
	color: var(--mc-sidebar-muted);
}

/* Communication filter (Selectize) — active option highlight */
html[data-bs-theme="dark"] .selectize-dropdown.contacts-communication-filter-dropdown .active,
html[data-bs-theme="dark"] .selectize-dropdown.contacts-communication-filter-dropdown .active:not(.selected),
html[data-bs-theme="dark"] .selectize-dropdown.contacts-communication-filter-dropdown .selected {
	background-color: color-mix(in srgb, var(--brand-primary) 12%, var(--mc-surface));
	color: var(--primary-color);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-source-filter {
	color-scheme: dark;
	background: var(--mc-surface);
	border-color: var(--mc-border);
	color: var(--primary-color);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-source-filter option {
	background-color: var(--mc-surface);
	color: var(--primary-color);
}

html[data-bs-theme="dark"] .page-account-contacts .mc-dash__contacts-source-filter:focus {
	border-color: var(--brand-primary);
}

/* ================================================================
   Mobile (≤ 991.98px) : barre de filtres -> bouton « Rechercher »
   + feuille (search sheet). Placé en fin de fichier pour primer
   sur les règles de base de la toolbar (même spécificité).
   ================================================================ */
@media (max-width: 991.98px) {
	.page-account-contacts .mc-dash__contacts-toolbar {
		position: static;
		z-index: auto;
		flex-wrap: nowrap;
		align-items: center;
		gap: 10px;
		margin-bottom: 14px;
	}

	.page-account-contacts .mc-dash__contacts-search-trigger {
		display: inline-flex;
		flex: 1 1 auto;
		justify-content: flex-start;
	}

	.page-account-contacts .mc-dash__contacts-toolbar-end {
		margin-left: 0;
		flex: 0 0 auto;
	}

	/* Voile Maestra stable derrière la feuille */
	.page-account-contacts .mc-dash__contacts-search-scrim {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 1190;
		background: var(--mm-modal-backdrop-veil, var(--mm-modal-backdrop-bg, rgba(15, 23, 42, .50)));
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		opacity: 0;
		pointer-events: none;
		transition: opacity .25s ease;
	}

	.page-account-contacts .mc-dash__contacts-toolbar.is-search-open .mc-dash__contacts-search-scrim {
		opacity: 1;
		pointer-events: auto;
	}

	/* Feuille de recherche (ancienne toolbar-start) */
	.page-account-contacts .mc-dash__contacts-toolbar-start {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1200;
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: stretch;
		gap: 14px;
		padding: calc(16px + env(safe-area-inset-top, 0px)) 16px 20px;
		background: var(--mc-surface, #fff);
		border-bottom-left-radius: 22px;
		border-bottom-right-radius: 22px;
		box-shadow: 0 24px 56px -16px rgba(15, 23, 42, .35);
		max-height: calc(100dvh - 24px);
		overflow-y: auto;
		visibility: hidden;
		transform: translateY(-110%);
		transition: transform .3s cubic-bezier(.16, 1, .3, 1), visibility .3s;
	}

	.page-account-contacts .mc-dash__contacts-toolbar.is-search-open .mc-dash__contacts-toolbar-start {
		visibility: visible;
		transform: translateY(0);
	}

	/* En-tête de la feuille */
	.page-account-contacts .mc-dash__contacts-search-sheet-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
	}

	.page-account-contacts .mc-dash__contacts-search-sheet-title {
		font-family: var(--default-font);
		font-size: 18px;
		font-weight: 600;
		color: var(--primary-color);
	}

	.page-account-contacts .mc-dash__contacts-search-close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 38px;
		height: 38px;
		border: 0;
		border-radius: 10px;
		background: color-mix(in srgb, var(--primary-color) 6%, transparent);
		color: var(--primary-color);
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
		transition: background .15s ease, color .15s ease;
	}

	.page-account-contacts .mc-dash__contacts-search-close:hover,
	.page-account-contacts .mc-dash__contacts-search-close:focus-visible {
		background: color-mix(in srgb, var(--brand-primary) 12%, transparent);
		color: var(--brand-primary);
		outline: none;
	}

	/* Champs en pleine largeur dans la feuille */
	.page-account-contacts .mc-dash__contacts-toolbar-search {
		flex: none;
		max-width: none;
		width: 100%;
	}

	.page-account-contacts .mc-dash__toolbar-select,
	.page-account-contacts .mc-dash__contacts-source-filter {
		flex: none;
		width: 100%;
		max-width: none;
	}

	.page-account-contacts .mc-dash__contacts-toolbar-start .mc-dash__btn:not(.mc-dash__toolbar-filters-btn):not(.mc-dash__toolbar-letters-btn) {
		width: 100%;
		justify-content: center;
	}

	.page-account-contacts .mc-dash__toolbar-filters-btn,
	.page-account-contacts .mc-dash__toolbar-letters-btn {
		align-self: flex-start;
	}

	/* Colonne Action : pas de sticky sur mobile (scroll horizontal naturel), largeur fixe conservée */
	.page-account-contacts .mc-dash__contacts-table .mc-dash__contacts-col-actions {
		position: static;
		right: auto;
		z-index: auto;
		min-width: var(--mc-contacts-col-actions);
		width: var(--mc-contacts-col-actions);
		border-left: none;
		box-shadow: none;
		background: transparent;
	}

	.page-account-contacts .mc-dash__contacts-table thead th.mc-dash__contacts-col-actions {
		z-index: auto;
	}

	.page-account-contacts .mc-dash__contacts-table.table-hover > tbody > tr:hover > td.mc-dash__contacts-col-actions {
		z-index: auto;
		background-color: var(--bs-table-hover-bg, rgba(0, 0, 0, 0.075));
	}
}

/* -------------------------------------------------------------------------
   Statut de vérification email — pastille "en évidence" sur la liste
   valid = vérifiée (vert), invalid = invalide (rouge), unknown = pas encore vérifiée (contour gris)
   ------------------------------------------------------------------------- */
.contact-email-verif {
	display: inline-block;
	width: 0.5rem;
	height: 0.5rem;
	margin-left: 0.4rem;
	border-radius: 50%;
	vertical-align: middle;
	flex: 0 0 auto;
}

.contact-email-verif--valid {
	background: #16a34a;
	box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.16);
}

.contact-email-verif--invalid {
	background: #dc2626;
	box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.16);
}

.contact-email-verif--unknown {
	background: transparent;
	border: 1.5px solid #c2c9d3;
}

html[data-bs-theme="dark"] .contact-email-verif--unknown {
	border-color: #5b6675;
}

/* ================================================================
   Desktop (≥ 992px) — toolbar liste Contacts : aucun chevauchement
   ----------------------------------------------------------------
   Jumelle de la toolbar Tiers (voir css/custom/mon-compte-tiers_inline.css).
   Ce qui pilote la dégradation est la largeur du CONTENEUR, pas
   celle du viewport : la sidebar (270px, 72px repliée) change la
   place utile sans que le viewport bouge. Trois garde-fous :
     1. champs élastiques (min / max) au lieu de largeurs figées ;
     2. la barre de filtres passe à la ligne au lieu de déborder
        sur le bouton d'ajout (filet de sécurité, container queries
        ou pas) ;
     3. sous 960px de conteneur, « Ajouter un contact » se réduit à
        un « + » carré (nom accessible porté par aria-label).
   ================================================================ */
@media (min-width: 992px) {
	.page-account-contacts .mc-dash__contacts-toolbar {
		--mc-toolbar-h: 44px;
		container: contacts-toolbar / inline-size;
		flex-wrap: nowrap;
		align-items: flex-start;
		gap: 12px;
	}

	.page-account-contacts .mc-dash__contacts-toolbar-start {
		flex: 1 1 auto;
		flex-wrap: wrap;
		gap: 10px;
	}

	.page-account-contacts .mc-dash__contacts-toolbar-end {
		flex: 0 0 auto;
	}

	.page-account-contacts .mc-dash__contacts-toolbar-search {
		flex: 1 1 240px;
		width: auto;
		min-width: 200px;
		max-width: 320px;
	}

	.page-account-contacts .mc-dash__contacts-search-input {
		height: var(--mc-toolbar-h);
	}

	/* Les libellés longs sont tronqués par selectedcontent (base-select) */
	.page-account-contacts .mc-dash__contacts-source-filter,
	.page-account-contacts .mc-dash__toolbar-select {
		flex: 1 1 158px;
		width: auto;
		min-width: 138px;
		max-width: 200px;
		height: var(--mc-toolbar-h);
		min-height: var(--mc-toolbar-h);
		line-height: var(--mc-toolbar-h);
	}

	.page-account-contacts .mc-dash__btn.mc-dash__toolbar-filters-btn,
	.page-account-contacts .mc-dash__btn.mc-dash__toolbar-letters-btn {
		flex: 0 0 var(--mc-toolbar-h);
		width: var(--mc-toolbar-h);
		height: var(--mc-toolbar-h);
		min-height: var(--mc-toolbar-h);
	}

	.page-account-contacts .mc-dash__contacts-toolbar-end .mc-dash__btn {
		height: var(--mc-toolbar-h);
		padding: 0 18px;
		white-space: nowrap;
	}

	@container contacts-toolbar (max-width: 960px) {
		.page-account-contacts .mc-dash__contacts-toolbar-end .mc-dash__toolbar-add-btn {
			gap: 0;
			width: var(--mc-toolbar-h);
			padding: 0;
			justify-content: center;
		}

		.page-account-contacts .mc-dash__contacts-toolbar-end .mc-dash__toolbar-add-btn > svg {
			flex-shrink: 0;
			width: 20px;
			height: 20px;
		}

		.page-account-contacts .mc-dash__toolbar-add-btn__label {
			display: none;
		}
	}
}