.c-all-parks {
	.c-all-parks__container {
		display: flex;
		flex-direction: column;
		gap: 1px;
	}

	details {
		&[open] {
			> summary {
				.c-all-parks__listing-title {
					.c-all-parks__chevron {
						transform: rotate(0deg);
					}
				}
			}
		}

		summary {
			/* Remove marker */
			list-style: none;
			cursor: pointer;

			/* WebKit / Safari / Chrome fallback */
			&::-webkit-details-marker {
				display: none;
			}

			/* Modern browsers */
			&::marker {
				content: "";
			}
		}
	}

	.c-all-parks__accordion {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: var(--spacing-xs);

		&.c-all-parks__accordion--region {
			padding: var(--spacing-xs);
			background-color: var(--color-grey-light);

			@media (width < 600px) {
				padding: 10px;
			}
		}

		&.c-all-parks__accordion--county {
			padding: var(--spacing-xs) var(--spacing-xs) var(--spacing-xs) calc(var(--spacing-xs) * 2);
			background-color: rgb(from var(--color-grey-light) r g b / 0.5);

			@media (width < 600px) {
				padding: 10px 10px 10px 20px;
			}
		}

		&.c-all-parks__accordion--location {
			padding: var(--spacing-xs) var(--spacing-xs) var(--spacing-xs) calc(var(--spacing-xs) * 3);
			background-color: rgb(from var(--color-grey-light) r g b / 0.2);

			@media (width < 600px) {
				padding: 10px 10px 10px 30px;
			}
		}
	}

	.c-all-parks__listing-title {
		display: flex;
		gap: var(--spacing-xs);

		@media (width < 600px) {
			gap: calc(var(--spacing-xs) / 2);
			font-size: 12px;
		}
	}

	.c-all-parks__chevron {
		transform: rotate(-90deg);
		transition: transform 0.3s;
	}

	.c-all-parks__more-link {
		display: flex;
		gap: var(--spacing-xs);

		@media (width < 600px) {
			gap: calc(var(--spacing-xs) / 2);
		}

		span {
			@media (width < 600px ) {
				display: none;
			}
		}
	}

	.c-all-parks__parks-list {
		margin: var(--spacing-xs) var(--spacing-xs) var(--spacing-xs) calc(var(--spacing-xs) * 4);

		@media (width < 600px) {
			margin: 10px 10px 10px 30px;
		}

		a {
			@media (width < 600px) {
				font-size: 12px;
			}
		}
	}
}