.main {
	width: 100vw;
	height: 100%;
	background-color: #1f2933;
	display: flex;
	justify-content: center;
	padding: 4rem 0rem;
}

.column {
	width: 80%;
	max-width: 1280px;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

#header {
	width: 100%;
	height: min-content;
	padding: 16px 24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	background-color: #151a1e;
	box-sizing: border-box;
	margin-bottom: 64px;
	position: relative;
}

#header > h1 {
	color: white;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
}

#header > h1 > span:nth-child(1) {
	color: #24ff00;
	cursor: pointer;
}

.project {
	width: 100%;
	min-height: 40vh;
}

#footer {
	width: 100%;
	height: 420px;
	background-color: #151a1e;
	display: flex;
	justify-content: space-between;
	padding: 48px 24px;
	box-sizing: border-box;
}

#footer > .write_us {
	display: flex;
	flex-direction: column;
	min-width: 45%;
	gap: 32px;
	box-sizing: border-box;
}

#footer > .write_us > .first input {
	background-color: transparent;
	border-radius: 5px;
	border: 1px solid #747474;
	height: 48px;
	width: 100%;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
	color: whitesmoke;
	padding-left: 10px;
	padding-right: 30px;
	position: relative;
}

#footer > .write_us > .first > input::placeholder {
	color: #747474;
}

#footer > .write_us > .first > textarea {
	background-color: transparent;
	border-radius: 5px;
	border: 1px solid #747474;
	color: whitesmoke;
	padding: 10px;
	height: 104px;
}

#footer > .write_us > .first > textarea::placeholder {
	color: #747474;
}

#footer > .write_us > .first {
	display: flex;
	flex-direction: column;
	gap: 32px;
}

#footer > .write_us > input[type="button"][value="send"] {
	background-color: #252b31;
	border-radius: 5px;
	color: whitesmoke;
	padding: 16px;
	border: none;
	box-sizing: border-box;
	min-height: 48px;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
	font-size: 16px;
}

.follow_us {
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.follow_us > .link1,
.follow_us > .link2,
.follow_us > .link3,
.follow_us > .link4 {
	display: flex;
	align-items: center;
	gap: 16px;
}

.follow_us > .link1 > .icon {
	width: 48px;
	height: 48px;
	background-image: url("../assets/youtube.svg");
	background-size: cover;
}

.follow_us > .link2 > .icon {
	width: 48px;
	height: 48px;
	background-image: url("../assets/instagram.svg");
	background-size: cover;
}

.follow_us > .link3 > .icon {
	width: 48px;
	height: 48px;
	background-image: url("../assets/facebook.svg");
	background-size: cover;
}

.follow_us > .link4 > .icon {
	width: 48px;
	height: 48px;
	background-image: url("../assets/x.svg");
	background-size: cover;
}

.downloads > .link1,
.downloads > .link2 {
	display: flex;
	align-items: center;
	gap: 16px;
}

.downloads > .link1 > .icon {
	width: 48px;
	height: 48px;
	background-image: url("../assets/google.svg");
	background-size: cover;
}

.downloads > .link2 > .icon {
	width: 48px;
	height: 48px;
	background-image: url("../assets/apple.svg");
	background-size: cover;
}

.downloads {
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.downloads .texts {
	display: flex;
	flex-direction: column;
	gap: 5px;
	justify-content: center;
	min-height: 48px;
}

.downloads > .texts > h3 {
	font-size: 10px;
	font-weight: 300;
}

#project {
	width: 100%;
}

.project_header {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: end;
	padding-bottom: 24px;
	border-bottom: 1px solid #41414a;
}

.project_header > .icon_title {
	display: flex;
	height: 100%;
	gap: 16px;
}

.project_header > .icon_title > .icon {
	width: 64px;
	height: 64px;
	background-image: url("../assets/app_icon.svg");
	background-size: cover;
}

.project_header > .icon_title > .avatar_icon {
	width: 64px;
	height: 64px;
	background-image: url("../assets/avatar.png");
	background-size: cover;
}

.project_header > .icon_title > .titles {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	font-size: 1.2rem;
}

.project_header > .icon_title > .titles > .tags {
	display: flex;
	gap: 16px;
}

.tags div {
	font-size: 1rem;
	padding: 10px 18px;
	border-radius: 3px;
}

.tags div:nth-child(1) {
	background-color: #7811c9;
}

.tags div:nth-child(2) {
	background-color: #c97411;
}

#project,
#profile {
	display: flex;
	flex-direction: column;
	gap: 64px;
	margin-bottom: 64px;
}

