/**
 * GoValid QR admin styles.
 *
 * @package GoValid_QR
 */

/* --------------------------------------------------------
   CSS Custom Properties
   -------------------------------------------------------- */
.wrap[class*="govalid-"],
.govalid-modal-overlay {
	--gv-primary: #2563eb;
	--gv-primary-light: #eff6ff;
	--gv-primary-dark: #1d4ed8;
	--gv-accent: #0ea5e9;
	--gv-success: #16a34a;
	--gv-success-light: #f0fdf4;
	--gv-danger: #dc2626;
	--gv-danger-light: #fef2f2;
	--gv-gray-50: #f8fafc;
	--gv-gray-100: #f1f5f9;
	--gv-gray-200: #e2e8f0;
	--gv-gray-300: #cbd5e1;
	--gv-gray-400: #94a3b8;
	--gv-gray-500: #64748b;
	--gv-gray-600: #475569;
	--gv-gray-700: #334155;
	--gv-gray-800: #1e293b;
	--gv-gray-900: #0f172a;
	--gv-radius: 10px;
	--gv-radius-lg: 14px;
	--gv-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
	--gv-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
	--gv-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.04);
	--gv-transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* --------------------------------------------------------
   Spinner animation
   -------------------------------------------------------- */
@keyframes govalid-spin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

.govalid-spin {
	animation: govalid-spin 1s linear infinite;
	display: inline-block;
}

/* --------------------------------------------------------
   Page Header
   -------------------------------------------------------- */
.govalid-page-header {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 24px;
	padding: 0;
}

.govalid-page-header-logo {
	height: 36px;
	width: auto;
	flex-shrink: 0;
}

.govalid-page-header h1 {
	font-size: 22px;
	font-weight: 700;
	color: var(--gv-gray-900);
	margin: 0;
	padding: 0;
	line-height: 1.2;
}

.govalid-page-header .govalid-page-subtitle {
	font-size: 13px;
	color: var(--gv-gray-500);
	font-weight: 400;
	margin: 2px 0 0;
}

/* --------------------------------------------------------
   Cards
   -------------------------------------------------------- */
.govalid-card {
	background: #fff;
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius-lg);
	padding: 28px;
	margin: 0 0 20px;
	max-width: 750px;
	box-sizing: border-box;
	box-shadow: var(--gv-shadow-sm);
	transition: box-shadow var(--gv-transition);
}

.govalid-card:hover {
	box-shadow: var(--gv-shadow);
}

.govalid-card h2 {
	font-size: 16px;
	font-weight: 600;
	color: var(--gv-gray-800);
	margin: 0 0 16px;
	padding: 0 0 14px;
	border-bottom: 1px solid var(--gv-gray-100);
}

/* Connected user info */
.govalid-connected-card {
	border-left: 4px solid var(--gv-success);
	background: linear-gradient(135deg, var(--gv-success-light) 0%, #fff 40%);
}

.govalid-user-info {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 16px 0;
}

.govalid-avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 2px solid var(--gv-gray-200);
	box-shadow: var(--gv-shadow-sm);
}

.govalid-user-name {
	font-size: 15px;
	font-weight: 600;
	color: var(--gv-gray-800);
	margin: 0;
}

.govalid-user-email {
	color: var(--gv-gray-500);
	font-size: 13px;
	margin: 2px 0 0;
}

/* --------------------------------------------------------
   Buttons
   -------------------------------------------------------- */
.govalid-disconnect-btn {
	color: var(--gv-danger) !important;
	border-color: var(--gv-danger) !important;
	border-radius: 6px !important;
	font-size: 13px !important;
	transition: all var(--gv-transition) !important;
}

.govalid-disconnect-btn:hover {
	background: var(--gv-danger) !important;
	color: #fff !important;
}

.govalid-connect-btn {
	background: linear-gradient(135deg, #10b981, #059669) !important;
	border: none !important;
	border-radius: 8px !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	padding: 10px 28px !important;
	color: #fff !important;
	box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3) !important;
	transition: all var(--gv-transition) !important;
	height: auto !important;
	line-height: 1.4 !important;
}

.govalid-connect-btn:hover {
	box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4) !important;
	transform: translateY(-1px);
}

/* --------------------------------------------------------
   Tabs Navigation
   -------------------------------------------------------- */
.govalid-tabs-nav {
	display: flex;
	gap: 4px;
	margin: 0 0 0;
	max-width: 750px;
	padding: 4px;
	background: var(--gv-gray-100);
	border-radius: var(--gv-radius-lg) var(--gv-radius-lg) 0 0;
	border: 1px solid var(--gv-gray-200);
	border-bottom: none;
	box-sizing: border-box;
}

.govalid-tab-link {
	display: flex;
	align-items: center;
	gap: 7px;
	padding: 10px 18px;
	font-size: 13px;
	font-weight: 500;
	color: var(--gv-gray-500);
	text-decoration: none;
	border: none;
	border-radius: var(--gv-radius);
	background: transparent;
	transition: all var(--gv-transition);
	white-space: nowrap;
}

.govalid-tab-link:hover {
	color: var(--gv-gray-700);
	background: rgba(255, 255, 255, 0.7);
}

.govalid-tab-link:focus {
	outline: none;
	box-shadow: 0 0 0 2px var(--gv-primary-light);
	color: var(--gv-gray-700);
}

.govalid-tab-link.active {
	color: var(--gv-primary);
	background: #fff;
	font-weight: 600;
	box-shadow: var(--gv-shadow-sm);
}

.govalid-tab-link .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
}

/* --------------------------------------------------------
   Tab Panels
   -------------------------------------------------------- */
.govalid-tab-panel {
	display: none;
	max-width: 750px;
}

.govalid-tab-panel.active {
	display: block;
}

.govalid-tab-panel > .govalid-card:first-child {
	margin-top: 0;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.govalid-tab-placeholder {
	color: var(--gv-gray-400);
	font-style: italic;
	padding: 32px 0;
	text-align: center;
	font-size: 14px;
}

/* --------------------------------------------------------
   Generator Two-Column Layout
   -------------------------------------------------------- */
.govalid-generator-layout {
	display: flex;
	gap: 24px;
	align-items: flex-start;
}

.govalid-generator-main {
	flex: 0 1 800px;
	max-width: 800px;
	min-width: 0;
}

.govalid-generator-main .govalid-tabs-nav,
.govalid-generator-main .govalid-tab-panel,
.govalid-generator-main .govalid-card {
	max-width: none;
}

/* --------------------------------------------------------
   Promo Sidebar
   -------------------------------------------------------- */
.govalid-promo-sidebar {
	flex: 0 0 300px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	position: sticky;
	top: 46px;
	min-height: 100px;
}

.govalid-promo-sidebar:empty {
	display: none;
}

.govalid-promo-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 32px 0;
	color: var(--gv-gray-400);
}

/* ---- Base promo banner ---- */
.govalid-promo-banner {
	background: #fff;
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius-lg);
	padding: 24px;
	position: relative;
	overflow: hidden;
	transition: box-shadow var(--gv-transition), transform var(--gv-transition);
}

.govalid-promo-banner:hover {
	box-shadow: var(--gv-shadow-md);
}

/* ---- Icon circle (top-center) ---- */
.govalid-promo-icon-circle {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px;
}

.govalid-promo-icon-circle .dashicons {
	font-size: 30px;
	width: 30px;
	height: 30px;
	line-height: 30px;
}

/* ======================================================
   PROMO theme — full blue gradient
   ====================================================== */
