.sidebar {
	position: absolute;
	top: 60px;
	left: 0;
	height: calc(100% - 60px);
	width: 400px;
	background-color: var(--col-sidebar-background);
	color: var(--col-header);
	transform: translateX(-100%);
	transition: transform 0.3s ease;
	z-index: 500;
	padding: 1rem;
	border-right: 1px solid var(--col-header);
}

@supports(padding: env(safe-area-inset-top)) {
  .sidebar {
    padding-top: env(safe-area-inset-top);
  }
}

/* Full screen on mobile */
@media (max-width: 768px) {
	.sidebar {
		width: 100vw;
	}
}


/* When active */
.sidebar.show {
	transform: translateX(0);
}


.sidebar-content {
    margin-top: 1rem;
}

.sidebar-menu {
    padding: 0;
    margin: 0;
}

.sidebar-item {
	background-color: var(--col-sidebar-background);
    color: var(--col-text);
	font-weight: 700;
    padding: 1rem;
    margin-bottom: 0.5rem;
    cursor: pointer;
    transition: background-color 0.2s;
}


.sidebar-item .icon-color {
	color: var(--col-header);
}

.sidebar-item:hover {
    background-color: #f0f0f0;
}


.sidebar .sidebar-item .bi
{
	color: var(--col-header); 
}


.sidebar .sidebar-item .flag
{
	width: 20px;
	margin-right: 10px;
	vertical-align: baseline;
}


.sidebar .sidebar-item .div-lang-switch input
{
	opacity: 1 !important;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2301857B'/%3e%3c/svg%3e") !important;
	background-color: rgb(255,255,255) !important;
	border-color: var(--col-header) !important;
}


.sidebar .sidebar-item .div-lang-switch input:checked
{
}

.sidebar .sidebar-item .div-lang-switch span
{
	line-height: 10px;
}