/**
 * SWK Inquiry - Frontend styles
 * Matches the swk-header palette: deep blue #0a3d62, accent #1e88e5
 */

:root {
	--swk-inq-primary: #0a3d62;
	--swk-inq-primary-dark: #062a44;
	--swk-inq-accent: #1e88e5;
	--swk-inq-bg: #f6f8fa;
	--swk-inq-border: #e1e4e8;
	--swk-inq-text: #222;
	--swk-inq-muted: #666;
	--swk-inq-success: #16a34a;
	--swk-inq-error: #dc2626;
	--swk-inq-radius: 6px;
}

/* ---------- Hidden price ---------- */
.swk-inquiry-price-hidden {
	color: var(--swk-inq-primary);
	font-weight: 600;
	font-style: italic;
}

/* ---------- Honeypot ---------- */
.swk-honeypot {
	position: absolute !important;
	left: -10000px !important;
	width: 1px !important;
	height: 1px !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

/* ---------- Product page buttons ---------- */
.swk-inquiry-product-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin: 16px 0;
}

.swk-inquiry-add-btn,
.swk-inquiry-quick-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 20px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	border: 1px solid var(--swk-inq-primary);
	border-radius: var(--swk-inq-radius);
	background: #fff;
	color: var(--swk-inq-primary);
	cursor: pointer;
	transition: all .18s ease;
	text-decoration: none;
}

.swk-inquiry-add-btn:hover,
.swk-inquiry-quick-btn:hover {
	background: var(--swk-inq-primary);
	color: #fff;
}

.swk-inquiry-quick-btn {
	background: var(--swk-inq-primary);
	color: #fff;
}
.swk-inquiry-quick-btn:hover {
	background: var(--swk-inq-primary-dark);
	border-color: var(--swk-inq-primary-dark);
}

.swk-inquiry-add-btn svg {
	width: 16px;
	height: 16px;
}

.swk-inquiry-add-btn.is-loading {
	opacity: 0.7;
	cursor: wait;
}
.swk-inquiry-add-btn.is-added {
	background: var(--swk-inq-success);
	color: #fff;
	border-color: var(--swk-inq-success);
}

.swk-inquiry-loop-btn {
	display: inline-block;
	margin-top: 6px;
}

/* ---------- Floating badge ---------- */
.swk-inquiry-floating-badge {
	position: fixed;
	left: 20px;
	bottom: 30px;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--swk-inq-primary);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	/* 外圈浅色描边:徽标底色是 --swk-inq-primary(#0a3d62 深蓝),原先页脚是浅灰所以很醒目。
	   页脚改为深墨蓝 #0b1a2b 之后,两者对比度只有 1.55,滚到页面底部时徽标会融进背景。
	   与其把徽标改成另一种颜色(它和询盘弹窗、按钮共用同一个品牌色变量),不如加一圈
	   半透明白描边 —— 深底上把徽标托出来,浅底上几乎看不见,对任何背景都成立。 */
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18), 0 0 0 2px rgba(255, 255, 255, 0.9);
	z-index: 998;
	transition: all .2s ease;
	text-decoration: none;
}
.swk-inquiry-floating-badge:hover {
	background: var(--swk-inq-primary-dark);
	transform: translateY(-2px);
	color: #fff;
}
.swk-inquiry-floating-badge svg {
	width: 24px;
	height: 24px;
}
.swk-inquiry-floating-count {
	position: absolute;
	top: -4px;
	right: -4px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: #ff3b30;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(0);
	transition: transform .2s ease;
}
.swk-inquiry-floating-badge.is-active .swk-inquiry-floating-count {
	transform: scale(1);
}

/* ---------- Modal ---------- */
.swk-inquiry-modal,
.swk-inquiry-success {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: none;
}
.swk-inquiry-modal.is-open,
.swk-inquiry-success.is-open {
	display: block;
}
body.swk-modal-open { overflow: hidden; }

.swk-inquiry-modal-backdrop,
.swk-inquiry-success-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(20, 30, 50, 0.55);
	backdrop-filter: blur(2px);
	animation: swkFade .2s ease;
}

.swk-inquiry-modal-dialog,
.swk-inquiry-success-dialog {
	position: relative;
	max-width: 760px;
	margin: 6vh auto;
	background: #fff;
	border-radius: 8px;
	padding: 30px;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
	animation: swkSlide .25s ease;
	max-height: 88vh;
	overflow-y: auto;
}

