/**
 * DermaRee — 右侧客服 / Online Inquiry 色调统一
 * 品牌：蓝 #024886 + 橙 #EE922B（对齐 drivschol / theme-skin）
 * 抵消系统默认青绿色头栏与提交按钮
 */
:root {
	--xy-online-primary: #024886;
	--xy-online-primary-dark: #013a6e;
	--xy-online-accent: #EE922B;
	--xy-online-accent-dark: #d9821f;
	--xy-online-icon-size: 46px;
}

/* Dermaree: FA5 兼容系统右侧客服（Online 仍用 FA4 类名） */
.side_contact .fa-envelope-o:before {
	content: "\f0e0";
	font-family: "Font Awesome 5 Free";
	font-weight: 400;
}

.side_contact .fa-comment-o:before {
	content: "\f075";
	font-family: "Font Awesome 5 Free";
	font-weight: 400;
}

.side_contact .fa-whatsapp:before,
.side_contact .fa-weixin:before {
	font-family: "Font Awesome 5 Brands";
	font-weight: 400;
}

.side_contact .fa-shopping-cart:before,
.side_contact .fa-phone:before,
.side_contact .fa-arrow-up:before,
.side_contact .fa-comments:before,
.side_contact .fa-times:before,
.side_contact .fa-heart:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

/* 询盘档主题注入的侧栏购物篮（xy-side-basket.js） */
.side_contact_cart[data-xy-theme-side-basket="1"].is-empty,
.side_contact_cart[data-xy-theme-side-basket="1"][hidden] {
	display: none !important;
}

.side_contact_cart[data-xy-theme-side-basket="1"].is-visible {
	display: block !important;
	visibility: visible !important;
	pointer-events: auto !important;
	height: var(--xy-online-icon-size, 46px) !important;
	margin-bottom: 4px !important;
	overflow: visible !important;
}

