/* components/navbar: a row of items that wraps; each item is a primary button filling its cell. */
@layer components {
	.dv-navbar-list {
		display: flex;
		flex-wrap: wrap;
		gap: var(--space-1) 1%;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.dv-navbar-list > li {
		flex: 1 1 0;
		min-inline-size: max-content;
	}

	.dv-navbar .dv-navbar-item {
		display: flex;
		inline-size: 100%;
		padding-inline: var(--space-1);
	}
}