/**
 * Mobile-only Reseller Pages (phones, <768px) — Wallet, Invoices,
 * Order Messages, Websites List. Follows the same soho-sparkle design
 * language as reseller-dashboard-mobile.css / create-order-mobile.css
 * (violet #0e56f5→ magenta #c026d3, white cards, pill chips).
 *
 * Scoping model (desktop stays 100% untouched):
 *   .zwm-root  — Wallet mobile partial        (wallet-mobile.php)
 *   .zim-root  — Invoices mobile partial      (reseller/invoices-mobile.php)
 *   Messages   — CSS overrides on the existing AJAX chat DOM, all inside
 *                @media (max-width:767.98px) + driven by body.zmm-chat-open
 *   Websites   — CSS-only table→card transform on .zetlink-sites-catalog,
 *                all inside @media (max-width:767.98px). This stylesheet is
 *                only enqueued on the 4 endpoint pages, so the public
 *                catalog page keeps its current styling.
 *
 * v1.6.0 — Rebuilt against the real WebsitesGrid source: layout order
 * is pure display:contents on the verified wrapper chain (AJAX-proof),
 * cards generated by websites-list-mobile.js as
 * exact prototype markup (.zlmc-*); the styled table remains the no-JS
 * fallback. Toolbar/filters retuned 1:1 to the soho prototype source: segmented
 * source control, pill categories, search-first toolbar, and site cards
 * with metric chips + GENERAL/SPECIAL price footer. (v1.2.0 removed the
 * bottom navigation in favor of the sidebar drawer on every page.)
 */

/* ============================================================
   SHARED TOKENS + PHONE-ONLY GUARDS
   ============================================================ */
.zwm-root,
.zim-root {
	--zpm-primary: #0e56f5;
	--zpm-magenta: #1748e8;
	--zpm-text: #1e1932;
	--zpm-muted: #6b7280;
	--zpm-faint: #94a3b8;
	--zpm-border: #efedf5;
	--zpm-card-border: #ecebf3;
	--zpm-tile-bg: #fdfdff;
	--zpm-red: #e11d48;
	--zpm-green: #16a34a;
	--zpm-amber: #d97706;
	color: var(--zpm-text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.zwm-root *, .zim-root * { box-sizing: border-box; }
.zwm-root a, .zim-root a { text-decoration: none; color: inherit; }
.zwm-root a:focus-visible,
.zim-root a:focus-visible { outline: 2px solid var(--zpm-primary); outline-offset: 2px; border-radius: 10px; }

/* Belt & suspenders: never render the mobile layers on desktop even if
   Bootstrap display utilities ever go missing. */
@media (min-width: 768px) {
	.zwm-root, .zim-root, .zlmc-list, .zetlink-wsm-toolbar-search-btn { display: none !important; }
}

/* ============================================================
   iOS INPUT AUTO-ZOOM FIX (phones only, iOS only)
   iOS Safari force-zooms the page when a focused control has a
   computed font-size under 16px — which is what made tapping the
   search box / bulk-search feel like the page "zoomed and froze".
   @supports (-webkit-touch-callout: none) matches only iOS, so
   Android keeps the designed sizes and pinch-zoom stays intact.
   ============================================================ */
@supports (-webkit-touch-callout: none) {
	@media (max-width: 767.98px) {
		body .woocommerce-MyAccount-content input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
		body .woocommerce-MyAccount-content select,
		body .woocommerce-MyAccount-content textarea,
		body .zetlink-sites-catalog input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
		body .zetlink-sites-catalog select,
		body .zetlink-sites-catalog textarea,
		body .rit-popup-wrapper input,
		body .rit-popup-wrapper textarea,
		body .rit-popup-wrapper select {
			font-size: 16px !important;
		}
	}
}


/* ============================================================
   WALLET — .zwm-root (wallet-mobile.php)
   ============================================================ */
.zwm-root {
	padding: 14px 12px 28px;
	max-width: 100%;
}
.zwm-title {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--zpm-text);
	margin: 2px 2px 14px;
}

/* Gradient balance hero */
.zwm-hero {
	position: relative;
	overflow: hidden;
	border-radius: 24px;
	padding: 20px 18px 18px;
	background: linear-gradient(135deg, #0e56f5, #a21caf 60%, #c026d3 100%);
	color: #fff;
	box-shadow: 0 14px 30px rgba(124, 58, 237, 0.28);
	margin-bottom: 12px;
}
.zwm-hero::after {
	content: "";
	position: absolute;
	right: -46px; top: -46px;
	width: 150px; height: 150px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.10);
	pointer-events: none;
}
.zwm-hero-label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.82);
	margin-bottom: 8px;
}
.wallet-label.zwm-hero-label{
	color: #222;
}
.zwm-hero-label i { font-size: 13px; }
.zwm-hero-amount,
.zwm-hero-amount .woocommerce-Price-amount {
	display: block;
	font-size: 34px;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: #fff;
}
.zetlink-wallet-balance-display .woocommerce-Price-amount{
	color: #000;
}
.zwm-hero-amount .woocommerce-Price-amount { display: inline; }
.zwm-hero-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: 16px;
	padding: 11px 20px;
	border-radius: 999px;
	background: #ffffff;
	color: var(--zpm-primary) !important;
	font-size: 13px;
	font-weight: 700;
	border: none;
	box-shadow: 0 8px 18px rgba(30, 20, 60, 0.18);
	transition: transform 0.15s ease;
	cursor: pointer;
}
.zwm-hero-btn:active { transform: scale(0.97); }
.zwm-hero-btn i { font-size: 15px; }

/* Credit / Debit summary tiles */
.zwm-totals {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-bottom: 14px;
}
.zwm-total {
	display: flex;
	align-items: center;
	gap: 11px;
	background: #ffffff;
	border: 1px solid var(--zpm-card-border);
	border-radius: 18px;
	padding: 13px 13px;
}
.zwm-total-ic {
	width: 38px; height: 38px;
	border-radius: 50%;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 17px;
}
.zwm-total--credit .zwm-total-ic { background: rgba(22, 163, 74, 0.10); color: var(--zpm-green); }
.zwm-total--debit  .zwm-total-ic { background: rgba(225, 29, 72, 0.08);  color: var(--zpm-red); }
.zwm-total-info { display: flex; flex-direction: column; min-width: 0; }
.zwm-total-info small { font-size: 11px; font-weight: 500; color: var(--zpm-muted); white-space: nowrap; }
.zwm-total-info b,
.zwm-total-info b .woocommerce-Price-amount {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.3;
	white-space: nowrap;
}
.zwm-total--credit .zwm-total-info b,
.zwm-total--credit .zwm-total-info b .woocommerce-Price-amount { color: var(--zpm-green); }
.zwm-total--debit .zwm-total-info b,
.zwm-total--debit .zwm-total-info b .woocommerce-Price-amount { color: var(--zpm-red); }

/* Transactions card */
.zwm-card {
	background: #ffffff;
	border: 1px solid var(--zpm-card-border);
	border-radius: 24px;
	box-shadow: 0 1px 2px rgba(30, 27, 46, 0.03);
	overflow: hidden;
	margin-bottom: 14px;
}
.zwm-card-head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 16px 10px;
}
.zwm-card-head .zwm-head-ic {
	width: 40px; height: 40px;
	border-radius: 50%;
	flex-shrink: 0;
	background: rgba(124, 58, 237, 0.10);
	color: var(--zpm-primary);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
}
.zwm-card-head h3 {
	font-size: 15.5px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0;
	color: var(--zpm-text);
}
.zwm-card-head p { font-size: 12px; color: var(--zpm-muted); margin: 2px 0 0; }
.zwm-txns { display: flex; flex-direction: column; gap: 9px; padding: 4px 13px 14px; }
.zwm-txn {
	display: flex;
	align-items: center;
	gap: 12px;
	background: var(--zpm-tile-bg);
	border: 1px solid var(--zpm-border);
	border-radius: 16px;
	padding: 12px 13px;
}
.zwm-txn-ic {
	width: 38px; height: 38px;
	border-radius: 50%;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 17px;
}
.zwm-txn--credit .zwm-txn-ic { background: rgba(22, 163, 74, 0.10); color: var(--zpm-green); }
.zwm-txn--debit  .zwm-txn-ic { background: rgba(225, 29, 72, 0.08);  color: var(--zpm-red); }
.zwm-txn-info { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.zwm-txn-reason {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--zpm-text);
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.zwm-txn-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 4px;
	font-size: 11px;
	font-weight: 500;
	color: var(--zpm-faint);
}
.zwm-txn-order {
	display: inline-flex;
	align-items: center;
	padding: 2px 9px;
	border-radius: 999px;
	background: rgba(124, 58, 237, 0.08);
	border: 1px solid rgba(124, 58, 237, 0.14);
	font-size: 10.5px;
	font-weight: 600;
	color: var(--zpm-primary) !important;
}
.zwm-txn-amt,
.zwm-txn-amt .woocommerce-Price-amount {
	font-size: 14.5px;
	font-weight: 700;
	white-space: nowrap;
	flex-shrink: 0;
}
.zwm-txn--credit .zwm-txn-amt,
.zwm-txn--credit .zwm-txn-amt .woocommerce-Price-amount { color: var(--zpm-green); }
.zwm-txn--debit .zwm-txn-amt,
.zwm-txn--debit .zwm-txn-amt .woocommerce-Price-amount { color: var(--zpm-red); }
.zwm-empty {
	text-align: center;
	color: var(--zpm-muted);
	font-size: 13px;
	padding: 26px 14px;
}
.zwm-pager {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 2px 0 8px;
}
.zwm-pager a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid #e6e3f0;
	font-size: 13px;
	font-weight: 600;
	color: #3b3651 !important;
}
.zwm-pager a.is-active {
	background: var(--zpm-primary);
	border-color: var(--zpm-primary);
	color: #fff !important;
	box-shadow: 0 6px 14px rgba(124, 58, 237, 0.25);
}