.side_contact_cart[data-xy-theme-side-basket="1"] .side_contact_icon {
	position: relative;
	background: linear-gradient(135deg, #EE922B 0%, #d9821f 100%);
	color: #fff;
}

.side_contact_cart[data-xy-theme-side-basket="1"]:hover .side_contact_icon {
	background: linear-gradient(135deg, #f0a854 0%, #EE922B 100%);
	color: #fff;
}

.side_contact_cart[data-xy-theme-side-basket="1"] .side_contact_cart_badge {
	position: absolute;
	top: 2px;
	right: 2px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 8px;
	background: #024886;
	color: #fff;
	font: 700 10px/16px Arial, sans-serif;
	text-align: center;
	box-sizing: border-box;
	z-index: 3;
}

/* 悬停面板二维码中心 logo：系统 CSS 写的是 FA4 FontAwesome，主题只有 FA5 */
.side_contact_qr::after {
	font-family: "Font Awesome 5 Brands" !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1 !important;
	-webkit-font-smoothing: antialiased;
}

.side_contact_panel_wx .side_contact_qr::after {
	content: "\f1d7";
}

/* 无手机底栏：侧栏不必再抬高 85px */
@media only screen and (max-width: 768px) {
	.side_contact {
		bottom: 16px;
	}
}

/* —— Online Inquiry 弹窗：跟本站蓝/橙统一 —— */
.side_inquiry_close:hover {
	background: #fff !important;
	color: #024886 !important;
}

.side_inquiry_hd {
	background: linear-gradient(135deg, #013a6e 0%, #024886 48%, #0369a1 100%) !important;
}

.side_inquiry_tip {
	background: rgba(2, 72, 134, 0.08) !important;
	border-color: rgba(2, 72, 134, 0.18) !important;
	color: #2a4a66 !important;
}

.side_inquiry_label {
	color: #2a2a30 !important;
}

.side_inquiry_modal input.side_inquiry_input,
.side_inquiry_modal select.side_inquiry_input,
.side_inquiry_modal textarea.side_inquiry_textarea,
.side_inquiry_form input.side_inquiry_input,
.side_inquiry_form select.side_inquiry_input,
.side_inquiry_form textarea.side_inquiry_textarea {
	border: 1px solid #d5dee8 !important;
	border-radius: 10px !important;
	background: #f5f8fb !important;
	color: #111117 !important;
	box-shadow: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.side_inquiry_modal input.side_inquiry_input::placeholder,
.side_inquiry_modal textarea.side_inquiry_textarea::placeholder,
.side_inquiry_form input.side_inquiry_input::placeholder,
.side_inquiry_form textarea.side_inquiry_textarea::placeholder {
	color: #8a96a3 !important;
	opacity: 1 !important;
}

.side_inquiry_modal input.side_inquiry_input:hover,
.side_inquiry_modal select.side_inquiry_input:hover,
.side_inquiry_modal textarea.side_inquiry_textarea:hover,
.side_inquiry_form input.side_inquiry_input:hover,
.side_inquiry_form select.side_inquiry_input:hover,
.side_inquiry_form textarea.side_inquiry_textarea:hover {
	border-color: #7aa3c4 !important;
	background: #fff !important;
}

.side_inquiry_modal input.side_inquiry_input:focus,
.side_inquiry_modal select.side_inquiry_input:focus,
.side_inquiry_modal textarea.side_inquiry_textarea:focus,
.side_inquiry_form input.side_inquiry_input:focus,
.side_inquiry_form select.side_inquiry_input:focus,
.side_inquiry_form textarea.side_inquiry_textarea:focus {
	border-color: #024886 !important;
	background: #fff !important;
	box-shadow: 0 0 0 3px rgba(2, 72, 134, 0.16) !important;
}

.side_inquiry_modal .side_inquiry_submit,
.side_inquiry_form .side_inquiry_submit,
button.side_inquiry_submit {
	background: linear-gradient(135deg, #EE922B 0%, #d9821f 100%) !important;
	background-image: linear-gradient(135deg, #EE922B 0%, #d9821f 100%) !important;
	color: #fff !important;
	box-shadow: 0 8px 20px rgba(238, 146, 43, 0.35) !important;
}

.side_inquiry_modal .side_inquiry_submit:hover,
.side_inquiry_form .side_inquiry_submit:hover,
button.side_inquiry_submit:hover {
	filter: brightness(1.05) !important;
	box-shadow: 0 10px 24px rgba(238, 146, 43, 0.42) !important;
}

/* 联系页询盘侧栏一并统一 */
.contact-inquiry-form input,
.contact-inquiry-form select,
.contact-inquiry-form textarea {
	border: 1px solid #d5dee8 !important;
	border-radius: 10px !important;
	background: #f5f8fb !important;
	color: #111117 !important;
}

.contact-inquiry-form input:focus,
.contact-inquiry-form select:focus,
.contact-inquiry-form textarea:focus {
	border-color: #024886 !important;
	background: #fff !important;
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(2, 72, 134, 0.16) !important;
}

/* —— 手机端询盘弹窗：限高滚动 + 顶部间隙 + 表单紧凑 —— */
@media only screen and (max-width: 768px) {
	.side_inquiry_modal {
		padding: 12px;
		padding-top: max(28px, calc(env(safe-area-inset-top, 0px) + 16px));
		padding-right: max(12px, env(safe-area-inset-right, 0px));
		padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
		padding-left: max(12px, env(safe-area-inset-left, 0px));
		align-items: flex-start;
		justify-content: center;
	}

	.side_inquiry_dialog {
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 100%;
		max-height: calc(100vh - 40px);
		max-height: calc(100dvh - 40px);
		max-height: calc(100svh - 40px);
		overflow: hidden;
		border-radius: 14px;
		box-sizing: border-box;
	}

	.side_inquiry_hd {
		flex-shrink: 0;
		padding: 14px 44px 12px 14px;
		border-radius: 14px 14px 0 0;
		gap: 10px;
	}

	.side_inquiry_hd-icon {
		width: 36px;
		height: 36px;
		font-size: 15px;
		border-radius: 10px;
	}

	.side_inquiry_title {
		font-size: 17px;
		margin-bottom: 2px;
	}

	.side_inquiry_sub {
		font-size: 12px;
	}

	.side_inquiry_bd {
		flex: 1 1 auto;
		min-height: 0;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		padding: 12px;
	}

	.side_inquiry_tip {
		margin: 0 0 10px;
		padding: 8px 10px;
		font-size: 12px;
	}

	.side_inquiry_row {
		gap: 8px;
		margin-bottom: 8px;
	}

	.side_inquiry_field {
		flex: 1 1 100%;
	}

	.side_inquiry_field_full {
		margin-bottom: 10px;
	}

	.side_inquiry_label {
		margin: 0 0 4px;
		font-size: 11px;
	}

	.side_inquiry_modal input.side_inquiry_input,
	.side_inquiry_form input.side_inquiry_input {
		height: 38px;
		padding: 0 10px;
		font-size: 13px;
	}

	.side_inquiry_modal textarea.side_inquiry_textarea,
	.side_inquiry_form textarea.side_inquiry_textarea {
		min-height: 64px;
		padding: 8px 10px;
		font-size: 13px;
	}

	.side_inquiry_modal .side_inquiry_submit,
	.side_inquiry_form .side_inquiry_submit,
	button.side_inquiry_submit {
		height: 42px;
		font-size: 14px;
		margin-top: 2px;
	}

	.side_inquiry_input,
	.side_inquiry_textarea,
	.side_inquiry_form .xy-ship-country,
	.side_inquiry_form select.side_inquiry_input {
		max-width: 100%;
	}

	.side_inquiry_form .xy-ship-country,
	.side_inquiry_form select.side_inquiry_input,
	.side_inquiry_modal select.side_inquiry_input {
		height: 38px;
		padding: 0 10px;
		font-size: 13px;
	}
}
