/* =====================================================================
 * CEV — Plugin-specific overrides on top of the Zorem UI library.
 * ---------------------------------------------------------------------
 * Every rule here lives outside `.zui-scope` OR under `.zui-scope.cev-admin`
 * so we never leak into the shared library or into wp-admin.
 *
 * The Zorem UI library (assets/zui/) is READ-ONLY in this repo. Any
 * plugin-only cosmetics MUST land here, with a `cev-` / `cev_` prefix.
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * Hide the legacy CEV chrome (old radio tabs + divider) so the new ZUI
 * header is the only navigation surface on the page. The radio inputs
 * themselves stay in the DOM because the existing body uses the CSS
 * `:checked` selector on `.cev_tab_input` to show/hide each panel.
 * --------------------------------------------------------------------- */

body.customer-email-verification-for-woocommerce .cev_nav_div > label.cev_tab_label,
body.customer-email-verification-for-woocommerce .cev_nav_div > a.menu_cev_link {
	display: none !important;
}

body.customer-email-verification-for-woocommerce .cev_nav_div > input.cev_tab_input {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	clip: rect(0 0 0 0);
	overflow: hidden;
}

/* Tab panels — all three live in the DOM at once; JS toggles [hidden].
   The 24px page gutter lives on the panel (matches the CEV Pro chrome),
   so every tab — with or without a sidebar — gets the same outer inset
   without any extra wrapper. */
.zui-scope.cev-admin .cev-tab-panel {
	padding: 24px;
	margin: 0;
}

.zui-scope.cev-admin .cev-tab-panel[hidden] {
	display: none !important;
}

/* Library .zui-layout already supplies flex + 16px gap + padding 0.
   We just zero its margin so all spacing comes from .cev-tab-panel. */
.zui-scope.cev-admin .zui-layout {
	margin: 0;
}

/* Drop WP's default 10px left padding on #wpcontent so the ZUI app fills
   the full admin canvas edge-to-edge (matches CEV Pro chrome). */
body.customer-email-verification-for-woocommerce #wpcontent {
	padding: 0 !important;
}

/* =====================================================================
 * Settings page chrome (lives inside .zui-scope.cev-admin).
 * ===================================================================== */

.zui-scope.cev-admin {
	padding: 0;
}

/* ─── Sidebar ───
 * Uses the library's .zui-sidebar / .zui-sidebar__nav / .zui-sidebar__item
 * components directly — no plugin-side overrides needed. The Quick Help
 * card slot inside the sidebar is also library-styled (.zui-quickhelp).
 *
 * PRO-only sidebar items carry the library's `.zui-sidebar__badge`
 * ("PRO"). The library renders it as a grey mono pill; CEV restyles it
 * as the solid-blue pill AST Free uses, pushed to the right edge.
 */

.zui-scope.cev-admin .zui-sidebar__badge {
	margin-inline-start: auto;
	padding: 2px 8px;
	background: var(--zui-primary);
	color: #fff;
	border-radius: 4px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.05em;
	font-family: inherit;
}

/* ─── Section header ───
 * Uses the library's .zui-section-header (border, padding, icon tile,
 * title, sub, actions) directly — no plugin-side overrides needed.
 *
 * The save-button rules below duplicate the library's savebtn.css so
 * the button stays styled even when the deployed assets/zui/css/zui.css
 * is an older build that doesn't yet @import the savebtn.css component.
 * Selector specificity (.zui-scope.cev-admin) beats anything else.
 */

.zui-scope.cev-admin .zui-savebtn-wrap {
	display: inline-flex;
}

.zui-scope.cev-admin .zui-section-header .zui-savebtn,
.zui-scope.cev-admin .zui-section-header .woocommerce-save-button,
.zui-scope.cev-admin .zui-section-header button.cev_settings_save {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 20px;
	background: #3b64d3;
	color: #fff;
	border: 0;
	border-radius: 12px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
	text-shadow: none;
	text-decoration: none;
	transition: background 0.15s ease;
}

.zui-scope.cev-admin .zui-section-header .zui-savebtn:hover,
.zui-scope.cev-admin .zui-section-header .woocommerce-save-button:hover,
.zui-scope.cev-admin .zui-section-header button.cev_settings_save:hover {
	background: #2d4db5;
	color: #fff;
}

.zui-scope.cev-admin .zui-section-header .zui-savebtn:focus,
.zui-scope.cev-admin .zui-section-header button.cev_settings_save:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(59, 100, 211, 0.25);
}

.zui-scope.cev-admin .zui-section-header .zui-savebtn[disabled] {
	opacity: 0.55;
	cursor: not-allowed;
}

/* ─── Cards & rows ─── */

/* Tighten the vertical padding on every field row (library default is
   32px top + bottom; we want a more compact 16px). Horizontal padding
   stays at the library's 32px because `padding-block` only touches
   the vertical axis. */
.zui-scope.cev-admin .zui-card .zui-row {
	padding-block: 16px;
}

/* Textarea styling — the shared library does not ship textarea.css yet
   (it's still in Phase 2). Provide a reasonable default here so the
   .zui-textarea class actually styles up under .cev-admin. Matches the
   Pro plugin's roomier 14px padding so the success-message textarea
   reads identical in Free and Pro. */
.zui-scope.cev-admin .zui-textarea {
	display: block;
	width: 100%;
	min-height: 88px;
	padding: 14px;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	font-family: inherit;
	font-size: 13px;
	line-height: 1.5;
	color: #1e293b;
	background: #fff;
	box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
	resize: vertical;
	box-sizing: border-box;
}

.zui-scope.cev-admin .zui-textarea:focus {
	outline: none;
	border-color: #3b64d3;
	box-shadow: 0 0 0 3px rgba(59, 100, 211, 0.12);
}