@keyframes swkFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes swkSlide { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

.swk-inquiry-modal-close {
	position: absolute;
	top: 10px;
	right: 12px;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--swk-inq-muted);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	-webkit-tap-highlight-color: transparent;
	transition: background-color .15s ease, color .15s ease;
	/* Hide the existing "×" text so the ::before below renders the glyph cleanly centered */
	font-size: 0;
	line-height: 1;
}
.swk-inquiry-modal-close::before {
	content: "\00D7";
	display: block;
	font-size: 26px;
	line-height: 1;
	transform: translateY(-1px); /* optical centering — × sits slightly above midline */
}
.swk-inquiry-modal-close:hover {
	background: rgba(0, 0, 0, 0.06);
	color: var(--swk-inq-primary);
}
.swk-inquiry-modal-close:focus-visible {
	outline: 2px solid var(--swk-inq-accent);
	outline-offset: 2px;
}

.swk-inquiry-modal-title {
	margin: 0 0 6px;
	color: var(--swk-inq-primary);
	font-size: 22px;
}
.swk-inquiry-modal-product {
	color: var(--swk-inq-muted);
	font-size: 14px;
	margin-bottom: 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--swk-inq-border);
	min-height: 1em;
}

/* ---------- Form fields ---------- */
.swk-inquiry-form .swk-inquiry-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}
@media (max-width: 540px) {
	.swk-inquiry-form .swk-inquiry-grid { grid-template-columns: 1fr; }
}

.swk-field {
	display: block;
	margin-bottom: 12px;
	min-width: 0; /* allow grid cell to shrink below content size */
}
.swk-field-full { grid-column: 1 / -1; }
.swk-field-qty { max-width: 140px; }

.swk-field-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--swk-inq-text);
	margin-bottom: 4px;
}
.swk-field-label em {
	color: var(--swk-inq-error);
	font-style: normal;
}
.swk-field-label small {
	color: var(--swk-inq-muted);
	font-weight: 400;
	margin-left: 4px;
}

.swk-field input[type=text],
.swk-field input[type=email],
.swk-field input[type=number],
.swk-field input[type=file],
.swk-field textarea {
	width: 100%;
	padding: 10px 11px;
	font-size: 14px;
	border: 1px solid var(--swk-inq-border);
	border-radius: var(--swk-inq-radius);
	background: #fff;
	color: var(--swk-inq-text);
	box-sizing: border-box;
	font-family: inherit;
	/* Override theme/Elementor typography that may force capitalize/uppercase */
	text-transform: none !important;
	font-variant: normal !important;
	letter-spacing: normal !important;
}

/* Override placeholder and ::first-letter rules from parent theme */
.swk-field input::placeholder,
.swk-field textarea::placeholder {
	text-transform: none !important;
	font-variant: normal !important;
}

/* ---------- Country picker (custom dropdown reusing iti flag sprites) ---------- */
.swk-country-picker {
	position: relative;
	width: 100%;
}
.swk-country-trigger {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 10px 11px;
	font-size: 14px;
	line-height: 1.5;
	border: 1px solid var(--swk-inq-border);
	border-radius: var(--swk-inq-radius);
	background: #fff;
	color: var(--swk-inq-text);
	cursor: pointer;
	text-align: left;
	font-family: inherit;
	box-sizing: border-box;
	transition: border-color .15s;
	text-transform: none !important;
}
.swk-country-trigger:hover { border-color: var(--swk-inq-accent); }
.swk-country-picker.is-open .swk-country-trigger {
	border-color: var(--swk-inq-accent);
	box-shadow: 0 0 0 3px rgba(30, 136, 229, 0.15);
}
.swk-country-flag { flex: 0 0 auto; }
.swk-country-name {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--swk-inq-text);
}
.swk-country-trigger .swk-country-name:empty::before {
	content: 'Select country';
	color: var(--swk-inq-muted);
}
.swk-country-chev {
	flex: 0 0 auto;
	color: var(--swk-inq-muted);
	transition: transform .2s;
}
.swk-country-picker.is-open .swk-country-chev { transform: rotate(180deg); }

