.blockish-accordion {
	--blockish-accordion-border-color: #d1d5db;
	--blockish-accordion-icon-size: 18px;

	.blockish-accordion-items {
		display: grid;
	}

	.blockish-accordion-item-heading {
		margin: 0;
	}
	.blockish-accordion-item-panel {
		border: 0 solid var(--blockish-accordion-border-color);
		display: grid;
		grid-template-rows: minmax(0, 0fr);
		overflow: hidden;
		transition:
			grid-template-rows 0.3s ease,
			border-width 0.3s ease;
	}

	.blockish-accordion-item {
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		overflow: clip;
	}

	.blockish-accordion-item-content-inner {
		min-height: 0;
		overflow: hidden;
		padding: 16px;
	}

	.blockish-accordion-item-trigger {
		align-items: center;
		background: transparent;
		border: 1px solid var(--blockish-accordion-border-color);
		box-sizing: border-box;
		color: inherit;
		cursor: pointer;
		display: flex;
		flex-direction: row;
		gap: 14px;
		justify-content: start;
		padding: 18px 22px;
		position: relative;
		text-align: left;
		width: 100%;
	}

	.blockish-accordion-item-trigger:focus {
		outline: none;
	}

	.blockish-accordion-item-trigger:focus-visible {
		outline: 2px solid currentColor;
		outline-offset: 2px;
	}

	.blockish-accordion-item-heading {
		min-width: 0;
	}

	.blockish-accordion-item-title-text {
		display: block;
	}

	.blockish-accordion-item-trigger::-webkit-details-marker {
		display: none;
	}

	.blockish-accordion-item-trigger::marker {
		content: "";
	}

	.blockish-accordion-item-title-text {
		color: #111827;
		text-align: start;
	}

	.blockish-accordion-item-details[open] .blockish-accordion-item-title-text {
		color: #111827;
	}

	.blockish-accordion-item-icon {
		align-items: center;
		color: #111827;
		display: inline-flex;
		justify-content: center;
		line-height: 1;
	}

	.blockish-accordion-item-icon svg {
		fill: currentColor;
		height: var(--blockish-accordion-icon-size);
		width: var(--blockish-accordion-icon-size);
	}

	.blockish-accordion-item-details[open] .blockish-accordion-item-icon {
		color: #111827;
	}

	.blockish-accordion-item-icon[data-icon-state="open"] {
		display: none;
	}

	.blockish-accordion-item-icons {
		display: block;
		flex: 0 0 auto;
		line-height: 0;
	}

	.blockish-accordion-item-details[open]
		.blockish-accordion-item-icon[data-icon-state="open"] {
		display: inline-flex;
	}

	.blockish-accordion-item-details[open]
		.blockish-accordion-item-icon[data-icon-state="closed"] {
		display: none;
	}

	.blockish-accordion-item-details[open] + .blockish-accordion-item-panel {
		border-width: 0 1px 1px 1px;
		grid-template-rows: minmax(0, 1fr);
	}
}