#project > div:last-child {
	margin-bottom: 24px;
}

.privacy .tag {
	padding: 10px 24px;
	border-radius: 3px;
	background-color: #484848;
}

#project .introductory,
#project .screenshots,
#project .videos,
#profile .General_Settings {
	display: flex;
	flex-direction: column;
	gap: 20px;
	color: #efefef;
}

#project .introductory h3 {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5; /* Satır yüksekliği ayarla */
	max-height: 4em; /* Maksimum 2 satır */
	overflow: hidden; /* Taşan içeriği kes */
	text-overflow: ellipsis; /* Taşan metni üç nokta ile göster */
	white-space: normal; /* Metni normal bir şekilde işle */
}

.video_swiper .swiper-slide {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.video_swiper .swiper-slide > .title_min {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.video_swiper .swiper-slide > .title_min > h4 {
	font-size: 0.8rem;
	font-weight: 300;
}

.hamburger {
	display: none;
}
#privacy_policy h1 {
	font-size: 1.2rem;
	font-weight: bold;
	margin-bottom: 1rem;
}

#privacy_policy h2 {
	font-size: 1rem;
	font-weight: bold;
	margin-bottom: 0.8rem;
}

#privacy_policy h3,
h4 {
	font-size: 0.8rem;
	font-weight: bold;
	margin-bottom: 0.6rem;
}

#privacy_policy p {
	font-size: 0.8rem;
	font-weight: 300;
	margin-bottom: 1rem;
	color: #e5e5e5;
}

#privacy_policy,
#privacy_policy .project_header {
	margin-bottom: 4rem;
}

.login {
	color: #24ff00;
	cursor: pointer;
}
.logout {
	color: #ff2400;
	cursor: pointer;
}
#login,
#register,
#password_reset {
	display: flex;
	justify-content: center;
	align-items: center;
}

.loginX {
	display: flex;
	flex-direction: column;
	width: 40%;
	height: 450px;
	border: 5px solid #171717;
	border-radius: 5px;
	background-color: #29292d;
	margin-bottom: 6rem;
	align-items: center;
	justify-content: space-evenly;
	min-width: 340px;
}

.loginX .login_inputs {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	width: 100%;
	align-items: center;
}

.loginX .login_inputs input {
	font-size: 1rem;
	padding: 0.8rem;
	border: 1.2px solid #181818;
	width: 75%;
	box-sizing: border-box;
	font-family: "Courier New", Courier, monospace;
}

.loginX .login_inputs input:not([type="button"]) {
	color: white;
	background-color: #101012;
}

.loginX .login_inputs input[type="button"] {
	cursor: pointer;
	font-weight: bold;
	background-color: #181818;
	color: #24ff00;
	border: 1.2px solid #2f2f2f;
}

.settings_list {
	list-style-type: none;
	padding: 0;
	margin: 0;
	width: 100%;
}

.settings_list li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: 42px;
	border-bottom: 1px solid #48484e; /* Opsiyonel: Ayırıcı çizgi */
	padding: 10px; /* Opsiyonel: İç boşluk */
}

.settings_list .title {
	flex-grow: 1;
}

.settings_list .action-btn {
	flex-shrink: 0;
}

.settings_list {
	font-weight: 400;
}

.switch {
	position: relative;
	display: inline-block;
	width: 54px;
	height: 28px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	transition: 0.4s;
	border-radius: 34px;
}

.slider:before {
	position: absolute;
	content: "";
	height: 20px;
	width: 20px;
	left: 4px;
	bottom: 4px;
	background-color: black;
	transition: 0.4s;
	border-radius: 50%;
}

input[value="Delete Account"] {
	background-color: red;
	color: white;
	border: none;
	font-size: 1rem;
	padding: 8px 16px;
}
input[value="Delete Account"]:disabled {
	background: #afaeae;
}
input:checked + .slider {
	background-color: #24ff00;
}

