/* ==========================================================================
   Widget Support Client / Chat Flottant (Éditions ATP)
   Z-Index Unifié 9000 (Flottant) & Contrastes Haute Lisibilité
   ========================================================================== */

.atp-chat-widget {
	position: fixed !important;
	bottom: 24px !important;
	left: 24px !important;
	z-index: var(--atp-z-floating, 9000) !important;
	font-family: inherit !important;
}

.atp-chat-trigger {
	width: 56px !important;
	height: 56px !important;
	border-radius: 50% !important;
	background-color: var(--atp-yellow, #f59e0b) !important;
	color: #000000 !important;
	border: 2px solid #000000 !important;
	cursor: pointer !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important;
	transition: transform 0.2s ease, background-color 0.2s ease !important;
}

.atp-chat-trigger:hover {
	transform: scale(1.08) !important;
	background-color: var(--atp-yellow-bright, #fbbf24) !important;
}

.atp-chat-trigger__icon-close {
	display: none !important;
}

.atp-chat-widget.is-open .atp-chat-trigger__icon-open {
	display: none !important;
}

.atp-chat-widget.is-open .atp-chat-trigger__icon-close {
	display: block !important;
}

.atp-chat-panel {
	position: absolute !important;
	bottom: 72px !important;
	left: 0 !important;
	width: 330px !important;
	background-color: #ffffff !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 16px !important;
	box-shadow: 0 12px 36px rgba(0, 0, 0, 0.2) !important;
	overflow: hidden !important;
	animation: atp-chat-in 0.25s ease-out !important;
}

@keyframes atp-chat-in {
	from { opacity: 0; transform: translateY(10px) scale(0.96); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

.atp-chat-panel__header {
	background: linear-gradient(135deg, #1d2327 0%, #2d3a42 100%) !important;
	color: #ffffff !important;
	padding: 16px 18px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
}

.atp-chat-header-info {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
}

.atp-chat-header-avatar {
	width: 36px !important;
	height: 36px !important;
	border-radius: 50% !important;
	background-color: var(--atp-yellow, #f59e0b) !important;
	color: #000000 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
}

.atp-chat-header-info strong {
	display: block !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: #ffffff !important;
}

.atp-chat-header-info span {
	display: block !important;
	font-size: 11.5px !important;
	color: #cbd5e1 !important;
}

.atp-chat-close {
	background: transparent !important;
	border: none !important;
	color: #cbd5e1 !important;
	cursor: pointer !important;
	padding: 4px !important;
	transition: color 0.2s !important;
}

.atp-chat-close:hover {
	color: #ffffff !important;
}

.atp-chat-panel__body {
	padding: 20px !important;
	background-color: #ffffff !important;
}

.atp-chat-question {
	font-size: 13.5px !important;
	color: #0f172a !important;
	margin: 0 0 16px !important;
	line-height: 1.45 !important;
	font-weight: 600 !important;
}

.atp-chat-option {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 12px 14px !important;
	border-radius: 12px !important;
	border: 1.5px solid #e2e8f0 !important;
	margin-bottom: 12px !important;
	text-decoration: none !important;
	color: #0f172a !important;
	background-color: #ffffff !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	transition: all 0.2s ease !important;
}

.atp-chat-option:last-child {
	margin-bottom: 0 !important;
}

.atp-chat-option:hover {
	background-color: #fefce8 !important;
	border-color: var(--atp-yellow, #f59e0b) !important;
	color: #000000 !important;
	transform: translateX(2px) !important;
}

.atp-chat-option__icon {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 32px !important;
	height: 32px !important;
	border-radius: 8px !important;
	flex-shrink: 0 !important;
}

.atp-chat-option--whatsapp .atp-chat-option__icon {
	background-color: rgba(37, 211, 102, 0.15) !important;
	color: #25d366 !important;
}

.atp-chat-option--phone .atp-chat-option__icon {
	background-color: rgba(245, 158, 11, 0.15) !important;
	color: #f59e0b !important;
}

.atp-chat-option--email .atp-chat-option__icon {
	background-color: rgba(99, 102, 241, 0.15) !important;
	color: #6366f1 !important;
}

.atp-chat-option__label {
	color: #0f172a !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	flex: 1 !important;
	margin-left: 12px !important;
}

.atp-chat-option__arrow {
	color: #94a3b8 !important;
	flex-shrink: 0 !important;
	transition: color 0.2s, transform 0.2s !important;
}

.atp-chat-option:hover .atp-chat-option__arrow {
	color: var(--atp-yellow, #f59e0b) !important;
	transform: translateX(3px) !important;
}

.atp-chat-panel__footer {
	background-color: #f8fafc !important;
	padding: 12px 18px !important;
	font-size: 12px !important;
	color: #475569 !important;
	border-top: 1px solid #e2e8f0 !important;
	text-align: center !important;
	font-weight: 500 !important;
}

/* Version tactile optimisée sur Smartphone (< 768px) */
@media (max-width: 768px) {
	.atp-chat-widget {
		display: block !important;
		bottom: 80px !important;
		right: 16px !important;
		left: auto !important;
	}
	.atp-chat-trigger {
		width: 48px !important;
		height: 48px !important;
	}
}
