@use './assets/styles/variables' as *;

.container {
	max-width: 1200px;
	margin: 0 auto;
}

/* HEADER */

.header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid gainsboro;
	padding: 30px 0;

	h2 {
		font-size: 24px;
	}

	ul {
		list-style: none;
		display: flex;
		gap: 48px;

		a {
			color: black;
			text-decoration: none;
			font-size: 16px;
			cursor: pointer;
		}
	}

	.search {
		display: flex;
		align-items: center;
		background-color: #f5f5f5;
		padding: 7px 12px;
		gap: 35px;

		input {
			outline: 0;
			border: 0;
			background-color: #f5f5f5;
			font-size: 12px;
		}

		img {
			cursor: pointer;
		}
	}

	.buttons {
		display: flex;
		gap: 16px;

		button {
			background: none;
			outline: 0;
			border: 0;
			cursor: pointer;
		}
	}
}