.conteiner
{
	min-height: calc(100vh - 12em);
	display: flex;
	gap: 1rem;
}

.panel-categories
{
	width: 20%;
	display: flex;
	flex-direction: column;
	padding: 1em;
	gap: .5rem;
}

.panel-content
{
	width: 80%;
	padding: 1em;
	display: flex;
	flex-direction: column;
}

.list
{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-gap: .5rem;
}

.filter
{
	
}

.filter-buttons
{
	display: flex;
	gap: .5rem;
}

.item
{
	display: none;
	aspect-ratio: 1;
	position: relative;
	background-color: #0004;
}

.item-icon
{
	width: 100%;
	height: 100%;
	padding: 2em;
	object-fit: contain;
}

.item-name
{
	font-size: 14px;
	position: absolute;
	left: 0;
	top: 0;
	padding: 1em;
}

.item-count
{
	font-size: 12px;
	position: absolute;
	bottom: 1em;
	right: 1em;
	text-align: right;
}