/* Self-contained styles for Sticky ATC & Floating Hotline/Zalo Dock */
		.wesmile-sticky-atc {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 0;
			z-index: 60;
			background: rgba(255, 255, 255, 0.96);
			backdrop-filter: blur(14px);
			-webkit-backdrop-filter: blur(14px);
			border-top: 1px solid rgba(9, 30, 58, 0.1);
			box-shadow: 0 -10px 30px rgba(9, 30, 58, 0.08);
			transform: translateY(110%);
			opacity: 0;
			pointer-events: none;
			transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.25s ease;
		}
		.wesmile-sticky-atc.is-visible {
			transform: translateY(0);
			opacity: 1;
			pointer-events: auto;
		}
		.wesmile-sticky-atc-inner {
			max-width: 1280px;
			margin: 0 auto;
			padding: 10px 24px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 16px;
		}
		.wesmile-sticky-atc-meta {
			display: none;
		}
		@media (min-width: 1024px) {
			.wesmile-sticky-atc-meta {
				display: flex;
			}
		}
		.wesmile-sticky-plan-pill {
			padding: 6px 12px;
			border-radius: 9999px;
			font-size: 11px;
			font-weight: 700;
			color: #5C6B7F;
			background: transparent;
			border: none;
			cursor: pointer;
			transition: all 0.18s ease;
			white-space: nowrap;
		}
		.wesmile-sticky-plan-pill.is-active {
			background: #091E3A;
			color: #ffffff;
			box-shadow: 0 2px 8px rgba(9, 30, 58, 0.18);
		}

		/* Floating Dock Container (Bottom-Right) */
		.wesmile-floating-dock {
			position: fixed !important;
			right: 22px !important;
			bottom: 24px !important;
			z-index: 990 !important;
			display: flex !important;
			flex-direction: column !important;
			align-items: center !important;
			gap: 14px !important;
			transition: bottom 0.28s ease !important;
		}
		body.has-sticky-atc .wesmile-floating-dock {
			bottom: 96px !important;
		}
		.wesmile-contact-fab-list {
			display: flex !important;
			flex-direction: column !important;
			align-items: center !important;
			gap: 14px !important;
		}
		.wesmile-contact-mobile-toggle {
			display: none !important;
		}

		/* Double-circle Navy Badge Button (matching reference icon design) */
		.wesmile-contact-fab {
			position: relative !important;
			width: 66px !important;
			height: 66px !important;
			border-radius: 9999px !important;
			background: rgba(11, 43, 89, 0.18) !important;
			backdrop-filter: blur(4px) !important;
			-webkit-backdrop-filter: blur(4px) !important;
			border: none !important;
			padding: 8px !important;
			display: inline-flex !important;
			align-items: center !important;
			justify-content: center !important;
			cursor: pointer !important;
			box-shadow: 0 8px 22px rgba(8, 43, 89, 0.18) !important;
			transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), background 0.22s ease, box-shadow 0.22s ease !important;
		}
		.wesmile-contact-fab:hover {
			transform: translateY(-3px) scale(1.04) !important;
			background: rgba(11, 43, 89, 0.26) !important;
			box-shadow: 0 12px 28px rgba(8, 43, 89, 0.28) !important;
		}
		.wesmile-contact-fab__core {
			width: 50px !important;
			height: 50px !important;
			border-radius: 9999px !important;
			background: #082B59 !important;
			color: #DCE8F6 !important;
			display: inline-flex !important;
			align-items: center !important;
			justify-content: center !important;
			box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.12) !important;
			transition: background 0.2s ease, color 0.2s ease !important;
		}
		.wesmile-contact-fab:hover .wesmile-contact-fab__core {
			background: #0B3770 !important;
			color: #ffffff !important;
		}
		.wesmile-contact-fab::before {
			content: attr(data-tooltip);
			position: absolute;
			right: calc(100% + 12px);
			top: 50%;
			transform: translateY(-50%) translateX(6px);
			background: #082B59;
			color: #ffffff;
			font-size: 12px;
			font-weight: 700;
			padding: 6px 13px;
			border-radius: 9999px;
			white-space: nowrap;
			box-shadow: 0 8px 20px rgba(8, 43, 89, 0.25);
			opacity: 0;
			pointer-events: none;
			transition: opacity 0.18s ease, transform 0.18s ease;
		}
		.wesmile-contact-fab:hover::before,
		.wesmile-contact-fab:focus-visible::before {
			opacity: 1;
			transform: translateY(-50%) translateX(0);
		}

		/* Scroll-to-top button */
		.wesmile-scroll-top-btn {
			width: 44px !important;
			height: 44px !important;
			border-radius: 9999px !important;
			background: rgba(255, 255, 255, 0.92) !important;
			color: #082B59 !important;
			border: 1.5px solid #082B59 !important;
			display: inline-flex !important;
			align-items: center !important;
			justify-content: center !important;
			box-shadow: 0 6px 16px rgba(8, 43, 89, 0.12) !important;
			cursor: pointer !important;
			transition: all 0.2s ease !important;
		}
		.wesmile-scroll-top-btn:hover {
			background: #082B59 !important;
			color: #ffffff !important;
			transform: translateY(-2px) !important;
		}

		/* =========================================================
		   Mobile Compact Collapsible Mode (<= 767px)
		   Hides Zalo & Hotline icons into a small compact trigger
		   until tapped so they don't obstruct mobile screen content
		   ========================================================= */
		@media (max-width: 767px) {
			.wesmile-floating-dock {
				right: 12px !important;
				bottom: 18px !important;
				gap: 8px !important;
				align-items: flex-end !important;
			}
			body.has-sticky-atc .wesmile-floating-dock {
				bottom: 84px !important;
			}
			.wesmile-scroll-top-btn {
				width: 34px !important;
				height: 34px !important;
				border-width: 1px !important;
				border-color: rgba(8, 43, 89, 0.25) !important;
				background: rgba(255, 255, 255, 0.88) !important;
				box-shadow: 0 4px 12px rgba(8, 43, 89, 0.1) !important;
			}
			.wesmile-scroll-top-btn svg {
				width: 15px !important;
				height: 15px !important;
			}
			.wesmile-contact-fab-list {
				display: flex !important;
				flex-direction: column !important;
				align-items: flex-end !important;
				gap: 10px !important;
				opacity: 1;
				translate: 0 0;
				scale: 1;
				transform-origin: bottom right;
				transition:
					display 0.22s,
					opacity 0.22s ease-out,
					translate 0.22s ease-out,
					scale 0.22s ease-out;
				transition-behavior: allow-discrete;
			}
			.wesmile-floating-dock:not(.is-mobile-open) .wesmile-contact-fab-list,
			.wesmile-contact-fab-list:where([hidden], [data-closing]) {
				opacity: 0 !important;
				translate: 0 10px !important;
				scale: 0.82 !important;
				pointer-events: none !important;
			}
			.wesmile-floating-dock:not(.is-mobile-open):not([data-closing]) .wesmile-contact-fab-list,
			.wesmile-contact-fab-list[hidden] {
				display: none !important;
			}
			.wesmile-contact-fab {
				width: 48px !important;
				height: 48px !important;
				padding: 5px !important;
				box-shadow: 0 6px 16px rgba(8, 43, 89, 0.2) !important;
			}
			.wesmile-contact-fab__core {
				width: 38px !important;
				height: 38px !important;
			}
			.wesmile-contact-fab__core svg {
				width: 20px !important;
				height: 20px !important;
			}
			.wesmile-floating-dock.is-mobile-open .wesmile-contact-fab::before {
				opacity: 1;
				transform: translateY(-50%) translateX(0);
				font-size: 11px;
				padding: 4px 10px;
				right: calc(100% + 8px);
			}
			.wesmile-contact-mobile-toggle {
				position: relative !important;
				width: 42px !important;
				height: 42px !important;
				border-radius: 9999px !important;
				background: rgba(11, 43, 89, 0.16) !important;
				backdrop-filter: blur(4px) !important;
				-webkit-backdrop-filter: blur(4px) !important;
				border: none !important;
				padding: 4px !important;
				display: inline-flex !important;
				align-items: center !important;
				justify-content: center !important;
				cursor: pointer !important;
				box-shadow: 0 6px 16px rgba(8, 43, 89, 0.18) !important;
				transition: transform 0.2s ease, background 0.2s ease !important;
			}
			.wesmile-contact-mobile-toggle__core {
				width: 34px !important;
				height: 34px !important;
				border-radius: 9999px !important;
				background: #082B59 !important;
				color: #ffffff !important;
				display: inline-flex !important;
				align-items: center !important;
				justify-content: center !important;
				box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.16) !important;
				transition: background 0.2s ease, transform 0.2s ease !important;
			}
			.wesmile-floating-dock.is-mobile-open .wesmile-contact-mobile-toggle__core {
				background: #00A3E0 !important;
			}
			.wesmile-contact-mobile-toggle__icon-close {
				display: none !important;
			}
			.wesmile-floating-dock.is-mobile-open .wesmile-contact-mobile-toggle__icon-open {
				display: none !important;
			}
			.wesmile-floating-dock.is-mobile-open .wesmile-contact-mobile-toggle__icon-close {
				display: block !important;
			}
			.wesmile-contact-mobile-toggle__dot {
				position: absolute !important;
				top: 2px !important;
				right: 2px !important;
				width: 9px !important;
				height: 9px !important;
				border-radius: 9999px !important;
				background: #00A3E0 !important;
				border: 1.5px solid #ffffff !important;
			}
			.wesmile-floating-dock.is-mobile-open .wesmile-contact-mobile-toggle__dot {
				display: none !important;
			}
		}

		@starting-style {
			.wesmile-floating-dock.is-mobile-open .wesmile-contact-fab-list {
				opacity: 0;
				translate: 0 10px;
				scale: 0.82;
			}
		}

		@media (prefers-reduced-motion: reduce) {
			.wesmile-contact-fab-list,
			.wesmile-contact-fab-list:where([hidden], [data-closing]) {
				translate: none !important;
				scale: none !important;
				transition-duration: 0.1s !important;
			}
			@starting-style {
				.wesmile-floating-dock.is-mobile-open .wesmile-contact-fab-list {
					translate: none;
					scale: none;
				}
			}
		}

		/* Native Modal Dialogs for Hotline & Zalo QR */
		dialog.wesmile-contact-dialog {
			padding: 0;
			border: none;
			border-radius: 24px;
			background: #ffffff;
			color: #091E3A;
			max-width: 410px;
			width: calc(100% - 32px);
			box-shadow: 0 25px 60px -12px rgba(9, 30, 58, 0.38);
			overflow: hidden;
			margin: auto;
		}
		dialog.wesmile-contact-dialog:not([open]) {
			display: none !important;
		}
		dialog.wesmile-contact-dialog::backdrop {
			background-color: rgba(9, 30, 58, 0.52);
			backdrop-filter: blur(3px);
		}
		.wesmile-contact-dialog__card {
			display: flex;
			flex-direction: column;
		}
		.wesmile-contact-dialog__header {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 12px;
			padding: 18px 22px;
			color: #ffffff;
			background: linear-gradient(135deg, #082B59 0%, #0D3B78 100%);
		}
		.wesmile-contact-dialog__brand {
			display: flex;
			align-items: center;
			gap: 12px;
		}
		.wesmile-contact-dialog__badge {
			width: 42px;
			height: 42px;
			border-radius: 9999px;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			flex-shrink: 0;
			font-weight: 900;
			font-size: 12px;
			background: rgba(255, 255, 255, 0.14);
			color: #DCE8F6;
			border: 1px solid rgba(255, 255, 255, 0.22);
		}
		.wesmile-contact-dialog__title {
			margin: 0;
			font-size: 16px;
			font-weight: 800;
			line-height: 1.25;
			color: #ffffff;
		}
		.wesmile-contact-dialog__subtitle {
			margin: 3px 0 0;
			font-size: 12px;
			color: rgba(255, 255, 255, 0.82);
		}
		.wesmile-contact-dialog__close {
			width: 34px;
			height: 34px;
			border-radius: 9999px;
			border: 1px solid rgba(255, 255, 255, 0.2);
			background: rgba(255, 255, 255, 0.1);
			color: #ffffff;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			cursor: pointer;
			transition: background 0.18s ease;
		}
		.wesmile-contact-dialog__close:hover {
			background: rgba(255, 255, 255, 0.24);
		}
		.wesmile-contact-dialog__body {
			padding: 20px 22px;
			display: flex;
			flex-direction: column;
			gap: 16px;
			max-height: 74vh;
			overflow-y: auto;
		}
		.wesmile-contact-item {
			background: #F6F8FB;
			border: 1px solid rgba(9, 30, 58, 0.08);
			border-radius: 16px;
			padding: 16px;
			display: flex;
			flex-direction: column;
			gap: 12px;
		}
		.wesmile-contact-item__meta {
			display: flex;
			align-items: center;
			gap: 8px;
		}
		.wesmile-contact-item__dot {
			width: 8px;
			height: 8px;
			border-radius: 9999px;
			background: #10b981;
		}
		.wesmile-contact-item__dot--zalo {
			background: #0068FF;
		}
		.wesmile-contact-item__label {
			font-size: 13.5px;
			font-weight: 800;
			color: #091E3A;
		}
		.wesmile-contact-item__note {
			margin: -4px 0 0;
			font-size: 12px;
			color: #5C6B7F;
			line-height: 1.45;
		}
		.wesmile-contact-item__number-box {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 10px;
			background: #ffffff;
			border: 1px solid rgba(9, 30, 58, 0.1);
			border-radius: 12px;
			padding: 10px 14px;
		}
		.wesmile-contact-item__number {
			font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
			font-size: 20px;
			font-weight: 800;
			color: #082B59;
			letter-spacing: 0.02em;
		}
		.wesmile-contact-copy-btn {
			padding: 6px 11px;
			border-radius: 9999px;
			border: 1px solid rgba(9, 30, 58, 0.14);
			background: #F6F8FB;
			color: #091E3A;
			font-size: 11.5px;
			font-weight: 700;
			cursor: pointer;
			white-space: nowrap;
			transition: all 0.18s ease;
		}
		.wesmile-contact-copy-btn:hover {
			border-color: #082B59;
			color: #082B59;
			background: #ffffff;
		}
		.wesmile-zalo-qr-frame {
			background: #ffffff;
			border: 1.5px dashed rgba(8, 43, 89, 0.28);
			border-radius: 16px;
			padding: 14px;
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 8px;
			text-align: center;
		}
		.wesmile-zalo-qr-img {
			width: 190px;
			height: 190px;
			object-fit: contain;
			border-radius: 10px;
			background: #ffffff;
			display: block;
		}
		.wesmile-zalo-qr-caption {
			font-size: 11.5px;
			font-weight: 700;
			color: #082B59;
		}
		.wesmile-contact-actions-grid {
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap: 8px;
		}
		.wesmile-contact-cta {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			gap: 8px;
			padding: 12px 16px;
			border-radius: 9999px;
			font-size: 13px;
			font-weight: 800;
			text-decoration: none;
			text-align: center;
			transition: all 0.2s ease;
		}
		.wesmile-contact-cta--phone,
		.wesmile-contact-cta--zalo {
			background: #082B59;
			color: #ffffff;
			box-shadow: 0 8px 20px rgba(8, 43, 89, 0.25);
		}
		.wesmile-contact-cta--phone:hover,
		.wesmile-contact-cta--zalo:hover {
			background: #0D3B78;
			color: #ffffff;
			transform: translateY(-1px);
		}
		.wesmile-contact-cta--outline {
			background: #ffffff;
			color: #082B59;
			border: 1px solid rgba(8, 43, 89, 0.2);
		}
		.wesmile-contact-cta--outline:hover {
			border-color: #082B59;
			background: #F6F8FB;
		}
		.wesmile-contact-dialog__footer {
			padding: 12px 22px 16px;
			border-top: 1px solid rgba(9, 30, 58, 0.06);
			background: #F6F8FB;
		}
		.wesmile-contact-switch-btn {
			width: 100%;
			background: none;
			border: none;
			padding: 4px 0;
			display: flex;
			align-items: center;
			justify-content: space-between;
			font-size: 12px;
			color: #5C6B7F;
			cursor: pointer;
		}
		.wesmile-contact-switch-btn strong {
			color: #082B59;
			font-weight: 800;
		}