.swk-country-dropdown {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	z-index: 100001;
	background: #fff;
	border: 1px solid var(--swk-inq-border);
	border-radius: var(--swk-inq-radius);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	overflow: hidden;
	max-height: 320px;
	display: none; /* hidden by default; .is-open shows it */
	flex-direction: column;
}
.swk-country-dropdown.is-open { display: flex; }
.swk-country-search {
	margin: 8px;
	padding: 8px 10px;
	border: 1px solid var(--swk-inq-border) !important;
	border-radius: 4px;
	font-size: 13px;
	font-family: inherit;
	width: calc(100% - 16px);
	box-sizing: border-box;
}
.swk-country-search:focus {
	outline: none;
	border-color: var(--swk-inq-accent) !important;
}
.swk-country-list {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow-y: auto;
	flex: 1 1 auto;
}
.swk-country-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	cursor: pointer;
	font-size: 14px;
	transition: background .1s;
}
.swk-country-item:hover { background: #e6f0fd; }
.swk-country-item.is-highlighted {
	background: var(--swk-inq-accent);
	color: #fff;
}
.swk-country-item-name {
	flex: 1 1 auto;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.swk-country-item-code {
	color: var(--swk-inq-muted);
	font-size: 12px;
	font-variant-numeric: tabular-nums;
}
.swk-country-item.is-highlighted .swk-country-item-code { color: rgba(255, 255, 255, 0.9); }
.swk-country-empty {
	padding: 12px;
	color: var(--swk-inq-muted);
	text-align: center;
	font-size: 13px;
}

/* ---------- Custom Phone wrap (flag + dial code prefix + digit input) ---------- */
.swk-phone-wrap {
	position: relative;
	display: flex;
	align-items: stretch;
	width: 100%;
	border: 1px solid var(--swk-inq-border);
	border-radius: var(--swk-inq-radius);
	background: #fff;
	overflow: visible;
	transition: border-color .15s, box-shadow .15s;
}
.swk-phone-wrap:focus-within {
	border-color: var(--swk-inq-accent);
	box-shadow: 0 0 0 3px rgba(30, 136, 229, 0.15);
}
.swk-phone-trigger {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 0 12px;
	background: #f6f8fa;
	border: 0;
	border-right: 1px solid var(--swk-inq-border);
	border-radius: var(--swk-inq-radius) 0 0 var(--swk-inq-radius);
	color: var(--swk-inq-text);
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color .15s;
	white-space: nowrap;
}
.swk-phone-trigger:hover { background: #e9eef3; }
.swk-phone-wrap.is-open .swk-phone-trigger {
	background: #e9eef3;
}
.swk-phone-flag { flex: 0 0 auto; }
.swk-phone-code { color: var(--swk-inq-text); font-variant-numeric: tabular-nums; }
.swk-phone-chev {
	flex: 0 0 auto;
	color: var(--swk-inq-muted);
	margin-left: 2px;
	transition: transform .2s;
}
.swk-phone-wrap.is-open .swk-phone-chev { transform: rotate(180deg); }

.swk-phone-wrap input[type=tel] {
	flex: 1 1 auto;
	min-width: 0;
	border: 0 !important;
	padding: 10px 11px !important;
	background: transparent !important;
	border-radius: 0 var(--swk-inq-radius) var(--swk-inq-radius) 0 !important;
	box-shadow: none !important;
}
.swk-phone-wrap input[type=tel]:focus {
	outline: none !important;
	box-shadow: none !important;
}

/* ---------- Custom file input (hides browser-native UI) ---------- */
.swk-file-row {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	cursor: pointer;
	margin: 0 !important;
}
.swk-file-input {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
	opacity: 0 !important;
}
.swk-file-btn {
	display: inline-block;
	padding: 8px 18px;
	background: var(--swk-inq-bg);
	border: 1px solid var(--swk-inq-border);
	border-radius: var(--swk-inq-radius);
	font-size: 14px;
	font-weight: 500;
	color: var(--swk-inq-text);
	transition: all .15s ease;
	white-space: nowrap;
	text-transform: none !important;
}
.swk-file-row:hover .swk-file-btn {
	background: #e9eef3;
	border-color: var(--swk-inq-accent);
	color: var(--swk-inq-primary);
}
.swk-file-input:focus + .swk-file-btn {
	outline: 2px solid var(--swk-inq-accent);
	outline-offset: 2px;
}
.swk-file-name {
	font-size: 13px;
	color: var(--swk-inq-muted);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 280px;
	text-transform: none !important;
}
.swk-file-name.has-file {
	color: var(--swk-inq-primary);
	font-weight: 500;
}
.swk-field input:focus,
.swk-field textarea:focus {
	outline: none;
	border-color: var(--swk-inq-accent);
	box-shadow: 0 0 0 3px rgba(30, 136, 229, 0.15);
}

/* Shake + red flash when an invalid character is rejected */
@keyframes swkShake {
	0%, 100% { transform: translateX(0); }
	20%      { transform: translateX(-4px); }
	40%      { transform: translateX(4px); }
	60%      { transform: translateX(-3px); }
	80%      { transform: translateX(3px); }
}
.swk-field input.swk-shake,
.swk-inquiry-table input.swk-shake {
	animation: swkShake 0.4s ease;
	border-color: var(--swk-inq-error) !important;
	box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15) !important;
}
.swk-field textarea {
	resize: vertical;
	min-height: 90px;
}

.swk-inquiry-submit {
	display: block;
	width: 100%;
	margin-top: 16px;
	padding: 13px 20px;
	font-size: 16px;
	font-weight: 700;
	border: 0;
	border-radius: var(--swk-inq-radius);
	background: var(--swk-inq-primary);
	color: #fff;
	cursor: pointer;
	transition: background .18s ease;
}
.swk-inquiry-submit:hover { background: var(--swk-inq-primary-dark); }
.swk-inquiry-submit:disabled { opacity: 0.7; cursor: wait; }

.swk-inquiry-msg {
	margin-top: 10px;
	font-size: 14px;
	min-height: 1em;
}
.swk-inquiry-msg.is-error { color: var(--swk-inq-error); }
.swk-inquiry-msg.is-success { color: var(--swk-inq-success); }

/* ---------- Toast ---------- */
.swk-inquiry-toast {
	position: fixed;
	left: 50%;
	bottom: 50px;
	transform: translateX(-50%) translateY(40px);
	padding: 12px 22px;
	background: rgba(0, 0, 0, 0.86);
	color: #fff;
	border-radius: 4px;
	font-size: 14px;
	z-index: 100000;
	opacity: 0;
	pointer-events: none;
	transition: all .25s ease;
}
.swk-inquiry-toast.is-show {
	transform: translateX(-50%) translateY(0);
	opacity: 1;
}

/* ---------- Success popup ---------- */
.swk-inquiry-success-dialog {
	max-width: 440px;
	text-align: center;
}
.swk-inquiry-success-icon {
	color: var(--swk-inq-success);
	margin: 0 auto 12px;
	width: 60px;
	height: 60px;
}
.swk-inquiry-success-icon svg { width: 100%; height: 100%; }
.swk-inquiry-success h3 { margin: 0 0 8px; color: var(--swk-inq-primary); }
.swk-inquiry-success p { color: var(--swk-inq-muted); margin: 0 0 18px; }
.swk-inquiry-success-wa {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 22px;
	background: #25d366;
	color: #fff;
	border-radius: 4px;
	text-decoration: none;
	font-weight: 600;
	margin-bottom: 10px;
}
/* The HTML "hidden" attribute defaults to display:none, but our display:inline-flex
   above overrides it. This restores the hidden behavior. */
.swk-inquiry-success-wa[hidden] { display: none !important; }
.swk-inquiry-success-wa:hover { background: #1ea857; color: #fff; }
.swk-inquiry-success-wa svg { width: 18px; height: 18px; }
.swk-inquiry-success-close {
	display: block;
	margin: 0 auto;
	padding: 8px 22px;
	background: none;
	color: var(--swk-inq-muted);
	border: 1px solid var(--swk-inq-border);
	border-radius: 4px;
	cursor: pointer;
}
.swk-inquiry-success-close:hover { background: var(--swk-inq-bg); }

/* ---------- Cart page ---------- */
.swk-inquiry-cart-page {
	margin: 30px 0;
}
.swk-inquiry-empty {
	background: var(--swk-inq-bg);
	padding: 30px;
	text-align: center;
	border-radius: var(--swk-inq-radius);
	color: var(--swk-inq-muted);
}
.swk-inquiry-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 30px;
	/* Normalize the whole table to a single font stack so cells, links, inputs
	   and buttons all read the same. */
	font-family: inherit;
	font-size: 14px;
	line-height: 1.5;
	color: var(--swk-inq-text);
}
.swk-inquiry-table th,
.swk-inquiry-table td {
	padding: 12px 10px;
	border-bottom: 1px solid var(--swk-inq-border);
	text-align: left;
	vertical-align: middle;
	font-family: inherit !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	color: var(--swk-inq-text);
	font-weight: 400;
	text-transform: none !important;
	letter-spacing: normal !important;
}
.swk-inquiry-table th {
	background: var(--swk-inq-bg);
	font-size: 13px !important;
	font-weight: 600;
	color: var(--swk-inq-muted);
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
}
.swk-inquiry-table .col-image img {
	width: 60px;
	height: 60px;
	object-fit: cover;
	border-radius: 4px;
	display: block;
}
.swk-inquiry-table .col-name a {
	color: var(--swk-inq-text) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: color .15s ease;
}
.swk-inquiry-table .col-name a:hover {
	color: var(--swk-inq-primary) !important;
	text-decoration: underline !important;
}
.swk-inquiry-table .col-attr,
.swk-inquiry-table .col-sku {
	color: var(--swk-inq-muted);
}
.swk-inquiry-table .col-qty {
	width: 100px;
}
.swk-inquiry-table .col-qty input {
	width: 70px;
	padding: 7px 10px;
	font-family: inherit !important;
	font-size: 14px !important;
	line-height: 1.4;
	color: var(--swk-inq-text);
	border: 1px solid var(--swk-inq-border);
	border-radius: 4px;
	background: #fff;
	box-sizing: border-box;
	text-transform: none !important;
}
.swk-inquiry-table .col-qty input:focus {
	outline: none;
	border-color: var(--swk-inq-accent);
	box-shadow: 0 0 0 3px rgba(30, 136, 229, 0.15);
}
.swk-inquiry-table .col-action {
	width: 50px;
	text-align: right;
}
.swk-inquiry-remove {
	background: none;
	border: 0;
	padding: 0;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	color: var(--swk-inq-muted);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0;
	line-height: 1;
	transition: background-color .15s ease, color .15s ease;
}
.swk-inquiry-remove::before {
	content: "\00D7";
	font-family: inherit;
	font-size: 22px;
	line-height: 1;
	transform: translateY(-1px);
}
.swk-inquiry-remove:hover {
	background: #fee;
	color: var(--swk-inq-error);
}

@media (max-width: 600px) {
	.swk-inquiry-table thead { display: none; }
	.swk-inquiry-table tbody tr {
		display: grid;
		grid-template-columns: 80px 1fr;
		gap: 4px 12px;
		padding: 10px 0;
		border-bottom: 1px solid var(--swk-inq-border);
	}
	.swk-inquiry-table tbody td {
		border: 0;
		padding: 2px 0;
	}
	.swk-inquiry-table .col-image { grid-row: 1 / 4; }
	.swk-inquiry-table .col-action {
		grid-column: 2;
		text-align: right;
	}
}

/* ---------- Responsive: tablet & mobile ---------- */

/* Tablet portrait + small laptop (≤ 768px) */
@media (max-width: 768px) {
	.swk-inquiry-modal-dialog {
		max-width: calc(100% - 24px);
		margin: 2vh auto;
		padding: 20px;
		max-height: 96vh;
	}
	.swk-inquiry-success-dialog {
		max-width: calc(100% - 32px);
		margin: 4vh auto;
		padding: 24px 20px;
	}
	.swk-inquiry-modal-title { font-size: 19px; }
	.swk-country-dropdown { max-height: min(280px, 50vh); }
	.iti__country-list { max-height: min(240px, 50vh); }
}

/* Phone (≤ 480px) — go full-screen for max usable space */
@media (max-width: 480px) {
	.swk-inquiry-modal-dialog {
		max-width: 100%;
		margin: 0;
		padding: 16px;
		min-height: 100vh;
		max-height: 100vh;
		border-radius: 0;
	}
	.swk-inquiry-modal-close {
		top: 8px;
		right: 8px;
		font-size: 32px;
	}
	.swk-inquiry-modal-title {
		font-size: 17px;
		padding-right: 36px;
	}
	.swk-inquiry-modal-product {
		font-size: 13px;
		margin-bottom: 12px;
		padding-bottom: 8px;
	}
	.swk-field { margin-bottom: 10px; }
	.swk-field input[type=text],
	.swk-field input[type=email],
	.swk-field input[type=tel],
	.swk-field input[type=number],
	.swk-field textarea {
		font-size: 16px; /* prevents iOS Safari from zooming on focus */
	}
	.swk-country-trigger,
	.swk-phone-trigger {
		font-size: 14px;
		padding: 10px 11px;
		min-height: 44px; /* touch target */
	}
	.swk-phone-trigger {
		padding: 0 10px;
	}
	.swk-inquiry-submit {
		padding: 14px 20px;
		font-size: 16px;
		min-height: 48px;
	}
	.swk-inquiry-success-dialog {
		max-width: calc(100% - 24px);
		margin: 8vh auto;
		padding: 22px 18px;
	}
	.swk-country-dropdown { max-height: 60vh; }
	.swk-country-item { padding: 10px 12px; min-height: 44px; }
	.swk-file-row { flex-wrap: wrap; gap: 10px; }
	.swk-file-name { max-width: 100%; }

	/* Floating cart badge: smaller and out of the way of thumb-reachable area */
	.swk-inquiry-floating-badge {
		width: 46px;
		height: 46px;
		left: 14px;
		bottom: 18px;
	}

	/* Toast: full-width style at bottom */
	.swk-inquiry-toast {
		left: 12px;
		right: 12px;
		transform: translateY(40px);
		bottom: 20px;
		text-align: center;
	}
	.swk-inquiry-toast.is-show {
		transform: translateY(0);
	}
}


/* ==========================================================================
   目录条目支持（swk-catalog 插件来的条目，键形如 cat:123）
   ========================================================================== */

/*
 * 没有商品图时的占位块。
 * 用色块而不是留空：空单元格看起来像"图没加载出来"，客户会以为页面坏了。
 */
.swk-inquiry-ph {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	border-radius: 6px;
	background: #f0f2f5;
	border: 1px solid #e1e4e8;
	/* #8a94a0 对 #f0f2f5 约 3.1:1——图标是装饰性的，只需可辨，不承载信息 */
	color: #8a94a0;
}

.swk-inquiry-ph svg {
	width: 26px;
	height: 26px;
}

.swk-prod-row .swk-inquiry-ph {
	width: 36px;
	height: 36px;
	border-radius: 4px;
}

.swk-prod-row .swk-inquiry-ph svg {
	width: 18px;
	height: 18px;
}

/* ==========================================================================
   询价车列表：定高上下滚动
   ========================================================================== */

/*
 * 条目多了以后整张表会把下面的「Your Information」表单顶到屏幕外，
 * 客户得一路往下滚才找得到提交按钮。改成表格自己滚动，表单始终在视野内。
 */
.swk-inquiry-table-wrap {
	max-height: 60vh;
	overflow-y: auto;
	overscroll-behavior: contain;   /* 滚到底不要顺势把整页带着滚 */
	border: 1px solid #e1e4e8;
	border-radius: 8px;
	margin-bottom: 24px;
}

/* 包了一层容器后表格自身的外框会和容器的重叠成双线 */
.swk-inquiry-table-wrap .swk-inquiry-table {
	margin: 0;
	border: 0;
}

/*
 * 表头吸顶。下边线用 inset box-shadow 不用 border——
 * 表格多为 border-collapse:collapse，sticky 单元格的 border 滚动时会被行盖住。
 */
.swk-inquiry-table-wrap .swk-inquiry-table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: #f7f9fc;
	box-shadow: inset 0 -1px 0 #e1e4e8;
}

/* 手机端不做嵌套滚动：小窗口里再上下滚，手指很容易滚错层 */
@media (max-width: 767px) {
	.swk-inquiry-table-wrap {
		max-height: none;
		overflow: visible;
		border: 0;
		border-radius: 0;
	}
	.swk-inquiry-table-wrap .swk-inquiry-table thead th {
		position: static;
	}
}