/* ============================================================
   INVOICES — .zim-root (reseller/invoices-mobile.php)
   ============================================================ */
.zim-root {
	padding: 14px 12px 28px;
	max-width: 100%;
}
.zim-head {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 2px 14px;
}
.zim-head-ic {
	width: 44px; height: 44px;
	border-radius: 14px;
	flex-shrink: 0;
	background: rgba(124, 58, 237, 0.10);
	color: var(--zpm-primary);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 21px;
}
.zim-head-txt { min-width: 0; flex: 1 1 auto; }
.zim-head-txt h1 {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0;
	line-height: 1.2;
	color: var(--zpm-text);
}
.zim-head-txt p { font-size: 12px; color: var(--zpm-muted); margin: 3px 0 0; }
.zim-new-btn {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 15px;
	border-radius: 999px;
	background: var(--zpm-primary);
	color: #fff !important;
	font-size: 12.5px;
	font-weight: 700;
	box-shadow: 0 7px 16px rgba(124, 58, 237, 0.25);
	transition: transform 0.15s ease;
}
.zim-new-btn:active { transform: scale(0.97); }
.zim-new-btn i { font-size: 15px; }

/* Date range chip scroller */
.zim-range-label {
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--zpm-muted);
	margin: 0 2px 8px;
}
.zim-range {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding: 0 2px 4px;
	margin-bottom: 10px;
}
.zim-range::-webkit-scrollbar { display: none; }
.zim-range a {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	padding: 8px 15px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid #e6e3f0;
	font-size: 12px;
	font-weight: 600;
	color: #3b3651 !important;
	white-space: nowrap;
	transition: transform 0.15s ease;
}
.zim-range a:active { transform: scale(0.97); }
.zim-range a.is-active {
	background: var(--zpm-text);
	border-color: var(--zpm-text);
	color: #fff !important;
	box-shadow: 0 6px 14px rgba(30, 25, 50, 0.22);
}
.zim-custom {
	display: grid;
	grid-template-columns: 1fr 1fr auto;
	gap: 8px;
	align-items: end;
	margin: 0 0 12px;
}
.zim-custom label {
	display: block;
	font-size: 10.5px;
	font-weight: 600;
	color: var(--zpm-muted);
	margin: 0 0 4px 4px;
}
.zim-custom input[type="date"] {
	width: 100%;
	height: 40px;
	border-radius: 12px;
	border: 1px solid #e6e3f0;
	background: #fff;
	padding: 0 10px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--zpm-text);
}
.zim-custom button {
	height: 40px;
	padding: 0 16px;
	border-radius: 12px;
	border: none;
	background: var(--zpm-primary);
	color: #fff;
	font-size: 12.5px;
	font-weight: 700;
	cursor: pointer;
}

