header {
	border-bottom: 1px solid var(--border);
	.upper-header {
		display: flex;
		padding: 1rem 0;
		align-items: center;

		.upper-header-left,
		.upper-header-right {
			flex: 1;

			a:hover {
				color: var(--primary) !important;
			}
		}

		.upper-header-left {
			display: flex;
			justify-content: flex-start;
			a {
				text-decoration: none;
				color: var(--text);
				font-size: 2rem;
			}
		}

		.upper-header-right {
			display: flex;
			justify-content: flex-end;
			gap: 10px;

			.languages {
				display: flex;
				gap: 10px;
				align-items: center;
				justify-content: center;
				font-size: 0.9rem;
				font-weight: bold;

				a {
					color: var(--text);
					text-decoration: none;
				}
			}

			.actions {
				font-size: 2rem;
				a {
					color: var(--text);
				}
			}
		}
	}

	.menu-handler {
		ul {
			display: flex;
			margin: 0;
			padding: 0;
			display: flex;
			justify-content: space-between;

			li {
				list-style: none;

				&.default-button {
					background: none;

					a {
						background: var(--primary);
						display: flex;
					}
				}

				> a {
					padding: 1.5rem 1rem;
					display: block;
					text-decoration: none;
					text-transform: uppercase;
					font-size: 0.85rem;
					font-weight: 580;
					position: relative;

					&:after {
						content: "";
						position: absolute;
						bottom: 0;
						left: 1rem;
						right: 100%;
						height: 2px;
						background-color: var(--primary);
						transition: right 0.3s ease-in-out;
					}

					&:hover {
						&:after {
							right: 1rem;
						}
					}
				}
			}
		}
	}
}