.zui-scope.cev-admin .zui-textarea[disabled] {
	opacity: 0.7;
	background: #f8fafc;
	cursor: not-allowed;
	color: #94a3b8;
}

/* Inline-row control widths — mirror the Pro plugin so dropdowns and
   short-message textareas sit to the right of the label in a fixed,
   readable width instead of stretching full-width. */
.zui-scope.cev-admin .zui-row--inline .zui-select-wrap {
	flex: 0 0 auto;
	width: 260px;
	max-width: 100%;
}

.zui-scope.cev-admin .zui-row--inline .zui-textarea {
	flex: 0 0 auto;
	width: 340px;
	max-width: 100%;
	min-height: 96px;
}

.zui-scope.cev-admin .zui-row--inline:has(.zui-textarea) {
	align-items: flex-start;
}

.zui-scope.cev-admin .zui-row--inline .zui-ms {
	flex: 0 0 auto;
	width: 260px;
	max-width: 100%;
}

/* The subheader row (Unrecognized Login Conditions:) keeps its own
   class because the library has no equivalent "text label between
   field rows" component. */

.zui-scope.cev-admin .cev-row--subheader {
	padding: 4px 32px 0;
	border-block-end: 0;
}

.zui-scope.cev-admin .cev-row__subheader {
	margin: 0;
	font-size: 12px;
	font-weight: 600;
	color: #64748b;
	text-transform: none;
}

/* ─── PRO-locked rows (same pattern as AST Free) ───
 * `.cev-pro-feature-row`: a PRO option inside a free section — disabled
 *   control + the library's `.zui-pro-feature` badge/lock pair, side by side.
 * `.cev-locked-row`: rows in the read-only preview under a section's
 *   unlock card — disabled control only.
 */