/* 2×2 stat cards */
.zim-stats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-bottom: 10px;
}
.zim-stat {
	display: block;
	position: relative;
	background: #fff;
	border: 1px solid var(--zpm-card-border);
	border-radius: 18px;
	padding: 13px 13px 12px;
	overflow: hidden;
	transition: transform 0.15s ease;
}
.zim-stat:active { transform: scale(0.98); }
.zim-stat-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 8px;
}
.zim-stat-label {
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--zpm-muted);
}
.zim-stat-ic {
	width: 30px; height: 30px;
	border-radius: 50%;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
}
.zim-stat--all       .zim-stat-ic { background: rgba(99, 102, 241, 0.12);  color: #6366f1; }
.zim-stat--paid      .zim-stat-ic { background: rgba(34, 197, 94, 0.12);   color: #22c55e; }
.zim-stat--unpaid    .zim-stat-ic { background: rgba(245, 158, 11, 0.14);  color: #d97706; }
.zim-stat--cancelled .zim-stat-ic { background: rgba(148, 163, 184, 0.2);  color: #64748b; }
.zim-stat-num {
	font-size: 21px;
	font-weight: 800;
	line-height: 1;
	color: var(--zpm-text);
	letter-spacing: -0.01em;
}
.zim-stat-sub,
.zim-stat-sub .woocommerce-Price-amount {
	font-size: 12px;
	font-weight: 600;
	color: var(--zpm-muted);
	margin-top: 4px;
	display: inline-block;
}
/* Active fills — mirror the desktop invoice cards */
.zim-stat--all.is-active       { background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%); border-color: transparent; box-shadow: 0 10px 24px rgba(99, 102, 241, 0.32); }
.zim-stat--paid.is-active      { background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%); border-color: transparent; box-shadow: 0 10px 24px rgba(34, 197, 94, 0.28); }
.zim-stat--unpaid.is-active    { background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); border-color: transparent; box-shadow: 0 10px 24px rgba(245, 158, 11, 0.28); }
.zim-stat--cancelled.is-active { background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%); border-color: transparent; box-shadow: 0 10px 22px rgba(100, 116, 139, 0.26); }
.zim-stat.is-active .zim-stat-label,
.zim-stat.is-active .zim-stat-sub,
.zim-stat.is-active .zim-stat-sub .woocommerce-Price-amount,
.zim-stat.is-active .zim-stat-num { color: #fff; }
.zim-stat.is-active .zim-stat-ic { background: rgba(255, 255, 255, 0.22); color: #fff; }

/* Pending due / overdue wide cards */
.zim-wide {
	display: block;
	position: relative;
	border-radius: 20px;
	border: 1px solid;
	padding: 15px 15px 14px;
	margin-bottom: 10px;
	overflow: hidden;
	transition: transform 0.15s ease;
}
.zim-wide:active { transform: scale(0.99); }
.zim-wide--due {
	background: linear-gradient(135deg, #fff9f0 0%, #fff4e2 100%);
	border-color: #fde5c0;
}
.zim-wide--overdue {
	background: linear-gradient(135deg, #fff5f5 0%, #ffecec 100%);
	border-color: #fbd2d2;
}
.zim-wide.is-active { box-shadow: 0 10px 24px rgba(245, 158, 11, 0.18); }
.zim-wide--overdue.is-active { box-shadow: 0 10px 24px rgba(239, 68, 68, 0.16); }
.zim-wide-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 6px;
}
.zim-wide-label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.zim-wide--due .zim-wide-label { color: #b45309; }
.zim-wide--overdue .zim-wide-label { color: #b91c1c; }
.zim-wide-ic {
	width: 38px; height: 38px;
	border-radius: 50%;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 17px;
}
.zim-wide--due .zim-wide-ic { background: rgba(245, 158, 11, 0.16); color: #d97706; }
.zim-wide--overdue .zim-wide-ic { background: rgba(239, 68, 68, 0.13); color: #dc2626; }
.zim-wide-num,
.zim-wide-num .woocommerce-Price-amount {
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.02em;
}
.zim-wide--due .zim-wide-num,
.zim-wide--due .zim-wide-num .woocommerce-Price-amount { color: #c2410c; }
.zim-wide--overdue .zim-wide-num { color: #b91c1c; }
.zim-wide-sub { font-size: 12px; font-weight: 500; margin-top: 3px; }
.zim-wide--due .zim-wide-sub { color: #9a5b21; }
.zim-wide--overdue .zim-wide-sub { color: #a13d3d; }
.zim-progress {
	height: 6px;
	background: rgba(245, 158, 11, 0.2);
	border-radius: 999px;
	overflow: hidden;
	margin-top: 10px;
}
.zim-progress span {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: linear-gradient(90deg, #fb923c, #f59e0b);
}
.zim-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 10px;
}
.zim-chip {
	display: inline-flex;
	align-items: center;
	font-size: 10.5px;
	font-weight: 600;
	padding: 4px 10px;
	border-radius: 999px;
	border: 1px solid;
	background: #fff;
	line-height: 1.2;
}
.zim-chip--amber { color: #c2410c; border-color: #fdba74; }
.zim-chip--red   { color: #b91c1c; border-color: #fca5a5; }

/* Invoice list card */
.zim-card {
	background: #fff;
	border: 1px solid var(--zpm-card-border);
	border-radius: 24px;
	box-shadow: 0 1px 2px rgba(30, 27, 46, 0.03);
	overflow: hidden;
	margin-bottom: 14px;
}
.zim-card-head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 16px 16px 6px;
}
.zim-card-head h3 {
	font-size: 15.5px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0;
	color: var(--zpm-text);
	flex: 1 1 auto;
	min-width: 0;
}
.zim-count-pill {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	border-radius: 999px;
	background: #f4f2fa;
	border: 1px solid #e9e6f3;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: #514b68;
	white-space: nowrap;
}
.zim-search {
	display: flex;
	gap: 8px;
	padding: 8px 14px 12px;
}
.zim-search-wrap {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
}
.zim-search-wrap i {
	position: absolute;
	left: 13px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 15px;
	color: var(--zpm-faint);
	pointer-events: none;
}
.zim-search input[type="text"] {
	width: 100%;
	height: 40px;
	border-radius: 999px;
	border: 1px solid #e6e3f0;
	background: #fbfaff;
	padding: 0 14px 0 36px;
	font-size: 13px;
	font-weight: 500;
	color: var(--zpm-text);
}
.zim-search input[type="text"]::placeholder { color: var(--zpm-faint); }
.zim-search button {
	flex-shrink: 0;
	width: 40px; height: 40px;
	border-radius: 50%;
	border: none;
	background: var(--zpm-text);
	color: #fff;
	font-size: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}
.zim-list { display: flex; flex-direction: column; gap: 10px; padding: 2px 13px 14px; }
.zim-inv {
	background: var(--zpm-tile-bg);
	border: 1px solid var(--zpm-border);
	border-radius: 18px;
	overflow: hidden;
}
.zim-inv-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 12px 14px 0;
}
.zim-inv-idwrap { display: flex; flex-direction: column; min-width: 0; }
.zim-inv-idwrap b { font-size: 15px; font-weight: 700; color: var(--zpm-primary); line-height: 1.3; }
.zim-inv-idwrap small { font-size: 11px; font-weight: 500; color: var(--zpm-faint); margin-top: 2px; }
.zim-status {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 11px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	white-space: nowrap;
}
.zim-status::before {
	content: "";
	width: 6px; height: 6px;
	border-radius: 50%;
	background: currentColor;
}
.zim-status--paid      { background: #d1fae5; color: #065f46; }
.zim-status--unpaid    { background: #fef3c7; color: #92400e; }
.zim-status--cancelled { background: #f3f4f6; color: #6b7280; }
.zim-inv-mid {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 9px 14px 11px;
}
.zim-domains {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	min-width: 0;
	flex: 1 1 auto;
}
.zim-domain {
	display: inline-flex;
	align-items: center;
	max-width: 46vw;
	padding: 4px 10px;
	border-radius: 999px;
	background: #f4f2fa;
	border: 1px solid #e9e6f3;
	font-size: 10.5px;
	font-weight: 600;
	color: #514b68;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.zim-domain--more { color: var(--zpm-faint); background: transparent; border-color: transparent; padding-left: 2px; padding-right: 2px; }
.zim-inv-amt,
.zim-inv-amt .woocommerce-Price-amount {
	font-size: 15.5px;
	font-weight: 700;
	color: var(--zpm-text);
	white-space: nowrap;
	flex-shrink: 0;
}
.zim-inv-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: flex-end;
	padding: 10px 12px;
	border-top: 1px solid #f1eff7;
	background: #fbfaff;
}
.zim-btn-view,
.zim-btn-pay,
.zim-btn-pdf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 8px 15px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	transition: transform 0.15s ease;
	white-space: nowrap;
}
.zim-btn-view { background: var(--zpm-primary); color: #fff !important; box-shadow: 0 5px 12px rgba(124, 58, 237, 0.22); }
.zim-btn-pay  { background: var(--zpm-green);   color: #fff !important; box-shadow: 0 5px 12px rgba(22, 163, 74, 0.22); }
.zim-btn-pdf  { background: #fff; border: 1px solid #e6e3f0; color: #3b3651 !important; padding: 8px 12px; }
.zim-btn-view:active, .zim-btn-pay:active, .zim-btn-pdf:active { transform: scale(0.96); }
.zim-btn-view i, .zim-btn-pay i, .zim-btn-pdf i { font-size: 14px; }
.zim-empty {
	text-align: center;
	padding: 30px 16px;
	color: var(--zpm-muted);
}
.zim-empty i { font-size: 38px; opacity: 0.28; display: block; margin-bottom: 8px; }
.zim-empty b { display: block; font-size: 14px; color: var(--zpm-text); margin-bottom: 3px; }
.zim-empty span { font-size: 12px; }

/* ============================================================
   ORDER MESSAGES — mobile overrides on the existing AJAX chat DOM
   (order-messages.php). List-first; the chat pane becomes a
   full-screen overlay when body.zmm-chat-open is set by
   reseller-messages-mobile.js. Desktop (>=768px) untouched.
   ============================================================ */
@media (max-width: 767.98px) {
	body .support-channels-container {
		background: #ffffff !important;
		min-height: 60vh !important;
		padding: 14px 12px 28px !important;
	}
	/* Header: compact title, hide the Documentation button column */
	body .support-channels-container > .row.align-items-center.mb-4 { margin-bottom: 12px !important; }
	body .support-channels-container > .row.align-items-center.mb-4 .col-md-6.text-end { display: none !important; }
	body .support-channels-container > .row.align-items-center.mb-4 h1 {
		font-size: 22px !important;
		letter-spacing: -0.02em;
		margin-bottom: 2px !important;
	}
	body .support-channels-container > .row.align-items-center.mb-4 p { font-size: 12px !important; }

	/* Injected Order Chats / Support Chats mode tabs → segmented control */
	body .support-channels-container .zsc-mode-tabs {
		display: flex !important;
		gap: 4px;
		background: #f4f2fa;
		border: 1px solid #ebe8f4;
		border-radius: 999px;
		padding: 4px;
		margin-top: 12px !important;
	}
	body .support-channels-container .zsc-mode-tabs button {
		flex: 1 1 0;
		min-width: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		border: none;
		background: transparent;
		border-radius: 999px;
		padding: 9px 6px;
		font-size: 12px;
		font-weight: 700;
		color: #6b7280;
		white-space: nowrap;
	}
	body .support-channels-container .zsc-mode-tabs button.active {
		background: #ffffff;
		color: #0e56f5;
		box-shadow: 0 3px 10px rgba(30, 25, 50, 0.10);
	}
	body .support-channels-container .zsc-mode-tabs button i { font-size: 14px; }

	/* 3-pane theater → single list pane.
	   IMPORTANT: display is only forced where it cannot fight the page
	   JS — setMode() toggles inline display (flex/none) on .theater-row
	   and #zscp-section, so inline "none" must always stay hidden and
	   only inline "flex" is flattened to block. */
	body .support-channels-container .theater-row,
	body .support-channels-container #zscp-section {
		height: auto !important;
		min-height: 0 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		overflow: visible !important;
	}
	body .support-channels-container .theater-row { display: block !important; }
	body .support-channels-container .theater-row[style*="none"] { display: none !important; }
	body .support-channels-container #zscp-section[style*="flex"] { display: block !important; }

	body .support-channels-container .theater-row > .col-12.col-md-4,
	body .support-channels-container #zscp-section > .col-12.col-md-4 {
		width: 100% !important;
		max-width: 100% !important;
		flex: none !important;
		display: block !important;
		height: auto !important;
		border: 0 !important;
		background: transparent !important;
	}
	/* Hide the middle (chat) and right (context) panes in list view */
	body .support-channels-container .theater-row > .col-12.col-md-5,
	body .support-channels-container .theater-row > .col-12.col-md-3,
	body .support-channels-container #zscp-section > .col-12.col-md-5,
	body .support-channels-container #zscp-section > .col-12.col-md-3 {
		display: none !important;
	}

	/* List header block (search + read filters) */
	body .support-channels-container .theater-row .p-4.pb-3,
	body .support-channels-container #zscp-section .p-4.pb-3 {
		padding: 0 0 10px !important;
		background: transparent !important;
		border: 0 !important;
	}
	body .support-channels-container .theater-row .input-group,
	body .support-channels-container #zscp-section .input-group {
		border-radius: 999px !important;
		border: 1px solid #e6e3f0 !important;
		background: #fbfaff !important;
		margin-bottom: 10px !important;
	}
	body .support-channels-container .zetlink-msg-thread-filter,
	body .support-channels-container .zscp-filters {
		background: transparent !important;
		padding: 0 !important;
		gap: 8px !important;
		justify-content: flex-start;
	}
	body .support-channels-container .zetlink-msg-thread-filter .nav-link,
	body .support-channels-container .zscp-filters .nav-link {
		flex: 0 0 auto !important;
		background: #fff;
		border: 1px solid #e6e3f0 !important;
		border-radius: 999px !important;
		color: #3b3651;
		padding: 7px 15px !important;
		font-size: 11.5px !important;
		text-transform: capitalize;
	}
	body .support-channels-container .zetlink-msg-thread-filter .nav-link.active,
	body .support-channels-container .zscp-filters .nav-link.active {
		background: #1e1932 !important;
		border-color: #1e1932 !important;
		color: #fff !important;
	}

	/* Conversation cards */
	body .support-channels-container #zetlink-msg-conversations,
	body .support-channels-container #zscp-thread-list {
		padding: 0 !important;
		overflow: visible !important;
		flex: none !important;
	}
	body #zetlink-msg-conversations .zetlink-msg-conv {
		background: #ffffff !important;
		border: 1px solid #ecebf3 !important;
		border-radius: 18px !important;
		margin: 0 0 10px !important;
		padding: 13px 14px !important;
	}
	body #zetlink-msg-conversations .zetlink-msg-conv.active { border-color: #d9ccf7 !important; box-shadow: 0 6px 16px rgba(124, 58, 237, 0.10) !important; }
	body #zetlink-msg-conversations .zetlink-msg-conv .bg-primary.rounded-circle {
		width: 44px !important;
		height: 44px !important;
		background: linear-gradient(135deg, #0e56f5, #1748e8) !important;
		box-shadow: 0 5px 12px rgba(124, 58, 237, 0.24) !important;
	}
	body #zetlink-msg-conversations .zetlink-msg-conv .conv-title,
	body #zetlink-msg-conversations .zetlink-msg-conv strong { font-size: 13.5px !important; color: #1e1932 !important; }
	body #zetlink-msg-conversations .zetlink-msg-conv .conv-preview,
	body #zetlink-msg-conversations .zetlink-msg-conv .text-truncate.fs-12 { font-size: 12px !important; color: #6b7280 !important; }
	body #zscp-thread-list .zscp-thread-item {
		background: #ffffff !important;
		border: 1px solid #ecebf3 !important;
		border-radius: 18px !important;
		margin: 0 0 10px !important;
	}

	/* ---------- Full-screen chat overlay (body.zmm-chat-open) ---------- */
	body.zmm-chat-open { overflow: hidden !important; }
	body.zmm-chat-open .support-channels-container .theater-row > .col-12.col-md-5,
	body.zmm-chat-open .support-channels-container #zscp-section > .col-12.col-md-5 {
		display: flex !important;
		flex-direction: column !important;
		position: fixed !important;
		inset: 0 !important;
		z-index: 4000 !important;
		width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		background: #ffffff !important;
		overflow: hidden !important;
	}
	/* In order mode the support section is display:none — its overlay column
	   stays hidden with it, so only the active mode's chat can cover the
	   screen. Placeholders never show inside the overlay. */
	body.zmm-chat-open #zetlink-msg-chat-placeholder,
	body.zmm-chat-open #zscp-empty { display: none !important; }
	body.zmm-chat-open #zetlink-msg-chat-panel:not(.d-none) { display: flex !important; }
	body.zmm-chat-open #zscp-chat-panel:not(.d-none) { display: flex !important; }

	/* Overlay chat header */
	body.zmm-chat-open #zetlink-msg-chat-panel > .p-3,
	body.zmm-chat-open #zscp-chat-panel > .p-3 {
		padding: 10px 12px !important;
	}
	/* Injected back button (hidden on desktop) */
	.zmm-back {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 38px;
		height: 38px;
		border-radius: 50%;
		border: 1px solid #eceaf4;
		background: #f8f6fd;
		color: #1e1932;
		font-size: 18px;
		flex-shrink: 0;
		cursor: pointer;
	}
	/* Messages area + composer inside the overlay */
	body.zmm-chat-open #zetlink-msg-messages,
	body.zmm-chat-open #zscp-messages {
		padding: 14px 12px !important;
	}
	body.zmm-chat-open .msg-bubble { max-width: 86% !important; }
	body.zmm-chat-open #zetlink-msg-chat-panel > .p-4.bg-white.border-top,
	body.zmm-chat-open #zscp-composer {
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
	}
	body.zmm-chat-open #zetlink-msg-chat-panel .mt-3.d-flex.flex-wrap,
	body.zmm-chat-open #zscp-composer .mt-3.d-flex.flex-wrap {
		flex-wrap: nowrap !important;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		margin-top: 8px !important;
	}
	body.zmm-chat-open #zetlink-msg-chat-panel .mt-3.d-flex.flex-wrap::-webkit-scrollbar,
	body.zmm-chat-open #zscp-composer .mt-3.d-flex.flex-wrap::-webkit-scrollbar { display: none; }
	body.zmm-chat-open .btn-xs-premium { flex: 0 0 auto; white-space: nowrap; }
	body.zmm-chat-open #zetlink-msg-chat-search-wrap input { width: 110px !important; }
}
/* Desktop safety: the injected back/info buttons must never appear >=768px */
@media (min-width: 768px) {
	.zmm-back,
	.zmm-info,
	.zmm-info-close { display: none !important; }
}

/* ============================================================
   WEBSITES LIST — mobile v1.4 (exact soho-sparkle spec)
   Values transcribed 1:1 from the prototype source (Tailwind scale):
   neutral borders #e5e5e5, 12px card/input radius, 44px search,
   32px action buttons, 24px metric chips, sky DA/DR, emerald prices,
   amber INSTANT. Ordering is pinned with !important and arranged by
   websites-list-mobile.js; desktop + public catalog stay untouched.
   ============================================================ */
@media (max-width: 767.98px) {
	/* ---------- Shell ---------- */
	body .zetlink-sites-catalog { padding: 0 16px 24px !important; background: #fafafa !important; }
	/* The dashboard's websites_list endpoint has no page title of its own and
	   already hides .zl-hero unconditionally (see the .woocommerce-MyAccount-content
	   .zl-hero rule in sites-catalog-layout.php), so it needs a stand-in "Websites"
	   heading here. The public /sites page has its own Hero (headline, description,
	   trust badges, CTA buttons, stats, Featured Site card) and is NOT wrapped in
	   .woocommerce-MyAccount-content — scoping both rules to that wrapper keeps this
	   dashboard-only stand-in from hiding the public page's real Hero content. */
	body .woocommerce-MyAccount-content .zetlink-sites-catalog::before {
		content: "Websites";
		display: block;
		font-size: 18px;
		font-weight: 800;
		color: #171717;
		letter-spacing: -0.01em;
		padding: 2px 2px 10px;
	}
	body .woocommerce-MyAccount-content .zetlink-sites-catalog .zl-hero { display: none !important; }
	/* The white band above "Websites" and the extra side gutters come from
	   the page chrome around the catalog (header margin + content-container
	   padding). Neutralized only when this page is present — :has() keeps
	   every other dashboard page untouched (progressive enhancement). */
	body:has(.zetlink-sites-catalog) .container-fluid { padding-left: 0 !important; padding-right: 0 !important; }
	body:has(.zetlink-sites-catalog) .header-area {
		margin-bottom: 8px !important;
		padding-left: 16px !important;
		padding-right: 16px !important;
	}
	body:has(.zetlink-sites-catalog) .main-content,
	body:has(.zetlink-sites-catalog) .main-content .inner-main-content {
		padding-top: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	body:has(.zetlink-sites-catalog) .woocommerce-MyAccount-content {
		margin-top: 0 !important;
		padding: 0 !important;
		max-width: 100% !important;
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__card,
	body .zetlink-sites-catalog .zetlink-sites-catalog__card-body,
	body .zetlink-sites-catalog .wsm-websites-grid .__inner-wrap.card {
		padding: 0 !important;
		margin: 0 !important;
		background: transparent !important;
		border: 0 !important;
		box-shadow: none !important;
		border-radius: 0 !important;
		overflow: visible !important;
	}

	/* ---------- Source tabs (3-up segmented, spec: p-1 / r-12 / r-8) ---------- */
	body .zetlink-sites-catalog .zl-toggle-bar {
		background: #ffffff !important;
		border: 1px solid #e5e5e5 !important;
		border-radius: 12px !important;
		box-shadow: none !important;
		padding: 10px !important;
		margin: 0 0 16px !important;
		gap: 0 !important;
	}
	body .zetlink-sites-catalog .zl-toggle-bar__label { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-catalog-toggle {
		display: flex !important;
		width: 100% !important;
		gap: 8px !important;
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		box-shadow: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-catalog-toggle__opt {
		flex: 1 1 0 !important;
		min-width: 0 !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 1px !important;
		padding: 8px 4px !important;
		border-radius: 8px !important;
		background: transparent !important;
		border: 0 !important;
		color: #525252 !important;
		font-size: 14px !important;
		font-weight: 600 !important;
		line-height: 1.2 !important;
		text-align: center !important;
		white-space: nowrap !important;
		box-shadow: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-catalog-toggle__opt .zl-toggle-icon-mini { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-catalog-toggle__opt .badge {
		order: 2;
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		font-size: 12px !important;
		font-weight: 400 !important;
		color: inherit !important;
		opacity: 0.7 !important;
		line-height: 1.1 !important;
	}
	/* Active: RIF (2nd) purple, All/Marketplace near-black — like the spec */
	body .zetlink-sites-catalog .zetlink-wsm-catalog-toggle__opt--active {
		background: #171717 !important;
		color: #ffffff !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-catalog-toggle__opt--active:nth-child(2) { background: #0e56f5!important; }
	body .zetlink-sites-catalog .zetlink-wsm-catalog-toggle__opt--active .badge { opacity: 0.9 !important; }

	/* ---------- Browse by Category ---------- */
	body .zetlink-sites-catalog .zl-categories { margin-bottom: 16px !important; }
	body .zetlink-sites-catalog .zl-categories__head {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		margin-bottom: 8px !important;
		padding: 0 2px !important;
	}
	body .zetlink-sites-catalog .zl-categories__title { font-size: 13px !important; font-weight: 600 !important; color: #262626 !important; }
	body .zetlink-sites-catalog .zl-categories__title-icon { display: none !important; }
	body .zetlink-sites-catalog .zlm-see-all {
		font-size: 11px !important;
		font-weight: 500 !important;
		color: #0e56f5!important;
		text-decoration: none !important;
		flex: 0 0 auto !important;
		padding: 4px 2px !important;
	}
	body .zetlink-sites-catalog.zlm-cats-open .zetlink-sites-catalog__category-tabs {
		flex-wrap: wrap !important;
		overflow-x: visible !important;
		margin: 0 !important;
		padding: 2px 0 4px !important;
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-card {
		background: transparent !important;
		border: 0 !important;
		box-shadow: none !important;
		padding: 0 !important;
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs {
		display: flex !important;
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch !important;
		scrollbar-width: none !important;
		gap: 8px !important;
		margin: 0 -16px !important;
		padding: 2px 16px 4px !important; /* edge-to-edge scroll like the spec */
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs::-webkit-scrollbar { display: none !important; }
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .nav-item { flex: 0 0 auto !important; width: auto !important; }
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .nav-link {
		display: inline-flex !important;
		align-items: center !important;
		gap: 6px !important;
		min-height: 0 !important;
		height: 36px !important;
		padding: 0 12px !important;
		border-radius: 999px !important;
		background: #ffffff !important;
		border: 1px solid #e5e5e5 !important;
		font-size: 11.5px !important;
		font-weight: 500 !important;
		color: #404040 !important;
		white-space: nowrap !important;
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .zetlink-cat-icon {
		width: 14px !important; height: 14px !important;
		border-radius: 0 !important;
		background: transparent !important;
		color: inherit !important;
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .zetlink-cat-icon svg { width: 14px !important; height: 14px !important; }
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .zetlink-cat-label { font-size: 11.5px !important; }
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .nav-link .badge {
		background: #f5f5f5 !important;
		color: #262626 !important;
		border-radius: 999px !important;
		font-size: 10px !important;
		font-weight: 700 !important;
		padding: 2px 6px !important;
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .nav-link.active {
		background: #0e56f5!important;
		border-color: #0e56f5!important;
		color: #ffffff !important;
		box-shadow: none !important;
	}
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .nav-link.active .zetlink-cat-icon { background: transparent !important; color: #ffffff !important; }
	body .zetlink-sites-catalog .zetlink-sites-catalog__category-tabs .nav-link.active .badge { background: rgba(255, 255, 255, 0.2) !important; color: #ffffff !important; }

	/* ---------- Layout order (source-verified, AJAX-proof) ----------
	   Real structure: form > __row > [ __websites > __dynamic > (toolbar,
	   table-card, pagination) ] + [ __filter > .__body > (quick filters,
	   traffic bar, filter grid) ]. The plugin's AJAX replaces everything
	   inside __dynamic, so nothing may be moved across these wrappers.
	   Instead every wrapper below __row is flattened (display:contents)
	   and the pieces are flex-ordered on __row itself — the classes
	   re-apply to each fresh AJAX payload automatically. */
	body .zetlink-sites-catalog .wsm-websites-grid__row {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
	}
	body .zetlink-sites-catalog .wsm-websites-grid__websites,
	body .zetlink-sites-catalog .wsm-websites-grid__dynamic,
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar,
	body .zetlink-sites-catalog .wsm-websites-grid__filter,
	body .zetlink-sites-catalog .wsm-websites-grid__filter > .__body { display: contents !important; }
	body .zetlink-sites-catalog .wsm-websites-grid__row > * { order: 8 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__center { order: 1 !important; width: 100% !important; max-width: 100% !important; margin: 0 0 12px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-filter-grid { order: 2 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-quick-filters { display: none !important; } /* USA quick filter duplicates the category chip + Country select */
	body .zetlink-sites-catalog .zetlink-wsm-traffic-bar { order: 4 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__summary { order: 5 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-bulk-search-btn { order: 6 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__right { order: 7 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-table-card { order: 10 !important; }
	body .zetlink-sites-catalog .zlmc-list { order: 10 !important; }
	body .zetlink-sites-catalog .wsm-sites__pagination--grid { order: 11 !important; }

	/* Min-traffic range — compact card (unique function, kept) */
	body .zetlink-sites-catalog .zetlink-wsm-traffic-bar {
		background: #ffffff !important;
		border: 1px solid #e5e5e5 !important;
		border-radius: 12px !important;
		padding: 10px 12px !important;
		margin: 0 0 12px !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-traffic-bar__label {
		display: flex !important;
		justify-content: space-between !important;
		font-size: 11px !important;
		font-weight: 600 !important;
		color: #525252 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-traffic-bar__value { color: #0e56f5!important; }
	body .zetlink-sites-catalog .zetlink-wsm-traffic-bar__range { width: 100% !important; margin: 6px 0 2px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-traffic-bar__ticks {
		display: flex !important;
		justify-content: space-between !important;
		font-size: 9px !important;
		color: #a3a3a3 !important;
	}

	/* ---------- Search (spec: 44px, r-12, 32px purple sliders button) ---------- */
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-wrap {
		display: flex !important;
		align-items: center !important;
		gap: 8px !important;
		width: 100% !important;
		max-width: 100% !important;
		min-height: 0 !important;
		height: 44px !important;
		background: #ffffff !important;
		background-image: none !important;
		border: 1px solid #e5e5e5 !important;
		border-radius: 12px !important;
		padding: 0 6px 0 12px !important;
		box-shadow: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-icon { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-wrap::after { content: none !important; display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-wrap::before {
		content: "\f002" !important;
		font-family: "Font Awesome 6 Free" !important;
		font-weight: 900 !important;
		font-size: 14px !important;
		line-height: 1 !important;
		color: #a3a3a3 !important;
		position: static !important;
		transform: none !important;
		width: auto !important;
		height: auto !important;
		background: none !important;
		margin: 0 !important;
		flex: 0 0 auto !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-wrap input {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		border: 0 !important;
		background: transparent !important;
		background-image: none !important;
		padding: 0 !important;
		font-size: 14px !important;
		font-weight: 400 !important;
		height: 100% !important;
		box-shadow: none !important;
		-webkit-appearance: none !important;
		appearance: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-wrap input::-webkit-search-decoration,
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-wrap input::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-btn {
		flex: 0 0 auto !important;
		width: 32px !important;
		height: 32px !important;
		min-width: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		border-radius: 8px !important;
		background: #0e56f5!important;
		color: #ffffff !important;
		font-size: 0 !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		box-shadow: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-btn > * { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-btn::before { display: none !important; }
	/* Injected by websites-list-mobile.js as a real type=submit in the form */
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-btn::after {
		content: "\f1de";
		font-family: "Font Awesome 6 Free";
		font-weight: 900;
		font-size: 14px;
		line-height: 1;
	}

	/* ---------- Filter chips (spec: 32px pills, edge-to-edge scroll) ---------- */
	body .zetlink-sites-catalog .zl-mobile-filter-toggle { display: none !important; }
	/* Purple sliders (search submit) button removed — Enter/keyboard search still works */
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-btn { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-search-wrap { padding: 0 12px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-filter-grid {
		display: flex !important;
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch !important;
		scrollbar-width: none !important;
		gap: 8px !important;
		margin: 0 -16px 12px !important;
		padding: 0 16px 4px !important;
		border: 0 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-filter-grid::-webkit-scrollbar { display: none !important; }
	body .zetlink-sites-catalog .wsm-filter__input-wrap {
		flex: 0 0 auto !important;
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
	}
	body .zetlink-sites-catalog .wsm-filter__input-wrap select {
		height: 32px !important;
		border-radius: 999px !important;
		border: 1px solid #e5e5e5 !important;
		background-color: #ffffff !important;
		font-size: 12px !important;
		font-weight: 500 !important;
		color: #404040 !important;
		padding: 0 24px 0 12px !important;
	}
	body .zetlink-sites-catalog .wsm-filter__input-wrap input {
		height: 32px !important;
		width: 88px !important;
		border-radius: 999px !important;
		border: 1px solid #e5e5e5 !important;
		background-color: #ffffff !important;
		font-size: 12px !important;
		font-weight: 500 !important;
		padding: 0 12px !important;
	}

	/* ---------- Result count + sort + (per-page / bulk kept functional) ---------- */
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__summary {
		text-align: left !important;
		font-size: 0 !important; /* hides "Showing" / raw text nodes */
		color: #525252 !important;
		padding: 0 2px 10px !important;
		margin: 0 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__range::after { content: " of "; font-weight: 400; color: #525252; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__summary::after { content: "\00a0results"; font-size: 12px; font-weight: 400; color: #525252; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__range,
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__total { color: #171717 !important; font-weight: 600 !important; font-size: 12px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__total { color: #525252 !important; font-weight: 400 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__right {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: flex-start !important;
		gap: 8px !important;
		width: 100% !important;
		margin: 0 0 12px !important;
		overflow-x: auto !important;
		scrollbar-width: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__right::-webkit-scrollbar { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-results-toolbar__selects { display: flex !important; flex: 1 1 auto !important; width: 100% !important; flex-wrap: nowrap !important; gap: 8px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-per-page,
	body .zetlink-sites-catalog .zetlink-wsm-toolbar-sort {
		width: auto !important;
		min-width: 0 !important;
		flex: 1 1 0 !important;
		height: 32px !important;
		border-radius: 999px !important;
		border: 1px solid #e5e5e5 !important;
		background-color: #ffffff !important;
		font-size: 12px !important;
		font-weight: 500 !important;
		color: #404040 !important;
		box-shadow: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-bulk-search-btn {
		flex: 0 0 auto !important;
		width: 100% !important;
		justify-content: center !important;
		margin: 0 0 12px !important;
		min-height: 0 !important;
		height: 32px !important;
		padding: 0 12px !important;
		border-radius: 999px !important;
		font-size: 11px !important;
		letter-spacing: 0.02em !important;
		text-transform: none !important;
		background: #ffffff !important;
		background-image: none !important;
		color: #0e56f5!important;
		border: 1px solid #e5e5e5 !important;
		font-weight: 600 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-bulk-search-btn::before { display: none !important; }

	/* ---------- Cards (spec: r-12, p-12, #e5e5e5) ---------- */
	body .zetlink-sites-catalog .zetlink-wsm-table-card { overflow: visible !important; background: transparent !important; padding: 0 0 4px !important; width: 100% !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table { display: block !important; width: 100% !important; min-width: 0 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table thead { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody { display: flex !important; flex-direction: column !important; gap: 10px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody tr {
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		gap: 6px 6px !important;
		background: #ffffff !important;
		border: 1px solid #e5e5e5 !important;
		border-radius: 12px !important;
		padding: 12px !important;
		box-shadow: none !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody tr:hover { background: #ffffff !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td {
		display: flex !important;
		align-items: center !important;
		width: auto !important;
		min-width: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		white-space: normal !important;
		text-align: left !important;
		order: 13 !important; /* unknown/future columns still render, at the end */
	}

	/* Row 1 — domain (+ NEW) left, View Rules right */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-website {
		order: 1 !important;
		flex: 1 1 auto !important;
		align-self: flex-start !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-website .zl-site-favicon { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-website .zl-site-row { gap: 0 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-website .zl-site-meta {
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		gap: 3px 6px !important;
		padding: 0 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-website .zetlink-wsm-domain-link {
		font-size: 13.5px !important;
		font-weight: 600 !important;
		color: #0e56f5!important;
		line-height: 1.25 !important;
		word-break: break-all !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td .zetlink-wsm-new-badge {
		background: #fef3c7 !important;
		color: #b45309 !important;
		font-size: 9px !important;
		font-weight: 700 !important;
		padding: 2px 6px !important;
		border-radius: 4px !important;
		margin: 0 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-rules {
		order: 2 !important;
		flex: 0 0 auto !important;
		margin-left: auto !important;
		align-self: flex-start !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-rules .zetlink-wsm-view-rules {
		height: 28px !important;
		padding: 0 10px !important;
		font-size: 11px !important;
		font-weight: 600 !important;
		background: rgba(124, 58, 237, 0.10) !important;
		color: #0e56f5!important;
	}

	/* Row 2 — metric chips (spec: h-24 pills; sky DA/DR) */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-da      { order: 3 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-dr      { order: 4 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-traffic { order: 5 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-links   { order: 6 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-publish { order: 7 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td .zetlink-wsm-metric-badge {
		height: 24px !important;
		min-width: 0 !important;
		padding: 0 8px !important;
		border-radius: 999px !important;
		background: #f0f9ff !important;
		color: #0c4a6e !important;
		font-size: 11px !important;
		font-weight: 700 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-da .zetlink-wsm-metric-badge::before,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-dr .zetlink-wsm-metric-badge::before {
		font-weight: 600;
		color: #0369a1;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-da .zetlink-wsm-metric-badge::before { content: "DA\00a0"; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-dr .zetlink-wsm-metric-badge::before { content: "DR\00a0"; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-traffic {
		height: 24px !important;
		background: #f5f5f5 !important;
		border-radius: 999px !important;
		padding: 0 8px !important;
		font-size: 11px !important;
		font-weight: 600 !important;
		color: #262626 !important;
		gap: 4px !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-traffic img,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-traffic svg,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-traffic .zl-flag { width: 14px !important; height: auto !important; }
	/* Links: gray chip, bold count, small green DOFOLLOW sub-badge (spec) */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-links {
		height: 24px !important;
		background: #f5f5f5 !important;
		border-radius: 999px !important;
		padding: 0 8px !important;
		font-size: 11px !important;
		font-weight: 700 !important;
		color: #171717 !important;
		gap: 4px !important;
		white-space: nowrap !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-links span {
		font-size: 9px !important;
		font-weight: 700 !important;
		padding: 2px 4px !important;
		border-radius: 4px !important;
		margin: 0 !important;
		letter-spacing: 0.03em !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-publish { align-items: center !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-publish span {
		height: 24px !important;
		display: inline-flex !important;
		align-items: center !important;
		gap: 4px !important;
		font-size: 10px !important;
		font-weight: 600 !important;
		padding: 0 8px !important;
		border-radius: 999px !important;
		background: #fffbeb !important;
		color: #b45309 !important;
	}
	body .zetlink-sites-catalog .zl-publish-icon { font-size: 10px !important; }
	/* Non-instant delivery reads calm gray, like the spec (progressive, :has) */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-publish:has(.fa-calendar) span,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-publish:has(.fa-clock) span {
		background: #f5f5f5 !important;
		color: #404040 !important;
	}

	/* Row 3 — niche pills (spec: h-20, primary/5) */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-niche { order: 8 !important; flex: 1 1 100% !important; min-width: 100% !important; flex-wrap: wrap !important; gap: 4px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-niche a {
		display: inline-flex !important;
		align-items: center !important;
		height: 20px !important;
		padding: 0 8px !important;
		border-radius: 999px !important;
		background: rgba(124, 58, 237, 0.05) !important;
		border: 0 !important;
		font-size: 10px !important;
		font-weight: 500 !important;
		color: rgba(14, 86, 245, 0.8) !important;
		white-space: nowrap !important;
	}

	/* Divider before the price footer */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody tr::after {
		content: "";
		order: 9 !important;
		flex-basis: 100% !important;
		height: 1px;
		background: #f5f5f5;
		margin: 4px 0 2px;
	}

	/* Footer — GENERAL | SPECIAL prices left, Add To Cart right */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 1px !important;
		line-height: 1.2 !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		color: #059669 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price { order: 10 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special {
		order: 11 !important;
		margin-left: 12px !important;
		padding-left: 12px !important;
		border-left: 1px solid #e5e5e5 !important; /* the spec's thin divider */
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price::before { content: "GENERAL"; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special::before { content: "SPECIAL"; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price::before,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special::before {
		font-size: 9px;
		font-weight: 600;
		letter-spacing: 0.05em;
		color: #737373;
		line-height: 1;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price .woocommerce-Price-amount,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special .woocommerce-Price-amount {
		font-size: 14px !important;
		font-weight: 700 !important;
		color: #059669 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price del,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price del .woocommerce-Price-amount {
		font-size: 10px !important;
		font-weight: 500 !important;
		color: #a3a3a3 !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions {
		order: 12 !important;
		flex: 0 0 auto !important;
		margin-left: auto !important;
		justify-content: flex-end !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions .zetlink-wsm-order-btn {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 0 !important;
		height: 32px !important;
		background: #0e56f5!important;
		border-radius: 999px !important;
		padding: 0 12px !important;
		font-size: 0 !important; /* hide the plugin's own label text */
		font-weight: 600 !important;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08) !important;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions .zetlink-wsm-order-btn > * { display: none !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions .zetlink-wsm-order-btn::before {
		content: "\f07a";
		font-family: "Font Awesome 6 Free";
		font-weight: 900;
		font-size: 12px;
		line-height: 1;
		color: #ffffff;
		margin-right: 6px;
	}
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions .zetlink-wsm-order-btn::after {
		content: "Add To Cart";
		font-size: 11.5px;
		font-weight: 600;
		color: #ffffff;
		letter-spacing: 0.01em;
	}

	/* ---------- Pagination ---------- */
	body .zetlink-sites-catalog .wsm-sites__pagination--grid { padding: 12px 0 !important; }
	body .zetlink-sites-catalog .wsm-sites__pagination__item,
	body .zetlink-sites-catalog .wsm-sites__pagination__nav-btn {
		min-width: 36px !important;
		height: 36px !important;
		border-radius: 999px !important;
	}

	/* ---------- Generated prototype cards (.zlmc-*, built by JS) ----------
	   When the script succeeds it adds .zlmc-on and the plugin table is
	   swapped for these cards; without JS the styled table above remains. */
	body .zetlink-sites-catalog.zlmc-on .zetlink-wsm-table-card { display: none !important; }
	body .zetlink-sites-catalog .zlmc-list { display: none; }
	body .zetlink-sites-catalog.zlmc-on .zlmc-list {
		display: flex;
		flex-direction: column;
		gap: 10px;
		padding: 2px 0 4px;
		width: 100% !important;
	}
	body .zetlink-sites-catalog .zlmc-card {
		background: #ffffff;
		border: 1px solid #e5e5e5;
		border-radius: 12px;
		padding: 12px;
	}
	body .zetlink-sites-catalog .zlmc-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
	body .zetlink-sites-catalog .zlmc-name-wrap { min-width: 0; flex: 1 1 auto; }
	body .zetlink-sites-catalog .zlmc-name-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
	body .zetlink-sites-catalog .zlmc-domain::first-letter { text-transform: uppercase; }
	body .zetlink-sites-catalog .zlmc-domain {
		font-size: 13.5px !important;
		font-weight: 600 !important;
		color: #0d2143!important;
		line-height: 1.25;
		word-break: break-all;
		text-decoration: none !important;
	}
	body .zetlink-sites-catalog .zlmc-new {
		font-size: 9px;
		font-weight: 700;
		padding: 2px 6px;
		border-radius: 4px;
		background: #fef3c7;
		color: #b45309;
	}
	body .zetlink-sites-catalog .zlmc-rules {
		flex: 0 0 auto;
		display: inline-flex;
		align-items: center;
		gap: 4px;
		height: 28px;
		padding: 0 10px;
		border-radius: 999px;
		border: 0;
		background: rgba(124, 58, 237, 0.10);
		color: #0e56f5;
		font-size: 11px;
		font-weight: 600;
		cursor: pointer;
	}
	body .zetlink-sites-catalog .zlmc-rules::after {
		content: "\f078";
		font-family: "Font Awesome 6 Free";
		font-weight: 900;
		font-size: 8px;
		opacity: 0.8;
	}
	body .zetlink-sites-catalog .zlmc-chips { margin-top: 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 11px; }
	body .zetlink-sites-catalog .zlmc-chip { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 7px; border-radius: 999px; white-space: nowrap; }
	body .zetlink-sites-catalog .zlmc-chip--metric { background: #f0f9ff; color: #0369a1; font-weight: 600; }
	body .zetlink-sites-catalog .zlmc-chip--metric b { color: #0c4a6e; font-weight: 700; }
	body .zetlink-sites-catalog .zlmc-chip--traffic { background: #f5f5f5; color: #262626; font-weight: 600; }
	body .zetlink-sites-catalog .zlmc-chip--traffic img { width: 14px !important; height: auto !important; }
	body .zetlink-sites-catalog .zlmc-chip--links { background: #f5f5f5; color: #404040; }
	body .zetlink-sites-catalog .zlmc-chip--links b { color: #171717; font-weight: 700; }
	body .zetlink-sites-catalog .zlmc-ltype {
		font-size: 9px;
		font-weight: 700;
		padding: 2px 3px;
		border-radius: 4px;
		background: #d1fae5;
		color: #047857;
		letter-spacing: 0.03em;
		text-transform: uppercase;
	}
	body .zetlink-sites-catalog .zlmc-ltype[data-type="nofollow"] { background: rgba(239, 68, 68, 0.12); color: #b91c1c; }
	body .zetlink-sites-catalog .zlmc-ltype[data-type="ugc"] { background: rgba(6, 182, 212, 0.12); color: #0e7490; }
	body .zetlink-sites-catalog .zlmc-ltype[data-type="sponsored"] { background: rgba(245, 158, 11, 0.14); color: #92400e; }
	body .zetlink-sites-catalog .zlmc-chip--pub { background: #f5f5f5; color: #404040; font-weight: 600; }
	body .zetlink-sites-catalog .zlmc-chip--pub i { font-size: 10px; }
	body .zetlink-sites-catalog .zlmc-chip--pub.is-instant { background: #fffbeb; color: #b45309; text-transform: uppercase; }
	body .zetlink-sites-catalog .zlmc-chip--pub.is-instant i { color: #f59e0b; }
	body .zetlink-sites-catalog .zlmc-niches { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 4px; }
	body .zetlink-sites-catalog .zlmc-niche {
		display: inline-flex;
		align-items: center;
		height: 20px;
		padding: 0 8px;
		border-radius: 999px;
		border: 0;
		background: rgba(124, 58, 237, 0.05);
		color: rgba(124, 58, 237, 0.8);
		font-size: 10px;
		font-weight: 500;
		cursor: pointer;
		white-space: nowrap;
	}
	body .zetlink-sites-catalog .zlmc-foot {
		margin-top: 10px;
		padding-top: 10px;
		border-top: 1px solid #f5f5f5;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
	}
	body .zetlink-sites-catalog .zlmc-prices { display: flex; align-items: center; gap: 12px; min-width: 0; }
	body .zetlink-sites-catalog .zlmc-price { display: flex; flex-direction: column; gap: 1px; line-height: 1.2; }
	body .zetlink-sites-catalog .zlmc-price__label { font-size: 9px; font-weight: 600; color: #737373; text-transform: uppercase; letter-spacing: 0.05em; }
	body .zetlink-sites-catalog .zlmc-price__val,
	body .zetlink-sites-catalog .zlmc-price__val * { font-size: 14px !important; font-weight: 700 !important; color: #059669 !important; }
	body .zetlink-sites-catalog .zlmc-price__val del,
	body .zetlink-sites-catalog .zlmc-price__val del * { font-size: 10px !important; font-weight: 500 !important; color: #a3a3a3 !important; }
	body .zetlink-sites-catalog .zlmc-price__val del { margin-right: 4px; }
	body .zetlink-sites-catalog .zlmc-vdiv { width: 1px; height: 24px; background: #e5e5e5; flex: 0 0 auto; }
	body .zetlink-sites-catalog .zlmc-cart {
		flex: 0 0 auto;
		display: inline-flex;
		align-items: center;
		gap: 5px;
		height: 32px;
		padding: 0 12px;
		border-radius: 999px;
		border: 0;
		background: #0e56f5;
		color: #ffffff;
		font-size: 11.5px;
		font-weight: 600;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
		cursor: pointer;
	}
	body .zetlink-sites-catalog .zlmc-cart i { font-size: 12px; }
	body .zetlink-sites-catalog .zlmc-cart:active { transform: scale(0.95); }

	/* View Rules — bottom sheet (filled by websites-list-mobile.js) */
	.zlmc-rm-overlay {
		position: fixed;
		inset: 0;
		background: rgba(15, 23, 42, 0.5);
		z-index: 4200;
		display: none;
		align-items: flex-end;
		justify-content: center;
		padding: 12px;
	}
	.zlmc-rm-overlay.is-open { display: flex; }
	.zlmc-rm {
		background: #ffffff;
		border-radius: 16px;
		width: 100%;
		max-width: 520px;
		max-height: 72vh;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		box-shadow: 0 -8px 30px rgba(15, 23, 42, 0.18);
	}
	.zlmc-rm__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		padding: 14px 16px;
		border-bottom: 1px solid #f5f5f5;
		font-size: 15px;
		font-weight: 700;
		color: #171717;
	}
	.zlmc-rm__close {
		width: 32px;
		height: 32px;
		border: 0;
		border-radius: 8px;
		background: #f5f5f5;
		color: #404040;
		font-size: 13px;
		cursor: pointer;
		flex: 0 0 auto;
	}
	.zlmc-rm__body {
		padding: 4px 16px 14px;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
		font-size: 12.5px;
		color: #404040;
		line-height: 1.5;
	}
	.zlmc-rm__item { padding: 9px 0; border-bottom: 1px solid #f5f5f5; }
	.zlmc-rm__item:last-child { border-bottom: 0; }

/* ============================================================
   FUNCTION-PARITY ADDITIONS (v1.1.0)
   1. Invoices: merge-select checkboxes + select-all + status filter,
      shared #inv-merge-bar repositioned for phone screens.
   2. Messages: Contextual Info / Customer Details pane as a
      full-screen panel (body.zmm-info-open) + injected buttons.
   ============================================================ */

/* ---------- Invoices: merge selection ---------- */
.zim-check,
.zim-selectall {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
.zim-check { flex-shrink: 0; margin: 2px 2px 0 0; }
.zim-check input,
.zim-selectall input {
	position: absolute;
	width: 1px; height: 1px;
	opacity: 0;
	pointer-events: none;
}
.zim-check-box {
	width: 22px; height: 22px;
	flex-shrink: 0;
	border-radius: 7px;
	border: 2px solid #d8d4e6;
	background: #ffffff;
	position: relative;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}
.zim-check-box::after {
	content: "";
	position: absolute;
	left: 6px; top: 2px;
	width: 6px; height: 11px;
	border: solid #ffffff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg) scale(0);
	transition: transform 0.15s ease;
}
.zim-check input:checked + .zim-check-box,
.zim-selectall input:checked + .zim-check-box {
	background: linear-gradient(135deg, #0e56f5, #1748e8);
	border-color: transparent;
	box-shadow: 0 4px 10px rgba(124, 58, 237, 0.28);
}
.zim-check input:checked + .zim-check-box::after,
.zim-selectall input:checked + .zim-check-box::after { transform: rotate(45deg) scale(1); }
.zim-selectall {
	margin: 0 14px 10px;
	padding: 10px 12px;
	border-radius: 14px;
	background: #f8f6fd;
	border: 1px dashed #ddd2f5;
}
.zim-selectall-txt {
	font-size: 12px;
	font-weight: 600;
	color: #514b68;
	line-height: 1.35;
}
.zim-inv--selectable .zim-inv-top { align-items: flex-start; }
/* Selected-card highlight (mirrors the desktop row tint; :has() is
   progressive enhancement - older browsers simply skip it). */
.zim-inv:has(.zim-merge-cb:checked) {
	border-color: #d9ccf7;
	background: #faf8ff;
	box-shadow: 0 6px 16px rgba(124, 58, 237, 0.10);
}

/* ---------- Invoices: status filter select ---------- */
.zim-status-select {
	flex: 0 0 auto;
	max-width: 128px;
	height: 40px;
	border-radius: 999px;
	border: 1px solid #e6e3f0;
	background-color: #fbfaff;
	padding: 0 26px 0 12px;
	font-size: 12px;
	font-weight: 600;
	color: #3b3651;
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236b7280' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 11px center;
}
.zim-search { flex-wrap: wrap; }

/* ---------- Shared merge bar on phones ---------- */
@media (max-width: 767.98px) {
	body #inv-merge-bar {
		left: 12px !important;
		right: 12px !important;
		transform: none !important;
		bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
		min-width: 0 !important;
		max-width: none !important;
		z-index: 3995 !important;
		padding: 12px 14px !important;
		border-radius: 16px !important;
		gap: 10px !important;
	}
	body #inv-merge-bar #inv-merge-pay-btn { padding: 9px 14px !important; font-size: 12px !important; }
}

/* ---------- Messages: injected info toggle + info-panel close ---------- */
@media (max-width: 767.98px) {
	.zmm-info,
	.zmm-info-close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 38px;
		height: 38px;
		border-radius: 50%;
		border: 1px solid #eceaf4;
		background: #f8f6fd;
		color: #1e1932;
		font-size: 18px;
		flex-shrink: 0;
		cursor: pointer;
	}
	.zmm-info-close { margin-left: auto; }

	/* The context column (Contextual Info / Customer Details) opens as its
	   own full-screen panel above the chat overlay. Which one shows is
	   governed by its parent section visibility, exactly like the chat
	   columns - so order mode and support mode can never overlap. */
	body.zmm-chat-open.zmm-info-open .support-channels-container .theater-row > .col-12.col-md-3,
	body.zmm-chat-open.zmm-info-open .support-channels-container #zscp-section > .col-12.col-md-3 {
		display: flex !important;
		flex-direction: column !important;
		position: fixed !important;
		inset: 0 !important;
		z-index: 4010 !important;
		width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		background: #ffffff !important;
		border: 0 !important;
		overflow: hidden !important;
	}
}
	/* ============================================================
   WEBSITES LIST — MOBILE FONT BUMP (v1.1.1)
   ============================================================ */
@media (max-width: 767.98px) {
	/* --- JS cards (.zlmc-*) --- */
	body .zetlink-sites-catalog .zlmc-domain { font-size: 15px !important; line-height: 1.3 !important; }
	body .zetlink-sites-catalog .zlmc-new { font-size: 10px !important; }
	body .zetlink-sites-catalog .zlmc-rules { font-size: 12px !important; height: 30px !important; }
	body .zetlink-sites-catalog .zlmc-chips { font-size: 12px !important; }
	body .zetlink-sites-catalog .zlmc-chip { height: 26px !important; padding: 0 9px !important; }
	body .zetlink-sites-catalog .zlmc-ltype { font-size: 10px !important; }
	body .zetlink-sites-catalog .zlmc-chip--pub i { font-size: 11px !important; }
	body .zetlink-sites-catalog .zlmc-niche { font-size: 11px !important; height: 22px !important; }
	body .zetlink-sites-catalog .zlmc-price__label { font-size: 10px !important; }
	body .zetlink-sites-catalog .zlmc-price__val,
	body .zetlink-sites-catalog .zlmc-price__val * { font-size: 12px !important; margin-top: 2px; }
	body .zetlink-sites-catalog .zlmc-price__val del,
	body .zetlink-sites-catalog .zlmc-price__val del * { font-size: 11px !important; }
	body .zetlink-sites-catalog .zlmc-vdiv { height: 28px !important; }
	body .zetlink-sites-catalog .zlmc-cart { font-size: 12.5px !important; height: 34px !important; padding: 0 14px !important; }
	body .zetlink-sites-catalog .zlmc-cart i { font-size: 13px !important; }
	.zlmc-rm__head { font-size: 16px !important; }
	.zlmc-rm__body { font-size: 13.5px !important; }
	/* --- CSS-only fallback table (JS off hole same look) --- */
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-website .zetlink-wsm-domain-link { font-size: 15px !important; line-height: 1.3 !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td .zetlink-wsm-new-badge { font-size: 10px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-rules .zetlink-wsm-view-rules { font-size: 12px !important; height: 30px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td .zetlink-wsm-metric-badge { font-size: 12px !important; height: 26px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-traffic { font-size: 12px !important; height: 26px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-links { font-size: 12px !important; height: 26px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-links span { font-size: 10px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-publish span { font-size: 11px !important; height: 26px !important; }
	body .zetlink-sites-catalog .zl-publish-icon { font-size: 11px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-niche a { font-size: 11px !important; height: 22px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special { font-size: 16px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price::before,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special::before { font-size: 10px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price .woocommerce-Price-amount,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-special .woocommerce-Price-amount { font-size: 16px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price del,
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-price del .woocommerce-Price-amount { font-size: 11px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions .zetlink-wsm-order-btn { height: 34px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions .zetlink-wsm-order-btn::before { font-size: 13px !important; }
	body .zetlink-sites-catalog .zetlink-wsm-websites-table tbody td.zetlink-wsm-col-actions .zetlink-wsm-order-btn::after { font-size: 12.5px !important; }
	.zetlink-sites-catalog .zl-hero{
	    margin-top: 30px;
	}
}
}
/* ^ Closes the "WEBSITES LIST — mobile v1.4" @media (max-width: 767.98px) block
   opened above (~line 1065) — it was missing its closing brace, which had left
   every section after it (Shared merge bar, Messages info-panel, MOBILE FONT
   BUMP) nested one level inside it instead of sitting as siblings. Harmless
   visually (same condition nested = same condition), but invalid/fragile CSS. */