input:checked + .slider:before {
	transform: translateX(26px);
}

.error-message {
	color: red;
	display: none;
}

.success-message {
	color: #24ff00;
	display: none;
}

.pointer {
	cursor: pointer;
}

.pointer:hover {
	font-weight: bold;
}

.gotostyle:hover {
	cursor: pointer;
}
.mail_container {
	position: relative;
	display: flex;
	width: 100%;
}
.d-none {
	display: none;
}

.mail_valid_icon {
	width: 24px;
	height: 24px;
	position: absolute;
	right: 1.2rem;
	top: 50%;
	transform: translateY(-50%);
}

.mail_valid_icon.tick {
	transition: 0.3s;
	background-image: url("../assets/tick.svg");
}
.mail_valid_icon.error {
	transition: 0.3s;
	background-image: url("../assets/error.svg");
}
#write_us_button {
	width: 100%;
	padding: 10px;
	background-color: #ccc;
	color: white;
	border: none;
	border-radius: 5px;
	cursor: not-allowed;
}
#write_us_button.enabled {
	background-color: #24ff00 !important;
	color: #171717 !important;
	cursor: pointer;
}
#write_us_button:hover.enabled {
	background-color: #249f11 !important;
}

.d_on {
	display: flex !important;
}

.d_off {
	display: none !important;
}

.header_title {
	cursor: pointer;
	position: relative;
}

.custom_dropdown {
	position: absolute;
	display: none;
	top: 0;
	background-color: #151a1e;
	width: auto;
	height: auto;
	top: 105%;
	left: 0%;
}

.custom_dropdown_item,
.custom_sub_menu_list li {
	padding: 0.75rem 0.75rem 0.75rem 1.25rem;
	display: flex;
	justify-content: space-between;
	min-width: 6rem;
	gap: 0px 12px;
	align-items: center;
}

.custom_dropdown_item:hover,
.custom_sub_menu_list li:hover {
	background-color: #2c3946;
}

.custom_dropdown_item:not(:last-child),
.custom_sub_menu_list li {
	border-bottom: 2px solid #27323e;
}

.custom_sub_menu {
	display: none;
	position: absolute;
	background-color: #151a1e;
	width: auto;
	height: auto;
	top: 0%;
	left: 102%;
}

.custom_sub_menu_list li img {
	width: 16px;
	height: 16px;
}

.custom_sub_menu#sub2 {
	top: 34.5%;
}

@media only screen and (max-width: 1200px) {
	.column {
		width: 90%;
	}
	#footer .follow_us {
		align-items: center;
	}
	#footer .follow_us > div > h2 {
		display: none;
	}
	#footer .downloads > div > h2 {
		max-width: 100px;
	}
	#footer .downloads > .texts {
		max-width: 120px;
		gap: 24px;
	}
}

@media only screen and (max-width: 768px) {
	.main {
		box-sizing: border-box;
		padding: 0rem;
	}
	.column {
		width: 100%;
	}
	#project,
	#privacy_policy {
		padding: 0rem 1.2rem;
		box-sizing: border-box;
	}
	#footer {
		flex-direction: column;
		gap: 36px;
		height: auto;
	}
	#footer div {
		flex-direction: row;
		align-items: center;
	}
	#footer h1 {
		display: none;
	}
	.downloads,
	.downloads div {
		gap: unset;
	}

	.downloads .texts {
		display: none;
	}

	#footer .write_us {
		order: 3;
	}
	#footer .follow_us {
		order: 1;
		gap: unset;
		justify-content: space-between;
	}
	#footer .downloads {
		justify-content: space-between;
		order: 2;
	}
	.first {
		width: 100%;
	}
	.first * {
		width: 100%;
	}
	.write_us {
		width: 100%;
	}
	.write_us * {
		width: 100%;
	}
	#footer > .write_us > .first * {
		box-sizing: border-box;
	}
	.project_header {
		flex-direction: column;
		gap: 16px;
		margin-bottom: 5px;
	}
	.project_header .privacy {
		width: 100%;
		text-align: center;
	}
	.project_header > .icon_title {
		width: 100%;
	}
	.tags div {
		padding: 10px 10px;
		font-size: 0.8rem;
	}
}