.govalid-promo-promo {
	background: linear-gradient(160deg, #1e3a8a 0%, #2563eb 50%, #3b82f6 100%);
	border: 2px solid #60a5fa;
	padding: 36px 28px 34px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.govalid-promo-promo::before {
	content: '';
	position: absolute;
	top: -40px;
	right: -40px;
	width: 120px;
	height: 120px;
	background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.govalid-promo-promo::after {
	content: '';
	position: absolute;
	bottom: -30px;
	left: -30px;
	width: 100px;
	height: 100px;
	background: radial-gradient(circle, rgba(96,165,250,0.15) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.govalid-promo-promo:hover {
	border-color: #93c5fd;
	box-shadow: 0 6px 28px rgba(37, 99, 235, 0.35);
	transform: translateY(-2px);
}

.govalid-promo-icon-promo {
	background: rgba(255, 255, 255, 0.15);
	color: #fff;
}

.govalid-promo-promo h3 {
	font-size: 20px;
	font-weight: 800;
	color: #fff;
	margin: 0 0 12px;
	letter-spacing: -0.01em;
}

.govalid-promo-promo p {
	font-size: 14px;
	color: #fff;
	line-height: 1.7;
	margin: 0 0 20px;
}

/* Promo code box */
.govalid-promo-code-box {
	display: inline-block;
	background: rgba(255, 255, 255, 0.12);
	border: 2px dashed rgba(255, 255, 255, 0.5);
	border-radius: 12px;
	padding: 12px 28px;
	font-size: 26px;
	font-weight: 900;
	color: #fff;
	letter-spacing: 0.1em;
	margin: 0 auto 18px;
	font-family: 'Courier New', monospace;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}

/* Badge variants */
.govalid-promo-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	padding: 5px 14px;
	border-radius: 20px;
	margin-bottom: 14px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.govalid-promo-badge-promo {
	background: rgba(255, 255, 255, 0.2);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.3);
	animation: govalid-pulse-badge 2s ease-in-out infinite;
}

@keyframes govalid-pulse-badge {
	0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3); }
	50% { box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); }
}

.govalid-promo-badge-nexhub {
	background: linear-gradient(135deg, #7c3aed, #2563eb);
	color: #fff;
}

/* Promo CTA button — white on blue */
.govalid-promo-btn-promo {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	padding: 12px 28px;
	border-radius: 12px;
	text-decoration: none;
	cursor: pointer;
	background: #fff;
	color: #1e40af;
	border: none;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
	transition: all var(--gv-transition);
	animation: govalid-shake-btn 3s ease-in-out infinite;
}

@keyframes govalid-shake-btn {
	0%, 85%, 100% { transform: translateX(0); }
	87% { transform: translateX(-4px) rotate(-2deg); }
	89% { transform: translateX(4px) rotate(2deg); }
	91% { transform: translateX(-3px) rotate(-1deg); }
	93% { transform: translateX(3px) rotate(1deg); }
	95% { transform: translateX(0); }
}

.govalid-promo-btn-promo:hover {
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
	transform: translateY(-2px);
	color: #1e3a8a;
	background: #f0f7ff;
}

.govalid-promo-btn-promo .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
}

/* ======================================================
   NEXHUB theme — vibrant purple/blue, community feel
   ====================================================== */
.govalid-promo-nexhub {
	background: linear-gradient(160deg, #f5f3ff 0%, #eff6ff 40%, #fff 100%);
	border: 2px solid #c4b5fd;
	padding: 36px 28px 34px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.govalid-promo-nexhub::before {
	content: '';
	position: absolute;
	top: -30px;
	right: -30px;
	width: 90px;
	height: 90px;
	background: radial-gradient(circle, rgba(124,58,237,0.1) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.govalid-promo-nexhub::after {
	content: '';
	position: absolute;
	bottom: -25px;
	left: -25px;
	width: 70px;
	height: 70px;
	background: radial-gradient(circle, rgba(37,99,235,0.08) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.govalid-promo-nexhub:hover {
	border-color: #a78bfa;
	box-shadow: 0 6px 24px rgba(124, 58, 237, 0.15);
	transform: translateY(-2px);
}

.govalid-promo-icon-nexhub {
	background: linear-gradient(135deg, #ede9fe, #ddd6fe);
	color: #7c3aed;
}

.govalid-promo-nexhub h3 {
	font-size: 20px;
	font-weight: 800;
	color: #5b21b6;
	margin: 0 0 12px;
}

.govalid-promo-nexhub p {
	font-size: 14px;
	color: #4c1d95;
	line-height: 1.7;
	margin: 0 0 20px;
}

/* NexHub image carousel */
.govalid-nexhub-carousel {
	width: 100%;
	margin-bottom: 16px;
	position: relative;
}

.govalid-nexhub-slides {
	position: relative;
	width: 140px;
	height: 280px;
	margin: 0 auto;
	overflow: hidden;
	border-radius: 16px;
	box-shadow: 0 4px 20px rgba(124, 58, 237, 0.15);
}

.govalid-nexhub-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 16px;
	opacity: 0;
	transform: scale(0.95);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.govalid-nexhub-slide.active {
	opacity: 1;
	transform: scale(1);
}

.govalid-nexhub-dots {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 12px;
}

.govalid-nexhub-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #c4b5fd;
	cursor: pointer;
	transition: all 0.3s ease;
}

.govalid-nexhub-dot.active {
	background: linear-gradient(135deg, #7c3aed, #2563eb);
	transform: scale(1.3);
	box-shadow: 0 0 6px rgba(124, 58, 237, 0.4);
}

/* NexHub CTA button */
.govalid-promo-btn-nexhub {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	padding: 12px 28px;
	border-radius: 12px;
	text-decoration: none;
	cursor: pointer;
	background: linear-gradient(135deg, #7c3aed, #2563eb);
	color: #fff;
	border: none;
	box-shadow: 0 3px 12px rgba(124, 58, 237, 0.3);
	transition: all var(--gv-transition);
}

.govalid-promo-btn-nexhub:hover {
	box-shadow: 0 6px 20px rgba(124, 58, 237, 0.4);
	transform: translateY(-2px);
	color: #fff;
}

.govalid-promo-btn-nexhub .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
	line-height: 18px;
}

/* ---- Default text-ad heading/paragraph ---- */
.govalid-promo-banner h3 {
	font-size: 15px;
	font-weight: 700;
	color: var(--gv-gray-800);
	margin: 0 0 8px;
}

.govalid-promo-banner p {
	font-size: 13px;
	color: var(--gv-gray-500);
	line-height: 1.5;
	margin: 0 0 14px;
}

/* Themed cards override default text colors */
.govalid-promo-promo p,
.govalid-promo-promo h3 {
	color: #fff;
}

.govalid-promo-nexhub h3 {
	color: #5b21b6;
}

.govalid-promo-nexhub p {
	color: #4c1d95;
}

.govalid-promo-features {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}

.govalid-promo-features li {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--gv-gray-700);
	padding: 3px 0;
}

.govalid-promo-features .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
	color: var(--gv-success);
}

/* ---- Generic promo buttons ---- */
.govalid-promo-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	padding: 8px 16px;
	border-radius: 8px;
	text-decoration: none;
	transition: all var(--gv-transition);
	cursor: pointer;
}

.govalid-promo-btn .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
}

.govalid-promo-btn-primary {
	background: linear-gradient(135deg, var(--gv-primary), var(--gv-accent));
	color: #fff;
	border: none;
	box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}

.govalid-promo-btn-primary:hover {
	box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
	transform: translateY(-1px);
	color: #fff;
}

.govalid-promo-btn-outline {
	background: #fff;
	color: var(--gv-gray-700);
	border: 1px solid var(--gv-gray-200);
}

.govalid-promo-btn-outline:hover {
	border-color: var(--gv-primary);
	color: var(--gv-primary);
	background: var(--gv-primary-light);
}

/* Responsive — stack on narrow screens */
@media (max-width: 1200px) {
	.govalid-promo-sidebar {
		flex: 0 0 260px;
	}
}

@media (max-width: 1024px) {
	.govalid-generator-layout {
		flex-direction: column;
	}

	.govalid-promo-sidebar {
		flex: none;
		flex-direction: row;
		flex-wrap: wrap;
		width: 100%;
		max-width: 750px;
		position: static;
	}

	.govalid-promo-banner {
		flex: 1 1 220px;
	}
}

/* --------------------------------------------------------
   Form table overrides inside cards
   -------------------------------------------------------- */
.govalid-card .form-table th {
	font-weight: 500;
	color: var(--gv-gray-700);
	padding: 16px 10px 16px 0;
	font-size: 13px;
}

.govalid-card .form-table td {
	padding: 12px 10px;
}

.govalid-card .form-table input[type="text"],
.govalid-card .form-table input[type="url"],
.govalid-card .form-table input[type="password"],
.govalid-card .form-table select,
.govalid-card .form-table textarea {
	border: 1px solid var(--gv-gray-300);
	border-radius: 6px;
	padding: 6px 12px;
	font-size: 13px;
	transition: border-color var(--gv-transition), box-shadow var(--gv-transition);
}

.govalid-card .form-table input:focus,
.govalid-card .form-table select:focus,
.govalid-card .form-table textarea:focus {
	border-color: var(--gv-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
	outline: none;
}

.govalid-card .form-table .description {
	color: var(--gv-gray-400);
	font-size: 12px;
	margin-top: 6px;
}

.govalid-card .form-table code {
	background: var(--gv-gray-100);
	border: 1px solid var(--gv-gray-200);
	border-radius: 5px;
	padding: 3px 8px;
	font-size: 12px;
	color: var(--gv-primary-dark);
}

.govalid-card .submit input[type="submit"],
.govalid-card .button-secondary {
	border-radius: 6px !important;
	font-size: 13px !important;
	transition: all var(--gv-transition) !important;
}

.govalid-card hr {
	border: none;
	border-top: 1px solid var(--gv-gray-100);
	margin: 20px 0;
}

/* --------------------------------------------------------
   QR List Items
   -------------------------------------------------------- */
.govalid-qr-list {
	min-height: 80px;
}

.govalid-loading {
	color: var(--gv-gray-400);
	font-style: italic;
	text-align: center;
	padding: 24px 0;
}

/* --------------------------------------------------------
   Action Buttons (table row actions)
   -------------------------------------------------------- */
.govalid-actions {
	display: flex;
	gap: 6px;
	align-items: center;
}

.govalid-action-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--gv-gray-200);
	border-radius: 8px;
	background: #fff;
	color: var(--gv-gray-500);
	cursor: pointer;
	transition: all 0.15s ease;
	text-decoration: none;
	padding: 0;
	box-sizing: border-box;
}

.govalid-action-btn:hover {
	background: var(--gv-gray-50);
	border-color: var(--gv-gray-300);
	color: var(--gv-gray-700);
}

.govalid-action-btn:focus {
	outline: none;
	box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

.govalid-action-btn .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

.govalid-action-btn--primary {
	border-color: var(--gv-primary);
	color: var(--gv-primary);
	background: rgba(37, 99, 235, 0.05);
}

.govalid-action-btn--primary:hover {
	background: var(--gv-primary);
	border-color: var(--gv-primary);
	color: #fff;
}

.govalid-action-btn--danger {
	border-color: var(--gv-gray-200);
	color: var(--gv-danger);
}

.govalid-action-btn--danger:hover {
	background: var(--gv-danger);
	border-color: var(--gv-danger);
	color: #fff;
}

.govalid-qr-list-header {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 8px;
}

.govalid-qr-list-header-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.govalid-qr-list-header-left {
	display: flex;
	align-items: center;
	gap: 10px;
}

.govalid-qr-list-header-right {
	display: flex;
	align-items: center;
	gap: 10px;
}

.govalid-qr-list-header h2 {
	margin: 0;
	white-space: nowrap;
}

.govalid-qr-search-wrap {
	max-width: 260px;
}

.govalid-qr-list-header-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.govalid-qr-list-item {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 0;
	border-bottom: 1px solid var(--gv-gray-100);
	transition: background var(--gv-transition);
}

.govalid-qr-list-item:last-child {
	border-bottom: none;
}

.govalid-qr-list-item:hover {
	background: var(--gv-gray-50);
	margin: 0 -12px;
	padding-left: 12px;
	padding-right: 12px;
	border-radius: 8px;
}

.govalid-qr-list-item .govalid-qr-list-img {
	width: 52px;
	height: 52px;
	border-radius: 8px;
	flex-shrink: 0;
	border: 1px solid var(--gv-gray-200);
	object-fit: contain;
	background: #fff;
}

.govalid-qr-list-placeholder {
	width: 52px;
	height: 52px;
	border-radius: 8px;
	flex-shrink: 0;
	border: 1px solid var(--gv-gray-200);
	background: var(--gv-gray-50);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--gv-gray-300);
}

.govalid-qr-list-placeholder .dashicons {
	font-size: 24px;
	width: 24px;
	height: 24px;
}

.govalid-qr-list-item-info {
	flex: 1;
	min-width: 0;
}

.govalid-qr-list-item-name {
	font-weight: 600;
	color: var(--gv-gray-800);
	font-size: 14px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.govalid-qr-list-item-detail {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 4px;
	flex-wrap: wrap;
}

.govalid-qr-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 500;
	padding: 1px 8px;
	border-radius: 10px;
	background: var(--gv-blue-50, #eef4ff);
	color: var(--gv-blue-600, #3b82f6);
	text-transform: capitalize;
}

/* Type-specific badge colors */
.govalid-qr-badge-certificate {
	background: #eff6ff;
	color: #2563eb;
}

.govalid-qr-badge-goods {
	background: #f0fdf4;
	color: #16a34a;
}

.govalid-qr-badge-custom {
	background: #faf5ff;
	color: #9333ea;
}

.govalid-qr-badge-document {
	background: #fff7ed;
	color: #ea580c;
}

.govalid-qr-badge-timeline {
	background: #fdf2f8;
	color: #db2777;
}

.govalid-qr-badge-level {
	background: var(--gv-gray-100);
	color: var(--gv-gray-600);
}

.govalid-qr-badge-pw {
	background: #fef3c7;
	color: #92400e;
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.govalid-qr-badge-pw .dashicons {
	font-size: 12px;
	width: 12px;
	height: 12px;
	line-height: 12px;
}

.govalid-qr-scans {
	font-size: 12px;
	color: var(--gv-gray-500);
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.govalid-qr-scans .dashicons {
	font-size: 14px;
	width: 14px;
	height: 14px;
}

.govalid-qr-date {
	font-size: 12px;
	color: var(--gv-gray-400);
}

.govalid-qr-list-item-meta {
	color: var(--gv-gray-400);
	font-size: 12px;
	margin-top: 6px;
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

.govalid-qr-list-item-meta code {
	background: var(--gv-gray-100);
	border: 1px solid var(--gv-gray-200);
	border-radius: 4px;
	padding: 1px 6px;
	font-size: 11px;
	color: var(--gv-gray-600);
}

.govalid-qr-code-badge {
	display: inline-block;
	font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
	font-size: 11px;
	font-weight: 600;
	padding: 2px 8px;
	background: var(--gv-gray-100);
	border: 1px solid var(--gv-gray-200);
	border-radius: 4px;
	color: var(--gv-gray-700);
	letter-spacing: 0.3px;
}

/* QR List Checkboxes */
.govalid-qr-checkbox-wrap {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	cursor: pointer;
	flex-shrink: 0;
	width: 20px;
	height: 20px;
}

.govalid-qr-checkbox-wrap input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.govalid-qr-checkmark {
	width: 18px;
	height: 18px;
	border: 2px solid var(--gv-gray-300);
	border-radius: 4px;
	background: #fff;
	transition: all var(--gv-transition);
	display: flex;
	align-items: center;
	justify-content: center;
}

.govalid-qr-checkbox-wrap input:checked + .govalid-qr-checkmark {
	background: var(--gv-primary);
	border-color: var(--gv-primary);
}

.govalid-qr-checkbox-wrap input:checked + .govalid-qr-checkmark::after {
	content: '';
	width: 5px;
	height: 9px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
	margin-top: -1px;
}

.govalid-qr-checkbox-wrap:hover .govalid-qr-checkmark {
	border-color: var(--gv-primary);
}

.govalid-qr-select-all-wrap {
	margin-right: 2px;
}

/* QR List Delete Button */
.govalid-qr-list-item .govalid-qr-delete {
	flex-shrink: 0;
	opacity: 0;
	transition: opacity var(--gv-transition);
}

.govalid-qr-list-item:hover .govalid-qr-delete {
	opacity: 1;
}

/* Bulk Delete Button */
#govalid-qr-bulk-delete {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

#govalid-qr-bulk-delete .dashicons {
	font-size: 14px;
	width: 14px;
	height: 14px;
	line-height: 14px;
}

.govalid-qr-pagination {
	margin-top: 16px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
}

.govalid-qr-page-info {
	font-size: 13px;
	color: var(--gv-gray-500);
}

.govalid-qr-per-page-wrap {
	font-size: 13px;
	color: var(--gv-gray-500);
	margin-right: auto;
}

.govalid-qr-per-page {
	padding: 2px 6px;
	border: 1px solid var(--gv-gray-300);
	border-radius: 4px;
	font-size: 13px;
	color: var(--gv-gray-700);
	background: #fff;
}

.govalid-copy-shortcode {
	margin-left: 6px !important;
	font-size: 11px !important;
	border-radius: 4px !important;
}

/* --------------------------------------------------------
   Notices
   -------------------------------------------------------- */
.wrap[class*="govalid-"] .notice {
	max-width: 750px;
	border-radius: 8px;
	border-left-width: 4px;
	margin: 0 0 16px;
}

/* --------------------------------------------------------
   Dashboard Widget
   -------------------------------------------------------- */
.govalid-dashboard-widget .govalid-stats-grid {
	display: flex;
	gap: 16px;
	margin-bottom: 20px;
}

.govalid-stat {
	flex: 1;
	text-align: center;
	padding: 16px 12px;
	background: var(--gv-gray-50);
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
}

.govalid-stat-number {
	display: block;
	font-size: 1.6em;
	font-weight: 700;
	color: var(--gv-gray-900);
}

.govalid-stat-label {
	color: var(--gv-gray-500);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-top: 2px;
}

.govalid-recent-scans {
	list-style: none;
	padding: 0;
	margin: 0;
}

.govalid-recent-scans li {
	padding: 8px 0;
	border-bottom: 1px solid var(--gv-gray-100);
}

.govalid-recent-scans li:last-child {
	border-bottom: none;
}

.govalid-scan-meta {
	display: block;
	font-size: 12px;
	color: var(--gv-gray-400);
	margin-top: 2px;
}

.govalid-widget-footer {
	margin: 14px 0 0;
	padding-top: 10px;
	border-top: 1px solid var(--gv-gray-100);
	text-align: right;
}

.govalid-widget-footer a {
	font-size: 13px;
	font-weight: 500;
	color: var(--gv-primary);
	text-decoration: none;
}

.govalid-widget-footer a:hover {
	text-decoration: underline;
}

.govalid-widget-error {
	color: var(--gv-danger);
	font-style: italic;
}

/* --------------------------------------------------------
   Toast Notification
   -------------------------------------------------------- */
.govalid-toast {
	position: fixed;
	top: 40px;
	right: 20px;
	z-index: 999999;
	background: #0f172a !important;
	color: #fff !important;
	padding: 12px 22px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 500;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	pointer-events: none;
	max-width: 480px;
}

.govalid-toast.visible {
	opacity: 1;
	transform: translateY(0);
}

.govalid-toast.govalid-toast-error {
	background: #dc2626 !important;
	color: #fff !important;
}

/* --------------------------------------------------------
   Form Layout
   -------------------------------------------------------- */
.govalid-form-section {
	margin-bottom: 28px;
}

.govalid-form-section:last-of-type {
	margin-bottom: 8px;
}

.govalid-section-title {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	color: var(--gv-gray-400);
	margin: 0 0 18px;
	padding: 0 0 10px;
	border-bottom: 1px solid var(--gv-gray-100);
}

.govalid-field-group {
	margin-bottom: 18px;
}

.govalid-field-group:last-child {
	margin-bottom: 0;
}

.govalid-field-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-gray-700);
	margin: 0 0 6px;
}

.govalid-field-label-sm {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 4px;
}

.govalid-required {
	color: var(--gv-danger);
}

.govalid-field-help {
	font-size: 12px;
	color: var(--gv-gray-400);
	margin: 5px 0 0;
}

.govalid-badge {
	display: inline-block;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	background: var(--gv-gray-100);
	color: var(--gv-gray-500);
	padding: 1px 7px;
	border-radius: 4px;
	margin-left: 6px;
	vertical-align: middle;
}

/* Existing tag chips (anti-counterfeit) */
.govalid-existing-tags {
	margin-top: 6px;
}
.govalid-tag-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}
.govalid-tag-chip {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	cursor: pointer;
	background: #a78bfa;
	color: #fff;
	font-size: 11px;
	font-weight: 500;
	padding: 3px 10px;
	border-radius: 12px;
	border: none;
	line-height: 1.3;
	transition: background-color 0.2s, opacity 0.2s;
}
.govalid-tag-chip:hover {
	background: #7c3aed;
}
.govalid-tag-chip.govalid-tag-added {
	opacity: 0.45;
	pointer-events: none;
}

/* --------------------------------------------------------
   Form Inputs — border lives on the wrapper, icon is a
   natural flex child so nothing overlaps.
   -------------------------------------------------------- */
.govalid-input-wrap {
	position: relative;
	display: flex;
	align-items: stretch;
	border: 1px solid var(--gv-gray-300);
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
	transition: border-color var(--gv-transition), box-shadow var(--gv-transition);
	max-width: 328px;
}

.govalid-input-wrap:focus-within {
	border-color: var(--gv-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.govalid-input-wrap:has(.govalid-input[readonly]) {
	background: var(--gv-gray-50);
}

/* Icon — flex child, never overlaps */
.govalid-input-icon {
	flex-shrink: 0;
	width: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--gv-gray-400);
	background: var(--gv-gray-50);
	border-right: 1px solid var(--gv-gray-200);
	pointer-events: none;
}

.govalid-input-icon .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
	line-height: 1;
}

/* Input — no border (wrapper owns it) */
/* .govalid-form prefix beats WP admin input[type] specificity */
.govalid-form .govalid-input {
	flex: 1;
	min-width: 0;
	width: 100%;
	border: none;
	border-radius: 0;
	padding: 8px 12px;
	font-size: 13px;
	color: var(--gv-gray-800);
	background: transparent;
	line-height: 1.5;
	min-height: 36px;
	box-sizing: border-box;
	outline: none;
}

.govalid-form .govalid-input[readonly] {
	color: var(--gv-gray-500);
	cursor: default;
}

/* Textarea */
.govalid-form .govalid-textarea {
	resize: vertical;
	min-height: 76px;
}

/* For textareas: icon stretches full height */
.govalid-input-wrap:has(.govalid-textarea) {
	max-width: 328px;
}

/* Select */
.govalid-form .govalid-select {
	width: 100%;
	max-width: 328px;
	height: 40px;
	border: 1px solid var(--gv-gray-300);
	border-radius: 8px;
	padding: 0 12px;
	font-size: 13px;
	color: var(--gv-gray-800);
	background: #fff;
	cursor: pointer;
	box-sizing: border-box;
	transition: border-color var(--gv-transition), box-shadow var(--gv-transition);
}

.govalid-form .govalid-select:focus {
	border-color: var(--gv-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
	outline: none;
}

/* Input action button (show/hide password) — stays absolute within wrap */
.govalid-input-action {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	color: var(--gv-gray-400);
	cursor: pointer;
	padding: 0;
}

.govalid-input-action:hover {
	color: var(--gv-gray-600);
}

.govalid-input-action .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
}

.govalid-form .govalid-input-wrap:has(.govalid-input-action) .govalid-input {
	padding-right: 38px;
}

/* --------------------------------------------------------
   Field Rows (side by side)
   -------------------------------------------------------- */
.govalid-field-row {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	max-width: 328px;
}

/* Inside rows, wraps fill available column space */
.govalid-field-row .govalid-input-wrap {
	max-width: none;
}

.govalid-field-col {
	flex: 1;
	min-width: 0;
}

.govalid-field-col-sm {
	flex: 0 0 200px;
}

.govalid-field-row-3 .govalid-field-col {
	flex: 1;
}

/* --------------------------------------------------------
   Security Level Cards
   -------------------------------------------------------- */
.govalid-security-cards {
	display: flex;
	gap: 10px;
}

.govalid-security-option {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border: 2px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	cursor: pointer;
	transition: all var(--gv-transition);
	background: #fff;
}

.govalid-security-option:hover {
	border-color: var(--gv-gray-300);
	background: var(--gv-gray-50);
}

.govalid-security-option.active {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
}

.govalid-security-option input[type="radio"] {
	display: none;
}

.govalid-security-icon {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--gv-gray-100);
	border-radius: 8px;
	color: var(--gv-gray-500);
}

.govalid-security-icon .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
	line-height: 1;
}

.govalid-security-option.active .govalid-security-icon {
	background: var(--gv-primary);
	color: #fff;
}

.govalid-security-info {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.govalid-security-info strong {
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-gray-800);
}

.govalid-security-info small {
	font-size: 11px;
	color: var(--gv-gray-400);
	margin-top: 1px;
}

.govalid-security-cards.govalid-security-locked {
	pointer-events: none;
	opacity: 0.7;
}

.govalid-security-desc {
	margin-top: 10px;
	padding: 10px 14px;
	font-size: 12px;
	color: var(--gv-gray-500);
	background: var(--gv-gray-50, #f8f9fa);
	border-left: 3px solid var(--gv-primary);
	border-radius: 0 6px 6px 0;
	line-height: 1.5;
	transition: all 0.2s ease;
}

/* --------------------------------------------------------
   Toggle Switch
   -------------------------------------------------------- */
.govalid-switch {
	position: relative;
	display: inline-block;
	width: 36px;
	height: 20px;
	flex-shrink: 0;
}

.govalid-switch input {
	opacity: 0;
	width: 0;
	height: 0;
	position: absolute;
}

.govalid-switch-slider {
	position: absolute;
	cursor: pointer;
	inset: 0;
	background: var(--gv-gray-300);
	border-radius: 20px;
	transition: background var(--gv-transition);
}

.govalid-switch-slider::before {
	content: '';
	position: absolute;
	height: 14px;
	width: 14px;
	left: 3px;
	bottom: 3px;
	background: #fff;
	border-radius: 50%;
	transition: transform var(--gv-transition);
	box-shadow: var(--gv-shadow-sm);
}

.govalid-switch input:checked + .govalid-switch-slider {
	background: var(--gv-primary);
}

.govalid-switch input:checked + .govalid-switch-slider::before {
	transform: translateX(16px);
}

.govalid-switch input:focus + .govalid-switch-slider {
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

/* Toggle header row — label left, switch right */
.govalid-toggle-header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
	max-width: 328px;
}

.govalid-toggle-header .govalid-toggle-label {
	order: -1;
	flex: 1;
}

.govalid-toggle-label {
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-gray-700);
}

.govalid-toggle-body {
	padding-left: 0;
	transition: opacity var(--gv-transition);
}

.govalid-toggle-body.disabled {
	opacity: 0.4;
	pointer-events: none;
}

/* Inline field option (checkbox below a field) */
.govalid-field-option {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}

.govalid-switch-label {
	font-size: 12px;
	color: var(--gv-gray-500);
}

/* --------------------------------------------------------
   Radio Group
   -------------------------------------------------------- */
.govalid-radio-group {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 14px;
}

.govalid-radio {
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	font-size: 13px;
	color: var(--gv-gray-700);
}

.govalid-radio input[type="radio"] {
	display: none;
}

.govalid-radio-mark {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	border: 2px solid var(--gv-gray-300);
	border-radius: 50%;
	position: relative;
	transition: border-color var(--gv-transition);
}

.govalid-radio-mark::after {
	content: '';
	position: absolute;
	inset: 0;
	margin: auto;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--gv-primary);
	transform: scale(0);
	transition: transform var(--gv-transition);
}

.govalid-radio input:checked + .govalid-radio-mark {
	border-color: var(--gv-primary);
}

.govalid-radio input:checked + .govalid-radio-mark::after {
	transform: scale(1);
}

/* --------------------------------------------------------
   Conditional / Hidden containers
   -------------------------------------------------------- */
.govalid-conditional {
	margin-top: 12px;
}

/* Generate quantity input */
.govalid-generate-qty {
	width: 52px;
	height: 40px;
	flex: 0 0 52px;
	text-align: center;
	padding: 0 4px;
	border: 2px solid var(--gv-gray-300);
	border-radius: 10px;
	font-size: 13px;
	color: var(--gv-gray-700);
	background: #fff;
	box-sizing: border-box;
	-moz-appearance: textfield;
}

.govalid-generate-qty::-webkit-outer-spin-button,
.govalid-generate-qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.govalid-generate-qty:focus {
	outline: none;
	border-color: var(--gv-primary);
	box-shadow: 0 0 0 2px rgba(var(--gv-primary-rgb, 79, 70, 229), 0.15);
}

/* Custom pattern: input left, reference card right */
.govalid-custom-pattern-row {
	display: grid;
	grid-template-columns: 328px 1fr;
	gap: 12px;
	align-items: start;
}

.govalid-custom-pattern-input .govalid-input-wrap {
	max-width: none;
}

.govalid-custom-pattern-card {
	background: var(--gv-gray-50, #f8f9fa);
	border: 1px solid var(--gv-gray-200);
	border-radius: 8px;
	padding: 10px 12px;
}

.govalid-pattern-card-section {
	margin-bottom: 8px;
}

.govalid-pattern-card-label {
	display: block;
	font-size: 11px;
	font-weight: 600;
	color: var(--gv-gray-500);
	margin-bottom: 6px;
	text-transform: uppercase;
	letter-spacing: 0.3px;
}

.govalid-pattern-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}

code.govalid-pattern-example {
	display: inline-block;
	font-size: 11px;
	padding: 3px 8px;
	background: #fff;
	border: 1px solid var(--gv-gray-200);
	border-radius: 4px;
	cursor: pointer;
	color: var(--gv-gray-600);
	transition: all 0.15s ease;
	user-select: none;
	white-space: nowrap;
	line-height: 1.4;
}

code.govalid-pattern-example:hover {
	background: var(--gv-primary);
	color: #fff;
	border-color: var(--gv-primary);
}

.govalid-pattern-card-syntax {
	font-size: 10.5px;
	color: var(--gv-gray-400);
	line-height: 1.6;
	border-top: 1px solid var(--gv-gray-200);
	padding-top: 6px;
}

.govalid-pattern-card-syntax code {
	font-size: 10.5px;
	background: transparent;
	color: var(--gv-gray-600);
	font-weight: 600;
}

@media ( max-width: 782px ) {
	.govalid-custom-pattern-row {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------
   Signed by + PIN Verification
   -------------------------------------------------------- */
.govalid-sign-by-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	align-items: start;
}

.govalid-sign-by-name .govalid-input-wrap {
	max-width: none;
}

.govalid-pin-card {
	background: var(--gv-gray-50);
	border: 2px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	overflow: hidden;
}

.govalid-pin-card-inner {
	padding: 14px 16px;
}

.govalid-pin-title {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	color: var(--gv-gray-600);
	margin-bottom: 10px;
}

.govalid-pin-title .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	color: var(--gv-gray-400);
}

.govalid-pin-msg {
	font-size: 12px;
	color: var(--gv-gray-500);
	margin: 0 0 8px;
	line-height: 1.4;
}

.govalid-pin-msg.govalid-pin-warning {
	color: #d97706;
}

.govalid-pin-msg.govalid-pin-ok {
	color: var(--gv-success);
	font-weight: 600;
	margin: 4px 0 0;
}

.govalid-pin-msg.govalid-pin-error {
	color: var(--gv-danger);
}

.govalid-pin-inputs {
	display: flex;
	gap: 6px;
	margin-bottom: 10px;
}

.govalid-pin-digit {
	width: 36px;
	height: 40px;
	text-align: center;
	font-size: 16px;
	font-weight: 700;
	border: 2px solid var(--gv-gray-300);
	border-radius: 8px;
	background: #fff;
	color: var(--gv-gray-800);
	outline: none;
	transition: border-color var(--gv-transition), box-shadow var(--gv-transition);
	padding: 0;
}

.govalid-pin-digit:focus {
	border-color: var(--gv-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.govalid-pin-success-icon {
	text-align: center;
}

.govalid-pin-success-icon .dashicons {
	font-size: 32px;
	width: 32px;
	height: 32px;
	color: var(--gv-success);
}

.govalid-pin-error-msg {
	font-size: 12px;
	color: var(--gv-danger);
	background: var(--gv-danger-light);
	border: 1px solid var(--gv-danger);
	border-radius: 6px;
	padding: 6px 10px;
	margin-top: 8px;
}

.govalid-btn-xs {
	padding: 6px 14px;
	font-size: 12px;
	border-radius: 6px;
}

.govalid-btn-success {
	background: var(--gv-success);
	color: #fff;
	border: none;
}

.govalid-btn-success:hover {
	opacity: 0.9;
}

.govalid-btn-warning {
	background: #f59e0b;
	color: #fff;
	border: none;
}

.govalid-btn-danger-outline {
	background: none;
	color: var(--gv-danger);
	border: 1px solid var(--gv-danger);
}

@media ( max-width: 782px ) {
	.govalid-sign-by-row {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------
   Note Row (two-column layout with note card)
   -------------------------------------------------------- */
.govalid-note-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	align-items: start;
}

.govalid-note-row-main .govalid-input-wrap {
	max-width: none;
}

.govalid-note-card {
	background: var(--gv-gray-50);
	border: 2px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	overflow: hidden;
}

.govalid-note-card-inner {
	padding: 14px 16px;
}

.govalid-note-title {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	color: var(--gv-gray-600);
	margin-bottom: 8px;
}

.govalid-note-title .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	color: var(--gv-gray-400);
}

.govalid-note-text {
	font-size: 12px;
	color: var(--gv-gray-500);
	margin: 0 0 6px;
	line-height: 1.5;
}

.govalid-note-list {
	margin: 6px 0 0;
	padding: 0 0 0 16px;
	font-size: 12px;
	color: var(--gv-gray-500);
	line-height: 1.5;
}

.govalid-note-list li {
	margin-bottom: 4px;
}

.govalid-note-list li strong {
	color: var(--gv-gray-600);
}

@media ( max-width: 782px ) {
	.govalid-note-row {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------
   File Upload
   -------------------------------------------------------- */
.govalid-file-upload {
	position: relative;
	border: 2px dashed var(--gv-gray-300);
	border-radius: var(--gv-radius);
	padding: 12px 16px;
	text-align: center;
	max-width: 328px;
	box-sizing: border-box;
	transition: border-color var(--gv-transition), background var(--gv-transition);
	cursor: pointer;
}

.govalid-file-upload:hover {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
}

.govalid-file-upload.dragging {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
}

.govalid-file-input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.govalid-file-upload-placeholder .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
	color: var(--gv-gray-400);
	display: block;
	margin: 0 auto 4px;
}

.govalid-file-upload-placeholder p {
	font-size: 13px;
	font-weight: 500;
	color: var(--gv-gray-600);
	margin: 0;
}

.govalid-file-upload-placeholder small {
	font-size: 11px;
	color: var(--gv-gray-400);
}

.govalid-file-preview {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.govalid-file-preview-name {
	font-size: 13px;
	font-weight: 500;
	color: var(--gv-gray-700);
}

.govalid-file-remove {
	background: none;
	border: none;
	cursor: pointer;
	color: var(--gv-gray-400);
	padding: 2px;
	border-radius: 4px;
	transition: color var(--gv-transition), background var(--gv-transition);
}

.govalid-file-remove:hover {
	color: var(--gv-danger);
	background: var(--gv-danger-light);
}

.govalid-file-remove .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
}

/* --------------------------------------------------------
   Entry Counter
   -------------------------------------------------------- */
.govalid-entry-counter {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: var(--gv-gray-400);
	margin-top: 6px;
}

.govalid-counter-current {
	font-weight: 600;
	color: var(--gv-gray-600);
}

.govalid-entry-counter.govalid-counter-warning .govalid-counter-current {
	color: #f59e0b;
}

.govalid-entry-counter.govalid-counter-error .govalid-counter-current {
	color: var(--gv-danger);
}

/* --------------------------------------------------------
   Password Strength Bar
   -------------------------------------------------------- */
.govalid-password-strength {
	height: 4px;
	background: transparent;
	border-radius: 4px;
	margin: 4px 0 0;
	overflow: hidden;
}

.govalid-password-bar {
	height: 100%;
	width: 0;
	border-radius: 4px;
	transition: width 0.3s ease, background 0.3s ease;
}

/* --------------------------------------------------------
   Form Buttons
   -------------------------------------------------------- */
.govalid-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border: none;
	border-radius: 8px;
	padding: 10px 20px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all var(--gv-transition);
	line-height: 1.4;
}

.govalid-btn .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
}

.govalid-btn-primary {
	background: linear-gradient(135deg, var(--gv-primary), var(--gv-primary-dark));
	color: #fff;
	box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}

.govalid-btn-primary:hover {
	box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
	transform: translateY(-1px);
}

.govalid-btn-primary-outline {
	background: transparent;
	color: var(--gv-primary);
	border: 1.5px solid var(--gv-primary);
	box-shadow: none;
}

.govalid-btn-primary-outline:hover {
	background: var(--gv-primary);
	color: #fff;
	box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}

.govalid-btn-primary-outline .dashicons {
	color: inherit;
}

.govalid-btn-sm {
	height: 40px;
	padding: 0 12px;
	font-size: 13px;
	border-radius: 8px;
	background: var(--gv-primary);
	color: #fff;
	margin-top: 8px;
	box-sizing: border-box;
}

.govalid-btn-sm:hover {
	background: var(--gv-primary-dark);
	color: #fff;
}

.govalid-btn-sm .dashicons {
	color: #fff;
}

.govalid-form-actions {
	padding-top: 20px;
	border-top: 1px solid var(--gv-gray-100);
	margin-top: 8px;
}

/* --------------------------------------------------------
   Responsive
   -------------------------------------------------------- */
@media screen and (max-width: 782px) {
	.govalid-tabs-nav {
		flex-wrap: wrap;
	}

	.govalid-tab-link {
		padding: 8px 14px;
		font-size: 12px;
	}

	.govalid-card {
		padding: 20px;
	}

	.govalid-page-header h1 {
		font-size: 18px;
	}

	.govalid-security-cards {
		flex-direction: column;
	}

	.govalid-field-row,
	.govalid-field-row-3 {
		flex-direction: column;
	}

	.govalid-field-col-sm {
		flex: auto;
	}

	.govalid-toggle-body {
		padding-left: 0;
	}

	.govalid-link-field-row {
		flex-direction: column !important;
	}

	.govalid-links-table th:first-child,
	.govalid-links-table td:first-child {
		display: none;
	}

	.govalid-link-cell .govalid-link-target-text {
		max-width: 200px;
	}
}

/* --------------------------------------------------------
   Humanize Links Table
   -------------------------------------------------------- */
.govalid-links-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.govalid-links-table th {
	text-align: left;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--gv-gray-400);
	padding: 0 10px 12px;
	border-bottom: 1px solid var(--gv-gray-200);
}

.govalid-links-table td {
	padding: 12px 10px;
	border-bottom: 1px solid var(--gv-gray-100);
	vertical-align: middle;
}

.govalid-links-table tr:last-child td {
	border-bottom: none;
}

.govalid-links-table tr:hover td {
	background: var(--gv-gray-50);
}

.govalid-link-cell {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.govalid-link-url {
	font-weight: 600;
	color: var(--gv-primary);
	text-decoration: none;
	font-size: 13px;
	word-break: break-all;
}

.govalid-link-url:hover {
	text-decoration: underline;
}

.govalid-link-title {
	font-size: 11px;
	color: var(--gv-gray-400);
}

/* QR thumbnail column */
.govalid-th-qr {
	width: 56px;
	padding: 0 6px 12px !important;
}

.govalid-link-qr-cell {
	width: 56px;
	padding: 8px 6px !important;
}

.govalid-link-qr-thumb {
	width: 40px;
	height: 40px;
	border-radius: 4px;
	overflow: hidden;
	cursor: pointer;
	border: 1px solid var(--gv-gray-200);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.govalid-link-qr-thumb:hover {
	transform: scale(1.08);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.govalid-link-qr-thumb canvas {
	display: block;
	width: 40px !important;
	height: 40px !important;
}

/* Target URL inside merged link cell */
.govalid-link-cell .govalid-link-target-text {
	display: block;
	font-size: 11px;
	color: var(--gv-gray-400);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 350px;
	margin-top: 2px;
}

.govalid-link-target-edit {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.govalid-link-target-input {
	width: 100%;
	font-size: 12px !important;
	padding: 6px 10px !important;
	height: auto !important;
	border: 1px solid var(--gv-primary) !important;
	border-radius: 6px !important;
	box-sizing: border-box;
}

.govalid-link-target-btns {
	display: flex;
	gap: 4px;
}

.govalid-link-clicks {
	font-weight: 600;
	color: var(--gv-gray-700);
	text-align: center;
}

.govalid-status-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	padding: 2px 10px;
	border-radius: 12px;
	white-space: nowrap;
}

.govalid-status-active {
	background: var(--gv-success-light);
	color: var(--gv-success);
}

.govalid-status-inactive {
	background: var(--gv-gray-100);
	color: var(--gv-gray-500);
}

.govalid-link-actions {
	white-space: nowrap;
	text-align: right;
}

/* Three-dot dropdown */
.govalid-actions-dropdown {
	position: relative;
	display: inline-block;
}

.govalid-actions-trigger {
	background: none;
	border: 1px solid var(--gv-gray-200);
	border-radius: 6px;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--gv-gray-500);
	transition: all var(--gv-transition);
	padding: 0;
}

.govalid-actions-trigger:hover {
	border-color: var(--gv-primary);
	color: var(--gv-primary);
	background: var(--gv-primary-light);
}

.govalid-actions-trigger .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
	line-height: 18px;
}

.govalid-actions-menu {
	display: none;
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 1000;
	min-width: 170px;
	margin-top: 4px;
	background: #fff;
	border: 1px solid var(--gv-gray-200);
	border-radius: 8px;
	box-shadow: var(--gv-shadow-md);
	padding: 4px 0;
}

.govalid-actions-menu.govalid-actions-open {
	display: block;
}

.govalid-actions-menu button {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 8px 14px;
	border: none;
	background: none;
	font-size: 13px;
	color: var(--gv-gray-700);
	cursor: pointer;
	text-align: left;
	white-space: nowrap;
	transition: background var(--gv-transition);
}

.govalid-actions-menu button:hover {
	background: var(--gv-gray-50);
}

.govalid-actions-menu button .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
	color: var(--gv-gray-400);
}

.govalid-actions-menu button:hover .dashicons {
	color: var(--gv-primary);
}

.govalid-actions-divider {
	border: none;
	border-top: 1px solid var(--gv-gray-100);
	margin: 4px 0;
}

.govalid-actions-menu .govalid-actions-danger {
	color: var(--gv-danger);
}

.govalid-actions-menu .govalid-actions-danger .dashicons {
	color: var(--gv-danger);
}

.govalid-actions-menu .govalid-actions-danger:hover {
	background: var(--gv-danger-light);
}

/* QR thumbnail lightbox modal actions */
.govalid-link-qr-modal-actions {
	display: flex;
	gap: 8px;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.govalid-link-qr-modal-actions .button {
	display: inline-flex !important;
	align-items: center;
	gap: 4px;
}

.govalid-link-qr-modal-actions .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
}

#govalid-link-qr-modal-preview {
	display: flex;
	align-items: center;
	justify-content: center;
}