.zui-scope.cev-admin .cev-pro-feature-row .zui-row__control {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.zui-scope.cev-admin .cev-locked-row .zui-row__control {
	display: flex;
	align-items: center;
	gap: 12px;
}

.zui-scope.cev-admin .cev-locked-row .zui-row__control > :is(.zui-input, .zui-textarea, .zui-select-wrap, .zui-ms) {
	flex: 1 1 auto;
}

.zui-scope.cev-admin .cev-pro-locked-field :is(.zui-input, .zui-select, .zui-textarea):disabled {
	background: rgba(248, 250, 252, 0.5);
	color: #94a3b8;
	cursor: not-allowed;
}

.zui-scope.cev-admin .cev-pro-locked-field .zui-toggle[aria-disabled="true"] {
	opacity: 0.55;
	cursor: not-allowed;
}

.zui-scope.cev-admin .cev-pro-locked-field .zui-ms.is-disabled .zui-ms__control {
	background: rgba(248, 250, 252, 0.5);
	cursor: not-allowed;
	pointer-events: none;
}

/* Clickable PRO rows open the "Available in CEV PRO" window. */
.zui-scope.cev-admin .cev-pro-feature-row[data-cev-pro-url] {
	cursor: pointer;
}

/* =====================================================================
 * Stats line + bulk action toolbar (inside the table card).
 * ===================================================================== */

.zui-scope.cev-admin .cev-stats-line {
	margin: 0 0 12px;
	font-size: 13px;
	color: #64748b;
}

.zui-scope.cev-admin .cev-stats-line strong {
	color: #0f172a;
	font-weight: 700;
}

/* The bulk toolbar now lives INSIDE the table card (matches CEV Pro).
   IMPORTANT: do NOT use `overflow: hidden` here — the per-row kebab
   actions menu is `position: absolute` and would otherwise be clipped
   by the card edge and never become visible. */
.zui-scope.cev-admin .cev-table-card {
	padding: 0;
	overflow: visible;
}

/* `.zui-bulkbar` core + `__group` styling now comes from the library's
   bulk-bar.css (enqueued as zui-bulk-bar handle). The flex-direction
   override below stays to defeat the legacy #filterForm column rule. */

/* Soft button variant used for Apply / Export CSV (matches Pro's
   ghost-button look: subtle blue-tint background, blue text, no harsh
   border). Pro's CEV bulk bar uses the same `.zui-btn-soft` class. */
.zui-scope.cev-admin .zui-btn-soft {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #eef2ff;
	color: #3b64d3;
	border: 1px solid transparent;
	border-radius: 8px;
	padding: 8px 16px;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
	box-shadow: none;
	text-decoration: none;
	line-height: 1.2;
}

.zui-scope.cev-admin .zui-btn-soft:hover {
	background: #dde6ff;
	color: #2d4faa;
	border-color: transparent;
}

.zui-scope.cev-admin .zui-btn-soft svg {
	width: 14px;
	height: 14px;
}

/* `.apply_bulk_action` legacy reset is no longer needed — assets/css/admin.css
   is no longer enqueued on the CEV admin page, so the legacy solid-blue
   button styling can't override `.zui-btn-soft` anymore. Library's
   `bulk-bar.css` now handles all `.zui-bulkbar` layout (flex row, gap,
   padding, divider). */

/* Select wrap with chevron icon (matches Pro's .zui-select-wrap pattern). */
.zui-scope.cev-admin .zui-select-wrap {
	position: relative;
	display: inline-block;
}

.zui-scope.cev-admin .zui-select-wrap .zui-select {
	padding-inline-end: 32px;
	appearance: none;
	-webkit-appearance: none;
}

.zui-scope.cev-admin .zui-select-chevron {
	position: absolute;
	inset-inline-end: 8px;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	color: #94a3b8;
	display: inline-flex;
}

.zui-scope.cev-admin .zui-select-chevron svg {
	width: 14px;
	height: 14px;
}

/* =====================================================================
 * ZUI Table core + DataTables sort-arrow suppression.
 * ---------------------------------------------------------------------
 * `.zui-table`, `.zui-table-scroll`, two-line cell support, header/body
 * cell styling and hover all come from the library's table.css +
 * datatables.css (enqueued as zui-table / zui-datatables). Only the
 * CEV-specific column-shrink helpers + sort-arrow kill stay below.
 * ===================================================================== */

/* Checkbox + actions columns shrink to content. */
.zui-scope.cev-admin .zui-table .cev-table__check,
.zui-scope.cev-admin .zui-table .cev-table__actions {
	width: 1%;
	white-space: nowrap;
	text-align: center;
}

/* DataTables 1.11.5 paints sort-indicator arrows on every <th> via
   `background-image: url(../images/sort_*.png) !important;`. The image
   files don't exist at the relative path so they show as broken-image
   icons (the small purple triangle clusters). Override with
   `background-image: none !important;` plus also kill any pseudo-element
   fallback that newer DataTables builds use.

   Applied to both the explicitly-disabled columns (.cev-table__check,
   .cev-table__actions, .sorting_disabled) AND the entire DataTables
   theme so the arrows never appear at all on this table. */
.zui-scope.cev-admin .zui-table thead th.cev-table__check,
.zui-scope.cev-admin .zui-table thead th.cev-table__actions {
	cursor: default !important;
}

.zui-scope.cev-admin table.dataTable thead .sorting,
.zui-scope.cev-admin table.dataTable thead .sorting_asc,
.zui-scope.cev-admin table.dataTable thead .sorting_desc,
.zui-scope.cev-admin table.dataTable thead .sorting_asc_disabled,
.zui-scope.cev-admin table.dataTable thead .sorting_desc_disabled,
.zui-scope.cev-admin table.dataTable thead .sorting_disabled,
.zui-scope.cev-admin .zui-table thead th.cev-table__check,
.zui-scope.cev-admin .zui-table thead th.cev-table__actions {
	background-image: none !important;
}

.zui-scope.cev-admin table.dataTable thead .sorting::before,
.zui-scope.cev-admin table.dataTable thead .sorting::after,
.zui-scope.cev-admin table.dataTable thead .sorting_asc::before,
.zui-scope.cev-admin table.dataTable thead .sorting_asc::after,
.zui-scope.cev-admin table.dataTable thead .sorting_desc::before,
.zui-scope.cev-admin table.dataTable thead .sorting_desc::after,
.zui-scope.cev-admin .zui-table thead th.cev-table__check::before,
.zui-scope.cev-admin .zui-table thead th.cev-table__check::after,
.zui-scope.cev-admin .zui-table thead th.cev-table__actions::before,
.zui-scope.cev-admin .zui-table thead th.cev-table__actions::after,
.zui-scope.cev-admin .zui-table thead th.sorting_disabled::before,
.zui-scope.cev-admin .zui-table thead th.sorting_disabled::after {
	content: none !important;
	display: none !important;
	opacity: 0 !important;
}

/* =====================================================================
 * Avatar + .zui-cell-user core styling now comes from the library's
 * avatar.css (enqueued as zui-avatar handle).
 * Kebab actions menu (.zui-actions / __toggle / __menu / __item) core
 * styling now comes from the library's actions-menu.css (enqueued as
 * zui-actions-menu handle).
 *
 * Two CEV-specific overrides stay below — defensive z-index boost so
 * the menu wins the stacking order even when DataTables wraps the
 * table, and a `[hidden]` enforcement against the `display:flex` set
 * by the library/JS.
 * ===================================================================== */

.zui-scope.cev-admin .zui-actions-toggle[aria-expanded="true"] {
	position: relative;
	z-index: 9999;
}

.zui-scope.cev-admin .zui-actions-menu {
	z-index: 9999;
}

.zui-scope.cev-admin .zui-actions-menu[hidden] {
	display: none !important;
}

/* Inside the unified table card, drop the .zui-table-scroll's own
   border / radius / shadow (the card supplies them) and let overflow
   escape so the kebab actions menu isn't clipped at the right edge. */
.zui-scope.cev-admin .cev-table-card .zui-table-scroll {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	overflow: visible;
}

/* Each row needs to allow its kebab menu to escape vertically too. */
.zui-scope.cev-admin .cev-table-card .zui-table,
.zui-scope.cev-admin .cev-table-card .zui-table tbody,
.zui-scope.cev-admin .cev-table-card .zui-table tr,
.zui-scope.cev-admin .cev-table-card .zui-table td {
	overflow: visible;
}

/* Last row's kebab menu would drop below the card — flip it upward. */
.zui-scope.cev-admin .zui-table tbody tr:last-child .zui-actions-menu,
.zui-scope.cev-admin .zui-table tbody tr:nth-last-child(2) .zui-actions-menu {
	top: auto;
	bottom: calc(100% + 4px);
}

/* DataTables wrapper (info, paginate, paginate_button) styling now comes
   from the library's datatables.css (enqueued as zui-datatables handle). */

/* =====================================================================
 * Empty / placeholder card (no rows yet).
 * ===================================================================== */

.zui-scope.cev-admin .cev-placeholder {
	text-align: center;
	padding: 48px 24px;
}

.zui-scope.cev-admin .cev-placeholder__title {
	margin: 0 0 8px;
	font-size: 15px;
	font-weight: 700;
	color: #1e293b;
}

.zui-scope.cev-admin .cev-placeholder__text {
	margin: 0 auto;
	max-width: 420px;
	font-size: 13px;
	line-height: 1.55;
	color: #64748b;
}

/* =====================================================================
 * Go Pro tab — same layout as AST Free's Go Pro tab.
 * ---------------------------------------------------------------------
 * Hero gradient + stats strip + feature cards + before/after outcomes +
 * finale CTA. The help card and add-ons grid below reuse the shared
 * zui-lic-* library components. Ported from AST's ast-settings.css
 * (.ast-gp-*), renamed to .cev-gp-* and scoped to .zui-scope.cev-admin.
 * ===================================================================== */

.zui-scope.cev-admin .cev-gp { display: flex; flex-direction: column; gap: 28px; }

.zui-scope.cev-admin .cev-gp-hero {
	position: relative;
	overflow: hidden;
	border-radius: 18px;
	padding: 38px 36px 32px;
	color: #f5f3ff;
	background: radial-gradient(circle at 18% 12%, #4338ca 0%, transparent 55%),
				radial-gradient(circle at 82% 88%, #7c3aed 0%, transparent 50%),
				linear-gradient(135deg, #1e1b4b 0%, #312e81 55%, #4c1d95 100%);
	box-shadow: 0 18px 40px -22px rgba(76, 29, 149, 0.55);
}
.zui-scope.cev-admin .cev-gp-hero__inner { position: relative; z-index: 2; max-width: 760px; }
.zui-scope.cev-admin .cev-gp-hero__orb {
	position: absolute;
	border-radius: 999px;
	filter: blur(60px);
	opacity: 0.55;
	pointer-events: none;
	z-index: 1;
}
.zui-scope.cev-admin .cev-gp-hero__orb--a { width: 280px; height: 280px; background: #a78bfa; top: -90px; right: -60px; }
.zui-scope.cev-admin .cev-gp-hero__orb--b { width: 220px; height: 220px; background: #38bdf8; bottom: -100px; left: 30%; opacity: 0.35; }
.zui-scope.cev-admin .cev-gp-hero__orb--c { width: 160px; height: 160px; background: #f472b6; top: 40%; right: 20%; opacity: 0.30; }

.zui-scope.cev-admin .cev-gp-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.18);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #f5f3ff;
	backdrop-filter: blur(6px);
}
.zui-scope.cev-admin .cev-gp-hero__eyebrow .zui-icon { width: 14px; height: 14px; color: #fde68a; }
.zui-scope.cev-admin .cev-gp-hero__title {
	margin: 16px 0 12px;
	font-size: 34px;
	line-height: 1.15;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: #ffffff;
}
.zui-scope.cev-admin .cev-gp-hero__lead {
	margin: 0 0 24px;
	font-size: 15px;
	line-height: 1.65;
	color: rgba(245, 243, 255, 0.85);
	max-width: 620px;
}
.zui-scope.cev-admin .cev-gp-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 22px; }
.zui-scope.cev-admin .cev-gp-hero__trust {
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
	font-size: 12px;
	color: rgba(245, 243, 255, 0.75);
}
.zui-scope.cev-admin .cev-gp-hero__trust-item { display: inline-flex; align-items: center; gap: 6px; }
.zui-scope.cev-admin .cev-gp-hero__trust-item .zui-icon { width: 14px; height: 14px; color: #a7f3d0; }
.zui-scope.cev-admin .cev-gp-hero__badge {
	position: absolute;
	top: 22px;
	right: 24px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.10);
	border: 1px solid rgba(255, 255, 255, 0.20);
	backdrop-filter: blur(6px);
}
.zui-scope.cev-admin .cev-gp-hero__badge-dot {
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: #fbbf24;
	box-shadow: 0 0 0 4px rgba(251, 191, 36, 0.18);
}
.zui-scope.cev-admin .cev-gp-hero__badge-eyebrow {
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(245, 243, 255, 0.65);
}
.zui-scope.cev-admin .cev-gp-hero__badge-val { font-size: 13px; font-weight: 700; color: #ffffff; }

.zui-scope.cev-admin .cev-gp-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 20px;
	border-radius: 10px;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.zui-scope.cev-admin .cev-gp-btn .zui-icon { width: 16px; height: 16px; }
.zui-scope.cev-admin .cev-gp-btn--primary { background: #ffffff; color: #4c1d95; box-shadow: 0 8px 20px -10px rgba(0, 0, 0, 0.35); }
.zui-scope.cev-admin .cev-gp-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -10px rgba(0, 0, 0, 0.45); }
.zui-scope.cev-admin .cev-gp-btn--ghost { background: rgba(255, 255, 255, 0.08); color: #ffffff; border-color: rgba(255, 255, 255, 0.25); }
.zui-scope.cev-admin .cev-gp-btn--ghost:hover { background: rgba(255, 255, 255, 0.15); }
.zui-scope.cev-admin .cev-gp-btn--xl { padding: 14px 28px; font-size: 15px; border-radius: 12px; }
.zui-scope.cev-admin .cev-gp-btn--xl .zui-icon { width: 18px; height: 18px; }

.zui-scope.cev-admin .cev-gp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.zui-scope.cev-admin .cev-gp-stat {
	background: #ffffff;
	border: 1px solid var(--zui-border);
	border-radius: 14px;
	padding: 22px 22px 20px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	position: relative;
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.zui-scope.cev-admin .cev-gp-stat:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -18px rgba(15, 23, 42, 0.18); }
.zui-scope.cev-admin .cev-gp-stat__icon {
	width: 38px;
	height: 38px;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 4px;
}
.zui-scope.cev-admin .cev-gp-stat__icon .zui-icon { width: 20px; height: 20px; }
.zui-scope.cev-admin .cev-gp-stat__num {
	font-size: 32px;
	font-weight: 800;
	color: var(--zui-text-strong);
	letter-spacing: -0.02em;
	line-height: 1.1;
}
.zui-scope.cev-admin .cev-gp-stat__label { font-size: 13px; font-weight: 700; color: var(--zui-text-strong); }
.zui-scope.cev-admin .cev-gp-stat__sub { font-size: 12px; color: var(--zui-text-muted); }

.zui-scope.cev-admin .cev-gp-section { display: flex; flex-direction: column; gap: 22px; }
.zui-scope.cev-admin .cev-gp-section__head { text-align: center; max-width: 720px; margin: 0 auto; }
.zui-scope.cev-admin .cev-gp-section__eyebrow {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--zui-primary-600);
	margin-bottom: 8px;
}
.zui-scope.cev-admin .cev-gp-section__title {
	margin: 0 0 6px;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--zui-text-strong);
}
.zui-scope.cev-admin .cev-gp-section__sub { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--zui-text-muted); }

.zui-scope.cev-admin .cev-gp-powers { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.zui-scope.cev-admin .cev-gp-power {
	background: #ffffff;
	border: 1px solid var(--zui-border);
	border-radius: 14px;
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	position: relative;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.zui-scope.cev-admin .cev-gp-power:hover { transform: translateY(-3px); box-shadow: 0 18px 34px -22px rgba(15, 23, 42, 0.18); border-color: #c4b5fd; }
.zui-scope.cev-admin .cev-gp-power__icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.zui-scope.cev-admin .cev-gp-power__icon .zui-icon { width: 22px; height: 22px; }
.zui-scope.cev-admin .cev-gp-power__title { margin: 4px 0 0; font-size: 15px; font-weight: 700; color: var(--zui-text-strong); }
.zui-scope.cev-admin .cev-gp-power__desc {
	margin: 0;
	font-size: 13px;
	line-height: 1.55;
	color: var(--zui-text-muted);
	flex: 1;
}
.zui-scope.cev-admin .cev-gp-power__chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	background: #ecfdf5;
	color: #047857;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	width: fit-content;
}
.zui-scope.cev-admin .cev-gp-power__chip .zui-icon { width: 12px; height: 12px; }

.zui-scope.cev-admin .cev-gp-outcomes { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 820px) {
	.zui-scope.cev-admin .cev-gp-outcomes {
		grid-template-columns: 1fr 1fr;
	}
}
.zui-scope.cev-admin .cev-gp-outcome {
	border-radius: 14px;
	padding: 24px;
	border: 1px solid var(--zui-border);
	background: #ffffff;
	position: relative;
}
.zui-scope.cev-admin .cev-gp-outcome--before { background: linear-gradient(180deg, #fff1f2 0%, #ffffff 65%); border-color: #fecdd3; }
.zui-scope.cev-admin .cev-gp-outcome--after { background: linear-gradient(180deg, #ecfdf5 0%, #ffffff 65%); border-color: #a7f3d0; }
.zui-scope.cev-admin .cev-gp-outcome__head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.zui-scope.cev-admin .cev-gp-outcome__icon {
	width: 38px;
	height: 38px;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.zui-scope.cev-admin .cev-gp-outcome--before .cev-gp-outcome__icon { background: #fee2e2; color: #dc2626; }
.zui-scope.cev-admin .cev-gp-outcome--after .cev-gp-outcome__icon { background: #d1fae5; color: #059669; }
.zui-scope.cev-admin .cev-gp-outcome__icon .zui-icon { width: 20px; height: 20px; }
.zui-scope.cev-admin .cev-gp-outcome__eyebrow {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--zui-text-muted);
}
.zui-scope.cev-admin .cev-gp-outcome__title { margin: 2px 0 0; font-size: 17px; font-weight: 800; color: var(--zui-text-strong); }
.zui-scope.cev-admin .cev-gp-outcome__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.zui-scope.cev-admin .cev-gp-outcome__list li {
	display: grid;
	grid-template-columns: 22px 1fr;
	gap: 10px;
	align-items: start;
	font-size: 13px;
	line-height: 1.55;
	color: var(--zui-text);
}
.zui-scope.cev-admin .cev-gp-outcome__bullet {
	width: 22px;
	height: 22px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.zui-scope.cev-admin .cev-gp-outcome--before .cev-gp-outcome__bullet { background: #fee2e2; color: #dc2626; }
.zui-scope.cev-admin .cev-gp-outcome--after .cev-gp-outcome__bullet { background: #d1fae5; color: #059669; }
.zui-scope.cev-admin .cev-gp-outcome__bullet .zui-icon { width: 12px; height: 12px; }

.zui-scope.cev-admin .cev-gp-cta {
	position: relative;
	overflow: hidden;
	border-radius: 18px;
	padding: 32px 34px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	background: linear-gradient(135deg, #2563eb 0%, #4338ca 50%, #7c3aed 100%);
	color: #ffffff;
	box-shadow: 0 18px 40px -22px rgba(67, 56, 202, 0.6);
}
.zui-scope.cev-admin .cev-gp-cta__orb {
	position: absolute;
	width: 360px;
	height: 360px;
	border-radius: 999px;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.18) 0%, transparent 60%);
	right: -120px;
	top: -140px;
	pointer-events: none;
}
.zui-scope.cev-admin .cev-gp-cta__content { position: relative; z-index: 2; max-width: 560px; }
.zui-scope.cev-admin .cev-gp-cta__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.18);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.zui-scope.cev-admin .cev-gp-cta__eyebrow .zui-icon { width: 14px; height: 14px; }
.zui-scope.cev-admin .cev-gp-cta__title {
	margin: 0 0 8px;
	font-size: 24px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: #ffffff;
}
.zui-scope.cev-admin .cev-gp-cta__sub { margin: 0; font-size: 13.5px; line-height: 1.6; color: rgba(255, 255, 255, 0.85); }
.zui-scope.cev-admin .cev-gp-cta__action {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
}
.zui-scope.cev-admin .cev-gp-cta__note { font-size: 12px; color: rgba(255, 255, 255, 0.75); }


@media (max-width: 720px) {
	.zui-scope.cev-admin .cev-gp-hero { padding: 32px 24px 28px; }
	.zui-scope.cev-admin .cev-gp-hero__title { font-size: 26px; }
	.zui-scope.cev-admin .cev-gp-hero__badge { position: static; margin-top: 18px; display: inline-flex; }
	.zui-scope.cev-admin .cev-gp-cta { padding: 26px 22px; }
	.zui-scope.cev-admin .cev-gp-cta__action { align-items: flex-start; }
}

/* =====================================================================
 * Unverified Users — Pro design parity overrides.
 * ---------------------------------------------------------------------
 * Exact values pulled from the CEV Pro live demo. These rules sit at
 * the END of the file so they win the cascade over any earlier .zui-table
 * / .zui-cell-user / .zui-avatar / .zui-actions* rules. Markup + JS are
 * untouched — only visuals change.
 * ===================================================================== */

/* CARD */
.zui-scope.cev-admin .zui-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 16px;
	box-shadow: 0 1px 3px 0 rgba(15, 23, 42, 0.08);
	padding: 0;
}

/* TABLE */
.zui-scope.cev-admin #userLogTable {
	background: #ffffff;
	color: #1e293b;
	font-size: 14px;
}

/* HEADER — left aligned, light gray, semi-bold, uppercase */
.zui-scope.cev-admin #userLogTable thead th {
	padding: 16px;
	text-align: left;
	color: #94a3b8;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.44px;
	border-bottom: 1px solid #e2e8f0;
	background: #ffffff;
}

/* BODY CELLS — even 16px padding, NO row divider line */
.zui-scope.cev-admin #userLogTable tbody td {
	padding: 16px;
	vertical-align: middle;
	border-bottom: none;
}

/* ROW HOVER */
.zui-scope.cev-admin #userLogTable tbody tr:hover td {
	background: #fafbfc;
}

/* AVATAR — teal circle */
.zui-scope.cev-admin .zui-avatar {
	width: 36px;
	height: 36px;
	border-radius: 999px;
	background: #0891b2;
	color: #ffffff;
	font-size: 12px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* USER CELL (avatar + name/email) */
.zui-scope.cev-admin .zui-cell-user {
	display: flex;
	align-items: center;
	gap: 12px;
}

.zui-scope.cev-admin .zui-cell-user__meta {
	display: flex;
	flex-direction: column;
}

.zui-scope.cev-admin .zui-cell-user__meta strong {
	font-size: 14px;
	font-weight: 600;
	color: #1e293b;
	line-height: 1.45;
}

.zui-scope.cev-admin .zui-cell-user__meta small {
	font-size: 12px;
	color: #94a3b8;
}

/* LAST UPDATED cell — relative time on top, absolute date below */
.zui-scope.cev-admin #userLogTable tbody td:nth-child(3) strong {
	font-size: 14px;
	font-weight: 600;
	color: #1e293b;
}

.zui-scope.cev-admin #userLogTable tbody td:nth-child(3) small {
	font-size: 12px;
	color: #94a3b8;
}

/* ACTIONS — 3-dot toggle */
.zui-scope.cev-admin .zui-actions-toggle {
	width: 30px;
	height: 30px;
	border-radius: 8px;
	background: transparent;
	border: none;
	color: #94a3b8;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.zui-scope.cev-admin .zui-actions-toggle:hover {
	background: #f1f5f9;
	color: #475569;
}

.zui-scope.cev-admin .zui-actions-toggle svg {
	width: 18px;
	height: 18px;
}

/* ACTIONS — dropdown menu */
.zui-scope.cev-admin .zui-actions-menu {
	position: absolute;
	min-width: 160px;
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	box-shadow: 0 4px 10px 0 rgba(15, 23, 42, 0.1);
	padding: 0;
	overflow: hidden;
}

.zui-scope.cev-admin .zui-actions-item {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 8px 12px;
	font-size: 12px;
	font-weight: 500;
	color: #475569;
	background: transparent;
	border: none;
	text-align: left;
	cursor: pointer;
}

.zui-scope.cev-admin .zui-actions-item:hover {
	background: #f8fafc;
}

.zui-scope.cev-admin .zui-actions-item--danger {
	color: #e11d48;
}

.zui-scope.cev-admin .zui-actions-item--danger:hover {
	background: #fef2f2;
}

/* CHECKBOX */
.zui-scope.cev-admin .zui-checkbox__box {
	width: 18px;
	height: 18px;
	border: 1px solid #94a3b8;
	border-radius: 6px;
	background: #ffffff;
}

/* ─── "Available in CEV PRO" window (locked option click) ───
 * Keep both footer buttons compact, on one line and right-aligned;
 * wp-admin button styles otherwise inflate them and wrap "Upgrade to PRO".
 */
.zui-scope.cev-admin #cev-pro-feature-modal .zui-modal__actions {
	width: 100%;
	justify-content: flex-end;
	align-items: center;
	padding-top: 0;
}

.zui-scope.cev-admin #cev-pro-feature-modal .zui-modal__actions > :is(a, button) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	height: 36px;
	min-height: 0;
	padding: 0 16px;
	font-size: 13px;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
	box-shadow: none;
}

/* =====================================================================
 * Smart Form (PRO) preview on the Signup Verification section.
 * Ported from CEV PRO cev-admin.css so the locked preview matches PRO.
 * ===================================================================== */

/* Smart Form template picker — radio cards with mini wireframe previews. The
   checked radio is the source of truth; active card styled via :has(). */
.zui-scope.cev-admin .cev-tpl-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	width: 100%;
}

.zui-scope.cev-admin .cev-tpl-card {
	position: relative;
	display: block;
	margin: 0;
	border: 2px solid var(--zui-border);
	border-radius: var(--zui-radius-xl);
	background: var(--zui-surface);
	overflow: hidden;
	cursor: pointer;
	transition: border-color var(--zui-dur) var(--zui-ease), box-shadow var(--zui-dur) var(--zui-ease);
}

.zui-scope.cev-admin .cev-tpl-card:hover {
	border-color: var(--zui-primary-300);
}

.zui-scope.cev-admin .cev-tpl-card:has(.cev-tpl-card__radio:checked) {
	border-color: var(--zui-primary);
	box-shadow: 0 0 0 3px var(--zui-primary-100);
}

.zui-scope.cev-admin .cev-tpl-card__radio {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

.zui-scope.cev-admin .cev-tpl-card__bar {
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 10px 14px;
	background: var(--zui-neutral-bg);
	border-bottom: 1px solid var(--zui-border);
}

.zui-scope.cev-admin .cev-tpl-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #cbd5e1;
}

.zui-scope.cev-admin .cev-tpl-card__name {
	margin-inline-start: 6px;
	font-size: 12px;
	font-weight: 600;
	color: var(--zui-text-muted);
}

.zui-scope.cev-admin .cev-tpl-card__check {
	margin-inline-start: auto;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--zui-primary);
	color: #fff;
	font-size: 11px;
	display: none;
	align-items: center;
	justify-content: center;
}

.zui-scope.cev-admin .cev-tpl-card:has(.cev-tpl-card__radio:checked) .cev-tpl-card__check {
	display: inline-flex;
}

.zui-scope.cev-admin .cev-tpl-card__canvas {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 150px;
	padding: 18px;
	background: var(--zui-bg);
}

.zui-scope.cev-admin .cev-tpl-card__meta {
	display: block;
	padding: 12px 16px;
	border-top: 1px solid var(--zui-border);
}

.zui-scope.cev-admin .cev-tpl-card__meta strong {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--zui-text);
}

.zui-scope.cev-admin .cev-tpl-card__meta small {
	display: block;
	margin-top: 2px;
	font-size: 12px;
	color: var(--zui-text-muted);
}

.zui-scope.cev-admin .cev-tpl-customize-link {
	display: inline-block;
	margin-bottom: 12px;
	font-size: 12px;
	font-weight: 500;
	color: var(--zui-primary, #4f46e5);
	text-decoration: none;
}

.zui-scope.cev-admin .cev-tpl-customize-link:hover {
	text-decoration: underline;
}

/* Wireframe primitives (inside .cev-tpl-card__canvas) */
.zui-scope.cev-admin .cev-wf {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.zui-scope.cev-admin .cev-wf--split,
.zui-scope.cev-admin .cev-wf--cols {
	gap: 10px;
	align-items: stretch;
}

.zui-scope.cev-admin .cev-wf-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 12px;
	background: #fff;
	border: 1px solid var(--zui-border);
	border-radius: 8px;
	box-shadow: var(--zui-shadow-xs);
}

.zui-scope.cev-admin .cev-wf-card--narrow {
	width: 210px;
}

.zui-scope.cev-admin .cev-wf-line {
	height: 8px;
	border-radius: 4px;
	background: #e2e8f0;
}

.zui-scope.cev-admin .cev-wf-line--half {
	width: 55%;
}

.zui-scope.cev-admin .cev-wf-btn {
	height: 18px;
	border-radius: 5px;
	background: var(--zui-primary);
	opacity: 0.85;
}

.zui-scope.cev-admin .cev-wf-tabs {
	display: flex;
	gap: 5px;
	margin-bottom: 2px;
}

.zui-scope.cev-admin .cev-wf-tab {
	flex: 1;
	height: 16px;
	border-radius: 5px;
	background: #f1f5f9;
}

.zui-scope.cev-admin .cev-wf-tab--on {
	background: var(--zui-primary);
}

.zui-scope.cev-admin .cev-wf-brand {
	flex: 0 0 42%;
	min-height: 100px;
	border-radius: 8px;
	background: linear-gradient(135deg, var(--zui-primary), #7c3aed);
}

.zui-scope.cev-admin .cev-wf-col {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 8px;
	justify-content: center;
	padding: 4px;
}

.zui-scope.cev-admin .cev-wf-col--divider {
	border-inline-start: 1px dashed #cbd5e1;
	padding-inline-start: 10px;
}

/* Template 1 — brand top accent + left logo + underline tabs */
.zui-scope.cev-admin .cev-wf-card--accent {
	border-top: 3px solid var(--zui-primary);
}

.zui-scope.cev-admin .cev-wf-line--logo-left {
	width: 38%;
	margin: 0 0 4px;
	background: #cbd5e1;
}

.zui-scope.cev-admin .cev-wf-tabs--underline {
	gap: 10px;
	margin-bottom: 4px;
	border-bottom: 1px solid #e2e8f0;
}

.zui-scope.cev-admin .cev-wf-tabs--underline .cev-wf-tab {
	flex: 0 0 30px;
	height: 11px;
	margin-bottom: -1px;
	border-radius: 3px 3px 0 0;
	border-bottom: 2px solid transparent;
}

.zui-scope.cev-admin .cev-wf-tabs--underline .cev-wf-tab--on {
	background: #ede9fe;
	border-bottom-color: var(--zui-primary);
}

/* Template 3 — brand header banner */
.zui-scope.cev-admin .cev-wf-banner {
	height: 30px;
	margin: -12px -12px 10px;
	border-radius: 8px 8px 0 0;
	background: linear-gradient(135deg, var(--zui-primary), #7c3aed);
}

/* Smart Form — Placement shortcode callout (banner + copy button). */
.zui-scope.cev-admin .cev-shortcode-callout {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 18px 20px;
	background: var(--zui-primary-50);
	border: 1px solid var(--zui-primary-100);
	border-radius: var(--zui-radius-2xl);
}

.zui-scope.cev-admin .cev-shortcode-callout__head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.zui-scope.cev-admin .cev-shortcode-callout__icon {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--zui-radius-lg);
	background: var(--zui-primary-100);
	color: var(--zui-primary-600);
}

.zui-scope.cev-admin .cev-shortcode-callout__icon svg {
	width: 18px;
	height: 18px;
}

.zui-scope.cev-admin .cev-shortcode-callout__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.zui-scope.cev-admin .cev-shortcode-callout__title {
	font-size: 14px;
	font-weight: 600;
	color: var(--zui-text);
}

.zui-scope.cev-admin .cev-shortcode-callout__desc {
	font-size: 12px;
	color: var(--zui-text-muted);
}

.zui-scope.cev-admin .cev-shortcode-callout__row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-inline-start: 48px;
}

.zui-scope.cev-admin .cev-shortcode-chip {
	flex: 1;
	min-width: 0;
	padding: 9px 14px;
	background: #fff;
	border: 1px solid var(--zui-border);
	border-radius: var(--zui-radius-lg);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 13px;
	color: var(--zui-primary-600);
	user-select: all;
}

.zui-scope.cev-admin .cev-shortcode-copy {
	flex-shrink: 0;
	appearance: none;
	-webkit-appearance: none;
	border: 0;
	background: var(--zui-primary);
	color: #fff;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	padding: 9px 18px;
	border-radius: var(--zui-radius-lg);
	cursor: pointer;
	transition: background var(--zui-dur) var(--zui-ease);
}

.zui-scope.cev-admin .cev-shortcode-copy:hover {
	background: var(--zui-primary-hover);
}

.zui-scope.cev-admin .cev-shortcode-copy.is-copied {
	background: #047857;
}

/* Sub-group heading inside the Smart Form block (rendered via a desc row). */
.zui-scope.cev-admin .cev-group-title {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: var(--zui-text);
}

/* Left accent border that visually groups the method toggles. The rows are
   flush + adjacent, so their borders join into one continuous line. */
.zui-scope.cev-admin .cev-smart-indent--first {
	margin-block-start: 8px;
}

/* Smart Form — single-select method group. Each group is a self-contained
   bordered card (heading + toggles) with NO inner row dividers, so the two
   sections read as visually separate. */
.zui-scope.cev-admin .cev-method-card {
	padding: 16px 20px;
	border: 1px solid var(--zui-border);
	border-radius: var(--zui-radius-2xl);
}

.zui-scope.cev-admin .cev-method-list {
	display: flex;
	flex-direction: column;
	margin-top: 6px;
}

.zui-scope.cev-admin .cev-method-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 10px 0;
}

.zui-scope.cev-admin .cev-method-item__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.zui-scope.cev-admin .cev-method-item__label {
	font-size: 13px;
	font-weight: 500;
	color: var(--zui-text-soft);
}

.zui-scope.cev-admin .cev-method-item__desc {
	font-size: 11px;
	color: var(--zui-text-muted);
}

/* Smart Form — SMS Gateway card + per-provider credential grid. */
.zui-scope.cev-admin .cev-sms__intro {
	margin: 4px 0 12px;
	font-size: 12px;
	color: var(--zui-text-muted);
}

.zui-scope.cev-admin .cev-sms {
	background: var(--zui-neutral-bg);
	border: 1px solid var(--zui-border);
	border-radius: var(--zui-radius-2xl);
	padding: 20px;
}

.zui-scope.cev-admin .cev-sms__divider {
	height: 1px;
	background: var(--zui-border);
	margin: 18px 0;
}

.zui-scope.cev-admin .cev-sms-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.zui-scope.cev-admin .cev-sms-grid + .cev-sms-grid {
	margin-top: 16px;
}

.zui-scope.cev-admin .cev-sms-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.zui-scope.cev-admin .cev-sms-field--full {
	grid-column: 1 / -1;
}

.zui-scope.cev-admin .cev-sms-field__label {
	font-size: 13px;
	font-weight: 500;
	color: var(--zui-text-soft);
}

.zui-scope.cev-admin .cev-sms-field__hint {
	font-size: 11px;
	color: var(--zui-text-muted);
}

.zui-scope.cev-admin .cev-sms-field .zui-input,
.zui-scope.cev-admin .cev-sms-field .zui-select,
.zui-scope.cev-admin .cev-sms-field .zui-select-wrap,
.zui-scope.cev-admin .cev-sms .cev-sms-field--full .zui-select-wrap {
	width: 100%;
	max-width: none;
}

.zui-scope.cev-admin .cev-sms__toggle-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--zui-border);
}

