.ka-view {
	width: 100%;
	height: 100%;
}

.ka-nav {
	width: 100%;
	height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;

	.title {
		display: flex;
		align-items: center;
		flex-direction: row;

		img {
			width: 30px;
			height: 30px;
		}

		.title-content {
			margin: 0 0.5rem;
		}
	}
}

.ka-menu {
	top: 0;
	left: 0;
	height: 100%;
	position: fixed;
	min-width: 300px;
	transform: translateX(-100%);
	background-color: var(--nav-color);
	transition: transform 0.3s ease-in-out;

	&.open {
		transform: translateX(0);
	}

	.ka-menu-item {
		width: 100%;
		height: 45px;
		display: flex;
		padding: 0 0.5rem;
		align-items: center;

		span {
			margin: 0 5px;
		}

		&:hover {
			background-color: var(--nav-hover);
		}

		&:focus {
			color: var(--focus);
		}
	}

	@media (max-width: 640px) {
		width: 100%;
	}
}

.ka-footer {
	width: 100%;
	display: flex;
	margin: 1rem 0;
	align-items: center;
	flex-direction: column;
	justify-content: center;

	.searched {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.footer {
		margin: 1rem 0;
		width: 100%;
		display: flex;
		align-items: flex-end;
		flex-direction: column;
		justify-content: center;

		* {
			text-align: end;
		}
	}
}