.posts-grid {
	width: 100%;
}

.posts-grid__header {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	justify-content: space-between;
	margin-bottom: var(--gutter-inset, 1rem);
}

@media (max-width:768px) {
	.posts-grid__header {
		align-items: stretch;
		flex-direction: column;
	}
}

.posts-grid__filters {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

@media (max-width:768px) {
	.posts-grid__filters {
		width: 100%;
	}
}

.posts-grid__filter {
	position: relative;
}

.posts-grid__filter select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: var(--surface-surface, inherit);
	border: 1px solid var(--surface-surface-border);
	border-radius: 4px;
	color: var(--wp--preset--color--ledger-blue);
	cursor: pointer;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--body-sm);
	padding: 1rem 32px 1rem .5rem;
	transition: all .2s ease;
}

.posts-grid__filter select:focus, .posts-grid__filter select:hover {
	border-color: var(--wp--preset--color--payday-blue);
}

.posts-grid__filter select:focus {
	box-shadow: 0 0 0 3px rgba(74, 144, 226, .1);
	outline: none;
}

@media (max-width:768px) {
	.posts-grid__filter select {
		width: 100%;
	}
}

.posts-grid__filter:after {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2713%27 height=%278%27 fill=%27none%27%3E%3Cpath fill=%27%23294175%27 d=%27M0 .946.946 0l5.49 5.49L11.926 0l.946.946-6.436 6.436z%27/%3E%3C/svg%3E");
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: 13px auto;
	content: "";
	display: inline-block;
	height: 8px;
	height: 100%;
	margin-left: .5rem;
	position: absolute;
	right: 0;
	transition: transform .2s ease;
	width: 30px;
}

.posts-grid__filter.is-open:after {
	transform: rotate(180deg);
}

.posts-grid__search {
	position: relative;
}

@media (max-width:768px) {
	.posts-grid__search {
		width: 100%;
	}
}

.posts-grid__search input[type=search] {
	border: 1px solid var(--input-input-border-initial);
	border-radius: 4px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--body-sm);
	min-width: 240px;
	padding: .75rem .75rem .75rem 2.5rem;
	transition: all .2s ease;
}

.posts-grid__search input[type=search]::-moz-placeholder {
	color: var(--input-input-text-inactive, inherit);
}

.posts-grid__search input[type=search]::placeholder {
	color: var(--input-input-text-inactive, inherit);
}

@media (max-width:768px) {
	.posts-grid__search input[type=search] {
		width: 100%;
	}
}

.posts-grid__search input[type=search]:focus {
	border-color: var(--wp--preset--color--payday-blue);
	box-shadow: 0 0 0 3px rgba(74, 144, 226, .1);
	outline: none;
}

.posts-grid__search input[type=search]::-webkit-search-decoration, .posts-grid__search input[type=search]::-webkit-search-results-button, .posts-grid__search input[type=search]::-webkit-search-results-decoration {
	display: none;
}

.posts-grid__search:before {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2718%27 height=%2718%27 fill=%27none%27%3E%3Cpath fill=%27%23294175%27 d=%27m16.138 17.192-6.28-6.28q-.75.618-1.726.968-.975.35-2.017.35-2.563 0-4.34-1.775Q0 8.68 0 6.117t1.775-4.34T6.114 0t4.34 1.776q1.776 1.775 1.776 4.34 0 1.07-.359 2.046-.36.975-.96 1.695l6.281 6.281zM6.115 10.731q1.933 0 3.274-1.342 1.342-1.34 1.342-3.274 0-1.932-1.342-3.274Q8.05 1.5 6.115 1.5q-1.932 0-3.274 1.341Q1.5 4.183 1.5 6.115q0 1.933 1.341 3.274 1.342 1.342 3.274 1.342%27/%3E%3C/svg%3E");
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	height: 16px;
	left: 16px;
	pointer-events: none;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
}

.posts-grid__grid {
	display: grid;
	gap: 32px;
	grid-template-columns: repeat(3, 1fr);
}

.posts-grid__grid[data-columns="2"] {
	grid-template-columns: repeat(2, 1fr);
}

.posts-grid__grid[data-columns="4"] {
	grid-template-columns: repeat(4, 1fr);
}

@media (max-width:1024px) {
	.posts-grid__grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width:640px) {
	.posts-grid__grid {
		grid-template-columns: 1fr !important;
	}
}

.posts-grid__loading {
	align-items: center;
	display: flex;
	justify-content: center;
}

.posts-grid__empty, .posts-grid__loading {
	color: var(--wp--preset--color--ledger-blue-tint-1);
	grid-column: 1/-1;
	padding: 60px 20px;
}

.posts-grid__empty {
	font-size: var(--wp--preset--font-size--body-md);
	text-align: center;
}

.posts-grid__footer {
	align-items: center;
	border-top: 1px solid var(--divider-divider-tertiary);
	display: flex;
	justify-content: space-between;
	margin-top: var(--gutter-inset);
	padding-top: .5rem;
}

.posts-grid__count {
	color: var(--text-text-secondary, #6b7280);
	font-size: var(--wp--preset--font-size--body-sm, 14px);
}

.posts-grid__page-link--next:hover, .posts-grid__page-link--prev:hover {
	border: 0;
}

.posts-grid__pagination {
	gap: 8px;
}

.posts-grid__page-link, .posts-grid__pagination {
	align-items: center;
	display: flex;
	justify-content: center;
}

.posts-grid__page-link {
	border: 1px solid transparent;
	border-radius: var(--core-styles-border-radius-inset, 4px);
	box-sizing: border-box;
	color: var(--text-text-primary);
	cursor: pointer;
	font-weight: 350;
	min-width: 1.5rem;
	padding: 0 .25rem;
	text-decoration: none;
	transition: all .2s ease;
}

.posts-grid__page-link.is-current, .posts-grid__page-link:hover:not(.is-current) {
	border-color: var(--core-styles-input-border-weight-initial);
}

.posts-grid__page-link.is-current {
	cursor: default;
}

.posts-grid__page-link.is-disabled {
	cursor: not-allowed;
	opacity: .5;
	pointer-events: none;
}

.posts-grid__page-dots {
	color: var(--wp--preset--color--ledger-blue-tint-1);
	padding: 0 8px;
}

@media (max-width:768px) {
	.posts-grid__filter-placeholder {
		width: 100%;
	}
}