.zui-scope.cev-admin .cev-sms__link {
	display: inline-block;
	margin-top: 14px;
	font-size: 12px;
	font-weight: 600;
	color: var(--zui-primary-600);
	text-decoration: none;
}

.zui-scope.cev-admin .cev-sms__link:hover {
	text-decoration: underline;
}

/* Template picker row: label on top, cards below at full width. */
.zui-scope.cev-admin .cev-row--stacked {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 14px;
}

.zui-scope.cev-admin .cev-row--stacked .zui-row__control {
	width: 100%;
}

/* Full-width Smart Form widgets (method cards, shortcode, SMS gateway). */
.zui-scope.cev-admin .cev-smart-preview .zui-row--flush .zui-row__control {
	display: block;
	width: 100%;
}

/* Signup form type: disabled WooCommerce Form / Smart Form choice. */
.zui-scope.cev-admin .cev-segmented--locked .zui-segmented__item:disabled {
	cursor: not-allowed;
}

.zui-scope.cev-admin .cev-segmented--locked .zui-segmented__item:disabled:not(.is-active) {
	opacity: 0.7;
}

@media (max-width: 782px) {
	.zui-scope.cev-admin .cev-tpl-grid,
	.zui-scope.cev-admin .cev-sms-grid {
		grid-template-columns: 1fr;
	}

	.zui-scope.cev-admin .cev-shortcode-callout__row {
		padding-inline-start: 0;
	}
}