#govalid-link-qr-modal-preview canvas {
	border-radius: 8px;
	border: 1px solid var(--gv-gray-200);
	background: #fff;
}

.govalid-links-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
}

/* --------------------------------------------------------
   Humanize Suggestion Cards
   -------------------------------------------------------- */
.govalid-suggestion-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 20px;
}

.govalid-suggestion-card {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	border: 2px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	cursor: pointer;
	transition: all var(--gv-transition);
	background: #fff;
}

.govalid-suggestion-card:hover {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
}

.govalid-suggestion-card.selected {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.govalid-suggestion-flag {
	font-size: 22px;
	flex-shrink: 0;
	line-height: 1;
}

.govalid-suggestion-info {
	flex: 1;
	min-width: 0;
}

.govalid-suggestion-url {
	font-size: 14px;
	font-weight: 600;
	color: var(--gv-primary);
	word-break: break-all;
}

.govalid-suggestion-domain {
	font-size: 11px;
	color: var(--gv-gray-400);
	margin-top: 2px;
}

.govalid-suggestion-premium {
	flex-shrink: 0;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	background: linear-gradient(135deg, #f59e0b, #d97706);
	color: #fff;
	padding: 2px 8px;
	border-radius: 4px;
}

/* --------------------------------------------------------
   Slug Editor
   -------------------------------------------------------- */
.govalid-slug-editor {
	padding-top: 16px;
	border-top: 1px solid var(--gv-gray-100);
}

.govalid-slug-edit-row {
	display: flex;
	align-items: stretch;
	border: 2px solid var(--gv-gray-300);
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
	transition: border-color var(--gv-transition);
	max-width: 100%;
}

.govalid-slug-edit-row:focus-within {
	border-color: var(--gv-primary);
}

.govalid-slug-domain-prefix {
	display: flex;
	align-items: center;
	padding: 0 12px;
	background: var(--gv-gray-50);
	border-right: 1px solid var(--gv-gray-200);
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-gray-500);
	white-space: nowrap;
	flex-shrink: 0;
}

.govalid-slug-input {
	flex: 1;
	min-width: 0;
	border: none;
	padding: 10px 12px;
	font-size: 14px;
	font-weight: 600;
	color: var(--gv-gray-800);
	outline: none;
	background: transparent;
}

.govalid-slug-edit-row .govalid-btn-sm {
	margin: 0;
	border-radius: 0;
	height: auto;
	padding: 0 16px;
	flex-shrink: 0;
}

.govalid-slug-status {
	margin-top: 8px;
	font-size: 13px;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 6px;
}

.govalid-slug-status.is-available {
	color: var(--gv-success);
}

.govalid-slug-status.is-taken {
	color: var(--gv-danger);
}

.govalid-slug-status.is-reserved {
	color: #f59e0b;
}

.govalid-slug-status .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

@media screen and (max-width: 782px) {
	.govalid-suggestion-list {
		gap: 8px;
	}

	.govalid-suggestion-card {
		padding: 12px 14px;
	}

	.govalid-slug-edit-row {
		flex-direction: column;
	}

	.govalid-slug-domain-prefix {
		border-right: none;
		border-bottom: 1px solid var(--gv-gray-200);
		padding: 8px 12px;
	}

	.govalid-slug-edit-row .govalid-btn-sm {
		border-top: 1px solid var(--gv-gray-200);
		padding: 10px 16px;
	}
}

/* ======================================
   Analytics Page
   ====================================== */

.govalid-analytics-wide {
	max-width: 1100px;
}

/* Summary cards grid */
.govalid-analytics-summary {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-bottom: 20px;
}

.govalid-analytics-summary-sm {
	grid-template-columns: repeat(2, 1fr);
	margin-bottom: 16px;
}

.govalid-stat-card {
	background: #fff;
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	padding: 20px;
	text-align: center;
	transition: box-shadow 0.2s ease;
}

.govalid-stat-card:hover {
	box-shadow: var(--gv-shadow-md);
}

.govalid-stat-icon {
	font-size: 28px;
	width: 28px;
	height: 28px;
	color: var(--gv-primary);
	margin-bottom: 8px;
}

.govalid-stat-value {
	font-size: 28px;
	font-weight: 700;
	color: var(--gv-gray-900);
	line-height: 1.2;
}

.govalid-stat-label {
	font-size: 13px;
	color: var(--gv-gray-500);
	margin-top: 4px;
}

/* Two-column chart rows */
.govalid-analytics-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.govalid-analytics-row > .govalid-card,
.govalid-analytics-row > div {
	min-width: 0;
}

/* Map card */
.govalid-analytics-map-card {
	max-width: 1100px;
	margin-bottom: 20px;
}

.govalid-analytics-map-card #govalid-analytics-map {
	height: 440px;
	border-radius: 8px;
	z-index: 0;
}

