/* Genel Stil */
.blok {
	display: block;
	width: 325px;
	height: calc(100vh - 75px);
	margin-top: 10px;
	border-radius: 14px;
	overflow: hidden;
	transition: all 0.3s ease;
	overflow-y:auto ;
	
}

#wp_baslik {
	display: block;
	font-size: 20px;
	font-weight: bold;
	padding: 10px 0;
	background-color: black;
	text-align: center;
	border-color:rgba(38, 201, 255, 1);
	border-radius: 27px;
	color: rgba(38, 201, 255, 1);
	overflow: hidden;
	margin-top: 5px;
}

#wp_baslik.active {
	border-color: rgba(255, 0, 102, 1);
}

.kutu {
	background-color: rgba(60, 60, 60, 1);
	padding: 10px;
}

.kutucuk {
	display: flex;
	align-items: center;
	background-color: rgba(60, 60, 60, 1);
	color: white;

    margin-top:15px;
	padding: 10px;
	border: 5px solid rgba(111, 111, 111, 1);
	border-radius: 27px;
	font-size: 12px;
	text-decoration: none;
	transition: all 0.3s ease;
}

.kutucuk:hover {
	border-color: rgba(38, 201, 255, 1);
}

.kutucuk.active {
	border-color: rgba(255, 0, 102, 1);
}

.link-icon {
	width: 32px;
	height: 32px;
	margin-right: 7px;
	vertical-align: middle;
}

/* Mobil Menü için */
@media screen and (max-width: 768px) {
	.blok {
		position: fixed;
		width: 40px;
		height: 40px;
		background-color: rgba(60, 60, 60, 1);
		margin: 5px 0 0 5px;
		padding-bottom: 0;
		cursor: pointer;
		z-index: 9999;
		overflow-y:hidden ;
	}

	.blok::before {
		content: "o";
		color: white;
		display: block;
		text-align: center;
		font-size: 30px;
		padding-bottom: 5px;
	}

	.kutu,
	.kutucuk {
		visibility: hidden;
		opacity: 0;
		transform: translateY(10px);
		transition: all 0.3s ease;
	}

	.blok.active {
		width: 180px;
		min-width: 180px;
		height: 66vh;
		max-height: 66vh;
		padding: 4px;
		overflow-y: auto;
		margin-top: 2px;
	}

	.blok.active .kutu,
	.blok.active .kutucuk {
		visibility: visible;
		opacity: 1;
		transform: translateY(0);
	}

	.blok.active .kutucuk {
		width: auto;
		padding: 2px;
		margin: 2px 0 10px 0;
		font-size: 11px;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.blok.active::before {
		content: "✕";
		font-size: 20px;
	}

	#wp_baslik {
		font-size: 1em;
		padding: 5px;
		text-overflow: ellipsis;
	}
}