/** Site-specific UI the original WordPress plugins rendered: search suggestions, toasts, favorites. */

/* ---------- live search dropdown ---------- */
.jet-ajax-search__results-area {
	box-shadow: 0 12px 30px rgba(0, 0, 0, .16);
	border-top: 3px solid #ff6c00;
	max-height: 70vh;
	overflow: auto;
}
.jet-ajax-search__results-area .jet-ajax-search__results-header { padding: 10px 15px 0; }
.jet-ajax-search__results-area .jet-ajax-search__results-count { background: none; border: 0; color: #777; font-size: 12px; text-transform: uppercase; letter-spacing: .5px; }
.jet-ajax-search__results-area .jet-ajax-search__results-list { padding: 5px 0 10px; }
.jet-ajax-search__results-area .jet-ajax-search__results-footer { padding: 10px 15px 15px; }
.jet-ajax-search__results-area .jet-ajax-search__full-results { background: #ff6c00; border: 0; color: #fff; padding: 8px 18px; border-radius: 3px; cursor: pointer; font-size: 13px; }
.jet-ajax-search__results-area .jet-ajax-search__full-results:hover { background: #e55f00; }
.jet-ajax-search__results-area .jet-ajax-search__message { padding: 15px; color: #777; font-size: 13px; }

.grd-suggest__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 15px;
	text-decoration: none;
	color: inherit;
	border-bottom: 1px solid #f0f0f0;
}
.grd-suggest__item:hover { background: #f7f9fb; }
.grd-suggest__thumb, .grd-suggest__thumb img { width: 50px; height: 50px; flex: 0 0 50px; object-fit: cover; border-radius: 3px; background: #fff; }
.grd-suggest__body { display: flex; flex-direction: column; min-width: 0; }
.grd-suggest__title { font-size: 13px; line-height: 1.35; color: #2b2b2b; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.grd-suggest__price { font-size: 13px; font-weight: 600; color: #ff6c00; margin-top: 3px; }

/* ---------- favorite button ---------- */
.grd-favorite {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	color: #5b6470;
	text-decoration: none;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
	transition: color .2s, transform .2s;
	cursor: pointer;
}
.grd-favorite:hover { color: #e02b2b; transform: translateY(-1px); }
.grd-favorite--on { color: #e02b2b; }
.grd-favorite--wide {
	position: static;
	width: auto;
	height: auto;
	border-radius: 3px;
	padding: 11px 24px;
	gap: 8px;
	background: #fff;
	border: 1px solid #d7dde4;
	color: #2b2b2b;
	box-shadow: none;
	font-size: 14px;
	line-height: 1.2;
}
.grd-favorite--wide:hover { border-color: #e02b2b; color: #e02b2b; transform: none; }
.grd-favorite--on.grd-favorite--wide { border-color: #e02b2b; background: #fff5f5; color: #e02b2b; }
.grd-favorite.grd-busy { opacity: .6; pointer-events: none; }
.grd-favorite__on { display: none; }
.grd-favorite--on .grd-favorite__on { display: inline; }
.grd-favorite--on .grd-favorite__off { display: none; }

/* product cards keep the heart pinned to the thumbnail */
.bdt-wc-product-image .grd-favorite,
.jet-woo-builder-archive-product-thumbnail__wrapper .grd-favorite {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 3;
}
.jet-woo-builder-archive-product-thumbnail__wrapper { position: relative; }

/* ---------- toasts ---------- */
#grd-toasts {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99999;
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-width: 320px;
}
.grd-toast {
	padding: 12px 18px;
	border-radius: 4px;
	color: #fff;
	font-size: 14px;
	line-height: 1.4;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
	opacity: 1;
	transform: translateY(0);
	transition: opacity .3s, transform .3s;
}
.grd-toast--success { background: #3f9c5c; }
.grd-toast--error { background: #d64545; }
.grd-toast--info { background: #203d5a; }
.grd-toast--out { opacity: 0; transform: translateY(8px); }


/* ---------- home: "New releases goods" list ----------
   Elementor gives .elementor-post__thumbnail a padding-bottom aspect box but leaves the
   <img> in normal flow, so each row renders about twice as tall as its content. Collapse
   that phantom padding, then let the list absorb the column's leftover height so the panel
   ends level with the carousel instead of overflowing it. */
@media (min-width: 1025px) {
	.elementor-42 .elementor-element.elementor-element-49a6568 > .elementor-element-populated {
		display: flex;
		flex-direction: column;
		height: 100%;
	}

	.elementor-42 .elementor-element.elementor-element-33c9dd1 {
		flex: 1 1 auto;
	}

	.elementor-42 .elementor-element.elementor-element-33c9dd1 .elementor-posts-container {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 100%;
	}

	.elementor-42 .elementor-element.elementor-element-33c9dd1 .elementor-post {
		align-items: center;
	}

	.elementor-42 .elementor-element.elementor-element-33c9dd1 .elementor-posts-container .elementor-post__thumbnail {
		padding-bottom: 0;
	}
}


/* ---------- home: "Enterprise certificate" gallery ----------
   Elementor Pro's widget handlers live in a webpack chunk that never finishes loading
   (verified on the source site too), so EGallery never runs and the grid collapses to 0px.
   Lay it out in CSS from the widget's own settings (3 columns, 30px gap, 3:2 tiles).
   If the JS ever does initialise it writes inline styles, which win over these rules. */
.elementor-42 .elementor-element.elementor-element-3a390f1 .elementor-gallery__container {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px;
}

.elementor-42 .elementor-element.elementor-element-3a390f1 .e-gallery-item {
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

.elementor-42 .elementor-element.elementor-element-3a390f1 .e-gallery-image {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: filter .3s;
}

.elementor-42 .elementor-element.elementor-element-3a390f1 .elementor-gallery-item__overlay {
	position: absolute;
	inset: 0;
}

.elementor-42 .elementor-element.elementor-element-3a390f1 .e-gallery-item:hover .e-gallery-image {
	transform: scale(1.06);
}

@media (max-width: 1024px) {
	.elementor-42 .elementor-element.elementor-element-3a390f1 .elementor-gallery__container {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}
}


/* ---------- home: "Video Library" slider ----------
   .rvs-item is absolutely positioned and gets its width only from an inline style the
   Element Pack script writes at init; when that pass is skipped the slide stays 0px wide,
   so the poster never paints (the image itself loads fine). app.js lays the slides out in
   that case; these rules keep the horizontal nav strip from clipping its cells. */
/* three "thumbnail + title" cells across the strip; the plugin paints the strip dark
   (#151515) with white labels, so only geometry is corrected here */
.elementor-42 .elementor-element.elementor-element-e14089f .rvs-nav-container a.rvs-nav-item {
	width: 33.3333%;
	height: 56px;
	padding: 5px 8px;
}

.elementor-42 .elementor-element.elementor-element-e14089f .rvs-nav-container span.rvs-nav-item-thumb {
	width: 48px;
	height: 40px;
	margin: 0 8px 0 0;
}

.elementor-42 .elementor-element.elementor-element-e14089f .rvs-nav-container .rvs-nav-item-title {
	margin: 2px 0 0;
	max-height: 40px;
	line-height: 14px;
	font-size: 12px;
	font-weight: 400;
}

/* ---------- /gallery/: the Elementor Pro gallery widget ----------
   Its container is only populated by e-gallery.min.js, which never runs here (the same
   dead element_ready path as the home certificates), so the grid is laid out with CSS
   using the widget's own settings: 6 columns, 15px gap, 3:2 tiles. */
.elementor-47 .elementor-element.elementor-element-6769ea9 .elementor-gallery__container {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 15px;
}

.elementor-47 .elementor-element.elementor-element-6769ea9 .e-gallery-item {
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

.elementor-47 .elementor-element.elementor-element-6769ea9 .e-gallery-image {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
}

.elementor-47 .elementor-element.elementor-element-6769ea9 .e-gallery-item.is-hidden {
	display: none;
}

/* The switcher panes are handled by bdt-uikit.css's own
   `.bdt-switcher > :not(.bdt-active){display:none}` - app.js moves `bdt-active`.
   The playlist's panes have no such counterpart: widget-video-playlist.min.css
   hides `.e-tabs-content-wrapper .e-tab-content` and leaves revealing the open one
   to the widget script that never runs, so `e-active` has to do it here. */
.elementor-widget-video-playlist .e-tabs-content-wrapper .e-tab-content.e-active {
	display: flex;
}

.elementor-47 .e-tab-content.is-hidden {
	display: none;
}

.elementor-47 .grd-playlist-video {
	width: 100%;
	max-height: 500px;
	background: #000;
}

@media (max-width: 1024px) {
	.elementor-47 .elementor-element.elementor-element-6769ea9 .elementor-gallery__container {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 10px;
	}
}

@media (max-width: 767px) {
	.elementor-47 .elementor-element.elementor-element-6769ea9 .elementor-gallery__container {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Blog 归档页右侧栏（ff56fa1）的分类、归档、最新文章三个列表：原站行距 22.5px 偏密，
   按要求加大。只作用于归档模板 2717 —— 单篇文章页（2753）保持与原站一致。 */
.elementor-2717 .elementor-element-ff56fa1 nav ul li {
	line-height: 1.9;
}

/* Product gallery: main image + thumbnail strip, driven by initWoothumbs() in app.js.
   main.min.css hides the images container with a 3-class selector until slick adds
   `.slick-initialized`, and it forces `__slide{display:block!important}`, so these
   overrides have to match that weight rather than merely come later. They are scoped to
   `.grd-woothumbs-fallback`, which app.js only puts on a wrap the plugin did not reach -
   unscoped they would also hide slick's own slides and collapse the gallery to 0 high. */
.iconic-woothumbs-all-images-wrap.grd-woothumbs-fallback .iconic-woothumbs-images__slide {
	display: none !important;
}

.iconic-woothumbs-all-images-wrap.grd-woothumbs-fallback .iconic-woothumbs-images__slide.grd-active {
	display: block !important;
}

.iconic-woothumbs-all-images-wrap .iconic-woothumbs-images__slide img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* only the fallback sizes the image itself; slick sets the slide and the plugin's own
   stylesheet then fits the image to it */
.iconic-woothumbs-all-images-wrap.grd-woothumbs-fallback .iconic-woothumbs-images__slide img {
	width: 100%;
}

/* Before slick tags the container, main.min.css keeps `.iconic-woothumbs-images` hidden.
   Our scripts are deferred so that only lifts at window load + the plugin's own handler,
   which leaves the gallery collapsed for a frame; showing the first slide until slick
   takes over keeps the pre-init box the same height as the final one. The original loads
   its scripts synchronously and never shows this gap. */
.iconic-woothumbs-images:not(.slick-initialized) {
	display: block !important;
}

.iconic-woothumbs-images:not(.slick-initialized) .iconic-woothumbs-images__slide {
	display: none !important;
}

.iconic-woothumbs-images:not(.slick-initialized) .iconic-woothumbs-images__slide:first-child {
	display: block !important;
}

.iconic-woothumbs-thumbnails__slide {
	cursor: pointer;
}

.iconic-woothumbs-thumbnails__slide--active .iconic-woothumbs-thumbnails__image-wrapper {
	border-color: #666;
}

/* Product data tabs: only the selected panel is visible (see initProductTabs in app.js).
   The tab strip's own look comes from WooCommerce's `ul.tabs li.active` rules. */
.woocommerce-tabs .woocommerce-Tabs-panel {
	display: none;
}

.woocommerce-tabs .woocommerce-Tabs-panel.grd-panel-active {
	display: block;
}

/* ---------------------------------------------------------------------------
   /join/ "Become Supplier" — laid out for this rebuild (the original site has no
   matching Elementor template), so this is our design rather than a 1:1 copy.
   Colours follow the kit tokens: primary #FF5C00, text #7A7A7A, secondary
   #54595F, plus the #DA2020 the header uses for hover. Body font is Arial 15px.
   --------------------------------------------------------------------------- */
.grd-join {
	color: #7a7a7a;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-size: 15px;
	line-height: 1.6;
}

.grd-join h1, .grd-join h2, .grd-join h3, .grd-join b {
	color: #333;
}

.grd-join a {
	color: #ff5c00;
}

.grd-join a:hover, .grd-join a:focus {
	color: #da2020;
}

.grd-join__crumbs .elementor-widget-wrap {
	padding: 20px 10px 0;
}

.grd-join__hero {
	background: linear-gradient(180deg, #fff6f1 0%, #ffffff 100%);
	border-bottom: 1px solid #f2e7e1;
}

.grd-join__hero .elementor-widget-wrap {
	padding: 56px 15px 44px;
	text-align: center;
}

.grd-join__eyebrow {
	color: #ff5c00;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .12em;
	margin: 0 0 10px;
	text-transform: uppercase;
}

.grd-join__h1 {
	font-size: 38px;
	font-weight: 700;
	line-height: 1.25;
	margin: 0 auto 14px;
	max-width: 820px;
}

.grd-join__lead {
	font-size: 16px;
	margin: 0 auto 26px;
	max-width: 780px;
}

.grd-join__actions {
	margin: 0 0 34px;
}

/* `.grd-join a` is (0,1,1), so the button rules have to carry the element too or an
   anchor button inherits link colour and turns orange-on-orange. */
.grd-join .grd-join__btn {
	background: #ff5c00;
	border: 2px solid #ff5c00;
	border-radius: 3px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 6px 10px;
	padding: 13px 30px;
	text-align: center;
	text-decoration: none;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.grd-join .grd-join__btn:hover, .grd-join .grd-join__btn:focus {
	background: #da2020;
	border-color: #da2020;
	color: #fff;
}

.grd-join .grd-join__btn--ghost {
	background: transparent;
	color: #333;
}

.grd-join .grd-join__btn--ghost:hover, .grd-join .grd-join__btn--ghost:focus {
	background: transparent;
	border-color: #da2020;
	color: #da2020;
}

.grd-join .grd-join__btn--block {
	display: block;
	margin: 0;
	padding: 14px 24px;
	width: 100%;
}

.grd-join .grd-join__btn--invert {
	background: #fff;
	border-color: #fff;
	color: #ff5c00;
}

.grd-join .grd-join__btn--invert:hover, .grd-join .grd-join__btn--invert:focus {
	background: transparent;
	border-color: #fff;
	color: #fff;
}

.grd-join__stats {
	border-top: 1px solid #f2e0d7;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 26px 0 0;
}

.grd-join__stats li {
	flex: 0 1 200px;
	padding: 0 14px;
}

.grd-join__stats li + li {
	border-left: 1px solid #f2e0d7;
}

.grd-join__stat-num {
	color: #ff5c00;
	display: block;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
}

.grd-join__stat-label {
	display: block;
	font-size: 13px;
}

.grd-join__benefits .elementor-widget-wrap,
.grd-join__main .elementor-widget-wrap {
	padding: 52px 15px;
}

.grd-join__h2 {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 22px;
}

.grd-join__col-left .grd-join__h2:not(:first-child) {
	margin-top: 44px;
}

.grd-join__cards {
	display: grid;
	gap: 22px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.grd-join__card {
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 5px;
	padding: 28px 24px;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.grd-join__card:hover {
	border-color: #ffd0b5;
	box-shadow: 0 8px 26px rgba(0, 0, 0, .07);
}

.grd-join__icon {
	align-items: center;
	background: #fff1e8;
	border-radius: 50%;
	color: #ff5c00;
	display: inline-flex;
	font-size: 22px;
	height: 54px;
	justify-content: center;
	margin-bottom: 16px;
	width: 54px;
}

.grd-join__card-title {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 8px;
}

.grd-join__card-text {
	font-size: 14px;
	margin: 0;
}

.grd-join__cols {
	align-items: start;
	display: grid;
	gap: 46px;
	grid-template-columns: minmax(0, 1.55fr) minmax(320px, .9fr);
}

.grd-join__steps {
	list-style: none;
	margin: 0;
	padding: 0;
}

.grd-join__step {
	margin: 0 0 18px;
	padding: 0 0 0 52px;
	position: relative;
}

.grd-join__step-num {
	background: #ff5c00;
	border-radius: 50%;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	height: 34px;
	left: 0;
	line-height: 34px;
	position: absolute;
	text-align: center;
	top: 0;
	width: 34px;
}

.grd-join__ticks {
	list-style: none;
	margin: 0;
	padding: 0;
}

.grd-join__ticks li {
	margin: 0 0 12px;
	padding: 0 0 0 28px;
	position: relative;
}

.grd-join__ticks i {
	color: #ff5c00;
	left: 0;
	position: absolute;
	top: 4px;
}

.grd-join__faq {
	border-top: 1px solid #ececec;
}

.grd-join__qa {
	border-bottom: 1px solid #ececec;
}

.grd-join__qa > summary {
	color: #333;
	cursor: pointer;
	font-size: 16px;
	font-weight: 700;
	list-style: none;
	padding: 15px 26px 15px 0;
	position: relative;
}

.grd-join__qa > summary::-webkit-details-marker {
	display: none;
}

.grd-join__qa > summary:after {
	color: #ff5c00;
	content: "+";
	font-size: 20px;
	line-height: 1;
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
}

.grd-join__qa[open] > summary:after {
	content: "\2212";
}

.grd-join__qa p {
	margin: 0 0 16px;
	padding-right: 20px;
}

.grd-join__form {
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 6px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
	padding: 30px 28px;
	position: sticky;
	top: 20px;
}

.grd-join__form-title {
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 6px;
	padding-bottom: 14px;
	position: relative;
}

.grd-join__form-title:after {
	background: #ff5c00;
	content: "";
	height: 3px;
	left: 0;
	position: absolute;
	bottom: 0;
	width: 46px;
}

.grd-join__form-note {
	font-size: 14px;
	margin: 0 0 18px;
}

.grd-join__form .form-row {
	margin: 0 0 16px;
}

.grd-join__form label {
	color: #54595f;
	display: block;
	font-size: 14px;
	font-weight: 700;
	margin-bottom: 6px;
}

.grd-join__form .required {
	color: #da2020;
}

.grd-join__form .input-text {
	background: #fff;
	border: 1px solid #dcdcdc;
	border-radius: 3px;
	box-sizing: border-box;
	color: #333;
	font-family: inherit;
	font-size: 15px;
	line-height: 1.5;
	padding: 11px 12px;
	width: 100%;
}

.grd-join__form textarea.input-text {
	min-height: 132px;
	resize: vertical;
}

.grd-join__form .input-text:focus {
	border-color: #ff5c00;
	box-shadow: 0 0 0 3px rgba(255, 92, 0, .12);
	outline: none;
}

.grd-join__hp {
	height: 1px;
	left: -9999px !important;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
}

.grd-join__privacy {
	font-size: 12px;
	line-height: 1.5;
	margin: 14px 0 0;
}

.grd-join__signin {
	border-top: 1px solid #f0f0f0;
	font-size: 14px;
	margin: 18px 0 0;
	padding-top: 16px;
}

.grd-join__help {
	background: #fafafa;
	border: 1px solid #ececec;
	border-radius: 6px;
	margin-top: 22px;
	padding: 22px 24px;
}

.grd-join__help-title {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 12px;
}

.grd-join__help-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.grd-join__help-list li {
	margin: 0 0 8px;
}

.grd-join__help-list li:last-child {
	margin-bottom: 0;
}

.grd-join__help-list i {
	color: #ff5c00;
	width: 20px;
}

/* A full-width orange band would sit flush against the site's own orange footer
   strip and read as one block, so the closing call-to-action is a warm card. */
.grd-join__cta .elementor-widget-wrap {
	align-items: center;
	background: #fff6f1;
	border: 1px solid #ffd0b5;
	border-radius: 6px;
	display: flex;
	flex-wrap: wrap;
	gap: 18px 26px;
	justify-content: center;
	margin: 0 15px 56px;
	padding: 30px 26px;
}

.grd-join__cta-text {
	color: #333;
	font-size: 22px;
	font-weight: 700;
	margin: 0;
}

@media (max-width: 1024px) {
	.grd-join__cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.grd-join__cols {
		grid-template-columns: minmax(0, 1fr);
		gap: 34px;
	}

	.grd-join__form {
		position: static;
	}

	.grd-join__h1 {
		font-size: 32px;
	}
}

@media (max-width: 767px) {
	.grd-join__hero .elementor-widget-wrap {
		padding: 36px 15px 30px;
	}

	.grd-join__h1 {
		font-size: 27px;
	}

	.grd-join__h2 {
		font-size: 22px;
	}

	.grd-join__cards {
		grid-template-columns: minmax(0, 1fr);
	}

	.grd-join__stats li {
		flex: 0 1 50%;
		padding: 10px 0;
	}

	.grd-join__stats li:nth-child(odd) {
		border-left: 0;
	}

	.grd-join__form {
		padding: 24px 18px;
	}
}

/* application status panel + two-up fields on /join/ */
.grd-join__status {
	margin: 0 0 14px;
	padding: 14px 16px;
	border-radius: 4px;
	font-size: 14px;
	line-height: 1.7;
}

.grd-join__status--pending {
	background: #fff6f1;
	border: 1px solid #ffd0b5;
	color: #9c4a17;
}

.grd-join__status--ok {
	background: #f0f9f1;
	border: 1px solid #bfe3c4;
	color: #1e6b3a;
}

.grd-join__status--err {
	background: #fdecea;
	border: 1px solid #f5c2bd;
	color: #9b2c22;
}

.grd-join__pair {
	display: flex;
	flex-wrap: wrap;
	gap: 0 14px;
}

.grd-join .form-row-half {
	flex: 1 1 150px;
	min-width: 140px;
}

/* ---- 页头右侧 Sign In / Join Free（头部模板 37 的 col-20 内两枚按钮 widget） ----
   原站给第一枚 -4px 下外边距，两枚又各自换行，两行文字只隔 7px。
   用户 2026-10-16 要求拉开：去掉负边距，用 row-gap 控制行距。
   选择器必须带上 .elementor-element 才与 post-37.css 的 (0,4,0) 打平（app.css 在后加载才压得住）。 */
.elementor-37 .elementor-element.elementor-element-5b0da40d .elementor-widget-wrap {
	align-content: center;
	row-gap: 3px;
}

.elementor-37 .elementor-element.elementor-element-c0479c4 {
	margin-bottom: 0;
}

.elementor-37 .elementor-element.elementor-element-c0479c4 .elementor-button,
.elementor-37 .elementor-element.elementor-element-fb909d6 .elementor-button {
	font-size: 13px;
	line-height: 1.5;
}

/* ---- 前台账号页 /register/ 与 /sign-in/（本站自研版式，原站是插件短代码裸表单） ----
   原来两枚 form-row 之间只隔几像素、成对字段还是竖排，这里改成卡片 + 两列栅格。 */
.grd-auth {
	max-width: 660px;
	margin: 40px auto 80px;
	padding: 30px 34px 26px;
	border: 1px solid #e3e8ef;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 6px 22px rgba(20, 40, 70, .06);
}

.grd-auth--narrow { max-width: 480px; }

.grd-auth h2 { margin: 0 0 6px; color: #16222e; font-size: 26px; font-weight: 600; }

.grd-auth__lead { margin: 0 0 22px; color: #6b7787; font-size: 14px; }

.grd-auth .woocommerce-error,
.grd-auth .woocommerce-message { margin: 0 0 18px; padding: 11px 14px; border-radius: 4px; font-size: 14px; }

.grd-auth .woocommerce-error { border: 1px solid #f5c2bd; background: #fdecea; color: #9b2c22; }

.grd-auth .woocommerce-message { border: 1px solid #b7e2c4; background: #e7f6ec; color: #1e6b3a; }

/* WooCommerce 给 notice 用绝对定位的 ::before 图标，并把文字用 padding-left 让位；
   我们自己的框改了 padding，图标就会压在首字上，直接去掉。 */
.grd-auth .woocommerce-error::before,
.grd-auth .woocommerce-message::before,
.grd-store .woocommerce-error::before,
.grd-store .woocommerce-message::before,
.grd-join .woocommerce-error::before,
.grd-join .woocommerce-message::before { display: none; }

.grd-auth form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 18px;
}

.grd-auth .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0; }

.grd-auth .form-row-wide,
.grd-auth .form-row--submit,
.grd-auth .form-row--foot { grid-column: 1 / -1; }

.grd-auth .form-row > label { margin: 0; color: #46535f; font-size: 13px; font-weight: 600; }

.grd-auth .form-row .required { color: #c0392b; }

.grd-auth .form-row .input-text {
	box-sizing: border-box;
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #c6d0db;
	border-radius: 4px;
	background: #fff;
	color: #2b3440;
	font-size: 14px;
}

.grd-auth .form-row .input-text:focus { border-color: #1266ab; outline: 0; box-shadow: 0 0 0 3px rgba(18, 102, 171, .12); }

.grd-auth .form-row--check > label { flex-direction: row; align-items: center; gap: 8px; color: #2b3440; font-size: 14px; font-weight: 400; }

.grd-auth .form-row--check input { width: auto; }

.grd-auth .form-row--submit { align-items: flex-start; }

.grd-auth .form-row--submit .elementor-button {
	display: inline-block;
	width: auto;
	padding: 12px 34px;
	border: 0;
	border-radius: 4px;
	background: #0d3b66;
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	cursor: pointer;
}

.grd-auth .form-row--submit .elementor-button:hover { background: #0a2f52; color: #fff; text-decoration: none; }

.grd-auth .form-row--foot { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 0 8px; color: #46535f; font-size: 14px; }

.grd-auth .form-row--foot a { color: #0d3b66; font-weight: 600; }

.grd-auth__aside { margin: 22px 0 0; padding-top: 16px; border-top: 1px solid #eef2f7; color: #6b7787; font-size: 13px; }

.grd-auth__aside a { color: #0d3b66; font-weight: 600; }

@media (max-width: 600px) {
	.grd-auth { margin: 20px 12px 48px; padding: 22px 18px; }
	.grd-auth form { grid-template-columns: 1fr; }
}

/* ---- 供应商店铺页 /stores-list/{slug}/ ----
   插件 CSS 把 badges 容器设成 position:absolute + max-width:105px，评分/粉丝/关注/联系按钮挤在一起
   并压到下面的标签栏上；标签面板又曾被写进产品面板内部。这里把头部改成左右两栏、
   badges 回到文档流，面板由 .marketking_tab / .marketking_tab_active 控制显隐。 */
.grd-store #marketking_vendor_store_page_header {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px 24px;
	width: auto;
	height: auto;
	min-height: 214px;
	margin: 0 0 22px;
	padding: 18px 20px;
	border: 1px solid #e6ebf1;
	border-radius: 8px;
	background: #fff;
	overflow: visible;
}

.grd-store #marketking_vendor_store_page_profile {
	position: static;
	flex: 0 0 200px;
	margin: 0;
	text-align: center;
}

/* Logo 比例不可控（多为横长条），用 contain 保证整张都看得见，不被方框裁掉 */
.grd-store #marketking_vendor_store_page_profile_pic img {
	box-sizing: border-box;
	width: 120px;
	height: 120px;
	padding: 8px;
	object-fit: contain;
	border: 1px solid #e6ebf1;
	border-radius: 6px;
	background: #fff;
}

.grd-store div#marketking_vendor_store_page_profile_name {
	max-width: none;
	max-height: none;
	margin: 10px 0 4px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
}

.grd-store div#marketking_vendor_page_badges_container {
	position: static;
	max-width: none;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 4px 10px;
	color: #6b7787;
	font-size: 13px;
}

.grd-store .grd-store__follow { margin: 12px 0 0; }

.grd-store .grd-store__follow form { display: inline; }

.grd-store #marketking_vendor_store_page_banner {
	flex: 1 1 420px;
	width: auto;
	min-height: 200px;
	border-left: 0;
	border-radius: 6px;
	background-color: #f3f6f9;
}

.grd-store .marketking_tabclass {
	margin: 0 0 6px;
	padding: 0 0 10px;
	border-bottom: 1px solid #e6ebf1;
}

.grd-store .marketking_tabclass button.marketking_tablinks {
	background: #f3f6f9;
	color: #46535f;
	font-size: 14px;
}

.grd-store .marketking_tabclass .marketking_tabclass_left button.marketking_tablinks.active,
.grd-store .marketking_tabclass button.marketking_tablinks.active {
	background: #0d3b66 !important;
	color: #fff !important;
}

.grd-store .marketking_tabclass_right button.marketking_tablinks {
	background: transparent;
	border: 1px solid #c9d4e0 !important;
	color: #0d3b66;
}

.grd-store .marketking_tab h3 { margin: 6px 0 16px; font-size: 20px; }

.grd-store .grd-store__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 14px 20px;
	margin: 0 0 22px;
	padding: 16px 18px;
	border: 1px solid #e6ebf1;
	border-radius: 6px;
	background: #fafcfe;
}

.grd-store .grd-store__facts div { min-width: 0; }

.grd-store .grd-store__facts dt { color: #6b7787; font-size: 12px; }

.grd-store .grd-store__facts dd { margin: 3px 0 0; color: #2b3440; font-size: 14px; word-break: break-word; }

.grd-store .grd-store__desc { max-width: 780px; color: #3f4c5c; font-size: 14px; line-height: 1.75; }

.grd-store .grd-store__form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 18px;
	max-width: 720px;
}

.grd-store .grd-store__form .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0; }

.grd-store .grd-store__form .form-row-wide,
.grd-store .grd-store__form .form-row--submit { grid-column: 1 / -1; }

.grd-store .grd-store__form .form-row--submit { align-items: flex-start; }

/* 未登录时「+ Follow」是 <a>，插件的规则只匹配 button */
.grd-store .marketking_vendor_follow a.marketking_follow_button {
	display: inline-block;
	min-width: 110px;
	padding: 3px 17px;
	border: 1px solid #d6d6d6;
	border-radius: 20px;
	background: #fff;
	color: #272a2c;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.618;
	text-transform: none;
}

.grd-store .marketking_vendor_follow a.marketking_follow_button:hover {
	background: #272a2c;
	color: #fff;
	text-decoration: none;
}

.grd-store .grd-store__form .form-row > label { color: #46535f; font-size: 13px; font-weight: 600; }

.grd-store .grd-store__form .required { color: #c0392b; }

.grd-store .grd-store__form input[type=text],
.grd-store .grd-store__form input[type=email],
.grd-store .grd-store__form textarea {
	box-sizing: border-box;
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #c6d0db;
	border-radius: 4px;
	font-size: 14px;
}

.grd-store .grd-store__form textarea { min-height: 130px; }

.grd-store .grd-store__form input:focus,
.grd-store .grd-store__form textarea:focus { border-color: #1266ab; outline: 0; box-shadow: 0 0 0 3px rgba(18, 102, 171, .12); }

.grd-store .woocommerce-error,
.grd-store .woocommerce-message { margin: 0 0 18px; padding: 11px 14px; border-radius: 4px; font-size: 14px; }

.grd-store .woocommerce-error { border: 1px solid #f5c2bd; background: #fdecea; color: #9b2c22; }

.grd-store .woocommerce-message { border: 1px solid #b7e2c4; background: #e7f6ec; color: #1e6b3a; }

@media (max-width: 767px) {
	.grd-store #marketking_vendor_store_page_banner { min-height: 140px; }
	.grd-store .grd-store__form { grid-template-columns: 1fr; }
}

/* ---- /privacy-policy/ 正文（本站自研版式；原站该页是 Elementor Canvas，无页头页脚） ---- */
.grd-legal {
	max-width: 860px;
	margin: 36px auto 80px;
	padding: 34px 40px 30px;
	border: 1px solid #e3e8ef;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 6px 22px rgba(20, 40, 70, .06);
	color: #33404d;
	font-size: 15px;
	line-height: 1.8;
}

.grd-legal h1 { margin: 0 0 4px; color: #16222e; font-size: 30px; font-weight: 600; line-height: 1.3; }

.grd-legal__meta { margin: 0 0 22px; padding-bottom: 18px; border-bottom: 1px solid #eef2f7; color: #8a97a6; font-size: 13px; }

.grd-legal h2 { margin: 26px 0 10px; color: #16222e; font-size: 19px; font-weight: 600; }

.grd-legal p { margin: 0 0 14px; }

.grd-legal ul { margin: 0 0 14px; padding-left: 22px; list-style: disc; }

.grd-legal li { margin: 0 0 8px; padding-left: 4px; }

.grd-legal a { color: #0d3b66; font-weight: 600; }

@media (max-width: 767px) {
	.grd-legal { margin: 16px 12px 48px; padding: 22px 18px; }
}

/* ---- Suppliers 列表页 /stores-list/（本站自研卡片，替代 MarketKing 的 vendors 表格） ----
   表格版带着插件生成的 “Show N entries / Search:” 控件与一个空的分类下拉，
   在本站没有对应后端，卡片版一并去掉。 */
/* 导语一行放得下就不折行：max-content 让盒子收缩到文字宽度，max-width:100% 保证
   容器变窄时仍然换行，不会像 white-space:nowrap 那样把页面顶出横向滚动条。 */
.grd-stores__lead { margin: 0 0 22px; max-width: 100%; width: max-content; color: #6b7787; font-size: 14px; }

.grd-stores__empty { margin: 0; padding: 26px; border: 1px dashed #d7dfe8; border-radius: 8px; background: #fff; color: #6b7787; font-size: 14px; }

.grd-stores__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.grd-store-card {
	display: flex;
	flex-direction: column;
	padding: 20px;
	border: 1px solid #e6ebf1;
	border-radius: 8px;
	background: #fff;
	transition: box-shadow .18s ease, border-color .18s ease;
}

.grd-store-card:hover { border-color: #cfd9e4; box-shadow: 0 8px 22px rgba(20, 40, 70, .08); }

.grd-store-card__logo {
	display: block;
	width: 76px;
	height: 76px;
	margin: 0 0 12px;
	overflow: hidden;
	border: 1px solid #eef2f7;
	border-radius: 6px;
	background: #f7f9fb;
}

.grd-store-card__logo img { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 7px; object-fit: contain; }

.grd-store-card__name { margin: 0 0 8px; font-size: 17px; font-weight: 600; line-height: 1.4; }

.grd-store-card__name a { color: #16222e; }

.grd-store-card__name a:hover { color: #0d3b66; text-decoration: none; }

.grd-store-card__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px 12px;
	margin: 0 0 10px;
	color: #6b7787;
	font-size: 12.5px;
}

.grd-store-card__stars { display: inline-flex; align-items: center; gap: 1px; color: #f0a500; }

.grd-store-card__stars .dashicons { width: 14px; height: 14px; font-size: 14px; line-height: 14px; }

.grd-store-card__stars b { margin-left: 4px; color: #46535f; font-size: 12.5px; }

.grd-store-card__stars--none { color: #a7b2bf; font-style: italic; }

.grd-store-card__place { display: flex; align-items: center; gap: 5px; margin: 0 0 10px; color: #46535f; font-size: 13px; }

.grd-store-card__place .dashicons { width: 16px; height: 16px; font-size: 16px; color: #94a2b2; }

.grd-store-card__desc {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
	margin: 0 0 10px;
	color: #5b6875;
	font-size: 13px;
	line-height: 1.65;
}

.grd-store-card__company { margin: 0; color: #8a97a6; font-size: 12px; }

.grd-store-card__acts {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: auto 0 0;
	padding-top: 16px;
}

.grd-store-card__acts form { margin: 0; }

.grd-store-card__follow,
.grd-store-card__visit {
	display: inline-block;
	padding: 8px 16px;
	border: 1px solid #0d3b66;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	cursor: pointer;
}

.grd-store-card__follow { background: #fff; color: #0d3b66; }

.grd-store-card__follow:hover { background: #eef3f8; text-decoration: none; }

.grd-store-card__follow.is-following { border-color: #1e6b3a; background: #e7f6ec; color: #1e6b3a; }

.grd-store-card__visit { border: 0; background: #0d3b66; color: #fff; }

.grd-store-card__visit:hover { background: #0a2f52; color: #fff; text-decoration: none; }

@media (max-width: 599px) {
	.grd-stores__grid { grid-template-columns: 1fr; }
}

/* 店铺列表 / 详情两页的 .page-header 是本站自己输出的（主题只给了下边距），
   不加顶部留白会贴住吸顶的橙色搜索条。 */
body.marketking_stores_page_all .page-header,
body.marketking_store_page_individual .page-header {
	margin-top: 32px;
}

/* ---- 产品详情页（单篇模板 2115 / 侧栏模板 2192）----
   1) 标签条原本撑满整列，右侧留一大片空白；改成按内容收窄。
   2) 侧栏「Contact Supplier」里的供应商 Logo 多为横长条，60×60 方框 + cover 会裁掉上下；
      用 contain 让整张图可见。
   3) 侧栏 Contact Supplier 卡片：Elementor 的 sticky 依赖 element_ready（本站不派发），
      所以 data-settings 里的 sticky 从来没生效。侧栏列被 flex 拉伸到与主栏等高
      （实测侧栏列 2061px、卡片 244px，所以 CSS sticky 就够，不需要 JS），用 CSS sticky 即可实现「滚过顶部后贴边悬浮」。 */
.woocommerce-tabs ul.tabs {
	display: inline-flex;
	align-items: flex-end;
	gap: 4px;
	padding: 0;
}

.woocommerce-tabs ul.tabs li { display: block; }

.elementor-2115 .elementor-element.elementor-element-1399714 .elementor-author-box__avatar img,
.elementor-2192 .elementor-element.elementor-element-a343733 .elementor-author-box__avatar img {
	box-sizing: border-box;
	padding: 5px;
	object-fit: contain;
	background: #fff;
}

.elementor-2115 .elementor-element.elementor-element-60f1860 {
	position: sticky;
	top: 80px;
	z-index: 5;
}

@media (max-width: 1024px) {
	/* 平板/手机下侧栏变成整行，悬浮会把卡片钉在屏幕上挡住内容 */
	.elementor-2115 .elementor-element.elementor-element-60f1860 { position: static; }
}

/* ---- Quick View 弹窗（产品列表卡片上的按钮，原站是 JetEngine popup 模板） ---- */
.grd-qv-open { overflow: hidden; }

.grd-qv { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; }

.grd-qv__overlay { position: absolute; inset: 0; background: rgba(16, 26, 38, .58); }

.grd-qv__card {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
	gap: 22px;
	max-width: 760px;
	width: 100%;
	max-height: 86vh;
	overflow: auto;
	padding: 26px 26px 22px;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 22px 60px rgba(10, 20, 35, .3);
}

/* 主题的 button 重置带 padding:8px 16px，会把 × 顶偏；这里全部显式归零并居中 */
.grd-qv__x {
	position: absolute;
	top: 10px;
	right: 12px;
	display: grid;
	place-items: center;
	box-sizing: border-box;
	width: 34px;
	height: 34px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #f1f5f9;
	color: #2b3440;
	font-family: inherit;
	font-size: 20px;
	font-weight: 400;
	line-height: 1;
	text-indent: 0;
	text-align: center;
	cursor: pointer;
}

.grd-qv__x:hover { background: #e2e8f0; }

.grd-qv__media { display: flex; align-items: flex-start; justify-content: center; }

.grd-qv__media img {
	max-width: 100%;
	max-height: 300px;
	border: 1px solid #eef2f7;
	border-radius: 8px;
	background: #fff;
	object-fit: contain;
}

.grd-qv__title { margin: 0 0 8px; padding-right: 28px; font-size: 20px; font-weight: 600; line-height: 1.35; }

.grd-qv__title a { color: #16222e; }

.grd-qv__price { margin: 0 0 12px; color: #da2020; font-size: 19px; font-weight: 600; }

.grd-qv__excerpt { margin: 0 0 14px; color: #5b6875; font-size: 13.5px; line-height: 1.75; }

.grd-qv__vendor { margin: 0 0 16px; color: #6b7787; font-size: 13px; }

.grd-qv__vendor a { color: #0d3b66; font-weight: 600; }

.grd-qv__acts { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 0; }

.grd-qv .grd-qv__acts a.add_to_cart_button,
.grd-qv .grd-qv__acts a.add_to_cart_button:hover {
	border: 0;
	border-radius: 4px;
	padding: 11px 22px;
	background: #da2020;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	text-decoration: none;
}

.grd-qv .grd-qv__acts a.add_to_cart_button:hover { background: #b81a1a; }

.grd-qv__more { color: #0d3b66; font-size: 14px; font-weight: 600; }

@media (max-width: 680px) {
	.grd-qv__card { grid-template-columns: 1fr; padding: 20px; }
	.grd-qv__media img { max-height: 220px; }
}

/* 描述选项卡：正文一行 1058px 太长，而插图最大只有 750~800px 且被 aligncenter 居中，
   文字与图片左右边对不齐。把正文收到插图宽度，图片按原尺寸左对齐（超过栏宽才缩），
   两者共用同一条左右边线。 */
#tab-description .product { max-width: 760px; }

#tab-description .product img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin-left: 0;
	margin-right: 0;
}


/* 最小起订量 + 产品属性栏：后台「产品」里可编辑，原站没有这两块。
   按截图位置塞进价格分隔线下方与 Categories/Vendor 下方，不新增 Elementor 元素，
   免得每页 CSS 里查不到对应的 .elementor-element-* 规则。 */
.elementor-2115 .elementor-element-2fae7af .grd-moq {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px 10px;
	margin: 0 0 14px;
	font-size: 15px;
	line-height: 1.5;
}

.elementor-2115 .elementor-element-2fae7af .grd-moq__label { color: #7a8694; }

.elementor-2115 .elementor-element-2fae7af .grd-moq__value { color: #da2020; font-size: 17px; }

.elementor-2115 .elementor-element-1fca056 .grd-specs {
	width: 100%;
	margin: 18px 0 0;
	border-collapse: collapse;
	table-layout: fixed;
	background: #fff;
	font-size: 14px;
}

.elementor-2115 .elementor-element-1fca056 .grd-specs th,
.elementor-2115 .elementor-element-1fca056 .grd-specs td {
	padding: 10px 14px;
	border: 1px solid #e6eaf0;
	text-align: left;
	vertical-align: top;
	line-height: 1.6;
	/* shop_attributes 自带 td{font-style:italic} 与奇偶行底色，这里要盖掉 */
	font-weight: 400;
	font-style: normal;
	background: #fff;
	color: #4b5563;
	word-break: break-word;
}

.elementor-2115 .elementor-element-1fca056 .grd-specs th {
	width: 34%;
	background: #f6f8fa;
	color: #2b3440;
	font-weight: 600;
}


/* ---- 产品卡片标题固定两行（首页 .bdt-wc-product-title / 产品列表 .jet-woo-builder-archive-product-title）
   原站靠 Element Pack 的 data-bdt-height-match 脚本把卡片拉等高，该脚本依赖 element_ready，
   本站不派发这个事件，所以标题一行到五行不等、卡片高参差。这里用两行截断 + 固定两行高，
   长的省略号截断、短的空出第二行，同一行卡片自然等高。line-height 取原值（1.2 / 1.6），
   高度用 em 写，字体大小不同的两组卡片（首页 11px 与 12px）都能对上。 ---- */
.elementor-42 .bdt-wc-products .bdt-wc-product .bdt-wc-product-title {
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	overflow: hidden;
	line-height: 1.2;
	height: 2.4em;
	/* 这个 h3 自带 padding-bottom:6px，而 overflow:hidden 是按 padding-box 裁的，
	   留着它第三行会从内边距里漏出来。改成等值外边距，裁剪就正好卡在两行。 */
	padding-bottom: 0;
	margin-bottom: 6px;
	box-sizing: content-box;
}

.elementor-1835 .jet-woo-builder-archive-product-title {
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	overflow: hidden;
	line-height: 1.6;
	height: 3.2em;
}

/* 列表卡片价格下的最小起订量：没有值也占一行，保证卡片等高 */
.elementor-1835 .grd-card-moq {
	margin: 2px 0 0;
	min-height: 20px;
	color: #7a8694;
	font-size: 13px;
	line-height: 1.5;
}

.elementor-1835 .grd-card-moq__value { color: #33404d; }


/* 列表侧栏「You May Need」：像 N,O-BIS(TRIMETHYLSILYL)TRIFLUOROACETAMIDE(BSTFA)
   这种整段无空格的标题，.bdt-content 作为 flex 子项默认 min-width:auto，
   收缩不到比这个长词更窄，于是文字越过侧栏压到右侧商品网格上。
   放开 min-width 并让长词内部可断行。 */
.elementor-1835 .bdt-item-wrap .bdt-content {
	min-width: 0;
	flex-grow: 1;
}

.elementor-1835 .bdt-item-wrap .bdt-title {
	overflow-wrap: anywhere;
	word-break: break-word;
}


/* ---- 产品详情侧栏动作区：加入购物车 + Contact Now + 即时沟通 ----
   原站那块红底不是按钮本身，而是 widget 容器（.elementor-button 是透明的），
   现在容器里多了一个加购按钮，所以把红底从容器挪到按钮上，两个按钮各占一行。 */
.elementor-2115 .elementor-element.elementor-element-9551cca > .elementor-widget-container,
.elementor-2115 .elementor-element.elementor-element-d253b4a > .elementor-widget-container,
.elementor-2115 .elementor-element.elementor-element-9551cca:hover > .elementor-widget-container,
.elementor-2115 .elementor-element.elementor-element-d253b4a:hover > .elementor-widget-container {
	background-color: transparent;
	padding: 0;
	border-radius: 0;
}

.elementor-2115 .elementor-widget-wc-add-to-cart .elementor-button-wrapper {
	display: grid;
	gap: 10px;
}

.elementor-2115 .elementor-widget-wc-add-to-cart .elementor-button-wrapper > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 10px;
	border-radius: 3px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
}

.elementor-2115 .elementor-widget-wc-add-to-cart a.add_to_cart_button,
.elementor-2115 .elementor-widget-wc-add-to-cart a.add_to_cart_button:hover {
	background: #ec6060;
	border: 0;
	color: #fff;
	text-decoration: none;
}

.elementor-2115 .elementor-widget-wc-add-to-cart a.add_to_cart_button:hover { background: #e80707; }

.elementor-2115 .elementor-widget-wc-add-to-cart a.elementor-button.grd-btn-alt,
.elementor-2115 .elementor-widget-wc-add-to-cart a.elementor-button.grd-btn-alt:hover {
	background: #fff;
	box-shadow: inset 0 0 0 1px #ec6060;
	color: #d94040;
}

.elementor-2115 .elementor-widget-wc-add-to-cart a.elementor-button.grd-btn-alt:hover { background: #fdf2f2; }


/* 「Contact Now」改为滚到本页询价表单，别让吸顶的橙色搜索条盖住表单标题 */
.elementor-2115 #form_productpage { scroll-margin-top: 92px; }


/* ---- 店铺页产品卡：标题固定两行、加购按钮居中 ----
   标题原本整段铺开，一行到四行不等，卡片高矮不齐；line-height 取原值 18px/15px=1.2，
   高度用 em 写两行，短标题也占满两行。按钮是 li 里唯一的块级后续元素，
   改成 block + auto 外边距居中，不动 li 的 text-align，免得把标题一起居中。 */
.grd-store ul.products li.product .woocommerce-loop-product__title {
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	overflow: hidden;
	line-height: 1.2;
	height: 2.4em;
	/* 同上：标题自带 7.5px 上下内边距，会让第三行从 padding-box 里漏出来，
	   换成等值外边距，两行裁干净，卡片上下留白不变。 */
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 7.5px;
	margin-bottom: 7.5px;
	box-sizing: content-box;
}

.grd-store ul.products li.product a.add_to_cart_button {
	display: block;
	width: max-content;
	max-width: 100%;
	margin: 10px auto 0;
	text-align: center;
}

/* 有一张产品图是 800×744 而非正方形，按固有比例渲染就只有 221px 高，
   整张卡比同行矮 17px。锁成 1:1 方框；用 contain 而不是 cover，避免裁掉产品图。 */
.grd-store ul.products li.product img {
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background: #fff;
}


/* ---- 产品列表卡片的 Quick View 按钮移到产品图正中 ----
   原站这个按钮靠 Element Pack 的 motion effect 定位：--ep-effect-trans-y-normal:100px
   把它整体下移 100px，hover 时再由脚本移到 -195px（压在图上）。本站不跑 Element Pack
   那套脚本（element_ready 不派发），于是它常驻在下移 100px 的位置，正好压在产品名称上。
   这里不再用位移，改成绝对定位铺满产品图那一格（图是 1:1 且占满栏宽，所以同一正方形
   区域就是图本身），按钮居中浮在图上；wrapper 用 pointer-events:none 让空白处照常点击。 */
.elementor-1832 .elementor-column > .elementor-widget-wrap {
	position: relative;
}

.elementor-1832 .elementor-element.elementor-element.elementor-element-079018a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1 / 1;
	margin: 0;
	transform: none;
	display: grid;
	place-items: center;
	pointer-events: none;
	z-index: 3;
	opacity: 0;
	visibility: hidden;
	transition: opacity .18s ease-out;
}

/* 默认不显示，鼠标移到卡片（产品图）上才浮出来 —— 与 Element Pack 原本
   normal/hover 两态位移的意图一致，只是不再用位移，避免压在标题上。 */
/* 注意层级：li 是 .elementor-1832 的祖先（li > div.elementor-1832 > … > 本按钮），
   所以悬停条件必须挂在 .elementor-1835（列表模板）下面，写成
   .elementor-1832 li:hover 会永远匹配不到。 */
.elementor-1835 li.product:hover .elementor-element.elementor-element-079018a,
.elementor-1835 li.product:focus-within .elementor-element.elementor-element-079018a {
	opacity: 1;
	visibility: visible;
}

/* 触屏没有 hover，按钮若只在 hover 出现就永远看不到，所以这类设备上常驻显示。 */
@media (hover: none) {
	.elementor-1832 .elementor-element.elementor-element.elementor-element-079018a {
		opacity: 1;
		visibility: visible;
	}
}

.elementor-1832 .elementor-element.elementor-element-079018a > .elementor-widget-container,
.elementor-1832 .elementor-element.elementor-element-079018a .elementor-button-wrapper {
	margin: 0;
	padding: 0;
}

.elementor-1832 .elementor-element.elementor-element-079018a .elementor-button {
	width: auto;
	padding: 7px 20px;
	background-color: rgba(140, 141, 143, .82);
	color: #fff;
	pointer-events: auto;
}

.elementor-1832 .elementor-element.elementor-element-079018a .elementor-button:hover {
	background-color: #bcbbbb;
	color: #333;
}

/* 原样式在 ≤767px 用 .elementor-hidden-mobile 隐藏它，上面的 display:grid 特异性更高
   会把它顶出来，所以在同一条媒体查询里再压一次。 */
@media (max-width: 767px) {
	.elementor-1832 .elementor-element.elementor-element.elementor-element-079018a {
		display: none;
	}
}