/* MarkerCluster base */
.marker-cluster {
	background-clip: padding-box;
	border-radius: 50%;
}
.marker-cluster div {
	width: 30px;
	height: 30px;
	margin-left: 5px;
	margin-top: 5px;
	text-align: center;
	border-radius: 50%;
	font-size: 12px;
	font-weight: 700;
	line-height: 30px;
}
.marker-cluster span {
	line-height: 30px;
}
.marker-cluster-small {
	background-color: rgba(37, 99, 235, 0.4);
}
.marker-cluster-small div {
	background-color: rgba(37, 99, 235, 0.7);
	color: #fff;
}
.marker-cluster-medium {
	background-color: rgba(37, 99, 235, 0.5);
}
.marker-cluster-medium div {
	background-color: rgba(37, 99, 235, 0.8);
	color: #fff;
}
.marker-cluster-large {
	background-color: rgba(37, 99, 235, 0.6);
}
.marker-cluster-large div {
	background-color: rgba(37, 99, 235, 0.9);
	color: #fff;
}

/* Custom marker pin */
.govalid-marker-pin {
	width: 28px;
	height: 28px;
	border-radius: 50% 50% 50% 0;
	background: var(--gv-primary, #2563eb);
	position: absolute;
	transform: rotate(-45deg);
	left: 50%;
	top: 50%;
	margin: -14px 0 0 -14px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
}
.govalid-marker-pin::after {
	content: '';
	width: 18px;
	height: 18px;
	margin: 5px 0 0 5px;
	background: #fff;
	position: absolute;
	border-radius: 50%;
}
.govalid-div-icon .dashicons {
	position: absolute;
	width: 18px;
	font-size: 11px;
	left: 0;
	right: 0;
	margin: 4px auto;
	text-align: center;
	color: var(--gv-primary, #2563eb);
	transform: rotate(45deg);
	z-index: 1;
}

/* Map popup */
.govalid-map-popup .leaflet-popup-content-wrapper {
	border-radius: 8px;
	padding: 0;
	overflow: hidden;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}
.govalid-map-popup .leaflet-popup-content {
	margin: 0;
	min-width: 220px;
}
.govalid-map-popup .leaflet-popup-tip {
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}
.govalid-popup-header {
	background: var(--gv-primary, #2563eb);
	color: #fff;
	padding: 10px 14px;
	font-weight: 600;
	font-size: 13px;
	display: flex;
	align-items: center;
	gap: 6px;
}
.govalid-popup-header .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}
.govalid-popup-body {
	padding: 12px 14px;
	font-size: 12px;
	line-height: 1.6;
}
.govalid-popup-body p {
	margin: 0 0 4px;
	display: flex;
	align-items: center;
	gap: 6px;
}
.govalid-popup-body .dashicons {
	font-size: 14px;
	width: 14px;
	height: 14px;
	color: var(--gv-primary, #2563eb);
	flex-shrink: 0;
}
.govalid-popup-footer {
	background: var(--gv-gray-50, #f8fafc);
	padding: 8px 14px;
	font-size: 11px;
	color: var(--gv-gray-500);
	border-top: 1px solid var(--gv-gray-200);
}

/* Map search control */
.govalid-map-search {
	background: #fff;
	padding: 8px;
	border-radius: 6px;
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
	width: 240px;
}
.govalid-map-search input {
	width: 100%;
	padding: 6px 10px;
	border: 1px solid var(--gv-gray-300);
	border-radius: 4px;
	font-size: 12px;
	box-sizing: border-box;
}
.govalid-map-search input:focus {
	outline: none;
	border-color: var(--gv-primary, #2563eb);
}
.govalid-map-search-results {
	max-height: 180px;
	overflow-y: auto;
	margin-top: 6px;
	border-top: 1px solid var(--gv-gray-200);
	padding-top: 4px;
	display: none;
}
.govalid-map-search-item {
	padding: 5px 8px;
	cursor: pointer;
	border-radius: 3px;
	margin-bottom: 2px;
	font-size: 11px;
	display: flex;
	align-items: center;
	gap: 4px;
}
.govalid-map-search-item:hover {
	background: var(--gv-gray-100);
}
.govalid-map-search-item.active {
	background: var(--gv-primary-light, #eff6ff);
}
.govalid-map-search-item .dashicons {
	font-size: 14px;
	width: 14px;
	height: 14px;
	color: var(--gv-primary, #2563eb);
}
.govalid-map-search-item .govalid-search-name {
	font-weight: 500;
}
.govalid-map-search-item .govalid-search-loc {
	color: var(--gv-gray-400);
	font-size: 10px;
}
.govalid-map-search-empty {
	padding: 5px 8px;
	color: var(--gv-gray-400);
	font-style: italic;
	font-size: 11px;
}

/* Zoom reset control */
.govalid-zoom-reset {
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	cursor: pointer;
	background: #fff;
	font-size: 16px;
	color: var(--gv-gray-700);
}
.govalid-zoom-reset:hover {
	background: var(--gv-gray-100);
}

/* Chart container — fixed height prevents infinite grow */
.govalid-chart-wrap {
	position: relative;
	height: 280px;
}

.govalid-chart-wrap-sm {
	height: 220px;
}

/* Empty state */
.govalid-empty-state {
	text-align: center;
	color: var(--gv-gray-400);
	padding: 32px 16px;
	font-style: italic;
}

/* Drilldown header */
.govalid-drilldown-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
}

.govalid-drilldown-header h2 {
	margin: 0;
}

.govalid-drilldown-loading {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 20px 0;
	color: var(--gv-gray-500);
}

/* Shimmer skeleton animation */
.govalid-shimmer {
	position: relative;
	overflow: hidden;
}

.govalid-shimmer::after {
	content: '';
	position: absolute;
	top: 0;
	left: -150%;
	width: 150%;
	height: 100%;
	background: linear-gradient(
		90deg,
		transparent 0%,
		rgba(37, 99, 235, 0.04) 40%,
		rgba(37, 99, 235, 0.08) 50%,
		rgba(37, 99, 235, 0.04) 60%,
		transparent 100%
	);
	animation: govalid-shimmer 1.8s ease-in-out infinite;
}

@keyframes govalid-shimmer {
	0%   { left: -150%; }
	100% { left: 150%; }
}

/* Top QR table */
.govalid-analytics-wide .widefat {
	border-radius: var(--gv-radius);
}

.govalid-drilldown-btn {
	cursor: pointer;
}

/* Responsive */
@media screen and (max-width: 960px) {
	.govalid-analytics-summary {
		grid-template-columns: repeat(2, 1fr);
	}

	.govalid-analytics-row {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 600px) {
	.govalid-analytics-summary {
		grid-template-columns: 1fr;
	}

	.govalid-stat-value {
		font-size: 22px;
	}
}

/* Setup steps (Custom Verification tab) */
.govalid-setup-steps {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.govalid-setup-step {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.govalid-step-number {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #e9ecef;
	color: #6c757d;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 14px;
}

.govalid-step-number.done {
	background: #d4edda;
	color: #155724;
}

.govalid-step-content h3 {
	margin: 0 0 4px;
	font-size: 14px;
	font-weight: 600;
}

.govalid-step-content p {
	margin: 0;
	font-size: 13px;
	color: #555;
}

/* =========================================================
   Timeline — History entries + Map
   ========================================================= */

.govalid-form-intro {
	color: var(--gv-gray-600);
	font-size: 14px;
	margin: 0 0 20px;
}

.govalid-timeline-entry {
	background: var(--gv-gray-50);
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	padding: 20px;
	margin-bottom: 16px;
	position: relative;
	transition: border-color var(--gv-transition);
}

.govalid-timeline-entry:hover {
	border-color: var(--gv-primary);
}

.govalid-timeline-entry-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--gv-gray-200);
}

.govalid-timeline-entry-title {
	font-weight: 600;
	font-size: 14px;
	color: var(--gv-gray-800);
	display: flex;
	align-items: center;
	gap: 6px;
}

.govalid-timeline-entry-title .dashicons {
	color: var(--gv-primary);
	font-size: 18px;
	width: 18px;
	height: 18px;
}

.govalid-timeline-add-wrap {
	margin-top: 8px;
}

/* Map components */

.govalid-map-wrap {
	position: relative;
	border-radius: var(--gv-radius);
	overflow: hidden;
	border: 1px solid var(--gv-gray-200);
}

.govalid-map-container {
	z-index: 1;
}

.govalid-map-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(240, 240, 240, 0.9);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}

.govalid-map-search {
	position: absolute;
	top: 10px;
	left: 10px;
	right: 60px;
	z-index: 3;
}

.govalid-map-search .govalid-input-wrap {
	background: #fff;
	border-radius: var(--gv-radius);
	box-shadow: var(--gv-shadow);
}

.govalid-map-search .govalid-input {
	border: none;
	font-size: 13px;
}

.govalid-map-locate {
	position: absolute;
	bottom: 20px;
	right: 10px;
	z-index: 3;
}

.govalid-location-status {
	margin-top: 10px;
}

.govalid-location-status-inner {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #ecfdf5;
	border: 1px solid #a7f3d0;
	border-radius: var(--gv-radius);
	padding: 10px 14px;
}

.govalid-location-status-inner > .dashicons {
	color: var(--gv-success);
	font-size: 20px;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

.govalid-location-info {
	flex: 1;
	min-width: 0;
}

.govalid-location-address {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: var(--gv-gray-800);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.govalid-location-coords {
	display: block;
	font-size: 11px;
	color: var(--gv-gray-500);
	font-family: monospace;
}

/* --------------------------------------------------------
   Modal Overlay (shared: submission detail + QR generate)
   -------------------------------------------------------- */
.govalid-modal-overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	background: rgba(0, 0, 0, 0.45);
	display: flex;
	align-items: center;
	justify-content: center;
	animation: govalid-fade-in 0.2s ease;
}

.govalid-modal-content {
	background: #fff;
	border-radius: 14px;
	padding: 28px;
	position: relative;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
	animation: govalid-modal-slide-in 0.25s ease;
}

.govalid-modal-close {
	position: absolute;
	top: 12px;
	right: 12px;
	background: none;
	border: none;
	cursor: pointer;
	font-size: 20px;
	color: var(--gv-gray-400);
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	transition: all var(--gv-transition);
}

.govalid-modal-close:hover {
	background: var(--gv-gray-100);
	color: var(--gv-gray-700);
}

@keyframes govalid-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes govalid-modal-slide-in {
	from { opacity: 0; transform: translateY(12px) scale(0.97); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* --------------------------------------------------------
   Submissions Bulk Action Bar
   -------------------------------------------------------- */
#govalid-sub-bulk-bar {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 18px;
	margin-top: 14px;
	background: var(--gv-primary-light);
	border: 1px solid var(--gv-primary);
	border-radius: var(--gv-radius);
	animation: govalid-bulk-bar-in 0.25s ease;
}

@keyframes govalid-bulk-bar-in {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* Submission table row checkbox */
.govalid-sub-checkbox {
	accent-color: var(--gv-primary);
	width: 16px;
	height: 16px;
	cursor: pointer;
}

/* --------------------------------------------------------
   Generate QR Modal — Input
   -------------------------------------------------------- */
.govalid-modal-input {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid var(--gv-gray-300) !important;
	border-radius: 8px !important;
	font-size: 14px;
	color: var(--gv-gray-800);
	background: #fff;
	box-sizing: border-box;
	outline: none;
	transition: border-color var(--gv-transition), box-shadow var(--gv-transition);
}

.govalid-modal-input:focus {
	border-color: var(--gv-primary) !important;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

/* --------------------------------------------------------
   Generate QR Modal — Security Level Cards
   -------------------------------------------------------- */
.govalid-modal-security-card {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 10px 8px;
	border: 2px solid var(--gv-gray-200);
	border-radius: 8px;
	cursor: pointer;
	background: #fff;
	transition: all var(--gv-transition);
	text-align: center;
}

.govalid-modal-security-card:hover {
	border-color: var(--gv-gray-300);
	background: var(--gv-gray-50);
}

.govalid-modal-security-card.active {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
}

.govalid-modal-security-card .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
	color: var(--gv-gray-400);
}

.govalid-modal-security-card.active .dashicons {
	color: var(--gv-primary);
}

.govalid-modal-security-card strong {
	font-size: 12px;
	color: var(--gv-gray-700);
}

.govalid-modal-security-card.active strong {
	color: var(--gv-primary-dark);
}

/* --------------------------------------------------------
   Generate QR Modal — Field Checklist
   -------------------------------------------------------- */
.govalid-qr-field-check {
	accent-color: var(--gv-primary);
	width: 16px;
	height: 16px;
	cursor: pointer;
	flex-shrink: 0;
}

/* --------------------------------------------------------
   Submission Table — File Thumbnails & Links
   -------------------------------------------------------- */
.govalid-sub-thumbnail {
	width: 40px;
	height: 40px;
	object-fit: cover;
	border-radius: 6px;
	border: 1px solid var(--gv-gray-200);
	cursor: pointer;
	transition: all var(--gv-transition);
	vertical-align: middle;
}

.govalid-sub-thumbnail:hover {
	border-color: var(--gv-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
	transform: scale(1.05);
}

.govalid-sub-file-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
	color: var(--gv-primary);
	text-decoration: none;
	font-weight: 500;
}

.govalid-sub-file-link:hover {
	text-decoration: underline;
}

.govalid-sub-file-link .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	color: var(--gv-gray-400);
}

/* --------------------------------------------------------
   Statistics Dashboard
   -------------------------------------------------------- */
.govalid-stats-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-bottom: 20px;
}

.govalid-stat-card {
	background: #fff;
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius-lg);
	padding: 20px;
	display: flex;
	align-items: center;
	gap: 16px;
	box-shadow: var(--gv-shadow-sm);
	transition: box-shadow var(--gv-transition), transform var(--gv-transition);
}

.govalid-stat-card:hover {
	box-shadow: var(--gv-shadow);
	transform: translateY(-2px);
}

.govalid-stat-icon {
	width: 48px;
	height: 48px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.govalid-stat-icon .dashicons {
	font-size: 24px;
	width: 24px;
	height: 24px;
}

.govalid-stat-body {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.govalid-stat-value {
	font-size: 28px;
	font-weight: 700;
	color: var(--gv-gray-900);
	line-height: 1.2;
}

.govalid-stat-label {
	font-size: 12px;
	font-weight: 500;
	color: var(--gv-gray-400);
	text-transform: uppercase;
	letter-spacing: 0.3px;
	margin-top: 2px;
}

.govalid-stats-chart-card {
	margin-bottom: 20px;
}

.govalid-stats-chart-title {
	margin: 0 0 16px;
	font-size: 14px;
	font-weight: 600;
	color: var(--gv-gray-700);
	display: flex;
	align-items: center;
	gap: 8px;
}

.govalid-stats-chart-title .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
	color: var(--gv-primary);
}

.govalid-stats-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-bottom: 20px;
}

.govalid-stats-grid .govalid-card {
	margin: 0;
	max-width: none;
}

@media (max-width: 1200px) {
	.govalid-stats-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 782px) {
	.govalid-stats-cards {
		grid-template-columns: 1fr;
	}
	.govalid-stats-grid {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------
   Subscription & Quota Card
   -------------------------------------------------------- */
.govalid-subscription-card {
	border-left: 4px solid var(--gv-primary);
}

.govalid-subscription-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
}

.govalid-subscription-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: rgba(37, 99, 235, 0.1);
	flex-shrink: 0;
}

.govalid-subscription-icon .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
	color: var(--gv-primary);
}

.govalid-sub-loading {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 20px 0;
}

/* Plan badge */
.govalid-plan-badge-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
}

.govalid-plan-badge {
	display: inline-block;
	padding: 4px 14px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}

.govalid-plan-free {
	background: var(--gv-gray-100);
	color: var(--gv-gray-600);
}

.govalid-plan-starter {
	background: rgba(14, 165, 233, 0.12);
	color: #0284c7;
}

.govalid-plan-business {
	background: rgba(37, 99, 235, 0.12);
	color: #1d4ed8;
}

.govalid-plan-ultimate {
	background: linear-gradient(135deg, rgba(124, 58, 237, 0.12), rgba(37, 99, 235, 0.12));
	color: #6d28d9;
}

.govalid-plan-source {
	font-size: 11px;
	color: var(--gv-gray-400);
	font-weight: 400;
}

/* QR Quota section */
.govalid-quota-section {
	margin-bottom: 18px;
}

.govalid-quota-label-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
}

.govalid-quota-label {
	font-size: 13px;
	font-weight: 500;
	color: var(--gv-gray-700);
}

.govalid-quota-numbers {
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-gray-800);
}

.govalid-progress-bar {
	width: 100%;
	height: 8px;
	background: var(--gv-gray-100);
	border-radius: 4px;
	overflow: hidden;
}

.govalid-progress-fill {
	height: 100%;
	border-radius: 4px;
	background: var(--gv-primary);
	transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.govalid-progress-fill.govalid-progress-warning {
	background: #e68a00;
}

.govalid-progress-fill.govalid-progress-danger {
	background: var(--gv-danger);
}

.govalid-quota-remaining {
	font-size: 12px;
	color: var(--gv-gray-400);
	margin: 6px 0 0;
}

/* Features grid */
.govalid-features-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 12px;
	margin-bottom: 18px;
}

.govalid-feature-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 8px;
	background: var(--gv-gray-50);
}

.govalid-feature-icon {
	font-size: 18px;
	width: 18px;
	height: 18px;
	color: var(--gv-primary);
	flex-shrink: 0;
}

.govalid-feature-value {
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-gray-800);
	line-height: 1.3;
}

