.vpflexgen-widget {
	--vpf-bg: #ffffff;
	--vpf-hover: #eaf7f1;
	--vpf-title: #002244;
	--vpf-text: #4b5563;
	--vpf-accent: #11a85e;
	background: var(--vpf-bg);
	border: 0;
	border-radius: 8px;
	box-shadow: 0 18px 45px rgba(0, 34, 68, 0.08);
	color: var(--vpf-text);
	overflow: hidden;
	width: 100%;
}

.vpflexgen-filter {
	align-items: center;
	background: #f8fafc;
	display: flex;
	flex-wrap: wrap;
	gap: 12px 16px;
	justify-content: center;
	padding: 18px 20px;
}

.vpflexgen-filter label {
	color: var(--vpf-text);
	font-size: 14px;
	font-weight: 500;
	margin: 0;
}

.vpflexgen-filter select {
	appearance: auto;
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 5px;
	color: #111827;
	font-size: 15px;
	height: 44px;
	min-width: 124px;
	padding: 0 14px;
}

.vpflexgen-filter-separator {
	color: var(--vpf-text);
	font-weight: 700;
}

.vpflexgen-filter button {
	background: var(--vpf-accent);
	border: 0;
	border-radius: 5px;
	color: #ffffff;
	cursor: pointer;
	font-size: 14px;
	font-weight: 700;
	height: 42px;
	min-width: 100px;
	padding: 0 20px;
	text-transform: uppercase;
	transition: background-color 160ms ease, transform 160ms ease;
}

.vpflexgen-filter button:hover,
.vpflexgen-filter button:focus {
	background: #0d8f50;
	transform: translateY(-1px);
}

.vpflexgen-widget.is-loading .vpflexgen-tables {
	opacity: 0.55;
	pointer-events: none;
}

.vpflexgen-table-block + .vpflexgen-table-block {
	border-top: 1px solid #e5e7eb;
}

.vpflexgen-table-title {
	background: #e8f1fa;
	color: var(--vpf-title);
	display: grid;
	gap: 5px;
	justify-items: center;
	padding: 18px 16px;
	text-align: center;
}

.vpflexgen-table-title div {
	display: block;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.35;
}

.vpflexgen-title-small {
	color: var(--vpf-text);
	font-size: 13px;
	font-weight: 600;
}

.vpflexgen-table-scroll {
	overflow-x: auto;
	width: 100%;
}

.vpflexgen-table {
	background: var(--vpf-bg);
	color: var(--vpf-text);
	display: table;
	min-width: 980px;
	table-layout: fixed;
	width: 100%;
}

.vpflexgen-row {
	display: table-row;
	transition: background-color 160ms ease, color 160ms ease;
}

.vpflexgen-row:hover {
	background: var(--vpf-hover);
}

.vpflexgen-cell {
	border-bottom: 1px solid #e5e7eb;
	display: table-cell;
	font-size: 14px;
	line-height: 1.45;
	padding: 16px 14px;
	text-align: center;
	vertical-align: middle;
}

.vpflexgen-head-cell {
	color: #00679e;
	font-weight: 700;
	white-space: normal;
}

.vpflexgen-subhead-row .vpflexgen-head-cell {
	color: var(--vpf-text);
}

.vpflexgen-row:last-child .vpflexgen-cell {
	border-bottom: 0;
}

.vpflexgen-empty-row {
	display: block;
}

.vpflexgen-empty {
	color: #64748b;
	display: block;
	font-style: italic;
	width: 100%;
}

@media (max-width: 720px) {
	.vpflexgen-widget {
		border-radius: 6px;
	}

	.vpflexgen-filter {
		align-items: stretch;
		display: grid;
		grid-template-columns: 1fr;
		justify-content: stretch;
		padding: 16px;
	}

	.vpflexgen-filter label {
		text-align: left;
	}

	.vpflexgen-filter select,
	.vpflexgen-filter button {
		width: 100%;
	}

	.vpflexgen-filter-separator {
		display: none;
	}

	.vpflexgen-table-title {
		padding: 16px 12px;
	}

	.vpflexgen-table {
		min-width: 920px;
	}

	.vpflexgen-cell {
		font-size: 13px;
		padding: 13px 12px;
	}
}