.airport-knowledge-list-search {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas:
		"search"
		"button";
	gap: 8px;
	margin-block: 24px;

	.jobs-list-search-text {
		grid-area: search;
	}

	.jobs-list-search-submit {
		grid-area: button;
	}

	@media (width >= 992px) {
		grid-template-columns: minmax(0, 1fr) 200px;
		grid-template-areas: "search button";
	}
}

.airport-knowledge-list-items {
	margin-block-start: 32px;
}

.airport-knowledge-item {
	--airport-knowledge-item-background-color: #fff;
	--airport-knowledge-item-border-color: #e2e3e5;
	--airport-knowledge-item-gap: 32px;
	--airport-knowledge-item-padding: 24px;
	--airport-knowledge-item-radius: 16px;
	--airport-knowledge-item-button-color: #226494;
	--airport-knowledge-item-button-border-color: #226494;
	--airport-knowledge-item-button-background-color: transparent;
	--airport-knowledge-item-button-hover-color: #fff;
	--airport-knowledge-item-button-hover-background-color: var(--airport-knowledge-item-button-color);

	margin-block-start: 16px;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--airport-knowledge-item-gap);
	background-color: var(--airport-knowledge-item-background-color);
	border: 1px solid var(--airport-knowledge-item-border-color);
	padding: var(--airport-knowledge-item-padding);
	border-radius: var(--airport-knowledge-item-radius);

	&:first-child {
		margin-block-start: 0;
	}

	@media (width >= 992px) {
		grid-template-columns: 1fr 200px;
	}

	.airport-knowledge-item-content {

		.airport-knowledge-item-title {
			font-size: 1rem;
		}

		.airport-knowledge-item-meta {
			color: #565e64;
			display: flex;
			flex-wrap: wrap;
			gap: 16px;
			margin-block-start: 16px;

			.entry-meta-item {
				display: flex;
				flex-wrap: wrap;
				align-items: center;
				gap: var(--wp--preset--spacing--8);

				&::before {
					content: "|";
					padding-inline-end: var(--wp--preset--spacing--8);
				}

				&:first-child::before {
					display: none;
				}
			}
		}
	}

	.airport-knowledge-item-link {

		.btn {
			display: inline-block;
			text-align: center;
			width: 100%;
			border-radius: 9999px;
			background-color: var(--airport-knowledge-item-button-background-color);
			padding: 16px 36px;
			color: var(--airport-knowledge-item-button-color);
			border: 1px solid var(--airport-knowledge-item-button-border-color);
			font-weight: 500;

			&:is(:hover, :focus) {
				background-color: var(--airport-knowledge-item-button-hover-background-color);
				color: var(--airport-knowledge-item-button-hover-color);
			}
		}
	}
}