.govalid-feature-label {
	font-size: 11px;
	color: var(--gv-gray-400);
	line-height: 1.3;
}

/* Credit section */
.govalid-credit-section {
	padding: 14px 16px;
	background: rgba(230, 138, 0, 0.06);
	border-radius: 8px;
	margin-bottom: 18px;
}

.govalid-credit-details {
	margin-top: 8px;
	font-size: 12px;
	color: var(--gv-gray-500);
}

/* Actions */
.govalid-sub-actions {
	padding-top: 4px;
}

/* --------------------------------------------------------
   QR Image Preview Modal
   -------------------------------------------------------- */
.govalid-qr-modal-overlay {
	position: fixed;
	inset: 0;
	z-index: 999999;
	background: rgba(0, 0, 0, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.govalid-qr-modal {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
	max-width: 480px;
	width: 100%;
	position: relative;
	overflow: hidden;
}

.govalid-qr-modal-close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 32px;
	height: 32px;
	border: none;
	background: rgba(0, 0, 0, 0.06);
	border-radius: 50%;
	font-size: 20px;
	line-height: 32px;
	text-align: center;
	cursor: pointer;
	color: var(--gv-gray-500);
	z-index: 2;
	transition: background var(--gv-transition), color var(--gv-transition);
	padding: 0;
}

.govalid-qr-modal-close:hover {
	background: rgba(0, 0, 0, 0.12);
	color: var(--gv-gray-800);
}

.govalid-qr-modal-body {
	padding: 32px;
	text-align: center;
	background: var(--gv-gray-50);
}

.govalid-qr-modal-img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	border: 1px solid var(--gv-gray-200);
	background: #fff;
}

.govalid-qr-modal-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 24px;
	border-top: 1px solid var(--gv-gray-100);
}

.govalid-qr-modal-name {
	font-weight: 600;
	font-size: 14px;
	color: var(--gv-gray-800);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	flex: 1;
	margin-right: 12px;
}

.govalid-qr-modal-download {
	display: inline-flex !important;
	align-items: center;
	gap: 4px;
	white-space: nowrap;
	flex-shrink: 0;
}

.govalid-qr-modal-download .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	line-height: 16px;
}

.govalid-qr-list-img.govalid-qr-preview-trigger:hover {
	transform: scale(1.08);
	transition: transform 0.15s ease;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

@media (max-width: 600px) {
	.govalid-features-grid {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------
   Link QR Code — Live preview & design panel
   -------------------------------------------------------- */
.govalid-qr-preview-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 20px 0;
	gap: 12px;
}

.govalid-qr-preview {
	width: 220px;
	height: 220px;
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.govalid-qr-preview canvas,
.govalid-qr-preview svg {
	display: block;
}

.govalid-qr-actions {
	display: flex;
	gap: 8px;
}

/* Design panel toggle */
.govalid-qr-design-panel {
	margin-top: 16px;
	border: 1px solid var(--gv-gray-200);
	border-radius: var(--gv-radius);
	overflow: hidden;
}

.govalid-qr-design-toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 12px 16px;
	background: var(--gv-gray-50);
	border: none;
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
	color: var(--gv-gray-700);
	transition: background var(--gv-transition);
}

.govalid-qr-design-toggle:hover {
	background: var(--gv-gray-100);
}

.govalid-qr-design-toggle .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

.govalid-qr-toggle-icon {
	margin-left: auto;
	transition: transform 0.2s ease;
}

.govalid-qr-toggle-icon.govalid-qr-toggle-open {
	transform: rotate(180deg);
}

.govalid-qr-design-body {
	padding: 16px;
	border-top: 1px solid var(--gv-gray-200);
}

.govalid-qr-section {
	margin-bottom: 20px;
}

.govalid-qr-section:last-child {
	margin-bottom: 0;
}

/* Module shape grid */
.govalid-shape-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
	gap: 6px;
}

.govalid-shape-option {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 6px 4px;
	border: 2px solid var(--gv-gray-200);
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.15s ease;
	background: #fff;
}

.govalid-shape-option:hover {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
	transform: translateY(-1px);
	box-shadow: var(--gv-shadow-sm);
}

.govalid-shape-option.active {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
	box-shadow: 0 0 0 1px var(--gv-primary);
}

.govalid-shape-option svg {
	display: block;
	color: var(--gv-gray-700);
}

.govalid-shape-option.active svg {
	color: var(--gv-primary);
}

.govalid-shape-option span {
	font-size: 10px;
	color: var(--gv-gray-500);
	margin-top: 3px;
	line-height: 1;
}

.govalid-shape-option.active span {
	color: var(--gv-primary);
	font-weight: 600;
}

/* Eye shape grids */
.govalid-qr-eye-row {
	display: flex;
	gap: 20px;
}

.govalid-qr-eye-col {
	flex: 1;
	min-width: 0;
}

.govalid-qr-eye-col h4 {
	font-size: 12px;
	font-weight: 600;
	color: var(--gv-gray-600);
	margin: 0 0 8px;
}

.govalid-eye-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
	gap: 4px;
}

.govalid-eye-option {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5px;
	border: 2px solid var(--gv-gray-200);
	border-radius: 6px;
	cursor: pointer;
	transition: all 0.15s ease;
	background: #fff;
	aspect-ratio: 1;
}

.govalid-eye-option:hover {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
}

.govalid-eye-option.active {
	border-color: var(--gv-primary);
	background: var(--gv-primary-light);
	box-shadow: 0 0 0 1px var(--gv-primary);
}

.govalid-eye-option svg {
	display: block;
	color: var(--gv-gray-700);
}

.govalid-eye-option.active svg {
	color: var(--gv-primary);
}

/* Color pickers row */
.govalid-color-row {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
}

.govalid-color-field {
	display: flex;
	align-items: center;
	gap: 8px;
}

.govalid-color-field label {
	font-size: 12px;
	font-weight: 500;
	color: var(--gv-gray-600);
	white-space: nowrap;
}

.govalid-color-field input[type="color"] {
	width: 36px;
	height: 36px;
	padding: 2px;
	border: 2px solid var(--gv-gray-200);
	border-radius: 8px;
	cursor: pointer;
	background: #fff;
}

.govalid-color-field input[type="color"]:hover {
	border-color: var(--gv-primary);
}

/* Logo upload */
.govalid-qr-logo-field {
	display: flex;
	align-items: center;
	gap: 12px;
}

.govalid-qr-logo-preview {
	position: relative;
	display: inline-block;
}

.govalid-qr-logo-preview img {
	width: 48px;
	height: 48px;
	object-fit: contain;
	border: 1px solid var(--gv-gray-200);
	border-radius: 8px;
	background: #fff;
}

.govalid-qr-logo-remove {
	position: absolute;
	top: -6px;
	right: -6px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--gv-danger);
	color: #fff;
	border: 2px solid #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	line-height: 1;
}

.govalid-qr-logo-remove .dashicons {
	font-size: 12px;
	width: 12px;
	height: 12px;
}

/* Responsive */
@media (max-width: 782px) {
	.govalid-qr-eye-row {
		flex-direction: column;
		gap: 12px;
	}

	.govalid-color-row {
		flex-direction: column;
		gap: 10px;
	}

	.govalid-shape-grid {
		grid-template-columns: repeat(auto-fill, minmax(56px, 1fr));
	}
}
